Refactor code for buttons

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/Makefile.am b/Makefile.am
index 692f41d497e32da6f39ec560d9638f4e977e8fdc..cf24e8691c7f6cd73daa41e0f545145e14ef6d51 100644 (file)
--- a/Makefile.am
+++ b/Makefile.am
@@ -129,7 +129,6 @@ templates_staticdir = $(templatesdir)/static
 
 SCSS_FILES = \
        src/scss/style.scss \
-       src/scss/_buttons.scss \
        src/scss/_donation.scss \
        src/scss/_fonts.scss \
        src/scss/_icons.scss \

diff --git a/src/scss/_buttons.scss b/src/scss/_buttons.scss
deleted file mode 100644 (file)
index e7d8c99..0000000
--- a/src/scss/_buttons.scss
+++ /dev/null
@@ -1,103 +0,0 @@
-// Buttons
-.btn-red900 {
-  @include button-variant($red-900, $red-900, $red-900);
-}
-.btn-white {
-  @include button-variant($white, $white, $white);
-}
-.btn-bluegrey900 {
-  @include button-variant($blue-grey-900, $blue-grey-900, $blue-grey-900);
-}
-
-button.navbar-toggler div {
-       font-family: 'Ubuntu', sans-serif;
-       font-size: 1rem;
-       display: inline-block;
-       position: relative;
-       top: -4px;
-}
-
-.btn-group {
-       box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .15), 0 1px 2px 0 rgba(0, 0, 0, .25);
-}
-
-.btn {
-       height: 36px;
-       text-transform: uppercase;
-       box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .15), 0 1px 2px 0 rgba(0, 0, 0, .25);
-       transition: box-shadow .25s ease-in-out;
-       &:hover {
-               box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .15), 0 3px 6px 0 rgba(0, 0, 0, .25);
-               transition: box-shadow .25s ease-in-out;
-       }
-       @include media-breakpoint-down(sm) {
-               font-size: .875rem;
-       }
-}
-
-.btn-outline-primary,
-.btn-outline-secondary {
-       transition: background-color .25s ease-in-out;
-       &:hover {
-               transition: background-color .25s ease-in-out;
-       }
-}
-
-.btn-light {
-       box-shadow: none;
-}
-
-.btn-xlg {
-       height: 72px;
-       margin: 0 36px;
-       padding-top: 16px;
-}
-
-.btn-lg {
-       height: 48px;
-       margin: 0 24px;
-       @include media-breakpoint-down(sm) {
-               height: 36px;
-               margin: 0 8px;
-               padding: 1rem;
-               font-size: .875rem;
-               line-height: 0;
-       }
-}
-
-.btn-md {
-       font-size: 0.875rem;
-       line-height: 1.25rem;
-       padding: .4rem 1rem .5rem 1rem;
-}
-
-.btn-block {
-       margin: 0 0 1.5rem 0;
-       @include media-breakpoint-up(md) {
-               margin: 0 0 2rem 0;     
-       }
-       @include media-breakpoint-down(xs) {
-               font-size: .875rem;
-               line-height: 0;
-       }
-}
-
-button:focus {
-       outline: none;
-}
-
-// Top navigation Donate Button //
-.btn-donate {
-       margin-top: 18px;
-       font-size: 14px;
-       font-weight: 400;
-       line-height: 20px;
-       padding: 3px 16px 0 5px;
-       @include media-breakpoint-up(lg) {
-               margin-top: 29px;
-       }
-       svg {
-               vertical-align: -7px;
-               margin-right: 5px;
-       }
-}

diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss
index ee821ffbf1f1f62d3c4bb1ac32a4447b532e2229..a81df9db987253a7d6b2970688e35dcf3e4a955b 100644 (file)
--- a/src/scss/_variables.scss
+++ b/src/scss/_variables.scss
@@ -37,10 +37,14 @@ $grid-breakpoints: (
 );
 
 $border-radius:                                2px;
+$border-radius-lg:                     2px;
 
 // Fonts
 $font-family-sans-serif:       "Ubuntu", sans-serif;
 
+// Typo
+$font-size-base:                       0.875rem;
+
 // Navbar
 $navbar-brand-font-size:       36px;
 $navbar-brand-height:          32px;
@@ -50,5 +54,9 @@ $navbar-nav-link-padding-x:   16px;
 
 $navbar-padding-y:                     1.1rem;
 
+// Input
+$input-btn-padding-x:          1rem;
+$input-btn-padding-y:          .5rem;
+
 // Buttons
 $btn-border-width:                     2px;

diff --git a/src/scss/style.scss b/src/scss/style.scss
index b0bbd33f89d163c6d4961fad15714f3dc162da6f..632826fb834af5908c92b9bf43ea21dc5076015d 100644 (file)
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -39,9 +39,14 @@
 
 // Custom stuff
 @import '_fonts';
-@import '_buttons';
+//@import '_buttons';
 @import '_icons';
 
+// Buttons
+.btn {
+       text-transform: uppercase;
+}
+
 footer {
        .btn-toolbar .icon {
                height: 2.25rem;

diff --git a/src/templates/base.html b/src/templates/base.html
index a0b11c458b7176ef0a500f657c4dde298e5a7106..8ffefd199f9cb5aa7e83c0f58be72e0679ca7ee0 100644 (file)
--- a/src/templates/base.html
+++ b/src/templates/base.html
@@ -41,7 +41,7 @@
                                </div>
 
                                <a class="btn btn-primary btn-donate d-none d-sm-block" href="/donate">
-                                       <svg class="icon i_heart"><use xlink:href="#heart"/></svg>
+                                       <!-- <svg class="icon i_heart"><use xlink:href="#heart"/></svg> -->
                                        {{ _("Donate") }}
                                </a>
                        </div>