nk_jtb 0.24.0 → 0.24.1
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/docs/components/list.md +9 -0
- package/package.json +1 -1
- package/src/build.scss +0 -11
- package/src/components/_list.scss +4 -2
package/docs/components/list.md
CHANGED
|
@@ -47,12 +47,21 @@ A `ul` variant that renders a circle-and-checkmark icon against each item. No
|
|
|
47
47
|
SVG in the markup — the icon is generated from the component variables at
|
|
48
48
|
compile time.
|
|
49
49
|
|
|
50
|
+
`.checklist` can be placed directly on a `ul`, or on a wrapper element when the
|
|
51
|
+
`ul` is generated and the markup is not directly accessible.
|
|
52
|
+
|
|
50
53
|
```html +code
|
|
51
54
|
<ul class="checklist">
|
|
52
55
|
<li>List item</li>
|
|
53
56
|
</ul>
|
|
54
57
|
```
|
|
55
58
|
|
|
59
|
+
```html +code
|
|
60
|
+
<div class="checklist">
|
|
61
|
+
<!-- ul rendered by CMS or template -->
|
|
62
|
+
</div>
|
|
63
|
+
```
|
|
64
|
+
|
|
56
65
|
```html +demo-folded class="bx"
|
|
57
66
|
<ul class="checklist">
|
|
58
67
|
<li>12 months access from enrolment</li>
|
package/package.json
CHANGED
package/src/build.scss
CHANGED
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
@forward './maps_and_variables/base' with (
|
|
2
|
-
$primary: #7c0442,
|
|
3
|
-
$secondary: #f4e4eb,
|
|
4
|
-
$bg-body: #f8f5f2,
|
|
5
|
-
$border-color: #e0d8d0
|
|
6
|
-
);
|
|
7
|
-
|
|
8
|
-
// @use 'nk_jtb/src/maps_and_variables/base' as *;
|
|
9
|
-
// @use 'nk_jtb/src/maps_and_variables/components' as * with (
|
|
10
|
-
// $icon-list-color: hsl(329, 29%, 37%)
|
|
11
|
-
// );
|
|
12
1
|
@use './base';
|
|
13
2
|
|
|
14
3
|
// Load components before utility classes to allow for easier overrides
|
|
@@ -16,8 +16,10 @@
|
|
|
16
16
|
// ============================================================================
|
|
17
17
|
|
|
18
18
|
.checklist {
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
&, ul {
|
|
20
|
+
list-style: none;
|
|
21
|
+
margin-inline-start: 0;
|
|
22
|
+
}
|
|
21
23
|
|
|
22
24
|
li {
|
|
23
25
|
background-image: checklist-icon($checklist-icon-bg, $checklist-icon-color);
|