💥 Tweak for moments theme
This commit is contained in:
parent
38b0fd865d
commit
c49c8a8a91
8 changed files with 45 additions and 172 deletions
|
|
@ -685,7 +685,7 @@
|
|||
const REG_BD_HALF_START = `${REG_BD_HALF_OPEN}${REG_BD_HALF_CLOSE}`;
|
||||
|
||||
class Heti {
|
||||
constructor (rootSelector) {
|
||||
constructor (rootDocument, rootSelector) {
|
||||
let supportLookBehind = true;
|
||||
|
||||
try {
|
||||
|
|
@ -695,6 +695,7 @@
|
|||
supportLookBehind = false;
|
||||
}
|
||||
|
||||
this.rootDocument = rootDocument;
|
||||
this.rootSelector = rootSelector || '.heti';
|
||||
this.REG_FULL = new RegExp(supportLookBehind ? REG_CJK_FULL : REG_CJK_FULL_WITHOUT_LOOKBEHIND, 'g');
|
||||
this.REG_START = new RegExp(REG_CJK_START, 'g');
|
||||
|
|
@ -722,8 +723,8 @@
|
|||
forceContext: this.funcForceContext,
|
||||
filterElements: this.funcFilterElements,
|
||||
};
|
||||
const getWrapper = function (elementName, classList, text) {
|
||||
const $$r = document.createElement(elementName);
|
||||
const getWrapper = (elementName, classList, text) => {
|
||||
const $$r = this.rootDocument.createElement(elementName);
|
||||
$$r.className = classList;
|
||||
$$r.textContent = text.trim();
|
||||
return $$r
|
||||
|
|
@ -768,14 +769,18 @@
|
|||
|
||||
autoSpacing () {
|
||||
const callback = () => {
|
||||
const $$rootList = document.querySelectorAll(this.rootSelector);
|
||||
const $$rootList = this.rootDocument.querySelectorAll(this.rootSelector);
|
||||
|
||||
for (let $$root of $$rootList) {
|
||||
this.spacingElement($$root);
|
||||
}
|
||||
};
|
||||
if (document.readyState === 'complete') setTimeout(callback);
|
||||
else document.addEventListener('DOMContentLoaded', callback);
|
||||
if (this.rootDocument == document) {
|
||||
if (this.rootDocument.readyState === 'complete') setTimeout(callback);
|
||||
else this.rootDocument.addEventListener('DOMContentLoaded', callback);
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
115
_site/heti.css
115
_site/heti.css
|
|
@ -167,7 +167,6 @@
|
|||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
line-height: 1.5;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
hyphens: auto;
|
||||
|
|
@ -190,25 +189,6 @@
|
|||
.heti td > *:last-child {
|
||||
margin-block-end: 0 !important;
|
||||
}
|
||||
.heti blockquote {
|
||||
margin-block-start: 12px;
|
||||
margin-block-end: 24px;
|
||||
margin-inline-start: 32px;
|
||||
margin-inline-end: 32px;
|
||||
padding-block-start: 12px;
|
||||
padding-block-end: 12px;
|
||||
padding-inline-start: 16px;
|
||||
padding-inline-end: 16px;
|
||||
background-color: hsla(0deg, 0%, 0%, 0.054);
|
||||
}
|
||||
[data-darkmode=dark] .heti blockquote {
|
||||
background-color: hsla(0deg, 0%, 100%, 0.054);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
[data-darkmode=auto] .heti blockquote {
|
||||
background-color: hsla(0deg, 0%, 100%, 0.054);
|
||||
}
|
||||
}
|
||||
.heti figure {
|
||||
display: block;
|
||||
text-align: center;
|
||||
|
|
@ -221,8 +201,8 @@
|
|||
.heti hr {
|
||||
width: 30%;
|
||||
height: 1px;
|
||||
margin-block-start: 48px;
|
||||
margin-block-end: 47px;
|
||||
margin-block-start: 32px;
|
||||
margin-block-end: 31px;
|
||||
margin-inline-start: auto;
|
||||
margin-inline-end: auto;
|
||||
border: 0;
|
||||
|
|
@ -237,45 +217,13 @@
|
|||
}
|
||||
}
|
||||
.heti p {
|
||||
margin-block-start: 12px;
|
||||
margin-block-end: 24px;
|
||||
margin-block-start: 8px;
|
||||
margin-block-end: 16px;
|
||||
text-align: justify;
|
||||
}
|
||||
.heti p:not(:lang(zh)):not(:lang(ja)):not(:lang(kr)), .heti p:not(:lang(zh)) {
|
||||
text-align: start;
|
||||
}
|
||||
.heti pre {
|
||||
margin-block-start: 12px;
|
||||
margin-block-end: 12px;
|
||||
margin-inline-start: 0;
|
||||
margin-inline-end: 0;
|
||||
padding-block-start: 12px;
|
||||
padding-block-end: 12px;
|
||||
padding-inline-start: 16px;
|
||||
padding-inline-end: 16px;
|
||||
overflow: auto;
|
||||
font-family: "SFMono-Regular", consolas, "Liberation Mono", menlo, courier, monospace, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
white-space: pre;
|
||||
word-wrap: normal;
|
||||
border-radius: 4px;
|
||||
background-color: hsla(0deg, 0%, 0%, 0.054);
|
||||
}
|
||||
[data-darkmode=dark] .heti pre {
|
||||
background-color: hsla(0deg, 0%, 100%, 0.054);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
[data-darkmode=auto] .heti pre {
|
||||
background-color: hsla(0deg, 0%, 100%, 0.054);
|
||||
}
|
||||
}
|
||||
.heti pre code {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
background-color: transparent;
|
||||
color: inherit;
|
||||
}
|
||||
.heti:not(:lang(zh)):not(:lang(ja)):not(:lang(kr)), .heti:not(:lang(zh)) {
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
|
@ -294,12 +242,12 @@
|
|||
.heti h6 {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
margin-block-start: 24px;
|
||||
margin-block-end: 12px;
|
||||
margin-block-start: 16px;
|
||||
margin-block-end: 8px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.heti h1 {
|
||||
margin-block-end: 24px;
|
||||
margin-block-end: 16px;
|
||||
font-size: 32px;
|
||||
line-height: 48px;
|
||||
}
|
||||
|
|
@ -340,7 +288,7 @@
|
|||
.heti h3 + h4,
|
||||
.heti h4 + h5,
|
||||
.heti h5 + h6 {
|
||||
margin-block-start: 12px;
|
||||
margin-block-start: 8px;
|
||||
}
|
||||
.heti ul,
|
||||
.heti ol,
|
||||
|
|
@ -359,30 +307,11 @@
|
|||
margin-block-start: 0;
|
||||
margin-block-end: 0;
|
||||
}
|
||||
.heti ul {
|
||||
list-style-type: disc;
|
||||
}
|
||||
.heti ol {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
.heti ul ul,
|
||||
.heti ol ul {
|
||||
list-style-type: circle;
|
||||
}
|
||||
.heti ul ul ul,
|
||||
.heti ul ol ul,
|
||||
.heti ol ul ul,
|
||||
.heti ol ol ul {
|
||||
list-style-type: square;
|
||||
}
|
||||
.heti li {
|
||||
list-style-type: unset;
|
||||
}
|
||||
.heti table {
|
||||
box-sizing: border-box;
|
||||
table-layout: fixed;
|
||||
margin-block-start: 12px;
|
||||
margin-block-end: 24px;
|
||||
margin-block-start: 8px;
|
||||
margin-block-end: 16px;
|
||||
margin-inline-start: auto;
|
||||
margin-inline-end: auto;
|
||||
border-collapse: collapse;
|
||||
|
|
@ -401,8 +330,8 @@
|
|||
}
|
||||
.heti th,
|
||||
.heti td {
|
||||
padding-block-start: 6px;
|
||||
padding-block-end: 6px;
|
||||
padding-block-start: 4px;
|
||||
padding-block-end: 4px;
|
||||
padding-inline-start: 8px;
|
||||
padding-inline-end: 8px;
|
||||
border-width: 1px;
|
||||
|
|
@ -444,12 +373,6 @@
|
|||
.heti strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
.heti code {
|
||||
margin-inline-start: 0.25em;
|
||||
margin-inline-end: 0.25em;
|
||||
font-family: "SFMono-Regular", consolas, "Liberation Mono", menlo, courier, monospace, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
font-size: 0.875em;
|
||||
}
|
||||
.heti dfn {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
|
@ -493,7 +416,7 @@
|
|||
}
|
||||
}
|
||||
.heti q {
|
||||
quotes: "「" "」" "『" "』";
|
||||
quotes: "“" "”" "‘" "’";
|
||||
}
|
||||
.heti q:not(:lang(zh)):not(:lang(ja)):not(:lang(kr)), .heti q:not(:lang(zh)) {
|
||||
quotes: initial;
|
||||
|
|
@ -631,8 +554,8 @@
|
|||
column-gap: 2em;
|
||||
}
|
||||
.heti--columns-1 p, .heti--columns-2 p, .heti--columns-3 p, .heti--columns-4 p, .heti--columns-16em p, .heti--columns-20em p, .heti--columns-24em p, .heti--columns-28em p, .heti--columns-32em p, .heti--columns-36em p, .heti--columns-40em p, .heti--columns-44em p, .heti--columns-48em p, .heti comma p {
|
||||
margin-block-start: 6px;
|
||||
margin-block-end: 12px;
|
||||
margin-block-start: 4px;
|
||||
margin-block-end: 8px;
|
||||
text-indent: 2em;
|
||||
}
|
||||
.heti--columns-1 {
|
||||
|
|
@ -689,7 +612,7 @@
|
|||
text-align: start;
|
||||
}
|
||||
.heti--vertical q {
|
||||
quotes: "「" "」" "『" "』";
|
||||
quotes: "『" "』" "「" "」";
|
||||
}
|
||||
.heti--ancient, .heti--poetry {
|
||||
font-family: "Times New Roman", times, "Heti Song", serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
|
|
@ -772,8 +695,8 @@
|
|||
text-emphasis: none;
|
||||
}
|
||||
.heti--annotation .heti-meta {
|
||||
margin-block-start: 12px;
|
||||
margin-block-end: 24px;
|
||||
margin-block-start: 8px;
|
||||
margin-block-end: 16px;
|
||||
}
|
||||
.heti .heti-meta {
|
||||
display: block;
|
||||
|
|
@ -835,7 +758,7 @@
|
|||
}
|
||||
}
|
||||
.heti .heti-fn ol {
|
||||
margin-block-start: 12px;
|
||||
margin-block-start: 8px;
|
||||
margin-block-end: 0;
|
||||
}
|
||||
.heti .heti-fn li:target {
|
||||
|
|
|
|||
|
|
@ -622,7 +622,7 @@
|
|||
$$article.className = ['article', 'heti', e.target.value].join(' ')
|
||||
})
|
||||
|
||||
const heti = new Heti('.article')
|
||||
const heti = new Heti(document, '.article')
|
||||
heti.autoSpacing()
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue