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 { .options__panel.active {
transform: translateY(0); transform: translate(0);
} }
.option__panelOption, .option__panelOption,

View file

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

View file

@ -47,7 +47,6 @@
flex-direction: row; flex-direction: row;
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
padding-left: 2rem;
} }
.capture-progress { .capture-progress {
@ -64,7 +63,7 @@
.capture-switch:visited { .capture-switch:visited {
position: absolute; position: absolute;
top: 0; top: 0;
right: calc(50% - 3rem); right: calc(50% - 2.5rem);
} }
/* Options /* Options
@ -88,6 +87,23 @@
margin-bottom: .5rem; 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 /* Progress bar
-------------------------------------------------------------- */ -------------------------------------------------------------- */