1
0
mirror of https://github.com/upscayl/upscayl.git synced 2024-09-24 19:38:22 +02:00
upscayl/renderer/components/settings-tab/ThemeSelect.tsx
2023-08-30 13:29:39 +05:30

52 lines
1.8 KiB
TypeScript

import React from "react";
export function ThemeSelect() {
const availableThemes = [
{ label: "upscayl", value: "upscayl" },
{ label: "light", value: "light" },
{ label: "dark", value: "dark" },
{ label: "cupcake", value: "cupcake" },
{ label: "bumblebee", value: "bumblebee" },
{ label: "emerald", value: "emerald" },
{ label: "corporate", value: "corporate" },
{ label: "synthwave", value: "synthwave" },
{ label: "retro", value: "retro" },
{ label: "cyberpunk", value: "cyberpunk" },
{ label: "valentine", value: "valentine" },
{ label: "halloween", value: "halloween" },
{ label: "garden", value: "garden" },
{ label: "forest", value: "forest" },
{ label: "aqua", value: "aqua" },
{ label: "lofi", value: "lofi" },
{ label: "pastel", value: "pastel" },
{ label: "fantasy", value: "fantasy" },
{ label: "wireframe", value: "wireframe" },
{ label: "black", value: "black" },
{ label: "luxury", value: "luxury" },
{ label: "dracula", value: "dracula" },
{ label: "cmyk", value: "cmyk" },
{ label: "autumn", value: "autumn" },
{ label: "business", value: "business" },
{ label: "acid", value: "acid" },
{ label: "lemonade", value: "lemonade" },
{ label: "night", value: "night" },
{ label: "coffee", value: "coffee" },
{ label: "winter", value: "winter" },
];
return (
<div className="flex flex-col gap-2">
<p className="text-sm font-medium">UPSCAYL THEME</p>
<select data-choose-theme className="select-primary select">
<option value="upscayl">Default</option>
{availableThemes.map((theme) => {
return (
<option value={theme.value} key={theme.value}>
{theme.label.toLocaleUpperCase()}
</option>
);
})}
</select>
</div>
);
}