diff --git a/_includes/layouts/base.njk b/_includes/layouts/base.njk index ad6569e..4c4063b 100644 --- a/_includes/layouts/base.njk +++ b/_includes/layouts/base.njk @@ -7,6 +7,7 @@ + diff --git a/css/index.css b/css/index.css index 28be668..25c9c82 100644 --- a/css/index.css +++ b/css/index.css @@ -88,36 +88,6 @@ pre { code { word-break: break-all; } -.highlight-line { - display: block; - padding: 0.125em 1em; - text-decoration: none; /* override del, ins, mark defaults */ - color: inherit; /* override del, ins, mark defaults */ -} - -/* allow highlighting empty lines */ -.highlight-line:empty:before { - content: " "; -} -/* avoid double line breaks when using display: block; */ -.highlight-line + br { - display: none; -} - -.highlight-line-isdir { - color: #b0b0b0; - background-color: #222; -} -.highlight-line-active { - background-color: #444; - background-color: hsla(0, 0%, 27%, .8); -} -.highlight-line-add { - background-color: #45844b; -} -.highlight-line-remove { - background-color: #902f2f; -} /* Header */ .home { diff --git a/css/prism-base16-monokai.dark.css b/css/prism-base16-monokai.dark.css index dceb2a6..4a7889a 100644 --- a/css/prism-base16-monokai.dark.css +++ b/css/prism-base16-monokai.dark.css @@ -68,7 +68,6 @@ pre[class*="language-"] { text-decoration: line-through; } .token.inserted { - border-bottom: 1px dotted #f9f8f5; text-decoration: none; } .token.italic { diff --git a/css/prism-diff.css b/css/prism-diff.css new file mode 100644 index 0000000..797b0e5 --- /dev/null +++ b/css/prism-diff.css @@ -0,0 +1,40 @@ +/* + * New diff- syntax + */ + +pre[class*="language-diff-"] { + --eleventy-code-padding: 1.25em; + padding-left: var(--eleventy-code-padding); + padding-right: var(--eleventy-code-padding); +} +.token.deleted { + background-color: hsl(0, 51%, 37%); +} +.token.inserted { + background-color: hsl(126, 31%, 39%); +} + +/* Make the + and - characters unselectable for copy/paste */ +.token.prefix.unchanged, +.token.prefix.inserted, +.token.prefix.deleted { + -webkit-user-select: none; + user-select: none; + display: inline-flex; + align-items: center; + justify-content: center; + width: var(--eleventy-code-padding); + padding-top: 2px; + padding-bottom: 2px; + background-color: rgba(0,0,0,.2); +} + +/* Optional: full-width background color */ +.token.inserted:not(.prefix), +.token.deleted:not(.prefix) { + display: block; + margin-left: calc(-1 * var(--eleventy-code-padding)); + margin-right: calc(-1 * var(--eleventy-code-padding)); + text-decoration: none; /* override del, ins, mark defaults */ + color: inherit; /* override del, ins, mark defaults */ +} diff --git a/package.json b/package.json index 73c23ae..7166701 100644 --- a/package.json +++ b/package.json @@ -27,8 +27,8 @@ "@11ty/eleventy": "^1.0.0", "@11ty/eleventy-navigation": "^0.3.2", "@11ty/eleventy-plugin-rss": "^1.1.2", - "@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3", - "luxon": "^2.3.0", + "@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0", + "luxon": "^2.3.1", "markdown-it": "^12.3.2", "markdown-it-anchor": "^8.4.1" } diff --git a/posts/thirdpost.md b/posts/thirdpost.md index 7740e12..5fda350 100644 --- a/posts/thirdpost.md +++ b/posts/thirdpost.md @@ -9,12 +9,12 @@ layout: layouts/post.njk --- Leverage agile frameworks to provide a robust synopsis for high level overviews. Iterative approaches to corporate strategy foster collaborative thinking to further the overall value proposition. Organically grow the holistic world view of disruptive innovation via workplace diversity and empowerment. -``` js/2/4 +```diff-js // this is a command function myCommand() { - let counter = 0; ++ let counter = 0; - counter++; +- counter++; }