mirror of
https://github.com/spacedriveapp/spacedrive
synced 2024-07-04 12:13:27 +00:00
fix sidebar, ui tweaks
This commit is contained in:
parent
3540471bf6
commit
9e55e100db
|
@ -7,7 +7,7 @@ type Props = {
|
|||
title?: string;
|
||||
};
|
||||
|
||||
const Layout = ({ children, title = 'This is the default title' }: Props) => (
|
||||
const Layout = ({ children, title = 'Spacedrive' }: Props) => (
|
||||
<>
|
||||
<Head>
|
||||
<title>{title}</title>
|
||||
|
@ -21,7 +21,9 @@ const Layout = ({ children, title = 'This is the default title' }: Props) => (
|
|||
</Link>{' '}
|
||||
</nav> */}
|
||||
</header>
|
||||
<div className="flex flex-col items-center p-1 ">{children as any}</div>
|
||||
<div className="flex flex-col items-center h-screen p-1 bg-[#0B0B10] text-white">
|
||||
{children as any}
|
||||
</div>
|
||||
{/* <footer className="bg-gray-100 ">
|
||||
<span>Version 0.1.0</span>
|
||||
</footer> */}
|
||||
|
|
|
@ -5,9 +5,9 @@ import Layout from '../components/Layout';
|
|||
|
||||
const IndexPage = () => (
|
||||
<Layout title="Home | Next.js + TypeScript Example">
|
||||
<h1 className="my-8 text-4xl font-black">A file explorer from the future</h1>
|
||||
<h1 className="my-16 text-6xl font-black">The file explorer from the future</h1>
|
||||
<iframe
|
||||
style={{ border: 'none', borderRadius: 5 }}
|
||||
className="border border-gray-800 rounded-lg shadow-2xl"
|
||||
width={1200}
|
||||
height={600}
|
||||
src="http://localhost:8002?library_id=9068c6ec-cf90-451b-bb30-4174781e7bc6"
|
||||
|
|
|
@ -6,8 +6,9 @@
|
|||
"prep": "pnpm db:gen && pnpm core codegen && pnpm build-packages",
|
||||
"build-packages": "pnpm client build && pnpm ui build && pnpm interface build",
|
||||
"build": "turbo run build",
|
||||
"dev:desktop": "turbo run dev --parallel --filter=@sd/desktop --filter=@sd/client --filter=@sd/ui --filter=@sd/interface",
|
||||
"dev:desktop": "turbo run dev --parallel --filter=@sd/desktop --filter=@sd/client --filter=@sd/ui && pnpm interface dev:build",
|
||||
"dev:ui": "turbo run dev --parallel --filter=@sd/client --filter=@sd/ui --filter=@sd/interface",
|
||||
"dev:landing": "turbo run dev --parallel --filter=@sd/client --filter=@sd/ui --filter=@sd/web --filter=@sd/landing && pnpm interface dev:build",
|
||||
"db:migrate": "pnpm core prisma migrate dev",
|
||||
"db:gen": "pnpm core prisma generate",
|
||||
"lint": "turbo run lint",
|
||||
|
|
|
@ -25,6 +25,7 @@ import { RedirectPage } from './screens/Redirect';
|
|||
import { QueryClient, QueryClientProvider } from 'react-query';
|
||||
import { BaseTransport, ClientProvider, setTransport } from '@sd/client';
|
||||
import { CoreEvent } from '@sd/core';
|
||||
import clsx from 'clsx';
|
||||
|
||||
const queryClient = new QueryClient();
|
||||
|
||||
|
@ -46,19 +47,24 @@ export interface AppProps {
|
|||
function AppLayout() {
|
||||
const appPropsContext = useContext(AppPropsContext);
|
||||
const [isWindowRounded, setIsWindowRounded] = useState(false);
|
||||
const [hasWindowBorder, setHasWindowBorder] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
if (appPropsContext?.platform === 'macOS') {
|
||||
setIsWindowRounded(true);
|
||||
}
|
||||
if (appPropsContext?.platform === 'browser') {
|
||||
setHasWindowBorder(false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div
|
||||
className={
|
||||
'flex flex-row h-screen overflow-hidden text-gray-900 bg-white border border-gray-200 select-none dark:border-gray-500 dark:text-white dark:bg-gray-650' +
|
||||
(isWindowRounded ? ' rounded-xl' : '')
|
||||
}
|
||||
className={clsx(
|
||||
'flex flex-row h-screen overflow-hidden text-gray-900 bg-white select-none dark:text-white dark:bg-gray-650',
|
||||
isWindowRounded && 'rounded-xl',
|
||||
hasWindowBorder && 'border border-gray-200 dark:border-gray-500'
|
||||
)}
|
||||
>
|
||||
<Sidebar />
|
||||
<div className="flex flex-col w-full min-h-full">
|
||||
|
|
File diff suppressed because one or more lines are too long
Binary file not shown.
0
packages/interface/src/components/file/Icon.tsx
Normal file
0
packages/interface/src/components/file/Icon.tsx
Normal file
|
@ -70,7 +70,7 @@ export const Sidebar: React.FC<SidebarProps> = (props) => {
|
|||
];
|
||||
|
||||
return (
|
||||
<div className="flex flex-col w-56 min-h-full px-3 pb-1 overflow-x-hidden overflow-y-scroll border-r border-gray-100 bg-gray-50 dark:bg-gray-850 dark:border-gray-600">
|
||||
<div className="flex flex-col flex-shrink-0 min-h-full px-3 pb-1 overflow-x-hidden overflow-y-scroll border-r border-gray-100 w-46 bg-gray-50 dark:bg-gray-850 dark:border-gray-600">
|
||||
{appPropsContext?.platform === 'macOS' ? (
|
||||
<>
|
||||
<MacOSTrafficLights /> <div className="mt-6" />
|
||||
|
@ -79,7 +79,7 @@ export const Sidebar: React.FC<SidebarProps> = (props) => {
|
|||
<Dropdown
|
||||
buttonProps={{
|
||||
justifyLeft: true,
|
||||
className: `flex mb-1 shadow-xs rounded flex-shrink-0 w-[175px]
|
||||
className: `flex mb-1 mt-1 shadow-xs rounded flex-shrink-0 w-[175px]
|
||||
!bg-gray-50
|
||||
border-gray-150
|
||||
hover:!bg-gray-1000
|
||||
|
|
|
@ -33,23 +33,10 @@ export const OverviewScreen: React.FC<{}> = (props) => {
|
|||
<div data-tauri-drag-region className="flex flex-shrink-0 w-full h-7" />
|
||||
<div className="flex flex-col w-full h-screen px-5 pb-3 overflow-scroll">
|
||||
<div className="flex items-center justify-center w-full">
|
||||
<div className="flex space-x-2">
|
||||
<div className="flex flex-wrap">
|
||||
<StatItem name="Total capacity" value="26.5" unit="TB" />
|
||||
<StatItem name="Index size" value="103" unit="MB" />
|
||||
<StatItem name="Preview media" value="23.5" unit="GB" />
|
||||
</div>
|
||||
<div className="flex flex-col items-center w-56">
|
||||
{/* <img
|
||||
alt="spacedrive-logo"
|
||||
src="/images/spacedrive_logo.png"
|
||||
className="pointer-events-none w-28 h-28"
|
||||
/> */}
|
||||
{/* <span className="text-lg font-bold heading-1">Spacedrive</span>
|
||||
<span className="mt-0.5 text-sm text-gray-400 mb-5">v1.0.11 (pre-alpha)</span> */}
|
||||
{/* <span className="font-bold text-gray-400 text-md heading-1">Jamie's Library</span>
|
||||
<span className="mt-1 text-xs text-gray-500 ">lib-71230e11c869</span> */}
|
||||
</div>
|
||||
<div className="flex space-x-2">
|
||||
<StatItem name="Free space" value="9.2" unit="TB" />
|
||||
<StatItem name="Total at-risk" value="1.5" unit="TB" />
|
||||
<StatItem name="Total backed up" value="25.3" unit="TB" />
|
||||
|
|
Loading…
Reference in a new issue