UI improvements to background hero

This commit is contained in:
Nuno Coração 2022-10-17 10:34:34 +01:00
parent 9afae930fd
commit dfb4be490d
3 changed files with 10 additions and 5 deletions

View file

@ -1634,8 +1634,8 @@ select {
height: 2rem; height: 2rem;
} }
.h-\[45vh\] { .h-\[300px\] {
height: 45vh; height: 300px;
} }
.h-36 { .h-36 {

View file

@ -146,10 +146,15 @@
var header = document.getElementById("single_header") var header = document.getElementById("single_header")
var style = getComputedStyle(header); var style = getComputedStyle(header);
var margin = '-'+ (parseInt(style.height) + parseInt(style.marginTop) + parseInt(style.marginBottom) + 20) + 'px'
var hero = document.getElementById('hero') var hero = document.getElementById('hero')
if(hero) if(hero){
var margin = '-'+ (parseInt(style.height) + parseInt(style.marginTop) + parseInt(style.marginBottom) + 20) + 'px'
var height = (-parseInt(margin) + parseInt(getComputedStyle(hero).height)) + "px"
console.log(height)
hero.style["margin-bottom"] = margin; hero.style["margin-bottom"] = margin;
hero.style["height"] = height;
}
</script> </script>
</section> </section>
<footer class="pt-8 max-w-prose print:hidden"> <footer class="pt-8 max-w-prose print:hidden">

View file

@ -3,7 +3,7 @@
{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}} {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
{{- with $featured -}} {{- with $featured -}}
{{ with .Resize "1200x" }} {{ with .Resize "1200x" }}
<div id="hero" class="relative h-[45vh] single_hero_background nozoom" style="background-image:url({{ .RelPermalink }});"> <div id="hero" class="relative h-[300px] single_hero_background nozoom" style="background-image:url({{ .RelPermalink }});">
<div class="hero_gradient bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal"></div> <div class="hero_gradient bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal"></div>
</div> </div>
{{ end }} {{ end }}