ansxor.ca
this repo has no description
nnmmmmm
+23
doc/themes.txt
+23
doc/themes.txt
···
1
+
## Theme variable names:
2
+
3
+
- prefixed with “--T-”
4
+
- words are separated by hyphens
5
+
- “color” and “background[-color]” are abbreviated to “col” and “bg”
6
+
- should generally be structured like “--T-❬thing❭-❬property❭”
7
+
- ex: “--T-link-col”, “--T-font-size”, “--T-quote-border-radius”, etc.
8
+
9
+
10
+
## Default theme
11
+
12
+
I've tried to choose colors that work with dark and light themes
13
+
(assuming you set `col` and `bg`)
14
+
15
+
If any new theme variables are added, their default values will always either:
16
+
17
+
- work on both light and dark backgrounds
18
+
- ex: `--T-box-bg: #AAA2;` (`#AAA2` is `rgba(170, 170, 170, 0.133)`)
19
+
20
+
- be defined based on existing properties
21
+
- ex: `--T-icode-col: var(--T-col);`
22
+
23
+
so existing themes won't need to be updated.
+5
-36
markup.css
+5
-36
markup.css
···
1
-
L + ratio {
2
-
3
-
}
1
+
L + ratio {}
4
2
5
3
.Markup, .Markup * {
6
4
white-space: pre-wrap;
7
5
word-break: break-word; /* ⚠ very important to prevent overflow ⚠ */
8
6
}
9
7
10
-
/*******************/
11
-
/** DEFAULT THEME **/
12
-
/*******************/
8
+
/**************************
9
+
** Theme Variables **
10
+
** (see doc/themes.txt) **
11
+
**************************/
13
12
14
-
/*
15
-
***********
16
-
** DRAFT **
17
-
***********
18
-
19
-
## Theme variable names
20
-
21
-
- prefixed with “--T-”
22
-
- words are separated by hyphens
23
-
- “color” and “background[-color]” are abbreviated to “col” and “bg”
24
-
- should generally be structured like “--T-❬thing❭-❬property❭”
25
-
- ex: “--T-link-col”, “--T-font-size”, “--T-quote-border-radius”, etc.
26
-
27
-
## Default values
28
-
29
-
I've tried to choose colors that work with dark and light themes
30
-
(assuming you set `col` and `bg`)
31
-
32
-
If any new theme variables are added, their default values will always either:
33
-
34
-
- work on both light and dark backgrounds
35
-
- ex: `--T-box-bg: #AAA2;` (`#AAA2` is `rgba(170, 170, 170, 0.133)`)
36
-
37
-
- be defined based on existing properties
38
-
- ex: `--T-icode-col: var(--T-col);`
39
-
40
-
so existing themes won't need to be updated.
41
-
*/
42
13
*:not(*>*) { /* this selects :root with 0 specificity */
43
-
/*.Markup:not([data-theme] *)*/
44
14
/* normal colors */
45
-
46
15
--T-col: black;
47
16
--T-bg: white;
48
17
+10
-33
render.js
+10
-33
render.js
···
2
2
@typedef {(Element|DocumentFragment|Document)} ParentNode
3
3
*/
4
4
5
-
//todo: i really don't like the whole getrootnode thing.
6
-
// maybe should pass the parent to the CREATE function and
7
-
// have it handle appending, then return the new branch node.
8
-
// return parent=>parent.appendChild(elem.cloneNode(true))
9
-
// and then you call this(parent)
10
-
// however, then the node gets appended immediately, before it's initialized...
11
-
// so really the function process should be
12
-
// func(parent, args) {
13
-
// let e = template()
14
-
// ...
15
-
// parent.appendChild(e)
16
-
// return e.firstChild
17
-
// }
18
-
// also: is it more efficient if the templates are in the current document? or somehow cloned INTO it rather than cloned and then adopted...
19
-
// yes! importNode
20
-
21
5
/**
22
6
AST -> HTML DOM Node renderer
23
7
*/
···
37
21
// todo: this needs to be more powerful. i.e. returning entire elements in some cases etc. gosh idk.. need to handle like, sbs emotes ? how uh nno that should be the parser's job.. oh and also this should, like,
38
22
// for embeds, need separate handlers for normal urls and embeds and
39
23
let URL_SCHEME = {
40
-
"sbs:"(url, thing) {
41
-
return "#"+url.pathname+url.search+url.hash
42
-
},
43
-
"https:"(url, thing) { return url.href },
44
-
"http:"(url, thing) { return url.href },
45
-
"javascript:"(url, thing) { return "about:blank#.no" },
46
-
DEFAULT(url, thing) { return "about:blank#"+url.href },
24
+
"sbs:": (url, thing)=> "#"+url.pathname+url.search+url.hash,
25
+
"https:": (url, thing)=> url.href,
26
+
"http:": (url, thing)=> url.href,
27
+
DEFAULT: (url, thing)=> "about:blank#"+url.href,
47
28
// these take a url string instead of URL
48
-
RELATIVE(href, thing) {
49
-
return href.replace(/^[/]{0,2}/, "https://")
50
-
},
51
-
ERROR(href, thing) { return "about:blank#"+url.href },
29
+
RELATIVE: (url, thing)=> href.replace(/^[/]{0,2}/, "https://"),
30
+
ERROR: (url, thing)=> "about:blank#"+url.href,
52
31
}
53
32
54
33
function filter_url(url, thing) {
55
-
let ret = "about:blank"
56
34
try {
57
35
let u = new URL(url, "no-scheme:/")
58
36
if (u.protocol=='no-scheme:')
59
-
ret = URL_SCHEME.RELATIVE(url, thing)
37
+
return URL_SCHEME.RELATIVE(url, thing)
60
38
else
61
-
ret = (URL_SCHEME[u.protocol] || URL_SCHEME.DEFAULT)(u, thing)
39
+
return (URL_SCHEME[u.protocol] || URL_SCHEME.DEFAULT)(u, thing)
62
40
} catch(e) {
63
-
ret = URL_SCHEME.ERROR(url, thing)
64
-
} finally {
65
-
return ret
41
+
return URL_SCHEME.ERROR(url, thing)
66
42
}
67
43
}
68
44
···
193
169
}.bind([𐀶`<td>`,𐀶`<th>`]),
194
170
195
171
youtube: function({url}) {
172
+
// todo: do we filter the url here or?
196
173
let e = this()
197
174
e.firstChild.textContent = url
198
175
e.firstChild.href = url