Receipts texts.

[wolnelektury.git] / src / wolnelektury / static / 2022 / more.scss

diff --git a/src/wolnelektury/static/2022/more.scss b/src/wolnelektury/static/2022/more.scss
index 2743038..3733e3c 100644 (file)
--- a/src/wolnelektury/static/2022/more.scss
+++ b/src/wolnelektury/static/2022/more.scss
@@ -318,16 +318,35 @@ form {
         color: #92BD39;
     }
 
-    > p, form {
+    > p, form, > .normal-text {
         min-width: 300px;
         margin-left: 50px;
         margin-right: 50px;
+        width: auto;
     }
 
+    .wlfund {
+        margin: 0;
+        width: 90%;
+        border-collapse: separate;
+
+        tr {
+            td {
+                padding: .625rem .3125rem .625rem;
+                border-top: .625rem solid rgba(255,255,255,0);
+                border-bottom: 1px solid #083F4D;
+                text-align: center;
+            }
+        }
+    }
+}
+
+.page-simple, .nice-controls {
     button, input[type=submit] {
         margin: 24px 0;
         height: 56px;
         background: #083F4D;
+        border: none;
         border-radius: 3px;
         font-weight: 600;
         font-size: 20px;
@@ -338,6 +357,15 @@ form {
         text-align: center;
         color: #FFFFFF;
         width: 340px;
+
+        &.active {
+            outline: 2px solid #083F4D;
+            outline-offset: 3px;
+        }
+        
+        &:disabled {
+            opacity: .8;
+        }
     }
 
     label {
@@ -349,10 +377,9 @@ form {
         margin-top: 24px;
     }
 
-    input {
+    input, textarea, select {
         display: block;
         width: 100%;
-        height: 56px;
         background: #FFFFFF;
         color: black;
         border: 1px solid #D5ECED;
@@ -361,6 +388,9 @@ form {
         padding: 10px;
         outline: 0;
     }
+    input, select {
+        height: 56px;
+    }
     input[type=checkbox], input[type=radio] {
         display: inline;
         float: left;
@@ -370,3 +400,90 @@ form {
         margin-right: 1em;
     }
 }
+
+
+.experiment {
+    display: flex;
+    align-items: center;
+}
+
+
+
+.page-simple {
+    .form-info {
+        h2 {
+            font-size: 1.5em;
+            margin-top: 0;
+        }
+    }
+}
+
+
+.funding-promo-bar {
+    margin: 18px auto;
+
+    .l-checkout__support {
+        margin: 0;
+        a {
+            display: flex;
+            align-items: start;
+
+            .buttonlike {
+                margin-right: 10px;
+                background: #FFA500;
+                //color: #083F4D;
+                color: black;
+                border-radius: 5px;
+                font-size: 1.125rem;
+                line-height: 50px;
+                letter-spacing: -0.01em;
+                padding: 0 20px;
+                font-weight: 600;
+                transition: all cubic-bezier(0.25, 1, 0.5, 1) 350ms;
+                &:hover {
+                    background: #92BD39;
+                }
+            }
+            .funding-bar-container {
+                flex-grow: 1;
+            }
+        }
+    }
+}
+
+.l-checkout__support__bar {
+    overflow: hidden;
+}
+
+
+.l-change-pop {
+    margin-bottom: 18px;
+}
+
+
+.page-simple button.button-orange {
+    background: #FFA500;
+    color: black;
+    transition: all cubic-bezier(0.25, 1, 0.5, 1) 350ms;
+    &:hover {
+        background: #92BD39;
+    }
+}
+
+
+.poll-bar {
+    height: 10px;
+    width: 100%;
+    display: block;
+    border-radius: 5px;
+    position: relative;
+    overflow: hidden;
+
+    .poll-bar-inner {
+      height: 100%;
+      position: absolute;
+      border-radius: 5px;
+      background-color: #006066;
+      top: 0; left: 0;
+    }
+}