updated snapshots + removed unecessary styling

This commit is contained in:
ronronscelestes 2021-11-09 19:25:03 +01:00
parent edd3ce4c3c
commit 5b1b553e05
4 changed files with 53 additions and 70 deletions

View File

@ -60,13 +60,7 @@ const RowLabelWithCheckbox = ({
role: 'button',
})}
>
<Typography
fontWeight={isActive ? 'bold' : ''}
textColor={isActive ? 'primary600' : 'neutral800'}
ellipsis
>
{upperFirst(label)}
</Typography>
<Typography ellipsis>{upperFirst(label)}</Typography>
{children}
</CollapseLabel>
</Flex>

View File

@ -353,20 +353,6 @@ exports[`<EditPage /> renders and matches the snapshot 1`] = `
margin-left: 8px;
}
.c22 {
font-weight: 500;
font-size: 0.875rem;
line-height: 1.43;
color: #32324d;
}
.c23 {
font-weight: 400;
font-size: 0.75rem;
line-height: 1.33;
color: #8e8ea9;
}
.c30 {
font-weight: 600;
color: #32324d;
@ -760,6 +746,19 @@ exports[`<EditPage /> renders and matches the snapshot 1`] = `
display: flex;
}
.c22 {
font-weight: 600;
color: #32324d;
font-size: 0.875rem;
line-height: 1.43;
}
.c23 {
color: #8e8ea9;
font-size: 0.75rem;
line-height: 1.33;
}
.c26 {
display: grid;
grid-template-columns: repeat(12,1fr);

View File

@ -1,6 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { Box } from '@strapi/design-system/Box';
import { Flex } from '@strapi/design-system/Flex';
import { Td, Tr } from '@strapi/design-system/Table';
@ -9,10 +8,6 @@ import { IconButton } from '@strapi/design-system/IconButton';
import { stopPropagation, onRowClick, pxToRem } from '@strapi/helper-plugin';
import { useIntl } from 'react-intl';
const CustomTypographyEllipsis = styled(Typography)`
display: block;
`;
const RoleRow = ({ id, name, description, usersCount, icons }) => {
const { formatMessage } = useIntl();
@ -32,14 +27,14 @@ const RoleRow = ({ id, name, description, usersCount, icons }) => {
})}
>
<Td maxWidth={pxToRem(130)}>
<CustomTypographyEllipsis ellipsis textColor="neutral800">
<Typography ellipsis textColor="neutral800">
{name}
</CustomTypographyEllipsis>
</Typography>
</Td>
<Td maxWidth={pxToRem(250)}>
<CustomTypographyEllipsis ellipsis textColor="neutral800">
<Typography ellipsis textColor="neutral800">
{description}
</CustomTypographyEllipsis>
</Typography>
</Td>
<Td>
<Typography textColor="neutral800">{usersCountText}</Typography>

View File

@ -204,20 +204,20 @@ describe('<ListPage />', () => {
padding-left: 24px;
}
.c29 {
.c28 {
background: #eaeaef;
}
.c31 {
.c30 {
background: #f0f0ff;
padding: 20px;
}
.c33 {
.c32 {
background: #d9d8ff;
}
.c35 {
.c34 {
padding-left: 12px;
}
@ -259,7 +259,7 @@ describe('<ListPage />', () => {
overflow-x: auto;
}
.c28 tr:last-of-type {
.c27 tr:last-of-type {
border-bottom: none;
}
@ -312,24 +312,24 @@ describe('<ListPage />', () => {
vertical-align: sub;
}
.c26 svg {
.c25 svg {
height: 0.25rem;
}
.c30 {
.c29 {
height: 1px;
border: none;
margin: 0;
}
.c36 {
.c35 {
font-weight: 600;
color: #4945ff;
font-size: 0.75rem;
line-height: 1.33;
}
.c34 {
.c33 {
height: 1.5rem;
width: 1.5rem;
border-radius: 50%;
@ -347,36 +347,23 @@ describe('<ListPage />', () => {
align-items: center;
}
.c34 svg {
.c33 svg {
height: 0.625rem;
width: 0.625rem;
}
.c34 svg path {
.c33 svg path {
fill: #4945ff;
}
.c32 {
.c31 {
border-radius: 0 0 4px 4px;
display: block;
width: 100%;
border: none;
}
.c24 {
color: #666687;
font-size: 0.875rem;
line-height: 1.43;
}
.c25 {
font-weight: 600;
font-size: 0.6875rem;
line-height: 1.45;
text-transform: uppercase;
}
.c27 {
.c26 {
border: 0;
-webkit-clip: rect(0 0 0 0);
clip: rect(0 0 0 0);
@ -446,6 +433,14 @@ describe('<ListPage />', () => {
line-height: 1.5;
}
.c24 {
color: #666687;
font-weight: 600;
font-size: 0.6875rem;
line-height: 1.45;
text-transform: uppercase;
}
.c0 {
outline: none;
}
@ -544,12 +539,12 @@ describe('<ListPage />', () => {
class="c23"
>
<span
class="c24 c25"
class="c24"
>
Name
</span>
<span
class="c26"
class="c25"
/>
</div>
</th>
@ -562,12 +557,12 @@ describe('<ListPage />', () => {
class="c23"
>
<span
class="c24 c25"
class="c24"
>
Description
</span>
<span
class="c26"
class="c25"
/>
</div>
</th>
@ -580,12 +575,12 @@ describe('<ListPage />', () => {
class="c23"
>
<span
class="c24 c25"
class="c24"
>
Users
</span>
<span
class="c26"
class="c25"
/>
</div>
</th>
@ -598,36 +593,36 @@ describe('<ListPage />', () => {
class="c23"
>
<div
class="c27"
class="c26"
>
Actions
</div>
<span
class="c26"
class="c25"
/>
</div>
</th>
</tr>
</thead>
<tbody
class="c28"
class="c27"
/>
</table>
</div>
</div>
<div>
<hr
class="c29 c30"
class="c28 c29"
/>
<button
class="c31 c32"
class="c30 c31"
>
<div
class="c23"
>
<div
aria-hidden="true"
class="c33 c34"
class="c32 c33"
>
<svg
fill="none"
@ -643,10 +638,10 @@ describe('<ListPage />', () => {
</svg>
</div>
<div
class="c35"
class="c34"
>
<span
class="c36"
class="c35"
>
Add new role
</span>