dz list, form modal, list

This commit is contained in:
ronronscelestes 2021-11-18 11:17:10 +01:00
parent 1b77407800
commit ab6f64b9b6
4 changed files with 22 additions and 22 deletions

View File

@ -11,7 +11,7 @@ import { pxToRem } from '@strapi/helper-plugin';
import Plus from '@strapi/icons/Plus'; import Plus from '@strapi/icons/Plus';
import { Box } from '@strapi/design-system/Box'; import { Box } from '@strapi/design-system/Box';
import { Stack } from '@strapi/design-system/Stack'; import { Stack } from '@strapi/design-system/Stack';
import { Text } from '@strapi/design-system/Text'; import { Typography } from '@strapi/design-system/Typography';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
import styled from 'styled-components'; import styled from 'styled-components';
import useDataManager from '../../hooks/useDataManager'; import useDataManager from '../../hooks/useDataManager';
@ -80,12 +80,12 @@ function DynamicZoneList({ customRowComponent, components, addComponent, name, t
<button type="button" onClick={handleClickAdd}> <button type="button" onClick={handleClickAdd}>
<ComponentStack size={1}> <ComponentStack size={1}>
<StyledAddIcon /> <StyledAddIcon />
<Text small bold textColor="primary600"> <Typography varian="pi" fontWeight="bold" textColor="primary600">
{formatMessage({ {formatMessage({
id: getTrad('button.component.add'), id: getTrad('button.component.add'),
formatMessage: 'Add a component', formatMessage: 'Add a component',
})} })}
</Text> </Typography>
</ComponentStack> </ComponentStack>
</button> </button>
)} )}

View File

@ -17,7 +17,7 @@ import { Box } from '@strapi/design-system/Box';
import { Button } from '@strapi/design-system/Button'; import { Button } from '@strapi/design-system/Button';
import { Divider } from '@strapi/design-system/Divider'; import { Divider } from '@strapi/design-system/Divider';
import { ModalLayout, ModalBody, ModalFooter } from '@strapi/design-system/ModalLayout'; import { ModalLayout, ModalBody, ModalFooter } from '@strapi/design-system/ModalLayout';
import { H2 } from '@strapi/design-system/Text'; import { Typography } from '@strapi/design-system/Typography';
import { Tabs, Tab, TabGroup, TabPanels, TabPanel } from '@strapi/design-system/Tabs'; import { Tabs, Tab, TabGroup, TabPanels, TabPanel } from '@strapi/design-system/Tabs';
import { Flex } from '@strapi/design-system/Flex'; import { Flex } from '@strapi/design-system/Flex';
import { Stack } from '@strapi/design-system/Stack'; import { Stack } from '@strapi/design-system/Stack';
@ -922,7 +922,7 @@ const FormModal = () => {
}} }}
> >
<Flex justifyContent="space-between"> <Flex justifyContent="space-between">
<H2> <Typography as="h2" variant="beta">
{formatMessage( {formatMessage(
{ {
id: getModalTitleSubHeader({ id: getModalTitleSubHeader({
@ -944,7 +944,7 @@ const FormModal = () => {
step, step,
} }
)} )}
</H2> </Typography>
<Tabs> <Tabs>
<Tab hasError={doesBaseFormHasError}> <Tab hasError={doesBaseFormHasError}>
{formatMessage({ {formatMessage({

View File

@ -13,7 +13,7 @@ import { ModalHeader } from '@strapi/design-system/ModalLayout';
import { Box } from '@strapi/design-system/Box'; import { Box } from '@strapi/design-system/Box';
import { Flex } from '@strapi/design-system/Flex'; import { Flex } from '@strapi/design-system/Flex';
import { Stack } from '@strapi/design-system/Stack'; import { Stack } from '@strapi/design-system/Stack';
import { ButtonText } from '@strapi/design-system/Text'; import { Typography } from '@strapi/design-system/Typography';
import useDataManager from '../../hooks/useDataManager'; import useDataManager from '../../hooks/useDataManager';
import getTrad from '../../utils/getTrad'; import getTrad from '../../utils/getTrad';
import AttributeIcon from '../AttributeIcon'; import AttributeIcon from '../AttributeIcon';
@ -66,9 +66,9 @@ const FormModalHeader = ({
<AttributeIcon type={icon} /> <AttributeIcon type={icon} />
</Box> </Box>
<Box paddingLeft={3}> <Box paddingLeft={3}>
<ButtonText textColor="neutral800" as="h2" id="title"> <Typography fontWeight="bold" textColor="neutral800" as="h2" id="title">
{formatMessage({ id: headerId }, { name: displayName })} {formatMessage({ id: headerId }, { name: displayName })}
</ButtonText> </Typography>
</Box> </Box>
</Flex> </Flex>
</ModalHeader> </ModalHeader>

View File

@ -10,7 +10,7 @@ import PropTypes from 'prop-types';
import { EmptyBodyTable, useTracking } from '@strapi/helper-plugin'; import { EmptyBodyTable, useTracking } from '@strapi/helper-plugin';
import { Box } from '@strapi/design-system/Box'; import { Box } from '@strapi/design-system/Box';
import { Button } from '@strapi/design-system/Button'; import { Button } from '@strapi/design-system/Button';
import { TableLabel } from '@strapi/design-system/Text'; import { Typography } from '@strapi/design-system/Typography';
import { Table, Thead, Tr, Th, TFooter } from '@strapi/design-system/Table'; import { Table, Thead, Tr, Th, TFooter } from '@strapi/design-system/Table';
import Plus from '@strapi/icons/Plus'; import Plus from '@strapi/icons/Plus';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
@ -55,14 +55,14 @@ function List({
<Thead> <Thead>
<Tr> <Tr>
<Th> <Th>
<TableLabel textColor="neutral600"> <Typography variant="sigma" textColor="neutral600">
{formatMessage({ id: 'table.headers.name', defaultMessage: 'Name' })} {formatMessage({ id: 'table.headers.name', defaultMessage: 'Name' })}
</TableLabel> </Typography>
</Th> </Th>
<Th> <Th>
<TableLabel textColor="neutral600"> <Typography variant="sigma" textColor="neutral600">
{formatMessage({ id: 'table.headers.type', defaultMessage: 'Type' })} {formatMessage({ id: 'table.headers.type', defaultMessage: 'Type' })}
</TableLabel> </Typography>
</Th> </Th>
</Tr> </Tr>
</Thead> </Thead>
@ -83,14 +83,14 @@ function List({
<Thead> <Thead>
<Tr> <Tr>
<Th> <Th>
<TableLabel textColor="neutral600"> <Typography variant="sigma" textColor="neutral600">
{formatMessage({ id: 'table.headers.name', defaultMessage: 'Name' })} {formatMessage({ id: 'table.headers.name', defaultMessage: 'Name' })}
</TableLabel> </Typography>
</Th> </Th>
<Th> <Th>
<TableLabel textColor="neutral600"> <Typography variant="sigma" textColor="neutral600">
{formatMessage({ id: 'table.headers.type', defaultMessage: 'Type' })} {formatMessage({ id: 'table.headers.type', defaultMessage: 'Type' })}
</TableLabel> </Typography>
</Th> </Th>
</Tr> </Tr>
</Thead> </Thead>
@ -133,14 +133,14 @@ function List({
<thead> <thead>
<tr> <tr>
<th> <th>
<TableLabel textColor="neutral600"> <Typography variant="sigma" textColor="neutral600">
{formatMessage({ id: 'table.headers.name', defaultMessage: 'Name' })} {formatMessage({ id: 'table.headers.name', defaultMessage: 'Name' })}
</TableLabel> </Typography>
</th> </th>
<th colSpan="2"> <th colSpan="2">
<TableLabel textColor="neutral600"> <Typography variant="sigma" textColor="neutral600">
{formatMessage({ id: 'table.headers.type', defaultMessage: 'Type' })} {formatMessage({ id: 'table.headers.type', defaultMessage: 'Type' })}
</TableLabel> </Typography>
</th> </th>
</tr> </tr>
</thead> </thead>