Try to improve UI for book cards...

This commit is contained in:
2025-10-30 17:23:02 +01:00
parent 056bc9048e
commit 86229dfad8
2 changed files with 20 additions and 19 deletions

View File

@@ -30,25 +30,26 @@ function openBook() {
</figure> </figure>
</div> </div>
<div class="media-content"> <div class="media-content">
<div class="is-size-4">{{title}}</div> <div class="content">
<div class="is-size-5 is-italic">{{author}}</div> <div class="is-size-5">{{title}}</div>
<div class="is-size-5 is-italic">{{author}}</div>
<VRating <VRating
half-increments half-increments
readonly readonly
:length="5" :length="5"
size="medium" size="medium"
:model-value="rating/2" :model-value="rating/2"
active-color="bulma-body-color" active-color="bulma-body-color"
/> />
</div>
<nav v-if="read" class="level">
<div class="level-left">
<span class="level-item icon" :title="$t('booklistelement.read')">
<b-icon-check-circle />
</span>
</div> </div>
</nav> <nav v-if="read" class="level">
<div class="level-left">
<span class="level-item icon" :title="$t('booklistelement.read')">
<b-icon-check-circle />
</span>
</div>
</nav>
</div>
</div> </div>
</div> </div>
</template> </template>

View File

@@ -26,7 +26,7 @@ const { data, error } = getMyBooks();
padding-bottom: 100px; padding-bottom: 100px;
line-height: 2.5; line-height: 2.5;
column-count: 4; column-count: 2;
column-gap: 15px; column-gap: 15px;
} }