QA/ Wysiwyg link button size (#11441)

* attempt to fix link svg in wysiwyg

* fixed more label button

* fixed tests
This commit is contained in:
ronronscelestes 2021-11-02 18:00:31 +01:00 committed by GitHub
parent 61b7748dad
commit a10953ffb9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 25 additions and 12 deletions

View File

@ -18,7 +18,13 @@ import Image from '@strapi/icons/Picture';
import Link from '@strapi/icons/Link';
import Quote from '@strapi/icons/Quote';
import More from '@strapi/icons/More';
import { MainButtons, CustomIconButton, MoreButton, IconButtonGroupMargin } from './WysiwygStyles';
import {
MainButtons,
CustomIconButton,
MoreButton,
IconButtonGroupMargin,
CustomLinkIconButton,
} from './WysiwygStyles';
const WysiwygNav = ({
editorRef,
@ -75,7 +81,7 @@ const WysiwygNav = ({
/>
</MainButtons>
<MoreButton disabled ref={buttonMoreRef} id="more" label="more" icon={<More />} />
<MoreButton disabled ref={buttonMoreRef} id="more" label="More" icon={<More />} />
</Flex>
<Button onClick={onTogglePreviewMode} variant="tertiary" size="L" id="preview">
@ -135,7 +141,7 @@ const WysiwygNav = ({
ref={buttonMoreRef}
onClick={onTogglePopover}
id="more"
label="more"
label="More"
icon={<More />}
/>
{visiblePopover && (
@ -179,7 +185,7 @@ const WysiwygNav = ({
name="Image"
icon={<Image />}
/>
<CustomIconButton
<CustomLinkIconButton
onClick={() => onActionClick('Link', editorRef, onTogglePopover)}
id="Link"
label="Link"

View File

@ -21,6 +21,13 @@ export const CustomIconButton = styled(IconButton)`
}
`;
export const CustomLinkIconButton = styled(CustomIconButton)`
svg {
width: ${8 / 16}rem;
height: ${8 / 16}rem;
}
`;
export const MainButtons = styled(IconButtonGroup)`
margin-left: ${({ theme }) => theme.spaces[4]};
`;

View File

@ -770,10 +770,6 @@ describe('Admin | containers | RoleCreatePage', () => {
background: #d9d8ff;
}
.c40:hover:not([aria-disabled='true']) svg path {
fill: #4945ff;
}
.c47 {
background: transparent;
border: none;
@ -861,6 +857,10 @@ describe('Admin | containers | RoleCreatePage', () => {
height: 5.5rem;
}
.c44:hover svg path {
fill: #4945ff;
}
@media (max-width:68.75rem) {
.c20 {
grid-column: span;

View File

@ -853,10 +853,6 @@ describe('Admin | containers | RoleEditPage', () => {
background: #d9d8ff;
}
.c47:hover:not([aria-disabled='true']) svg path {
fill: #4945ff;
}
.c54 {
background: transparent;
border: none;
@ -944,6 +940,10 @@ describe('Admin | containers | RoleEditPage', () => {
height: 5.5rem;
}
.c51:hover svg path {
fill: #4945ff;
}
@media (max-width:68.75rem) {
.c27 {
grid-column: span;