enhancement: all platform layout (#5119)
* enhancement: conditional layout leftpanel for windows * chore: calculate height leftpanel windows * chore: enhance calc left panel height * enhancement minor ui * Update web-app/src/routes/settings/hardware.tsx Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com> --------- Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com>
This commit is contained in:
parent
cfcc99d75f
commit
f812952044
@ -29,7 +29,7 @@
|
||||
"decorations": true,
|
||||
"titleBarStyle": "Overlay",
|
||||
"windowEffects": {
|
||||
"effects": ["fullScreenUI", "mica", "blur", "acrylic"],
|
||||
"effects": ["fullScreenUI", "mica", "tabbed", "blur", "acrylic"],
|
||||
"state": "active",
|
||||
"radius": 8
|
||||
}
|
||||
@ -50,9 +50,7 @@
|
||||
"enable": true,
|
||||
"scope": {
|
||||
"requireLiteralLeadingDot": false,
|
||||
"allow": [
|
||||
"**/*"
|
||||
]
|
||||
"allow": ["**/*"]
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -74,13 +72,7 @@
|
||||
},
|
||||
"bundle": {
|
||||
"active": true,
|
||||
"targets": [
|
||||
"nsis",
|
||||
"app",
|
||||
"dmg",
|
||||
"deb",
|
||||
"appimage"
|
||||
],
|
||||
"targets": ["nsis", "app", "dmg", "deb", "appimage"],
|
||||
"createUpdaterArtifacts": false,
|
||||
"icon": [
|
||||
"icons/32x32.png",
|
||||
@ -117,4 +109,4 @@
|
||||
"signCommand": "powershell -ExecutionPolicy Bypass -File ./sign.ps1 %1"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -102,7 +102,7 @@ const LeftPanel = () => {
|
||||
: 'w-0 absolute -top-100 -left-100 visibility-hidden'
|
||||
)}
|
||||
>
|
||||
<div className="relative h-8">
|
||||
<div className="relative h-10">
|
||||
<button
|
||||
className="absolute top-1/2 right-0 -translate-y-1/2 z-20"
|
||||
onClick={() => setLeftPanel(!open)}
|
||||
@ -111,11 +111,8 @@ const LeftPanel = () => {
|
||||
<IconLayoutSidebar size={18} className="text-left-panel-fg" />
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col justify-between h-[calc(100%-32px)] mt-0">
|
||||
<div className="flex flex-col justify-between h-full">
|
||||
<div className="relative mb-4 mx-1 mt-2">
|
||||
{!IS_MACOS && (
|
||||
<div className="relative top-1.5 mb-4 mx-1 mt-1 w-[calc(100%-32px)] z-50">
|
||||
<IconSearch className="absolute size-4 top-1/2 left-2 -translate-y-1/2 text-left-panel-fg/50" />
|
||||
<input
|
||||
type="text"
|
||||
@ -133,6 +130,31 @@ const LeftPanel = () => {
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col justify-between h-[calc(100%-42px)] mt-0">
|
||||
<div className="flex flex-col justify-between h-full">
|
||||
{IS_MACOS && (
|
||||
<div className="relative mb-4 mx-1 mt-1">
|
||||
<IconSearch className="absolute size-4 top-1/2 left-2 -translate-y-1/2 text-left-panel-fg/50" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder={t('common.search')}
|
||||
className="w-full pl-7 pr-8 py-1 bg-left-panel-fg/10 rounded text-left-panel-fg focus:outline-none focus:ring-1 focus:ring-left-panel-fg/10"
|
||||
value={searchTerm}
|
||||
onChange={(e) => setSearchTerm(e.target.value)}
|
||||
/>
|
||||
{searchTerm && (
|
||||
<button
|
||||
className="absolute right-2 top-1/2 -translate-y-1/2 text-left-panel-fg/70 hover:text-left-panel-fg"
|
||||
onClick={() => setSearchTerm('')}
|
||||
>
|
||||
<IconX size={14} />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="flex flex-col w-full h-full overflow-hidden">
|
||||
<div className="h-full overflow-y-auto overflow-x-hidden">
|
||||
{favoritedThreads.length > 0 && (
|
||||
|
||||
@ -268,8 +268,9 @@ function Hardware() {
|
||||
{hardwareData.cpu?.instructions.join(', ').length > 0 && (
|
||||
<CardItem
|
||||
title="Instructions"
|
||||
column={hardwareData.cpu?.instructions.length > 6}
|
||||
actions={
|
||||
<span className="text-main-view-fg/80">
|
||||
<span className="text-main-view-fg/80 break-words">
|
||||
{hardwareData.cpu?.instructions?.join(', ')}
|
||||
</span>
|
||||
}
|
||||
@ -315,7 +316,8 @@ function Hardware() {
|
||||
<div className="flex items-center gap-2">
|
||||
<Progress
|
||||
value={
|
||||
((hardwareData.ram?.total - hardwareData.ram?.available) /
|
||||
((hardwareData.ram?.total -
|
||||
hardwareData.ram?.available) /
|
||||
hardwareData.ram?.total) *
|
||||
100
|
||||
}
|
||||
@ -323,7 +325,8 @@ function Hardware() {
|
||||
/>
|
||||
<span className="text-main-view-fg/80">
|
||||
{(
|
||||
((hardwareData.ram?.total - hardwareData.ram?.available) /
|
||||
((hardwareData.ram?.total -
|
||||
hardwareData.ram?.available) /
|
||||
hardwareData.ram?.total) *
|
||||
100
|
||||
).toFixed(2)}
|
||||
|
||||
@ -206,7 +206,9 @@ function SystemMonitor() {
|
||||
<span className="font-semibold text-main-view-fg">
|
||||
{gpu.name}
|
||||
</span>
|
||||
<div className="bg-green-500/20">Active</div>
|
||||
<div className="bg-green-500/20 px-2 py-1 rounded-sm">
|
||||
Active
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2 mt-3">
|
||||
<div className="flex justify-between items-center">
|
||||
@ -238,18 +240,7 @@ function SystemMonitor() {
|
||||
((gpu.total_vram - gpu.free_vram) / gpu.total_vram) *
|
||||
100
|
||||
}
|
||||
className={`h-2 w-full ${
|
||||
((gpu.total_vram - gpu.free_vram) / gpu.total_vram) *
|
||||
100 >
|
||||
80
|
||||
? 'bg-red-500/30'
|
||||
: ((gpu.total_vram - gpu.free_vram) /
|
||||
gpu.total_vram) *
|
||||
100 >
|
||||
50
|
||||
? 'bg-yellow-500/30'
|
||||
: 'bg-green-500/30'
|
||||
}`}
|
||||
className="h-2 w-full"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user