gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(UI): fix loader styling (#1521)

Browse Source
This commit is contained in:
Shawn Erquhart 2018-07-26 13:43:43 -04:00 committed by GitHub
parent bdfd9443db
commit 0bd0273a79
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
packages/netlify-cms-ui-default/src/Loader.js
View File

@ -103,7 +103,7 @@ export class Loader extends React.Component {
render() { render() {
const { active, className } = this.props; const { active, className } = this.props;
return <div>{this.renderChild()}</div>; return <div className={className}>{this.renderChild()}</div>;
} }
} }
@ -119,33 +119,28 @@ const StyledLoader = styled(Loader)`
&:before, &:before,
&:after { &:after {
content: '';
position: absolute;
top: 0%;
left: 50%;
width: 2.28571429rem; width: 2.28571429rem;
height: 2.28571429rem; height: 2.28571429rem;
margin: 0em 0em 0em -1.14285714rem; margin: 0em 0em 0em -1.14285714rem;
border-radius: 500rem;
border-style: solid;
border-width: 0.2em;
} }
/* Static Shape */ /* Static Shape */
&:before { &:before {
position: absolute; border-color: rgba(0, 0, 0, 0.1);
content: '';
top: 0%;
left: 50%;
border-radius: 500rem;
border: 0.2em solid rgba(0, 0, 0, 0.1);
} }
/* Active Shape */ /* Active Shape */
&:after { &:after {
position: absolute;
content: '';
top: 0%;
left: 50%;
animation: ${animations.loader} 0.6s linear; animation: ${animations.loader} 0.6s linear;
animation-iteration-count: infinite; animation-iteration-count: infinite;
border-radius: 500rem;
border-color: ${colors.active} transparent transparent; border-color: ${colors.active} transparent transparent;
border-style: solid;
border-width: 0.2em;
box-shadow: 0px 0px 0px 1px transparent; box-shadow: 0px 0px 0px 1px transparent;
} }
` `