Added new design

[wolnelektury.git] / src / wolnelektury / static / 2022 / styles / layout / _button.scss

diff --git a/src/wolnelektury/static/2022/styles/layout/_button.scss b/src/wolnelektury/static/2022/styles/layout/_button.scss
new file mode 100644 (file)
index 0000000..5892f77
--- /dev/null
+++ b/src/wolnelektury/static/2022/styles/layout/_button.scss
@@ -0,0 +1,41 @@
+.l-button {
+  &.l-button--media {
+    @include font-size(16px);
+    border: 2px solid #D5ECED;
+    border-radius: 5px;
+    padding: 19px 20px;
+    cursor: pointer;
+    transition: all $ease-dynamic 350ms;
+    background-color: $color-white;
+    outline: 0;
+
+    font-weight: bold;
+    font-size: 16px;
+    line-height: 20px;
+    display: flex;
+    align-items: center;
+    text-align: center;
+    letter-spacing: -0.01em;
+    color: #007880;
+    font-family: $base-font;
+
+    .icon {
+      font-size: 21px;
+      margin-right: 15px;
+    }
+
+    &:hover {
+      background-color: #D5ECED;
+    }
+
+    &.l-button--media--full {
+      color: $color-white;
+      background: #083F4D;
+      border: 2px solid #083F4D;
+      &:hover {
+        background: darken(#083F4D, 2%);
+        border-color: darken(#083F4D, 2%);
+      }
+    }
+  }
+}