MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-11-09 21:49:48 -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
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,42 +1,38 @@
<template>
<div class="fd-page">
<section class="hero is-light is-bold">
<div class="hero-body">
<div class="container">
<div class="columns is-centered">
<div class="column is-four-fifths">
<div class="columns" style="flex-direction: row-reverse">
<div class="column fd-has-cover">
<!-- Slot heading right -->
<slot name="heading-right" />
</div>
<div
class="column m-auto is-three-fifths has-text-centered-mobile"
>
<!-- Slot heading left -->
<slot name="heading-left" />
</div>
<section class="hero is-light is-bold">
<div class="hero-body">
<div class="container">
<div class="columns is-centered">
<div class="column is-four-fifths">
<div class="columns" style="flex-direction: row-reverse">
<div class="column fd-has-cover">
<!-- Slot heading right -->
<slot name="heading-right" />
</div>
<div
class="column m-auto is-three-fifths has-text-centered-mobile"
>
<!-- Slot heading left -->
<slot name="heading-left" />
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section">
<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>
</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" />
<!-- Slot footer -->
<slot name="footer" />
</div>
</div>
</section>
</div>
</div>
</section>
</template>
<script></script>