_Bastler/partey_workadventure
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #1131 from thecodingmachine/safari-fix

Browse Source 
Fix broken layout on EnableCameraScene on mobile
This commit is contained in:
David Négrier 2021-06-08 10:28:38 +02:00 committed by GitHub
commit 0c38f3b55c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
front/src/Components/EnableCamera/EnableCameraScene.svelte
View File

@ -93,7 +93,7 @@
{#if $cameraListStore.length > 1 } {#if $cameraListStore.length > 1 }
<div class="control-group"> <div class="control-group">
<img src={cinemaImg} alt="Camera" /> <img src={cinemaImg} alt="Camera" />
<div class="nes-select"> <div class="nes-select is-dark">
<select bind:value={selectedCamera} on:change={selectCamera}> <select bind:value={selectedCamera} on:change={selectCamera}>
{#each $cameraListStore as camera} {#each $cameraListStore as camera}
<option value={camera.deviceId}> <option value={camera.deviceId}>
@ -108,7 +108,7 @@
{#if $microphoneListStore.length > 1 } {#if $microphoneListStore.length > 1 }
<div class="control-group"> <div class="control-group">
<img src={microphoneImg} alt="Microphone" /> <img src={microphoneImg} alt="Microphone" />
<div class="nes-select"> <div class="nes-select is-dark">
<select bind:value={selectedMicrophone} on:change={selectMicrophone}> <select bind:value={selectedMicrophone} on:change={selectMicrophone}>
{#each $microphoneListStore as microphone} {#each $microphoneListStore as microphone}
<option value={microphone.deviceId}> <option value={microphone.deviceId}>
@ -136,7 +136,7 @@
margin-top: 3vh; margin-top: 3vh;
margin-bottom: 3vh; margin-bottom: 3vh;
min-height: 10vh; min-height: 10vh;
width: 50%; width: 50vw;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
@ -144,12 +144,12 @@
font-family: "Press Start 2P"; font-family: "Press Start 2P";
margin-top: 1vh; margin-top: 1vh;
margin-bottom: 1vh; margin-bottom: 1vh;
}
option { option {
font-family: "Press Start 2P"; font-family: "Press Start 2P";
} }
} }
}
section.action{ section.action{
text-align: center; text-align: center;
@ -173,6 +173,8 @@
.control-group { .control-group {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
max-height: 60px;
margin-top: 10px;
img { img {
width: 30px; width: 30px;
@ -210,8 +212,18 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
}
@media only screen and (max-width: 800px) {
.enableCameraScene h2 {
font-size: 80%;
}
.enableCameraScene .control-group .nes-select {
font-size: 80%;
}
.enableCameraScene button.letsgo {
font-size: 160%;
}
} }
</style> </style>