WIP: Slim header according to topio

Broken below 789px responsive magic missing.
This commit is contained in:
Stephan 2021-03-02 22:40:11 +01:00
parent ef6179a326
commit 7a9c287e46
2 changed files with 17 additions and 5 deletions

View File

@ -248,6 +248,10 @@ header {
.header__slim_box {
margin-top: -0.75rem;
padding-bottom: 6em;
background-image: url("../images/wtf-header-bg.jpg");
background-repeat: no-repeat;
background-size: cover;
display: grid;
grid-template-rows: 46px 18px;
@ -271,7 +275,7 @@ header {
}
.slim_box__top_bar_middle {
background-image: url("../images/header_top_triangles_dark_blue.svg");
background-image: url("../images/header_top_triangles.svg");
}
.bg_box__top_bar_right, .slim_box__top_bar_right {
@ -281,10 +285,6 @@ header {
z-index: 5;
}
.slim_box__top_bar_right {
background-color: var(--wtf-dark-blue);
}
.bg_box__unicorns {
grid-row: 2 / span 6;
grid-column: 1 / span 5;
@ -295,6 +295,17 @@ header {
z-index: 10;
}
.slim_box__unicorns {
grid-row: 1 / span 2;
grid-column: 1 / span 5;
background-image: url("../images/translucent_unicorns.svg");
background-position: top 1rem left 95% ;
background-size: auto 115%;
background-repeat: no-repeat;
z-index: 10;
margin-bottom: -6em;
}
.bg_box__big_bg {
grid-row: 3 / span 2;
grid-column: 1 / span 5;

View File

@ -68,5 +68,6 @@
<div class="slim_box__top_bar_left"></div>
<div class="slim_box__top_bar_middle"></div>
<div class="slim_box__top_bar_right"></div>
<div class="slim_box__unicorns"></div>
</div>
{% endblock %}