LaconicNetwork/vega-frontend-monorepo
3
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

chore: fix large loader dimensions (#1220)

Browse Source
This commit is contained in:
Matthew Russell 2022-09-01 15:00:22 -07:00 committed by GitHub
parent 63b25fc1a6
commit ca11b02aea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
libs/ui-toolkit/src/components/loader/loader.stories.tsx Normal file
View File

@ -0,0 +1,17 @@
import type { Story, Meta } from '@storybook/react';
import type { LoaderProps } from './loader';
import { Loader } from './loader';
export default {
component: Loader,
title: 'Loader',
} as Meta;
const Template: Story<LoaderProps> = (args) => <Loader />;
export const Large = Template.bind({});
export const Small = Template.bind({});
Small.args = {
size: 'small',
};

7
libs/ui-toolkit/src/components/loader/loader.tsx
View File

@ -1,7 +1,7 @@
import classNames from 'classnames';
import { useEffect, useState } from 'react';
interface LoaderProps {
export interface LoaderProps {
size?: 'small' | 'large';
forceTheme?: 'dark' | 'light';
}
@ -21,10 +21,11 @@ export const Loader = ({ size = 'large', forceTheme }: LoaderProps) => {
'dark:bg-white bg-black': !forceTheme,
'bg-white': forceTheme === 'dark',
'bg-black': forceTheme === 'light',
'w-16 h-16': size === 'large',
'w-[10px] h-[10px]': size === 'large',
'w-[5px] h-[5px]': size === 'small',
});
const wrapperClasses = size === 'small' ? 'w-[15px] h-[15px]' : 'w-64 h-64';
const wrapperClasses =
size === 'small' ? 'w-[15px] h-[15px]' : 'w-[50px] h-[50px]';
const items = size === 'small' ? 9 : 16;
return (