This repository has been archived on 2022-08-14. You can view files and clone it, but cannot push or open issues or pull requests.
Files
outline/frontend/components/LoadingIndicator/LoadingIndicatorBar.js
Tom Moor 1bef5ddccb Dashboard loading (#142)
* Fixed: Loading indicator never appears
Added: Loading indicator to dashboard when loading first results

* Less assumptions

* Fixes: Image uploads not working

* Fixes #136 - Keyboard shortcuts should work when editor is not focused

* Allow images to be dragged anywhere on document editor

* Fixes #137 - vertical alignment

* Restore shortcuts with editor focus

* Restore 'e' to edit current document
Fixed up ? to open keyboard shortcuts

* wip

* LoadinglistPlaceholder

* WIP

* Refactor

* DRY logic
2017-07-17 21:46:32 -07:00

37 lines
656 B
JavaScript

// @flow
import React from 'react';
import styled, { keyframes } from 'styled-components';
const LoadingIndicatorBar = () => {
return (
<Container>
<Loader />
</Container>
);
};
const loadingFrame = keyframes`
from {margin-left: -100%; z-index:100;}
to {margin-left: 100%; }
`;
const Container = styled.div`
position: fixed;
top: 0;
z-index: 9999;
background-color: #03A9F4;
width: 100%;
animation: ${loadingFrame} 4s ease-in-out infinite;
animation-delay: 250ms;
margin-left: -100%;
`;
const Loader = styled.div`
width: 100%;
height: 2px;
background-color: #03A9F4;
`;
export default LoadingIndicatorBar;