muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 11:06:40 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

mobile: first mobile ui attempts

Browse source
This commit is contained in:
muerwre 2018-12-07 15:38:26 +07:00
parent a6966fd651
commit 0941ff1ee8
8 changed files with 74 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

46
src/styles/panel.less
View file

@ -153,12 +153,23 @@
background: #222222;
}
.panel-user {
z-index: 1;
@media (max-width: @mobile_breakpoint) {
flex-direction: column-reverse;
.control-sep {
opacity: 0;
height: 10px;
}
}
}
.control-dialog {
background: rgba(30, 30, 30, 0.95);
position: absolute;
right: 10px;
bottom: 68px;
border-radius: @panel_radius;
z-index: 3;
color: white;
box-sizing: border-box;
@ -172,15 +183,38 @@
&.control-dialog-big {
min-width: 555px;
@media (max-width: @mobile_breakpoint) {
min-width: 100%;
max-width: 100%;
width: 100% !important;
left: 0;
padding: 0 10px;
}
}
&.control-dialog-medium {
min-width: 460px;
@media (max-width: @mobile_breakpoint) {
min-width: 100%;
max-width: 100%;
width: 100% !important;
left: 0;
padding: 0 10px;
}
}
}
.control-dialog-provider {
width: 500px;
@media (max-width: @mobile_breakpoint) {
width: 100%;
left: 0;
padding: 0 10px;
}
}
.helper {
@ -189,6 +223,10 @@
font-weight: 200;
font-size: 1em;
display: flex;
background: #222222;
border-radius: @panel_radius;
box-shadow: @bar_shadow;
}
@ -387,6 +425,10 @@
&.top-control {
width: 150px;
justify-content: flex-start;
@media (max-width: @mobile_breakpoint) {
width: 100px;
}
}
svg {