phil/plcom
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

hero: apply brightness for bright images

Browse source
This commit is contained in:
Philippe Loctaux 2023-05-17 23:32:30 +02:00
parent 27161f554f
commit d8db1f76e7
2 changed files with 5 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/hero.astro
View file

@ -7,7 +7,7 @@ import Wallpaper from "./wallpaper.astro";
class="container mx-auto px-8 py-16 w-full h-full justify-center items-center flex flex-col"
>
<div
class="inline-block backdrop-blur-lg rounded-3xl shadow-2xl px-4 py-6 sm:px-8 sm:py-12 space-y-4"
class="inline-block backdrop-blur-lg backdrop-brightness-75 rounded-3xl shadow-2xl px-4 py-6 sm:px-8 sm:py-12 space-y-4"
>
<h1 class="text-3xl sm:text-4xl font-bold">Philippe Loctaux</h1>
<h2 class="sm:text-xl font-semibold">

5
src/components/wallpaper.astro
View file

@ -11,10 +11,13 @@ const wallpaper = wallpapers[Math.floor(Math.random() * wallpapers.length)];
class="relative text-white w-full h-almostscreen bg-center bg-fixed bg-cover"
style=`background-image: url(${wallpaper.file});`
>
<!-- Content inside -->
<slot />
<!-- Exif info -->
<div
class="absolute bottom-3 sm:bottom-5 left-2 sm:left-5 inline-block backdrop-blur-lg rounded-lg shadow-2xl p-2 space-y-0.5 sm:space-y-2"
class="absolute bottom-3 sm:bottom-5 left-2 sm:left-5 inline-block backdrop-blur-lg backdrop-brightness-75 rounded-xl shadow-2xl p-2 space-y-0.5 sm:space-y-2"
>
<!-- Location -->