pallote-css 0.3.10 → 0.3.12
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/README.md +0 -144
- package/dist/pallote.min.css +1 -1
- package/dist/pallote.min.css.map +1 -1
- package/dist/pallote.scss +31 -36
- package/dist/styles/common/_editor.scss +29 -25
- package/dist/styles/common/_fontface.scss +7 -4
- package/dist/styles/common/_global.scss +25 -22
- package/dist/styles/common/_mixins.scss +19 -16
- package/dist/styles/common/_reset.scss +4 -2
- package/dist/styles/common/_variables.scss +28 -25
- package/dist/styles/components/_accordion.scss +16 -13
- package/dist/styles/components/_alert.scss +44 -40
- package/dist/styles/components/_breadcrumbs.scss +8 -5
- package/dist/styles/components/_button.scss +32 -26
- package/dist/styles/components/_buttons.scss +4 -2
- package/dist/styles/components/_card.scss +14 -11
- package/dist/styles/components/_divider.scss +3 -1
- package/dist/styles/components/_form.scss +4 -1
- package/dist/styles/components/_grid.scss +11 -8
- package/dist/styles/components/_input.scss +36 -32
- package/dist/styles/components/_link.scss +7 -4
- package/dist/styles/components/_list.scss +2 -0
- package/dist/styles/components/_nav.scss +49 -45
- package/dist/styles/components/_navbar.scss +42 -39
- package/dist/styles/components/_section.scss +35 -31
- package/dist/styles/components/_sidebar.scss +20 -16
- package/dist/styles/components/_snippet.scss +25 -22
- package/dist/styles/components/_status.scss +8 -5
- package/dist/styles/components/_switch.scss +11 -8
- package/dist/styles/components/_tabs.scss +18 -15
- package/dist/styles/components/_tag.scss +16 -12
- package/dist/styles/utilities/_color.scss +84 -81
- package/dist/styles/utilities/_global.scss +23 -20
- package/dist/styles/utilities/_text.scss +55 -51
- package/package.json +12 -8
- package/dist/assets/fonts/SourceSansPro/regular.woff2 +0 -0
- package/dist/assets/fonts/SourceSansPro/regularitalic.woff2 +0 -0
- package/dist/assets/fonts/SourceSansPro/semibold.woff2 +0 -0
- package/dist/assets/fonts/SourceSansPro/semibolditalic.woff2 +0 -0
- package/dist/assets/icons/logos/patreon.svg +0 -3
- package/dist/assets/icons/phosphor/arrow-right.svg +0 -1
- package/dist/assets/icons/phosphor/arrow-square-out.svg +0 -1
- package/dist/assets/icons/phosphor/caret-down.svg +0 -1
- package/dist/assets/icons/phosphor/check-circle.svg +0 -1
- package/dist/assets/icons/phosphor/check.svg +0 -1
- package/dist/assets/icons/phosphor/coffee.svg +0 -1
- package/dist/assets/icons/phosphor/download-simple.svg +0 -1
- package/dist/assets/icons/phosphor/envelope-simple.svg +0 -1
- package/dist/assets/icons/phosphor/files.svg +0 -1
- package/dist/assets/icons/phosphor/info.svg +0 -1
- package/dist/assets/icons/phosphor/warning.svg +0 -1
- package/dist/assets/icons/phosphor/x-circle.svg +0 -1
- package/dist/assets/icons/rabbit.svg +0 -1
- package/dist/scripts/accordion.js +0 -42
- package/dist/scripts/button.js +0 -5
- package/dist/scripts/cookie.js +0 -15
- package/dist/scripts/input.js +0 -18
- package/dist/scripts/nav.js +0 -22
- package/dist/scripts/navbar.js +0 -28
- package/dist/scripts/switch.js +0 -3
- package/dist/scripts/tabs.js +0 -30
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
@use "sass:list";
|
|
2
|
+
@use "../common/variables";
|
|
3
|
+
|
|
1
4
|
// —————————————————————————————————————————————————————————————————
|
|
2
5
|
// fill
|
|
3
6
|
// stroke
|
|
@@ -10,56 +13,56 @@
|
|
|
10
13
|
@mixin fill($colors...) {
|
|
11
14
|
|
|
12
15
|
@each $i in $colors {
|
|
13
|
-
.fill-#{nth($i, 1)} {
|
|
14
|
-
color: nth($i, 3) !important;
|
|
15
|
-
background-color: nth($i, 2) !important;
|
|
16
|
+
.fill-#{list.nth($i, 1)} {
|
|
17
|
+
color: list.nth($i, 3) !important;
|
|
18
|
+
background-color: list.nth($i, 2) !important;
|
|
16
19
|
|
|
17
20
|
.card_title {
|
|
18
|
-
color: nth($i, 3) !important;
|
|
21
|
+
color: list.nth($i, 3) !important;
|
|
19
22
|
}
|
|
20
23
|
}
|
|
21
24
|
}
|
|
22
25
|
}
|
|
23
26
|
|
|
24
27
|
@include fill (
|
|
25
|
-
"main"
|
|
26
|
-
"contrast"
|
|
27
|
-
|
|
28
|
-
"grey90"
|
|
29
|
-
"grey80"
|
|
30
|
-
"grey70"
|
|
31
|
-
"grey60"
|
|
32
|
-
"grey50"
|
|
33
|
-
"grey40"
|
|
34
|
-
"grey30"
|
|
35
|
-
"grey20"
|
|
36
|
-
"grey10"
|
|
37
|
-
"grey5"
|
|
38
|
-
|
|
39
|
-
"default"
|
|
40
|
-
"paper"
|
|
41
|
-
|
|
42
|
-
"primaryLight"
|
|
43
|
-
"primary"
|
|
44
|
-
"primaryDark"
|
|
45
|
-
"secondaryLight"
|
|
46
|
-
"secondary"
|
|
47
|
-
"secondaryDark"
|
|
48
|
-
|
|
49
|
-
"successLight"
|
|
50
|
-
"success"
|
|
51
|
-
"successDark"
|
|
52
|
-
"infoLight"
|
|
53
|
-
"info"
|
|
54
|
-
"infoDark"
|
|
55
|
-
"warningLight"
|
|
56
|
-
"warning"
|
|
57
|
-
"warningDark"
|
|
58
|
-
"errorLight"
|
|
59
|
-
"error"
|
|
60
|
-
"errorDark"
|
|
61
|
-
|
|
62
|
-
"border"
|
|
28
|
+
"main" variables.$main variables.$text,
|
|
29
|
+
"contrast" variables.$contrast variables.$text-contrast,
|
|
30
|
+
|
|
31
|
+
"grey90" variables.$grey-90 variables.$text-contrast,
|
|
32
|
+
"grey80" variables.$grey-80 variables.$text-contrast,
|
|
33
|
+
"grey70" variables.$grey-70 variables.$text-contrast,
|
|
34
|
+
"grey60" variables.$grey-60 variables.$text-contrast,
|
|
35
|
+
"grey50" variables.$grey-50 variables.$text-contrast,
|
|
36
|
+
"grey40" variables.$grey-40 variables.$text,
|
|
37
|
+
"grey30" variables.$grey-30 variables.$text,
|
|
38
|
+
"grey20" variables.$grey-20 variables.$text,
|
|
39
|
+
"grey10" variables.$grey-10 variables.$text,
|
|
40
|
+
"grey5" variables.$grey-5 variables.$text,
|
|
41
|
+
|
|
42
|
+
"default" variables.$background-default variables.$text,
|
|
43
|
+
"paper" variables.$background-paper variables.$text,
|
|
44
|
+
|
|
45
|
+
"primaryLight" variables.$primary-light variables.$text,
|
|
46
|
+
"primary" variables.$primary variables.$text-contrast,
|
|
47
|
+
"primaryDark" variables.$primary-dark variables.$text-contrast,
|
|
48
|
+
"secondaryLight" variables.$secondary-light variables.$text,
|
|
49
|
+
"secondary" variables.$secondary variables.$text-contrast,
|
|
50
|
+
"secondaryDark" variables.$secondary-dark variables.$text-contrast,
|
|
51
|
+
|
|
52
|
+
"successLight" variables.$success-light variables.$text,
|
|
53
|
+
"success" variables.$success variables.$text-contrast,
|
|
54
|
+
"successDark" variables.$success-dark variables.$text-contrast,
|
|
55
|
+
"infoLight" variables.$info-light variables.$text,
|
|
56
|
+
"info" variables.$info variables.$text-contrast,
|
|
57
|
+
"infoDark" variables.$info-dark variables.$text-contrast,
|
|
58
|
+
"warningLight" variables.$warning-light variables.$text,
|
|
59
|
+
"warning" variables.$warning variables.$text,
|
|
60
|
+
"warningDark" variables.$warning-dark variables.$text-contrast,
|
|
61
|
+
"errorLight" variables.$error-light variables.$text,
|
|
62
|
+
"error" variables.$error variables.$text-contrast,
|
|
63
|
+
"errorDark" variables.$error-dark variables.$text-contrast,
|
|
64
|
+
|
|
65
|
+
"border" variables.$border-color variables.$text
|
|
63
66
|
);
|
|
64
67
|
|
|
65
68
|
// —————————————————————————————————————————————————————————————————
|
|
@@ -68,49 +71,49 @@
|
|
|
68
71
|
|
|
69
72
|
@mixin stroke($colors...) {
|
|
70
73
|
@each $i in $colors {
|
|
71
|
-
.stroke-#{nth($i, 1)} {
|
|
72
|
-
border: 1px solid nth($i, 2) !important;
|
|
74
|
+
.stroke-#{list.nth($i, 1)} {
|
|
75
|
+
border: 1px solid list.nth($i, 2) !important;
|
|
73
76
|
}
|
|
74
77
|
}
|
|
75
78
|
}
|
|
76
79
|
|
|
77
80
|
@include stroke (
|
|
78
|
-
"main"
|
|
79
|
-
"contrast"
|
|
80
|
-
|
|
81
|
-
"grey90"
|
|
82
|
-
"grey80"
|
|
83
|
-
"grey70"
|
|
84
|
-
"grey60"
|
|
85
|
-
"grey50"
|
|
86
|
-
"grey40"
|
|
87
|
-
"grey30"
|
|
88
|
-
"grey20"
|
|
89
|
-
"grey10"
|
|
90
|
-
"grey5"
|
|
91
|
-
|
|
92
|
-
"default"
|
|
93
|
-
"paper"
|
|
94
|
-
|
|
95
|
-
"primaryLight"
|
|
96
|
-
"primary"
|
|
97
|
-
"primaryDark"
|
|
98
|
-
"secondaryLight"
|
|
99
|
-
"secondary"
|
|
100
|
-
"secondaryDark"
|
|
101
|
-
|
|
102
|
-
"successLight"
|
|
103
|
-
"success"
|
|
104
|
-
"successDark"
|
|
105
|
-
"infoLight"
|
|
106
|
-
"info"
|
|
107
|
-
"infoDark"
|
|
108
|
-
"warningLight"
|
|
109
|
-
"warning"
|
|
110
|
-
"warningDark"
|
|
111
|
-
"errorLight"
|
|
112
|
-
"error"
|
|
113
|
-
"errorDark"
|
|
81
|
+
"main" variables.$main,
|
|
82
|
+
"contrast" variables.$contrast,
|
|
83
|
+
|
|
84
|
+
"grey90" variables.$grey-90,
|
|
85
|
+
"grey80" variables.$grey-80,
|
|
86
|
+
"grey70" variables.$grey-70,
|
|
87
|
+
"grey60" variables.$grey-60,
|
|
88
|
+
"grey50" variables.$grey-50,
|
|
89
|
+
"grey40" variables.$grey-40,
|
|
90
|
+
"grey30" variables.$grey-30,
|
|
91
|
+
"grey20" variables.$grey-20,
|
|
92
|
+
"grey10" variables.$grey-10,
|
|
93
|
+
"grey5" variables.$grey-5 ,
|
|
94
|
+
|
|
95
|
+
"default" variables.$background-default,
|
|
96
|
+
"paper" variables.$background-paper,
|
|
97
|
+
|
|
98
|
+
"primaryLight" variables.$primary-light,
|
|
99
|
+
"primary" variables.$primary,
|
|
100
|
+
"primaryDark" variables.$primary-dark,
|
|
101
|
+
"secondaryLight" variables.$secondary-light,
|
|
102
|
+
"secondary" variables.$secondary,
|
|
103
|
+
"secondaryDark" variables.$secondary-dark,
|
|
104
|
+
|
|
105
|
+
"successLight" variables.$success-light,
|
|
106
|
+
"success" variables.$success,
|
|
107
|
+
"successDark" variables.$success-dark,
|
|
108
|
+
"infoLight" variables.$info-light,
|
|
109
|
+
"info" variables.$info,
|
|
110
|
+
"infoDark" variables.$info-dark,
|
|
111
|
+
"warningLight" variables.$warning-light,
|
|
112
|
+
"warning" variables.$warning,
|
|
113
|
+
"warningDark" variables.$warning-dark,
|
|
114
|
+
"errorLight" variables.$error-light,
|
|
115
|
+
"error" variables.$error,
|
|
116
|
+
"errorDark" variables.$error-dark,
|
|
114
117
|
|
|
115
|
-
"border"
|
|
118
|
+
"border" variables.$border-color
|
|
116
119
|
);
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
@use "../common/mixins";
|
|
2
|
+
@use "../common/variables";
|
|
3
|
+
|
|
1
4
|
// —————————————————————————————————————————————————————————————————
|
|
2
5
|
// responsive
|
|
3
6
|
// spacing and size
|
|
@@ -13,22 +16,22 @@
|
|
|
13
16
|
|
|
14
17
|
.hide {
|
|
15
18
|
|
|
16
|
-
&-desktop { @include responsive(down, desktop) { display: none !important; } }
|
|
17
|
-
&-laptop { @include responsive(down, laptop) { display: none !important; } }
|
|
18
|
-
&-tablet { @include responsive(down, tablet) { display: none !important; } }
|
|
19
|
-
&-mobile { @include responsive(down, mobile) { display: none !important; } }
|
|
20
|
-
&-mobileSm { @include responsive(down, mobile-sm) { display: none !important; } }
|
|
21
|
-
&-touch { @include responsive-touch { display: none !important; } }
|
|
19
|
+
&-desktop { @include mixins.responsive(down, desktop) { display: none !important; } }
|
|
20
|
+
&-laptop { @include mixins.responsive(down, laptop) { display: none !important; } }
|
|
21
|
+
&-tablet { @include mixins.responsive(down, tablet) { display: none !important; } }
|
|
22
|
+
&-mobile { @include mixins.responsive(down, mobile) { display: none !important; } }
|
|
23
|
+
&-mobileSm { @include mixins.responsive(down, mobile-sm) { display: none !important; } }
|
|
24
|
+
&-touch { @include mixins.responsive-touch { display: none !important; } }
|
|
22
25
|
}
|
|
23
26
|
|
|
24
27
|
.show {
|
|
25
28
|
|
|
26
|
-
&-desktop { @include responsive(up, desktop) { display: none !important; } }
|
|
27
|
-
&-laptop { @include responsive(up, laptop) { display: none !important; } }
|
|
28
|
-
&-tablet { @include responsive(up, tablet) { display: none !important; } }
|
|
29
|
-
&-mobile { @include responsive(up, mobile) { display: none !important; } }
|
|
30
|
-
&-mobileSm { @include responsive(up, mobile-sm) { display: none !important; } }
|
|
31
|
-
&-touch { @include responsive-click { display: none !important; } }
|
|
29
|
+
&-desktop { @include mixins.responsive(up, desktop) { display: none !important; } }
|
|
30
|
+
&-laptop { @include mixins.responsive(up, laptop) { display: none !important; } }
|
|
31
|
+
&-tablet { @include mixins.responsive(up, tablet) { display: none !important; } }
|
|
32
|
+
&-mobile { @include mixins.responsive(up, mobile) { display: none !important; } }
|
|
33
|
+
&-mobileSm { @include mixins.responsive(up, mobile-sm) { display: none !important; } }
|
|
34
|
+
&-touch { @include mixins.responsive-click { display: none !important; } }
|
|
32
35
|
}
|
|
33
36
|
|
|
34
37
|
// —————————————————————————————————————————————————————————————————
|
|
@@ -193,16 +196,16 @@ $fractions: ( "¼": 0.25, "½": 0.5, "¾": 0.75 );
|
|
|
193
196
|
// border
|
|
194
197
|
// —————————————————————————————————————————————————————————————————
|
|
195
198
|
|
|
196
|
-
.b-1 { border:
|
|
197
|
-
.bt-1 { border-top:
|
|
198
|
-
.br-1 { border-right:
|
|
199
|
-
.bb-1 { border-bottom:
|
|
200
|
-
.bl-1 { border-left:
|
|
199
|
+
.b-1 { border: variables.$border; }
|
|
200
|
+
.bt-1 { border-top: variables.$border; }
|
|
201
|
+
.br-1 { border-right: variables.$border; }
|
|
202
|
+
.bb-1 { border-bottom: variables.$border; }
|
|
203
|
+
.bl-1 { border-left: variables.$border; }
|
|
201
204
|
|
|
202
205
|
// —————————————————————————————————————————————————————————————————
|
|
203
206
|
// border-radius
|
|
204
207
|
// —————————————————————————————————————————————————————————————————
|
|
205
208
|
|
|
206
|
-
.br-sm { border-radius:
|
|
207
|
-
.br-md { border-radius:
|
|
208
|
-
.br-lg { border-radius:
|
|
209
|
+
.br-sm { border-radius: variables.$border-radius-sm; }
|
|
210
|
+
.br-md { border-radius: variables.$border-radius-md; }
|
|
211
|
+
.br-lg { border-radius: variables.$border-radius-lg; }
|
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
@use "sass:list";
|
|
2
|
+
@use "../common/mixins";
|
|
3
|
+
@use "../common/variables";
|
|
4
|
+
|
|
1
5
|
// —————————————————————————————————————————————————————————————————
|
|
2
6
|
// elements
|
|
3
7
|
// align
|
|
@@ -22,81 +26,81 @@
|
|
|
22
26
|
|
|
23
27
|
.h1, %h1 {
|
|
24
28
|
@include font-size(
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
29
|
+
variables.$h1-size,
|
|
30
|
+
variables.$h1-weight,
|
|
31
|
+
variables.$h1-line-height
|
|
28
32
|
);
|
|
29
33
|
}
|
|
30
34
|
|
|
31
35
|
.h2, %h2 {
|
|
32
36
|
@include font-size(
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
37
|
+
variables.$h2-size,
|
|
38
|
+
variables.$h2-weight,
|
|
39
|
+
variables.$h2-line-height
|
|
36
40
|
);
|
|
37
41
|
}
|
|
38
42
|
|
|
39
43
|
.h3, %h3 {
|
|
40
44
|
@include font-size(
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
45
|
+
variables.$h3-size,
|
|
46
|
+
variables.$h3-weight,
|
|
47
|
+
variables.$h3-line-height
|
|
44
48
|
);
|
|
45
49
|
}
|
|
46
50
|
|
|
47
51
|
.h4, %h4 {
|
|
48
52
|
@include font-size(
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
53
|
+
variables.$h4-size,
|
|
54
|
+
variables.$h4-weight,
|
|
55
|
+
variables.$h4-line-height
|
|
52
56
|
);
|
|
53
57
|
}
|
|
54
58
|
|
|
55
59
|
.h5, %h5 {
|
|
56
60
|
@include font-size(
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
61
|
+
variables.$h5-size,
|
|
62
|
+
variables.$h5-weight,
|
|
63
|
+
variables.$h5-line-height
|
|
60
64
|
);
|
|
61
65
|
}
|
|
62
66
|
|
|
63
67
|
.h6, %h6 {
|
|
64
68
|
@include font-size(
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
69
|
+
variables.$h6-size,
|
|
70
|
+
variables.$h6-weight,
|
|
71
|
+
variables.$h6-line-height
|
|
68
72
|
);
|
|
69
73
|
}
|
|
70
74
|
|
|
71
75
|
.subtitle, %subtitle {
|
|
72
76
|
@include font-size(
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
77
|
+
variables.$subtitle-size,
|
|
78
|
+
variables.$subtitle-weight,
|
|
79
|
+
variables.$subtitle-line-height
|
|
76
80
|
);
|
|
77
81
|
}
|
|
78
82
|
|
|
79
83
|
.body, %body {
|
|
80
84
|
@include font-size(
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
85
|
+
variables.$body-size,
|
|
86
|
+
variables.$body-weight,
|
|
87
|
+
variables.$body-line-height
|
|
84
88
|
);
|
|
85
89
|
}
|
|
86
90
|
|
|
87
91
|
.caption, %caption {
|
|
88
92
|
@include font-size(
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
93
|
+
variables.$caption-size,
|
|
94
|
+
variables.$caption-weight,
|
|
95
|
+
variables.$caption-line-height
|
|
92
96
|
);
|
|
93
97
|
}
|
|
94
98
|
|
|
95
99
|
.overline, %overline {
|
|
96
100
|
@include font-size(
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
101
|
+
variables.$overline-size,
|
|
102
|
+
variables.$overline-weight,
|
|
103
|
+
variables.$overline-line-height
|
|
100
104
|
);
|
|
101
105
|
}
|
|
102
106
|
|
|
@@ -124,8 +128,8 @@
|
|
|
124
128
|
// weight
|
|
125
129
|
// —————————————————————————————————————————————————————————————————
|
|
126
130
|
|
|
127
|
-
.text-regular, %text-regular { font-weight:
|
|
128
|
-
.text-bold, %text-bold { font-weight:
|
|
131
|
+
.text-regular, %text-regular { font-weight: variables.$font-regular !important; }
|
|
132
|
+
.text-bold, %text-bold { font-weight: variables.$font-bold !important; }
|
|
129
133
|
|
|
130
134
|
// —————————————————————————————————————————————————————————————————
|
|
131
135
|
// transform
|
|
@@ -160,7 +164,7 @@
|
|
|
160
164
|
// code
|
|
161
165
|
// —————————————————————————————————————————————————————————————————
|
|
162
166
|
|
|
163
|
-
.text-code, %text-code { font-family:
|
|
167
|
+
.text-code, %text-code { font-family: variables.$font-code !important; }
|
|
164
168
|
|
|
165
169
|
// —————————————————————————————————————————————————————————————————
|
|
166
170
|
// color
|
|
@@ -168,17 +172,17 @@
|
|
|
168
172
|
|
|
169
173
|
@mixin color($prefix, $colors...) {
|
|
170
174
|
@each $i in $colors {
|
|
171
|
-
.#{$prefix}#{nth($i, 1)} {
|
|
172
|
-
color: nth($i, 2) !important;
|
|
175
|
+
.#{$prefix}#{list.nth($i, 1)} {
|
|
176
|
+
color: list.nth($i, 2) !important;
|
|
173
177
|
|
|
174
178
|
.h1, .h2, .h3, .h4, .h5, .h6 {
|
|
175
|
-
color: nth($i, 2) !important;
|
|
179
|
+
color: list.nth($i, 2) !important;
|
|
176
180
|
}
|
|
177
181
|
|
|
178
182
|
&.link {
|
|
179
|
-
text-decoration: underline rgba(nth($i, 2), 0.5);
|
|
183
|
+
text-decoration: underline rgba(list.nth($i, 2), 0.5);
|
|
180
184
|
|
|
181
|
-
@include hover {
|
|
185
|
+
@include mixins.hover {
|
|
182
186
|
text-decoration: underline 0.125em;
|
|
183
187
|
}
|
|
184
188
|
}
|
|
@@ -187,17 +191,17 @@
|
|
|
187
191
|
}
|
|
188
192
|
|
|
189
193
|
@include color('text-',
|
|
190
|
-
'default'
|
|
191
|
-
'alt'
|
|
192
|
-
'disabled'
|
|
193
|
-
'contrast'
|
|
194
|
-
'contrastAlt'
|
|
195
|
-
'contrastDisabled'
|
|
196
|
-
'primary'
|
|
197
|
-
'secondary'
|
|
198
|
-
'primary'
|
|
199
|
-
'success'
|
|
200
|
-
'info'
|
|
201
|
-
'warning'
|
|
202
|
-
'error'
|
|
194
|
+
'default' variables.$text,
|
|
195
|
+
'alt' variables.$text-alt,
|
|
196
|
+
'disabled' variables.$text-disabled,
|
|
197
|
+
'contrast' variables.$text-contrast,
|
|
198
|
+
'contrastAlt' variables.$text-contrast-alt,
|
|
199
|
+
'contrastDisabled' variables.$text-contrast-disabled,
|
|
200
|
+
'primary' variables.$primary,
|
|
201
|
+
'secondary' variables.$secondary,
|
|
202
|
+
'primary' variables.$primary,
|
|
203
|
+
'success' variables.$success,
|
|
204
|
+
'info' variables.$info,
|
|
205
|
+
'warning' variables.$warning,
|
|
206
|
+
'error' variables.$error,
|
|
203
207
|
);
|
package/package.json
CHANGED
|
@@ -1,17 +1,21 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "pallote-css",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.12",
|
|
4
4
|
"description": "CSS component library",
|
|
5
|
-
"main": "dist/
|
|
5
|
+
"main": "dist/pallote.scss",
|
|
6
|
+
"styles": "dist/pallote.scss",
|
|
6
7
|
"files": [
|
|
7
8
|
"dist/*"
|
|
8
9
|
],
|
|
10
|
+
"publishConfig": {
|
|
11
|
+
"directory": "dist"
|
|
12
|
+
},
|
|
9
13
|
"scripts": {
|
|
10
|
-
"dev": "
|
|
11
|
-
"build": "npm run build:
|
|
12
|
-
"build:
|
|
13
|
-
"build:
|
|
14
|
-
"
|
|
14
|
+
"dev": "onchange 'src/styles/**/*.scss' 'src/scripts/**/*.js' -- npm run build",
|
|
15
|
+
"build": "npm run build:js && npm run build:css",
|
|
16
|
+
"build:assets": "ncp src/assets dist/assets",
|
|
17
|
+
"build:css": "sass src/pallote.scss dist/pallote.min.css --style=compressed && ncp src/styles dist/styles && ncp src/pallote.scss dist/pallote.scss",
|
|
18
|
+
"build:js": "uglifyjs src/scripts/*.js -o dist/pallote.min.js"
|
|
15
19
|
},
|
|
16
20
|
"repository": {
|
|
17
21
|
"type": "git",
|
|
@@ -29,8 +33,8 @@
|
|
|
29
33
|
},
|
|
30
34
|
"homepage": "https://github.com/ArnaudDarre/pallote-css#readme",
|
|
31
35
|
"devDependencies": {
|
|
36
|
+
"ncp": "^2.0.0",
|
|
32
37
|
"onchange": "^7.1.0",
|
|
33
|
-
"pallote-css": "^0.2.7",
|
|
34
38
|
"sass": "^1.71.1",
|
|
35
39
|
"uglify-js": "^3.17.4"
|
|
36
40
|
}
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
-
<path d="M22.0873 7.60923C22.0835 4.80015 19.8957 2.49789 17.3288 1.66718C14.1413 0.635628 9.93721 0.785146 6.89347 2.22126C3.20439 3.96211 2.04552 7.77545 2.00233 11.5786C1.96689 14.7055 2.27896 22.941 6.92423 22.9997C10.3758 23.0435 10.8897 18.596 12.4868 16.4541C13.623 14.9301 15.086 14.4997 16.887 14.054C19.9823 13.2879 22.0918 10.8451 22.0873 7.60923Z" fill="currentColor"/>
|
|
3
|
-
</svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M224,104a8,8,0,0,1-16,0V59.32l-66.33,66.34a8,8,0,0,1-11.32-11.32L196.68,48H152a8,8,0,0,1,0-16h64a8,8,0,0,1,8,8Zm-40,24a8,8,0,0,0-8,8v72H48V80h72a8,8,0,0,0,0-16H48A16,16,0,0,0,32,80V208a16,16,0,0,0,16,16H176a16,16,0,0,0,16-16V136A8,8,0,0,0,184,128Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M229.66,77.66l-128,128a8,8,0,0,1-11.32,0l-56-56a8,8,0,0,1,11.32-11.32L96,188.69,218.34,66.34a8,8,0,0,1,11.32,11.32Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M80,56V24a8,8,0,0,1,16,0V56a8,8,0,0,1-16,0Zm40,8a8,8,0,0,0,8-8V24a8,8,0,0,0-16,0V56A8,8,0,0,0,120,64Zm32,0a8,8,0,0,0,8-8V24a8,8,0,0,0-16,0V56A8,8,0,0,0,152,64Zm96,56v8a40,40,0,0,1-37.51,39.91,96.59,96.59,0,0,1-27,40.09H208a8,8,0,0,1,0,16H32a8,8,0,0,1,0-16H56.54A96.3,96.3,0,0,1,24,136V88a8,8,0,0,1,8-8H208A40,40,0,0,1,248,120ZM200,96H40v40a80.27,80.27,0,0,0,45.12,72h69.76A80.27,80.27,0,0,0,200,136Zm32,24a24,24,0,0,0-16-22.62V136a95.78,95.78,0,0,1-1.2,15A24,24,0,0,0,232,128Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M224,144v64a8,8,0,0,1-8,8H40a8,8,0,0,1-8-8V144a8,8,0,0,1,16,0v56H208V144a8,8,0,0,1,16,0Zm-101.66,5.66a8,8,0,0,0,11.32,0l40-40a8,8,0,0,0-11.32-11.32L136,124.69V32a8,8,0,0,0-16,0v92.69L93.66,98.34a8,8,0,0,0-11.32,11.32Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M224,48H32a8,8,0,0,0-8,8V192a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A8,8,0,0,0,224,48ZM203.43,64,128,133.15,52.57,64ZM216,192H40V74.19l82.59,75.71a8,8,0,0,0,10.82,0L216,74.19V192Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M213.66,66.34l-40-40A8,8,0,0,0,168,24H88A16,16,0,0,0,72,40V56H56A16,16,0,0,0,40,72V216a16,16,0,0,0,16,16H168a16,16,0,0,0,16-16V200h16a16,16,0,0,0,16-16V72A8,8,0,0,0,213.66,66.34ZM168,216H56V72h76.69L168,107.31v84.53c0,.06,0,.11,0,.16s0,.1,0,.16V216Zm32-32H184V104a8,8,0,0,0-2.34-5.66l-40-40A8,8,0,0,0,136,56H88V40h76.69L200,75.31Zm-56-32a8,8,0,0,1-8,8H88a8,8,0,0,1,0-16h48A8,8,0,0,1,144,152Zm0,32a8,8,0,0,1-8,8H88a8,8,0,0,1,0-16h48A8,8,0,0,1,144,184Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M236.8,188.09,149.35,36.22h0a24.76,24.76,0,0,0-42.7,0L19.2,188.09a23.51,23.51,0,0,0,0,23.72A24.35,24.35,0,0,0,40.55,224h174.9a24.35,24.35,0,0,0,21.33-12.19A23.51,23.51,0,0,0,236.8,188.09ZM222.93,203.8a8.5,8.5,0,0,1-7.48,4.2H40.55a8.5,8.5,0,0,1-7.48-4.2,7.59,7.59,0,0,1,0-7.72L120.52,44.21a8.75,8.75,0,0,1,15,0l87.45,151.87A7.59,7.59,0,0,1,222.93,203.8ZM120,144V104a8,8,0,0,1,16,0v40a8,8,0,0,1-16,0Zm20,36a12,12,0,1,1-12-12A12,12,0,0,1,140,180Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M165.66,101.66,139.31,128l26.35,26.34a8,8,0,0,1-11.32,11.32L128,139.31l-26.34,26.35a8,8,0,0,1-11.32-11.32L116.69,128,90.34,101.66a8,8,0,0,1,11.32-11.32L128,116.69l26.34-26.35a8,8,0,0,1,11.32,11.32ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z"></path></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-rabbit"><path d="M20 8.54V4a2 2 0 1 0-4 0v3"/><path d="M7.61 12.53a3 3 0 1 0-1.6 4.3" color="white"/><path d="M18 21h-8a4 4 0 0 1-4-4 7 7 0 0 1 7-7h.2L9.6 6.4a1.93 1.93 0 1 1 2.8-2.8L15.8 7h.2c3.3 0 6 2.7 6 6v1a2 2 0 0 1-2 2h-1c-1.7 0-3 1.3-3 3"/><path d="M13 16a3 3 0 0 1 2.24 5"/><path d="M18 12h.01" color="white"/></svg>
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
document.addEventListener("DOMContentLoaded", function() {
|
|
2
|
-
var acc = document.getElementsByClassName("accordion__control");
|
|
3
|
-
var panels = document.getElementsByClassName("accordion__content");
|
|
4
|
-
var activeAccordionItem = document.querySelector(".accordion__item--active");
|
|
5
|
-
|
|
6
|
-
for (var i = 0; i < acc.length; i++) {
|
|
7
|
-
acc[i].addEventListener("click", function() {
|
|
8
|
-
var panel = this.nextElementSibling;
|
|
9
|
-
|
|
10
|
-
// Check if the clicked accordion__control is already active
|
|
11
|
-
var isActive = this.parentElement.classList.contains("accordion__item--active");
|
|
12
|
-
|
|
13
|
-
// Close all panels
|
|
14
|
-
closeAllPanels();
|
|
15
|
-
|
|
16
|
-
// If the clicked accordion__control is not already active, open it
|
|
17
|
-
if (!isActive) {
|
|
18
|
-
// Toggle the clicked accordion__control
|
|
19
|
-
this.parentElement.classList.add("accordion__item--active");
|
|
20
|
-
panel.style.maxHeight = panel.scrollHeight + "px";
|
|
21
|
-
}
|
|
22
|
-
});
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
// If any accordion item has the class accordion__item--active, expand it on page load
|
|
26
|
-
if (activeAccordionItem) {
|
|
27
|
-
var activePanel = activeAccordionItem.querySelector(".accordion__content");
|
|
28
|
-
activeAccordionItem.classList.add("accordion__item--active");
|
|
29
|
-
activePanel.style.maxHeight = activePanel.scrollHeight + "px";
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
function closeAllPanels() {
|
|
33
|
-
for (var i = 0; i < panels.length; i++) {
|
|
34
|
-
var panel = panels[i];
|
|
35
|
-
var accordionBtn = panel.previousElementSibling;
|
|
36
|
-
if (accordionBtn.parentElement.classList.contains("accordion__item--active")) {
|
|
37
|
-
accordionBtn.parentElement.classList.remove("accordion__item--active");
|
|
38
|
-
panel.style.maxHeight = null;
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
});
|
package/dist/scripts/button.js
DELETED
package/dist/scripts/cookie.js
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
function closeCookieNotice() {
|
|
2
|
-
const nowDate = new Date();
|
|
3
|
-
const expireDate = new Date(nowDate.setDate(nowDate.getDate() + 30)).toUTCString();
|
|
4
|
-
|
|
5
|
-
document.cookie = "cookie_notice=0;path=/;expires=" + expireDate + ";SameSite=Lax;";
|
|
6
|
-
document.getElementById("cookie").classList.add("js-cookie-accepted");
|
|
7
|
-
};
|
|
8
|
-
|
|
9
|
-
document.addEventListener("DOMContentLoaded", function() {
|
|
10
|
-
const cookie_notice = ('; ' + document.cookie).split('; cookie_notice=').pop().split(';')[0];
|
|
11
|
-
|
|
12
|
-
if (cookie_notice !== "0") {
|
|
13
|
-
document.getElementById("cookie").style.display = "flex";
|
|
14
|
-
}
|
|
15
|
-
});
|