mirror of
https://github.com/strapi/strapi.git
synced 2025-09-25 16:29:34 +00:00
dz action button blue when expanded + small border fix on repeatable component
This commit is contained in:
parent
1a7f02a19d
commit
3d2f120a0b
@ -17,6 +17,15 @@ import { getTrad } from '../../../../utils';
|
||||
import FieldComponent from '../../../FieldComponent';
|
||||
import Rectangle from './Rectangle';
|
||||
|
||||
const ActionStack = styled(Stack)`
|
||||
svg {
|
||||
path {
|
||||
fill: ${({ theme, expanded }) =>
|
||||
expanded ? theme.colors.primary600 : theme.colors.neutral600};
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const IconButtonCustom = styled(IconButton)`
|
||||
background-color: transparent;
|
||||
`;
|
||||
@ -106,7 +115,7 @@ const Component = ({
|
||||
<AccordionToggle
|
||||
startIcon={<FontAwesomeIcon icon={icon} />}
|
||||
action={
|
||||
<Stack horizontal size={0}>
|
||||
<ActionStack horizontal size={0} expanded={isOpen}>
|
||||
{showDownIcon && (
|
||||
<IconButtonCustom
|
||||
noBorder
|
||||
@ -131,7 +140,7 @@ const Component = ({
|
||||
icon={<Trash />}
|
||||
/>
|
||||
)}
|
||||
</Stack>
|
||||
</ActionStack>
|
||||
}
|
||||
title={friendlyName}
|
||||
togglePosition="left"
|
||||
|
@ -9,6 +9,7 @@ import { Flex } from '@strapi/design-system/Flex';
|
||||
import { KeyboardNavigable } from '@strapi/design-system/KeyboardNavigable';
|
||||
|
||||
const AccordionFooter = styled(Box)`
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid ${({ theme }) => theme.colors.neutral200};
|
||||
border-right: 1px solid ${({ theme }) => theme.colors.neutral200};
|
||||
border-left: 1px solid ${({ theme }) => theme.colors.neutral200};
|
||||
@ -16,6 +17,22 @@ const AccordionFooter = styled(Box)`
|
||||
`;
|
||||
|
||||
const EnhancedGroup = styled(Box)`
|
||||
> div {
|
||||
> div {
|
||||
> div:first-of-type {
|
||||
border-radius: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> div:first-of-type {
|
||||
> div {
|
||||
> div:first-of-type {
|
||||
border-radius: ${({ theme }) => theme.borderRadius} ${({ theme }) => theme.borderRadius} 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> div {
|
||||
& > * {
|
||||
border-radius: unset;
|
||||
|
@ -138,7 +138,7 @@ const RepeatableComponent = ({
|
||||
<AccordionGroupCustom
|
||||
error={errorMessage}
|
||||
footer={
|
||||
<Flex justifyContent="center" height="48px" background="neutral0" hasRadius>
|
||||
<Flex justifyContent="center" height="48px" background="neutral0">
|
||||
<TextButtonCustom disabled={isReadOnly} onClick={handleClick} startIcon={<Plus />}>
|
||||
{formatMessage({
|
||||
id: getTrad('containers.EditView.add.new-entry'),
|
||||
|
Loading…
x
Reference in New Issue
Block a user