diff --git a/tdrive/frontend/public/public/img/grid/calendar.svg b/tdrive/frontend/public/public/img/grid/calendar.svg index 20dca75c3..5f8725ba4 100644 --- a/tdrive/frontend/public/public/img/grid/calendar.svg +++ b/tdrive/frontend/public/public/img/grid/calendar.svg @@ -1,22 +1,23 @@ - - - - - - + + + + + + - - - - - - - - - - - - + + + + + + + + + + + + + diff --git a/tdrive/frontend/public/public/img/grid/contacts.svg b/tdrive/frontend/public/public/img/grid/contacts.svg index 29cda53b3..654859991 100644 --- a/tdrive/frontend/public/public/img/grid/contacts.svg +++ b/tdrive/frontend/public/public/img/grid/contacts.svg @@ -1,27 +1,23 @@ - - - - - - - + + + + + + - - - - - - - - - - - - - - - - + + + + + + + + + + + + + diff --git a/tdrive/frontend/public/public/img/grid/drive.svg b/tdrive/frontend/public/public/img/grid/drive.svg index 61a544b7c..148b94860 100644 --- a/tdrive/frontend/public/public/img/grid/drive.svg +++ b/tdrive/frontend/public/public/img/grid/drive.svg @@ -1,18 +1,24 @@ - - - - - - + + + + + + + - - - - - - - - + + + + + + + + + + + + + diff --git a/tdrive/frontend/public/public/img/grid/mail.svg b/tdrive/frontend/public/public/img/grid/mail.svg index 534c48487..622e2ae78 100644 --- a/tdrive/frontend/public/public/img/grid/mail.svg +++ b/tdrive/frontend/public/public/img/grid/mail.svg @@ -1,22 +1,23 @@ - - - - - - + + + + + + - - - - - - - - - - - - + + + + + + + + + + + + + diff --git a/tdrive/frontend/public/public/img/grid/twake.svg b/tdrive/frontend/public/public/img/grid/twake.svg index ef7f1e662..0824d3b98 100644 --- a/tdrive/frontend/public/public/img/grid/twake.svg +++ b/tdrive/frontend/public/public/img/grid/twake.svg @@ -1,22 +1,28 @@ - - - - - - + + + + + + + + - - - - - - - - - - - - + + + + + + + + + + + + + + + + diff --git a/tdrive/frontend/public/public/img/grid/visio.svg b/tdrive/frontend/public/public/img/grid/visio.svg index a682787ea..7cdfb5370 100644 --- a/tdrive/frontend/public/public/img/grid/visio.svg +++ b/tdrive/frontend/public/public/img/grid/visio.svg @@ -1,23 +1,24 @@ - - - - - - - + + + + + + + - - - - - - - - - - - - + + + + + + + + + + + + + diff --git a/tdrive/frontend/public/public/img/logo/logo-text-black.png b/tdrive/frontend/public/public/img/logo/logo-text-black.png index 5af3c80e6..ac1c2f73e 100644 Binary files a/tdrive/frontend/public/public/img/logo/logo-text-black.png and b/tdrive/frontend/public/public/img/logo/logo-text-black.png differ diff --git a/tdrive/frontend/public/public/img/logo/logo-text-black.svg b/tdrive/frontend/public/public/img/logo/logo-text-black.svg index 07c382341..8cbff67b9 100644 --- a/tdrive/frontend/public/public/img/logo/logo-text-black.svg +++ b/tdrive/frontend/public/public/img/logo/logo-text-black.svg @@ -1,48 +1,55 @@ - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - + + + + + + + + + + + - + - + - + - + - - - - - - - - + + + diff --git a/tdrive/frontend/public/public/img/logo/logo-text-white.png b/tdrive/frontend/public/public/img/logo/logo-text-white.png index c63f39e31..2e3d6f223 100644 Binary files a/tdrive/frontend/public/public/img/logo/logo-text-white.png and b/tdrive/frontend/public/public/img/logo/logo-text-white.png differ diff --git a/tdrive/frontend/public/public/img/logo/logo-text-white.svg b/tdrive/frontend/public/public/img/logo/logo-text-white.svg index a75fbfdf5..b1b685d01 100644 --- a/tdrive/frontend/public/public/img/logo/logo-text-white.svg +++ b/tdrive/frontend/public/public/img/logo/logo-text-white.svg @@ -1,48 +1,55 @@ - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - + + + + + + + + + + + - + - + - + - + - - - - - - - - + + + diff --git a/tdrive/frontend/src/app/atoms/avatar/index.tsx b/tdrive/frontend/src/app/atoms/avatar/index.tsx index ae337dcd2..a8a09efae 100644 --- a/tdrive/frontend/src/app/atoms/avatar/index.tsx +++ b/tdrive/frontend/src/app/atoms/avatar/index.tsx @@ -47,7 +47,7 @@ export default function Avatar(props: AvatarProps) { className += ' border border-gray flex items-center justify-center bg-center bg-cover ' + - (props.nogradient ? ' bg-zinc-100 dark:bg-zinc-800 text-zinc-900 dark:text-white ' : ''); + (props.nogradient ? ' bg-zinc-100 dark:bg-zinc-900 text-zinc-900 dark:text-white ' : ''); const spl_title = avatarTitle.split(' '); diff --git a/tdrive/frontend/src/app/atoms/badge/index.tsx b/tdrive/frontend/src/app/atoms/badge/index.tsx index 87a99175e..cc95afd6a 100644 --- a/tdrive/frontend/src/app/atoms/badge/index.tsx +++ b/tdrive/frontend/src/app/atoms/badge/index.tsx @@ -18,10 +18,10 @@ export const Badge = (props: BadgeProps) => { if (props.theme === 'danger') className = 'text-white bg-rose-500 border-transparent '; if (props.theme === 'default') - className = 'text-black dark:text-white bg-white dark:bg-zinc-800 border-gray-300'; + className = 'text-black dark:text-white bg-white dark:bg-zinc-900 border-gray-300'; if (props.theme === 'outline') - className = 'text-blue-500 bg-white dark:bg-zinc-800 border-blue-500'; + className = 'text-blue-500 bg-white dark:bg-zinc-900 border-blue-500'; if (props.size === 'lg') className = className + ' text-lg h-11'; else if (props.size === 'sm') className = className + ' text-sm h-7 px-3'; diff --git a/tdrive/frontend/src/app/atoms/button/button.tsx b/tdrive/frontend/src/app/atoms/button/button.tsx index 1b16d8f1d..8f8b46133 100644 --- a/tdrive/frontend/src/app/atoms/button/button.tsx +++ b/tdrive/frontend/src/app/atoms/button/button.tsx @@ -28,7 +28,7 @@ export const Button = (props: ButtonProps) => { 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-zinc-50 active:bg-zinc-200 border-zinc-300'; + 'text-black dark:text-white bg-white dark:bg-zinc-900 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 = @@ -36,7 +36,7 @@ export const Button = (props: ButtonProps) => { 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-zinc-50 active:bg-zinc-200 border-blue-500'; + 'text-blue-500 bg-white dark:bg-zinc-900 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 = diff --git a/tdrive/frontend/src/app/atoms/input/input-text.tsx b/tdrive/frontend/src/app/atoms/input/input-text.tsx index a9cab85dc..41d787535 100644 --- a/tdrive/frontend/src/app/atoms/input/input-text.tsx +++ b/tdrive/frontend/src/app/atoms/input/input-text.tsx @@ -27,10 +27,10 @@ const baseTextClassName = ' dark:text-white text-black '; export const defaultInputClassName = (theme: ThemeName = 'plain') => { const themeClasses = { - 'plain': 'bg-zinc-100 border-zinc-100 dark:bg-zinc-800 dark:border-zinc-800' + baseTextClassName, - 'blue': 'bg-zinc-100 border-zinc-100 dark:bg-zinc-800 dark:border-zinc-800 text-blue-700 dark:text-blue-500', + 'plain': 'bg-zinc-100 border-zinc-100 dark:bg-zinc-900 dark:border-zinc-800' + baseTextClassName, + 'blue': 'bg-zinc-100 border-zinc-100 dark:bg-zinc-900 dark:border-zinc-800 text-blue-700 dark:text-blue-500', 'rose': 'text-rose-500 bg-rose-100 dark:text-rose-300 dark:bg-rose-900 border-rose-500', - 'outline': 'bg-zinc-50 border-zinc-300 dark:bg-zinc-800 dark:border-zinc-700' + baseTextClassName, + 'outline': 'bg-zinc-50 border-zinc-300 dark:bg-zinc-900 dark:border-zinc-700' + baseTextClassName, }; return ( baseInputClassName + diff --git a/tdrive/frontend/src/app/components/auto-complete/auto-complete.tsx b/tdrive/frontend/src/app/components/auto-complete/auto-complete.tsx index 08591cddc..ce2887065 100644 --- a/tdrive/frontend/src/app/components/auto-complete/auto-complete.tsx +++ b/tdrive/frontend/src/app/components/auto-complete/auto-complete.tsx @@ -367,7 +367,7 @@ export default class AutoComplete extends Component { {!this.props.hideResult && this.state.currentList.length > 0 ? (
(this.original_menu = node)} className={ - 'menu-list ' + (this.props.withFrame ? 'as_frame text-black bg-white dark:bg-zinc-800 dark:text-white rounded-lg ' : '') + this.props.animationClass + 'menu-list ' + (this.props.withFrame ? 'as_frame text-black bg-white dark:bg-zinc-900 dark:text-white rounded-lg ' : '') + this.props.animationClass } > {(this.props.menu || []) @@ -81,7 +81,12 @@ export default class MenuComponent extends React.Component { this.hoverMenu(item.ref, item); }} > - {item.text} + {item.icon && ( +
+ {typeof item.icon === 'string' ? : item.icon} +
+ )} +
{item.text}
); } else if (item.type == 'react-element') { diff --git a/tdrive/frontend/src/app/components/menus/menu.scss b/tdrive/frontend/src/app/components/menus/menu.scss index f1466eff4..0c3e478c0 100755 --- a/tdrive/frontend/src/app/components/menus/menu.scss +++ b/tdrive/frontend/src/app/components/menus/menu.scss @@ -45,13 +45,17 @@ font-size: 12px; font-weight: 500; margin: 8px 16px; - color: var(--grey-dark); + display: flex; + + .icon { + color: var(--grey-dark); + } } .menu-custom { font-size: 12px; font-weight: 500; - margin: 8px 8px; + margin: 0.875rem 0.625rem; padding: 0 8px; .menu-cancel-margin, diff --git a/tdrive/frontend/src/app/components/menus/menus-body-layer.jsx b/tdrive/frontend/src/app/components/menus/menus-body-layer.jsx index 0f998ecc1..b721a512c 100755 --- a/tdrive/frontend/src/app/components/menus/menus-body-layer.jsx +++ b/tdrive/frontend/src/app/components/menus/menus-body-layer.jsx @@ -188,8 +188,8 @@ export default class MenusBodyLayer extends React.Component { zIndex: 1050, position: 'absolute', transform: item.positionType === 'bottom' ? '' : 'translateY(-50%)', - left: item.position.x, - top: item.position.y, + left: item.position.x - 140, + top: item.position.y + 2, marginTop: item.position.marginTop, marginLeft: item.position.marginLeft, }} diff --git a/tdrive/frontend/src/app/views/client/body/drive/components/access-level-dropdown.stories.tsx b/tdrive/frontend/src/app/views/client/body/drive/components/access-level-dropdown.stories.tsx index df48f5911..7f9c76cff 100644 --- a/tdrive/frontend/src/app/views/client/body/drive/components/access-level-dropdown.stories.tsx +++ b/tdrive/frontend/src/app/views/client/body/drive/components/access-level-dropdown.stories.tsx @@ -59,7 +59,7 @@ export const EndOfInputBox = {
diff --git a/tdrive/frontend/src/app/views/client/body/drive/modals/create/index.tsx b/tdrive/frontend/src/app/views/client/body/drive/modals/create/index.tsx index 64c13379a..c3a3bbc5f 100644 --- a/tdrive/frontend/src/app/views/client/body/drive/modals/create/index.tsx +++ b/tdrive/frontend/src/app/views/client/body/drive/modals/create/index.tsx @@ -175,7 +175,7 @@ const CreateModalOption = (props: { icon: ReactNode; text: string; onClick: () = return (
{props.icon}
diff --git a/tdrive/frontend/src/app/views/client/body/drive/modals/update-access/internal-users-access.tsx b/tdrive/frontend/src/app/views/client/body/drive/modals/update-access/internal-users-access.tsx index 043caa7e4..f798fbc23 100644 --- a/tdrive/frontend/src/app/views/client/body/drive/modals/update-access/internal-users-access.tsx +++ b/tdrive/frontend/src/app/views/client/body/drive/modals/update-access/internal-users-access.tsx @@ -119,7 +119,7 @@ export const InternalUsersAccessManager = ({
)} {!loading && resultFooterText && <> -
+
{resultFooterText}
} diff --git a/tdrive/frontend/src/app/views/client/body/drive/modals/upload/index.tsx b/tdrive/frontend/src/app/views/client/body/drive/modals/upload/index.tsx index e0fe0ecc4..34b63cbae 100644 --- a/tdrive/frontend/src/app/views/client/body/drive/modals/upload/index.tsx +++ b/tdrive/frontend/src/app/views/client/body/drive/modals/upload/index.tsx @@ -99,7 +99,7 @@ const CreateModalOption = (props: { icon: ReactNode; text: string; onClick: () = return (
{props.icon}
diff --git a/tdrive/frontend/src/app/views/client/body/drive/shared.tsx b/tdrive/frontend/src/app/views/client/body/drive/shared.tsx index 8c9f9af16..a00dc7aab 100755 --- a/tdrive/frontend/src/app/views/client/body/drive/shared.tsx +++ b/tdrive/frontend/src/app/views/client/body/drive/shared.tsx @@ -141,7 +141,7 @@ const AccessChecker = ({ return (
-
+
You don't have access to this document or folder.
The public link you are using may be invalid or expired. diff --git a/tdrive/frontend/src/app/views/client/common/account.tsx b/tdrive/frontend/src/app/views/client/common/account.tsx index a2314bd1b..62e9d93ae 100644 --- a/tdrive/frontend/src/app/views/client/common/account.tsx +++ b/tdrive/frontend/src/app/views/client/common/account.tsx @@ -1,5 +1,4 @@ import Avatar from '@atoms/avatar'; -import { Base, Info } from '@atoms/text'; import Menu from '@components/menus/menu'; import LoginService from '@features/auth/login-service'; import { useCurrentUser } from '@features/users/hooks/use-current-user'; @@ -21,6 +20,18 @@ export default ({ sidebar }: { sidebar?: boolean }): JSX.Element => { className="flex flex-row items-center max-w-xs cursor-pointer" position="bottom" menu={[ + // user name / email + { + type: 'text', + text: currentUserService.getFullName(user), + }, + { + type: 'text', + text: user.email, + icon: 'envelope-info', + hide: !FeatureTogglesService.isActiveFeatureName(FeatureNames.COMPANY_DISPLAY_EMAIL), + }, + { type: 'separator' }, { type: 'menu', icon: 'user', @@ -47,19 +58,6 @@ export default ({ sidebar }: { sidebar?: boolean }): JSX.Element => { avatar={user.thumbnail} title={currentUserService.getFullName(user)} /> -
- - {currentUserService.getFullName(user)} - - - { !FeatureTogglesService.isActiveFeatureName(FeatureNames.COMPANY_DISPLAY_EMAIL) && ( - - {user.email} - - )} -
); }; diff --git a/tdrive/frontend/src/app/views/client/common/app-grid.tsx b/tdrive/frontend/src/app/views/client/common/app-grid.tsx index 5114f8880..9d83c1fc1 100644 --- a/tdrive/frontend/src/app/views/client/common/app-grid.tsx +++ b/tdrive/frontend/src/app/views/client/common/app-grid.tsx @@ -27,10 +27,13 @@ export default ({ className }: { className?: string }): JSX.Element => { target="_blank" rel="noreferrer" href={app.url} - className="inline-block flex flex-col items-center justify-center cursor-pointer hover:bg-zinc-100 dark:hover:bg-zinc-900 rounded-md p-2 pb-1" + className="inline-block flex flex-col items-center justify-center cursor-pointer hover:bg-zinc-100 dark:hover:bg-zinc-800 rounded-md p-2 pb-1" > - - {app.name} + + {app.name} ); })} diff --git a/tdrive/frontend/src/app/views/client/common/disk-usage.tsx b/tdrive/frontend/src/app/views/client/common/disk-usage.tsx index 6f2128b0c..18550e325 100644 --- a/tdrive/frontend/src/app/views/client/common/disk-usage.tsx +++ b/tdrive/frontend/src/app/views/client/common/disk-usage.tsx @@ -35,7 +35,7 @@ const DiskUsage = () => { return ( <> {FeatureTogglesService.isActiveFeatureName(FeatureNames.COMPANY_USER_QUOTA) && ( -
+
{used > 90 && ( @@ -62,7 +62,7 @@ const DiskUsage = () => {
)} {!FeatureTogglesService.isActiveFeatureName(FeatureNames.COMPANY_USER_QUOTA) && ( -
+
{formatBytesToInt(usedBytes)} diff --git a/tdrive/frontend/src/app/views/client/header/index.tsx b/tdrive/frontend/src/app/views/client/header/index.tsx index 82b54aaf5..3c415e649 100644 --- a/tdrive/frontend/src/app/views/client/header/index.tsx +++ b/tdrive/frontend/src/app/views/client/header/index.tsx @@ -7,7 +7,13 @@ import version from '../../../environment/version'; export default ({ openSideMenu }: { openSideMenu: () => void }) => { return ( -
+
void }) => { alt="Tdrive" />
-
+
 v{version.version} diff --git a/tdrive/frontend/src/app/views/client/popup/UserParameter/UserParameter.jsx b/tdrive/frontend/src/app/views/client/popup/UserParameter/UserParameter.jsx index b5bec3f38..5a2abbaeb 100755 --- a/tdrive/frontend/src/app/views/client/popup/UserParameter/UserParameter.jsx +++ b/tdrive/frontend/src/app/views/client/popup/UserParameter/UserParameter.jsx @@ -75,6 +75,7 @@ export default class UserParameter extends Component { +
diff --git a/tdrive/frontend/src/app/views/client/side-bar/index.tsx b/tdrive/frontend/src/app/views/client/side-bar/index.tsx index c333e4ccc..3dbd0b003 100644 --- a/tdrive/frontend/src/app/views/client/side-bar/index.tsx +++ b/tdrive/frontend/src/app/views/client/side-bar/index.tsx @@ -37,7 +37,7 @@ export default () => { ); const active = false; const { sharedWithMe, inTrash, path } = useDriveItem(parentId); - const activeClass = 'bg-zinc-50 dark:bg-zinc-800 !text-blue-500'; + const activeClass = 'bg-zinc-50 dark:bg-zinc-900 !text-blue-500'; let folderType = 'home'; if ((path || [])[0]?.id === 'user_' + user?.id) folderType = 'personal'; if (inTrash) folderType = 'trash'; diff --git a/tdrive/frontend/src/app/views/error/index.tsx b/tdrive/frontend/src/app/views/error/index.tsx index 6bf4a2451..4bf12c05f 100644 --- a/tdrive/frontend/src/app/views/error/index.tsx +++ b/tdrive/frontend/src/app/views/error/index.tsx @@ -22,7 +22,7 @@ export default () => { } return ( -
+
{' '}