Bug 11337: closed

[people/shoehn/ipfire.org.git] / static / scss / style.scss

diff --git a/static/scss/style.scss b/static/scss/style.scss
index 970343af9346a67cd35a77a41966dc94fc0d31d1..0a710663b8623d480950fb02cf7cf530219e805d 100644 (file)
--- a/static/scss/style.scss
+++ b/static/scss/style.scss
@@ -54,6 +54,12 @@
 @import "bootstrap-4.0.0-alpha.6/scss/utilities";
 
 
+// Colors
+
+.amber-800 {
+       color: $amber-800;
+}
+
 // Fonts
 
 h1 {
@@ -133,7 +139,6 @@ img {
 }
 
 // Icons
-
 .icon {
        width: 1.5rem;
        height: 1.5rem;
@@ -145,35 +150,47 @@ img {
 
 .i_arrow_down {
        margin: 0;
-       animation: scroll 3s infinite;
+       position: absolute;
+       left: .75rem;
+       top: -.25rem;
+       animation: scroll 1.5s ease-in-out infinite;
+       @include media-breakpoint-down(sm) {
+               width: 2rem !important;
+               height: 2rem !important;
+               left: .15rem;
+               top: -.75rem;
+       }
 }
 
 .i_lg {
        width: 2.5rem;
        height: 2.5rem;
        margin: 0;
-       transform: translateY(-.25rem);
+       transform: translateY(-.35rem);
        fill: $red_900;
 }
 
 .i_sm {
-       width: 1rem;
-       height: 1rem;
+       vertical-align: top;
+       transform: translateY(-.10rem);
 }
 
 footer {
        .btn-toolbar .icon {
-               height: 2rem;
-               width: 2rem;
+               height: 2.25rem;
+               width: 2.25rem;
                fill: rgba($blue-grey-900, .6);
        }
        .i_heart {
-               vertical-align: -.25rem;
+               vertical-align: top;
+               transform: translateY(-.15rem);
+               @include media-breakpoint-down(sm) {
+                       transform: translateY(-.75rem);
+               }
        }
 }
 
 // Buttons
-
 .btn-red900 {
   @include button-variant($btn-red900-color, $btn-red900-bg, $btn-red900-border);
 }
@@ -188,7 +205,8 @@ button.navbar-toggler div {
        font-family: 'Ubuntu', sans-serif;
        font-size: 1rem;
        display: inline-block;
-       margin-left: 12px;
+       position: relative;
+       top: -4px;
 }
 
 .btn {
@@ -225,6 +243,12 @@ button.navbar-toggler div {
        }
 }
 
+.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) {
@@ -236,8 +260,11 @@ button.navbar-toggler div {
        }
 }
 
-// Top Navigation
+button:focus {
+       outline: none;
+}
 
+// Top Navigation
 .fixed-top {
        transition: background-color 700ms linear;
        .navbar {
@@ -296,7 +323,6 @@ button.navbar-toggler div {
 }
 
 // Sections
-
 section.intro {
        min-height: 100vh;
        background-image: url('../img/header-background.jpg');
@@ -347,13 +373,16 @@ section.intro {
                left: 50%;
                transform: translateX(-50%);
                .btn {
-                       width: 32px;
-                       height: 32px;
+                       width: 36px;
+                       height: 36px;
                        fill: $red_900;
                        @include media-breakpoint-up(md) {
                                width: 64px;
                                height: 64px;
                        }
+                       &:hover .i_arrow_down {
+                               fill: white;
+                       }
                }
        }
 }
@@ -390,6 +419,10 @@ section#wishlist {
        background-position: center center;
 }
 
+.progress {
+       background-color: rgba(255, 255, 255, .2);
+}
+
 .bg-progress {
        background-image: linear-gradient(to right, $yellow-700, $amber-800);
 }
@@ -445,9 +478,7 @@ footer {
 }
 
 // Animation
-
 @keyframes scroll {
-  0%   { transform: translateY(20%); }
-  50% { transform: translateY(60%); }
-  100% { transform: translateY(20%); }
+  0%, 100%   { transform: translateY(30%); }
+  50% { transform: translateY(50%); }
 }
\ No newline at end of file