diff options
Diffstat (limited to 'sass')
-rw-r--r-- | sass/base/_layout.scss | 15 | ||||
-rw-r--r-- | sass/parts/_archive.scss | 31 | ||||
-rw-r--r-- | sass/parts/_article.scss | 15 | ||||
-rw-r--r-- | sass/parts/_footer.scss | 4 | ||||
-rw-r--r-- | sass/parts/_header.scss | 53 | ||||
-rw-r--r-- | sass/parts/_post.scss | 17 | ||||
-rw-r--r-- | sass/parts/_syntax.scss | 1 |
7 files changed, 129 insertions, 7 deletions
diff --git a/sass/base/_layout.scss b/sass/base/_layout.scss index 1d11880..24c67d8 100644 --- a/sass/base/_layout.scss +++ b/sass/base/_layout.scss @@ -62,4 +62,19 @@ a{ .inner{ width: $max-width; margin: 0 auto; +} + +@media screen and (max-width: 1030px){ + body{ + margin: 0 30px; + } + .inner{ + width: 100%; + } +} + +@media screen and (max-width: 600px){ + body{ + font-size: 13px; + } }
\ No newline at end of file diff --git a/sass/parts/_archive.scss b/sass/parts/_archive.scss index ad96dc2..037e92a 100644 --- a/sass/parts/_archive.scss +++ b/sass/parts/_archive.scss @@ -20,7 +20,6 @@ section.archive{ } h1.archive-title{ font-size: 25px; - font-weight: 300; line-height: 35px; width: 200px; position: absolute; @@ -37,8 +36,13 @@ section.archive{ } article.archive{ margin-left: 200px; + h1{ + margin-bottom: 0; + } .meta{ color: $font-meta; + line-height: 2; + margin-top: 15px; span{ margin-right: 30px; padding-left: 30px; @@ -62,4 +66,29 @@ section.archive{ } } } +} + +@media screen and (max-width: 600px){ + section.archive{ + h1.archive-title{ + position: relative; + width: 100%; + & + article.archive{ + border-top: none; + h1{ + padding-top: 15px; + } + } + } + article.archive{ + margin-left: 0; + padding: 15px 0; + h1{ + font-size: 20px; + } + .meta{ + display: none; + } + } + } }
\ No newline at end of file diff --git a/sass/parts/_article.scss b/sass/parts/_article.scss index 4423eee..c5c7719 100644 --- a/sass/parts/_article.scss +++ b/sass/parts/_article.scss @@ -99,4 +99,19 @@ article{ .share{ padding: 15px 0; @include border-shadow(); +} + +@media screen and (max-width: 800px){ + article{ + padding-bottom: 15px; + } +} + +@media screen and (max-width: 600px){ + article{ + padding: 15px 0; + h1.title{ + font-size: 20px; + } + } }
\ No newline at end of file diff --git a/sass/parts/_footer.scss b/sass/parts/_footer.scss index b713b8e..2df695f 100644 --- a/sass/parts/_footer.scss +++ b/sass/parts/_footer.scss @@ -1,6 +1,6 @@ footer{ - padding: 30px 0; + padding: 15px 0; border-top: 1px solid $light-shadow; text-align: center; - font-size: 13px; + font-size: 12px; }
\ No newline at end of file diff --git a/sass/parts/_header.scss b/sass/parts/_header.scss index 739372e..a11ff44 100644 --- a/sass/parts/_header.scss +++ b/sass/parts/_header.scss @@ -17,10 +17,8 @@ header{ nav{ margin-left: 30px; >ul{ - list-style: none; - padding-right: 30px; >li{ - float: left; + display: inline-block; margin-left: 50px; position: relative; &:hover{ @@ -142,4 +140,53 @@ header{ } } } +} + +@media screen and (max-width: 1030px){ + header{ + height: auto; + position: relative; + padding-bottom: 10px; + h1{ + float: none !important; + } + nav{ + margin-left: 0; + margin-top: 15px; + float: none !important; + >ul{ + >li{ + margin-left: 0; + margin-right: 50px; + &:last-of-type{ + margin-right: 0; + } + } + ul{ + top: 40px; + } + } + } + >.right{ + position: absolute; + top: 30px; + right: 0; + } + } +} + +@media screen and (max-width: 600px){ + header{ + .social{ + display: none; + } + .search{ + input[type="text"]{ + width: 60px; + &:focus, &:active{ + width: 100px; + } + } + } + } }
\ No newline at end of file diff --git a/sass/parts/_post.scss b/sass/parts/_post.scss index b27b4c7..aeaa52a 100644 --- a/sass/parts/_post.scss +++ b/sass/parts/_post.scss @@ -29,4 +29,21 @@ background: image-url('comments.png') 0 center no-repeat; } } +} + +@media screen and (max-width: 800px){ + .post{ + h1.title, .entry{ + margin-left: 0; + } + .meta{ + margin-top: 15px; + position: static; + width: auto; + .date, .tags, .comments{ + display: inline-block; + margin-right: 30px; + } + } + } }
\ No newline at end of file diff --git a/sass/parts/_syntax.scss b/sass/parts/_syntax.scss index f3e493a..efdc01f 100644 --- a/sass/parts/_syntax.scss +++ b/sass/parts/_syntax.scss @@ -58,7 +58,6 @@ figure.code{ } td.code{ padding-left: 15px; - font-size: 13px; overflow-x: auto; } /* Style */ |