MediaWiki:Common.css: Difference between revisions
No edit summary |
Fix mobile find-a-soldier input height |
||
| Line 196: | Line 196: | ||
} | } | ||
/* Find-a-soldier: | /* Find-a-soldier: compact field on phones (never a tall flex-grown square) */ | ||
.skin-minerva .home-find { | .skin-minerva .home-find { | ||
max-width: 22em !important; | max-width: 22em !important; | ||
| Line 205: | Line 205: | ||
} | } | ||
.skin-minerva .home-find-row { | .skin-minerva .home-find-row { | ||
display: flex; | display: flex !important; | ||
flex-wrap: | flex-direction: row !important; | ||
flex-wrap: nowrap !important; | |||
gap: 0.4em; | gap: 0.4em; | ||
align-items: center; | align-items: center !important; | ||
} | } | ||
.skin-minerva .home-find-suggest-wrap { | .skin-minerva .home-find-suggest-wrap { | ||
flex: 1 1 auto; | flex: 1 1 auto; | ||
min-width: 0; | min-width: 0; | ||
max-width: | max-width: none; | ||
width: 100%; | |||
} | } | ||
.skin-minerva .home-find-input, | .skin-minerva .home-find-input, | ||
| Line 220: | Line 222: | ||
.skin-minerva .home-find input[type="search"], | .skin-minerva .home-find input[type="search"], | ||
.skin-minerva .home-find input[type="text"] { | .skin-minerva .home-find input[type="text"] { | ||
flex: 1 1 auto !important; | |||
width: auto !important; | |||
min-width: 0 !important; | min-width: 0 !important; | ||
max-width: none !important; | |||
box-sizing: border-box; | height: 2.25em !important; | ||
min-height: 2.25em !important; | |||
max-height: 2.5em !important; | |||
padding: 0.25em 0.5em !important; | |||
line-height: 1.2 !important; | |||
font-size: 16px !important; /* avoid iOS zoom-on-focus */ | |||
box-sizing: border-box !important; | |||
} | } | ||
.skin-minerva .home-find-button { | .skin-minerva .home-find-button { | ||
flex: 0 0 auto; | flex: 0 0 auto !important; | ||
height: 2.25em !important; | |||
min-height: 2.25em !important; | |||
padding: 0 0.85em !important; | |||
margin-top: 0 !important; | |||
box-sizing: border-box !important; | |||
} | } | ||
| Line 680: | Line 693: | ||
margin: 0 0 1em 0; | margin: 0 0 1em 0; | ||
} | } | ||
/* Keep input + Search on one row. Column + flex-basis:14em made the | |||
search field a ~14em-tall square on phones (Minerva / narrow Vector). */ | |||
.home-find-row { | .home-find-row { | ||
flex-direction: | flex-direction: row; | ||
align-items: | flex-wrap: nowrap; | ||
align-items: center; | |||
} | } | ||
.home-find-input | .home-find-input { | ||
flex: 1 1 auto; | |||
width: auto; | |||
min-width: 0; | |||
max-width: none; | |||
height: 2.25em; | |||
min-height: 2.25em; | |||
max-height: 2.5em; | |||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
.home-find-button { | .home-find-button { | ||
margin-top: 0 | flex: 0 0 auto; | ||
width: auto; | |||
height: 2.25em; | |||
min-height: 2.25em; | |||
margin-top: 0; | |||
box-sizing: border-box; | |||
} | } | ||
.soldier-facts-box, | .soldier-facts-box, | ||