diff --git a/index.html b/index.html index e99bf66..92b5738 100644 --- a/index.html +++ b/index.html @@ -6,10 +6,107 @@ tasgrid + + -
+
+
+
Tasgrid
+
+
+
+
+
diff --git a/src/App.tsx b/src/App.tsx index 0268870..cbe000e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -34,6 +34,13 @@ const App: Component = () => { import('./views/PriorityView'); import('./views/MatrixView'); import('./views/SettingsView'); + + // Remove splash screen after high priority work is done + const splash = document.getElementById('splash'); + if (splash) { + splash.style.opacity = '0'; + setTimeout(() => splash.remove(), 500); + } }); }); diff --git a/src/components/FilterBar.tsx b/src/components/FilterBar.tsx index 870e7a6..73c809e 100644 --- a/src/components/FilterBar.tsx +++ b/src/components/FilterBar.tsx @@ -1,5 +1,5 @@ import { type Component, createSignal, For, Show } from "solid-js"; -import { Search, X, Hash, ChevronDown, ArrowUpCircle, Clock } from "lucide-solid"; +import { Search, X, Hash, ArrowUpCircle, Clock } from "lucide-solid"; import { store, setFilter, clearFilter } from "@/store"; import { Button } from "./ui/button"; import { cn } from "@/lib/utils"; @@ -8,7 +8,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger } from "./ui/select"; import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover"; export const FilterBar: Component = () => { - const [isExpanded, setIsExpanded] = createSignal(false); + const [isOpen, setIsOpen] = createSignal(false); const hasActiveFilters = () => { const f = store.filter; @@ -17,227 +17,188 @@ export const FilterBar: Component = () => { const allTags = () => Object.keys(store.tagDefinitions || {}).sort(); - const FilterControls: Component<{ class?: string }> = (props) => ( -
- {/* Main Search */} -
- - setFilter({ query: e.currentTarget.value })} - class="bg-transparent border-none focus:ring-0 text-sm flex-1 md:w-40 h-8 outline-none placeholder:text-muted-foreground/50 min-w-0" - autofocus - /> -
- - {/* Priority Range */} -
- Priority -
- - - - -
-
- - {/* Urgency Range */} -
- Urgency -
- - - - -
-
- - {/* Tags */} -
- -
- - - - - {(tag) => ( - { - e.stopPropagation(); - setFilter({ tags: store.filter.tags.filter(t => t !== tag) }); - }} - > - {tag} - - - )} - - 0}> - - -
-
- - {/* Actions for Desktop */} - - - {/* Clear All for Mobile */} -
- -
-
- ); - return ( -
- {/* Desktop View: Inline expansion */} - + + + {/* Header */} +
+

+ + Filters & Search +

+
+ + + + +
+
- {/* Mobile View: Popover */} -
- - - - Filter - {hasActiveFilters() && ( -
- )} - - - - - -
+ {/* Controls Grid */} +
+ {/* Search Input */} +
+
+ + { + if (el) setTimeout(() => el.focus(), 50); + }} + type="text" + placeholder="Search tasks, descriptions, tags..." + value={store.filter.query} + onInput={(e) => setFilter({ query: e.currentTarget.value })} + class="w-full bg-muted/30 border border-border/50 rounded-xl pl-10 pr-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-primary/20 focus:border-primary/40 transition-all placeholder:text-muted-foreground/30" + /> +
+
+ +
+ {/* Priority Range */} +
+ +
+ +
+ +
+
+ + {/* Urgency Range */} +
+ +
+ +
+ +
+
+
+ + {/* Tags Multi-select */} +
+ +
+ + {(tag) => ( + setFilter({ tags: store.filter.tags.filter(t => t !== tag) })} + > + + {tag} + + + )} + + +
+
+
+ +
); }; diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 95c1e76..cb5b480 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -64,11 +64,9 @@ export const Layout: Component = (props) => { {/* Main Content Area */}
-
+
-
- -
+ {props.children} diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx index 0e80735..7083aee 100644 --- a/src/components/Navigation.tsx +++ b/src/components/Navigation.tsx @@ -1,4 +1,4 @@ -import { type Component, For } from "solid-js"; +import { type Component, For, Show } from "solid-js"; import { LayoutDashboard, ListTodo, Settings, Clock, ArrowUpCircle, PanelLeftClose } from "lucide-solid"; import { cn } from "@/lib/utils"; import { Button } from "./ui/button"; @@ -57,19 +57,28 @@ export const Sidebar: Component<{ )} >
-

Tasgrid

+

+ Tasgrid +

{/* Close Button - Only visible when Locked (to collapse) or Peeking (manual close) */} - + + +