styling implemented
This commit is contained in:
parent
6d12a3e0bc
commit
303f25fa0b
|
@ -9,7 +9,9 @@
|
|||
<div class="background background-overlay"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<h1 class="heading">Marc Leopold Photography</h1>
|
||||
<transition name="fade">
|
||||
<h1 v-if="showHeading" class="heading">Marc Leopold Photography</h1>
|
||||
</transition>
|
||||
<transition name="fade" mode="out-in">
|
||||
<p class="tagline"
|
||||
:key="currentTaglineIndex">
|
||||
|
@ -34,6 +36,7 @@ export default {
|
|||
|
||||
data() {
|
||||
return {
|
||||
showHeading: false,
|
||||
currentImageIndex: -1,
|
||||
bgImages: [
|
||||
'https://marcleopold.isnet.uk/wp-content/uploads/2017/07/slider.jpg',
|
||||
|
@ -72,7 +75,7 @@ export default {
|
|||
mounted () {
|
||||
if (this.bgImages.length > 1) {
|
||||
this.setNextIndex()
|
||||
// this.nextTagline()
|
||||
this.showHeading = true
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -185,14 +188,14 @@ $padding: 1rem;
|
|||
}
|
||||
|
||||
.heading {
|
||||
color: #fff;
|
||||
color: $color__neutral-900;
|
||||
font-size: $heading-height;
|
||||
@include font-title(400);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tagline {
|
||||
color: #fff;
|
||||
color: $color__neutral-600;
|
||||
font-size: $tagline-height;
|
||||
text-align: right;
|
||||
@include font-cursive;
|
||||
|
|
Loading…
Reference in New Issue