added backgroud to carousel

This commit is contained in:
Lorenz Hohermuth 2024-05-03 20:27:38 +02:00
parent c8c1155fb8
commit 5fc9e1ea4a
3 changed files with 6 additions and 7 deletions

View File

@ -2,7 +2,6 @@ package mdparser
import ( import (
"context" "context"
"fmt"
"regexp" "regexp"
"strings" "strings"

View File

@ -25,12 +25,12 @@ templ Carousel(elm []CarouselEntry , index int) {
hx-trigger="click" hx-trigger="click"
hx-target="#carousel-parent" hx-target="#carousel-parent"
> >
<img src={getEntry(elm, index - 1).ImgPath} class="h-28 w-52 rounded object-cover"/> <img src={getEntry(elm, index - 1).ImgPath} class="h-28 w-52 rounded object-cover bg-neutral-800"/>
</button> </button>
</div> </div>
<div class="relative text-center z-20"> <div class="relative text-center z-20">
<img src={getEntry(elm, index).ImgPath} class="h-36 w-64 rounded object-cover"/> <img src={getEntry(elm, index).ImgPath} class="h-36 w-64 rounded object-cover bg-neutral-800"/>
<div class="bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-36 w-64 rounded"></div> <div class="bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-36 w-64 rounded"></div>
<p class="absolute text-neutral-300 bottom-0.5 left-5">{getEntry(elm, index).Title}</p> <p class="absolute text-neutral-300 bottom-0.5 left-5">{getEntry(elm, index).Title}</p>
</div> </div>
@ -41,7 +41,7 @@ templ Carousel(elm []CarouselEntry , index int) {
hx-trigger="click" hx-trigger="click"
hx-target="#carousel-parent" hx-target="#carousel-parent"
> >
<img src={getEntry(elm, index + 1).ImgPath} class="h-28 w-52 rounded object-cover"/> <img src={getEntry(elm, index + 1).ImgPath} class="h-28 w-52 rounded object-cover bg-neutral-800"/>
</button> </button>
</div> </div>

View File

@ -51,7 +51,7 @@ func Carousel(elm []CarouselEntry, index int) templ.Component {
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-52 rounded object-cover\"></button></div><div class=\"relative text-center z-20\"><img src=\"") _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-52 rounded object-cover bg-neutral-800\"></button></div><div class=\"relative text-center z-20\"><img src=\"")
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }
@ -64,7 +64,7 @@ func Carousel(elm []CarouselEntry, index int) templ.Component {
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-36 w-64 rounded object-cover\"><div class=\"bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-36 w-64 rounded\"></div><p class=\"absolute text-neutral-300 bottom-0.5 left-5\">") _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-36 w-64 rounded object-cover bg-neutral-800\"><div class=\"bg-gradient-to-t from-black/30 absolute bottom-0 left-0 h-36 w-64 rounded\"></div><p class=\"absolute text-neutral-300 bottom-0.5 left-5\">")
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }
@ -90,7 +90,7 @@ func Carousel(elm []CarouselEntry, index int) templ.Component {
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-52 rounded object-cover\"></button></div></div><p class=\"text-center font-thin\">") _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"h-28 w-52 rounded object-cover bg-neutral-800\"></button></div></div><p class=\"text-center font-thin\">")
if templ_7745c5c3_Err != nil { if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err return templ_7745c5c3_Err
} }