You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Mar 24, 2026. It is now read-only.
Copy file name to clipboardExpand all lines: docs/pages/components/divider.md
+17-17Lines changed: 17 additions & 17 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -15,22 +15,6 @@ import SlDivider from '@shoelace-style/shoelace/dist/react/divider';
15
15
const App = () => <SlDivider />;
16
16
```
17
17
18
-
:::tip
19
-
Using TailwindCSS with Shoelace [may override divider styles](https://github.com/shoelace-style/shoelace/issues/2088), making them invisible. As a workaround, add this to your TailwindCSS input file:
20
-
21
-
```css
22
-
@layer base {
23
-
sl-divider:not([vertical]) {
24
-
border-top: solidvar(--width) var(--color);
25
-
}
26
-
27
-
sl-divider[vertical] {
28
-
border-left: solidvar(--width) var(--color);
29
-
}
30
-
}
31
-
```
32
-
:::
33
-
34
18
## Examples
35
19
36
20
### Width
@@ -171,4 +155,20 @@ const App = () => (
171
155
);
172
156
```
173
157
174
-
{% endraw %}
158
+
### Tailwind users
159
+
160
+
Using TailwindCSS with Shoelace [may override divider styles](https://github.com/shoelace-style/shoelace/issues/2088), making them invisible. As a workaround, add this to your Tailwind config file.
0 commit comments