Mercurial > code > home > repos > streamed-graph

comparison src/style.styl @ 48:b8e5850acca0

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
local demo; styles
author drewp@bigasterisk.com
date Thu, 09 Jan 2020 00:04:45 -0800
parents
children
comparison
equal deleted inserted replaced
47:7d17a02b5ae0 48:b8e5850acca0
1 @import url('https://fonts.googleapis.com/css?family=Allerta|Dosis|Jura&display=swap')
2
3 :host
4 display: flex
5 flex-direction: column
6 padding: 2px 0
7
8 #ui // layout
9 display: inline-block
10 width: 30em
11
12 button
13 width: 2em
14
15 .expander
16 display: inline-block
17 padding: 3px
18
19 #graphView // layout
20 section
21 padding: 4px
22
23 .spoGrid
24 display: flex
25 flex-direction: column
26
27 .subject, .predicate
28 display: flex
29 align-items: baseline
30
31 .predicate, .object
32 margin-left: 5px
33
34 .literal
35 display: inline-block
36 margin: 3px
37 padding: 4px
38
39 .literalType
40 vertical-align: super
41 font-size: 80%
42
43 .resource
44 display: inline-block
45 margin: 2px
46 padding: 1px 6px
47
48 .predicate > a::before
49 padding-right: 2px
50 content: '━'
51 font-weight: bolder
52 font-size: 125%
53
54 .predicate > a::after
55 content: '🠪'
56
57 table.typeBlock
58 border-collapse: collapse
59
60 table.typeBlock td
61 white-space: nowrap
62
63 table.typeBlock td .literal
64 padding-top: 1px
65 padding-bottom: 1px
66
67 .typeBlockScroll
68 overflow-x: auto
69 max-width: 100%
70
71 // ///////////////////////////////////////////////////////////////////
72 a
73 color: #b1b1fd
74 text-shadow: 1px 1px 0px #0400ff94
75 text-decoration-color: #00007714
76
77 body.rdfBrowsePage
78 background: black
79 color: white
80 font-size: 12px
81
82 #ui // color
83 border: 1px solid gray
84 background: black
85 color: white
86 font-family: 'Allerta', sans-serif
87
88 #graphView // color
89 background: black
90 color: white
91 font-family: 'Allerta', sans-serif
92
93 section
94 border: 1px solid gray
95
96 .subject
97 border-top: 1px solid #2f2f2f
98
99 .literal
100 border: 1px solid gray
101 border-radius: 9px
102 font-size: 115%
103 font-family: monospace
104
105 .subject > .node
106 border: 2px solid rgb(68, 141, 68)
107
108 .resource
109 border-radius: 6px
110 background: lightblue
111
112 .predicate > a
113 color: #e49dfb
114
115 .comment
116 color: green
117
118 table.typeBlock th
119 border: 2px #333333 outset
120 background: #1f1f1f
121
122 table.typeBlock td
123 border: 2px #4a4a4a outset
124 background: #2b2b2b
125
126 /*
127 for my pages serving rdf data, not necessarily part of browse/
128 */
129 .served-resources
130 margin-top: 4em
131 padding-top: 1em
132 border-top: 1px solid gray
133
134 .served-resources a
135 padding-right: 2em