fix style attrs

pull/580/head
Cory LaViska 2021-11-05 11:26:09 -04:00
rodzic c771534c43
commit 0929799daf
3 zmienionych plików z 11 dodań i 9 usunięć

Wyświetl plik

@ -203,9 +203,9 @@ import { SlButton } from '@shoelace-style/shoelace/dist/react';
const App = () => ( const App = () => (
<> <>
<SlButton type="default" size="small" style="width: 100%; margin-bottom: 1rem;">Small</SlButton> <SlButton type="default" size="small" style={{ width: '100%', marginBottom: '1rem' }}>Small</SlButton>
<SlButton type="default" size="medium" style="width: 100%; margin-bottom: 1rem;">Medium</SlButton> <SlButton type="default" size="medium" style={{ width: '100%', marginBottom: '1rem' }}>Medium</SlButton>
<SlButton type="default" size="large" style="width: 100%;">Large</SlButton> <SlButton type="default" size="large" style={{ width: '100%' }}>Large</SlButton>
</> </>
); );
``` ```

Wyświetl plik

@ -343,11 +343,13 @@ const App = () => {
return ( return (
<> <>
<SlDrawer label="Drawer" open={open} onSlAfterHide={() => setOpen(false)}> <SlDrawer label="Drawer" open={open} onSlAfterHide={() => setOpen(false)}>
<div style={{ <div
style={{
height: '150vh', height: '150vh',
border: 'dashed 2px rgb(var(--sl-color-neutral-200))', border: 'dashed 2px rgb(var(--sl-color-neutral-200))',
padding: '0 1rem' padding: '0 1rem'
}}> }}
>
<p>Scroll down and give it a try! 👇</p> <p>Scroll down and give it a try! 👇</p>
</div> </div>
<SlButton slot="footer" type="primary" onClick={() => setOpen(false)}> <SlButton slot="footer" type="primary" onClick={() => setOpen(false)}>

Wyświetl plik

@ -9,7 +9,7 @@
- Fully customizable with CSS 🎨 - Fully customizable with CSS 🎨
- Includes a dark theme 🌛 - Includes a dark theme 🌛
- Built with accessibility in mind ♿️ - Built with accessibility in mind ♿️
- First-party [React components](/frameworks/react) - First-class [React support](/frameworks/react)
- Open source 😸 - Open source 😸
Designed in New Hampshire by [Cory LaViska](https://twitter.com/claviska). Designed in New Hampshire by [Cory LaViska](https://twitter.com/claviska).