[web] Remove remnants of the name forked-daapd in styles

This commit is contained in:
Alain Nussbaumer 2025-02-07 21:42:31 +01:00
parent 4796963781
commit 6354f9972a
12 changed files with 67 additions and 68 deletions

View File

@ -1,5 +1,5 @@
<template>
<figure>
<figure class="cover has-shadow">
<img v-lazy="{ src: url, lifecycle }" @click="$emit('click')" />
</figure>
</template>
@ -50,3 +50,58 @@ export default {
}
}
</script>
<style lang="scss" scoped>
@use 'bulma/sass/utilities/mixins';
.cover {
align-items: center;
display: flex;
justify-content: center;
&.is-small {
width: 4rem;
height: 4rem;
img {
border-radius: var(--bulma-radius-small);
max-width: 4rem;
max-height: 4rem;
}
}
&.is-medium {
@include mixins.tablet {
justify-content: right;
}
img {
border-radius: var(--bulma-radius);
max-height: calc(150px - 1.5rem);
}
}
&.is-normal {
img {
border-radius: var(--bulma-radius-large);
width: 100%;
}
}
&.is-big {
@include mixins.mobile {
@media screen and (orientation: landscape) {
img {
display: none;
}
}
}
img {
border-radius: var(--bulma-radius-large);
max-height: calc(100vh - 26rem);
}
&.is-masked {
filter: blur(0.5rem) opacity(0.2);
}
}
}
.has-shadow img {
box-shadow:
0 0.25rem 0.5rem 0 var(--bulma-background-active),
0 0.375rem 1.25rem 0 var(--bulma-background-active);
}
</style>

View File

@ -17,7 +17,7 @@
:url="item.item.artwork_url"
:artist="item.item.artist"
:album="item.item.name"
class="media-left fd-has-shadow fd-cover fd-cover-small-image"
class="media-left is-small"
/>
<div class="media-content">
<div class="is-size-6 has-text-weight-bold" v-text="item.item.name" />

View File

@ -12,7 +12,7 @@
:url="artwork_url(item)"
:artist="item.artist"
:album="item.name"
class="fd-has-shadow fd-cover fd-cover-small-image"
class="is-small"
/>
</div>
<div class="media-content">

View File

@ -8,7 +8,7 @@
:url="item.artwork_url"
:artist="item.artist"
:album="item.name"
class="fd-has-shadow fd-cover fd-cover-normal-image mb-3"
class="is-normal mb-3"
/>
<div v-if="media_kind_resolved === 'podcast'" class="buttons">
<a

View File

@ -8,7 +8,7 @@
:url="artwork_url(item)"
:artist="item.artist"
:album="item.name"
class="fd-has-shadow fd-cover fd-cover-normal-image mb-3"
class="is-normal mb-3"
@load="artwork_loaded"
@error="artwork_error"
/>

View File

@ -12,12 +12,6 @@
width: 100%;
}
.fd-has-shadow img {
box-shadow:
0 0.25rem 0.5rem 0 var(--bulma-background-active),
0 0.375rem 1.25rem 0 var(--bulma-background-active);
}
.is-full-height {
min-height: calc(100vh - calc(2 * var(--bulma-navbar-height)));
}
@ -35,52 +29,6 @@
justify-content: center;
}
.fd-cover {
align-items: center;
display: flex;
justify-content: center;
&-small-image {
width: 4rem;
height: 4rem;
img {
border-radius: var(--bulma-radius-small);
max-width: 4rem;
max-height: 4rem;
}
}
&-medium-image {
@include mixins.tablet {
justify-content: right;
}
img {
border-radius: var(--bulma-radius);
max-height: calc(150px - 1.5rem);
}
}
&-normal-image {
img {
border-radius: var(--bulma-radius-large);
width: 100%;
}
}
&-big-image {
@include mixins.mobile {
@media screen and (orientation: landscape) {
img {
display: none;
}
}
}
img {
border-radius: var(--bulma-radius-large);
max-height: calc(100vh - 26rem);
}
&.is-masked {
filter: blur(0.5rem) opacity(0.2);
}
}
}
.media:first-of-type {
padding-top: 1rem;
}
@ -106,7 +54,7 @@
}
.column {
&.fd-has-cover {
&.has-cover {
@include mixins.mobile {
margin: auto;
}

View File

@ -27,7 +27,7 @@
:url="album.artwork_url"
:artist="album.artist"
:album="album.name"
class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image"
class="is-clickable is-medium"
@click="show_details_modal = true"
/>
</template>

View File

@ -24,7 +24,7 @@
:url="artwork_url(album)"
:artist="album.artists[0].name"
:album="album.name"
class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image"
class="is-clickable is-medium"
@click="show_details_modal = true"
/>
</template>

View File

@ -24,7 +24,7 @@
:url="album.artwork_url"
:artist="album.artist"
:album="album.name"
class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image"
class="is-clickable is-medium"
@click="show_details_modal = true"
/>
</template>

View File

@ -7,7 +7,7 @@
:url="track.artwork_url"
:artist="track.artist"
:album="track.album"
class="is-clickable fd-has-shadow fd-cover-big-image"
class="is-clickable is-big"
:class="{ 'is-masked': lyricsStore.pane }"
@click="open_dialog(track)"
/>

View File

@ -24,7 +24,7 @@
:url="album.artwork_url"
:artist="album.artist"
:album="album.name"
class="is-clickable fd-has-shadow fd-cover fd-cover-medium-image"
class="is-clickable is-medium"
@click="show_details_modal = true"
/>
</template>

View File

@ -5,7 +5,7 @@
<div class="columns is-centered">
<div class="column is-four-fifths">
<div class="columns is-flex-direction-row-reverse">
<div class="column fd-has-cover">
<div class="column has-cover">
<slot name="heading-right" />
</div>
<div
@ -23,14 +23,10 @@
<div class="container">
<div class="columns is-centered">
<div class="column is-four-fifths">
<!-- Slot content -->
<slot name="content" />
<!-- Slot footer -->
<slot name="footer" />
</div>
</div>
</div>
</section>
</template>
<script></script>