adjust some styling. move the session snapshot to admin settings

This commit is contained in:
legop3
2025-11-20 18:31:28 -05:00
parent ac22aa3f84
commit aa048d7bdc
8 changed files with 43 additions and 20 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+2 -2
View File
@@ -5,8 +5,8 @@
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>webui</title> <title>webui</title>
<script type="module" crossorigin src="/assets/index-JjoB2amU.js"></script> <script type="module" crossorigin src="/assets/index-CzaSKh_t.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-q-OzpN6g.css"> <link rel="stylesheet" crossorigin href="/assets/index-DIvshFK3.css">
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
+1 -1
View File
@@ -4,7 +4,7 @@
"version": "0.0.0", "version": "0.0.0",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "VITE_ROVERD_URL=http://192.168.0.86:8080 vite", "dev": "VITE_ROVERD_URL=https://rover.otter.land vite",
"build": "vite build", "build": "vite build",
"lint": "eslint .", "lint": "eslint .",
"preview": "vite preview" "preview": "vite preview"
+13 -11
View File
@@ -49,16 +49,15 @@ function useLayoutMode() {
function DesktopLayout({ layout }) { function DesktopLayout({ layout }) {
return ( return (
<div className="flex flex-col gap-0.5"> <div className="flex h-full gap-0.5 overflow-hidden">
<section className="grid grid-cols-[minmax(0,1.8fr)_minmax(0,1fr)] gap-0.5"> <div className="flex min-w-0 flex-[1.8] flex-col gap-0.5 overflow-y-auto pr-0.5">
<DriverVideoPanel /> <DriverVideoPanel />
<RightPaneTabs layout={layout} />
</section>
<section className="grid grid-cols-[minmax(0,1fr)_minmax(0,1fr)] gap-0.5">
{/* <AdminPanel /> */}
<LogPanel /> <LogPanel />
<SessionSnapshot /> </div>
</section> <div className="flex min-w-0 flex-1 flex-col gap-0.5 overflow-y-auto">
<RightPaneTabs layout={layout} />
{/* <SessionSnapshot /> */}
</div>
</div> </div>
); );
} }
@@ -106,20 +105,23 @@ function MobileLandscapeLayout() {
function App() { function App() {
const layout = useLayoutMode(); const layout = useLayoutMode();
const isDesktop = layout === 'desktop';
const renderedLayout = const renderedLayout =
layout === 'desktop' isDesktop
? <DesktopLayout layout={layout} /> ? <DesktopLayout layout={layout} />
: layout === 'mobile-landscape' : layout === 'mobile-landscape'
? <MobileLandscapeLayout /> ? <MobileLandscapeLayout />
: <MobilePortraitLayout />; : <MobilePortraitLayout />;
return ( return (
<div className="min-h-screen bg-black text-slate-100"> <div className={`bg-black text-slate-100 ${isDesktop ? 'h-screen overflow-hidden' : 'min-h-screen'}`}>
<SettingsProvider> <SettingsProvider>
<ControlSystemProvider> <ControlSystemProvider>
<KeyboardInputManager /> <KeyboardInputManager />
<GamepadInputManager /> <GamepadInputManager />
<main className="flex w-full flex-col gap-0.5 text-base">{renderedLayout}</main> <main className={`flex w-full flex-col gap-0.5 text-base ${isDesktop ? 'h-full overflow-hidden' : ''}`}>
{renderedLayout}
</main>
<AlertFeed /> <AlertFeed />
<ModeGateOverlay /> <ModeGateOverlay />
</ControlSystemProvider> </ControlSystemProvider>
+2
View File
@@ -5,6 +5,7 @@ import AdminPanel from './AdminPanel.jsx';
import KeymapSettings from './KeymapSettings.jsx'; import KeymapSettings from './KeymapSettings.jsx';
import GamepadMappingSettings from './GamepadMappingSettings.jsx'; import GamepadMappingSettings from './GamepadMappingSettings.jsx';
import Tabs, { Tab, TabList, TabPanel, TabPanels } from './Tabs.jsx'; import Tabs, { Tab, TabList, TabPanel, TabPanels } from './Tabs.jsx';
import SessionSnapshot from './SessionSnapshot.jsx';
const manualTabs = [ const manualTabs = [
{ key: 'start', label: 'Start OI' }, { key: 'start', label: 'Start OI' },
@@ -88,6 +89,7 @@ export default function SettingsPanel() {
</section> </section>
<AuthPanel /> <AuthPanel />
<AdminPanel /> <AdminPanel />
<SessionSnapshot />
</div> </div>
</TabPanel> </TabPanel>
</TabPanels> </TabPanels>
+19
View File
@@ -14,6 +14,25 @@ body {
@apply bg-black text-slate-100; @apply bg-black text-slate-100;
} }
* {
scrollbar-width: thin;
scrollbar-color: #3b82f6 rgba(255, 255, 255, 0.08);
}
*::-webkit-scrollbar {
width: 1px;
height: 1px;
}
*::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.08);
}
*::-webkit-scrollbar-thumb {
background-color: #3b82f6;
border-radius: 9999px;
}
@layer components { @layer components {
.panel { .panel {
@apply bg-black text-white p-0.5; @apply bg-black text-white p-0.5;