Skip to content
This repository was archived by the owner on Jan 16, 2022. It is now read-only.
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/components/Loading/Loading.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import React from 'react';

import Logo from '../Logo';
import Logo, { Size } from '../Logo';
import Spinner from '../Spinner';

import { Wrapper, Badge } from './styles';

const Loading: React.FC = () => (
<Wrapper>
<Badge>
<Logo />
<Logo size={Size.Big} />
</Badge>
<Spinner />
</Wrapper>
Expand Down
2 changes: 1 addition & 1 deletion src/components/Loading/__snapshots__/Loading.test.tsx.snap
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`<Loading /> component should render the component in default state 1`] = `"<div class=\\"css-1221txa eimgwje0\\"><div class=\\"css-bxochs eimgwje1\\"><div class=\\"css-1tnu3ib em793ed0\\"></div></div><div class=\\"css-vqrgi e1ag4h8b0\\"><div class=\\"MuiCircularProgress-root-1 MuiCircularProgress-colorPrimary-4 MuiCircularProgress-indeterminate-3 css-15gl0ho e1ag4h8b1\\" style=\\"width:50px;height:50px\\" role=\\"progressbar\\"><svg class=\\"MuiCircularProgress-svg-6\\" viewBox=\\"22 22 44 44\\"><circle class=\\"MuiCircularProgress-circle-7 MuiCircularProgress-circleIndeterminate-9\\" cx=\\"44\\" cy=\\"44\\" r=\\"20.2\\" fill=\\"none\\" stroke-width=\\"3.6\\"></circle></svg></div></div></div>"`;
exports[`<Loading /> component should render the component in default state 1`] = `"<div class=\\"css-1221txa eimgwje0\\"><div class=\\"css-bxochs eimgwje1\\"><div class=\\"css-kt1gx0 em793ed0\\"></div></div><div class=\\"css-vqrgi e1ag4h8b0\\"><div class=\\"MuiCircularProgress-root-1 MuiCircularProgress-colorPrimary-4 MuiCircularProgress-indeterminate-3 css-15gl0ho e1ag4h8b1\\" style=\\"width:50px;height:50px\\" role=\\"progressbar\\"><svg class=\\"MuiCircularProgress-svg-6\\" viewBox=\\"22 22 44 44\\"><circle class=\\"MuiCircularProgress-circle-7 MuiCircularProgress-circleIndeterminate-9\\" cx=\\"44\\" cy=\\"44\\" r=\\"20.2\\" fill=\\"none\\" stroke-width=\\"3.6\\"></circle></svg></div></div></div>"`;
21 changes: 15 additions & 6 deletions src/components/Logo/Logo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,16 @@ import React from 'react';
import styled from 'react-emotion';
import logo from './img/logo.svg';

const StyledLogo = styled('div')`
export enum Size {
Small = '40px',
Big = '90px',
}

interface Props {
size?: Size;
}

const StyledLogo = styled('div')<Props>`
&& {
display: inline-block;
vertical-align: middle;
Expand All @@ -12,11 +21,11 @@ const StyledLogo = styled('div')`
background-size: contain;
background-image: url(${logo});
background-repeat: no-repeat;
width: 40px;
height: 40px;`;

const Logo: React.FC = () => {
return <StyledLogo />;
width: ${({ size }) => size};
height: ${({ size }) => size};
`;
const Logo: React.FC<Props> = ({ size = Size.Small }) => {
return <StyledLogo size={size} />;
};

export default Logo;
2 changes: 1 addition & 1 deletion src/components/Logo/index.ts
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export { default } from './Logo';
export { default, Size } from './Logo';