diff options
-rw-r--r-- | _includes/jekyll-theme/shell.html | 2 | ||||
-rw-r--r-- | _posts/2021-04-09-snippets.md | 9 | ||||
-rw-r--r-- | assets/css/jekyll-theme.css | 1 | ||||
-rw-r--r-- | assets/css/jekyll-theme/scrollbar.css | 18 | ||||
-rw-r--r-- | assets/css/jekyll-theme/shell.css | 18 |
5 files changed, 29 insertions, 19 deletions
diff --git a/_includes/jekyll-theme/shell.html b/_includes/jekyll-theme/shell.html index 9b7ed4d..7fa0838 100644 --- a/_includes/jekyll-theme/shell.html +++ b/_includes/jekyll-theme/shell.html @@ -15,7 +15,7 @@ {% endfor %} {% assign cmd = new_cmd %} {% assign cmd = cmd | join: '' %} -<div> +<div class='pretty-scrollbar'> <pre class="shell-mark">$</pre><pre class="shell-cmd">{{ cmd }}</pre> </div> {% if include.out %} diff --git a/_posts/2021-04-09-snippets.md b/_posts/2021-04-09-snippets.md index 3621e80..7b8206d 100644 --- a/_posts/2021-04-09-snippets.md +++ b/_posts/2021-04-09-snippets.md @@ -50,3 +50,12 @@ main ``` Also, some inline code: `./test.sh`! + +Here's a snippet which requires a horizontal scrollbar to display, it should +look OK: + +``` +#!/usr/bin/env bash + +echo AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA What a long snippet +``` diff --git a/assets/css/jekyll-theme.css b/assets/css/jekyll-theme.css index 5491dcb..79fde65 100644 --- a/assets/css/jekyll-theme.css +++ b/assets/css/jekyll-theme.css @@ -1,6 +1,7 @@ @import 'jekyll-theme/fix_bootstrap.css'; @import 'jekyll-theme/footer.css'; @import 'jekyll-theme/posts.css'; +@import 'jekyll-theme/scrollbar.css'; @import 'jekyll-theme/shell.css'; @import 'jekyll-theme/snippets.css'; @import 'jekyll-theme/syntax.css'; diff --git a/assets/css/jekyll-theme/scrollbar.css b/assets/css/jekyll-theme/scrollbar.css new file mode 100644 index 0000000..8e7bf01 --- /dev/null +++ b/assets/css/jekyll-theme/scrollbar.css @@ -0,0 +1,18 @@ +/* Scrollbars. */ +/* Firefox: */ +.pretty-scrollbar, pre { + scrollbar-width: thin; + scrollbar-color: #ccc #f0f0f0; +} +/* Chrome: */ +.pretty-scrollbar::-webkit-scrollbar, pre::-webkit-scrollbar { + width: 4px; + height: 4px; +} +.pretty-scrollbar::-webkit-scrollbar-track, pre::-webkit-scrollbar-track { + background: #f0f0f0; +} +.pretty-scrollbar::-webkit-scrollbar-thumb, pre::-webkit-scrollbar-thumb { + background: #ccc; +} + diff --git a/assets/css/jekyll-theme/shell.css b/assets/css/jekyll-theme/shell.css index e68543b..215d610 100644 --- a/assets/css/jekyll-theme/shell.css +++ b/assets/css/jekyll-theme/shell.css @@ -50,21 +50,3 @@ .shell-out { border-width: 0 0 thin 0; } - -/* Scrollbars. */ -/* Firefox: */ -.shell * { - scrollbar-width: thin; - scrollbar-color: #ccc #f0f0f0; -} -/* Chrome: */ -.shell *::-webkit-scrollbar { - width: 4px; - height: 4px; -} -.shell *::-webkit-scrollbar-track { - background: #f0f0f0; -} -.shell *::-webkit-scrollbar-thumb { - background: #ccc; -} |