Fixed controls overflowing because of too large image in queue mode

This commit is contained in:
Agate 2020-08-31 17:16:48 +02:00
parent b1ae13ab0a
commit dcd8e94101
2 changed files with 7 additions and 5 deletions

View File

@ -34,19 +34,17 @@
<translate translate-context="Sidebar/Player/Error message.Paragraph">You may have a connectivity issue.</translate> <translate translate-context="Sidebar/Player/Error message.Paragraph">You may have a connectivity issue.</translate>
</p> </p>
</div> </div>
<div class="additional-controls"> <div class="additional-controls tablet-and-below">
<track-favorite-icon <track-favorite-icon
class="tablet-and-below"
v-if="$store.state.auth.authenticated" v-if="$store.state.auth.authenticated"
:track="currentTrack"></track-favorite-icon> :track="currentTrack"></track-favorite-icon>
<track-playlist-icon <track-playlist-icon
class="tablet-and-below"
v-if="$store.state.auth.authenticated" v-if="$store.state.auth.authenticated"
:track="currentTrack"></track-playlist-icon> :track="currentTrack"></track-playlist-icon>
<button <button
v-if="$store.state.auth.authenticated" v-if="$store.state.auth.authenticated"
@click="$store.dispatch('moderation/hide', {type: 'artist', target: currentTrack.artist})" @click="$store.dispatch('moderation/hide', {type: 'artist', target: currentTrack.artist})"
:class="['ui', 'really', 'basic', 'circular', 'icon', 'button', 'tablet-and-below']" :class="['ui', 'really', 'basic', 'circular', 'icon', 'button']"
:aria-label="labels.addArtistContentFilter" :aria-label="labels.addArtistContentFilter"
:title="labels.addArtistContentFilter"> :title="labels.addArtistContentFilter">
<i :class="['eye slash outline', 'basic', 'icon']"></i> <i :class="['eye slash outline', 'basic', 'icon']"></i>

View File

@ -137,6 +137,10 @@
bottom: 0; bottom: 0;
top: 0; top: 0;
width: 32%; width: 32%;
> img {
height: 50vh;
width: 50vh;
}
@include media("<desktop") { @include media("<desktop") {
padding: 0.5em; padding: 0.5em;
font-size: 1.5em; font-size: 1.5em;
@ -148,7 +152,7 @@
max-height: 50vh; max-height: 50vh;
} }
} }
> *:not(.image) { > *:not(.image):not(img) {
width: 100%; width: 100%;
} }
h1 { h1 {