MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-02-27 13:29:17 -05:00
Code Issues Packages Projects Releases Wiki Activity

[web] Fix spacing of elements in the pages with hero content

Browse Source 
Spacing is now identical to the former spacing.
This commit is contained in:
Alain Nussbaumer 2023-06-24 10:56:00 +02:00
parent aef1c5aa3b
commit 892ce26f44
3 changed files with 120 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,4 +1,5 @@
<template>
<div class="fd-page">
<content-with-hero>
<template #heading-left>
<h1 class="title is-5" v-text="album.name" />
@ -14,7 +15,9 @@
class="button is-small is-light is-rounded"
@click="show_album_details_modal = true"
>
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
</div>
</template>
@ -40,6 +43,7 @@
/>
</template>
</content-with-hero>
</div>
</template>
<script>

10
web-src/src/pages/PageAudiobooksAlbum.vue
View File

@ -1,4 +1,5 @@
<template>
<div class="fd-page">
<content-with-hero>
<template #heading-left>
<h1 class="title is-5" v-text="album.name" />
@ -14,7 +15,9 @@
class="button is-small is-light is-rounded"
@click="show_album_details_modal = true"
>
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
</div>
</template>
@ -31,7 +34,9 @@
<p
class="heading is-7 has-text-centered-mobile fd-has-margin-top"
v-text="
$t('page.audiobooks.album.track-count', { count: album.track_count })
$t('page.audiobooks.album.track-count', {
count: album.track_count
})
"
/>
<list-tracks :tracks="tracks" :uris="album.uri" />
@ -43,6 +48,7 @@
/>
</template>
</content-with-hero>
</div>
</template>
<script>

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

@ -1,5 +1,4 @@
<template>
<div class="fd-page">
<section class="hero is-light is-bold">
<div class="hero-body">
<div class="container">
@ -22,21 +21,18 @@
</div>
</div>
</section>
<section class="section">
<section class="section pt-0">
<div class="container">
<div class="columns is-centered">
<div class="column is-four-fifths">
<!-- Slot content -->
<slot name="content" />
<div style="margin-top: 16px">
<!-- Slot footer -->
<slot name="footer" />
</div>
</div>
</div>
</div>
</section>
</div>
</template>
<script></script>