blogs/FixIt
1
0
Fork 0
mirror of https://github.com/hugo-fixit/FixIt.git synced 2026-09-02 19:52:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'feature/highlight' into v0.2.13-RC

Browse Source
This commit is contained in:
Cell
2022-03-01 20:04:13 +08:00
parent b0825134af 8d24ccf0b9
commit 4b23d8c1b8
8 changed files with 732 additions and 420 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CHANGELOG.md
+8 -3
View File
@@ -17,12 +17,17 @@ All notable changes to this project will be documented in this file.
- :sparkles: Feat: add details shortcode ([#68](https://github.com/Lruihao/FixIt/issues/68))
- :sparkles: Feat: add markdown support for **title** parameter of the admonition shortcode
- :sparkles: Feat: add 9 newly supported social links ([#17](https://github.com/Lruihao/FixIt/issues/17))
- :sparkles: Feat: update cell-watermark 1.0.3 and CDN support (fontFamily supported)
- :bug: Fix: remove source map of local libraries to avoid 404 error ([#67](https://github.com/Lruihao/FixIt/issues/67))
- :zap: Perf: enhance highlight feature (GitHub syntax supported) and fix some css bugs ([#43](https://github.com/Lruihao/FixIt/issues/43))
- Inline Code
- Indented Code
- Block Fenced Code
- gist shortcode
- :mag: Feat: add 360 and sougou seo support
- :bug: Fix: remove source map of local libraries to avoid 404 error ([#67](https://github.com/Lruihao/FixIt/issues/67))
- :fire: Feat: remove shortcode cardlink ([#42](https://github.com/Lruihao/FixIt/issues/42))
- :lipstick: Style: add radius of the scrollbar
- :pencil2: Style: fix typo *discription* should be **description** ([#60](https://github.com/Lruihao/FixIt/issues/60))
- :fire: Feat: remove shortcode cardlink ([#42](https://github.com/Lruihao/FixIt/issues/42))
- :wrench: Chore: update cell-watermark 1.0.3 and CDN support (fontFamily supported)
- :wrench: Chore: add atomic-algolia for exampleSite ([#70](https://github.com/Lruihao/FixIt/issues/70))
- **Full Changelog:** [`v0.2.12...v0.2.13`](https://github.com/Lruihao/FixIt/compare/v0.2.12...v0.2.13)
assets/css/_core/_base.scss
+1 -1
View File
@@ -23,7 +23,7 @@ html {
::-webkit-scrollbar-thumb {
background-color: $scrollbar-color;
border-radius: $scrollbar-radius;
border-radius: $global-border-radius;
&:hover {
background-color: $scrollbar-hover-color;
assets/css/_mixin/_details.scss
+2 -2
View File
@@ -1,7 +1,7 @@
@mixin details-transition-open {
@include transition(max-height 0.8s cubic-bezier(0, 1, 0, 1) -0.1s);
@include transition(max-height 0.2s cubic-bezier(0, 1, 0, 1) -0.1s);
}
@mixin details-transition-close {
@include transition(max-height 0.8s cubic-bezier(0.5, 0, 1, 0) 0s);
@include transition(max-height 0.2s cubic-bezier(0.5, 0, 1, 0) 0s);
}
assets/css/_partial/_single/_code.scss
+219 -257
View File
@@ -1,26 +1,48 @@
// inline code
code {
display: inline-block;
max-width: 100%;
padding: 0 .4rem;
@include overflow-wrap(break-word);
@include line-break(anywhere);
padding: 0 0.4rem;
font-size: $code-font-size;
font-family: $code-font-family;
color: $code-color;
background-color: rgba(175, 184, 193, 0.2);
border-radius: $global-border-radius;
@include overflow-wrap(break-word);
@include line-break(anywhere);
[theme=dark] & {
[theme='dark'] & {
color: $code-color-dark;
background-color: rgba(99, 110, 123, 0.4);
}
}
// indented code
pre {
margin: 0;
padding: .25rem 0 .25rem .5rem;
line-height: 1.45em;
padding: 0.5rem;
overflow: auto;
font-size: $code-font-size;
font-family: $code-font-family;
border-radius: $global-border-radius;
@include tab-size(4);
background-color: $code-background-color;
[theme='dark'] & {
background-color: $code-background-color-dark;
}
code {
padding: 0;
border-radius: 0;
background-color: transparent;
@include max-content(min-width);
[theme='dark'] & {
background-color: transparent;
}
}
img {
@@ -30,17 +52,10 @@ pre {
}
}
code, pre, .highlight table, .highlight tr, .highlight td {
background: $code-background-color;
[theme=dark] & {
background: $code-background-color-dark;
}
}
.highlight, .gist {
font-family: $code-font-family;
.highlight,
.gist {
font-size: $code-font-size;
font-family: $code-font-family;
.table-wrapper {
> table,
@@ -55,9 +70,9 @@ code, pre, .highlight table, .highlight tr, .highlight td {
}
}
// block fenced code
.highlight {
line-height: 1.4em;
margin: .5rem 0;
margin: 0.5rem 0;
> .chroma {
position: relative;
@@ -70,12 +85,15 @@ code, pre, .highlight table, .highlight tr, .highlight td {
width: 100%;
font-family: $global-font-family;
font-weight: bold;
line-height: 1.4em;
border-radius: $global-border-radius;
color: $code-info-color;
background: darken($code-background-color, 8%);
background-color: darken($code-background-color, 3%);
@include transition(border-radius 0.2s ease);
[theme=dark] & {
[theme='dark'] & {
color: $code-info-color-dark;
background: darken($code-background-color-dark, 6%);
background-color: darken($code-background-color-dark, 6%);
}
&:hover {
@@ -84,14 +102,37 @@ code, pre, .highlight table, .highlight tr, .highlight td {
.code-title {
width: 100%;
padding: .4rem;
padding: 0.4rem;
.arrow {
padding: 0 0.2rem;
@include transition(transform 0.2s ease);
}
}
.code-title::after {
padding-left: .2rem;
padding-left: 0.2rem;
content: 'Code';
}
.ellipses {
padding: 0.4rem;
}
.copy {
display: none;
padding: 0.4rem;
&:hover {
cursor: pointer;
color: $global-link-hover-color;
[theme='dark'] & {
color: $global-link-hover-color-dark;
}
}
}
@each $type, $text in $code-type-map {
&.#{$type} .code-title::after {
content: $text;
@@ -99,75 +140,72 @@ code, pre, .highlight table, .highlight tr, .highlight td {
}
}
.lntd:first-child {
min-width: 1.6rem;
text-align: right;
}
.lntd:last-child {
width: 100%;
pre {
@include max-content(min-width);
}
}
.ln {
padding-right: .75rem;
}
.hl {
display: block;
background-color: darken($code-background-color, 10%);
[theme=dark] & {
background-color: darken($code-background-color-dark, 5%);
}
}
.ln, .lnt {
color: $global-font-secondary-color;
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}
.arrow {
padding: 0 .2rem;
@include transition(transform 0.2s ease);
}
.ellipses {
padding: .4rem;
}
.copy {
display: none;
padding: .4rem;
&:hover {
cursor: pointer;
color: $global-link-hover-color;
[theme=dark] & {
color: $global-link-hover-color-dark;
}
}
}
// delayed loading table-wrapper
.table-wrapper {
max-height: 0;
overflow-y: hidden;
overflow: hidden;
border-radius: 0 0 $global-border-radius $global-border-radius;
@include details-transition-open;
}
table {
border-spacing: 0;
width: auto;
overflow: auto;
display: block;
background-color: $code-background-color;
[theme='dark'] & {
background-color: $code-background-color-dark;
}
td {
vertical-align: top;
padding: 0;
}
pre {
padding: 0.25rem;
border-radius: 0;
}
/* lineNumbersInTable=false */
.ln {
min-width: 1.35rem;
}
// ========== lineNumbersInTable ========== //
// line numbers
.lntd:first-child {
min-width: 1.6rem;
text-align: right;
pre {
padding-right: 0;
}
}
// code content
.lntd:last-child {
width: 100%;
pre {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
code {
width: 100%;
}
}
// ========== lineNumbersInTable ========== //
}
&.open {
.code-header {
background: darken($code-background-color, 3%);
background-color: darken($code-background-color, 6%);
border-radius: $global-border-radius $global-border-radius 0 0;
[theme=dark] & {
background: darken($code-background-color-dark, 3%);
[theme='dark'] & {
background-color: darken($code-background-color-dark, 3%);
}
}
@@ -190,197 +228,121 @@ code, pre, .highlight table, .highlight tr, .highlight td {
}
}
/* Comment */ .c,
/* CommentHashbang */ .ch,
/* CommentMultiline */ .cm,
/* CommentSingle */ .c1,
/* CommentSpecial */ .cs,
/* CommentPreproc */ .cp,
/* CommentPreprocFile */ .cpf { font-style: italic }
/* GenericUnderline */ .gl { text-decoration: underline }
/* LineHighlight */
.hl {
display: block;
background-color: $code-hightlight-color;
box-shadow: -0.5rem 0 0 $code-hightlight-color, 0.5rem 0 0 $code-hightlight-color;
@each $class, $color in $code-highlight-color-map {
.#{$class} { color: $color; }
}
[theme=dark] & {
@each $class, $color in $code-highlight-color-map-dark {
.#{$class} { color: $color; }
[theme='dark'] & {
background-color: $code-hightlight-color-dark;
box-shadow: -0.5rem 0 0 $code-hightlight-color-dark, 0.5rem 0 0 $code-hightlight-color-dark;
}
}
/* GenericUnderline */
.gl {
text-decoration: underline;
}
/* GenericStrong */
.gs {
font-weight: bold;
}
/* GenericEmph */
.ge {
font-style: italic;
}
/* lineNumbersInTable=false */
.ln {
padding-right: 0.5rem;
display: inline-block;
min-width: 1.1rem;
text-align: right;
}
/* LineNumbers */
.lnt,
.ln {
color: $global-font-secondary-color;
[theme='dark'] & {
color: $global-font-secondary-color-dark;
}
}
// ========== Higtlight Color ========== //
/* Error */
.err {
font-style: italic;
border-bottom: 1px dotted $code-error-color;
}
/* GenericDeleted */
.gd {
background-color: #ffebe9;
[theme='dark'] & {
background-color: #78191b;
}
}
/* GenericInserted */
.gi {
background-color: #dafbe1;
[theme='dark'] & {
background-color: #1b4721;
}
}
@each $class, $color in $code-highlight-color-map {
.#{$class} {
color: $color;
}
}
[theme='dark'] & {
@each $class, $color in $code-highlight-color-map-dark {
.#{$class} {
color: $color;
}
}
}
// ========== Higtlight Color ========== //
}
// gist shortcode
.gist {
.gist-file, .gist-data, .gist-meta {
.gist-file,
.gist-data,
.gist-meta {
border: none;
}
.gist-data {
background-color: transparent;
}
.gist-meta {
padding: .4rem .8rem;
padding: 0.4rem 0.8rem;
@include link(false, false);
background-color: darken($code-background-color, 5%);
@include link(false, false);
[theme=dark] & {
[theme='dark'] & {
background-color: darken($code-background-color-dark, 5%);
}
}
[theme=dark] & {
// imported from https://github.com/lonekorean/gist-syntax-themes/blob/master/stylesheets/one-dark.css
.highlight {
background: #141414;
}
.blob-num,
.blob-code-inner,
.table-wrapper {
.highlight,
.pl-enm,
.pl-ko,
.pl-mo,
.pl-mp1 .pl-sf,
.pl-ms,
.pl-pdc1,
.pl-scp,
.pl-smc,
.pl-som,
.pl-va,
.pl-vpf,
.pl-vpu,
.pl-mdr {
color: #aab1bf;
}
.pl-mb,
.pl-pdb {
font-weight: 700;
}
.pl-c,
.pl-c span,
.pl-pdc {
color: #5b6270;
font-style: italic;
}
.pl-sr .pl-cce {
color: #56b5c2;
font-weight: 400;
}
.pl-ef,
.pl-en,
.pl-enf,
.pl-eoai,
.pl-kos,
.pl-mh .pl-pdh,
.pl-mr {
color: #61afef;
}
.pl-ens,
.pl-vi {
color: #be5046;
}
.pl-enti,
.pl-mai .pl-sf,
.pl-ml,
.pl-sf,
.pl-sr,
.pl-sr .pl-sra,
.pl-src,
.pl-st,
.pl-vo {
color: #56b5c2;
}
.pl-eoi,
.pl-mri,
.pl-pds,
.pl-pse .pl-s1,
.pl-s,
.pl-s1 {
color: #97c279;
}
.pl-k,
.pl-kolp,
.pl-mc,
.pl-pde {
color: #c578dd;
}
.pl-mi,
.pl-pdi {
color: #c578dd;
font-style: italic;
}
.pl-mp,
.pl-stp {
color: #818896;
}
.pl-mdh,
.pl-mdi,
.pl-mdr {
font-weight: 400;
}
.pl-mdht,
.pl-mi1 {
color: #97c279;
background: #020;
}
.pl-md,
.pl-mdhf {
color: #df6b75;
background: #200;
}
.pl-corl {
color: #df6b75;
text-decoration: underline;
}
.pl-ib {
background: #df6b75;
}
.pl-ii {
background: #e0c184;
color: #fff;
}
.pl-iu {
background: #e05151;
}
.pl-ms1 {
color: #aab1bf;
background: #373b41;
}
.pl-c1,
.pl-cn,
.pl-e,
.pl-eoa,
.pl-eoac,
.pl-eoac .pl-pde,
.pl-kou,
.pl-mm,
.pl-mp .pl-s3,
.pl-mq,
.pl-s3,
.pl-sok,
.pl-sv,
.pl-mb {
color: #d19965;
}
.pl-enc,
.pl-entc,
.pl-pse .pl-s2,
.pl-s2,
.pl-sc,
.pl-smp,
.pl-sr .pl-sre,
.pl-stj,
.pl-v,
.pl-pdb {
color: #e4bf7a;
}
.pl-ent,
.pl-entl,
.pl-entm,
.pl-mh,
.pl-pdv,
.pl-smi,
.pl-sol,
.pl-mdh,
.pl-mdi {
color: #df6b75;
&::-webkit-scrollbar {
background-color: #f6f8fa;
[theme='dark'] & {
background-color: #2d333b;
}
}
}
[theme='dark'] & {
@import './github-dark-dimmed';
}
}
assets/css/_partial/_single/_github-dark-dimmed.scss
+169
View File
@@ -0,0 +1,169 @@
/**
* Theme: GitHub Dark Dimmed
* Description: Dark Dimmed theme as seen on github.com
* Author: github.com
* Maintainer: https://github.com/Lruihao/FixIt
* Updated: 2022-03-01
*/
& {
--color-fg-default: #adbac7;
--color-prettylights-syntax-comment: #768390;
--color-prettylights-syntax-constant: #6cb6ff;
--color-prettylights-syntax-entity: #dcbdfb;
--color-prettylights-syntax-storage-modifier-import: #adbac7;
--color-prettylights-syntax-entity-tag: #8ddb8c;
--color-prettylights-syntax-keyword: #f47067;
--color-prettylights-syntax-string: #96d0ff;
--color-prettylights-syntax-variable: #f69d50;
--color-prettylights-syntax-brackethighlighter-unmatched: #e5534b;
--color-prettylights-syntax-invalid-illegal-text: #cdd9e5;
--color-prettylights-syntax-invalid-illegal-bg: #922323;
--color-prettylights-syntax-carriage-return-text: #cdd9e5;
--color-prettylights-syntax-carriage-return-bg: #ad2e2c;
--color-prettylights-syntax-string-regexp: #8ddb8c;
--color-prettylights-syntax-markup-list: #eac55f;
--color-prettylights-syntax-markup-heading: #316dca;
--color-prettylights-syntax-markup-italic: #adbac7;
--color-prettylights-syntax-markup-bold: #adbac7;
--color-prettylights-syntax-markup-deleted-text: #ffd8d3;
--color-prettylights-syntax-markup-deleted-bg: #78191b;
--color-prettylights-syntax-markup-inserted-text: #b4f1b4;
--color-prettylights-syntax-markup-inserted-bg: #1b4721;
--color-prettylights-syntax-markup-changed-text: #ffddb0;
--color-prettylights-syntax-markup-changed-bg: #682d0f;
--color-prettylights-syntax-markup-ignored-text: #adbac7;
--color-prettylights-syntax-markup-ignored-bg: #255ab2;
--color-prettylights-syntax-meta-diff-range: #dcbdfb;
--color-prettylights-syntax-brackethighlighter-angle: #768390;
--color-prettylights-syntax-sublimelinter-gutter-mark: #545d68;
--color-prettylights-syntax-constant-other-reference-link: #96d0ff;
.blob-num,
.blob-code-inner {
color: val(--color-fg-default);
}
.pl-c /* comment, punctuation.definition.comment, string.comment */ {
color: var(--color-prettylights-syntax-comment);
}
.pl-c1 /* constant, entity.name.constant, variable.other.constant, variable.language, support, meta.property-name, support.constant, support.variable, meta.module-reference, markup.raw, meta.diff.header, meta.output */,
.pl-s .pl-v /* string variable */ {
color: var(--color-prettylights-syntax-constant);
}
.pl-e /* entity */,
.pl-en /* entity.name */ {
color: var(--color-prettylights-syntax-entity);
}
.pl-smi /* variable.parameter.function, storage.modifier.package, storage.modifier.import, storage.type.java, variable.other */,
.pl-s .pl-s1 /* string source */ {
color: var(--color-prettylights-syntax-storage-modifier-import);
}
.pl-ent /* entity.name.tag, markup.quote */ {
color: var(--color-prettylights-syntax-entity-tag);
}
.pl-k /* keyword, storage, storage.type */ {
color: var(--color-prettylights-syntax-keyword);
}
.pl-s /* string */,
.pl-pds /* punctuation.definition.string, source.regexp, string.regexp.character-class */,
.pl-s .pl-pse .pl-s1 /* string punctuation.section.embedded source */,
.pl-sr /* string.regexp */,
.pl-sr .pl-cce /* string.regexp constant.character.escape */,
.pl-sr .pl-sre /* string.regexp source.ruby.embedded */,
.pl-sr .pl-sra /* string.regexp string.regexp.arbitrary-repitition */ {
color: var(--color-prettylights-syntax-string);
}
.pl-v /* variable */,
.pl-smw /* sublimelinter.mark.warning */ {
color: var(--color-prettylights-syntax-variable);
}
.pl-bu /* invalid.broken, invalid.deprecated, invalid.unimplemented, message.error, brackethighlighter.unmatched, sublimelinter.mark.error */ {
color: var(--color-prettylights-syntax-brackethighlighter-unmatched);
}
.pl-ii /* invalid.illegal */ {
color: var(--color-prettylights-syntax-invalid-illegal-text);
background-color: var(--color-prettylights-syntax-invalid-illegal-bg);
}
.pl-c2 /* carriage-return */ {
color: var(--color-prettylights-syntax-carriage-return-text);
background-color: var(--color-prettylights-syntax-carriage-return-bg);
}
.pl-c2::before /* carriage-return */ {
content: '^M';
}
.pl-sr .pl-cce /* string.regexp constant.character.escape */ {
font-weight: bold;
color: var(--color-prettylights-syntax-string-regexp);
}
.pl-ml /* markup.list */ {
color: var(--color-prettylights-syntax-markup-list);
}
.pl-mh /* markup.heading */,
.pl-mh .pl-en /* markup.heading entity.name */,
.pl-ms /* meta.separator */ {
font-weight: bold;
color: var(--color-prettylights-syntax-markup-heading);
}
.pl-mi /* markup.italic */ {
font-style: italic;
color: var(--color-prettylights-syntax-markup-italic);
}
.pl-mb /* markup.bold */ {
font-weight: bold;
color: var(--color-prettylights-syntax-markup-bold);
}
.pl-md /* markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted */ {
color: var(--color-prettylights-syntax-markup-deleted-text);
background-color: var(--color-prettylights-syntax-markup-deleted-bg);
}
.pl-mi1 /* markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted */ {
color: var(--color-prettylights-syntax-markup-inserted-text);
background-color: var(--color-prettylights-syntax-markup-inserted-bg);
}
.pl-mc /* markup.changed, punctuation.definition.changed */ {
color: var(--color-prettylights-syntax-markup-changed-text);
background-color: var(--color-prettylights-syntax-markup-changed-bg);
}
.pl-mi2 /* markup.ignored, markup.untracked */ {
color: var(--color-prettylights-syntax-markup-ignored-text);
background-color: var(--color-prettylights-syntax-markup-ignored-bg);
}
.pl-mdr /* meta.diff.range */ {
font-weight: bold;
color: var(--color-prettylights-syntax-meta-diff-range);
}
.pl-ba /* brackethighlighter.tag, brackethighlighter.curly, brackethighlighter.round, brackethighlighter.square, brackethighlighter.angle, brackethighlighter.quote */ {
color: var(--color-prettylights-syntax-brackethighlighter-angle);
}
.pl-sg /* sublimelinter.gutter-mark */ {
color: var(--color-prettylights-syntax-sublimelinter-gutter-mark);
}
.pl-corl /* constant.other.reference.link, string.other.link */ {
text-decoration: underline;
color: var(--color-prettylights-syntax-constant-other-reference-link);
}
}
assets/css/_variables.scss
+166 -154
View File
@@ -9,8 +9,11 @@ $global-font-size: 16px;
$global-font-weight: 400;
$global-line-height: 1.5rem;
// Radius of the border
$global-border-radius: 5px !default;
// Color of the background
$global-background-color: #fff !default;
$global-background-color: #ffffff !default;
$global-background-color-dark: #292a2d !default;
// Color of the text
@@ -40,9 +43,6 @@ $scrollbar-color: #87878d !default;
// Color of the hover scrollbar
$scrollbar-hover-color: #a9a9b3 !default;
// radius of the scrollbar
$scrollbar-radius: 5px !default;
// ========== Scrollbar ========== //
// ========== Selection ========== //
@@ -110,12 +110,18 @@ $pagination-link-hover-color-dark: #fff !default;
// ========== Code ========== //
// Color of the code
$code-color: #E74C3C !default;
$code-color-dark: #E5BF78 !default;
$code-color: #24292f !default;
$code-color-dark: #adbac7 !default;
// Color of the code background
$code-background-color: #f5f5f5 !default;
$code-background-color-dark: #272C34 !default;
$code-background-color: #f6f8fa !default;
$code-background-color-dark: #2d333b !default;
$code-error-color: #dc3545 !default;
// Color of the hightlight code
$code-hightlight-color: #fff8c5 !default;
$code-hightlight-color-dark: rgba(174, 124, 20, 0.15) !default;
$code-info-color: #9c9c9c !default;
$code-info-color-dark: #b1b0b0 !default;
@@ -181,154 +187,160 @@ $code-type-map: (
// Color map of the code highlight
$code-highlight-color-map: (
/* Parentheses */ 'p': #a9a9b3,
/* Keyword */ 'k': #b501a9,
/* KeywordConstant */ 'kc': #b501a9,
/* KeywordDeclaration */ 'kd': #b501a9,
/* KeywordNamespace */ 'kn': #b501a9,
/* KeywordPseudo */ 'kp': #b501a9,
/* KeywordReserved */ 'kr': #b501a9,
/* KeywordType */ 'kt': #b501a9,
/* Name */ 'n': #333333,
/* NameAttribute */ 'na': #2b77fa,
/* NameBuiltin */ 'nb': #f74840,
/* NameBuiltinPseudo */ 'bp': #f74840,
/* NameClass */ 'nc': #cb8100,
/* NameConstant */ 'no': #2b77fa,
/* NameDecorator */ 'nd': #0086c1,
/* NameEntity */ 'ni': #2b77fa,
/* NameException */ 'ne': #2b77fa,
/* NameFunction */ 'nf': #2b77fa,
/* NameFunctionMagic */ 'fm': #1ccad6,
/* NameLabel */ 'nl': #2b77fa,
/* NameNamespace */ 'nn': #2b77fa,
/* NameOther */ 'nx': #333333,
/* NameProperty */ 'py': #2b77fa,
/* NameTag */ 'nt': #2b77fa,
/* NameVariable */ 'nv': #2b77fa,
/* NameVariableClass */ 'vc': #2b77fa,
/* NameVariableGlobal */ 'vg': #2b77fa,
/* NameVariableInstance */ 'vi': #2b77fa,
/* NameVariableMagic */ 'vm': #2b77fa,
/* Literal */ 'l': #2aa198,
/* LiteralDate */ 'ld': #2aa198,
/* LiteralString */ 's': #24a443,
/* LiteralStringAffix */ 'sa': #24a443,
/* LiteralStringBacktick */ 'sb': #24a443,
/* LiteralStringChar */ 'sc': #24a443,
/* LiteralStringDelimiter */ 'dl': #24a443,
/* LiteralStringDoc */ 'sd': #24a443,
/* LiteralStringDouble */ 's2': #24a443,
/* LiteralStringEscape */ 'se': #24a443,
/* LiteralStringHeredoc */ 'sh': #24a443,
/* LiteralStringInterpol */ 'si': #24a443,
/* LiteralStringOther */ 'sx': #24a443,
/* LiteralStringRegex */ 'sr': #24a443,
/* LiteralStringSingle */ 's1': #24a443,
/* LiteralStringSymbol */ 'ss': #24a443,
/* LiteralNumber */ 'm': #e2893c,
/* LiteralNumberBin */ 'mb': #e2893c,
/* LiteralNumberFloat */ 'mf': #e2893c,
/* LiteralNumberHex */ 'mh': #e2893c,
/* LiteralNumberInteger */ 'mi': #e2893c,
/* LiteralNumberIntegerLong */ 'il': #e2893c,
/* LiteralNumberOct */ 'mo': #e2893c,
/* Operator */ 'o': #f19b04,
/* OperatorWord */ 'ow': #b501a9,
/* Comment */ 'c': #a0a1a8,
/* CommentHashbang */ 'ch': #a0a1a8,
/* CommentMultiline */ 'cm': #a0a1a8,
/* CommentSingle */ 'c1': #a0a1a8,
/* CommentSpecial */ 'cs': #a0a1a8,
/* CommentPreproc */ 'cp': #a0a1a8,
/* CommentPreprocFile */ 'cpf': #a0a1a8,
/* Generic */ 'g': #e72d40,
/* GenericDeleted */ 'gd': #e72d40,
/* GenericEmph */ 'ge': #e72d40,
/* GenericError */ 'gr': #e72d40,
/* GenericHeading */ 'gh': #e72d40,
/* GenericInserted */ 'gi': #e72d40,
/* GenericOutput */ 'go': #e72d40,
/* GenericPrompt */ 'gp': #e72d40,
/* GenericStrong */ 'gs': #e72d40,
/* GenericSubheading */ 'gu': #e72d40,
/* GenericTraceback */ 'gt': #e72d40,
/* TextWhitespace */ 'w': #bbbbbb,
/* Error */ 'err': $code-error-color,
/* Keyword */ 'k': #cf222e,
/* KeywordConstant */ 'kc': #0550ae,
/* KeywordDeclaration */ 'kd': #cf222e,
/* KeywordNamespace */ 'kn': #cf222e,
/* KeywordPseudo */ 'kp': #cf222e,
/* KeywordReserved */ 'kr': #cf222e,
/* KeywordType */ 'kt': #cf222e,
/* Name */ 'n': $code-color,
/* NameAttribute */ 'na': #0550ae,
/* NameBuiltin */ 'nb': #0550ae,
/* NameBuiltinPseudo */ 'bp': $code-color,
/* NameClass */ 'nc': #8250df,
/* NameConstant */ 'no': #cf222e,
/* NameDecorator */ 'nd': #8250df,
/* NameEntity */ 'ni': #0550ae,
/* NameException */ 'ne': #0550ae,
/* NameFunction */ 'nf': #0550ae,
/* NameFunctionMagic */ 'fm': #0550ae,
/* NameLabel */ 'nl': #0550ae,
/* NameNamespace */ 'nn': #8250df,
/* NameOther */ 'nx': #0550ae,
/* NameProperty */ 'py': #0550ae,
/* NameTag */ 'nt': #116329,
/* NameVariable */ 'nv': #953800,
/* NameVariableClass */ 'vc': #0550ae,
/* NameVariableGlobal */ 'vg': #0550ae,
/* NameVariableInstance */ 'vi': #0550ae,
/* NameVariableMagic */ 'vm': #0550ae,
/* Literal */ 'l': #0550ae,
/* LiteralDate */ 'ld': #0a3069,
/* LiteralString */ 's': #0a3069,
/* LiteralStringAffix */ 'sa': #0a3069,
/* LiteralStringBacktick */ 'sb': #0a3069,
/* LiteralStringChar */ 'sc': #0a3069,
/* LiteralStringDelimiter */ 'dl': #0a3069,
/* LiteralStringDoc */ 'sd': #0a3069,
/* LiteralStringDouble */ 's2': #0a3069,
/* LiteralStringEscape */ 'se': #0a3069,
/* LiteralStringHeredoc */ 'sh': #0a3069,
/* LiteralStringInterpol */ 'si': #0a3069,
/* LiteralStringOther */ 'sx': #0a3069,
/* LiteralStringRegex */ 'sr': #0a3069,
/* LiteralStringSingle */ 's1': #0a3069,
/* LiteralStringSymbol */ 'ss': #0a3069,
/* LiteralNumber */ 'm': #0550ae,
/* LiteralNumberBin */ 'mb': #0550ae,
/* LiteralNumberFloat */ 'mf': #0550ae,
/* LiteralNumberHex */ 'mh': #0550ae,
/* LiteralNumberInteger */ 'mi': #0550ae,
/* LiteralNumberIntegerLong */ 'il': #0550ae,
/* LiteralNumberOct */ 'mo': #0550ae,
/* Operator */ 'o': #cf222e,
/* OperatorWord */ 'ow': #cf222e,
/* Punctuation */ 'p': $code-color,
/* Comment */ 'c': #6e7781,
/* CommentHashbang */ 'ch': #6e7781,
/* CommentMultiline */ 'cm': #6e7781,
/* CommentSingle */ 'c1': #6e7781,
/* CommentSpecial */ 'cs': #6e7781,
/* CommentPreproc */ 'cp': #0550ae,
/* CommentPreprocFile */ 'cpf': #6e7781,
/* Generic */ 'g': $code-color,
/* GenericDeleted */ 'gd': #82071e,
/* GenericEmph */ 'ge': $code-color,
/* GenericError */ 'gr': $code-error-color,
/* GenericHeading */ 'gh': $code-color,
/* GenericInserted */ 'gi': #116329,
/* GenericOutput */ 'go': $code-color,
/* GenericPrompt */ 'gp': $code-color,
/* GenericStrong */ 'gs': $code-color,
/* GenericSubheading */ 'gu': $code-color,
/* GenericTraceback */ 'gt': $code-error-color,
/* GenericUnderline */ 'gl': $code-color,
/* TextWhitespace */ 'w': $code-color,
/* Other */ 'x': $code-color
) !default;
$code-highlight-color-map-dark: (
/* Parentheses */ 'p': #a9a9b3,
/* Keyword */ 'k': #d371e3,
/* KeywordConstant */ 'kc': #d371e3,
/* KeywordDeclaration */ 'kd': #d371e3,
/* KeywordNamespace */ 'kn': #d371e3,
/* KeywordPseudo */ 'kp': #d371e3,
/* KeywordReserved */ 'kr': #d371e3,
/* KeywordType */ 'kt': #d371e3,
/* Name */ 'n': #a9b2c0,
/* NameAttribute */ 'na': #41b0f5,
/* NameBuiltin */ 'nb': #19b9c4,
/* NameBuiltinPseudo */ 'bp': #ecbf6f,
/* NameClass */ 'nc': #ecbf6f,
/* NameConstant */ 'no': #41b0f5,
/* NameDecorator */ 'nd': #ecbf6f,
/* NameEntity */ 'ni': #41b0f5,
/* NameException */ 'ne': #41b0f5,
/* NameFunction */ 'nf': #41b0f5,
/* NameFunctionMagic */ 'fm': #19b9c4,
/* NameLabel */ 'nl': #41b0f5,
/* NameNamespace */ 'nn': #41b0f5,
/* NameOther */ 'nx': #a9a9b3,
/* NameProperty */ 'py': #41b0f5,
/* NameTag */ 'nt': #41b0f5,
/* NameVariable */ 'nv': #41b0f5,
/* NameVariableClass */ 'vc': #41b0f5,
/* NameVariableGlobal */ 'vg': #41b0f5,
/* NameVariableInstance */ 'vi': #41b0f5,
/* NameVariableMagic */ 'vm': #41b0f5,
/* Literal */ 'l': #2aa198,
/* LiteralDate */ 'ld': #2aa198,
/* LiteralString */ 's': #8cc570,
/* LiteralStringAffix */ 'sa': #8cc570,
/* LiteralStringBacktick */ 'sb': #8cc570,
/* LiteralStringChar */ 'sc': #8cc570,
/* LiteralStringDelimiter */ 'dl': #8cc570,
/* LiteralStringDoc */ 'sd': #8cc570,
/* LiteralStringDouble */ 's2': #8cc570,
/* LiteralStringEscape */ 'se': #8cc570,
/* LiteralStringHeredoc */ 'sh': #8cc570,
/* LiteralStringInterpol */ 'si': #8cc570,
/* LiteralStringOther */ 'sx': #8cc570,
/* LiteralStringRegex */ 'sr': #8cc570,
/* LiteralStringSingle */ 's1': #8cc570,
/* LiteralStringSymbol */ 'ss': #8cc570,
/* LiteralNumber */ 'm': #db985c,
/* LiteralNumberBin */ 'mb': #db985c,
/* LiteralNumberFloat */ 'mf': #db985c,
/* LiteralNumberHex */ 'mh': #db985c,
/* LiteralNumberInteger */ 'mi': #db985c,
/* LiteralNumberIntegerLong */ 'il': #db985c,
/* LiteralNumberOct */ 'mo': #db985c,
/* Operator */ 'o': #ecbf6f,
/* OperatorWord */ 'ow': #d371e3,
/* Comment */ 'c': #7e848f,
/* CommentHashbang */ 'ch': #7e848f,
/* CommentMultiline */ 'cm': #7e848f,
/* CommentSingle */ 'c1': #7e848f,
/* CommentSpecial */ 'cs': #7e848f,
/* CommentPreproc */ 'cp': #7e848f,
/* CommentPreprocFile */ 'cpf': #7e848f,
/* Generic */ 'g': #f16372,
/* GenericDeleted */ 'gd': #f16372,
/* GenericEmph */ 'ge': #f16372,
/* GenericError */ 'gr': #f16372,
/* GenericHeading */ 'gh': #f16372,
/* GenericInserted */ 'gi': #f16372,
/* GenericOutput */ 'go': #f16372,
/* GenericPrompt */ 'gp': #f16372,
/* GenericStrong */ 'gs': #f16372,
/* GenericSubheading */ 'gu': #f16372,
/* GenericTraceback */ 'gt': #f16372,
/* TextWhitespace */ 'w': #bbbbbb,
/* Error */ 'err': $code-error-color,
/* Keyword */ 'k': #f47067,
/* KeywordConstant */ 'kc': #6cb6ff,
/* KeywordDeclaration */ 'kd': #f47067,
/* KeywordNamespace */ 'kn': #f47067,
/* KeywordPseudo */ 'kp': #f47067,
/* KeywordReserved */ 'kr': #f47067,
/* KeywordType */ 'kt': #f47067,
/* Name */ 'n': $code-color-dark,
/* NameAttribute */ 'na': #6cb6ff,
/* NameBuiltin */ 'nb': #dcbdfb,
/* NameBuiltinPseudo */ 'bp': $code-color-dark,
/* NameClass */ 'nc': #dcbdfb,
/* NameConstant */ 'no': #6cb6ff,
/* NameDecorator */ 'nd': #dcbdfb,
/* NameEntity */ 'ni': #6cb6ff,
/* NameException */ 'ne': #6cb6ff,
/* NameFunction */ 'nf': #dcbdfb,
/* NameFunctionMagic */ 'fm': #6cb6ff,
/* NameLabel */ 'nl': #6cb6ff,
/* NameNamespace */ 'nn': #f47067,
/* NameOther */ 'nx': #dcbdfb,
/* NameProperty */ 'py': #6cb6ff,
/* NameTag */ 'nt': #8ddb8c,
/* NameVariable */ 'nv': #f69d50,
/* NameVariableClass */ 'vc': #6cb6ff,
/* NameVariableGlobal */ 'vg': #6cb6ff,
/* NameVariableInstance */ 'vi': #6cb6ff,
/* NameVariableMagic */ 'vm': #6cb6ff,
/* Literal */ 'l': #6cb6ff,
/* LiteralDate */ 'ld': #96d0ff,
/* LiteralString */ 's': #96d0ff,
/* LiteralStringAffix */ 'sa': #96d0ff,
/* LiteralStringBacktick */ 'sb': #96d0ff,
/* LiteralStringChar */ 'sc': #96d0ff,
/* LiteralStringDelimiter */ 'dl': #96d0ff,
/* LiteralStringDoc */ 'sd': #96d0ff,
/* LiteralStringDouble */ 's2': #96d0ff,
/* LiteralStringEscape */ 'se': #96d0ff,
/* LiteralStringHeredoc */ 'sh': #96d0ff,
/* LiteralStringInterpol */ 'si': #96d0ff,
/* LiteralStringOther */ 'sx': #96d0ff,
/* LiteralStringRegex */ 'sr': #96d0ff,
/* LiteralStringSingle */ 's1': #96d0ff,
/* LiteralStringSymbol */ 'ss': #96d0ff,
/* LiteralNumber */ 'm': #6cb6ff,
/* LiteralNumberBin */ 'mb': #6cb6ff,
/* LiteralNumberFloat */ 'mf': #6cb6ff,
/* LiteralNumberHex */ 'mh': #6cb6ff,
/* LiteralNumberInteger */ 'mi': #6cb6ff,
/* LiteralNumberIntegerLong */ 'il': #6cb6ff,
/* LiteralNumberOct */ 'mo': #6cb6ff,
/* Operator */ 'o': #f47067,
/* OperatorWord */ 'ow': #f47067,
/* Punctuation */ 'p': $code-color-dark,
/* Comment */ 'c': #768390,
/* CommentHashbang */ 'ch': #768390,
/* CommentMultiline */ 'cm': #768390,
/* CommentSingle */ 'c1': #768390,
/* CommentSpecial */ 'cs': #768390,
/* CommentPreproc */ 'cp': #6cb6ff,
/* CommentPreprocFile */ 'cpf': #768390,
/* Generic */ 'g': $code-color-dark,
/* GenericDeleted */ 'gd': #ffd8d3,
/* GenericEmph */ 'ge': $code-color-dark,
/* GenericError */ 'gr': $code-error-color,
/* GenericHeading */ 'gh': $code-color-dark,
/* GenericInserted */ 'gi': #b4f1b4,
/* GenericOutput */ 'go': $code-color-dark,
/* GenericPrompt */ 'gp': $code-color-dark,
/* GenericStrong */ 'gs': $code-color-dark,
/* GenericSubheading */ 'gu': $code-color-dark,
/* GenericTraceback */ 'gt': $code-error-color,
/* GenericUnderline */ 'gl': $code-color-dark,
/* TextWhitespace */ 'w': $code-color-dark,
/* Other */ 'x': $code-color-dark,
) !default;
// ========== Code ========== //
exampleSite/config.toml
+4 -3
View File
@@ -1068,13 +1068,14 @@ enableEmoji = true
# Syntax Highlighting (https://gohugo.io/content-management/syntax-highlighting)
# 语法高亮设置 (https://gohugo.io/content-management/syntax-highlighting)
[markup.highlight]
########## necessary configuration ##########
# https://github.com/Lruihao/FixIt/issues/43
codeFences = true
guessSyntax = true
lineNos = true
lineNumbersInTable = true
# false is a necessary configuration (https://github.com/dillonzq/LoveIt/issues/158)
# false 是必要的设置 (https://github.com/dillonzq/LoveIt/issues/158)
noClasses = false
########## necessary configuration ##########
guessSyntax = true
# Goldmark is from Hugo 0.60 the default library used for Markdown
# Goldmark 是 Hugo 0.60 以来的默认 Markdown 解析库
[markup.goldmark]
exampleSite/content/tests/highlight.md
+163
View File
@@ -0,0 +1,163 @@
---
title: "Highlight Code"
date: 2022-02-27T18:45:22+08:00
type: 'posts'
draft: true
---
`inline code`
```markdown
1. first
2. second
> bq
**blod** *italic*
---
+++
***
```
```java
/**
* @author John Smith <john.smith@example.com>
*/
package l2f.gameserver.model;
public abstract strictfp class L2Char extends L2Object {
public static final Short ERROR = 0x0001;
public void moveTo(int x, int y, int z) {
_ai = null;
log("Should not be called");
if (1 > 5) { // wtf!?
return;
}
}
}
```
```go
package main
import "fmt"
func main() {
ch := make(chan float64)
ch <- 1.0e10 // magic number
x, ok := <- ch
defer fmt.Println(`exitting now\`)
go println(len("hello world!"))
return
}
```
```scss
pre {
margin: 0;
padding: .25rem 0 .25rem .5rem;
overflow: auto;
@include tab-size(4);
background: $code-background-color;
[theme=dark] & {
background: $code-background-color-dark;
}
code {
padding: 0;
}
img {
min-height: 1em;
max-height: 1.2em;
vertical-align: text-bottom;
}
}
```
```diff
- theme = "LoveIt"
+ theme = "FixIt"
! enhancements and fixes
```
```javascript
function $initHighlight(block, cls) {
try {
if (cls.search(/\bno\-highlight\b/) != -1)
return process(block, true, 0x0F) +
` class="${cls}"`;
} catch (e) {
/* handle exception */
}
for (var i = 0 / 2; i < classes.length; i++) {
if (checkCondition(classes[i]) === undefined)
console.log('undefined');
}
return (
<div>
<web-component>{block}</web-component>
</div>
)
}
export $initHighlight;
```
```html
<!DOCTYPE html>
<title>Title</title>
<style>body {width: 500px;}</style>
<script type="application/javascript">
function $init() {return true;}
</script>
<body>
<p checked class="title" id='title'>Title</p>
<!-- here goes the rest of the page -->
</body>
```
```yaml
# - nickname: 标题
# avatar: 头像
# url: 站点
# description: 描述
- nickname: Lruihao
avatar: https://gravatar.loli.net/avatar/3f985efb5907ca52944a3cd7edd51606?d=wavatar&v=1.3.10
url: https://lruihao.cn
description: 不怕萬人阻擋，只怕自己投降
```
```html
<p>Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.</p>
```
<p>Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.</p>
{{< highlight javascript "linenos=table,hl_lines=6-9,linenostart=287" >}}
/**
* 把字符串的文件後綴轉成數組
* @param {String} str 待轉化字符串
* @returns {Array|null} 轉化后的數組
*/
var _str2Array = (str) => {
if (typeof (str) !== String && !Array.isArray(str)) {
return null;
}
if (!Array.isArray(str)) {
return str.split(',');
}
};
{{< / highlight >}}
---
{{< gist spf13 7896402 >}}