Skip to content

Commit 20c87f9

Browse files
committed
Update README.md
1 parent 5c578a6 commit 20c87f9

File tree

1 file changed

+21
-3
lines changed

1 file changed

+21
-3
lines changed

src/README.md

Lines changed: 21 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,14 +35,32 @@
3535
```shell
3636
npm install @surpathhub/ugnay
3737
```
38+
1A. Alternatively, you can instantiate the component styles using the official CDN
39+
```html
40+
<link rel="stylesheet" href="https://unpkg.com/@surpathhub/[email protected]/main.css">
41+
```
3842
2. Import all the components that you want to use in your project.
3943
```scss
40-
@use '~@surpathhub/ugnay/Core/Theme';
41-
@use '~@surpathhub/ugnay/Components/SPHButton';
42-
@use '~@surpathhub/ugnay/Components/SPHTextField';
44+
@use '~@surpathhub/ugnay/SPHCore/Theme';
45+
@use '~@surpathhub/ugnay/SPHButton';
46+
@use '~@surpathhub/ugnay/SPHTextField';
47+
```
48+
2A. Alternatively, if you write in CSS directly, you can use the `@import url()` at-rule.
49+
```css
50+
@import url('https://unpkg.com/@surpathhub/[email protected]/[component_name]/main.css');
51+
52+
/*
53+
Examples:
54+
@import url('https://unpkg.com/@surpathhub/[email protected]/SPHAppbar/main.css');
55+
@import url('https://unpkg.com/@surpathhub/[email protected]/SPHButton/main.css');
56+
@import url('https://unpkg.com/@surpathhub/[email protected]/SPHHeader/main.css');
57+
@import url('https://unpkg.com/@surpathhub/[email protected]/SPHTextField/main.css');
58+
*/
4359
```
4460
3. Call the component styles using the `use()` mixin.
4561
```scss
62+
...
63+
4664
@include SPHComponent.use();
4765
```
4866
4. DONE! Happy styling!

0 commit comments

Comments
 (0)