mirror of
https://github.com/strapi/strapi.git
synced 2025-08-09 01:07:27 +00:00
pdf icons & color
Signed-off-by: Virginie Ky <virginie.ky@gmail.com>
This commit is contained in:
parent
dea642b907
commit
ba57f2c801
@ -3,6 +3,7 @@ const colors = {
|
|||||||
white: '#ffffff',
|
white: '#ffffff',
|
||||||
red: '#ff203c',
|
red: '#ff203c',
|
||||||
orange: '#ff5d00',
|
orange: '#ff5d00',
|
||||||
|
lightOrange: '#f64d0a',
|
||||||
yellow: '#ffd500',
|
yellow: '#ffd500',
|
||||||
green: '#27b70f',
|
green: '#27b70f',
|
||||||
blue: '#0097f7',
|
blue: '#0097f7',
|
||||||
@ -26,15 +27,6 @@ const colors = {
|
|||||||
lightBlue: '#E6F0FB',
|
lightBlue: '#E6F0FB',
|
||||||
mediumBlue: '#007EFF',
|
mediumBlue: '#007EFF',
|
||||||
darkBlue: '#AED4FB',
|
darkBlue: '#AED4FB',
|
||||||
|
|
||||||
// Specific to file icons
|
|
||||||
file: {
|
|
||||||
archive: '#715A31',
|
|
||||||
code: '#515A6D',
|
|
||||||
default: '#BDBFC2',
|
|
||||||
pdf: '#E26D6D',
|
|
||||||
},
|
|
||||||
|
|
||||||
content: {
|
content: {
|
||||||
background: '#fafafb',
|
background: '#fafafb',
|
||||||
'background-alpha': 'rgba(14, 22, 34, 0.02)',
|
'background-alpha': 'rgba(14, 22, 34, 0.02)',
|
||||||
|
@ -4,15 +4,16 @@ import { themePropTypes } from 'strapi-helper-plugin';
|
|||||||
|
|
||||||
const Wrapper = styled.div`
|
const Wrapper = styled.div`
|
||||||
font-size: 54px;
|
font-size: 54px;
|
||||||
color: ${({ theme, icon }) => theme.main.colors.file[icon]};
|
color: ${({ theme, colored }) =>
|
||||||
|
colored ? theme.main.colors.lightOrange : theme.main.colors.grey};
|
||||||
`;
|
`;
|
||||||
|
|
||||||
Wrapper.defaultProps = {
|
Wrapper.defaultProps = {
|
||||||
icon: 'default',
|
colored: false,
|
||||||
};
|
};
|
||||||
|
|
||||||
Wrapper.propTypes = {
|
Wrapper.propTypes = {
|
||||||
icon: PropTypes.string,
|
colored: PropTypes.bool,
|
||||||
...themePropTypes,
|
...themePropTypes,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -13,17 +13,17 @@ import extensions from './utils/extensions.json';
|
|||||||
import Wrapper from './Wrapper';
|
import Wrapper from './Wrapper';
|
||||||
|
|
||||||
const FileIcon = ({ ext }) => {
|
const FileIcon = ({ ext }) => {
|
||||||
const iconName = Object.keys(extensions).find(key => extensions[key].includes(ext));
|
const iconName = Object.keys(extensions).find(key => extensions[key].includes(ext)) || 'alt';
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Wrapper type="file" icon={iconName}>
|
<Wrapper type="file" colored={iconName === 'pdf'}>
|
||||||
<FontAwesomeIcon icon={['far', `file-${iconName}`]} />
|
<FontAwesomeIcon icon={['far', `file-${iconName}`]} />
|
||||||
</Wrapper>
|
</Wrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
FileIcon.defaultProps = {
|
FileIcon.defaultProps = {
|
||||||
ext: 'zip',
|
ext: 'alt',
|
||||||
};
|
};
|
||||||
|
|
||||||
FileIcon.propTypes = {
|
FileIcon.propTypes = {
|
||||||
|
@ -1,7 +1,4 @@
|
|||||||
{
|
{
|
||||||
"archive": ["rar", "tar", "zip"],
|
"archive": ["rar", "tar", "zip"],
|
||||||
"code": ["js", "json", "rb", "erb", "txt", "css", "scss", "html", "jsx", "svg"],
|
"pdf": ["pdf"]
|
||||||
"pdf": ["pdf"],
|
|
||||||
"powerpoint": ["ppt", "key", "xls"],
|
|
||||||
"word": ["doc", "docx", "pages"]
|
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user