style(capture options): Adapt for mobile landscape ratio

This commit is contained in:
Tixie 2019-04-07 03:04:34 +02:00
parent 615dd875ce
commit 4844a4a28b
3 changed files with 22 additions and 5 deletions

View file

@ -92,7 +92,7 @@
}
.options__panel.active {
transform: translateY(0);
transform: translate(0);
}
.option__panelOption,

View file

@ -98,14 +98,15 @@
.capture-switch,
.capture-switch:visited {
position: absolute;
top: calc(50% - 3rem);
top: calc(50% - 2.5rem);
right: 0;
display: block;
padding: 1rem;
border: none;
border-radius: 0;
background-color: transparent;
color: #fff;
line-height: 1;
line-height: 0;
}
.capture-switch svg {

View file

@ -47,7 +47,6 @@
flex-direction: row;
margin-top: auto;
margin-bottom: auto;
padding-left: 2rem;
}
.capture-progress {
@ -64,7 +63,7 @@
.capture-switch:visited {
position: absolute;
top: 0;
right: calc(50% - 3rem);
right: calc(50% - 2.5rem);
}
/* Options
@ -88,6 +87,23 @@
margin-bottom: .5rem;
}
/* Option panel */
.options__panel {
top: 0;
right: 1rem;
bottom: 0;
left: 1rem;
flex-direction: column;
width: auto;
transform: translateX(-12rem) translateY(0);
}
.option__panelOption {
width: 100%;
height: 50%;
}
/* Progress bar
-------------------------------------------------------------- */