Hi! You can create website or app with this library. Before using this, look through Storybook.
npm
npm i yummy-design-component
yarn
yarn add yummy-design-component
import { Container } from 'yummy-design-component';
import { FlexContainer } from 'yummy-design-component';
import { FlexItem } from 'yummy-design-component';
import { Grid } from 'yummy-design-component';
// Header.tsx
const Header = () => {
return (
<FlexContainer tag="header" layout="centerLeft" columnGap={12} px={16}>
<h1 css={{ fontWeight: 600, fontSize: 16 }}>LOGO</h1>
<nav>
<FlexContainer tag="ul" columnGap={12}>
{Array.from({ length: 4 }, (_, index) => (
<li>
<a href={`/MENU${index}`} key={index}>
MENU{index + 1}
</a>
</li>
))}
</FlexContainer>
</nav>
<button type="button" aria-label="login" css={{ marginLeft: 'auto' }}>
LOGIN
</button>
</FlexContainer>
);
};
react (with vite)
typeScript
emotion
Latest ✓ | Latest ✓ |