yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-09-22 14:59:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove focus border and open link in a new tab

Browse Source
This commit is contained in:
soupette 2018-04-09 10:29:33 +02:00
parent ff4253aeea
commit 6b0a37cdb3
4 changed files with 10 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/strapi-helper-plugin/lib/src/components/Wysiwyg/index.js
View File

@ -49,7 +49,6 @@ class Wysiwyg extends React.Component {
super(props); super(props);
this.state = { this.state = {
editorState: EditorState.createEmpty(), editorState: EditorState.createEmpty(),
isFocused: false,
initialValue: '', initialValue: '',
isDraging: false, isDraging: false,
isPreviewMode: false, isPreviewMode: false,
@ -57,11 +56,9 @@ class Wysiwyg extends React.Component {
isFullscreen: false, isFullscreen: false,
}; };
this.focus = () => { this.focus = () => {
this.setState({ isFocused: true });
return this.domEditor.focus(); return this.domEditor.focus();
}; };
this.blur = () => { this.blur = () => {
this.setState({ isFocused: false });
return this.domEditor.blur(); return this.domEditor.blur();
}; };
} }
@ -70,7 +67,6 @@ class Wysiwyg extends React.Component {
handleChangeSelect: this.handleChangeSelect, handleChangeSelect: this.handleChangeSelect,
headerValue: this.state.headerValue, headerValue: this.state.headerValue,
html: this.props.value, html: this.props.value,
isFocused: this.state.isFocused,
isPreviewMode: this.state.isPreviewMode, isPreviewMode: this.state.isPreviewMode,
isFullscreen: this.state.isFullscreen, isFullscreen: this.state.isFullscreen,
placeholder: this.props.placeholder, placeholder: this.props.placeholder,
@ -504,7 +500,7 @@ class Wysiwyg extends React.Component {
); );
render() { render() {
const { editorState, isFocused, isPreviewMode, isFullscreen } = this.state; const { editorState, isPreviewMode, isFullscreen } = this.state;
const editorStyle = isFullscreen ? { marginTop: '0' } : this.props.style; const editorStyle = isFullscreen ? { marginTop: '0' } : this.props.style;
return ( return (
@ -513,10 +509,8 @@ class Wysiwyg extends React.Component {
<div <div
className={cn( className={cn(
styles.editorWrapper, styles.editorWrapper,
this.state.isFocused && styles.editorFocus,
!this.props.deactivateErrorHighlight && this.props.error && styles.editorError, !this.props.deactivateErrorHighlight && this.props.error && styles.editorError,
!isEmpty(this.props.className) && this.props.className, !isEmpty(this.props.className) && this.props.className,
isFullscreen && isFocused && styles.fullscreenFocus,
)} )}
onClick={e => { onClick={e => {
if (isFullscreen) { if (isFullscreen) {
@ -590,7 +584,7 @@ class Wysiwyg extends React.Component {
{/* PREVIEW WYSIWYG FULLSCREEN */} {/* PREVIEW WYSIWYG FULLSCREEN */}
{isFullscreen && ( {isFullscreen && (
<div <div
className={cn(styles.editorWrapper, isFocused && styles.fullscreenPreviewFocused)} className={cn(styles.editorWrapper)}
onClick={e => { onClick={e => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
@ -613,7 +607,6 @@ Wysiwyg.childContextTypes = {
handleChangeSelect: PropTypes.func, handleChangeSelect: PropTypes.func,
headerValue: PropTypes.string, headerValue: PropTypes.string,
html: PropTypes.string, html: PropTypes.string,
isFocused: PropTypes.bool,
isFullscreen: PropTypes.bool, isFullscreen: PropTypes.bool,
isPreviewMode: PropTypes.bool, isPreviewMode: PropTypes.bool,
placeholder: PropTypes.string, placeholder: PropTypes.string,

8
packages/strapi-helper-plugin/lib/src/components/Wysiwyg/link.js
View File

@ -11,7 +11,13 @@ const Link = props => {
const { url } = props.contentState.getEntity(props.entityKey).getData(); const { url } = props.contentState.getEntity(props.entityKey).getData();
return ( return (
<a href={url}> <a
href={url}
onClick={() => {
window.open(url, '_blank');
}}
style={{ cursor: 'pointer' }}
>
{props.children} {props.children}
</a> </a>
); );

12
packages/strapi-helper-plugin/lib/src/components/Wysiwyg/styles.scss
View File

@ -53,10 +53,6 @@
} }
} }
.editorFocus {
border-color: #78caff !important;
}
.editorError { .editorError {
border-color: #ff203c !important; border-color: #ff203c !important;
} }
@ -66,10 +62,6 @@
width: 0; width: 0;
} }
.fullscreenPreviewFocused {
border-color: #78caff !important;
border-left-color: #E3E9F3 !important;
}
.editorBlockquote { .editorBlockquote {
border-left: 5px solid #eee; border-left: 5px solid #eee;
font-family: Lato; font-family: Lato;
@ -110,10 +102,6 @@
} }
} }
.fullscreenFocus {
border-right-color: #E3E9F3 !important;
}
.editorFullScreen { .editorFullScreen {
max-height: calc(100% - 70px) !important; max-height: calc(100% - 70px) !important;
margin-bottom: 0; margin-bottom: 0;