0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-17 23:44:39 -05:00

Added brand color CSS variable

no refs.
- added brand color CSS variable to iframe styles so that it's possible to use on UI elements
This commit is contained in:
Peter Zimon 2020-07-21 11:06:11 +02:00
parent 94093a2041
commit e7459437cb
3 changed files with 16 additions and 4 deletions

View file

@ -211,8 +211,13 @@ export default class PopupModal extends React.Component {
}
renderFrameStyles() {
const styles = `
:root {
--brandcolor: ${this.context.brandColor}
}
` + FrameStyle;
return (
<style dangerouslySetInnerHTML={{__html: FrameStyle}} />
<style dangerouslySetInnerHTML={{__html: styles}} />
);
}

View file

@ -15,9 +15,14 @@ export const InputFieldStyles = `
margin-bottom: 12px;
box-sizing: border-box;
}
.gh-portal-input:focus {
border: 1px solid transparent;
box-shadow: 0 0 0 2px var(--brandcolor);
}
`;
function InputField({name, id, label, type, value, placeholder, disabled, onChange, style}) {
function InputField({name, id, label, type, value, placeholder, disabled, onChange, brandColor}) {
id = id || `input-${name}`;
return (
<>

View file

@ -129,14 +129,16 @@ export default class AccountProfilePage extends React.Component {
value: this.state.name,
placeholder: 'Name...',
label: 'Name',
name: 'name'
name: 'name',
brandColor: this.context.brandColor
},
email: {
type: 'email',
value: this.state.email,
placeholder: 'Email...',
label: 'Email',
name: 'email'
name: 'email',
brandColor: this.context.brandColor
}
};
const field = fields[fieldName];