Ensure sticky hero is full width
This commit is contained in:
parent
dae91f9279
commit
4685faa361
2 changed files with 33 additions and 26 deletions
|
@ -8,10 +8,11 @@ section.hero {
|
||||||
position: sticky;
|
position: sticky;
|
||||||
top: 0;
|
top: 0;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
margin-top: 2.5rem;
|
margin-top: 3rem;
|
||||||
padding-top: 0.5rem;
|
padding-top: 0.5rem;
|
||||||
margin-bottom: 1.5rem;
|
margin-bottom: 1.5rem;
|
||||||
background-color: $white;
|
background-color: $white;
|
||||||
|
display: block;
|
||||||
|
|
||||||
.hero-body {
|
.hero-body {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
@ -46,4 +47,8 @@ section.hero {
|
||||||
.subtitle {
|
.subtitle {
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.column {
|
||||||
|
padding: unset;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,7 +4,8 @@
|
||||||
<img class="hero" src="{% image_url page.hero_image page.HERO_IMAGE_SIZE %}">
|
<img class="hero" src="{% image_url page.hero_image page.HERO_IMAGE_SIZE %}">
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<section class="hero container">
|
<section class="hero">
|
||||||
|
<div class="container">
|
||||||
<div class="hero-body">
|
<div class="hero-body">
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
<div class="column">
|
<div class="column">
|
||||||
|
@ -35,4 +36,5 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
Loading…
Reference in a new issue