@sk-web-gui/core 0.1.30 → 0.1.33

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sk-web-gui/core",
3
- "version": "0.1.30",
3
+ "version": "0.1.33",
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": "a2dd453f113d09d2e5b377fa6873eb4ef63f4f5e"
34
+ "gitHead": "4dda41ef60bddb55cc4118e8ca226d0445d2471e"
35
35
  }
@@ -0,0 +1,39 @@
1
+ module.exports = Footer = (colors) => ({
2
+ '.footer': {
3
+ '&-innerwrapper': {
4
+ '@apply bg-gray text-white py-12 px-2 sm:p-12': {},
5
+
6
+ ...colors.reduce(
7
+ (styles, color) => ({
8
+ ...styles,
9
+ [`&[data-color="${color}"]`]: {
10
+ [`@apply bg-${color}`]: {},
11
+ },
12
+ }),
13
+ {}
14
+ ),
15
+ },
16
+
17
+ '&-content': {
18
+ '@apply container md:flex items-center justify-center m-auto': {},
19
+ },
20
+
21
+ '&-bottomlinks': {
22
+ '@apply bg-gray-middle text-body py-12 px-2 sm:p-12': {},
23
+
24
+ ...colors.reduce(
25
+ (styles, color) => ({
26
+ ...styles,
27
+ [`&[data-color="${color}"]`]: {
28
+ [`@apply bg-${color}`]: {},
29
+ },
30
+ }),
31
+ {}
32
+ ),
33
+
34
+ '&-container': {
35
+ '@apply container flex items-start md:items-center justify-center m-auto md:space-x-10 flex-col md:flex-row': {},
36
+ },
37
+ },
38
+ },
39
+ });
@@ -0,0 +1,37 @@
1
+ module.exports = Header = (colors) => ({
2
+ ".header": {
3
+ "@apply lg:border-t-8 lg:border-primary lg:static lg:w-auto lg:h-auto lg:min-h-0": {},
4
+
5
+ ...colors.reduce(
6
+ (styles, color) => ({
7
+ ...styles,
8
+ [`&[data-color="${color}"]`]: {
9
+ [`@apply border-${color}`]: {},
10
+ },
11
+ }),
12
+ {}
13
+ ),
14
+
15
+ [`&[data-color="none"]`]: {
16
+ [`@apply border-none`]: {},
17
+ },
18
+
19
+ "&-container": {
20
+ "@apply flex lg:h-[112px] shadow-lg relative mx-auto px-7 pt-[22px] pb-[8px] z-10": {},
21
+ },
22
+
23
+ "&-content": {
24
+ "@apply flex items-center w-full justify-between m-auto flex-shrink-0 text-body max-w-[140rem]": {},
25
+ },
26
+
27
+ "&-usermenu": {
28
+ "@apply lg:-mr-lg block flex-shrink lg:flex lg:items-center lg:w-auto": {},
29
+
30
+ "&-content": {
31
+ "@apply flex flex-grow lg:flex justify-end items-center lg:w-auto": {},
32
+ },
33
+ },
34
+
35
+ }
36
+
37
+ });
package/src/index.js CHANGED
@@ -34,6 +34,8 @@ const UserMenu = require("./components/user-menu");
34
34
 
35
35
  const Tag = require("./components/tag");
36
36
  const Pagination = require("./components/pagination");
37
+ const Footer = require("./components/footer");
38
+ const Header = require("./components/header");
37
39
 
38
40
  const components = [
39
41
  Alert,
@@ -65,6 +67,8 @@ const components = [
65
67
 
66
68
  Tag,
67
69
  Pagination,
70
+ Footer,
71
+ Header,
68
72
  ];
69
73
 
70
74
  const defaultColors = ["primary", "secondary"];
@@ -122,6 +126,24 @@ module.exports = plugin.withOptions(
122
126
  h5: { "@apply text-base leading-base": {} },
123
127
  h6: { "@apply text-sm leading-sm": {} },
124
128
  p: { "@apply my-4": {} },
129
+
130
+ '.text-content': {
131
+ "@apply max-w-[80rem]":{},
132
+
133
+ h1: {
134
+ "@apply mb-md": {},
135
+
136
+ "+ p": {
137
+ "@apply mb-[40px]": {},
138
+ }
139
+ },
140
+ h2: { "@apply mt-lg": {} },
141
+ h3: { "@apply mt-lg": {} },
142
+ h4: { "@apply mt-lg": {} },
143
+ h5: { "@apply mt-lg": {} },
144
+ h6: { "@apply mt-lg": {} },
145
+ p: { "@apply mt-sm": {} },
146
+ }
125
147
  });
126
148
  }
127
149
  };