yadunut/clan-core
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

UI: fix button hover state disabled in disabled tsat

Browse Source
This commit is contained in:
Johannes Kirschbauer
2025-01-03 16:33:47 +01:00
parent 1bc5f4c5f8
commit 96935c61f2
2 changed files with 17 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
pkgs/clan-cli/clan_cli/inventory/__init__.py
View File

@@ -158,7 +158,6 @@ def find_deleted_paths(
for key, p_value in persisted.items(): for key, p_value in persisted.items():
current_path = f"{parent_key}.{key}" if parent_key else key current_path = f"{parent_key}.{key}" if parent_key else key
# Check if this key exists in update # Check if this key exists in update
# breakpoint()
if key not in update: if key not in update:
# Key doesn't exist at all -> entire branch deleted # Key doesn't exist at all -> entire branch deleted
deleted_paths.add(current_path) deleted_paths.add(current_path)

29
pkgs/webview-ui/app/src/components/button/index.tsx
View File

@@ -5,7 +5,9 @@ import { Typography } from "../Typography";
type Variants = "dark" | "light" | "ghost"; type Variants = "dark" | "light" | "ghost";
type Size = "default" | "s"; type Size = "default" | "s";
const variantColors: Record<Variants, string> = { const variantColors: (
disabled: boolean | undefined,
) => Record<Variants, string> = (disabled) => ({
dark: cx( dark: cx(
"border border-solid", "border border-solid",
"border-secondary-950 bg-primary-900 text-white", "border-secondary-950 bg-primary-900 text-white",
@@ -13,9 +15,10 @@ const variantColors: Record<Variants, string> = {
// Hover state // Hover state
// Focus state // Focus state
// Active state // Active state
"hover:border-secondary-900 hover:bg-secondary-700", !disabled && "hover:border-secondary-900 hover:bg-secondary-700",
"focus:border-secondary-900", !disabled && "focus:border-secondary-900",
"active:border-secondary-900 active:shadow-inner-primary-active", !disabled &&
"active:border-secondary-900 active:shadow-inner-primary-active",
// Disabled // Disabled
"disabled:bg-secondary-200 disabled:text-secondary-700 disabled:border-secondary-300", "disabled:bg-secondary-200 disabled:text-secondary-700 disabled:border-secondary-300",
), ),
@@ -26,9 +29,10 @@ const variantColors: Record<Variants, string> = {
// Hover state // Hover state
// Focus state // Focus state
// Active state // Active state
"hover:bg-secondary-200 hover:text-secondary-900", !disabled && "hover:bg-secondary-200 hover:text-secondary-900",
"focus:bg-secondary-200 focus:text-secondary-900", !disabled && "focus:bg-secondary-200 focus:text-secondary-900",
"active:bg-secondary-200 active:text-secondary-950 active:shadow-inner-secondary-active", !disabled &&
"active:bg-secondary-200 active:text-secondary-950 active:shadow-inner-secondary-active",
// Disabled // Disabled
"disabled:bg-secondary-50 disabled:text-secondary-200 disabled:border-secondary-700", "disabled:bg-secondary-50 disabled:text-secondary-200 disabled:border-secondary-700",
), ),
@@ -37,13 +41,14 @@ const variantColors: Record<Variants, string> = {
// Hover state // Hover state
// Focus state // Focus state
// Active state // Active state
"hover:bg-secondary-200 hover:text-secondary-900", !disabled && "hover:bg-secondary-200 hover:text-secondary-900",
"focus:bg-secondary-200 focus:text-secondary-900", !disabled && "focus:bg-secondary-200 focus:text-secondary-900",
"active:bg-secondary-200 active:text-secondary-950 active:shadow-inner-secondary-active", !disabled &&
"active:bg-secondary-200 active:text-secondary-950 active:shadow-inner-secondary-active",
// Disabled // Disabled
"disabled:bg-secondary-50 disabled:text-secondary-200 disabled:border-secondary-700", "disabled:bg-secondary-50 disabled:text-secondary-200 disabled:border-secondary-700",
), ),
}; });
const sizePaddings: Record<Size, string> = { const sizePaddings: Record<Size, string> = {
default: cx("rounded-[0.1875rem] px-4 py-2"), default: cx("rounded-[0.1875rem] px-4 py-2"),
@@ -82,7 +87,7 @@ export const Button = (props: ButtonProps) => {
"p-4", "p-4",
sizePaddings[local.size || "default"], sizePaddings[local.size || "default"],
// Colors // Colors
variantColors[local.variant || "dark"], variantColors(props.disabled)[local.variant || "dark"],
//Font //Font
"leading-none font-semibold", "leading-none font-semibold",
sizeFont[local.size || "default"], sizeFont[local.size || "default"],