MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-04-22 19:45:43 -04:00
Code Issues Packages Projects Releases Wiki Activity

[web-src] Tweak spacing in album page

Browse Source
This commit is contained in:
chme 2020-05-16 13:54:24 +02:00
parent e0e9d24830
commit 2019e88bb3
4 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web-src/package-lock.json generated
View File

@ -1,6 +1,6 @@
{ {
"name": "forked-daapd-web", "name": "forked-daapd-web",
"version": "0.7.1", "version": "0.7.2",
"lockfileVersion": 1, "lockfileVersion": 1,
"requires": true, "requires": true,
"dependencies": { "dependencies": {

12
web-src/src/mystyles.scss
View File

@ -103,6 +103,10 @@ section.fd-tabs-section + section.fd-content {
margin-top: 24px; margin-top: 24px;
} }
section.hero + section.fd-content {
padding-top: 0;
}
.fd-progress-bar { .fd-progress-bar {
top: 52px !important; top: 52px !important;
} }
@ -268,8 +272,8 @@ hr.fd-navbar-divider {
.column { .column {
&.fd-has-cover { &.fd-has-cover {
max-height: 256px; max-height: 150px;
max-width: 256px; max-width: 150px;
@include mobile { @include mobile {
margin: auto; margin: auto;
} }
@ -285,3 +289,7 @@ hr.fd-navbar-divider {
background-color: rgba(10, 10, 10, 0.2); background-color: rgba(10, 10, 10, 0.2);
position: fixed; position: fixed;
} }
.hero-body {
padding: 1.5rem !important;
}

6
web-src/src/pages/PageAlbum.vue
View File

@ -1,9 +1,8 @@
<template> <template>
<content-with-hero> <content-with-hero>
<template slot="heading-left"> <template slot="heading-left">
<h1 class="title is-4 fd-has-margin-top">{{ album.name }}</h1> <h1 class="title is-5">{{ album.name }}</h1>
<h2 class="subtitle is-4 has-text-link has-text-weight-normal"><a class="has-text-link" @click="open_artist">{{ album.artist }}</a></h2> <h2 class="subtitle is-6 has-text-link has-text-weight-normal"><a class="has-text-link" @click="open_artist">{{ album.artist }}</a></h2>
<p class="heading has-text-centered-mobile">{{ album.track_count }} tracks</p>
<div class="buttons fd-is-centered-mobile fd-has-margin-top"> <div class="buttons fd-is-centered-mobile fd-has-margin-top">
<a class="button is-small is-dark is-rounded" @click="play"> <a class="button is-small is-dark is-rounded" @click="play">
@ -23,6 +22,7 @@
</p> </p>
</template> </template>
<template slot="content"> <template slot="content">
<p class="heading is-7 has-text-centered-mobile fd-has-margin-top">{{ album.track_count }} tracks</p>
<list-item-track v-for="(track, index) in tracks" :key="track.id" :track="track" @click="play_track(index)"> <list-item-track v-for="(track, index) in tracks" :key="track.id" :track="track" @click="play_track(index)">
<template slot="actions"> <template slot="actions">
<a @click="open_dialog(track)"> <a @click="open_dialog(track)">

2
web-src/src/templates/ContentWithHero.vue
View File

@ -10,7 +10,7 @@
<!-- Slot heading right --> <!-- Slot heading right -->
<slot name="heading-right"></slot> <slot name="heading-right"></slot>
</div> </div>
<div class="column is-three-fifths has-text-centered-mobile"> <div class="column is-three-fifths has-text-centered-mobile" style="margin: auto 0;">
<!-- Slot heading left --> <!-- Slot heading left -->
<slot name="heading-left"></slot> <slot name="heading-left"></slot>
</div> </div>