From 3d19f0a65f6a72349d3ea9980cc46dab0609090c Mon Sep 17 00:00:00 2001 From: Michael Trythall Date: Thu, 25 Apr 2024 22:04:34 -0400 Subject: [PATCH] Adds photo effect --- src/about/covid.html | 2 +- src/about/index.html | 11 ++++++----- src/assets/css/main.css | 13 +++++++++++++ src/assets/img/squiggle.svg | 10 ++++++++++ src/index.html | 11 ++++++----- 5 files changed, 36 insertions(+), 11 deletions(-) create mode 100644 src/assets/img/squiggle.svg diff --git a/src/about/covid.html b/src/about/covid.html index 0093c22..05ddeef 100644 --- a/src/about/covid.html +++ b/src/about/covid.html @@ -39,7 +39,7 @@

Check-in Procedure

another test. Here is an example of a negative test with the date:

-
+
A negative COVID-19 test with a phone showing the current date.C {% comment %} TODO: Use Image component {% endcomment %} - DjangoCon US attendees smiling for a picture. + + DjangoCon US attendees smiling for a picture. +
diff --git a/src/assets/css/main.css b/src/assets/css/main.css index 51a2eaf..9c02a10 100644 --- a/src/assets/css/main.css +++ b/src/assets/css/main.css @@ -75,6 +75,19 @@ .lead { @apply text-lg lg:text-xl; } + + .photo-effect { + @apply relative; + } + + .photo-effect::before { + @apply absolute z-10; + @apply block w-full h-full; + content: ''; + + opacity: 0.4; + background: linear-gradient(126deg, theme('colors.mosaic-blue') 11.2%, theme('colors.lucky-orange') 69.95%, theme('colors.brick-red') 90.34%); + } } @layer components { diff --git a/src/assets/img/squiggle.svg b/src/assets/img/squiggle.svg new file mode 100644 index 0000000..014a801 --- /dev/null +++ b/src/assets/img/squiggle.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/index.html b/src/index.html index bd5493f..fad811c 100644 --- a/src/index.html +++ b/src/index.html @@ -118,11 +118,12 @@

Accessiblity

{% comment %} TODO: Use Image component {% endcomment %} - DjangoCon US attendees smiling for a picture. + + DjangoCon US attendees smiling for a picture. +

Latest News