yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-11-03 19:36:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

updated onboarding component

Browse Source
This commit is contained in:
ronronscelestes 2021-09-07 12:18:41 +02:00
parent 13fb791c67
commit d3e85fad13
3 changed files with 42 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
packages/core/admin/admin/src/pages/Admin/Onboarding/StaticLinks/StyledLink.js
View File

@ -1,23 +0,0 @@
import styled from 'styled-components';
const StyledLink = styled.a`
display: flex;
width: 100%;
height: 27px;
padding: 0 20px;
color: #919bae;
span,
svg {
margin: auto 0;
}
svg {
margin-right: 10px;
}
&:hover {
background-color: #f7f8f8;
text-decoration: none;
color: #919bae;
}
`;
export default StyledLink;

43
packages/core/admin/admin/src/pages/Admin/Onboarding/StaticLinks/index.js
View File

@ -6,11 +6,46 @@
import React from 'react';
import { useIntl } from 'react-intl';
import styled from 'styled-components';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Text } from '@strapi/parts/Text';
import { InjectionZone } from '../../../../shared/components';
import StyledLink from './StyledLink';
function StaticLinks() {
const StyledLink = styled.a`
display: flex;
width: 100%;
height: 27px;
padding: 0 20px;
color: ${({ theme }) => theme.colors.neutral400};
text-decoration: none;
span,
svg {
margin: auto 0;
}
svg {
margin-right: 10px;
}
${[Text]} {
color: ${({ theme }) => theme.colors.neutral400};
margin: auto 0;
}
&:hover {
background: ${({ theme }) => theme.colors.neutral100};
color: ${({ theme }) => theme.colors.neutral500};
${[Text]} {
color: ${({ theme }) => theme.colors.neutral700};
}
}
${[Text]} {
color: ${({ theme }) => theme.colors.neutral600};
}
`;
const StaticLinks = () => {
const { formatMessage } = useIntl();
const staticLinks = [
{
@ -34,7 +69,7 @@ function StaticLinks() {
<li key={label}>
<StyledLink href={destination} target="_blank" rel="noopener noreferrer">
<FontAwesomeIcon icon={icon} />
<span>{label}</span>
<Text>{label}</Text>
</StyledLink>
</li>
);
@ -42,6 +77,6 @@ function StaticLinks() {
<InjectionZone area="admin.tutorials.links" />
</ul>
);
}
};
export default StaticLinks;

6
packages/core/admin/admin/src/pages/Admin/Onboarding/Wrapper.js
View File

@ -76,7 +76,7 @@ const Wrapper = styled.div`
margin-right: 15px;
background-color: white;
box-shadow: 0 2px 4px 0 #e3e9f3;
border-radius: 3px;
border-radius: ${({ theme }) => theme.spaces[2]};
overflow: hidden;
&.shown {
animation: ${fadeIn} 0.5s forwards;
@ -104,8 +104,8 @@ const Wrapper = styled.div`
height: 100%;
border-radius: 50%;
color: white;
background: #0e7de7;
box-shadow: 0px 2px 4px 0px rgba(227, 233, 243, 1);
background: ${({ theme }) => theme.colors.primary600};
box-shadow: ${({ theme }) => theme.shadows.tableShadow};
i,
svg {
margin: auto;