repo: remove confirmed cross-project DockDeck Stitch scratch
GeoIntel release gates / Compile, test, contracts and builds (push) Canceled after 0s
GeoIntel release gates / Python and npm vulnerability policy (push) Canceled after 0s
GeoIntel release gates / GIS image, SBOM and container scan (push) Canceled after 0s
GeoIntel release gates / AI image, SBOM and container scan (push) Canceled after 0s
GeoIntel release gates / Compile, test, contracts and builds (push) Canceled after 0s
GeoIntel release gates / Python and npm vulnerability policy (push) Canceled after 0s
GeoIntel release gates / GIS image, SBOM and container scan (push) Canceled after 0s
GeoIntel release gates / AI image, SBOM and container scan (push) Canceled after 0s
This commit is contained in:
-307
@@ -1,307 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html class="dark" lang="nl"><head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Geist:wght@400;500;600;700;800&display=swap" rel="stylesheet"/>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
background-color: #0b1326;
|
||||
margin: 0;
|
||||
overflow: hidden; /* Prevent scrolling background */
|
||||
}
|
||||
.font-headline { font-family: 'Geist', sans-serif; }
|
||||
.glass-panel {
|
||||
background: rgba(15, 23, 42, 0.6);
|
||||
backdrop-filter: blur(12px);
|
||||
border: 1px solid rgba(30, 41, 59, 0.5);
|
||||
}
|
||||
.active-dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background-color: #4edea3;
|
||||
box-shadow: 0 0 8px #4edea3;
|
||||
}
|
||||
.material-symbols-outlined {
|
||||
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.command-palette-enter {
|
||||
animation: commandPaletteEnter 0.2s ease-out forwards;
|
||||
}
|
||||
@keyframes commandPaletteEnter {
|
||||
from { opacity: 0; transform: scale(0.98) translateY(-10px); }
|
||||
to { opacity: 1; transform: scale(1) translateY(0); }
|
||||
}
|
||||
.pulse-animation {
|
||||
animation: pulse 2s infinite;
|
||||
}
|
||||
@keyframes pulse {
|
||||
0% { transform: scale(1); opacity: 1; }
|
||||
50% { transform: scale(1.2); opacity: 0.5; }
|
||||
100% { transform: scale(1); opacity: 1; }
|
||||
}
|
||||
</style>
|
||||
<script id="tailwind-config">
|
||||
tailwind.config = {
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
extend: {
|
||||
"colors": {
|
||||
"on-surface-variant": "#c7c4d7",
|
||||
"on-surface": "#dbe2fd",
|
||||
"tertiary-container": "#d97721",
|
||||
"surface-dim": "#0b1326",
|
||||
"on-secondary-fixed": "#002114",
|
||||
"on-error": "#690005",
|
||||
"background": "#0b1326",
|
||||
"primary-container": "#8a8cc6",
|
||||
"on-primary-container": "#222457",
|
||||
"inverse-primary": "#585990",
|
||||
"surface-container-lowest": "#060d20",
|
||||
"secondary-fixed-dim": "#4edea3",
|
||||
"tertiary": "#ffb783",
|
||||
"primary-fixed-dim": "#c0c1ff",
|
||||
"surface-container-highest": "#2d3449",
|
||||
"secondary-container": "#00b47d",
|
||||
"on-primary-fixed-variant": "#404176",
|
||||
"surface-container-low": "#131b2e",
|
||||
"on-tertiary-container": "#452000",
|
||||
"on-tertiary-fixed": "#301400",
|
||||
"on-secondary-fixed-variant": "#005236",
|
||||
"error": "#ffb4ab",
|
||||
"primary": "#c0c1ff",
|
||||
"secondary": "#4edea3",
|
||||
"outline-variant": "rgba(30, 41, 59, 0.5)",
|
||||
"tertiary-fixed-dim": "#ffb783",
|
||||
"surface-tint": "#c0c1ff",
|
||||
"tertiary-fixed": "#ffdcc5",
|
||||
"error-container": "#93000a",
|
||||
"surface-container-high": "#222a3e",
|
||||
"primary-fixed": "#e1e0ff",
|
||||
"on-secondary-container": "#003e28",
|
||||
"outline": "#908fa0",
|
||||
"on-primary-fixed": "#131449",
|
||||
"status-offline": "#ffb4ab",
|
||||
"inverse-surface": "#dbe2fd",
|
||||
"secondary-fixed": "#6ffbbe",
|
||||
"on-tertiary-fixed-variant": "#703700",
|
||||
"status-degraded": "#ffb783",
|
||||
"on-background": "#dbe2fd",
|
||||
"surface-glass": "rgba(15, 23, 42, 0.6)",
|
||||
"on-tertiary": "#4f2500",
|
||||
"status-online": "#4edea3",
|
||||
"surface": "#0b1326",
|
||||
"surface-container": "#171f33",
|
||||
"surface-bright": "#31394e",
|
||||
"on-secondary": "#003824",
|
||||
"on-error-container": "#ffdad6",
|
||||
"surface-variant": "#2d3449",
|
||||
"inverse-on-surface": "#283044",
|
||||
"on-primary": "#292b5e"
|
||||
},
|
||||
"borderRadius": {
|
||||
"DEFAULT": "0.25rem",
|
||||
"lg": "0.5rem",
|
||||
"xl": "0.75rem",
|
||||
"full": "9999px"
|
||||
},
|
||||
"spacing": {
|
||||
"gutter": "24px",
|
||||
"margin-desktop": "40px",
|
||||
"stack-lg": "48px",
|
||||
"base": "8px",
|
||||
"margin-mobile": "16px",
|
||||
"stack-md": "24px",
|
||||
"container-max": "1440px",
|
||||
"stack-sm": "12px"
|
||||
},
|
||||
"fontFamily": {
|
||||
"headline-lg-mobile": ["Geist"],
|
||||
"label-md": ["Geist"],
|
||||
"code-sm": ["Geist"],
|
||||
"headline-md": ["Geist"],
|
||||
"display-lg": ["Geist"],
|
||||
"body-lg": ["Inter"],
|
||||
"headline-lg": ["Geist"],
|
||||
"body-md": ["Inter"]
|
||||
},
|
||||
"fontSize": {
|
||||
"headline-lg-mobile": ["24px", {"lineHeight": "32px", "fontWeight": "600"}],
|
||||
"label-md": ["14px", {"lineHeight": "20px", "letterSpacing": "0.02em", "fontWeight": "500"}],
|
||||
"code-sm": ["13px", {"lineHeight": "18px", "fontWeight": "400"}],
|
||||
"headline-md": ["24px", {"lineHeight": "32px", "fontWeight": "500"}],
|
||||
"display-lg": ["48px", {"lineHeight": "56px", "letterSpacing": "-0.02em", "fontWeight": "600"}],
|
||||
"body-lg": ["18px", {"lineHeight": "28px", "fontWeight": "400"}],
|
||||
"headline-lg": ["32px", {"lineHeight": "40px", "letterSpacing": "-0.01em", "fontWeight": "600"}],
|
||||
"body-md": ["16px", {"lineHeight": "24px", "fontWeight": "400"}]
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body class="text-on-surface">
|
||||
<!-- Background Dashboard (Blurred) -->
|
||||
<div class="fixed inset-0 z-0 overflow-hidden pointer-events-none opacity-40 blur-xl">
|
||||
|
||||
<!-- Mock UI Elements in Background -->
|
||||
<div class="p-margin-desktop grid grid-cols-4 gap-gutter max-w-container-max mx-auto">
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
<div class="h-48 glass-panel rounded-xl"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Main Overlay Container -->
|
||||
<div class="fixed inset-0 z-50 flex items-start justify-center pt-32 px-margin-mobile bg-surface-dim/60 backdrop-blur-sm">
|
||||
<!-- Command Palette Wrapper -->
|
||||
<div class="command-palette-enter w-full max-w-[640px] glass-panel rounded-2xl overflow-hidden shadow-2xl ring-1 ring-white/10">
|
||||
<!-- Search Header -->
|
||||
<div class="relative flex items-center p-4 border-b border-outline-variant bg-surface-container-low">
|
||||
<span class="material-symbols-outlined text-primary mr-3 text-2xl" data-icon="search">search</span>
|
||||
<input autofocus="" class="w-full bg-transparent border-none outline-none text-headline-md font-headline-md text-on-surface placeholder-on-surface-variant focus:ring-0" placeholder="Type om te zoeken..." type="text" value="PL"/>
|
||||
<div class="flex gap-2">
|
||||
<span class="px-2 py-1 bg-surface-variant text-[10px] font-bold text-on-surface-variant rounded border border-outline-variant uppercase">ESC</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Scrollable Results Content -->
|
||||
<div class="max-h-[614px] overflow-y-auto scrollbar-hide py-2">
|
||||
<!-- Group: Apps -->
|
||||
<div class="px-3 mb-4">
|
||||
<h3 class="px-3 py-2 text-label-md font-label-md text-primary/70 uppercase tracking-widest flex items-center">
|
||||
<span class="material-symbols-outlined text-sm mr-2" data-icon="apps">apps</span>
|
||||
Apps
|
||||
</h3>
|
||||
<!-- Result Item: Plex -->
|
||||
<div class="group flex items-center justify-between p-3 rounded-xl hover:bg-secondary-container/20 cursor-pointer transition-all duration-200 hover:translate-x-1">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 glass-panel rounded-xl flex items-center justify-center text-primary group-hover:scale-105 transition-transform">
|
||||
<span class="material-symbols-outlined text-3xl" data-icon="movie">movie</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="font-headline text-body-lg text-on-surface">Plex</span>
|
||||
<div class="flex items-center gap-1.5 px-2 py-0.5 rounded-full border border-secondary/20 bg-secondary/10">
|
||||
<div class="active-dot pulse-animation"></div>
|
||||
<span class="text-[10px] font-bold text-secondary uppercase tracking-tight">Online</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-on-surface-variant text-label-md">Container • Media Server</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-3 opacity-0 group-hover:opacity-100 transition-opacity">
|
||||
<span class="text-on-surface-variant text-[11px] font-medium italic">open in nieuw tabblad</span>
|
||||
<span class="material-symbols-outlined text-on-surface-variant text-sm" data-icon="open_in_new">open_in_new</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Result Item: Paperless-ngx -->
|
||||
<div class="group flex items-center justify-between p-3 rounded-xl hover:bg-secondary-container/20 cursor-pointer transition-all duration-200 hover:translate-x-1">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 glass-panel rounded-xl flex items-center justify-center text-primary group-hover:scale-105 transition-transform">
|
||||
<span class="material-symbols-outlined text-3xl" data-icon="description">description</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="font-headline text-body-lg text-on-surface">Paperless-ngx</span>
|
||||
<div class="flex items-center gap-1.5 px-2 py-0.5 rounded-full border border-secondary/20 bg-secondary/10">
|
||||
<div class="active-dot pulse-animation"></div>
|
||||
<span class="text-[10px] font-bold text-secondary uppercase tracking-tight">Online</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-on-surface-variant text-label-md">Document Management System</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-3 opacity-0 group-hover:opacity-100 transition-opacity">
|
||||
<span class="material-symbols-outlined text-on-surface-variant text-sm" data-icon="open_in_new">open_in_new</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Group: Favorieten -->
|
||||
<div class="px-3 mb-4">
|
||||
<h3 class="px-3 py-2 text-label-md font-label-md text-primary/70 uppercase tracking-widest flex items-center">
|
||||
<span class="material-symbols-outlined text-sm mr-2" data-icon="star">star</span>
|
||||
Favorieten
|
||||
</h3>
|
||||
<div class="group flex items-center justify-between p-3 rounded-xl hover:bg-secondary-container/20 cursor-pointer transition-all duration-200 hover:translate-x-1">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 glass-panel rounded-xl flex items-center justify-center text-on-surface group-hover:scale-105 transition-transform">
|
||||
<svg fill="currentColor" height="24" viewbox="0 0 24 24" width="24"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 21.795 24 17.298 24 12c0-6.627-5.373-12-12-12"></path></svg>
|
||||
</div>
|
||||
<div>
|
||||
<span class="font-headline text-body-lg text-on-surface">GitHub</span>
|
||||
<p class="text-on-surface-variant text-label-md">Developer Ecosystem & Repository</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-3 opacity-0 group-hover:opacity-100 transition-opacity">
|
||||
<span class="material-symbols-outlined text-on-surface-variant text-sm" data-icon="open_in_new">open_in_new</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Group: Search Suggestions -->
|
||||
<div class="px-3">
|
||||
<h3 class="px-3 py-2 text-label-md font-label-md text-primary/70 uppercase tracking-widest flex items-center">
|
||||
<span class="material-symbols-outlined text-sm mr-2" data-icon="language">language</span>
|
||||
Google
|
||||
</h3>
|
||||
<div class="group flex items-center justify-between p-3 rounded-xl hover:bg-secondary-container/20 cursor-pointer transition-all duration-200">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="w-12 h-12 glass-panel rounded-xl flex items-center justify-center text-primary group-hover:scale-105 transition-transform">
|
||||
<span class="material-symbols-outlined text-3xl" data-icon="search">search</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="font-headline text-body-lg text-on-surface">Zoek op Google naar <span class="text-secondary">'PL...'</span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 px-2 py-1 bg-surface-container-high rounded text-[10px] font-bold text-on-surface-variant border border-outline-variant">
|
||||
ENTER
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Footer / Shortcuts -->
|
||||
<div class="px-6 py-4 bg-surface-container-low/80 border-t border-outline-variant flex justify-between items-center text-[11px] font-medium text-on-surface-variant uppercase tracking-wider">
|
||||
<div class="flex gap-6">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="px-1.5 py-0.5 bg-surface-variant rounded border border-outline-variant">↑↓</span>
|
||||
<span>Navigeren</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="px-1.5 py-0.5 bg-surface-variant rounded border border-outline-variant">Enter</span>
|
||||
<span>Openen</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="px-1.5 py-0.5 bg-surface-variant rounded border border-outline-variant">Alt + Enter</span>
|
||||
<span>Nieuw Tabblad</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-1">
|
||||
<span class="material-symbols-outlined text-xs" data-icon="bolt">bolt</span>
|
||||
<span>DockDeck QuickLaunch</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Floating Atmosphere Effects -->
|
||||
<script>
|
||||
// Simple logic for micro-interactions
|
||||
document.addEventListener('keydown', (e) => {
|
||||
if(e.key === 'Escape') {
|
||||
// In a real app, this would close the overlay
|
||||
console.log('Escape pressed: Closing Search Overlay');
|
||||
}
|
||||
});
|
||||
|
||||
// Dynamic background particle interaction or similar could go here
|
||||
// For now, we rely on the premium CSS styling and shader.
|
||||
</script>
|
||||
</body></html>
|
||||
Reference in New Issue
Block a user