6d89237684
Recently I started to build this library that uses `styled-jsx` under the hood and provide a utility first API to create your own components. > https://github.com/skynexui/components/ Actually I run the lib docs over vercel  ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have helpful link attached, see `contributing.md` ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have helpful link attached, see `contributing.md` ## Documentation / Examples - [x] Make sure the linting passes by running `yarn lint`
36 lines
774 B
JavaScript
36 lines
774 B
JavaScript
import { Box, Text, TextField } from '@skynexui/components'
|
|
|
|
export default function Index() {
|
|
return (
|
|
<Box
|
|
styleSheet={{
|
|
marginVertical: {
|
|
xs: '16px',
|
|
md: '32px',
|
|
},
|
|
marginHorizontal: 'auto',
|
|
maxWidth: '50%',
|
|
}}
|
|
>
|
|
<Text tag="h1" variant="heading2">
|
|
@skynexui/components with Next.js!
|
|
</Text>
|
|
<Text
|
|
tag="p"
|
|
styleSheet={{
|
|
marginBottom: '16px',
|
|
}}
|
|
>
|
|
Change ./pages/_app.js to modify the default theme
|
|
</Text>
|
|
<Box
|
|
styleSheet={{
|
|
backgroundColor: '#EEEEEE',
|
|
padding: '32px',
|
|
}}
|
|
>
|
|
<TextField label="Sample Field" value="Initial Value" />
|
|
</Box>
|
|
</Box>
|
|
)
|
|
}
|