@ulu/frontend 0.3.2 → 0.3.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/dist/es/ui/slider.d.ts +8 -5
- package/dist/es/ui/slider.d.ts.map +1 -1
- package/dist/es/ui/slider.js +59 -57
- package/dist/umd/frontend.css +1 -1
- package/dist/umd/ulu-frontend.umd.js +9 -9
- package/lib/js/ui/slider.js +37 -20
- package/lib/scss/base/_elements.scss +4 -1
- package/lib/scss/components/_accordion.scss +14 -9
- package/package.json +2 -1
|
@@ -84,6 +84,7 @@ $config: (
|
|
|
84
84
|
"summary-line-height": null,
|
|
85
85
|
"summary-padding-y": 1em,
|
|
86
86
|
"summary-type-size": false,
|
|
87
|
+
"summary-font-weight": bold,
|
|
87
88
|
"summary-border-enabled": true,
|
|
88
89
|
"summary-border-color": "rule-light",
|
|
89
90
|
"summary-border-width": 1px,
|
|
@@ -124,13 +125,15 @@ $config: (
|
|
|
124
125
|
|
|
125
126
|
// When not one of our custom classed details components
|
|
126
127
|
#{ $prefix } {
|
|
128
|
+
--ulu-accordion-radius-top: #{get("border-radius")};
|
|
129
|
+
--ulu-accordion-radius-bottom: #{get("border-radius")};
|
|
127
130
|
position: relative; // For pushing to the top when in accordion groups
|
|
128
131
|
padding: 0;
|
|
129
132
|
margin: get("margin");
|
|
130
133
|
border: $border;
|
|
131
134
|
background-color: color.get(get("background-color"));
|
|
132
135
|
box-shadow: get("box-shadow");
|
|
133
|
-
border-radius:
|
|
136
|
+
border-radius: var(--ulu-accordion-radius-top) var(--ulu-accordion-radius-top) var(--ulu-accordion-radius-bottom) var(--ulu-accordion-radius-bottom);
|
|
134
137
|
|
|
135
138
|
// Sibling before sets the gap
|
|
136
139
|
& + #{ $prefix } {
|
|
@@ -140,13 +143,11 @@ $config: (
|
|
|
140
143
|
// If no space get rid of border radiuses
|
|
141
144
|
@if (get("margin-between") == 0) {
|
|
142
145
|
&:has(+ #{ $prefix }) {
|
|
143
|
-
|
|
144
|
-
border-bottom-right-radius: 0;
|
|
146
|
+
--ulu-accordion-radius-bottom: 0;
|
|
145
147
|
margin-bottom: 0;
|
|
146
148
|
}
|
|
147
149
|
& + #{ $prefix } {
|
|
148
|
-
|
|
149
|
-
border-top-right-radius: 0;
|
|
150
|
+
--ulu-accordion-radius-top: 0;
|
|
150
151
|
margin-top: -(get("border-width")); // Pull border over top
|
|
151
152
|
}
|
|
152
153
|
} @else {
|
|
@@ -185,8 +186,8 @@ $config: (
|
|
|
185
186
|
color: color.get(get("summary-color"));
|
|
186
187
|
line-height: get("summary-line-height");
|
|
187
188
|
padding: get("summary-padding-y") $padding-x;
|
|
188
|
-
border-radius:
|
|
189
|
-
font-weight:
|
|
189
|
+
border-radius: var(--ulu-accordion-radius-top) var(--ulu-accordion-radius-top) var(--ulu-accordion-radius-bottom) var(--ulu-accordion-radius-bottom);
|
|
190
|
+
font-weight: get("summary-font-weight");
|
|
190
191
|
cursor: pointer;
|
|
191
192
|
align-items: center;
|
|
192
193
|
|
|
@@ -219,8 +220,8 @@ $config: (
|
|
|
219
220
|
}
|
|
220
221
|
#{ $prefix }__content {
|
|
221
222
|
padding: get("padding-y") $padding-x;
|
|
222
|
-
border-bottom-left-radius:
|
|
223
|
-
border-bottom-right-radius:
|
|
223
|
+
border-bottom-left-radius: var(--ulu-accordion-radius-bottom);
|
|
224
|
+
border-bottom-right-radius: var(--ulu-accordion-radius-bottom);
|
|
224
225
|
}
|
|
225
226
|
#{ $prefix }--transparent {
|
|
226
227
|
border-left: none;
|
|
@@ -257,6 +258,10 @@ $config: (
|
|
|
257
258
|
& + #{ $prefix }--borderless {
|
|
258
259
|
margin-top: calc(get("borderless-margin-between") - get("border-width"));
|
|
259
260
|
}
|
|
261
|
+
> #{ $prefix }__summary,
|
|
262
|
+
> #{ $prefix }__content {
|
|
263
|
+
border-radius: get("border-radius");
|
|
264
|
+
}
|
|
260
265
|
&[open],
|
|
261
266
|
&#{ $active-selector } {
|
|
262
267
|
& > #{ $prefix }__summary {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ulu/frontend",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.4",
|
|
4
4
|
"description": "A framework-agnostic frontend toolkit providing a modular, tree-shakable library of accessible components and utilities. Designed for seamless integration, it features a highly configurable SCSS system for any environment and vanilla JavaScript modules optimized for traditional websites and content management systems.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|
|
@@ -67,6 +67,7 @@
|
|
|
67
67
|
"theming",
|
|
68
68
|
"toolkit",
|
|
69
69
|
"tree-shaking",
|
|
70
|
+
"tree-shakeable",
|
|
70
71
|
"ui",
|
|
71
72
|
"user-interface",
|
|
72
73
|
"utilities",
|