Add footer

This commit is contained in:
Christian Cueni 2020-02-24 15:17:11 +01:00
parent a28c462a1e
commit a481989348
1 changed files with 37 additions and 4 deletions

View File

@ -1,8 +1,14 @@
<template> <template>
<div class="skillbox public"> <div class="skillbox public">
<logo class="public__logo"></logo> <div class="skillbox__header public__logo">
<router-view class="skillbox__content"></router-view> <logo class=""></logo>
<footer class="skillbox__footer">Footer</footer> </div>
<router-view class="skillbox__content public__content"></router-view>
<footer class="skillbox__footer public__footer footer">
<div class="footer__content">
Footer
</div>
</footer>
</div> </div>
</template> </template>
@ -20,14 +26,41 @@ import Logo from '@/components/icons/Logo';
@import "@/styles/_mixins.scss"; @import "@/styles/_mixins.scss";
@import "@/styles/_default-layout.scss"; @import "@/styles/_default-layout.scss";
.public { @mixin content-block {
padding-right: $medium-spacing;
padding-left: $medium-spacing;
max-width: 800px; max-width: 800px;
min-width: 320px; min-width: 320px;
margin: 0 auto;
}
.public {
grid-template-areas: "h" "c" "f";
&__logo { &__logo {
position: relative; position: relative;
left: -10px; left: -10px;
width: 100%;
}
&__content, &__logo {
@include content-block();
}
&__footer {
background-color: $color-silver-light;
display: block;
} }
} }
.footer {
padding-top: $large-spacing;
&__content {
@include content-block();
}
}
</style> </style>