2206
редагувань
MediaWiki:Common.css: відмінності між версіями
modern search input — pill, soft fill, focus glow
Admin (обговорення | внесок) (wordmark 26→24px, weight 800→700) |
Admin (обговорення | внесок) (modern search input — pill, soft fill, focus glow) |
||
| Рядок 152: | Рядок 152: | ||
margin-top: 3px; | margin-top: 3px; | ||
white-space: nowrap; | white-space: nowrap; | ||
} | |||
/* Modern search input — pill shape, soft fill, focus glow */ | |||
#searchform.cdx-search-input { | |||
border-radius: 999px !important; | |||
background: #f4f6fa !important; | |||
border: 1px solid transparent !important; | |||
box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04); | |||
transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; | |||
overflow: hidden; | |||
padding: 0 !important; | |||
} | |||
#searchform.cdx-search-input:hover { | |||
background: #eef1f7 !important; | |||
} | |||
#searchform.cdx-search-input:focus-within { | |||
background: #ffffff !important; | |||
border-color: #4b78d6 !important; | |||
box-shadow: 0 0 0 3px rgba(75, 120, 214, 0.15); | |||
} | |||
#searchform .cdx-text-input { | |||
border: none !important; | |||
background: transparent !important; | |||
} | |||
#searchform .cdx-text-input__input { | |||
background: transparent !important; | |||
border: none !important; | |||
box-shadow: none !important; | |||
height: 38px !important; | |||
padding: 0 16px 0 38px !important; | |||
font-size: 14px !important; | |||
color: #1a2240 !important; | |||
} | |||
#searchform .cdx-text-input__input::placeholder { | |||
color: #8b95ad !important; | |||
font-weight: 400; | |||
} | |||
#searchform .cdx-text-input__start-icon { | |||
left: 12px !important; | |||
opacity: 0.55; | |||
} | |||
#searchform .cdx-search-input__end-button { | |||
border-radius: 999px !important; | |||
background: #1a2240 !important; | |||
color: #ffffff !important; | |||
border: none !important; | |||
padding: 0 18px !important; | |||
height: 38px !important; | |||
margin: 0 !important; | |||
font-weight: 600 !important; | |||
font-size: 13px !important; | |||
letter-spacing: 0.01em; | |||
cursor: pointer; | |||
transition: background 0.2s ease; | |||
} | |||
#searchform .cdx-search-input__end-button:hover { | |||
background: #2a3360 !important; | |||
} | } | ||