Skip to content
This repository was archived by the owner on Sep 26, 2022. It is now read-only.

Commit 67949bf

Browse files
Florian-SchoenherrFlorian-Schoenherr
committed
docs: replace webfonts in examples
Signed-off-by: Florian-Schoenherr <[email protected]>
1 parent 7ed8c6b commit 67949bf

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

55 files changed

+327
-233
lines changed

‎packages/docs/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
"preview": "serve __sapper__/export"
99
},
1010
"dependencies": {
11+
"@fortawesome/free-solid-svg-icons": "^5.15.2",
1112
"@mdi/js": "^5.9.55",
1213
"compression": "^1.7.1",
1314
"gumshoejs": "^5.1.2",

‎packages/docs/src/examples/Alert/colors.svelte‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,29 @@
11
<script>
22
import Alert from 'svelte-materialify/src/components/Alert';
33
import Icon from 'svelte-materialify/src/components/Icon';
4+
import { mdiCheck, mdiThumbUp, mdiAlert } from '@mdi/js';
45
</script>
56

67
<Alert class="success-color">
78
<div slot="icon">
8-
<Icon class="mdi mdi-check" />
9+
<Icon path={mdiCheck} />
910
</div>
10-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
11-
harum iste ea numquam quo accusamus blanditiis in.
11+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
12+
iste ea numquam quo accusamus blanditiis in.
1213
</Alert>
1314

1415
<Alert class="primary-color">
1516
<div slot="icon">
16-
<Icon class="mdi mdi-thumb-up" />
17+
<Icon path={mdiThumbUp} />
1718
</div>
18-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
19-
harum iste ea numquam quo accusamus blanditiis in.
19+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
20+
iste ea numquam quo accusamus blanditiis in.
2021
</Alert>
2122

2223
<Alert class="error-color">
2324
<div slot="icon">
24-
<Icon class="mdi mdi-alert" />
25+
<Icon path={mdiAlert} />
2526
</div>
26-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
27-
harum iste ea numquam quo accusamus blanditiis in.
27+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
28+
iste ea numquam quo accusamus blanditiis in.
2829
</Alert>

‎packages/docs/src/examples/Alert/dense.svelte‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,29 @@
11
<script>
22
import Alert from 'svelte-materialify/src/components/Alert';
33
import Icon from 'svelte-materialify/src/components/Icon';
4+
import { mdiCheck, mdiThumbUp, mdiAlert } from '@mdi/js';
45
</script>
56

67
<Alert class="success-color" dense>
78
<div slot="icon">
8-
<Icon class="mdi mdi-check" />
9+
<Icon path={mdiCheck} />
910
</div>
10-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
11-
harum iste ea numquam quo accusamus blanditiis in.
11+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
12+
iste ea numquam quo accusamus blanditiis in.
1213
</Alert>
1314

1415
<Alert class="primary-color" dense>
1516
<div slot="icon">
16-
<Icon class="mdi mdi-thumb-up" />
17+
<Icon path={mdiThumbUp} />
1718
</div>
18-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
19-
harum iste ea numquam quo accusamus blanditiis in.
19+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
20+
iste ea numquam quo accusamus blanditiis in.
2021
</Alert>
2122

2223
<Alert class="error-text" dense outlined>
2324
<div slot="icon">
24-
<Icon class="mdi mdi-alert" />
25+
<Icon path={mdiAlert} />
2526
</div>
26-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
27-
harum iste ea numquam quo accusamus blanditiis in.
27+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
28+
iste ea numquam quo accusamus blanditiis in.
2829
</Alert>

‎packages/docs/src/examples/Alert/dismissible.svelte‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import Alert from 'svelte-materialify/src/components/Alert';
33
import Icon from 'svelte-materialify/src/components/Icon';
44
import Button from 'svelte-materialify/src/components/Button';
5+
import { mdiAlertCircle } from '@mdi/js';
56
67
let timesDismissed = 0;
78
let alert = true;
@@ -23,7 +24,7 @@
2324

2425
<Alert class="primary-color" dismissible bind:visible={alert} on:dismiss={onDismiss}>
2526
<div slot="close">
26-
<Icon class="mdi mdi-alert-circle" />
27+
<Icon path={mdiAlertCircle} />
2728
</div>
2829
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolorem molestiae voluptates
2930
et quae rem autem quasi officia odit suscipit dolor.

‎packages/docs/src/examples/Alert/icon.svelte‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,29 @@
11
<script>
22
import Alert from 'svelte-materialify/src/components/Alert';
33
import Icon from 'svelte-materialify/src/components/Icon';
4+
import { mdiCheck, mdiThumbUp, mdiAlert } from '@mdi/js';
45
</script>
56

67
<Alert class="success-color" dense>
78
<div slot="icon">
8-
<Icon class="mdi mdi-check" />
9+
<Icon path={mdiCheck} />
910
</div>
10-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
11-
harum iste ea numquam quo accusamus blanditiis in.
11+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
12+
iste ea numquam quo accusamus blanditiis in.
1213
</Alert>
1314

1415
<Alert class="primary-color">
1516
<div slot="icon">
16-
<Icon class="mdi mdi-thumb-up" />
17+
<Icon path={mdiThumbUp} />
1718
</div>
18-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
19-
harum iste ea numquam quo accusamus blanditiis in.
19+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
20+
iste ea numquam quo accusamus blanditiis in.
2021
</Alert>
2122

2223
<Alert class="error-color" border="left">
2324
<div slot="icon">
24-
<Icon class="mdi mdi-alert" />
25+
<Icon path={mdiAlert} />
2526
</div>
26-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
27-
harum iste ea numquam quo accusamus blanditiis in.
27+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
28+
iste ea numquam quo accusamus blanditiis in.
2829
</Alert>

‎packages/docs/src/examples/Alert/outlined.svelte‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,29 @@
11
<script>
22
import Alert from 'svelte-materialify/src/components/Alert';
33
import Icon from 'svelte-materialify/src/components/Icon';
4+
import { mdiCheck, mdiThumbUp, mdiAlert } from '@mdi/js';
45
</script>
56

67
<Alert class="success-text" outlined>
78
<div slot="icon">
8-
<Icon class="mdi mdi-check" />
9+
<Icon path={mdiCheck} />
910
</div>
10-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
11-
harum iste ea numquam quo accusamus blanditiis in.
11+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
12+
iste ea numquam quo accusamus blanditiis in.
1213
</Alert>
1314

1415
<Alert class="primary-text" outlined>
1516
<div slot="icon">
16-
<Icon class="mdi mdi-thumb-up" />
17+
<Icon path={mdiThumbUp} />
1718
</div>
18-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
19-
harum iste ea numquam quo accusamus blanditiis in.
19+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
20+
iste ea numquam quo accusamus blanditiis in.
2021
</Alert>
2122

2223
<Alert class="error-text" outlined>
2324
<div slot="icon">
24-
<Icon class="mdi mdi-alert" />
25+
<Icon path={mdiAlert} />
2526
</div>
26-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
27-
harum iste ea numquam quo accusamus blanditiis in.
27+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
28+
iste ea numquam quo accusamus blanditiis in.
2829
</Alert>

‎packages/docs/src/examples/Alert/text.svelte‎

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,35 @@
11
<script>
22
import Alert from 'svelte-materialify/src/components/Alert';
33
import Icon from 'svelte-materialify/src/components/Icon';
4+
import { mdiThumbUp, mdiAlert, mdiFire } from '@mdi/js';
45
</script>
56

67
<Alert class="success-text" text>
78
<h5>Lorem Ipsum</h5>
8-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
9-
harum iste ea numquam quo accusamus blanditiis in.
9+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
10+
iste ea numquam quo accusamus blanditiis in.
1011
</Alert>
1112

1213
<Alert class="primary-text" text border="left">
1314
<div slot="icon">
14-
<Icon class="mdi mdi-thumb-up" />
15+
<Icon path={mdiThumbUp} />
1516
</div>
16-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
17-
harum iste ea numquam quo accusamus blanditiis in.
17+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
18+
iste ea numquam quo accusamus blanditiis in.
1819
</Alert>
1920

2021
<Alert class="info-text" text outlined>
2122
<div slot="icon">
22-
<Icon class="mdi mdi-fire" />
23+
<Icon path={mdiFire} />
2324
</div>
24-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
25-
harum iste ea numquam quo accusamus blanditiis in.
25+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
26+
iste ea numquam quo accusamus blanditiis in.
2627
</Alert>
2728

2829
<Alert class="error-text" text dense>
2930
<div slot="icon">
30-
<Icon class="mdi mdi-alert" />
31+
<Icon path={mdiAlert} />
3132
</div>
32-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure
33-
harum iste ea numquam quo accusamus blanditiis in.
33+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto, aperiam ad iure harum
34+
iste ea numquam quo accusamus blanditiis in.
3435
</Alert>

‎packages/docs/src/examples/AppBar/basic.svelte‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
<script>
22
import { AppBar, Button, Icon, Menu, ListItem } from 'svelte-materialify/src';
3+
import { mdiMenu, mdiDotsVertical } from '@mdi/js';
34
</script>
45

56
<AppBar>
67
<div slot="icon">
78
<Button fab depressed>
8-
<Icon class="mdi mdi-menu" />
9+
<Icon path={mdiMenu} />
910
</Button>
1011
</div>
1112
<span slot="title">Title</span>
@@ -14,7 +15,7 @@
1415
<Menu right>
1516
<div slot="activator">
1617
<Button fab depressed>
17-
<Icon class="mdi mdi-dots-vertical" />
18+
<Icon path={mdiDotsVertical} />
1819
</Button>
1920
</div>
2021
<ListItem>Item 1</ListItem>

‎packages/docs/src/examples/AppBar/collapse.svelte‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
<script>
22
import { AppBar, Checkbox, Button, Icon } from 'svelte-materialify/src';
3-
3+
import { mdiMenu } from '@mdi/js';
44
let collapsed = false;
55
</script>
66

77
<AppBar {collapsed} class="primary-color theme--dark">
88
<div slot="icon">
99
<Button depressed fab text>
10-
<Icon class="mdi mdi-menu" />
10+
<Icon path={mdiMenu} />
1111
</Button>
1212
</div>
1313
<span slot="title">Title</span>

‎packages/docs/src/examples/AppBar/dense.svelte‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,18 @@
11
<script>
22
import { AppBar, Button, Icon } from 'svelte-materialify/src';
3+
import { mdiMenu, mdiMagnify } from '@mdi/js';
34
</script>
45

56
<AppBar dense>
67
<div slot="icon">
78
<Button fab depressed>
8-
<Icon class="mdi mdi-menu" />
9+
<Icon path={mdiMenu} />
910
</Button>
1011
</div>
1112
<span slot="title">Title</span>
1213
<div style="flex-grow:1" />
1314
<Button>Item</Button>
1415
<Button fab depressed>
15-
<Icon class="mdi mdi-magnify" />
16+
<Icon path={mdiMagnify} />
1617
</Button>
1718
</AppBar>

0 commit comments

Comments
 (0)