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

Added retry option to action button

Browse source 
no issue

- Allows updating action buttons to use error states to update background color
This commit is contained in:
Rish 2020-06-10 18:00:45 +05:30
parent 2955c7ee20
commit 9ab1ef3dc3
1 changed files with 12 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
ghost/portal/src/components/common/ActionButton.js
View file

@ -1,6 +1,14 @@
import React from 'react'; import React from 'react';
const Styles = ({brandColor, disabled, style = {}}) => { const Styles = ({brandColor, retry, disabled, style = {}}) => {
let backgroundColor = (brandColor || '#3eb0ef');
if (retry) {
backgroundColor = 'red';
}
if (disabled) {
backgroundColor = 'grey';
}
return { return {
button: { button: {
display: 'inline-block', display: 'inline-block',
@ -17,7 +25,7 @@ const Styles = ({brandColor, disabled, style = {}}) => {
cursor: 'pointer', cursor: 'pointer',
transition: '.4s ease', transition: '.4s ease',
color: '#fff', color: '#fff',
backgroundColor: disabled ? 'grey' : (brandColor || '#3eb0ef'), backgroundColor,
boxShadow: 'none', boxShadow: 'none',
userSelect: 'none', userSelect: 'none',
width: '100%', width: '100%',
@ -26,8 +34,8 @@ const Styles = ({brandColor, disabled, style = {}}) => {
}; };
}; };
function ActionButton({label, onClick, disabled, brandColor, style}) { function ActionButton({label, onClick, disabled, retry, brandColor, style}) {
let Style = Styles({disabled, brandColor, style}); let Style = Styles({disabled, retry, brandColor, style});
return ( return (
<button onClick={e => onClick(e)} style={Style.button} disabled={disabled}> <button onClick={e => onClick(e)} style={Style.button} disabled={disabled}>
{label} {label}