]> _ Git - fluidbook-v3.git/commitdiff
done #526 @0.5
authorvincent@cubedesigners.com <vincent@cubedesigners.com@f5622870-0f3c-0410-866d-9cb505b7a8ef>
Mon, 4 Jul 2016 16:01:58 +0000 (16:01 +0000)
committervincent@cubedesigners.com <vincent@cubedesigners.com@f5622870-0f3c-0410-866d-9cb505b7a8ef>
Mon, 4 Jul 2016 16:01:58 +0000 (16:01 +0000)
less/003-mixins.less
less/101-header.less
less/103-contact-footer.less

index e00eafa5a123f8b9136874c752804dda23f584fe..b2ee9d66e39203ef3070354d863e9166e469f2cd 100644 (file)
@@ -13,9 +13,6 @@
 
 .button(@line-height: 54px, @horizontal-padding: 20px) {
        display: inline-block;
-       line-height: @line-height;
-       padding-left: @horizontal-padding;
-       padding-right: @horizontal-padding;
        border: 0;
        font-family: @montserrat;
        font-weight: 300;
@@ -47,7 +44,7 @@
        }
 }
 
-.border-button-fill(@border-color,@color-text) {
+.border-button-fill(@border-color,@color-text,@fade-active:20%) {
        .button();
        transition: all @transition-time-buttons;
 
@@ -55,7 +52,7 @@
        color: @border-color;
 
        &:active {
-               background-color: fade(@border-color, 20%);
+               background-color: fade(@border-color, @fade-active);
        }
 }
 
index 406f94f6d307573d7aa5a6c20d0b777f1b6f1ff8..cf57b1387f09a167ace3dcb9c4b85902030c8890 100644 (file)
@@ -63,16 +63,34 @@ header {
 \r
                > ul {\r
                        > li {\r
+\r
+                               margin: 0 25px;\r
+                               position: relative;\r
+\r
+                               a {\r
+                                       position: relative;\r
+                                       &:after {\r
+                                               content: "";\r
+                                               height: 1px;\r
+                                               width: 100%;\r
+                                               position: absolute;\r
+                                               background-color: @color-header-grey;\r
+                                               transform: scaleX(0);\r
+                                               left: 0;\r
+                                               bottom: 0;\r
+                                       }\r
+                               }\r
+\r
                                &.active > a, a:hover {\r
-                                       border-bottom-color: @color-header-grey;\r
+                                       color: @color-header-grey;\r
+                                       transform: scaleX(1);\r
                                }\r
                                &:hover {\r
                                        > ul {\r
                                                display: block;\r
                                        }\r
                                }\r
-                               margin: 0 25px;\r
-                               position: relative;\r
+\r
                                > ul {\r
                                        position: absolute;\r
                                        top: 40px;\r
@@ -117,15 +135,14 @@ header {
                }\r
                a {\r
                        .rounded-button();\r
-                       .smallarrow-button(10px, 30px, 10px, 7px);\r
                        &.quoteLink {\r
                                .background-button-green();\r
-\r
                                color: #fff;\r
                        }\r
                        &.agencies {\r
-                               .border-button(@color-header-grey, #c2c4c7);\r
+                               .border-button-fill(@color-header-grey, #c2c4c7, 5%);\r
                        }\r
+                       .smallarrow-button(10px, 30px, 10px, 7px);\r
                }\r
        }\r
 \r
index d885d611c59c46286c4d206ae2c9e02867c6a8e4..7764688d00498931f162eaab94f07ed606597b2a 100644 (file)
@@ -8,7 +8,7 @@
        .buttons {\r
                margin-top: 50px;\r
                a {\r
-                       .border-button-fill(#343c44, #f3f3f3);\r
+                       .border-button-fill(#343c44, #f3f3f3, 5%);\r
                        .longarrow-button(20px, 40px, 18px);\r
                        min-width: 220px;\r
                        margin-right: 20px;\r