1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

use flex for centering

Signed-off-by: Sebastian Malton <sebastian@malton.name>
This commit is contained in:
Sebastian Malton 2021-03-31 07:59:51 -04:00
parent 7d242385ab
commit 97b2fc7d31
3 changed files with 7 additions and 9 deletions

View File

@ -46,7 +46,11 @@ export class Sidebar extends React.Component<Props> {
renderCustomResources() {
if (crdStore.isLoading) {
return <Spinner centerHorizontal />;
return (
<div className="flex justify-center">
<Spinner />
</div>
);
}
return Object.entries(crdStore.groups).map(([group, crds]) => {

View File

@ -34,10 +34,6 @@
margin-top: calc(var(--spinner-size) / -2);
}
&.centerHorizontal {
margin-left: 50%;
}
@keyframes rotate {
0% {
transform: rotate(0deg);

View File

@ -6,19 +6,17 @@ import { cssNames } from "../../utils";
export interface SpinnerProps extends React.HTMLProps<any> {
singleColor?: boolean;
center?: boolean;
centerHorizontal?: boolean;
}
export class Spinner extends React.Component<SpinnerProps, {}> {
static defaultProps = {
singleColor: true,
center: false,
centerHorizontal: false,
};
render() {
const { center, singleColor, centerHorizontal, className, ...props } = this.props;
const classNames = cssNames("Spinner", className, { singleColor, center, centerHorizontal });
const { center, singleColor, className, ...props } = this.props;
const classNames = cssNames("Spinner", className, { singleColor, center });
return <div {...props} className={classNames} />;
}