Fixed bug with sticky banner

gordonbates · Mar 8, 2022 · 838a357 · 838a357
1 parent c6e7ad8
commit 838a357
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 16 deletions.
diff --git a/src/components/StickyBanner.vue b/src/components/StickyBanner.vue
@@ -9,27 +9,26 @@
           <rect id="ToDelete" fill="#ff13dc" opacity="0" width="12" height="12" /><path d="M11.69673,10.28266,7.41406,6l4.28267-4.28266A.9999.9999,0,1,0,10.28266.30327L6,4.58594,1.71734.30327A.9999.9999,0,1,0,.30327,1.71734L4.58594,6,.30327,10.28266a.9999.9999,0,1,0,1.41407,1.41407L6,7.41406l4.28266,4.28267a.9999.9999,0,1,0,1.41407-1.41407Z" />
         </svg>
 
-          <div style="z-index: 2" class="card-grid-nativeAd">
+          <!-- <div style="z-index: 2" class="card-grid-nativeAd">
             <div
               class="card-ad2">
             </div>
-              <!-- id="card-ad2"> -->
-          </div>
+          </div> -->
 
         <!-- <CarbonAd
           adId="carbonAd"
         /> -->
 
           <NativeAd
             :adId="'stickyAd'"
-            :template="2"
+            :template="3"
             :key="$route.fullPath + 'ad' + '_sticky'"
           />
 
             <!-- href="https://www.paypal.com/donate/?hosted_button_id=5PMNX4DPW83KN" -->
             <!-- target="_blank" -->
           <div
-            class="card-no-ad relative"
+            class="card-no-ad absolute"
             rel="noopener"
             style="width: 100%; left: 0;"
           >
@@ -242,12 +241,6 @@ export default {
     margin: 5px;
   }
 
-  .lgbt-wrapper{
-    display: grid;
-    grid-template-columns: auto auto;
-    gap: 10px;
-  }
-
   .sticky-banner ._coral-Button{
     width: 100%;
   }

diff --git a/src/components/app.scss b/src/components/app.scss
@@ -369,8 +369,12 @@ select{
 }
 
 .lgbt-wrapper{
-
-    min-height: 100px;
+    display: flex;
+    gap: 10px;
+    width: 100%;
+    flex-direction: column;
+    // min-height: 100px;
+    /* grid-template-columns: auto auto; */
 
     .card-no-ad{
         position: relative;

diff --git a/src/components/carbon.scss b/src/components/carbon.scss
@@ -162,6 +162,7 @@ height: -moz-fit-content;
 }
 
 .resources-card-ad .card-no-ad{
+    transform: translateY(-40%);
     /* width: 100%;
     left: 0px;
     top: 50%;
@@ -384,7 +385,8 @@ height: -moz-fit-content;
     width: 100%;
 
     & > div{
-        height: 100%
+        height: 100%;
+        min-height: 100px
     }
 
     #card-ad{
@@ -402,8 +404,8 @@ height: -moz-fit-content;
         height: -moz-fit-content;
         display: grid;
         grid-template-rows: 88px auto;
-        top: 50%;
-        transform: translateY(-50%);
+        // top: 50%;
+        // transform: translateY(-50%);
         background-color: transparent;
         border: 0px;
         font-size: 13px;