pkg-proxy/internal/server/templates/layout/styles.html

{{define "styles"}}
<style type="text/tailwindcss">
    @layer components {
        .ecosystem-npm { @apply bg-red-100 text-red-700 dark:bg-red-900/50 dark:text-red-300; }
        .ecosystem-cargo { @apply bg-orange-100 text-orange-700 dark:bg-orange-900/50 dark:text-orange-300; }
        .ecosystem-gem { @apply bg-pink-100 text-pink-700 dark:bg-pink-900/50 dark:text-pink-300; }
        .ecosystem-go { @apply bg-cyan-100 text-cyan-700 dark:bg-cyan-900/50 dark:text-cyan-300; }
        .ecosystem-hex { @apply bg-purple-100 text-purple-700 dark:bg-purple-900/50 dark:text-purple-300; }
        .ecosystem-pub { @apply bg-blue-100 text-blue-700 dark:bg-blue-900/50 dark:text-blue-300; }
        .ecosystem-pypi { @apply bg-yellow-100 text-yellow-700 dark:bg-yellow-900/50 dark:text-yellow-300; }
        .ecosystem-maven { @apply bg-red-100 text-red-700 dark:bg-red-900/50 dark:text-red-300; }
        .ecosystem-nuget { @apply bg-indigo-100 text-indigo-700 dark:bg-indigo-900/50 dark:text-indigo-300; }
        .ecosystem-composer { @apply bg-violet-100 text-violet-700 dark:bg-violet-900/50 dark:text-violet-300; }
        .ecosystem-conan { @apply bg-teal-100 text-teal-700 dark:bg-teal-900/50 dark:text-teal-300; }
        .ecosystem-conda { @apply bg-green-100 text-green-700 dark:bg-green-900/50 dark:text-green-300; }
        .ecosystem-cran { @apply bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-300; }
        .ecosystem-oci { @apply bg-sky-100 text-sky-700 dark:bg-sky-900/50 dark:text-sky-300; }
        .ecosystem-deb { @apply bg-red-100 text-red-800 dark:bg-red-900/50 dark:text-red-300; }
        .ecosystem-rpm { @apply bg-amber-100 text-amber-800 dark:bg-amber-900/50 dark:text-amber-300; }
    }
</style>

<script>
    document.getElementById('theme-toggle').addEventListener('click', function() {
        if (document.documentElement.classList.contains('dark')) {
            document.documentElement.classList.remove('dark');
            localStorage.theme = 'light';
        } else {
            document.documentElement.classList.add('dark');
            localStorage.theme = 'dark';
        }
    });
</script>
{{end}}