fixed dialog width for micro screens

This commit is contained in:
Fedor Katurov 2020-01-24 17:18:46 +07:00
parent 3ffba24994
commit 460440ea24

View file

@ -48,7 +48,7 @@
touch-action: none; touch-action: none;
transition: transform 0.25s, opacity 0.25s; transition: transform 0.25s, opacity 0.25s;
z-index: -1; z-index: -1;
&.active { &.active {
opacity: 1; opacity: 1;
transform: translate(0, 0); transform: translate(0, 0);
@ -126,7 +126,8 @@
} }
} }
&.disabled, &.inactive { &.disabled,
&.inactive {
color: #999999; color: #999999;
svg { svg {
@ -221,7 +222,8 @@
} }
} }
.panel button, .tooltip-container { .panel button,
.tooltip-container {
position: relative; position: relative;
&:hover .panel-tooltip { &:hover .panel-tooltip {
@ -284,15 +286,20 @@
width: 100%; width: 100%;
max-width: 500px; max-width: 500px;
} }
&.top { &.top {
bottom: auto; bottom: auto;
top: 52px; top: 52px;
} }
&.left, &__left { &.left,
&__left {
right: auto; right: auto;
left: 10px; left: 10px;
@media (max-width: @micro_breakpoint) {
left: 68px;
}
} }
.helper:first-child { .helper:first-child {
@ -310,16 +317,28 @@
&__big { &__big {
width: calc(100% - 20px); width: calc(100% - 20px);
max-width: 620px; max-width: 620px;
@media (max-width: @micro_breakpoint) {
width: calc(100% - 78px);
}
} }
&__medium { &__medium {
width: calc(100% - 20px); width: calc(100% - 20px);
max-width: 417px; max-width: 417px;
@media (max-width: @micro_breakpoint) {
width: calc(100% - 78px);
}
} }
&__small { &__small {
width: calc(100% - 20px); width: calc(100% - 20px);
max-width: 324px; max-width: 324px;
@media (max-width: @micro_breakpoint) {
width: calc(100% - 78px);
}
} }
} }
@ -404,7 +423,7 @@
border: none; border: none;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
svg { svg {
margin-right: 0; margin-right: 0;
} }
@ -695,7 +714,7 @@
opacity: 0; opacity: 0;
align-items: flex-start; align-items: flex-start;
@media(max-width: @mobile_breakpoint) { @media (max-width: @mobile_breakpoint) {
display: none; display: none;
} }
@ -766,10 +785,10 @@
position: fixed; position: fixed;
bottom: 53px; bottom: 53px;
left: 10px; left: 10px;
width: 272px width: 272px;
} }
.nominatim-search-input { .nominatim-search-input {
padding-left: 10px; padding-left: 10px;
flex: 1; flex: 1;
} }