eduvia/workavia-drive
11
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

New Drive UI initial version

Browse Source
This commit is contained in:
Romaric Mourgues
2023-03-27 18:30:36 +02:00
parent fcb0f993fe
commit 42420df02d
261 changed files with 1496 additions and 16604 deletions
Download Patch File Download Diff File Expand all files Collapse all files
twake/frontend/src/app/atoms/avatar/index.tsx
+1 -1
View File
@@ -15,7 +15,7 @@ interface AvatarProps extends React.InputHTMLAttributes<HTMLInputElement> {
nogradient?: boolean;
}
const sizes = { xl: 24, lg: 14, md: 11, sm: 9, xs: 6 };
const sizes = { xl: 24, lg: 14, md: 10, sm: 9, xs: 6 };
const fontSizes = { xl: '2xl', lg: '2xl', md: 'lg', sm: 'md', xs: 'sm' };
export const getGradient = (name: string) => {
twake/frontend/src/app/atoms/button/button.tsx
+10 -6
View File
@@ -3,7 +3,7 @@ import React from 'react';
import _ from 'lodash';
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
theme?: 'primary' | 'secondary' | 'danger' | 'default' | 'outline' | 'dark';
theme?: 'primary' | 'secondary' | 'danger' | 'default' | 'outline' | 'dark' | 'white';
size?: 'md' | 'lg' | 'sm';
icon?: (props: any) => JSX.Element;
iconSize?: 'md' | 'lg';
@@ -19,18 +19,22 @@ export const Button = (props: ButtonProps) => {
if (props.theme === 'secondary')
className =
'text-blue-500 bg-blue-100 hover:bg-blue-200 active:bg-blue-300 border-transparent ';
'text-blue-500 bg-blue-500 hover:bg-opacity-30 active:bg-opacity-50 bg-opacity-25 border-transparent ';
if (props.theme === 'danger')
className = 'text-white bg-rose-500 hover:bg-rose-600 active:bg-rose-700 border-transparent ';
if (props.theme === 'default')
className =
'text-black dark:text-white bg-white dark:bg-zinc-800 dark:hover:bg-zinc-700 dark:active:bg-zinc-900 hover:bg-gray-50 active:bg-gray-200 border-gray-300';
'text-black dark:text-white bg-white dark:bg-zinc-800 dark:hover:bg-zinc-700 dark:active:bg-zinc-900 hover:bg-zinc-50 active:bg-zinc-200 border-zinc-300';
if (props.theme === 'white')
className =
'text-black dark:text-white dark:hover:bg-zinc-700 dark:active:bg-zinc-900 hover:bg-zinc-50 active:bg-zinc-200 border-transparent';
if (props.theme === 'outline')
className =
'text-blue-500 bg-white dark:bg-zinc-800 dark:hover:bg-zinc-700 dark:active:bg-zinc-900 hover:bg-gray-50 active:bg-gray-200 border-blue-500';
'text-blue-500 bg-white dark:bg-zinc-800 dark:hover:bg-zinc-700 dark:active:bg-zinc-900 hover:bg-zinc-50 active:bg-zinc-200 border-blue-500';
if (props.theme === 'dark')
className =
@@ -38,12 +42,12 @@ export const Button = (props: ButtonProps) => {
if (disabled) className += ' opacity-50 pointer-events-none';
if (props.size === 'lg') className = className + ' text-lg h-11';
if (props.size === 'lg') className = className + ' text-lg h-10';
else if (props.size === 'sm') className = className + ' text-sm h-7 px-3';
else className = className + ' text-base h-9';
if (!props.children) {
if (props.size === 'lg') className = className + ' w-11 !p-0 justify-center';
if (props.size === 'lg') className = className + ' w-10 !p-0 justify-center';
else if (props.size === 'sm') className = className + ' w-7 !p-0 justify-center';
else className = className + ' w-9 !p-0 justify-center';
}
twake/frontend/src/app/atoms/input/input-text.tsx
+3 -3
View File
@@ -20,13 +20,13 @@ interface InputProps
}
const baseInputClassName =
'tw-input block w-full rounded-md focus:ring-1 focus:ring-blue-500 z-0 focus:z-10 dark:text-white text-black ';
'tw-input block w-full rounded-md focus:ring-1 focus:ring-blue-500 z-0 focus:z-10 dark:text-white text-black text-base ';
export const defaultInputClassName = (theme: 'plain' | 'outline' = 'plain') => {
return (
baseInputClassName +
(theme === 'plain'
? 'bg-zinc-200 border-zinc-200 dark:bg-zinc-800 dark:border-zinc-800'
? 'bg-zinc-100 border-zinc-100 dark:bg-zinc-800 dark:border-zinc-800'
: 'bg-zinc-50 border-zinc-300 dark:bg-zinc-800 dark:border-zinc-700')
);
};
@@ -47,7 +47,7 @@ export const Input = (props: InputProps) => {
inputClassName = inputClassName + (props.disabled ? ' opacity-75' : '');
if (!props.multiline) {
if (props.size === 'lg') inputClassName = inputClassName + ' h-11';
if (props.size === 'lg') inputClassName = inputClassName + ' h-10 pl-10';
else if (props.size === 'sm') inputClassName = inputClassName + ' h-7';
else inputClassName = inputClassName + ' h-9';
}
twake/frontend/src/app/atoms/text/index.tsx
+2 -2
View File
@@ -52,13 +52,13 @@ const Text = (props: TextProps) => {
defaultClassName =
'text-sm font-normal' +
' ' +
(props.noColor ? '' : 'text-zinc-400 dark:text-white dark:opacity-50');
(props.noColor ? '' : 'text-zinc-500 dark:text-white dark:opacity-50');
break;
case 'info-small':
defaultClassName =
'text-xs font-normal' +
' ' +
(props.noColor ? '' : 'text-zinc-400 dark:text-white dark:opacity-50');
(props.noColor ? '' : 'text-zinc-500 dark:text-white dark:opacity-50');
break;
}