Merge pull request #109 from doxa-tech/bn-esperance-beer-page

[BN] Add new beer page
doxa-tech · Jun 4, 2024 · aa900cd · aa900cd
2 parents 5bc5317 + e18f20e
commit aa900cd
Show file tree

Hide file tree

Showing 6 changed files with 748 additions and 2 deletions.
diff --git a/bullenetwork.ch/src/images/beer/esperance/ancre.svg b/bullenetwork.ch/src/images/beer/esperance/ancre.svg
diff --git a/bullenetwork.ch/src/images/beer/esperance/infusion-banner.png b/bullenetwork.ch/src/images/beer/esperance/infusion-banner.png
diff --git a/bullenetwork.ch/src/images/beer/esperance/mont-pelerin.png b/bullenetwork.ch/src/images/beer/esperance/mont-pelerin.png
diff --git a/bullenetwork.ch/src/pages/beatus-bulla-first.js b/bullenetwork.ch/src/pages/beatus-bulla-first.js
@@ -20,7 +20,7 @@ const Beatus = () => {
       })
   }, [])
   return (
-    <Layout layoutClass="secondary-layout beer-page" title="Beatus Bulla - First" >
+    <Layout layoutClass="secondary-layout beer-page-1" title="Beatus Bulla - First" >
       <section className="main-section beer">
         <div className="section-container">
           <p className="banner-holder">

diff --git a/bullenetwork.ch/src/pages/infusion-first.js b/bullenetwork.ch/src/pages/infusion-first.js
diff --git a/bullenetwork.ch/src/styles/pages/beer.scss b/bullenetwork.ch/src/styles/pages/beer.scss
@@ -1,4 +1,4 @@
-.beer-page {
+.beer-page-1 {
   .main-section {
     background: url("../../images/beer/noise.png") repeat,
       linear-gradient(143deg, #4B7197 57%, #A6C8E5 100%);
@@ -37,3 +37,61 @@
     }
   }
 }
+
+.beer-page-2 {
+  .main-section {
+
+    &.beer {
+      background: url("../../images/beer/noise.png") repeat, linear-gradient(143deg, #339D84 57%, #a9d4ca 100%);
+    }
+
+    min-height: 100vh;
+    color: white;
+
+    .section-container {
+      max-width: 1200px;
+      margin: auto;
+      position: relative;
+
+      p {
+        font-weight: 300;
+      }
+
+      .big-anchor {
+        position: absolute;
+        height: 100vh;
+        left: 50%;
+        transform: translateX(-50%) rotate(20deg);
+        padding-top: 100px;
+        overflow: hidden;
+
+        svg {
+          fill: #ffffff1c;
+        }
+      }
+
+      h1 {
+        padding: 40px 0 30px 0;
+      }
+
+      .banner-holder {
+        text-align: center;
+        padding: 30px 0 0 0;
+
+        .banner {
+          max-width: 700px;
+        }
+      }
+
+      .footer-holder {
+        text-align: center;
+        margin: 100px 0 0 0;
+        font-size: 10px;
+
+        .footer {
+          max-width: 1400px;
+        }
+      }
+    }
+  }
+}