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:
parent
94093a2041
commit
e7459437cb
3 changed files with 16 additions and 4 deletions
|
@ -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}} />
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -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 (
|
||||
<>
|
||||
|
|
|
@ -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];
|
||||
|
|
Loading…
Add table
Reference in a new issue