Mercurial > code > home > repos > streamed-graph

annotate src/render/style.ts @ 106:2468f2227d22

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
make src/layout/ and src/render/ separation
author drewp@bigasterisk.com
date Sun, 13 Mar 2022 22:00:30 -0700
parents src/style.ts@76c1a29a328f
children 3cdbbd913f1d
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
83
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
1 import { css } from 'lit';
48
b8e5850acca0 local demo; styles
drewp@bigasterisk.com
parents:
diff changeset
2
83
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
3 export function addFontToRootPage() {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
4 const content = `
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
5 @font-face {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
6 font-family: 'Allerta';
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
7 font-style: normal;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
8 font-weight: 400;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
9 font-display: swap;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
10 src: url(https://fonts.gstatic.com/s/allerta/v11/TwMO-IAHRlkbx940YnYXTQ.ttf) format('truetype');
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
11 }`;
48
b8e5850acca0 local demo; styles
drewp@bigasterisk.com
parents:
diff changeset
12
83
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
13 if (!document.getElementById('allerta-style')) {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
14 var head = document.head || document.getElementsByTagName('head')[0],
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
15 style = document.createElement('style');
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
16 style.id = 'allerta-style';
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
17 style.type = 'text/css';
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
18 style.innerText = content;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
19 head.appendChild(style);
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
20 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
21 }
48
b8e5850acca0 local demo; styles
drewp@bigasterisk.com
parents:
diff changeset
22
b8e5850acca0 local demo; styles
drewp@bigasterisk.com
parents:
diff changeset
23
83
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
24 export const style = css`
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
25 :host {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
26 display: flex;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
27 flex-direction: column;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
28 padding: 2px 0;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
29 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
30 #ui {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
31 display: inline-block;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
32 width: 30em;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
33 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
34 #ui button {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
35 width: 2em;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
36 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
37 #ui .expander {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
38 display: inline-block;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
39 padding: 3px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
40 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
41 #graphView section {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
42 padding: 4px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
43 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
44 #graphView .spoGrid {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
45 display: flex;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
46 flex-direction: column;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
47 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
48 #graphView .subject,
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
49 #graphView .predicate {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
50 display: flex;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
51 align-items: baseline;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
52 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
53 #graphView .predicate,
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
54 #graphView .object {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
55 margin-left: 5px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
56 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
57 #graphView .literal {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
58 display: inline-block;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
59 margin: 3px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
60 padding: 4px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
61 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
62 #graphView .literalType {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
63 vertical-align: super;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
64 font-size: 80%;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
65 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
66 #graphView .resource {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
67 display: inline-block;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
68 margin: 2px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
69 padding: 1px 6px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
70 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
71 #graphView .predicate > a::before {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
72 padding-right: 2px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
73 content: '━';
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
74 font-weight: bolder;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
75 font-size: 125%;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
76 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
77 #graphView .predicate > a::after {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
78 content: '🠪';
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
79 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
80 #graphView table.typeBlock {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
81 border-collapse: collapse;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
82 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
83 #graphView table.typeBlock td {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
84 white-space: nowrap;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
85 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
86 #graphView table.typeBlock td .literal {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
87 padding-top: 1px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
88 padding-bottom: 1px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
89 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
90 #graphView .typeBlockScroll {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
91 overflow-x: auto;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
92 max-width: 100%;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
93 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
94 a {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
95 color: #b1b1fd;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
96 text-shadow: 1px 1px 0px rgba(4,0,255,0.58);
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
97 text-decoration-color: rgba(0,0,119,0.078);
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
98 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
99 body.rdfBrowsePage {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
100 background: #000;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
101 color: #fff;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
102 font-size: 12px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
103 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
104 #ui {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
105 border: 1px solid #808080;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
106 background: #000;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
107 color: #fff;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
108 font-family: 'Allerta', sans-serif;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
109 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
110 #graphView {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
111 background: #000;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
112 color: #fff;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
113 font-family: 'Allerta', sans-serif;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
114 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
115 #graphView section {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
116 border: 1px solid #808080;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
117 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
118 #graphView .subject {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
119 border-top: 1px solid #2f2f2f;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
120 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
121 #graphView .literal {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
122 border: 1px solid #808080;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
123 border-radius: 9px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
124 font-size: 115%;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
125 font-family: monospace;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
126 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
127 #graphView .subject > .node {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
128 border: 2px solid #448d44;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
129 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
130 #graphView .resource {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
131 border-radius: 6px;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
132 background: #add8e6;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
133 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
134 #graphView .predicate > a {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
135 color: #e49dfb;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
136 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
137 #graphView .comment {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
138 color: #008000;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
139 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
140 #graphView table.typeBlock th {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
141 border: 2px #333 outset;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
142 background: #1f1f1f;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
143 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
144 #graphView table.typeBlock td {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
145 border: 2px #4a4a4a outset;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
146 background: #2b2b2b;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
147 }
48
b8e5850acca0 local demo; styles
drewp@bigasterisk.com
parents:
diff changeset
148 /*
b8e5850acca0 local demo; styles
drewp@bigasterisk.com
parents:
diff changeset
149 for my pages serving rdf data, not necessarily part of browse/
b8e5850acca0 local demo; styles
drewp@bigasterisk.com
parents:
diff changeset
150 */
83
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
151 .served-resources {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
152 margin-top: 4em;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
153 padding-top: 1em;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
154 border-top: 1px solid #808080;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
155 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
156 .served-resources a {
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
157 padding-right: 2em;
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
158 }
b973d7f95fdf bake out the stylus to plain css; add this https://ziga-petek.medium.com/using-fonts-in-web-components-6aba251ed4e5 to make fonts work
drewp@bigasterisk.com
parents: 48
diff changeset
159 `;