yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-10-31 01:47:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #5717 from strapi/event/add-back-button-property

Browse Source 
Add BackButton event
This commit is contained in:
cyril lopez 2020-04-06 14:22:08 +02:00 committed by GitHub
commit 24a1da6c9e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 67 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
packages/strapi-helper-plugin/lib/src/components/BackHeader/StyledBackHeader.js Normal file
View File

@ -0,0 +1,34 @@
/*
*
*
* StyledBackHeader
*
*/
import styled from 'styled-components';
const StyledBackHeader = styled.div`
position: fixed;
top: 0;
height: 6rem;
width: 6.5rem;
line-height: 6rem;
z-index: 1050;
text-align: center;
background-color: #ffffff;
color: #81848a;
border-top: 1px solid #f3f4f4;
border-right: 1px solid #f3f4f4;
border-left: 1px solid #f3f4f4;
cursor: pointer;
&:before {
content: '\f053';
font-family: 'FontAwesome';
font-size: 1.8rem;
font-weight: bolder;
}
&:hover {
background-color: #f3f4f4;
}
`;
export default StyledBackHeader;

58
packages/strapi-helper-plugin/lib/src/components/BackHeader/index.js
View File

@ -4,31 +4,39 @@
* BackHeader * BackHeader
* *
*/ */
import styled from 'styled-components';
const BackHeader = styled.div` import React from 'react';
position: fixed; import { get } from 'lodash';
top: 0; import { useRouteMatch } from 'react-router-dom';
height: 6rem; import PropTypes from 'prop-types';
width: 6.5rem; import { useGlobalContext } from '../../contexts/GlobalContext';
line-height: 6rem; import StyledBackHeader from './StyledBackHeader';
z-index: 1050;
text-align: center; const BackHeader = props => {
background-color: #ffffff; const { emitEvent } = useGlobalContext();
color: #81848a; const pluginsParams = useRouteMatch('/plugins/:pluginId');
border-top: 1px solid #f3f4f4; const settingsParams = useRouteMatch('/settings/:settingType');
border-right: 1px solid #f3f4f4; const pluginId = get(pluginsParams, ['params', 'pluginId'], null);
border-left: 1px solid #f3f4f4; const settingType = get(settingsParams, ['params', 'settingType'], null);
cursor: pointer; const location = pluginId || settingType;
&:before {
content: '\f053'; const handleClick = e => {
font-family: 'FontAwesome'; if (location) {
font-size: 1.8rem; emitEvent('didGoBack', { location });
font-weight: bolder; }
}
&:hover { props.onClick(e);
background-color: #f3f4f4; };
}
`; return <StyledBackHeader {...props} onClick={handleClick} />;
};
BackHeader.defaultProps = {
onClick: () => {},
};
BackHeader.propTypes = {
onClick: PropTypes.func,
};
export default BackHeader; export default BackHeader;