@klodd/ds 5.10.0 → 5.11.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/css/00-primitives.css +11 -0
- package/css/icons/klodd-icons.svg +131 -0
- package/package.json +1 -1
- package/js/lucide-init.js +0 -27
package/css/00-primitives.css
CHANGED
|
@@ -407,6 +407,17 @@
|
|
|
407
407
|
--bp-tablet: 768px;
|
|
408
408
|
--bp-desktop: 1024px;
|
|
409
409
|
|
|
410
|
+
/* Desktop layout breakpoints
|
|
411
|
+
Använd BARA för sidlayout (media queries på makronivå).
|
|
412
|
+
Komponentresponsivitet → container queries, inte dessa.
|
|
413
|
+
--bp-medium (1024px) sammanfaller avsiktligt med --bp-desktop:
|
|
414
|
+
--bp-desktop är legacy-token som komponenter redan kan referera,
|
|
415
|
+
--bp-medium är desktop-fasens nya makrolayout-token. Olika
|
|
416
|
+
semantisk roll, samma värde. */
|
|
417
|
+
--bp-compact: 720px; /* mobil → mellanbredd */
|
|
418
|
+
--bp-medium: 1024px; /* mellanbredd → desktop */
|
|
419
|
+
--bp-expanded: 1440px; /* desktop → wide */
|
|
420
|
+
|
|
410
421
|
--max-w-mobile: 600px;
|
|
411
422
|
--max-w-tablet: 680px;
|
|
412
423
|
--max-w-desktop: 1280px;
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
<!-- ================================================================
|
|
2
|
+
klodd-icons.svg - self-hosted SVG-sprite (Atgard 2, 2026-05-22)
|
|
3
|
+
Ersatter Lucide CDN. 25 symboler: 5 produktions-ikoner + 20 kurerad
|
|
4
|
+
bas. Geometri extraherad ur lucide@1.16.0 (ISC-licens).
|
|
5
|
+
Anvandning:
|
|
6
|
+
<svg class="icon" aria-hidden="true">
|
|
7
|
+
<use href="/static/css/ds/icons/klodd-icons.svg#icon-NAMN"></use>
|
|
8
|
+
</svg>
|
|
9
|
+
================================================================ -->
|
|
10
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:none">
|
|
11
|
+
<!-- Produktions-ikoner (job_detail.html) -->
|
|
12
|
+
<symbol id="icon-chevron-down" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
13
|
+
<path d="m6 9 6 6 6-6"/>
|
|
14
|
+
</symbol>
|
|
15
|
+
<symbol id="icon-history" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
16
|
+
<path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/>
|
|
17
|
+
<path d="M3 3v5h5"/>
|
|
18
|
+
<path d="M12 7v5l4 2"/>
|
|
19
|
+
</symbol>
|
|
20
|
+
<symbol id="icon-file-text" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
21
|
+
<path d="M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z"/>
|
|
22
|
+
<path d="M14 2v5a1 1 0 0 0 1 1h5"/>
|
|
23
|
+
<path d="M10 9H8"/>
|
|
24
|
+
<path d="M16 13H8"/>
|
|
25
|
+
<path d="M16 17H8"/>
|
|
26
|
+
</symbol>
|
|
27
|
+
<symbol id="icon-building" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
28
|
+
<path d="M12 10h.01"/>
|
|
29
|
+
<path d="M12 14h.01"/>
|
|
30
|
+
<path d="M12 6h.01"/>
|
|
31
|
+
<path d="M16 10h.01"/>
|
|
32
|
+
<path d="M16 14h.01"/>
|
|
33
|
+
<path d="M16 6h.01"/>
|
|
34
|
+
<path d="M8 10h.01"/>
|
|
35
|
+
<path d="M8 14h.01"/>
|
|
36
|
+
<path d="M8 6h.01"/>
|
|
37
|
+
<path d="M9 22v-3a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3"/>
|
|
38
|
+
<rect x="4" y="2" width="16" height="20" rx="2"/>
|
|
39
|
+
</symbol>
|
|
40
|
+
<symbol id="icon-briefcase-business" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
41
|
+
<path d="M12 12h.01"/>
|
|
42
|
+
<path d="M16 6V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v2"/>
|
|
43
|
+
<path d="M22 13a18.15 18.15 0 0 1-20 0"/>
|
|
44
|
+
<rect width="20" height="14" x="2" y="6" rx="2"/>
|
|
45
|
+
</symbol>
|
|
46
|
+
<!-- Kurerad bas -->
|
|
47
|
+
<symbol id="icon-chevron-right" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
48
|
+
<path d="m9 18 6-6-6-6"/>
|
|
49
|
+
</symbol>
|
|
50
|
+
<symbol id="icon-chevron-left" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
51
|
+
<path d="m15 18-6-6 6-6"/>
|
|
52
|
+
</symbol>
|
|
53
|
+
<symbol id="icon-chevron-up" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
54
|
+
<path d="m18 15-6-6-6 6"/>
|
|
55
|
+
</symbol>
|
|
56
|
+
<symbol id="icon-x" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
57
|
+
<path d="M18 6 6 18"/>
|
|
58
|
+
<path d="m6 6 12 12"/>
|
|
59
|
+
</symbol>
|
|
60
|
+
<!-- Lucide-kalla: house (omdopt fran home i lucide 1.16.0) -->
|
|
61
|
+
<symbol id="icon-home" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
62
|
+
<path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"/>
|
|
63
|
+
<path d="M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
|
|
64
|
+
</symbol>
|
|
65
|
+
<symbol id="icon-search" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
66
|
+
<path d="m21 21-4.34-4.34"/>
|
|
67
|
+
<circle cx="11" cy="11" r="8"/>
|
|
68
|
+
</symbol>
|
|
69
|
+
<symbol id="icon-settings" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
70
|
+
<path d="M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915"/>
|
|
71
|
+
<circle cx="12" cy="12" r="3"/>
|
|
72
|
+
</symbol>
|
|
73
|
+
<symbol id="icon-user" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
74
|
+
<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/>
|
|
75
|
+
<circle cx="12" cy="7" r="4"/>
|
|
76
|
+
</symbol>
|
|
77
|
+
<symbol id="icon-plus" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
78
|
+
<path d="M5 12h14"/>
|
|
79
|
+
<path d="M12 5v14"/>
|
|
80
|
+
</symbol>
|
|
81
|
+
<symbol id="icon-pencil" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
82
|
+
<path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/>
|
|
83
|
+
<path d="m15 5 4 4"/>
|
|
84
|
+
</symbol>
|
|
85
|
+
<symbol id="icon-trash-2" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
86
|
+
<path d="M10 11v6"/>
|
|
87
|
+
<path d="M14 11v6"/>
|
|
88
|
+
<path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/>
|
|
89
|
+
<path d="M3 6h18"/>
|
|
90
|
+
<path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>
|
|
91
|
+
</symbol>
|
|
92
|
+
<symbol id="icon-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
93
|
+
<path d="M20 6 9 17l-5-5"/>
|
|
94
|
+
</symbol>
|
|
95
|
+
<symbol id="icon-copy" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
96
|
+
<rect width="14" height="14" x="8" y="8" rx="2" ry="2"/>
|
|
97
|
+
<path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/>
|
|
98
|
+
</symbol>
|
|
99
|
+
<symbol id="icon-download" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
100
|
+
<path d="M12 15V3"/>
|
|
101
|
+
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/>
|
|
102
|
+
<path d="m7 10 5 5 5-5"/>
|
|
103
|
+
</symbol>
|
|
104
|
+
<symbol id="icon-external-link" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
105
|
+
<path d="M15 3h6v6"/>
|
|
106
|
+
<path d="M10 14 21 3"/>
|
|
107
|
+
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/>
|
|
108
|
+
</symbol>
|
|
109
|
+
<!-- Lucide-kalla: ellipsis-vertical (omdopt fran more-vertical i lucide 1.16.0) -->
|
|
110
|
+
<symbol id="icon-more-vertical" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
111
|
+
<circle cx="12" cy="12" r="1"/>
|
|
112
|
+
<circle cx="12" cy="5" r="1"/>
|
|
113
|
+
<circle cx="12" cy="19" r="1"/>
|
|
114
|
+
</symbol>
|
|
115
|
+
<symbol id="icon-info" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
116
|
+
<circle cx="12" cy="12" r="10"/>
|
|
117
|
+
<path d="M12 16v-4"/>
|
|
118
|
+
<path d="M12 8h.01"/>
|
|
119
|
+
</symbol>
|
|
120
|
+
<symbol id="icon-bell" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
121
|
+
<path d="M10.268 21a2 2 0 0 0 3.464 0"/>
|
|
122
|
+
<path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"/>
|
|
123
|
+
</symbol>
|
|
124
|
+
<symbol id="icon-clock" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
125
|
+
<circle cx="12" cy="12" r="10"/>
|
|
126
|
+
<path d="M12 6v6l4 2"/>
|
|
127
|
+
</symbol>
|
|
128
|
+
<symbol id="icon-bookmark" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
129
|
+
<path d="M17 3a2 2 0 0 1 2 2v15a1 1 0 0 1-1.496.868l-4.512-2.578a2 2 0 0 0-1.984 0l-4.512 2.578A1 1 0 0 1 5 20V5a2 2 0 0 1 2-2z"/>
|
|
130
|
+
</symbol>
|
|
131
|
+
</svg>
|
package/package.json
CHANGED
package/js/lucide-init.js
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
/* Lucide-init: scannar DOM efter <i data-lucide="..."> och ersatter
|
|
2
|
-
* med <svg>-element. Kors vid DOMContentLoaded plus efter Turbo-nav-
|
|
3
|
-
* swap (om Turbo finns) sa nya element pa nyladdade pages aktiveras.
|
|
4
|
-
*
|
|
5
|
-
* Lucide CDN-script laddas separat via cdn.jsdelivr.net (allowed i
|
|
6
|
-
* Jubbs CSP). Detta init-script ar lokalt sa det forklaras inte av
|
|
7
|
-
* inline-script-restrict.
|
|
8
|
-
*/
|
|
9
|
-
(function () {
|
|
10
|
-
'use strict';
|
|
11
|
-
|
|
12
|
-
function createIcons() {
|
|
13
|
-
if (typeof window.lucide !== 'undefined' && window.lucide.createIcons) {
|
|
14
|
-
window.lucide.createIcons();
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
if (document.readyState === 'loading') {
|
|
19
|
-
document.addEventListener('DOMContentLoaded', createIcons);
|
|
20
|
-
} else {
|
|
21
|
-
createIcons();
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
// Re-init efter Turbo-swap sa nya ikoner pa swapped DOM aktiveras.
|
|
25
|
-
document.addEventListener('turbo:swap', createIcons);
|
|
26
|
-
document.addEventListener('turbo:navigated', createIcons);
|
|
27
|
-
})();
|