feat(binto ags): add powermenu widget

devices/binto/config/ags/config.js

@@ -6,6 +6,7 @@ import Pointers from 'file:///home/matt/.nix/devices/wim/config/ags/services/poi
 import AppLauncher from 'file:///home/matt/.nix/devices/wim/config/ags/js/applauncher/main.js';
 import Bar from './js/bar/main.js';
 import { NotifPopups, NotifCenter } from './js/notifications/main.js';
+import Powermenu from 'file:///home/matt/.nix/devices/wim/config/ags/js/powermenu.js';
 
 const scss = App.configDir + '/scss/main.scss';
 const css  = App.configDir + '/style.css';
@@ -25,10 +26,12 @@ export default {
     closeWindowDelay: {
         'applauncher': 500,
         'notification-center': 500,
+        'powermenu': 500,
     },
     windows: [
         AppLauncher(),
         NotifCenter(),
+        Powermenu(),
 
         Bar(),
         NotifPopups(),

devices/binto/config/ags/scss/main.scss

@@ -13,3 +13,4 @@ undershoot {
 @import './widgets/bar';
 @import './widgets/notification';
 @import './widgets/notification-center';
+@import './widgets/powermenu';

devices/binto/config/ags/scss/widgets/powermenu.scss

@@ -0,0 +1,34 @@
+.powermenu {
+  background-color: $bg;
+  color: $fg;
+  padding: 10px;
+  font-family: "MesloLGS NF";
+
+  /* font-family: Iosevka Nerd Font; */
+  font-size: 70px;
+  border: 2px solid $contrast-bg;
+
+  label {
+    min-width: 140px;
+    min-height: 130px;
+  }
+
+  button {
+    margin: 5px 10px;
+    min-width: 80px;
+    transition: all ease .2s;
+    &:hover { background-color: $bg-secondary; }
+    &:active { background-color: $bg-secondary; }
+
+    .content {
+      padding: 0 15px;
+    }
+  }
+  .shutdown { color: $red; }
+  .reboot { color: $magenta; }
+  .logout { color: $yellow; }
+}
+
+.powermenu-clickhandler {
+  background-color: black;
+}