Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 8ce2fff

Browse files
jemus42jemus42
committed
CSS / JS is at least incorporated and not broken
1 parent 8e1f070 commit 8ce2fff

File tree

11 files changed

+635
-29
lines changed

11 files changed

+635
-29
lines changed

‎assets/js/jemsu.js‎

Lines changed: 0 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -5,29 +5,6 @@ littlefoot.default({
55
buttonTemplate: '<button aria-label="Footnote <% number %>" class="littlefoot__button" id="<% reference %>" title="See Footnote <% number %>" /> <% number %> </button>'
66
})
77

8-
// Color theme toggler via zookee1 <3
9-
function toggleDarkMode() {
10-
let bodyClassList = document.body.classList;
11-
let userPreferredIsLight = (window.matchMedia('(prefers-color-scheme: light)').matches)
12-
13-
if (!bodyClassList.contains('colorscheme-dark') &&
14-
!bodyClassList.contains('colorscheme-light')) {
15-
bodyClassList.remove("colorscheme-auto");
16-
if (userPreferredIsLight) {
17-
bodyClassList.add("colorscheme-dark");
18-
} else {
19-
bodyClassList.add("colorscheme-light");
20-
}
21-
} else {
22-
if (bodyClassList.contains('colorscheme-dark')) {
23-
bodyClassList.add("colorscheme-light");
24-
bodyClassList.remove("colorscheme-dark");
25-
} else if (bodyClassList.contains('colorscheme-light')) {
26-
bodyClassList.add("colorscheme-dark");
27-
bodyClassList.remove("colorscheme-light");
28-
}
29-
}
30-
}
318

329
// Scroll to top thing: https://www.w3schools.com/howto/howto_js_scroll_to_top.asp
3310

‎assets/scss/_mathjax.scss‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
/* Mathjax fixes in dark/light mode because in Rmd it's enclosed in <code> */
2+
3+
@mixin math-light {
4+
mjx-container {
5+
background-color: $bg-color;
6+
border: 0;
7+
}
8+
}
9+
10+
@mixin math-dark {
11+
mjx-container {
12+
background-color: $bg-color-dark;
13+
border: 0;
14+
color: $fg-color-dark;
15+
}
16+
}

‎assets/scss/_monokai.scss‎

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
$monokai-bg-dark: #1D1D1D !default;
2+
$monokai-bg-light: #f3f3f3 !default;
3+
4+
@mixin monokai-base {
5+
/* Other */ .chroma .x { }
6+
/* Error */ .chroma .err { color: #960050; background-color: #1e0010 }
7+
/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
8+
/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
9+
/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
10+
/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
11+
/* KeywordNamespace */ .chroma .kn { color: #f92672 }
12+
/* NameTag */ .chroma .nt { color: #f92672 }
13+
/* Literal */ .chroma .l { color: #ae81ff }
14+
/* LiteralNumber */ .chroma .m { color: #ae81ff }
15+
/* LiteralNumberBin */ .chroma .mb { color: #ae81ff }
16+
/* LiteralNumberFloat */ .chroma .mf { color: #ae81ff }
17+
/* LiteralNumberHex */ .chroma .mh { color: #ae81ff }
18+
/* LiteralNumberInteger */ .chroma .mi { color: #ae81ff }
19+
/* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff }
20+
/* LiteralNumberOct */ .chroma .mo { color: #ae81ff }
21+
/* OperatorWord */ .chroma .ow { color: #f92672 }
22+
/* Comment */ .chroma .c { color: #75715e }
23+
/* CommentHashbang */ .chroma .ch { color: #75715e }
24+
/* CommentMultiline */ .chroma .cm { color: #75715e }
25+
/* CommentSingle */ .chroma .c1 { color: #75715e }
26+
/* CommentSpecial */ .chroma .cs { color: #75715e }
27+
/* CommentPreproc */ .chroma .cp { color: #75715e }
28+
/* CommentPreprocFile */ .chroma .cpf { color: #75715e }
29+
/* Generic */ .chroma .g { }
30+
/* GenericEmph */ .chroma .ge { font-style: italic }
31+
/* GenericError */ .chroma .gr { }
32+
/* GenericHeading */ .chroma .gh { }
33+
/* GenericOutput */ .chroma .go { }
34+
/* GenericPrompt */ .chroma .gp { }
35+
/* GenericStrong */ .chroma .gs { font-weight: bold }
36+
/* GenericTraceback */ .chroma .gt { }
37+
/* GenericUnderline */ .chroma .gl { }
38+
// /* Text */ .chroma . { }
39+
/* TextWhitespace */ .chroma .w { }
40+
}
41+
42+
@mixin monokai-dark {
43+
/* Background */ .chroma { color: #f8f8f2; background-color: $monokai-bg-dark }
44+
/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #484828 }
45+
/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
46+
/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
47+
/* Keyword */ .chroma .k { color: #66d9ef }
48+
/* KeywordConstant */ .chroma .kc { color: #66d9ef }
49+
/* KeywordDeclaration */ .chroma .kd { color: #66d9ef }
50+
/* KeywordPseudo */ .chroma .kp { color: #66d9ef }
51+
/* KeywordReserved */ .chroma .kr { color: #66d9ef }
52+
/* KeywordType */ .chroma .kt { color: #66d9ef }
53+
/* Name */ .chroma .n { }
54+
/* NameAttribute */ .chroma .na { color: #a6e22e }
55+
/* NameBuiltin */ .chroma .nb { }
56+
/* NameBuiltinPseudo */ .chroma .bp { }
57+
/* NameClass */ .chroma .nc { color: #a6e22e }
58+
/* NameConstant */ .chroma .no { color: #66d9ef }
59+
/* NameDecorator */ .chroma .nd { color: #a6e22e }
60+
/* NameEntity */ .chroma .ni { }
61+
/* NameException */ .chroma .ne { color: #a6e22e }
62+
/* NameFunction */ .chroma .nf { color: #a6e22e }
63+
/* NameFunctionMagic */ .chroma .fm { }
64+
/* NameLabel */ .chroma .nl { }
65+
/* NameNamespace */ .chroma .nn { }
66+
/* NameOther */ .chroma .nx { color: #a6e22e }
67+
/* NameProperty */ .chroma .py { }
68+
/* NameVariable */ .chroma .nv { }
69+
/* NameVariableClass */ .chroma .vc { }
70+
/* NameVariableGlobal */ .chroma .vg { }
71+
/* NameVariableInstance */ .chroma .vi { }
72+
/* NameVariableMagic */ .chroma .vm { }
73+
/* LiteralDate */ .chroma .ld { color: #e6db74 }
74+
/* LiteralString */ .chroma .s { color: #e6db74 }
75+
/* LiteralStringAffix */ .chroma .sa { color: #e6db74 }
76+
/* LiteralStringBacktick */ .chroma .sb { color: #e6db74 }
77+
/* LiteralStringChar */ .chroma .sc { color: #e6db74 }
78+
/* LiteralStringDelimiter */ .chroma .dl { color: #e6db74 }
79+
/* LiteralStringDoc */ .chroma .sd { color: #e6db74 }
80+
/* LiteralStringDouble */ .chroma .s2 { color: #e6db74 }
81+
/* LiteralStringEscape */ .chroma .se { color: #ae81ff }
82+
/* LiteralStringHeredoc */ .chroma .sh { color: #e6db74 }
83+
/* LiteralStringInterpol */ .chroma .si { color: #e6db74 }
84+
/* LiteralStringOther */ .chroma .sx { color: #e6db74 }
85+
/* LiteralStringRegex */ .chroma .sr { color: #e6db74 }
86+
/* LiteralStringSingle */ .chroma .s1 { color: #e6db74 }
87+
/* LiteralStringSymbol */ .chroma .ss { color: #e6db74 }
88+
/* Operator */ .chroma .o { color: #fb2976 }
89+
/* Punctuation */ .chroma .p { }
90+
/* GenericDeleted */ .chroma .gd { color: #f92672 }
91+
/* GenericInserted */ .chroma .gi { color: #a6e22e }
92+
/* GenericSubheading */ .chroma .gu { color: #75715e }
93+
}
94+
95+
@mixin monokai-light {
96+
/* Background */ .chroma { color: #272822; background-color: $monokai-bg-light }
97+
/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
98+
/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
99+
/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
100+
/* Keyword */ .chroma .k { color: #00a8c8 }
101+
/* KeywordConstant */ .chroma .kc { color: #00a8c8 }
102+
/* KeywordDeclaration */ .chroma .kd { color: #00a8c8 }
103+
/* KeywordPseudo */ .chroma .kp { color: #00a8c8 }
104+
/* KeywordReserved */ .chroma .kr { color: #00a8c8 }
105+
/* KeywordType */ .chroma .kt { color: #00a8c8 }
106+
/* Name */ .chroma .n { color: #111111 }
107+
/* NameAttribute */ .chroma .na { color: #75af00 }
108+
/* NameBuiltin */ .chroma .nb { color: #111111 }
109+
/* NameBuiltinPseudo */ .chroma .bp { color: #111111 }
110+
/* NameClass */ .chroma .nc { color: #75af00 }
111+
/* NameConstant */ .chroma .no { color: #00a8c8 }
112+
/* NameDecorator */ .chroma .nd { color: #75af00 }
113+
/* NameEntity */ .chroma .ni { color: #111111 }
114+
/* NameException */ .chroma .ne { color: #75af00 }
115+
/* NameFunction */ .chroma .nf { color: #75af00 }
116+
/* NameFunctionMagic */ .chroma .fm { color: #111111 }
117+
/* NameLabel */ .chroma .nl { color: #111111 }
118+
/* NameNamespace */ .chroma .nn { color: #111111 }
119+
/* NameOther */ .chroma .nx { color: #75af00 }
120+
/* NameProperty */ .chroma .py { color: #111111 }
121+
/* NameVariable */ .chroma .nv { color: #111111 }
122+
/* NameVariableClass */ .chroma .vc { color: #111111 }
123+
/* NameVariableGlobal */ .chroma .vg { color: #111111 }
124+
/* NameVariableInstance */ .chroma .vi { color: #111111 }
125+
/* NameVariableMagic */ .chroma .vm { color: #111111 }
126+
/* LiteralDate */ .chroma .ld { color: #d88200 }
127+
/* LiteralString */ .chroma .s { color: #d88200 }
128+
/* LiteralStringAffix */ .chroma .sa { color: #d88200 }
129+
/* LiteralStringBacktick */ .chroma .sb { color: #d88200 }
130+
/* LiteralStringChar */ .chroma .sc { color: #d88200 }
131+
/* LiteralStringDelimiter */ .chroma .dl { color: #d88200 }
132+
/* LiteralStringDoc */ .chroma .sd { color: #d88200 }
133+
/* LiteralStringDouble */ .chroma .s2 { color: #d88200 }
134+
/* LiteralStringEscape */ .chroma .se { color: #8045ff }
135+
/* LiteralStringHeredoc */ .chroma .sh { color: #d88200 }
136+
/* LiteralStringInterpol */ .chroma .si { color: #d88200 }
137+
/* LiteralStringOther */ .chroma .sx { color: #d88200 }
138+
/* LiteralStringRegex */ .chroma .sr { color: #d88200 }
139+
/* LiteralStringSingle */ .chroma .s1 { color: #d88200 }
140+
/* LiteralStringSymbol */ .chroma .ss { color: #d88200 }
141+
/* Operator */ .chroma .o { color: #f92672 }
142+
/* Punctuation */ .chroma .p { color: #111111 }
143+
/* GenericDeleted */ .chroma .gd { }
144+
/* GenericInserted */ .chroma .gi { }
145+
/* GenericSubheading */ .chroma .gu { }
146+
}

‎assets/scss/_shortcodes.scss‎

Lines changed: 123 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
// Addendum shortcode
2+
article .note-box>h6 {
3+
margin-top: 1rem;
4+
margin-bottom: 1rem;
5+
padding-top: 10px;
6+
padding-left: 2rem;
7+
// text-align: center;
8+
// font-variant: small-caps;
9+
}
10+
11+
article .note-box>p {
12+
margin-top: 0;
13+
margin-bottom: 0;
14+
padding-left: 2rem;
15+
padding-right: 2rem;
16+
// text-align: center;
17+
}
18+
19+
div.note-box {
20+
border-left: 0.5rem;
21+
border-left-style: solid;
22+
padding-bottom: 1rem;
23+
margin-left: auto;
24+
margin-right: auto;
25+
width: 90%;
26+
margin-bottom: 1rem;
27+
margin-top: 1rem;
28+
border-radius: 1rem;
29+
}
30+
31+
@media only screen and (max-width: 600px) {
32+
div.note-box {
33+
width: 100%;
34+
}
35+
}
36+
37+
@mixin notebox-light {
38+
div.note-box {
39+
background-color: darken($bg-color, 4%);
40+
}
41+
}
42+
43+
@mixin notebox-dark {
44+
div.note-box {
45+
background-color: darken($bg-color-dark, 4%);
46+
}
47+
}
48+
49+
div.addendum {
50+
border-left-color: $link-color;
51+
}
52+
53+
div.warning {
54+
border-left-color: #FECE31;
55+
}
56+
57+
div.problem {
58+
border-left-color: rgb(222, 25, 25);
59+
}
60+
61+
// Maintenance notice (has .addendum class, so use id to overrule)
62+
div.maintenance {
63+
border: 0.5rem solid #FECE31;
64+
}
65+
66+
// codecaption shortcode / code in <figure>
67+
figure.code {
68+
text-align: left;
69+
}
70+
71+
// gh //
72+
.gh-repo a {
73+
font-family: $code-font-family;
74+
}
75+
76+
// pkg //
77+
.rpkg {
78+
white-space: nowrap;
79+
}
80+
81+
// package tooltip
82+
.rpkg a {
83+
font-family: $code-font-family;
84+
}
85+
86+
.tooltip {
87+
font-family: $font-family;
88+
visibility: hidden;
89+
width: auto;
90+
background-color: $alt-bg-color-dark;
91+
color: $fg-color-dark;
92+
text-align: center;
93+
padding: 1rem;
94+
border-radius: 1rem;
95+
position: fixed;
96+
bottom: 5%;
97+
right: 5%;
98+
z-index: 3;
99+
}
100+
101+
.rpkg:hover .tooltip,
102+
.rpkg:focus-within .tooltip,
103+
.rpkg:focus .tooltip,
104+
.rpkg:active .tooltip {
105+
visibility: visible;
106+
}
107+
108+
// the inline pkg thing
109+
.rpkg i {
110+
font-size: 80%;
111+
// position: relative;
112+
// left: 2px;
113+
}
114+
115+
// video, videofig //
116+
// video element
117+
.content video {
118+
// display: block;
119+
margin-left: auto;
120+
margin-right: auto;
121+
max-width: 100%;
122+
border-radius: 1rem;
123+
}

‎assets/scss/_tables.scss‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
@mixin table-dark {
2+
3+
table th,
4+
table td {
5+
border: 1px solid $alt-fg-color-dark;
6+
}
7+
8+
table tr:first-child th {
9+
border-top: 0;
10+
}
11+
12+
table tr:last-child td {
13+
border-bottom: 0;
14+
}
15+
16+
table tr td {
17+
border-bottom: 0;
18+
}
19+
20+
table tr td:first-child,
21+
table tr th:first-child {
22+
border-left: 0;
23+
}
24+
25+
table tr td:last-child,
26+
table tr th:last-child {
27+
border-right: 0;
28+
}
29+
}
30+
31+
/* Slightly compacter tables */
32+
table th,
33+
table td {
34+
padding: 0.8rem;
35+
}
36+
37+
table caption {
38+
padding-bottom: 1rem;
39+
}
40+
41+
/* Sans-font for headings */
42+
table th {
43+
font-family: $font-family;
44+
}
45+
46+
/* Centered tables by default */
47+
table {
48+
font-family: $font-family;
49+
margin-left: auto;
50+
margin-right: auto;
51+
line-height: 1.9rem;
52+
}

0 commit comments

Comments
 (0)