X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/13d650e2dcbe2467a82253097e10d58dddf9d9d2..297d05c63b742ff3e851f4d2514fe0043f57a29e:/app/assets/stylesheets/small.scss diff --git a/app/assets/stylesheets/small.scss b/app/assets/stylesheets/small.scss index 950e1214d..2247b4bbe 100644 --- a/app/assets/stylesheets/small.scss +++ b/app/assets/stylesheets/small.scss @@ -2,191 +2,121 @@ /* Styles specific to a small screen, such as iPhone, Android, etc... */ -input[type="submit"], -input[type="text"] { - -webkit-appearance: none; -} - -.column-1 { - width: 100%; -} - -#menu-icon { - display: inline-block !important; -} - -nav.primary, -nav.secondary { - float: none !important; - position: relative; - display: block; - clear: both; -} - -header { - height: auto; - min-height: $headerHeight; - background: #fff; - - h1 { - padding-bottom: 15px; +body.small-nav { + #menu-icon { + display: inline-block !important; } - &.closed nav { - display: none; - } - - .search_forms { + nav.primary, + nav.secondary { + float: none !important; + position: relative; display: block; + clear: both; } -} - -#sidebar .search_forms, -#edit_tab, -#export_tab { - display: none; -} -nav.primary { - padding: 0; + header { + height: auto; + min-height: $headerHeight; + background: #fff; - ul, li { - border: none; - border-radius: 0; - width: 100%; - } - - ul { - border-top: 1px solid #eee; - li { - border-bottom: 1px solid #eee; - border-right: none; - > a { - border-radius: 0; - width: 100%; - text-align: center; - font-size: 15px; - } + &.closed nav { + display: none; } - } -} -nav.secondary { - border-bottom: 1px solid #eee; - - .user-menu { - display: block; - width: 100%; - margin-left: 0; - > li { - width: 49%; - > a { - width: 100%; - text-align: center; - } + .search_forms { + display: block; } } -} -#compact-secondary-nav { - display: none; -} + #sidebar .search_forms, + #edit_tab, + #export_tab { + display: none; + } -.compact-hide { - display: inline-block; -} + nav.primary { + padding: 0; -.map-layout { - #sidebar, #map { - position: relative; - overflow-x: hidden; - width: 100%; - height: 50%; - } + ul, li { + border: none; + border-radius: 0; + width: 100%; + } - .overlay-sidebar { - #sidebar { - width: 300px; + ul { + border-top: 1px solid #eee; + li { + border-bottom: 1px solid #eee; + border-right: none; + > a { + border-radius: 0; + width: 100%; + text-align: center; + font-size: 15px; + } + } } - #map { - height: 100%; + .btn-group { + width: 100%; + padding: 10px; } } - #map-ui { - z-index: 9999; - width: 100%; - overflow-y: scroll; + nav.secondary { + .user-menu { + width: 100%; + } } -} - -#sidebar .welcome { - display: none !important; -} - -.leaflet-top.leaflet-right { - top: 10px !important; - z-index: 0; -} - -.content_map { - width: 100%; - border: none; - float: none; - height: 200px; - max-height: none; - min-height: auto; -} -/* Rules for the login form */ - -#login_login input#user_email { - width: 100%; - max-width: 18em; -} - -#login_login input#user_password { - width: 100%; - max-width: 18em; -} + #compact-secondary-nav { + display: none; + } -#login_login input#openid_url { - width: 100%; - max-width: 18em; -} + .compact-hide { + display: inline-block; + } -#login_openid_buttons td { - padding: 2px; -} + .overlay-sidebar #sidebar .welcome.visible { + display: none; + } -/* Rules for the user view */ + .overlay-sidebar #sidebar #banner { + display: none; + } -.user_map { - width: 100% !important; - height: 300px !important; + .leaflet-top.leaflet-right { + top: 10px !important; + } } -#userinformation .deemphasize { - position: relative; - right: auto; left: auto; - margin-top: 10px; - top: auto; -} +@media (max-width: 767.98px) { + body.map-layout { + #sidebar, #map { + position: relative; + overflow-x: hidden; + width: 100%; + height: 50%; + } -/* Rules for the sign-up page */ + .overlay-sidebar { + #sidebar { + position: absolute; + width: 350px; + height: auto; + overflow: hidden; + } -.user-new, -.user-create { - .col6 { - width: 100%; - } + #map { + height: 100%; + } + } - .aside { - display: none; + #map-ui { + z-index: 9999; + width: 100%; + overflow-y: scroll; + } } } - -.site-about #content .attr h1 { - font-size: 28px; -}