nightshade 0.2.0 → 1.0.0-2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/nightshade.css +1 -0
- package/dist/nightshade.js +186 -0
- package/package.json +32 -25
- package/stylesheets/article.css +21 -0
- package/stylesheets/base.css +124 -0
- package/stylesheets/index.css +9 -0
- package/stylesheets/transitions.css +106 -0
- package/stylesheets/util.css +82 -0
- package/stylesheets/vars/color-tokens.css +128 -0
- package/stylesheets/vars/commons.css +28 -0
- package/stylesheets/vars/spacing.css +20 -0
- package/stylesheets/vars/typography.css +16 -0
- package/.idea/jsLibraryMappings.xml +0 -6
- package/.idea/modules.xml +0 -8
- package/.idea/nightshade.iml +0 -8
- package/.idea/vcs.xml +0 -6
- package/.idea/watcherTasks.xml +0 -4
- package/.idea/workspace.xml +0 -672
- package/.npmignore +0 -3
- package/README.md +0 -128
- package/components/btn.styl +0 -112
- package/components/container.styl +0 -19
- package/components/ctl-group.styl +0 -27
- package/components/grid.styl +0 -84
- package/components/index.styl +0 -5
- package/components/input.styl +0 -63
- package/core/base.styl +0 -82
- package/core/helpers.styl +0 -56
- package/core/index.styl +0 -6
- package/core/mixins.styl +0 -12
- package/core/reset.styl +0 -32
- package/core/swatches.styl +0 -210
- package/core/variables.styl +0 -66
- package/index.styl +0 -2
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
|
|
3
|
+
--color-base-0: hsl(280deg, 10%, 100%);
|
|
4
|
+
--color-base-1: hsl(280deg, 10%, 96%);
|
|
5
|
+
--color-base-2: hsl(280deg, 10%, 92%);
|
|
6
|
+
--color-base-3: hsl(280deg, 10%, 88%);
|
|
7
|
+
--color-base-4: hsl(280deg, 10%, 80%);
|
|
8
|
+
|
|
9
|
+
--color-text-0: hsl(280deg, 10%, 20%);
|
|
10
|
+
--color-text-1: hsl(280deg, 10%, 48%);
|
|
11
|
+
--color-text-2: hsl(280deg, 10%, 64%);
|
|
12
|
+
--color-text-3: hsl(280deg, 10%, 72%);
|
|
13
|
+
--color-text-4: hsl(280deg, 10%, 78%);
|
|
14
|
+
|
|
15
|
+
--color-default: var(--color-text-0);
|
|
16
|
+
--color-default-0: var(--color-base-0);
|
|
17
|
+
--color-default-1: var(--color-base-1);
|
|
18
|
+
--color-default-2: var(--color-base-2);
|
|
19
|
+
--color-default-3: var(--color-base-3);
|
|
20
|
+
--color-default-4: var(--color-base-4);
|
|
21
|
+
--color-default-text: var(--color-text-0);
|
|
22
|
+
--color-default-surface-top: var(--color-default-1);
|
|
23
|
+
--color-default-surface-bottom: var(--color-default-3);
|
|
24
|
+
--color-default-focus: var(--color-primary-focus);
|
|
25
|
+
--color-default-outline: var(--color-default-2);
|
|
26
|
+
--color-default-shadow: var(--color-default-4);
|
|
27
|
+
|
|
28
|
+
--color-primary: var(--color-primary-2);
|
|
29
|
+
--color-primary-0: hsl(310deg, 64%, 75%);
|
|
30
|
+
--color-primary-1: hsl(310deg, 64%, 64%);
|
|
31
|
+
--color-primary-2: hsl(310deg, 64%, 50%);
|
|
32
|
+
--color-primary-3: hsl(310deg, 64%, 44%);
|
|
33
|
+
--color-primary-4: hsl(310deg, 64%, 36%);
|
|
34
|
+
--color-primary-text: #fff;
|
|
35
|
+
--color-primary-surface-top: var(--color-primary-1);
|
|
36
|
+
--color-primary-surface-bottom: var(--color-primary-3);
|
|
37
|
+
--color-primary-focus: var(--color-primary-0);
|
|
38
|
+
--color-primary-outline: var(--color-primary-2);
|
|
39
|
+
--color-primary-shadow: var(--color-primary-4);
|
|
40
|
+
|
|
41
|
+
--color-secondary: var(--color-secondary-2);
|
|
42
|
+
--color-secondary-0: hsl(290deg, 50%, 75%);
|
|
43
|
+
--color-secondary-1: hsl(290deg, 50%, 64%);
|
|
44
|
+
--color-secondary-2: hsl(290deg, 50%, 50%);
|
|
45
|
+
--color-secondary-3: hsl(290deg, 50%, 44%);
|
|
46
|
+
--color-secondary-4: hsl(290deg, 50%, 36%);
|
|
47
|
+
--color-secondary-text: #fff;
|
|
48
|
+
--color-secondary-surface-top: var(--color-secondary-1);
|
|
49
|
+
--color-secondary-surface-bottom: var(--color-secondary-3);
|
|
50
|
+
--color-secondary-focus: var(--color-secondary-0);
|
|
51
|
+
--color-secondary-outline: var(--color-secondary-2);
|
|
52
|
+
--color-secondary-shadow: var(--color-secondary-4);
|
|
53
|
+
|
|
54
|
+
--color-tertiary: var(--color-tertiary-2);
|
|
55
|
+
--color-tertiary-0: hsl(176deg, 50%, 78%);
|
|
56
|
+
--color-tertiary-1: hsl(176deg, 50%, 72%);
|
|
57
|
+
--color-tertiary-2: hsl(176deg, 50%, 50%);
|
|
58
|
+
--color-tertiary-3: hsl(176deg, 50%, 44%);
|
|
59
|
+
--color-tertiary-4: hsl(176deg, 50%, 36%);
|
|
60
|
+
--color-tertiary-text: #fff;
|
|
61
|
+
--color-tertiary-surface-top: var(--color-tertiary-1);
|
|
62
|
+
--color-tertiary-surface-bottom: var(--color-tertiary-3);
|
|
63
|
+
--color-tertiary-focus: var(--color-tertiary-0);
|
|
64
|
+
--color-tertiary-outline: var(--color-tertiary-2);
|
|
65
|
+
--color-tertiary-shadow: var(--color-tertiary-4);
|
|
66
|
+
|
|
67
|
+
--color-success: var(--color-success-2);
|
|
68
|
+
--color-success-0: hsl(96deg, 60%, 76%);
|
|
69
|
+
--color-success-1: hsl(96deg, 60%, 68%);
|
|
70
|
+
--color-success-2: hsl(96deg, 60%, 50%);
|
|
71
|
+
--color-success-3: hsl(96deg, 60%, 44%);
|
|
72
|
+
--color-success-4: hsl(96deg, 60%, 36%);
|
|
73
|
+
--color-success-text: #fff;
|
|
74
|
+
--color-success-surface-top: var(--color-success-1);
|
|
75
|
+
--color-success-surface-bottom: var(--color-success-3);
|
|
76
|
+
--color-success-focus: var(--color-success-0);
|
|
77
|
+
--color-success-outline: var(--color-success-2);
|
|
78
|
+
--color-success-shadow: var(--color-success-4);
|
|
79
|
+
|
|
80
|
+
--color-warning: var(--color-warning-3);
|
|
81
|
+
--color-warning-0: hsl(48deg, 88%, 85%);
|
|
82
|
+
--color-warning-1: hsl(48deg, 88%, 80%);
|
|
83
|
+
--color-warning-2: hsl(48deg, 88%, 60%);
|
|
84
|
+
--color-warning-3: hsl(48deg, 88%, 48%);
|
|
85
|
+
--color-warning-4: hsl(48deg, 88%, 40%);
|
|
86
|
+
--color-warning-text: #000;
|
|
87
|
+
--color-warning-surface-top: var(--color-warning-1);
|
|
88
|
+
--color-warning-surface-bottom: var(--color-warning-3);
|
|
89
|
+
--color-warning-focus: var(--color-warning-0);
|
|
90
|
+
--color-warning-outline: var(--color-warning-2);
|
|
91
|
+
--color-warning-shadow: var(--color-warning-4);
|
|
92
|
+
|
|
93
|
+
--color-danger: var(--color-danger-2);
|
|
94
|
+
--color-danger-0: hsl(350deg, 88%, 75%);
|
|
95
|
+
--color-danger-1: hsl(350deg, 88%, 64%);
|
|
96
|
+
--color-danger-2: hsl(350deg, 88%, 50%);
|
|
97
|
+
--color-danger-3: hsl(350deg, 88%, 44%);
|
|
98
|
+
--color-danger-4: hsl(350deg, 88%, 32%);
|
|
99
|
+
--color-danger-text: #fff;
|
|
100
|
+
--color-danger-surface-top: var(--color-danger-1);
|
|
101
|
+
--color-danger-surface-bottom: var(--color-danger-3);
|
|
102
|
+
--color-danger-focus: var(--color-danger-0);
|
|
103
|
+
--color-danger-outline: var(--color-danger-2);
|
|
104
|
+
--color-danger-shadow: var(--color-danger-4);
|
|
105
|
+
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.Theme-dark {
|
|
109
|
+
|
|
110
|
+
--color-base-0: hsl(280deg, 5%, 16%);
|
|
111
|
+
--color-base-1: hsl(280deg, 5%, 20%);
|
|
112
|
+
--color-base-2: hsl(280deg, 5%, 24%);
|
|
113
|
+
--color-base-3: hsl(280deg, 5%, 27%);
|
|
114
|
+
--color-base-4: hsl(280deg, 5%, 32%);
|
|
115
|
+
|
|
116
|
+
--color-text-0: hsl(280deg, 10%, 96%);
|
|
117
|
+
--color-text-1: hsl(280deg, 10%, 72%);
|
|
118
|
+
--color-text-2: hsl(280deg, 10%, 50%);
|
|
119
|
+
--color-text-3: hsl(280deg, 10%, 44%);
|
|
120
|
+
--color-text-4: hsl(280deg, 10%, 40%);
|
|
121
|
+
|
|
122
|
+
--color-default-0: var(--color-base-4);
|
|
123
|
+
--color-default-1: var(--color-base-3);
|
|
124
|
+
--color-default-2: var(--color-base-2);
|
|
125
|
+
--color-default-3: var(--color-base-1);
|
|
126
|
+
--color-default-4: var(--color-base-0);
|
|
127
|
+
|
|
128
|
+
}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--background-color: var(--color-base-0);
|
|
3
|
+
--text-color: var(--color-text-0);
|
|
4
|
+
|
|
5
|
+
--link-color: var(--color-primary-2);
|
|
6
|
+
--link-color-hover: var(--color-primary-1);
|
|
7
|
+
--code-color: var(--color-secondary);
|
|
8
|
+
|
|
9
|
+
--color-subtle: var(--color-text-1);
|
|
10
|
+
--color-sublime: var(--color-text-2);
|
|
11
|
+
|
|
12
|
+
--border-radius: var(--sp2);
|
|
13
|
+
--border-radius-small: var(--sp);
|
|
14
|
+
--border-radius-large: var(--sp4);
|
|
15
|
+
|
|
16
|
+
--input-size: var(--sp4);
|
|
17
|
+
--input-size-small: var(--sp3);
|
|
18
|
+
--input-size-smaller: var(--sp2);
|
|
19
|
+
--input-size-large: var(--sp5);
|
|
20
|
+
--input-size-larger: var(--sp6);
|
|
21
|
+
|
|
22
|
+
--color-overlay-backdrop: rgba(0,0,0,.08);
|
|
23
|
+
--color-overlay-shadow: rgba(0,0,0,.15);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.Theme-dark {
|
|
27
|
+
--color-overlay-backdrop: rgba(255,255,255,.04);
|
|
28
|
+
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--sp: 8px;
|
|
3
|
+
--sp0-5: calc(0.5 * var(--sp));
|
|
4
|
+
--sp1: var(--sp);
|
|
5
|
+
--sp1-5: calc(1.5 * var(--sp));
|
|
6
|
+
--sp2: calc(2 * var(--sp));
|
|
7
|
+
--sp2-5: calc(2.5 * var(--sp));
|
|
8
|
+
--sp3: calc(3 * var(--sp));
|
|
9
|
+
--sp4: calc(4 * var(--sp));
|
|
10
|
+
--sp5: calc(5 * var(--sp));
|
|
11
|
+
--sp6: calc(6 * var(--sp));
|
|
12
|
+
--sp7: calc(7 * var(--sp));
|
|
13
|
+
--sp8: calc(8 * var(--sp));
|
|
14
|
+
--sp9: calc(9 * var(--sp));
|
|
15
|
+
--sp10: calc(10 * var(--sp));
|
|
16
|
+
--sp12: calc(12 * var(--sp));
|
|
17
|
+
--sp16: calc(16 * var(--sp));
|
|
18
|
+
--sp24: calc(24 * var(--sp));
|
|
19
|
+
--sp32: calc(32 * var(--sp));
|
|
20
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
|
|
3
|
+
--font-main: sans-serif;
|
|
4
|
+
--font-monospace: monospace;
|
|
5
|
+
|
|
6
|
+
--font-size: 16px;
|
|
7
|
+
--font-size-small: 14px;
|
|
8
|
+
--font-size-smaller: 12px;
|
|
9
|
+
--font-size-large: 18px;
|
|
10
|
+
--font-size-larger: 20px;
|
|
11
|
+
|
|
12
|
+
--font-weight: 400;
|
|
13
|
+
--font-weight-bold: 500;
|
|
14
|
+
|
|
15
|
+
--line-height: 1.5em;
|
|
16
|
+
}
|
package/.idea/modules.xml
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<project version="4">
|
|
3
|
-
<component name="ProjectModuleManager">
|
|
4
|
-
<modules>
|
|
5
|
-
<module fileurl="file://$PROJECT_DIR$/.idea/nightshade.iml" filepath="$PROJECT_DIR$/.idea/nightshade.iml" />
|
|
6
|
-
</modules>
|
|
7
|
-
</component>
|
|
8
|
-
</project>
|
package/.idea/nightshade.iml
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<module type="WEB_MODULE" version="4">
|
|
3
|
-
<component name="NewModuleRootManager">
|
|
4
|
-
<content url="file://$MODULE_DIR$" />
|
|
5
|
-
<orderEntry type="inheritedJdk" />
|
|
6
|
-
<orderEntry type="sourceFolder" forTests="false" />
|
|
7
|
-
</component>
|
|
8
|
-
</module>
|
package/.idea/vcs.xml
DELETED
package/.idea/watcherTasks.xml
DELETED