Book with donation.

[wolnelektury.git] / src / wolnelektury / static / 2022 / styles / components / _support.scss

diff --git a/src/wolnelektury/static/2022/styles/components/_support.scss b/src/wolnelektury/static/2022/styles/components/_support.scss
index cde1ba8..76ff590 100644 (file)
--- a/src/wolnelektury/static/2022/styles/components/_support.scss
+++ b/src/wolnelektury/static/2022/styles/components/_support.scss
@@ -1,7 +1,12 @@
+$green: #96C13D;
+$teal: #007880;
+$darkteal: #083F4D;
+
+

 .c-support {
   display: flex;
   margin-top: 50px;
 .c-support {
   display: flex;
   margin-top: 50px;

-  background: #96C13D;
+  background: $darkteal;

   border-radius: 15px;
   overflow: hidden;
   justify-content: center;
   border-radius: 15px;
   overflow: hidden;
   justify-content: center;


@@ -16,34 +21,45 @@
     letter-spacing: -0.02em;
     color: #ffffff;
     span {
     letter-spacing: -0.02em;
     color: #ffffff;
     span {

-      color: #007880;
+        color: $green;

     }
   }
 
     }
   }
 

+  div {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      padding: 20px 30px 30px;
+      height: 280px;
+  }
+  

   figure {
     margin: 0;
     font-size: 0;
     position: relative;
   figure {
     margin: 0;
     font-size: 0;
     position: relative;

+
+    img {
+        width: 270px;
+    }

   }
 
   a {
     width: 100%;
   }
 
   a {
     width: 100%;

-    margin: 40px auto 0;

     font-weight: 600;
     font-size: 22px;
     line-height: 28px;
     font-weight: 600;
     font-size: 22px;
     line-height: 28px;

-    color: #ffffff;
+    color: $darkteal;

     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     padding: 12px 22px 14px 28px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     padding: 12px 22px 14px 28px;

-    background: #007880;
+    background: $color-yellow;

     border-radius: 5px;
     transition: all $ease-dynamic 350ms;
 
     &:hover {
     border-radius: 5px;
     transition: all $ease-dynamic 350ms;
 
     &:hover {

-      background: $color-yellow;
+      background: $green;

     }
   }
 }
     }
   }
 }