updated style sheet

cc75a7db · Laurent Heirendt · 7584b905 · cc75a7db
Verified Commit cc75a7db authored Jun 11, 2020 by Laurent Heirendt ✈
Hide whitespace changes
Inline Side-by-side

Showing with 20 additions and 27 deletions

_sass/minima/_gdpr.scss _sass/minima/_gdpr.scss +20 -27

No files found.
--- a/_sass/minima/_gdpr.scss
+++ b/_sass/minima/_gdpr.scss
@@ -10,6 +10,7 @@
    border-top: 1px solid #198cdc;
    width: 100%;
    display: none;
+
    /* hidden by default */
 }

@@ -54,13 +55,6 @@
    left: 100%;
 }

-#lap-cookies-banner .banner-buttons .banner-buttons-more {
-    position: relative;
-    left: 55%;
-    top: -28px;
-    width: 20%;
-}
-
 #lap-cookies-banner .banner-buttons .lap-accept,
 #lap-cookies-banner .banner-buttons .lap-refuse,
 #lap-cookies-banner .banner-buttons .lap-cookies-more,
@@ -103,6 +97,8 @@
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
+    margin-right: 10px;
+    margin-bottom: 10px;
 }

 // Small component to show a Material Design style input toggle
@@ -195,18 +191,29 @@ label.input-toggle {
 }

 @media(max-width: 500px) {
+    #lap-cookies-banner {
+        position: fixed;
+        bottom: 0;
+        background-color: #fff;
+        padding-top: 1em;
+        padding-bottom: 1em;
+        z-index: 1000;
+        left: 0;
+        text-align: center;
+        border-top: 1px solid #198cdc;
+        width: 100%;
+        display: none;
+        height: 280px;
+        overflow: auto;
+        /* hidden by default */
+    }
+
    #lap-cookies-banner .banner-intro {
        width: 60%;
        position: relative;
        left: 20%;
        text-align: left;
    }
-    #lap-cookies-banner .banner-buttons .banner-buttons-more {
-        position: relative;
-        left: 25%;
-        top: 10px;
-        width: 50%;
-    }
 }

 @media(max-width: 1100px) {
@@ -222,12 +229,6 @@ label.input-toggle {
        height: 60px;
        margin-bottom: 10px;
    }
-    #lap-cookies-banner .banner-buttons .banner-buttons-more {
-        position: relative;
-        left: 25%;
-        top: 10px;
-        width: 50%;
-    }
 }

 @media(max-width: 1600px) {
@@ -242,17 +243,9 @@ label.input-toggle {
 /* ultra-wide screen */
 @media(min-width: 2400px) {
    #lap-cookies-banner .banner-intro {
-
        position: relative;
        text-align: left;
        max-width: 800px;
        left: 35%;
    }
-
-    #lap-cookies-banner .banner-buttons .banner-buttons-more {
-        position: relative;
-        left: 50%;
-        top: -28px;
-        width: 20%;
-    }
 }
\ No newline at end of file