From b052f741d935abd2f51423abf3fcda9157844b5c Mon Sep 17 00:00:00 2001 From: "netop://ウィビ" Date: Sat, 11 Apr 2026 14:42:43 -0700 Subject: initial commit --- sass/uchu/_form.scss | 77 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 77 insertions(+) create mode 100644 sass/uchu/_form.scss (limited to 'sass/uchu/_form.scss') diff --git a/sass/uchu/_form.scss b/sass/uchu/_form.scss new file mode 100644 index 0000000..e8d3194 --- /dev/null +++ b/sass/uchu/_form.scss @@ -0,0 +1,77 @@ +fieldset { + position: relative; + + button { + margin-top: 1rem; padding: 0.5rem calc(0.75rem + 2px); + + border: none; + display: block; + text-transform: lowercase; + + &:not(:disabled) { + background-color: var(--uchu-gray-9); + color: var(--uchu-gray-2); + cursor: pointer; + } + + &:disabled { + background-color: var(--uchu-gray-2); + color: var(--uchu-gray-6); + cursor: not-allowed; + } + } + + label { + color: var(--uchu-gray-5); + font-size: 80%; + position: absolute; + padding-top: 4px; + padding-left: calc(0.75rem + 2px); + text-transform: lowercase; + + + input, + + select { + background-color: var(--uchu-gray-2); + border: 2px solid; + transition: border-color 0.2s; + width: 400px; + + @media (prefers-reduced-motion: reduce) { + transition: none; + } + + &::placeholder { + color: var(--uchu-gray-5); + opacity: 1; + } + + &:not(:focus) { + border-color: var(--uchu-gray-2); + } + + &:focus { + border-color: var(--uchu-blue-4); + box-shadow: none; + outline: none; + } + } + + + select { + background-image: url("/media/svg/caret-down.svg"); + background-position: right 1rem bottom 0.7rem; + background-repeat: no-repeat; + background-size: 1rem; + padding: 1.5rem 0.75rem 0.5rem 0.5rem; + } + + + input { + padding: 1.5rem 0.75rem 0.5rem 0.75rem; + + &:invalid { + border-color: var(--uchu-red-5); + box-shadow: none; + outline: none; + } + } + } +} -- cgit v1.2.3