Dicken/LaunchPad
1
0
Fork 0
generated from Dicken/dickendock
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

round23: Startseite kompakter, Theme-Button entfernt, echte Bildverifikation fuer Favicon-Auswahl, Tooltip-Portal, wortbasierte interaktive Favicon-Vorschlaege

Browse Source
This commit is contained in:
Dicken
2026-07-24 00:26:08 +02:00
parent b098007742
commit d87885f16f
7 changed files with 252 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
apps/frontend/src/routes/HomePage.tsx
View File

@@ -3,14 +3,13 @@ import { useMutation, useQueryClient } from "@tanstack/react-query";
import { Link } from "@tanstack/react-router";
import { SearchInput, StatusBadge, ResultsList, FavoritesBar, Favicon, Button } from "@launchpad/ui";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faGear, faSun, faMoon, faPlus } from "@fortawesome/free-solid-svg-icons";
import { faGear, faPlus } from "@fortawesome/free-solid-svg-icons";
import { rankServices, type SearchResult } from "@launchpad/shared";
import { useServices } from "../hooks/useServices.js";
import { useBookmarks } from "../hooks/useBookmarks.js";
import { useDevices } from "../hooks/useDevices.js";
import { useSettings } from "../hooks/useSettings.js";
import { useBackendHealth } from "../hooks/useBackendHealth.js";
import { useTheme } from "../hooks/useTheme.js";
import { useCategories } from "../hooks/useCategories.js";
import { useRecentVisits, recordVisit } from "../hooks/useRecentVisits.js";
import { useReadLater } from "../hooks/useReadLater.js";
@@ -116,7 +115,6 @@ function ReadLaterBox() {
}
export function HomePage() {
const [theme, toggleTheme] = useTheme();
const [query, setQuery] = useState("");
const [selectedIndex, setSelectedIndex] = useState(0);
const [resultsVisible, setResultsVisible] = useState(false);
@@ -286,14 +284,6 @@ export function HomePage() {
>
<FontAwesomeIcon icon={faGear} />
</Link>
<button
onClick={toggleTheme}
aria-label="Theme wechseln"
className="rounded-full border border-black/10 p-2 text-black/60 transition-colors
hover:bg-black/5 dark:border-white/10 dark:text-white/60 dark:hover:bg-white/5"
>
<FontAwesomeIcon icon={theme === "dark" ? faSun : faMoon} />
</button>
</div>
{/* Kopfbereich: Titel, Suchfeld, Favoriten/Später-lesen/Zuletzt-besucht.
@@ -334,7 +324,7 @@ export function HomePage() {
dark:bg-white/[0.02]"
>
{hasFavorites ? (
<div className="flex flex-col gap-3 p-3">
<div className="flex flex-col gap-2 p-2.5">
{favoriteServices.length > 0 ? (
<FavoritesBar
items={favoriteServices}
@@ -363,7 +353,7 @@ export function HomePage() {
) : null}
{recentVisits && recentVisits.length > 0 ? (
<div className="p-3">
<div className="p-2.5">
<FavoritesBar
items={recentVisits}
label="Zuletzt besucht"
@@ -376,7 +366,7 @@ export function HomePage() {
</div>
) : null}
<div className="p-3">
<div className="p-2.5">
<div className="mb-2.5 flex items-center justify-between gap-2">
<span className="text-xs font-medium uppercase tracking-wide text-black/35 dark:text-white/35">
Später lesen
@@ -384,17 +374,17 @@ export function HomePage() {
<ReadLaterBox />
</div>
{hasReadLaterChips ? (
<div className="flex flex-wrap gap-2">
<div className="flex flex-wrap gap-1.5">
{readLaterItems!.slice(0, readLaterLimit).map((item) => (
<button
key={item.id}
onClick={() => window.open(item.url, "_blank", "noopener,noreferrer")}
title={item.displayName}
className="group flex w-14 flex-col items-center gap-1 rounded-xl p-1
className="group flex w-12 flex-col items-center gap-0.5 rounded-lg p-1
transition-colors hover:bg-black/[0.04] dark:hover:bg-white/[0.06]"
>
<span
className="flex h-9 w-9 items-center justify-center rounded-xl border
className="flex h-8 w-8 items-center justify-center rounded-lg border
border-black/10 bg-white/80 shadow-sm transition-transform
group-hover:scale-105 dark:border-white/10 dark:bg-white/5"
>