diff --git a/src/sass/8-rwd/_rwd-xsmall.scss b/src/sass/8-rwd/_rwd-xsmall.scss index a808596..2dbafea 100755 --- a/src/sass/8-rwd/_rwd-xsmall.scss +++ b/src/sass/8-rwd/_rwd-xsmall.scss @@ -3,4 +3,82 @@ /* ----------------------------------------------------------- */ @media (max-width: $xsmall) { + + /* Header + -------------------------------------------------------------- */ + + .header { + padding: 3rem 0; + } + + .header__name { + font-size: 2.1rem; + } + + .header_slogan { + font-size: 1.5rem; + } + + .header__search { + display: flex; + margin-top: 2rem; + } + + .header__search input, + .header__search .btn { + font-size: 1.6rem; + } + + .header__search input { + min-width: 0; + } + + .header__search .btn { + flex-shrink: 0; + margin-left: .3rem; + } + + /* Plugins + -------------------------------------------------------------- */ + + .pluginList { + row-gap: 4rem; + } + + .plugin { + display: grid; + grid-template-columns: 25% 1fr; + align-items: start; + column-gap: 2rem; + } + + .plugin__visual { + grid-row: 1 / span 3; + grid-column: 1 / 2; + } + + .plugin__name, + .plugin__about, + .plugin__links { + grid-column: 2 / 3; + } + + .plugin__name { + margin: 0; + margin-bottom: .5rem; + } + + /* Pagination + -------------------------------------------------------------- */ + + .pagination { + margin-bottom: 0; + } + + /* Footer + -------------------------------------------------------------- */ + + .footer { + padding-top: 3rem; + } } diff --git a/src/sass/_config.scss b/src/sass/_config.scss index 84076c2..3728ca1 100755 --- a/src/sass/_config.scss +++ b/src/sass/_config.scss @@ -14,7 +14,7 @@ $fontstack2 : Georgia, Times, 'Times New Roman', serif; // responsive // -------------------------------------------------------------- -$xsmall : 480px; +$xsmall : 559px; $small : 768px; $medium : 990px; $large : 1282px; diff --git a/src/sass/style.scss b/src/sass/style.scss index 9a4414a..4964905 100755 --- a/src/sass/style.scss +++ b/src/sass/style.scss @@ -86,8 +86,8 @@ // == rwd */ // -------------------------------------------------------------- -@import '8-rwd/_rwd-large'; -@import '8-rwd/_rwd-medium'; -@import '8-rwd/_rwd-small'; +// @import '8-rwd/_rwd-large'; +// @import '8-rwd/_rwd-medium'; +// @import '8-rwd/_rwd-small'; @import '8-rwd/_rwd-xsmall'; @import '8-rwd/_rwd';