diff --git a/.stylintrc b/.stylintrc index 7fca00209f..027518cf83 100644 --- a/.stylintrc +++ b/.stylintrc @@ -23,10 +23,7 @@ "cssLiteral": "never", "customProperties": [], "depthLimit": 4, - "duplicates": { - "expect": true, - "error": true - }, + "duplicates": false, "efficient": { "expect": "always", "error": true diff --git a/stylus/components/button.styl b/stylus/components/button.styl index 4c84624b3d..57c03b810b 100644 --- a/stylus/components/button.styl +++ b/stylus/components/button.styl @@ -289,21 +289,27 @@ $button-client-mobile /*------------------------------------*\ Sizes \*------------------------------------*/ -$button--tiny +button--tiny = min-height rem(24) min-width rem(80) padding rem(2 16) +$button--tiny + {button--tiny} -$button--small +button--small = min-height rem(32) min-width rem(96) padding rem(3 8) +$button--small + {button--small} -$button--large +button--large = min-height rem(48) min-width rem(160) padding rem(8 24) font-size rem(16) +$button--large + {button--large} /*------------------------------------*\ Extensions diff --git a/stylus/components/forms.styl b/stylus/components/forms.styl index 69bb5a498d..89b1d83d5d 100644 --- a/stylus/components/forms.styl +++ b/stylus/components/forms.styl @@ -267,16 +267,22 @@ $input-text &:invalid border rem(1) solid pomegranate -$input-text--tiny +input-text--tiny = border-radius rem(2) padding rem(4 8 6) +$input-text--tiny + {input-text--tiny} -$input-text--medium +input-text--medium = border-radius rem(2) padding rem(8 16 10) +$input-text--medium + {input-text--medium} -$input-text--fullwidth +input-text--fullwidth = max-width 100% +$input-text--fullwidth + {input-text--fullwidth} $checkbox // To make sure that checkbox's wrapper have the height of the checkbox diff --git a/stylus/components/wizard.styl b/stylus/components/wizard.styl index 25e2a17cbf..fc083890b2 100644 --- a/stylus/components/wizard.styl +++ b/stylus/components/wizard.styl @@ -2,6 +2,7 @@ @require '../settings/breakpoints' @require '../settings/palette' @require '../components/forms' +@require '../components/button' // Wizard layout $wizard @@ -108,17 +109,11 @@ $wizard-next $wizard-button +small-screen('min') - // Cannot @extend $button--large inside a Media Query :( - min-height rem(48) - min-width rem(160) - padding rem(8 24) - font-size rem(16) + {button--large} $wizard-password +small-screen() - // Cannot @extend $input-text--medium inside a Media Query :( - border-radius rem(2) - padding rem(8 16 10) + {input-text--medium} $wizard-title margin 0 0 rem(8)