ref(header): change background

cs50xshirazu · Jul 5, 2024 · 013a7a2 · 013a7a2
1 parent 7f954e5
commit 013a7a2
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 2 deletions.
diff --git a/src/app/globals.css b/src/app/globals.css
@@ -23,12 +23,12 @@
         rgba(0, 0, 0, 0.3) 100%
       ),
       linear-gradient(0deg, rgba(130, 0, 0, 0.2) 0%, rgba(130, 0, 0, 0.2) 100%),
-      url(/public/images/intro.png),
       lightgray 0px -143.143px / 100.03% 144.894% no-repeat;
     background-blend-mode: multiply;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
+    @apply bg-HeaderImage bg-blend-multiply;
   }
   .imagePrimary {
     background: linear-gradient(

diff --git a/src/features/Header/Header.feature.tsx b/src/features/Header/Header.feature.tsx
@@ -4,7 +4,7 @@ type Props = {};
 
 export const Header = (props: Props) => {
   return (
-    <header className="w-full h-[calc(100vh-8rem)] px-32 md:px-10 bg-headerImage bg-cover bg-center header-bg bg-blend-multiply flex justify-start relative">
+    <header className="w-full h-[calc(100vh-8rem)] px-32 md:px-10 bg-headerImage bg-cover bg-center header-bg bg-HeaderImage bg-blend-multiply flex justify-start relative">
       <div className="absolute bottom-5 right-24 text-quaternary font-GEO703 flex flex-col items-end font-bold md:right-5">
         <span className="text-2.5xl w-fit md:text-xl">Welcome to</span>
         <h1 className="text-7xl xl:text-5xl md:!text-4xl">CS50x SHIRAZ</h1>

diff --git a/tailwind.config.ts b/tailwind.config.ts
@@ -13,6 +13,7 @@ const config: Config = {
     extend: {
       backgroundImage: {
         "ButtonImage": "url('/images/buttonBg.svg')",
+        "HeaderImage": "url('/images/intro.png')",
         "BodyImage": "url('/images/image_50.png')",
         "headeangImage": "url('/images/headingLine.svg')",
         "swiperBtnPrev": "url('/icons/swiperButtonPrev.svg')",