mirror of
https://github.com/hanzoai/next.js.git
synced 2026-10-30 14:46:38 +00:00
Adds additional tests for material-ui and stitches based on questions in the Twitter thread. Fixes TypeScript types when `LinkProps` is imported and used in combination with `<button>`, added a TODO to change this at a later point when the new behavior is the default instead of opt-in. ## 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 - [ ] Make sure the linting passes by running `yarn lint`
49 lines
891 B
React
49 lines
891 B
React
import { styled } from '../stitches.config'
|
|
import StitchesLogo from '../components/StitchesLogo'
|
|
|
|
const Box = styled('div', {})
|
|
|
|
const Text = styled('p', {
|
|
fontFamily: '$system',
|
|
color: '$hiContrast',
|
|
})
|
|
|
|
const Link = styled('a', {
|
|
fontFamily: '$system',
|
|
textDecoration: 'none',
|
|
color: '$purple600',
|
|
})
|
|
|
|
const Container = styled('div', {
|
|
marginX: 'auto',
|
|
paddingX: '$3',
|
|
|
|
variants: {
|
|
size: {
|
|
1: {
|
|
maxWidth: '300px',
|
|
},
|
|
2: {
|
|
maxWidth: '585px',
|
|
},
|
|
3: {
|
|
maxWidth: '865px',
|
|
},
|
|
},
|
|
},
|
|
})
|
|
|
|
export default function Home() {
|
|
return (
|
|
<Box css={{ paddingY: '$6' }}>
|
|
<Container size={{ '@initial': '1', '@bp1': '2' }}>
|
|
<StitchesLogo />
|
|
<Text as="h1">Hello, from About.</Text>
|
|
<Text>
|
|
<Link href="/">Visit Home</Link>.
|
|
</Text>
|
|
</Container>
|
|
</Box>
|
|
)
|
|
}
|