Skip to content

Commit 62398c5

Browse files
authored
feat(styles): Update styles css exports
2 parents ce1cf0a + e106b73 commit 62398c5

File tree

3 files changed

+21
-4
lines changed

3 files changed

+21
-4
lines changed

README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -131,13 +131,13 @@ If you are using [TailwindCSS](https://tailwindcss.com/), import the base CSS fr
131131

132132
```css
133133
@import "tailwindcss";
134-
@import "@firebase-ui/styles/src/base.css";
134+
@import "@firebase-ui/styles/tailwind";
135135
```
136136

137137
If you are not using Tailwind, import the distributable CSS in your project:
138138

139139
```css
140-
@import "@firebase-ui/styles/dist.css";
140+
@import "@firebase-ui/styles";
141141
```
142142

143143
To learn more about theming, view the [theming](#theming) section.

packages/styles/README.md

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,25 @@ If you are using Tailwind CSS in your project, you can import the source files d
1010

1111
```css
1212
@import "tailwindcss";
13-
@import "@firebase-ui/styles/src/base.css";
13+
@import "@firebase-ui/styles/tailwind";
1414
```
1515

1616
### With CSS
1717

1818
Alternatively, you can import fully compiled CSS files into your project. This output contains both the tailwind styles and the FirebaseUI styles.
1919

2020
```jsx
21-
import "@firebase-ui/styles/dist.css";
21+
import "@firebase-ui/styles";
22+
```
23+
24+
## Themes
25+
26+
The packages also exports themes which overrides the CSS variables with preset colors. These can be imported from your CSS:
27+
28+
```css
29+
@import "tailwindcss";
30+
@import "@firebase-ui/styles/tailwind";
31+
@import "@firebase-ui/styles/themes/brualist"
2232
```
2333

2434
## Building

packages/styles/package.json

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,16 @@
77
"types": "./dist/index.d.ts",
88
"exports": {
99
".": {
10+
"style": "./dist.css",
1011
"types": "./dist/index.d.ts",
1112
"import": "./dist/index.js",
1213
"require": "./dist/index.cjs"
14+
},
15+
"./tailwind": {
16+
"style": "./src/base.css"
17+
},
18+
"./themes/*": {
19+
"style": "./src/themes/*.css"
1320
}
1421
},
1522
"files": [

0 commit comments

Comments
 (0)