copy Character breadcrumb skeleton, apply font to card title

This commit is contained in:
Xevion
2020-09-14 18:04:08 -05:00
parent 427d4c6b4f
commit 8ed65e7c2d
2 changed files with 19 additions and 3 deletions

View File

@@ -1,6 +1,9 @@
<template>
<div>
<b-breadcrumb :items="breadcrumbs"></b-breadcrumb>
<b-breadcrumb v-if="ready" :items="breadcrumbs"></b-breadcrumb>
<b-card v-else class="breadcrumb-skeleton mb-3">
<Skeleton style="width: 40%;"></Skeleton>
</b-card>
<b-card>
<h4 v-if="character">{{ this.$route.params.character }}</h4>
<Skeleton v-else style="max-width: 30%"></Skeleton>
@@ -8,6 +11,19 @@
</div>
</template>
<style lang="scss" scoped>
.breadcrumb-skeleton {
background-color: $grey-3;
height: 48px;
& > .card-body {
padding: 0 0 0 1em;
display: flex;
align-items: center;
}
}
</style>
<script>
import Skeleton from './Skeleton.vue';

View File

@@ -6,7 +6,7 @@
</b-card>
<b-card class="mb-4">
<template v-if="ready">
<h3>"{{ episode.title }}"</h3>
<h3 class="card-title">"{{ episode.title }}"</h3>
<span>{{ episode.description }}</span>
<CharacterList v-if="episode && episode.characters" :characters="episode.characters"></CharacterList>
</template>
@@ -48,7 +48,7 @@
<style lang="scss">
.card-title {
font-family: "Montserrat", sans-serif;
font-weight: 600;
font-weight: 500;
}
.deleted-scene {