@sk-web-gui/core 0.1.3 → 0.1.4
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/package.json +2 -2
- package/src/components/user-menu.js +24 -0
- package/src/index.js +35 -31
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sk-web-gui/core",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.4",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"files": [
|
|
@@ -31,5 +31,5 @@
|
|
|
31
31
|
"postcss-import": "^14.0.2",
|
|
32
32
|
"tailwindcss": "^2.2.4"
|
|
33
33
|
},
|
|
34
|
-
"gitHead": "
|
|
34
|
+
"gitHead": "22e8713dc552de4fbd789ed0c6852fc4f286b4a8"
|
|
35
35
|
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
module.exports = UserMenu = (colors) => ({
|
|
2
|
+
".usermenu": {
|
|
3
|
+
// "@apply mx-sm mt-sm mb-0 px-md py-0 divide-y divide-y-2 divide-gray-300 bg-white border-2 border-white border-solid rounded":
|
|
4
|
+
"@apply drop-shadow-none shadow-none filter-none": {},
|
|
5
|
+
// "@apply ": {},
|
|
6
|
+
"&-is-open": {
|
|
7
|
+
// "@apply border-2 border-gray-300 border-solid rounded": {},
|
|
8
|
+
// "box-shadow": "0px 4px 12px rgba(27, 29, 31, 0.12)",
|
|
9
|
+
},
|
|
10
|
+
|
|
11
|
+
"&-header": {
|
|
12
|
+
// "@apply flex flex-col text-left m-0 px-0 py-sm": {},
|
|
13
|
+
'[aria-expanded="true"] &': {
|
|
14
|
+
"@apply bg-hover": {},
|
|
15
|
+
},
|
|
16
|
+
},
|
|
17
|
+
"&-body": {
|
|
18
|
+
// "@apply p-0 m-0 py-sm bg-white": {},
|
|
19
|
+
},
|
|
20
|
+
"&-item": {
|
|
21
|
+
// "@apply block -mx-md px-md py-sm": {},
|
|
22
|
+
},
|
|
23
|
+
},
|
|
24
|
+
});
|
package/src/index.js
CHANGED
|
@@ -20,11 +20,13 @@ const Switch = require("./components/switch");
|
|
|
20
20
|
|
|
21
21
|
const Button = require("./components/button");
|
|
22
22
|
const Accordion = require("./components/accordion");
|
|
23
|
-
const Card = require(
|
|
24
|
-
const Table = require(
|
|
23
|
+
const Card = require("./components/card");
|
|
24
|
+
const Table = require("./components/table");
|
|
25
25
|
|
|
26
|
-
const Modal = require(
|
|
27
|
-
const CookieConsent = require(
|
|
26
|
+
const Modal = require("./components/modal");
|
|
27
|
+
const CookieConsent = require("./components/cookie-consent");
|
|
28
|
+
|
|
29
|
+
const UserMenu = require("./components/user-menu");
|
|
28
30
|
|
|
29
31
|
const components = [
|
|
30
32
|
Alert,
|
|
@@ -48,13 +50,15 @@ const components = [
|
|
|
48
50
|
|
|
49
51
|
Accordion,
|
|
50
52
|
Card,
|
|
53
|
+
|
|
54
|
+
UserMenu,
|
|
51
55
|
];
|
|
52
56
|
|
|
53
57
|
const defaultColors = ["primary", "secondary"];
|
|
54
58
|
|
|
55
59
|
module.exports = plugin.withOptions(
|
|
56
|
-
function(options = { colors: [], cssBase: true }) {
|
|
57
|
-
return function({
|
|
60
|
+
function (options = { colors: [], cssBase: true }) {
|
|
61
|
+
return function ({
|
|
58
62
|
addComponents,
|
|
59
63
|
addVariant,
|
|
60
64
|
addBase,
|
|
@@ -106,20 +110,20 @@ module.exports = plugin.withOptions(
|
|
|
106
110
|
}
|
|
107
111
|
};
|
|
108
112
|
},
|
|
109
|
-
function() {
|
|
113
|
+
function () {
|
|
110
114
|
return {
|
|
111
115
|
theme: {
|
|
112
116
|
fontSize: {
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
117
|
+
tiny: "1rem",
|
|
118
|
+
xs: "1.2rem",
|
|
119
|
+
sm: "1.4rem",
|
|
120
|
+
base: "1.6rem",
|
|
121
|
+
lg: "1.8rem",
|
|
122
|
+
xl: "2.0rem",
|
|
123
|
+
"2xl": "2.4rem",
|
|
124
|
+
"3xl": "3.2rem",
|
|
125
|
+
"4xl": "4.0rem",
|
|
126
|
+
"5xl": "5.2rem",
|
|
123
127
|
},
|
|
124
128
|
extend: {
|
|
125
129
|
colors: {
|
|
@@ -138,22 +142,22 @@ module.exports = plugin.withOptions(
|
|
|
138
142
|
base: "var(--vc-cursor)",
|
|
139
143
|
},
|
|
140
144
|
spacing: {
|
|
141
|
-
sm:
|
|
142
|
-
md:
|
|
143
|
-
lg:
|
|
144
|
-
xl:
|
|
145
|
+
sm: "8px",
|
|
146
|
+
md: "16px",
|
|
147
|
+
lg: "24px",
|
|
148
|
+
xl: "48px",
|
|
145
149
|
},
|
|
146
150
|
lineHeight: {
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
151
|
+
tiny: "1.4rem",
|
|
152
|
+
xs: "1.6rem",
|
|
153
|
+
sm: "2rem",
|
|
154
|
+
base: "2.4rem",
|
|
155
|
+
lg: "2.4rem",
|
|
156
|
+
xl: "3.2rem",
|
|
157
|
+
"2xl": "3.2rem",
|
|
158
|
+
"3xl": "4rem",
|
|
159
|
+
"4xl": "4.8rem",
|
|
160
|
+
"5xl": "5.8rem",
|
|
157
161
|
},
|
|
158
162
|
opacity: {
|
|
159
163
|
15: "0.15",
|