CmGridContainer / CmGrid

import { CmGridContainer } from "cosmemilton-ui/server";

import { CmCard, CmGrid, CmGridContainer, CmText } from "cosmemilton-ui/server";

const items = ["Receita", "Pedidos", "Clientes", "SLA"];

export default function Example() {
  return (
    <CmGridContainer columns={{ base: 1, sm: 2, lg: 4 }} gap="md">
      {items.map((item) => (
        <CmGrid key={item}>
          <CmCard padding="lg">
            <CmText weight="semibold">{item}</CmText>
            <CmText tone="muted">Resumo responsivo.</CmText>
          </CmCard>
        </CmGrid>
      ))}
    </CmGridContainer>
  );
}