diff options
| -rw-r--r-- | packages/app/src/pages/layout.tsx | 2 | ||||
| -rw-r--r-- | packages/ui/src/components/icon-button.css | 16 |
2 files changed, 11 insertions, 7 deletions
diff --git a/packages/app/src/pages/layout.tsx b/packages/app/src/pages/layout.tsx index 8fb48fbf1..82a95b533 100644 --- a/packages/app/src/pages/layout.tsx +++ b/packages/app/src/pages/layout.tsx @@ -1287,7 +1287,7 @@ export default function Layout(props: ParentProps) { </div> <div class="shrink-0 w-full pt-3 pb-3 flex flex-col items-center gap-2"> <Tooltip placement={sidebarProps.mobile ? "bottom" : "right"} value="Settings"> - <IconButton icon="settings-gear" variant="ghost" size="large" onClick={command.show} /> + <IconButton disabled icon="settings-gear" variant="ghost" size="large" /> </Tooltip> <Tooltip placement={sidebarProps.mobile ? "bottom" : "right"} value="Help"> <IconButton diff --git a/packages/ui/src/components/icon-button.css b/packages/ui/src/components/icon-button.css index f3f7e1e64..374cd3792 100644 --- a/packages/ui/src/components/icon-button.css +++ b/packages/ui/src/components/icon-button.css @@ -67,6 +67,12 @@ [data-slot="icon-svg"] { color: var(--icon-strong-base); } + + &:disabled { + background-color: var(--icon-strong-disabled); + color: var(--icon-invert-base); + cursor: not-allowed; + } } &[data-variant="ghost"] { @@ -99,6 +105,10 @@ /* color: var(--icon-selected); */ /* } */ } + &:disabled { + color: var(--icon-invert-base); + cursor: not-allowed; + } } &[data-size="normal"] { @@ -129,12 +139,6 @@ letter-spacing: var(--letter-spacing-normal); } - &:disabled { - background-color: var(--icon-strong-disabled); - color: var(--icon-invert-base); - cursor: not-allowed; - } - &:focus { outline: none; } |