cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

css layout change only in content block

Browse source
This commit is contained in:
Anton Melnichuk 2020-02-27 10:29:37 +02:00
parent 009a4dbb67
commit b9c2829e75
1 changed files with 153 additions and 154 deletions
Download patch file Download diff file Expand all files Collapse all files

307
app/assets/stylesheets/small.scss
View file

@ -1,187 +1,186 @@
@import "parameters";
/* Styles specific to a small screen, such as iPhone, Android, etc... */
@media (max-width: 640px) {
body {
input[type="submit"],
input[type="text"] {
-webkit-appearance: none;
body.small {
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;
}
.column-1 {
width: 100%;
&.closed nav {
display: none;
}
#menu-icon {
display: inline-block !important;
}
nav.primary,
nav.secondary {
float: none !important;
position: relative;
.search_forms {
display: block;
clear: both;
}
}
header {
height: auto;
min-height: $headerHeight;
background: #fff;
#sidebar .search_forms,
#edit_tab,
#export_tab {
display: none;
}
h1 {
padding-bottom: 15px;
}
nav.primary {
padding: 0;
&.closed nav {
display: none;
}
.search_forms {
display: block;
}
}
#sidebar .search_forms,
#edit_tab,
#export_tab {
display: none;
}
nav.primary {
padding: 0;
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;
}
}
}
.btn-group {
width: 100%;
padding: 10px;
}
}
nav.secondary {
.user-menu {
width: 100%;
}
}
#compact-secondary-nav {
display: none;
}
.compact-hide {
display: inline-block;
}
&.map-layout {
#sidebar, #map {
position: relative;
overflow-x: hidden;
width: 100%;
height: 50%;
}
.overlay-sidebar {
#sidebar {
position: absolute;
width: 300px;
height: auto;
overflow: hidden;
}
#map {
height: 100%;
}
}
#map-ui {
z-index: 9999;
width: 100%;
overflow-y: scroll;
}
}
.overlay-sidebar #sidebar .welcome.visible {
display: none;
}
.overlay-sidebar #sidebar #banner {
display: none;
}
.leaflet-top.leaflet-right {
top: 10px !important;
}
.content_map {
width: 100%;
ul, li {
border: none;
float: none;
height: 200px;
max-height: none;
min-height: auto;
}
/* Rules for the login form */
#login_login input#user_email {
border-radius: 0;
width: 100%;
max-width: 18em;
}
#login_login input#user_password {
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;
}
}
}
.btn-group {
width: 100%;
max-width: 18em;
padding: 10px;
}
}
#login_login input#openid_url {
nav.secondary {
.user-menu {
width: 100%;
max-width: 18em;
}
}
#login_openid_buttons td {
padding: 2px;
}
#compact-secondary-nav {
display: none;
}
/* Rules for the user view */
.compact-hide {
display: inline-block;
}
.user_map {
width: 100% !important;
height: 300px !important;
}
#userinformation .deemphasize {
.overlay-sidebar #sidebar .welcome.visible {
display: none;
}
.overlay-sidebar #sidebar #banner {
display: none;
}
.leaflet-top.leaflet-right {
top: 10px !important;
}
.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;
}
#login_login input#openid_url {
width: 100%;
max-width: 18em;
}
#login_openid_buttons td {
padding: 2px;
}
/* Rules for the user view */
.user_map {
width: 100% !important;
height: 300px !important;
}
#userinformation .deemphasize {
position: relative;
right: auto; left: auto;
margin-top: 10px;
top: auto;
}
&.site-about #content .attr h1 {
font-size: 28px;
}
}
@media (max-width: 767.98px) {
body.map-layout {
#sidebar, #map {
position: relative;
right: auto;
left: auto;
margin-top: 10px;
top: auto;
overflow-x: hidden;
width: 100%;
height: 50%;
}
&.site-about #content .attr h1 {
font-size: 28px;
.overlay-sidebar {
#sidebar {
position: absolute;
width: 300px;
height: auto;
overflow: hidden;
}
#map {
height: 100%;
}
}
#map-ui {
z-index: 9999;
width: 100%;
overflow-y: scroll;
}
}
}