_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

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

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