mirror of
https://github.com/strapi/strapi.git
synced 2025-09-15 03:27:19 +00:00
apply design review
Signed-off-by: Ky <virginie.ky@gmail.com>
This commit is contained in:
parent
dfd277ab25
commit
c11cc6ab97
@ -5,14 +5,14 @@ const GlobalNotification = createGlobalStyle`
|
|||||||
.notificationIcon {
|
.notificationIcon {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: block;
|
display: block;
|
||||||
width: 60px;
|
width: 40px;
|
||||||
height: 60px;
|
height: 40px;
|
||||||
> div {
|
> div {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
top: 19px;
|
top: 10px;
|
||||||
left:20px;
|
left: 5px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
border: 1px solid ${props => props.theme.main.colors.green};
|
border: 1px solid ${props => props.theme.main.colors.green};
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -65,11 +65,6 @@ const GlobalNotification = createGlobalStyle`
|
|||||||
}
|
}
|
||||||
|
|
||||||
.notificationSuccess{
|
.notificationSuccess{
|
||||||
background: linear-gradient(
|
|
||||||
100deg,
|
|
||||||
#FFFFFF 50%,
|
|
||||||
rgba(39, 183, 15, .05)),
|
|
||||||
${props => props.theme.main.colors.white};
|
|
||||||
.notificationIcon {
|
.notificationIcon {
|
||||||
div {
|
div {
|
||||||
border-color: ${props => props.theme.main.colors.green};
|
border-color: ${props => props.theme.main.colors.green};
|
||||||
@ -81,11 +76,6 @@ const GlobalNotification = createGlobalStyle`
|
|||||||
}
|
}
|
||||||
|
|
||||||
.notificationWarning {
|
.notificationWarning {
|
||||||
background: linear-gradient(
|
|
||||||
100deg,
|
|
||||||
#FFFFFF 50%,
|
|
||||||
rgba(250, 156, 0, .05)),
|
|
||||||
${props => props.theme.main.colors.white};
|
|
||||||
.notificationIcon {
|
.notificationIcon {
|
||||||
div {
|
div {
|
||||||
border-color: ${props => props.theme.main.colors.orange};
|
border-color: ${props => props.theme.main.colors.orange};
|
||||||
@ -97,8 +87,6 @@ const GlobalNotification = createGlobalStyle`
|
|||||||
}
|
}
|
||||||
|
|
||||||
.notificationError {
|
.notificationError {
|
||||||
background: linear-gradient(100deg , #FFFFFF 50%, rgba(255, 93, 0, .05)), $white;
|
|
||||||
|
|
||||||
.notificationIcon {
|
.notificationIcon {
|
||||||
div {
|
div {
|
||||||
border-color: ${props => props.theme.main.colors.red};
|
border-color: ${props => props.theme.main.colors.red};
|
||||||
@ -110,11 +98,6 @@ const GlobalNotification = createGlobalStyle`
|
|||||||
}
|
}
|
||||||
|
|
||||||
.notificationInfo {
|
.notificationInfo {
|
||||||
background: linear-gradient(
|
|
||||||
100deg,
|
|
||||||
#FFFFFF 50%,
|
|
||||||
rgba(28, 93, 231, .05)),
|
|
||||||
${props => props.theme.main.colors.white};
|
|
||||||
.notificationIcon {
|
.notificationIcon {
|
||||||
div {
|
div {
|
||||||
border-color: ${props => props.theme.main.colors.blue};
|
border-color: ${props => props.theme.main.colors.blue};
|
||||||
|
@ -5,7 +5,7 @@ import colors from '../../assets/styles/colors';
|
|||||||
const List = styled.ul`
|
const List = styled.ul`
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
max-height: 178px;
|
max-height: 182px;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
@ -20,9 +20,6 @@ const List = styled.ul`
|
|||||||
li {
|
li {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 2px;
|
margin-bottom: 2px;
|
||||||
&:last-of-type {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
a {
|
a {
|
||||||
display: block;
|
display: block;
|
||||||
|
@ -9,15 +9,14 @@ const Wrapper = styled.div`
|
|||||||
}
|
}
|
||||||
|
|
||||||
.count-info {
|
.count-info {
|
||||||
margin-top: 2px;
|
position: relative;
|
||||||
padding: 1px 3px;
|
display: inline-block;
|
||||||
height: 14px;
|
height: 14px;
|
||||||
min-width: 14px;
|
min-width: 14px;
|
||||||
display: inline-block;
|
margin-top: 2px;
|
||||||
|
padding: 1px 3px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
position: relative;
|
|
||||||
&:before {
|
&:before {
|
||||||
content: attr(datadescr);
|
content: attr(datadescr);
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -36,7 +35,7 @@ const Wrapper = styled.div`
|
|||||||
}
|
}
|
||||||
// Title
|
// Title
|
||||||
h3 {
|
h3 {
|
||||||
margin-bottom: 12px;
|
margin-bottom: 10px;
|
||||||
padding-right: 20px;
|
padding-right: 20px;
|
||||||
padding-top: 2px;
|
padding-top: 2px;
|
||||||
font-family: Lato;
|
font-family: Lato;
|
||||||
@ -45,9 +44,6 @@ const Wrapper = styled.div`
|
|||||||
letter-spacing: 0.1rem;
|
letter-spacing: 0.1rem;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
// span:last-of-type {
|
|
||||||
|
|
||||||
// }
|
|
||||||
& + button {
|
& + button {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 2px;
|
top: 2px;
|
||||||
@ -62,7 +58,6 @@ const Wrapper = styled.div`
|
|||||||
}
|
}
|
||||||
// Search
|
// Search
|
||||||
.search-wrapper {
|
.search-wrapper {
|
||||||
// margin-bottom: 16px;
|
|
||||||
margin-bottom: 7px;
|
margin-bottom: 7px;
|
||||||
&::after {
|
&::after {
|
||||||
display: block;
|
display: block;
|
||||||
@ -92,6 +87,7 @@ const Wrapper = styled.div`
|
|||||||
}
|
}
|
||||||
ul {
|
ul {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
|
padding-top: 2px;
|
||||||
li {
|
li {
|
||||||
a {
|
a {
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
|
@ -37,9 +37,9 @@ const Dropdown = styled.div`
|
|||||||
&:last-of-type {
|
&:last-of-type {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
button {
|
button {
|
||||||
margin-bottom: 8px;
|
margin-bottom: 10px;
|
||||||
&.is-open {
|
&.is-open {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.collapse {
|
.collapse {
|
||||||
|
@ -30,7 +30,8 @@ const StyledCustomCheckbox = styled.div`
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.no-label {
|
.no-label {
|
||||||
margin-top: -25px;
|
margin-top: -26px;
|
||||||
|
margin-bottom: 1px;
|
||||||
label {
|
label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
@ -8,10 +8,8 @@ import styled from 'styled-components';
|
|||||||
|
|
||||||
const StyledCustomLink = styled.div`
|
const StyledCustomLink = styled.div`
|
||||||
padding-left: 15px;
|
padding-left: 15px;
|
||||||
padding-top: 10px;
|
padding-top: 6px;
|
||||||
line-height: 0;
|
|
||||||
margin-left: -3px;
|
margin-left: -3px;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
|
cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
@ -1130,7 +1130,7 @@ const FormModal = () => {
|
|||||||
lineHeight: 'normal',
|
lineHeight: 'normal',
|
||||||
fontWeight: 500,
|
fontWeight: 500,
|
||||||
}}
|
}}
|
||||||
key={`${index}.${i}`}
|
key="divider"
|
||||||
>
|
>
|
||||||
<Label htmlFor="divider-no-for">
|
<Label htmlFor="divider-no-for">
|
||||||
<FormattedMessage
|
<FormattedMessage
|
||||||
|
@ -14,17 +14,17 @@ const Header = styled.div`
|
|||||||
padding-top: 1.1rem;
|
padding-top: 1.1rem;
|
||||||
color: #333740;
|
color: #333740;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: ${({ theme }) => theme.fontWeights.bold};
|
font-weight: ${({ theme }) => theme.main.fontWeights.bold};
|
||||||
|
|
||||||
> span:not(:first-child) {
|
> span:not(:first-child) {
|
||||||
color: #787e8f;
|
color: #787e8f;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-weight: ${({ theme }) => theme.fontWeights.semiBold};
|
font-weight: ${({ theme }) => theme.main.fontWeights.semiBold};
|
||||||
}
|
}
|
||||||
|
|
||||||
> span:last-child {
|
> span:last-child {
|
||||||
color: #1642e1;
|
color: #1642e1;
|
||||||
font-weight: ${({ theme }) => theme.fontWeights.bold};
|
font-weight: ${({ theme }) => theme.main.fontWeights.bold};
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
@ -35,7 +35,7 @@ Header.propTypes = {
|
|||||||
const Path = styled.div`
|
const Path = styled.div`
|
||||||
padding: 0 1rem;
|
padding: 0 1rem;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
font-weight: ${({ theme }) => theme.fontWeights.bold};
|
font-weight: ${({ theme }) => theme.main.fontWeights.bold};
|
||||||
color: #333740;
|
color: #333740;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
@ -48,7 +48,7 @@ const Verb = styled.div`
|
|||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: ${({ theme }) => theme.fontWeights.bold};
|
font-weight: ${({ theme }) => theme.main.fontWeights.bold};
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
letter-spacing: 0.5px;
|
letter-spacing: 0.5px;
|
||||||
&.get {
|
&.get {
|
||||||
|
@ -10,7 +10,7 @@ const Header = styled.div`
|
|||||||
margin-bottom: 1.1rem;
|
margin-bottom: 1.1rem;
|
||||||
padding-top: 2.8rem;
|
padding-top: 2.8rem;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: ${({ theme }) => theme.fontWeights.bold};
|
font-weight: ${({ theme }) => theme.main.fontWeights.bold};
|
||||||
line-height: 3.6rem;
|
line-height: 3.6rem;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user