rsnext/examples/with-goober/pages/index.tsx
Kasper Aamodt bc4d98af72
Convert with-goober example to TS (#39761)
## Documentation / Examples

- [x] Make sure the linting passes by running `pnpm lint`
- [x] The examples guidelines are followed from [our contributing doc]


Co-authored-by: JJ Kasper <22380829+ijjk@users.noreply.github.com>
2022-08-21 22:56:51 +00:00

28 lines
468 B
TypeScript

import { styled } from 'goober'
const Title = styled('h1')`
padding: 0;
margin: 0;
color: tomato;
`
const SmallTitle = styled('p')`
font-size: 1em;
color: dodgerblue;
transition: padding 200ms ease-in-out;
padding: 1em;
&:hover {
padding-left: 2em;
color: darkseagreen;
}
`
export default function Home() {
return (
<>
<Title>You are using 🥜 goober! Yay!</Title>
<SmallTitle>Go on, try it!</SmallTitle>
</>
)
}