diff --git a/src/sass/3-components/_buttons.scss b/src/sass/3-components/_buttons.scss index 33bc6ea..cee9193 100755 --- a/src/sass/3-components/_buttons.scss +++ b/src/sass/3-components/_buttons.scss @@ -13,10 +13,10 @@ $btn-shadow: 0 .1rem .2rem #0f0f0f1a; .btn { display: inline-block; margin: 0; - padding: 1rem 2rem; + padding: 1.3rem 2rem; color: #fff; font-weight: 500; - font-size: 1.4rem; + font-size: 1.6rem; line-height: 1.16em; text-align: center; text-decoration: none !important; @@ -103,7 +103,7 @@ $btn-shadow: 0 .1rem .2rem #0f0f0f1a; // -------------------------------------------------------------- .btn--big { - padding: 1.5rem 3rem; - font-size: 1.6rem; + padding: 2.5rem 3rem; + font-size: 1.8rem; box-shadow: 0 .2rem .4rem #0f0f0f1a; } diff --git a/src/sass/3-components/_forms.scss b/src/sass/3-components/_forms.scss index d250991..124b537 100755 --- a/src/sass/3-components/_forms.scss +++ b/src/sass/3-components/_forms.scss @@ -88,9 +88,9 @@ input { max-width: 32rem; margin-top: 0; margin-bottom: 0; - padding: 1rem 1.5rem; + padding: 1.3rem 1.6rem; font-weight: 500; - font-size: 1.4rem; + font-size: 1.6rem; line-height: 1.14em; background: $input-background-color; border: $input-border; diff --git a/src/sass/3-components/_pagination.scss b/src/sass/3-components/_pagination.scss index 46a6d1c..1fc0459 100755 --- a/src/sass/3-components/_pagination.scss +++ b/src/sass/3-components/_pagination.scss @@ -23,7 +23,8 @@ .pagination__link, .pagination__link:link, .pagination__link:visited { - min-width: 4.4rem; - padding: 1rem 1.3rem; + min-width: 4.9rem; + padding: 1.3rem 1.6rem; font-weight: normal; + font-size: 1.05em; } diff --git a/src/sass/4-base/_04-main.scss b/src/sass/4-base/_04-main.scss index 45f5b8e..0502e5c 100755 --- a/src/sass/4-base/_04-main.scss +++ b/src/sass/4-base/_04-main.scss @@ -11,7 +11,7 @@ body { } .container { - max-width: 102.4rem; + max-width: 130.4rem; margin-right: auto; margin-left: auto; padding-right: 1rem; diff --git a/src/sass/4-base/_06-header.scss b/src/sass/4-base/_06-header.scss index d81cf25..3352e8f 100755 --- a/src/sass/4-base/_06-header.scss +++ b/src/sass/4-base/_06-header.scss @@ -4,7 +4,7 @@ .header { margin-bottom: 2rem; - padding: 6rem 0; + padding: 5rem 0; text-align: center; border-top: 1rem solid $color-primary; } @@ -23,8 +23,8 @@ color: $color-primary; font-weight: bold; font-weight: 600; - font-size: 2.8rem; - line-height: 1.33em; + font-size: 4rem; + line-height: 1.2em; letter-spacing: .015em; border-radius: .3rem; } @@ -36,7 +36,7 @@ .header__slogan { color: darken(desaturate($color-primary, 40), 7); - font-size: 1.7rem; + font-size: 2rem; } // Search diff --git a/src/sass/5-modules/plugin-list.scss b/src/sass/5-modules/plugin-list.scss index 827a164..24d3a2b 100644 --- a/src/sass/5-modules/plugin-list.scss +++ b/src/sass/5-modules/plugin-list.scss @@ -4,7 +4,7 @@ .pluginList { display: grid; - grid-template-columns: repeat(auto-fill, minmax(min(25rem, 100%), 1fr)); + grid-template-columns: repeat(auto-fill, minmax(min(27rem, 100%), 1fr)); gap: 4rem; row-gap: 6rem; margin-bottom: 6rem; diff --git a/src/sass/5-modules/plugin.scss b/src/sass/5-modules/plugin.scss index ec9f236..af0771a 100644 --- a/src/sass/5-modules/plugin.scss +++ b/src/sass/5-modules/plugin.scss @@ -19,25 +19,25 @@ margin: 2rem 0 1rem; color: #36303e; font-weight: normal; - font-size: 1.4em; + font-size: 1.3em; line-height: 1.3em; } .plugin__about { margin-bottom: 1.5rem; color: #595959; - font-size: 1.4rem; + font-size: .9em; } .plugin__link, .plugin__link:link, .plugin__link:visited { display: inline-block; - margin-right: .6rem; - margin-bottom: .6rem; - padding: .6rem 1.5rem; + margin-right: .4rem; + margin-bottom: .4rem; + padding: .8rem 1.6rem; color: darken($color-primary, 20); - font-size: 1.4rem; + font-size: 1.6rem; line-height: 1.16em; text-align: center; text-transform: capitalize; diff --git a/src/sass/8-rwd/_rwd-xsmall.scss b/src/sass/8-rwd/_rwd-xsmall.scss index f84b781..269df04 100755 --- a/src/sass/8-rwd/_rwd-xsmall.scss +++ b/src/sass/8-rwd/_rwd-xsmall.scss @@ -1,8 +1,15 @@ +@use "sass:math"; + // ----------------------------------------------------------- // == rwd -> xsmall // ----------------------------------------------------------- -@media (max-width: $xsmall) { // Header +@media (max-width: $xsmall) { + body { + font-size: math.div(14, 10) + em; + } + + // Header // -------------------------------------------------------------- .header { @@ -13,7 +20,7 @@ font-size: 2.1rem; } - .header_slogan { + .header__slogan { font-size: 1.5rem; } @@ -25,6 +32,7 @@ .header__search input, .header__search .btn { + padding: 1rem 1.5rem; font-size: 1.6rem; } @@ -35,7 +43,9 @@ .header__search .btn { flex-shrink: 0; margin-left: .3rem; - } // Plugins + } + + // Plugins // -------------------------------------------------------------- .pluginList { @@ -64,8 +74,24 @@ margin: 0; margin-top: -.5rem; margin-bottom: .5rem; - font-size: 1.3em; - } // Pagination + + // font-size: 1em; + } + + .plugin__about { + font-size: 1em; + } + + .plugin__link, + .plugin__link:link, + .plugin__link:visited { + margin-right: .6rem; + margin-bottom: .6rem; + padding: .6rem 1.5rem; + font-size: 1.4rem; + } + + // Pagination // -------------------------------------------------------------- .pagination { diff --git a/src/sass/_config.scss b/src/sass/_config.scss index b07f374..bee351c 100755 --- a/src/sass/_config.scss +++ b/src/sass/_config.scss @@ -5,7 +5,7 @@ // base // -------------------------------------------------------------- -$base-font : 15; // px value (without unit), will be converted in em +$base-font : 18; // px value (without unit), will be converted in em $line-height : 1.5; $fontstack1 : "Helvetica Neue", helvetica, arial, sans-serif;