chg: [front] Improved UI for small screens
This commit is contained in:
parent
87401f7ac0
commit
f4f67656ad
2 changed files with 4 additions and 3 deletions
|
@ -43,8 +43,8 @@ body {
|
||||||
@apply 3xl:container mx-auto;
|
@apply 3xl:container mx-auto;
|
||||||
@apply mx-auto;
|
@apply mx-auto;
|
||||||
@apply mt-4;
|
@apply mt-4;
|
||||||
@apply 3xl:w-11/12;
|
@apply lg:w-11/12;
|
||||||
@apply lg:w-5/6;
|
@apply 3xl:w-5/6;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
|
@ -38,13 +38,14 @@
|
||||||
v-for="(exercise, exercise_index) in exercises"
|
v-for="(exercise, exercise_index) in exercises"
|
||||||
:key="exercise.name"
|
:key="exercise.name"
|
||||||
>
|
>
|
||||||
<div :class="fullscreen_panel === false ? 'relative' : ''">
|
<div :class="fullscreen_panel === false ? 'relative min-w-fit' : ''">
|
||||||
<span
|
<span
|
||||||
v-show="fullscreen_panel === false || fullscreen_panel === exercise_index"
|
v-show="fullscreen_panel === false || fullscreen_panel === exercise_index"
|
||||||
:class="['inline-block absolute shadow-lg z-50', fullscreen_panel === false ? 'top-0 -right-7' : 'top-2 right-2']"
|
:class="['inline-block absolute shadow-lg z-50', fullscreen_panel === false ? 'top-0 -right-7' : 'top-2 right-2']"
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
@click="toggleFullScreen(exercise_index)"
|
@click="toggleFullScreen(exercise_index)"
|
||||||
|
title="Toggle fullscreen mode"
|
||||||
:class="`
|
:class="`
|
||||||
w-7 p-1 focus-outline font-semibold
|
w-7 p-1 focus-outline font-semibold
|
||||||
text-slate-800 bg-slate-100 hover:bg-slate-200 dark:text-slate-200 dark:bg-slate-800 dark:hover:bg-slate-900
|
text-slate-800 bg-slate-100 hover:bg-slate-200 dark:text-slate-200 dark:bg-slate-800 dark:hover:bg-slate-900
|
||||||
|
|
Loading…
Reference in a new issue