scb-wc 0.1.135 → 0.1.137
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 +2 -2
- package/starters/blazor/Components/Pages/Home.razor +21 -49
- package/starters/blazor/README.md +3 -2
- package/starters/blazor-service/README.md +1 -0
- package/starters/html/README.md +3 -2
- package/starters/html/main.js +21 -54
- package/starters/html-service/README.md +1 -0
- package/starters/react/README.md +3 -2
- package/starters/react/src/App.jsx +19 -47
- package/starters/react/src/main.jsx +2 -7
- package/starters/react-service/README.md +1 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.137",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -472,5 +472,5 @@
|
|
|
472
472
|
},
|
|
473
473
|
"./mvc/*": "./mvc/*"
|
|
474
474
|
},
|
|
475
|
-
"buildHash": "
|
|
475
|
+
"buildHash": "BB1A4CC405B64FBF52B201E29055FC3ACFFB7CD681B6457A15B803C9FFC6339D"
|
|
476
476
|
}
|
|
@@ -6,68 +6,40 @@
|
|
|
6
6
|
<section>
|
|
7
7
|
<h1>Webbplats med header och footer</h1>
|
|
8
8
|
<p>För webbplatser, informationssidor och andra sidor som ska använda vanlig SCB-header och footer.</p>
|
|
9
|
-
<p
|
|
10
|
-
|
|
11
|
-
<scb-
|
|
12
|
-
<
|
|
13
|
-
<
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
<
|
|
21
|
-
label="
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
>
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
<scb-select-option value="tabell" label="Tabell"></scb-select-option>
|
|
28
|
-
</ScbSelect>
|
|
29
|
-
</scb-grid-item>
|
|
30
|
-
|
|
31
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
32
|
-
<ScbCheckbox
|
|
33
|
-
Label="Visa endast publicerat innehåll"
|
|
34
|
-
Checked="true"
|
|
35
|
-
/>
|
|
36
|
-
</scb-grid-item>
|
|
37
|
-
|
|
38
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
39
|
-
<scb-button label="Primär handling"></scb-button>
|
|
40
|
-
<scb-button variant="outlined" label="Sekundär handling" spacing-left="2"></scb-button>
|
|
41
|
-
</scb-grid-item>
|
|
42
|
-
|
|
43
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
44
|
-
<ScbAccordion>
|
|
45
|
-
<scb-accordion-item
|
|
46
|
-
title="Exempelavsnitt"
|
|
47
|
-
supporting-text="Visa eller dölj mer information."
|
|
48
|
-
open
|
|
49
|
-
>
|
|
50
|
-
Här kan du lägga sådant som inte behöver synas direkt från start.
|
|
51
|
-
</scb-accordion-item>
|
|
52
|
-
</ScbAccordion>
|
|
53
|
-
</scb-grid-item>
|
|
54
|
-
</scb-grid>
|
|
9
|
+
<p>Använd mallen som startpunkt och byt ut text, länkar och exempeldata mot sidans riktiga innehåll.</p>
|
|
10
|
+
|
|
11
|
+
<scb-stack gap="6">
|
|
12
|
+
<section aria-labelledby="content-heading">
|
|
13
|
+
<h2 id="content-heading">Innehåll</h2>
|
|
14
|
+
<p>Skriv det viktigaste först. Dela upp sidan med tydliga rubriker och håll texten nära det användaren behöver göra eller förstå.</p>
|
|
15
|
+
<p>Lägg till exempel eller fler komponenter först när sidan behöver mer funktion än vanlig text och länkar.</p>
|
|
16
|
+
</section>
|
|
17
|
+
|
|
18
|
+
<section aria-labelledby="links-heading">
|
|
19
|
+
<h2 id="links-heading">Relaterade länkar</h2>
|
|
20
|
+
<scb-list>
|
|
21
|
+
<scb-list-item type="link" label="Aktuell statistik" item-href="#"></scb-list-item>
|
|
22
|
+
<scb-list-item type="link" label="Publikationer" item-href="#"></scb-list-item>
|
|
23
|
+
<scb-list-item type="link" label="Kontakta oss" item-href="#"></scb-list-item>
|
|
24
|
+
</scb-list>
|
|
25
|
+
</section>
|
|
26
|
+
</scb-stack>
|
|
55
27
|
</section>
|
|
56
28
|
</scb-grid-item>
|
|
57
29
|
|
|
58
30
|
<scb-grid-item col-span-compact="4" col-span-medium="8" col-span-expanded="4">
|
|
59
31
|
<scb-stack gap="5">
|
|
60
|
-
<scb-card type="
|
|
32
|
+
<scb-card type="container" variant="filled" size="small" card-title="Kom igång">
|
|
61
33
|
<ul>
|
|
62
34
|
<li><strong>Skapa mallen</strong><br><code>npx scb-wc init blazor my-blazor-app</code></li>
|
|
63
35
|
<li>Passar för webbplatser, informationssidor och andra sidor med vanlig SCB-header och footer.</li>
|
|
64
36
|
</ul>
|
|
65
37
|
</scb-card>
|
|
66
38
|
|
|
67
|
-
<scb-card type="
|
|
39
|
+
<scb-card type="container" variant="outlined" size="small" card-title="Nästa steg">
|
|
68
40
|
<ul>
|
|
69
41
|
<li>Byt ut rubriker, text, länkar och exempeldata.</li>
|
|
70
|
-
<li>
|
|
42
|
+
<li>Kopiera fler exempel eller lägg till komponenter när sidan behöver det.</li>
|
|
71
43
|
</ul>
|
|
72
44
|
</scb-card>
|
|
73
45
|
</scb-stack>
|
package/starters/html/README.md
CHANGED
package/starters/html/main.js
CHANGED
|
@@ -6,17 +6,12 @@ import '__SCB_WC_PACKAGE_NAME__/scb-header/scb-header-utility';
|
|
|
6
6
|
import '__SCB_WC_PACKAGE_NAME__/scb-footer';
|
|
7
7
|
import '__SCB_WC_PACKAGE_NAME__/scb-footer/scb-footer-section';
|
|
8
8
|
import '__SCB_WC_PACKAGE_NAME__/scb-link';
|
|
9
|
+
import '__SCB_WC_PACKAGE_NAME__/scb-list';
|
|
10
|
+
import '__SCB_WC_PACKAGE_NAME__/scb-list/scb-list-item';
|
|
9
11
|
import '__SCB_WC_PACKAGE_NAME__/scb-grid';
|
|
10
12
|
import '__SCB_WC_PACKAGE_NAME__/scb-grid/scb-grid-item';
|
|
11
13
|
import '__SCB_WC_PACKAGE_NAME__/scb-grid/scb-stack';
|
|
12
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-button';
|
|
13
14
|
import '__SCB_WC_PACKAGE_NAME__/scb-card';
|
|
14
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-checkbox';
|
|
15
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-select';
|
|
16
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-select/scb-select-option';
|
|
17
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-textfield';
|
|
18
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-accordion';
|
|
19
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-accordion/scb-accordion-item';
|
|
20
15
|
|
|
21
16
|
document.querySelector('#app').innerHTML = `
|
|
22
17
|
<!-- BASIC_TEMPLATE_HTML_START -->
|
|
@@ -44,68 +39,40 @@ document.querySelector('#app').innerHTML = `
|
|
|
44
39
|
<section>
|
|
45
40
|
<h1>Webbplats med header och footer</h1>
|
|
46
41
|
<p>För webbplatser, informationssidor och andra sidor som ska använda vanlig SCB-header och footer.</p>
|
|
47
|
-
<p
|
|
42
|
+
<p>Använd mallen som startpunkt och byt ut text, länkar och exempeldata mot sidans riktiga innehåll.</p>
|
|
48
43
|
|
|
49
|
-
<scb-
|
|
50
|
-
<
|
|
51
|
-
<
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
</scb-grid-item>
|
|
44
|
+
<scb-stack gap="6">
|
|
45
|
+
<section aria-labelledby="content-heading">
|
|
46
|
+
<h2 id="content-heading">Innehåll</h2>
|
|
47
|
+
<p>Skriv det viktigaste först. Dela upp sidan med tydliga rubriker och håll texten nära det användaren behöver göra eller förstå.</p>
|
|
48
|
+
<p>Lägg till exempel eller fler komponenter först när sidan behöver mer funktion än vanlig text och länkar.</p>
|
|
49
|
+
</section>
|
|
56
50
|
|
|
57
|
-
<
|
|
58
|
-
<
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
</scb-select>
|
|
67
|
-
</scb-grid-item>
|
|
68
|
-
|
|
69
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
70
|
-
<scb-checkbox
|
|
71
|
-
label="Visa endast publicerat innehåll"
|
|
72
|
-
checked
|
|
73
|
-
></scb-checkbox>
|
|
74
|
-
</scb-grid-item>
|
|
75
|
-
|
|
76
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
77
|
-
<scb-button label="Primär handling"></scb-button>
|
|
78
|
-
<scb-button variant="outlined" label="Sekundär handling" spacing-left="2"></scb-button>
|
|
79
|
-
</scb-grid-item>
|
|
80
|
-
|
|
81
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
82
|
-
<scb-accordion>
|
|
83
|
-
<scb-accordion-item
|
|
84
|
-
title="Exempelavsnitt"
|
|
85
|
-
supporting-text="Visa eller dölj mer information."
|
|
86
|
-
open
|
|
87
|
-
>
|
|
88
|
-
Här kan du lägga sådant som inte behöver synas direkt från start.
|
|
89
|
-
</scb-accordion-item>
|
|
90
|
-
</scb-accordion>
|
|
91
|
-
</scb-grid-item>
|
|
92
|
-
</scb-grid>
|
|
51
|
+
<section aria-labelledby="links-heading">
|
|
52
|
+
<h2 id="links-heading">Relaterade länkar</h2>
|
|
53
|
+
<scb-list>
|
|
54
|
+
<scb-list-item type="link" label="Aktuell statistik" item-href="#"></scb-list-item>
|
|
55
|
+
<scb-list-item type="link" label="Publikationer" item-href="#"></scb-list-item>
|
|
56
|
+
<scb-list-item type="link" label="Kontakta oss" item-href="#"></scb-list-item>
|
|
57
|
+
</scb-list>
|
|
58
|
+
</section>
|
|
59
|
+
</scb-stack>
|
|
93
60
|
</section>
|
|
94
61
|
</scb-grid-item>
|
|
95
62
|
|
|
96
63
|
<scb-grid-item col-span-compact="4" col-span-medium="8" col-span-expanded="4">
|
|
97
64
|
<scb-stack gap="5">
|
|
98
|
-
<scb-card type="
|
|
65
|
+
<scb-card type="container" variant="filled" size="small" card-title="Kom igång">
|
|
99
66
|
<ul>
|
|
100
67
|
<li><strong>Skapa mallen</strong><br><code>npx scb-wc init html my-app</code></li>
|
|
101
68
|
<li>Passar för webbplatser, informationssidor och andra sidor med vanlig SCB-header och footer.</li>
|
|
102
69
|
</ul>
|
|
103
70
|
</scb-card>
|
|
104
71
|
|
|
105
|
-
<scb-card type="
|
|
72
|
+
<scb-card type="container" variant="outlined" size="small" card-title="Nästa steg">
|
|
106
73
|
<ul>
|
|
107
74
|
<li>Byt ut rubriker, text, länkar och exempeldata.</li>
|
|
108
|
-
<li>
|
|
75
|
+
<li>Kopiera fler exempel eller lägg till komponenter när sidan behöver det.</li>
|
|
109
76
|
</ul>
|
|
110
77
|
</scb-card>
|
|
111
78
|
</scb-stack>
|
package/starters/react/README.md
CHANGED
|
@@ -26,68 +26,40 @@ export default function App() {
|
|
|
26
26
|
<section>
|
|
27
27
|
<h1>Webbplats med header och footer</h1>
|
|
28
28
|
<p>För webbplatser, informationssidor och andra sidor som ska använda vanlig SCB-header och footer.</p>
|
|
29
|
-
<p
|
|
29
|
+
<p>Använd mallen som startpunkt och byt ut text, länkar och exempeldata mot sidans riktiga innehåll.</p>
|
|
30
30
|
|
|
31
|
-
<scb-
|
|
32
|
-
<
|
|
33
|
-
<
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
</scb-grid-item>
|
|
31
|
+
<scb-stack gap="6">
|
|
32
|
+
<section aria-labelledby="content-heading">
|
|
33
|
+
<h2 id="content-heading">Innehåll</h2>
|
|
34
|
+
<p>Skriv det viktigaste först. Dela upp sidan med tydliga rubriker och håll texten nära det användaren behöver göra eller förstå.</p>
|
|
35
|
+
<p>Lägg till exempel eller fler komponenter först när sidan behöver mer funktion än vanlig text och länkar.</p>
|
|
36
|
+
</section>
|
|
38
37
|
|
|
39
|
-
<
|
|
40
|
-
<
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
</scb-select>
|
|
49
|
-
</scb-grid-item>
|
|
50
|
-
|
|
51
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
52
|
-
<scb-checkbox
|
|
53
|
-
label="Visa endast publicerat innehåll"
|
|
54
|
-
checked
|
|
55
|
-
></scb-checkbox>
|
|
56
|
-
</scb-grid-item>
|
|
57
|
-
|
|
58
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
59
|
-
<scb-button label="Primär handling"></scb-button>
|
|
60
|
-
<scb-button variant="outlined" label="Sekundär handling" spacing-left="2"></scb-button>
|
|
61
|
-
</scb-grid-item>
|
|
62
|
-
|
|
63
|
-
<scb-grid-item col-span-compact="1" col-span-medium="1" col-span-expanded="1">
|
|
64
|
-
<scb-accordion>
|
|
65
|
-
<scb-accordion-item
|
|
66
|
-
title="Exempelavsnitt"
|
|
67
|
-
supporting-text="Visa eller dölj mer information."
|
|
68
|
-
open
|
|
69
|
-
>
|
|
70
|
-
Här kan du lägga sådant som inte behöver synas direkt från start.
|
|
71
|
-
</scb-accordion-item>
|
|
72
|
-
</scb-accordion>
|
|
73
|
-
</scb-grid-item>
|
|
74
|
-
</scb-grid>
|
|
38
|
+
<section aria-labelledby="links-heading">
|
|
39
|
+
<h2 id="links-heading">Relaterade länkar</h2>
|
|
40
|
+
<scb-list>
|
|
41
|
+
<scb-list-item type="link" label="Aktuell statistik" item-href="#"></scb-list-item>
|
|
42
|
+
<scb-list-item type="link" label="Publikationer" item-href="#"></scb-list-item>
|
|
43
|
+
<scb-list-item type="link" label="Kontakta oss" item-href="#"></scb-list-item>
|
|
44
|
+
</scb-list>
|
|
45
|
+
</section>
|
|
46
|
+
</scb-stack>
|
|
75
47
|
</section>
|
|
76
48
|
</scb-grid-item>
|
|
77
49
|
|
|
78
50
|
<scb-grid-item col-span-compact="4" col-span-medium="8" col-span-expanded="4">
|
|
79
51
|
<scb-stack gap="5">
|
|
80
|
-
<scb-card type="
|
|
52
|
+
<scb-card type="container" variant="filled" size="small" card-title="Kom igång">
|
|
81
53
|
<ul>
|
|
82
54
|
<li><strong>Skapa mallen</strong><br /><code>npx scb-wc init react my-react-app</code></li>
|
|
83
55
|
<li>Passar för webbplatser, informationssidor och andra sidor med vanlig SCB-header och footer.</li>
|
|
84
56
|
</ul>
|
|
85
57
|
</scb-card>
|
|
86
58
|
|
|
87
|
-
<scb-card type="
|
|
59
|
+
<scb-card type="container" variant="outlined" size="small" card-title="Nästa steg">
|
|
88
60
|
<ul>
|
|
89
61
|
<li>Byt ut rubriker, text, länkar och exempeldata.</li>
|
|
90
|
-
<li>
|
|
62
|
+
<li>Kopiera fler exempel eller lägg till komponenter när sidan behöver det.</li>
|
|
91
63
|
</ul>
|
|
92
64
|
</scb-card>
|
|
93
65
|
</scb-stack>
|
|
@@ -8,17 +8,12 @@ import '__SCB_WC_PACKAGE_NAME__/scb-header/scb-header-utility';
|
|
|
8
8
|
import '__SCB_WC_PACKAGE_NAME__/scb-footer';
|
|
9
9
|
import '__SCB_WC_PACKAGE_NAME__/scb-footer/scb-footer-section';
|
|
10
10
|
import '__SCB_WC_PACKAGE_NAME__/scb-link';
|
|
11
|
+
import '__SCB_WC_PACKAGE_NAME__/scb-list';
|
|
12
|
+
import '__SCB_WC_PACKAGE_NAME__/scb-list/scb-list-item';
|
|
11
13
|
import '__SCB_WC_PACKAGE_NAME__/scb-grid';
|
|
12
14
|
import '__SCB_WC_PACKAGE_NAME__/scb-grid/scb-grid-item';
|
|
13
15
|
import '__SCB_WC_PACKAGE_NAME__/scb-grid/scb-stack';
|
|
14
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-button';
|
|
15
16
|
import '__SCB_WC_PACKAGE_NAME__/scb-card';
|
|
16
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-checkbox';
|
|
17
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-select';
|
|
18
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-select/scb-select-option';
|
|
19
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-textfield';
|
|
20
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-accordion';
|
|
21
|
-
import '__SCB_WC_PACKAGE_NAME__/scb-accordion/scb-accordion-item';
|
|
22
17
|
import App from './App.jsx';
|
|
23
18
|
|
|
24
19
|
ReactDOM.createRoot(document.getElementById('root')).render(
|