diff options
| author | s-ol <s-ol@users.noreply.github.com> | 2018-11-24 06:21:25 +0000 |
|---|---|---|
| committer | s-ol <s-ol@users.noreply.github.com> | 2018-11-24 06:23:01 +0000 |
| commit | ea951ff325c0237c1c5e2c670aa6830e9dc04c60 (patch) | |
| tree | bc97e41b79dedc6a9d4d0751c3b820e166d4979a /scss | |
| parent | add blog post assets (diff) | |
| download | mmm-ea951ff325c0237c1c5e2c670aa6830e9dc04c60.tar.gz mmm-ea951ff325c0237c1c5e2c670aa6830e9dc04c60.zip | |
align markdown code styling
Diffstat (limited to 'scss')
| -rw-r--r-- | scss/_browser.scss | 7 | ||||
| -rw-r--r-- | scss/_content.scss | 51 | ||||
| -rw-r--r-- | scss/main.scss | 32 |
3 files changed, 52 insertions, 38 deletions
diff --git a/scss/_browser.scss b/scss/_browser.scss index 9845ff3..8a04752 100644 --- a/scss/_browser.scss +++ b/scss/_browser.scss @@ -79,10 +79,3 @@ } } } - -.content { - img, video { - max-width: 100%; - max-height: 100%; - } -} diff --git a/scss/_content.scss b/scss/_content.scss new file mode 100644 index 0000000..b3468bd --- /dev/null +++ b/scss/_content.scss @@ -0,0 +1,51 @@ +.content { + img, video, pre > code { + display: block; + max-width: 100%; + max-height: 100%; + + padding: 0 2em; + box-sizing: border-box; + } + + pre > code { + @include left-border; + border-color: $gray-dark; + + display: block; + border-radius: 6px; + margin: 0 2em; + padding: 1em; + white-space: pre-wrap; + overflow-x: auto; + + background: #1d1f21; + color: #c5c8c6; + } + + pre.dual-code { + display: flex; + justify-content: space-between; + padding: 0 2rem; + + > code { + @include right-border(0.3rem); + + flex: 1; + margin: 0; + } + + > code + code { + @include left-border(0.3rem); + } + } + + .example, .well { + @include left-border; + + margin: 1rem 2rem; + padding: 1rem; + background: $gray-bright; + border-color: $gray-neutral; + } +} diff --git a/scss/main.scss b/scss/main.scss index fe67631..c1e9d38 100644 --- a/scss/main.scss +++ b/scss/main.scss @@ -4,35 +4,5 @@ @import 'header'; @import 'footer'; @import 'browser'; +@import 'content'; @import 'canvasapp'; - -pre > code.hljs { - @include left-border; - border-color: $gray-dark; -} - -pre.dual-code { - display: flex; - justify-content: space-between; - padding: 0 2rem; - - > code.hljs { - @include right-border(0.3rem); - - flex: 1; - margin: 0; - } - - > code.hljs + code.hljs { - @include left-border(0.3rem); - } -} - -.example, .well { - @include left-border; - - margin: 1rem 2rem; - padding: 1rem; - background: $gray-bright; - border-color: $gray-neutral; -} |