use hyprland's animations instead of gtk css

should make things much smoother

.config/ags/config.js

@@ -61,10 +61,7 @@ const Windows = () => [
 ];
 
 const CLOSE_ANIM_TIME = 210; // Longer than actual anim time to make sure widgets animate fully
-const closeWindowDelays = { // For animations
-    'sideright': CLOSE_ANIM_TIME,
-    'sideleft': CLOSE_ANIM_TIME,
-};
+const closeWindowDelays = {}; // For animations
 for(let i = 0; i < (Gdk.Display.get_default()?.get_n_monitors() || 1); i++) {
     closeWindowDelays[`osk${i}`] = CLOSE_ANIM_TIME;
 }

.config/ags/modules/.widgethacks/popupwindow.js

@@ -18,14 +18,17 @@ export default ({
 
         child: Box({
             setup: (self) => {
-                self.hook(App, (self, currentName, visible) => {
-                    if (currentName === name) {
-                        self.toggleClassName(hideClassName, !visible);
-                    }
-                }).keybind("Escape", () => closeEverything());
+                self.keybind("Escape", () => closeEverything());
+                if (showClassName != "" && hideClassName !== "") {
+                    self.hook(App, (self, currentName, visible) => {
+                        if (currentName === name) {
+                            self.toggleClassName(hideClassName, !visible);
+                        }
+                    });
 
-                if (showClassName !== "" && hideClassName !== "")
-                    self.className = `${showClassName} ${hideClassName}`;
+                    if (showClassName !== "" && hideClassName !== "")
+                        self.className = `${showClassName} ${hideClassName}`;
+                }
             },
             child: child,
         }),

.config/ags/modules/sideleft/main.js

@@ -6,7 +6,5 @@ export default () => PopupWindow({
     anchor: ['left', 'top', 'bottom'],
     name: 'sideleft',
     layer: 'overlay',
-    showClassName: 'sideleft-show',
-    hideClassName: 'sideleft-hide',
     child: SidebarLeft(),
 });

.config/ags/modules/sideright/main.js

@@ -6,7 +6,5 @@ export default () => PopupWindow({
     anchor: ['right', 'top', 'bottom'],
     name: 'sideright',
     layer: 'overlay',
-    showClassName: 'sideright-show',
-    hideClassName: 'sideright-hide',
     child: SidebarRight(),
 });

.config/ags/scss/_sidebars.scss

@@ -14,16 +14,6 @@ $sidebar_chat_textboxareaColor: mix($onSurfaceVariant, $surfaceVariant, 40%);
     padding: 1.023rem;
 }
 
-.sideright-show {
-    @include menu_decel;
-}
-
-.sideright-hide {
-    @include menu_accel;
-    margin-right: -30.682rem;
-    // opacity: 0;
-}
-
 .sidebar-left {
     @include menu_decel;
     @include elevation-border;
@@ -34,16 +24,6 @@ $sidebar_chat_textboxareaColor: mix($onSurfaceVariant, $surfaceVariant, 40%);
     padding: 1.023rem;
 }
 
-.sideleft-show {
-    @include menu_decel;
-}
-
-.sideleft-hide {
-    margin-left: -30.682rem;
-    // opacity: 0;
-    @include menu_accel;
-}
-
 .sidebar-group {
     @include normal-rounding;
     @include group-padding;

.config/hypr/hyprland/general.conf

@@ -110,7 +110,8 @@ animations {
     bezier = overshot, 0.05, 0.9, 0.1, 1.1
     bezier = crazyshot, 0.1, 1.5, 0.76, 0.92 
     bezier = hyprnostretch, 0.05, 0.9, 0.1, 1.0
-    bezier = fluent_decel, 0.1, 1, 0, 1
+    bezier = menu_decel, 0.1, 1, 0, 1
+    bezier = menu_accel, 0.38, 0.04, 1, 0.07
     bezier = easeInOutCirc, 0.85, 0, 0.15, 1
     bezier = easeOutCirc, 0, 0.55, 0.45, 1
     bezier = easeOutExpo, 0.16, 1, 0.3, 1
@@ -118,12 +119,18 @@ animations {
     bezier = md2, 0.4, 0, 0.2, 1 # use with .2s duration
     # Animation configs
     animation = windows, 1, 3, md3_decel, popin 60%
+    animation = windowsIn, 1, 3, md3_decel, popin 60%
+    animation = windowsOut, 1, 3, md3_accel, popin 60%
     animation = border, 1, 10, default
     animation = fade, 1, 3, md3_decel
-    animation = layers, 1, 2, md3_decel, slide
-    animation = workspaces, 1, 7, fluent_decel, slide
+    # animation = layers, 1, 2, md3_decel, slide
+    animation = layersIn, 1, 3, menu_decel, slide
+    animation = layersOut, 1, 1.6, menu_accel
+    animation = fadeLayersIn, 1, 3, menu_decel
+    animation = fadeLayersOut, 1, 1.6, menu_accel
+    animation = workspaces, 1, 7, menu_decel, slide
     # animation = workspaces, 1, 2.5, softAcDecel, slide
-    # animation = workspaces, 1, 7, fluent_decel, slidefade 15%
+    # animation = workspaces, 1, 7, menu_decel, slidefade 15%
     # animation = specialWorkspace, 1, 3, md3_decel, slidefadevert 15%
     animation = specialWorkspace, 1, 3, md3_decel, slidevert
 }

.config/hypr/hyprland/rules.conf

@@ -22,10 +22,9 @@ layerrule = noanim, walker
 layerrule = noanim, selection
 layerrule = noanim, overview
 layerrule = noanim, anyrun
-layerrule = noanim, sideleft
-layerrule = noanim, sideright
 layerrule = noanim, indicator.*
 layerrule = noanim, osk
+layerrule = noanim, hyprpicker
 
 layerrule = noanim, noanim
 layerrule = blur, gtk-layer-shell