From f176a76294e9f8660565ec310820c84a4cb0bae8 Mon Sep 17 00:00:00 2001 From: "stephen@cubedesigners.com" Date: Wed, 31 Aug 2016 14:25:09 +0000 Subject: [PATCH] Button updates. Fix #639 @2 --- less/003-mixins.less | 11 +++++++---- less/102-footer.less | 6 +++--- less/103-contact-footer.less | 2 +- less/104-nav.less | 1 + less/210-home.less | 2 +- less/213-home-customers.less | 4 ++-- less/214-home-services.less | 2 +- less/220-exemples.less | 2 +- less/315-quote.less | 2 +- less/410-features.less | 2 +- 10 files changed, 19 insertions(+), 15 deletions(-) diff --git a/less/003-mixins.less b/less/003-mixins.less index 463d58e..e6de962 100644 --- a/less/003-mixins.less +++ b/less/003-mixins.less @@ -17,7 +17,7 @@ .font-thinning(); } -.button(@line-height: 54px, @horizontal-padding: 20px) { +.button(@line-height: 54px, @horizontal-padding: 16px) { display: inline-block; border: 0; font-family: @montserrat; @@ -130,11 +130,13 @@ } } -.longarrow-button(@padding-vertical: 23px, @padding-horizontal: 40px, @offset: 20px, @offset-arrow: -5px) { +.longarrow-button(@padding-vertical: 18px, @padding-horizontal: 40px, @offset: 20px, @offset-arrow: -5px) { + + padding: @padding-vertical @padding-horizontal; position: relative; transition: padding @transition-time-buttons; - line-height: 0.8em; + line-height: 1.5; &:after { content: '-'; @@ -142,7 +144,8 @@ font-family: @icons; font-size: 1.5em; position: absolute; - top: @padding-vertical; + top: 50%; + transform: translateY(-50%); right: @padding-horizontal - @offset - @offset-arrow; opacity: 0; visibility: hidden; diff --git a/less/102-footer.less b/less/102-footer.less index 8c28fea..bf38a72 100644 --- a/less/102-footer.less +++ b/less/102-footer.less @@ -136,19 +136,19 @@ footer.site .footer-inner { .workshop-link { .rounded-button(); .border-button(#fff, #fff); - .longarrow-button(20px, 62px, 19px); + .longarrow-button(16px, 62px, 19px); border-radius: 26px; text-transform: uppercase; font-size: 12px; @media @m1280 { - .longarrow-button(20px, 30px, 13px, 2px); + .longarrow-button(16px, 30px, 13px, 2px); } @media @m1024 { //.longarrow-button(20px, 54px, 16px, 0); } @media @m900 { - .longarrow-button(15px, 20px, 11px, 1px); + .longarrow-button(12px, 20px, 11px, 1px); } } } diff --git a/less/103-contact-footer.less b/less/103-contact-footer.less index f62193f..8257856 100644 --- a/less/103-contact-footer.less +++ b/less/103-contact-footer.less @@ -44,7 +44,7 @@ a { .border-button-fill(#343c44, #f3f3f3, 5%); - .longarrow-button(20px, 40px, 18px); + .longarrow-button(15px, 40px, 18px); min-width: 220px; margin-right: 20px; diff --git a/less/104-nav.less b/less/104-nav.less index b53f934..fb8271c 100644 --- a/less/104-nav.less +++ b/less/104-nav.less @@ -156,6 +156,7 @@ nav#contactnav { &.quoteLink { .background-button-green(); color: #fff; + line-height: 1; @media @m640 { display: none; } diff --git a/less/210-home.less b/less/210-home.less index 7ae49cc..a710719 100644 --- a/less/210-home.less +++ b/less/210-home.less @@ -29,7 +29,7 @@ .btn { .button(); - .longarrow-button(20px, 40px, 18px); + .longarrow-button(16px, 40px, 18px); color: #fff; margin-top: 30px; } diff --git a/less/213-home-customers.less b/less/213-home-customers.less index 7c5c0d7..7dad7bb 100644 --- a/less/213-home-customers.less +++ b/less/213-home-customers.less @@ -6,7 +6,7 @@ section.customers { .button(); color: #fff; margin-bottom: 20px; - .longarrow-button(20px, 40px, 18px); + .longarrow-button(16px, 40px, 18px); } .btn.more { @@ -14,7 +14,7 @@ section.customers { border: 1px solid @color-text; line-height: 52px; margin: 0 20px; - .longarrow-button(20px, 40px, 18px); + .longarrow-button(15px, 40px, 18px); } } diff --git a/less/214-home-services.less b/less/214-home-services.less index 210ee50..340fb8d 100644 --- a/less/214-home-services.less +++ b/less/214-home-services.less @@ -138,7 +138,7 @@ section.services { margin-top: 0; .border-button-fill(#fff, rgba(231, 92, 123, 1)); - .longarrow-button(20px, 40px, 18px); + .longarrow-button(16px, 40px, 18px); } } diff --git a/less/220-exemples.less b/less/220-exemples.less index efd5379..437cb61 100644 --- a/less/220-exemples.less +++ b/less/220-exemples.less @@ -68,7 +68,7 @@ display: inline-block; .border-button-fill(#fff, rgba(231, 92, 123, 1)); - .longarrow-button(20px, 40px, 18px); + .longarrow-button(16px, 40px, 18px); } &.featured { diff --git a/less/315-quote.less b/less/315-quote.less index e6beb18..9e057fb 100644 --- a/less/315-quote.less +++ b/less/315-quote.less @@ -153,7 +153,7 @@ button { .button(); .background-button-green(); - .longarrow-button(23px, 40px, 20px, -5px); + .longarrow-button(18px, 40px, 20px, -5px); .font-thinning(); color: #fff; font-size: 14px; diff --git a/less/410-features.less b/less/410-features.less index 8ce1229..6842764 100644 --- a/less/410-features.less +++ b/less/410-features.less @@ -22,7 +22,7 @@ .button(); .background-button-blue(); .font-thinning(); - .longarrow-button(20px, 40px, 18px); + .longarrow-button(16px, 40px, 18px); margin-top: 50px; } -- 2.39.5