style: change cursor to pointer on hover

This commit is contained in:
tux
2025-06-18 04:42:26 +05:30
parent 7936ece744
commit 3e38dab8b9
4 changed files with 8 additions and 4 deletions

View File

@@ -18,6 +18,7 @@ const AppButton = ({ app }: { app: AstalApps.Application }) => {
hide(); hide();
app.launch(); app.launch();
}} }}
cursor={Gdk.Cursor.new_from_name("pointer", null)}
> >
<box spacing={6} halign={Gtk.Align.START} valign={Gtk.Align.CENTER}> <box spacing={6} halign={Gtk.Align.START} valign={Gtk.Align.CENTER}>
<image iconName={app.iconName} iconSize={Gtk.IconSize.LARGE} /> <image iconName={app.iconName} iconSize={Gtk.IconSize.LARGE} />

View File

@@ -1,11 +1,13 @@
import { App } from "astal/gtk4"; import { App } from "astal/gtk4";
import { WINDOW_NAME } from "../app-launcher"; import { WINDOW_NAME } from "../app-launcher";
import { Gdk } from "astal/gtk4";
export const Launcher = () => { export const Launcher = () => {
return ( return (
<button <button
cssClasses={["pill", "launcher"]} cssClasses={["pill", "launcher"]}
onClicked={() => App.toggle_window(WINDOW_NAME)} onClicked={() => App.toggle_window(WINDOW_NAME)}
cursor={Gdk.Cursor.new_from_name("pointer", null)}
> >
<image iconName="nix-symbolic" /> <image iconName="nix-symbolic" />
</button> </button>

View File

@@ -27,12 +27,12 @@ window.Bar {
min-height: 1rem; min-height: 1rem;
min-width: 1rem; min-width: 1rem;
border-radius: calc(list.nth(8px, 1) * 1.5); border-radius: calc(list.nth(8px, 1) * 1.5);
transition: min-width 0.15s ease-out; transition: all 0.15s ease-out;
&:hover { &:hover {
background-color: $fg-color; background: rgba($accent, 0.5);
&.occupied { &.occupied {
background-color: $fg-color; background: rgba($accent, 0.5);
} }
} }

View File

@@ -1,5 +1,5 @@
import { Variable, bind } from "astal"; import { Variable, bind } from "astal";
import { Gtk } from "astal/gtk4"; import { Gdk, Gtk } from "astal/gtk4";
import { ButtonProps } from "astal/gtk4/widget"; import { ButtonProps } from "astal/gtk4/widget";
import AstalHyprland from "gi://AstalHyprland"; import AstalHyprland from "gi://AstalHyprland";
@@ -30,6 +30,7 @@ const Workspace = ({ ws, ...props }: WsButtonProps) => {
valign={Gtk.Align.CENTER} valign={Gtk.Align.CENTER}
halign={Gtk.Align.CENTER} halign={Gtk.Align.CENTER}
onClicked={() => ws.focus()} onClicked={() => ws.focus()}
cursor={Gdk.Cursor.new_from_name("pointer", null)}
{...props} {...props}
/> />
); );