aboutsummaryrefslogtreecommitdiff
path: root/users/ryan/modules/simple-bar/simple-bar-source/lib/styles/components/data/graph.js
diff options
context:
space:
mode:
Diffstat (limited to 'users/ryan/modules/simple-bar/simple-bar-source/lib/styles/components/data/graph.js')
-rwxr-xr-xusers/ryan/modules/simple-bar/simple-bar-source/lib/styles/components/data/graph.js49
1 files changed, 49 insertions, 0 deletions
diff --git a/users/ryan/modules/simple-bar/simple-bar-source/lib/styles/components/data/graph.js b/users/ryan/modules/simple-bar/simple-bar-source/lib/styles/components/data/graph.js
new file mode 100755
index 0000000..0bf3609
--- /dev/null
+++ b/users/ryan/modules/simple-bar/simple-bar-source/lib/styles/components/data/graph.js
@@ -0,0 +1,49 @@
1// Styles for /lib/components/data/graph.jsx component
2export const graphStyles = /* css */ `
3.graph {
4 position: relative;
5 width: 100%;
6 height: 100%;
7 display: flex;
8 align-items: flex-end;
9 gap: 4px;
10 overflow: hidden;
11 border-radius: inherit;
12}
13.graph__bars {
14 flex: 1 1 100%;
15 height: 75%;
16 display: flex;
17 align-items: flex-end;
18 justify-content: flex-end;
19 pointer-events: none;
20}
21.graph__bar {
22 min-height: 1px;
23 opacity: 0.75;
24}
25.graph__data {
26 position: absolute;
27 top: 3px;
28 left: 3px;
29 width: calc(100% - 6px);
30 flex: 0 0 auto;
31 display: flex;
32 justify-content: space-between;
33 gap: 2px;
34}
35.graph__data-item {
36 display: flex;
37 align-items: center;
38 gap: 3px;
39}
40.graph__data-item-icon {
41 flex: 0 0 10px;
42 width: 10px;
43 height: 10px;
44 fill: currentColor;
45}
46.graph__data-item-value {
47 font-size: calc(var(--font-size) - 2px);
48}
49`;