diff --git a/client/components/domains/domain-product-price/style.scss b/client/components/domains/domain-product-price/style.scss index c61444a7d4f2b..380d02b317a87 100644 --- a/client/components/domains/domain-product-price/style.scss +++ b/client/components/domains/domain-product-price/style.scss @@ -1,5 +1,5 @@ .domain-product-price { - color: darken( $gray, 10% ); + color: darken( $gray, 30% ); display: inline-block; font-size: 17px; font-weight: 600; diff --git a/client/components/domains/example-domain-suggestions/style.scss b/client/components/domains/example-domain-suggestions/style.scss index 326a3dae58907..2ade69d0933b8 100644 --- a/client/components/domains/example-domain-suggestions/style.scss +++ b/client/components/domains/example-domain-suggestions/style.scss @@ -17,9 +17,10 @@ display: none; } } + .example-domain-suggestions__premium-price { - font-size: 11pt; cursor: pointer; + border-bottom: 1px dotted $gray; } .example-domain-suggestions__information { @@ -37,20 +38,19 @@ } .example-domain-suggestions__header { - color: darken( $gray, 20% ); - font-size: 22px; - font-weight: 200; - margin: 15px 20px; + color: darken( $gray, 30% ); + font-size: 16px; + margin: 16px 24px; } .example-domain-suggestions__list { list-style: none; - margin: 0 20px; + margin: 0 24px; li { - background-color: $gray-light; - padding: 15px; - margin: 2px 0; + background: $gray-light; + margin-bottom: 1px; + padding: 16px; @include clear-fix; @@ -61,7 +61,7 @@ } .example-domain-suggestions__price { - color: $gray; + color: darken( $gray, 10 ); font-size: 14px; @include breakpoint( ">660px" ) { @@ -80,7 +80,7 @@ .example-domain-suggestions__mapping-information { color: darken( $gray, 20% ); - margin: 15px 20px; + margin: 16px 24px; a { text-decoration: underline; diff --git a/client/components/header-cake/style.scss b/client/components/header-cake/style.scss index 0ccc7295c168a..e922a4bb0a99d 100644 --- a/client/components/header-cake/style.scss +++ b/client/components/header-cake/style.scss @@ -39,7 +39,7 @@ .header-cake__title { flex: 1 1 auto; - color: $gray; + color: darken( $gray, 20 ); text-align: center; word-break: break-word; white-space: nowrap; diff --git a/client/signup/flow-progress-indicator/style.scss b/client/signup/flow-progress-indicator/style.scss index afb58c122cf22..4cff8695ab8b8 100644 --- a/client/signup/flow-progress-indicator/style.scss +++ b/client/signup/flow-progress-indicator/style.scss @@ -1,5 +1,5 @@ .flow-progress-indicator { - color: $gray; + color: darken( $gray, 20 ); font-size: 14px; font-weight: 300; margin-bottom: -10px; diff --git a/client/signup/step-wrapper/style.scss b/client/signup/step-wrapper/style.scss index 7ab2f6ecb2d72..278429105c549 100644 --- a/client/signup/step-wrapper/style.scss +++ b/client/signup/step-wrapper/style.scss @@ -1,6 +1,7 @@ .step-wrapper__buttons { text-align: center; } + .step-wrapper__buttons.is-wide-navigation { display: flex; justify-content: space-around; @@ -27,3 +28,11 @@ vertical-align: middle; } } + +.step-wrapper__buttons .button.is-borderless { + color: darken( $gray, 20 ); + + &:hover { + color: $gray-dark; + } +} diff --git a/client/signup/style.scss b/client/signup/style.scss index 87844d44163b0..bb6f37f11d7b9 100644 --- a/client/signup/style.scss +++ b/client/signup/style.scss @@ -34,12 +34,12 @@ .signup__step-enter.signup__step-enter-active { opacity: 1; - transition: .3s ease-in-out; + transition: .2s ease-in-out; transition-delay: .2s; .is-animated-content { transform: translate3d( 0, 0, 0 ); - transition: .3s ease-in-out; + transition: .2s ease-in-out; transition-delay: .2s; } } @@ -54,11 +54,11 @@ .signup__step-leave.signup__step-leave-active { opacity: 0.01; - transition: .3s ease-in-out; + transition: .2s ease-in-out; .is-animated-content { - transform: translate3d( 0, 32px, 0 ); - transition: .3s ease-in-out; + transform: translate3d( 0, 32px, 0 ) scale( 0.9 ); + transition: .2s ease-in-out; } }