cheatsheet add font size setting and macos like shortcut

dots/.config/quickshell/ii/modules/cheatsheet/CheatsheetKeybinds.qml

@@ -106,6 +106,17 @@ Item {
                                         var result = [];
                                         for (var i = 0; i < keybindSection.modelData.keybinds.length; i++) {
                                             const keybind = keybindSection.modelData.keybinds[i];
+
+                                            if (Config.options.appearance.keybinds.useMacLikeShortcut) {
+
+                                              for (var j = 0; j < keybind.mods.length; j++) {
+                                                  keybind.mods[j] = keySubstitutions[keybind.mods[j]] || keybind.mods[j];
+                                              }
+                                              keybind.mods = [keybind.mods.join(' ') ]
+                                              keybind.mods[0] += !keyBlacklist.includes(keybind.key) && keybind.mods[0].length ? ' ' : ''
+                                              keybind.mods[0] += !keyBlacklist.includes(keybind.key) ? (keySubstitutions[keybind.key] || keybind.key) : ''
+                                            } 
+
                                             result.push({
                                                 "type": "keys",
                                                 "mods": keybind.mods,
@@ -137,17 +148,19 @@ Item {
                                                     delegate: KeyboardKey {
                                                         required property var modelData
                                                         key: keySubstitutions[modelData] || modelData
+                                                        pixelSize: Config.options.appearance.keybinds.pixelSize.key
                                                     }
                                                 }
                                                 StyledText {
                                                     id: keybindPlus
-                                                    visible: !keyBlacklist.includes(modelData.key) && modelData.mods.length > 0
+                                                    visible: !Config.options.appearance.keybinds.useMacLikeShortcut && !keyBlacklist.includes(modelData.key) && modelData.mods.length > 0
                                                     text: "+"
                                                 }
                                                 KeyboardKey {
                                                     id: keybindKey
-                                                    visible: !keyBlacklist.includes(modelData.key)
+                                                    visible: !Config.options.appearance.keybinds.useMacLikeShortcut && !keyBlacklist.includes(modelData.key)
                                                     key: keySubstitutions[modelData.key] || modelData.key
+                                                    pixelSize: Config.options.appearance.keybinds.pixelSize.key
                                                     color: Appearance.colors.colOnLayer0
                                                 }
                                             }
@@ -163,7 +176,8 @@ Item {
                                                 StyledText {
                                                     id: commentText
                                                     anchors.centerIn: parent
-                                                    font.pixelSize: Appearance.font.pixelSize.smaller
+                                                    // font.pixelSize: Appearance.font.pixelSize.smaller
+                                                    font.pixelSize: Config.options.appearance.keybinds.pixelSize.comment
                                                     text: modelData.comment
                                                 }
                                             }

dots/.config/quickshell/ii/modules/common/Config.qml

@@ -130,8 +130,13 @@ Singleton {
                     // 10:  | 11:  | 12:  | 13:  | 14: 󱄛
                     property int superKey: 0
                     property bool useMacSymbol: false
+                    property bool useMacLikeShortcut: false
                     property bool useMouseSymbol: false
                     property bool useFnSymbol: false
+                    property JsonObject pixelSize: JsonObject {
+                      property int key: Appearance.font.pixelSize.smaller
+                      property int comment: Appareance.font.pixelSize.smaller
+                    }
                 }
             }
 

dots/.config/quickshell/ii/modules/common/widgets/KeyboardKey.qml

@@ -11,6 +11,7 @@ Rectangle {
     property real extraBottomBorderWidth: 2
     property color borderColor: Appearance.colors.colOnLayer0
     property real borderRadius: 5
+    property int pixelSize: Appearance.font.pixelSize.smallie
     property color keyColor: Appearance.m3colors.m3surfaceContainerLow
     implicitWidth: keyFace.implicitWidth + borderWidth * 2
     implicitHeight: keyFace.implicitHeight + borderWidth * 2 + extraBottomBorderWidth
@@ -35,7 +36,7 @@ Rectangle {
             id: keyText
             anchors.centerIn: parent
             font.family: Appearance.font.family.monospace
-            font.pixelSize: Appearance.font.pixelSize.smaller
+            font.pixelSize: pixelSize
             text: key
         }
     }

dots/.config/quickshell/ii/modules/settings/AdvancedConfig.qml

@@ -1,6 +1,10 @@
 import QtQuick
+import Quickshell
+import Quickshell.Io
+import QtQuick.Layouts
 import qs.services
 import qs.modules.common
+import qs.modules.common.functions
 import qs.modules.common.widgets
 
 ContentPage {
@@ -90,6 +94,8 @@ ContentPage {
         }
     }
 
+
+
     ContentSection {
         icon: "keyboard"
         title: Translation.tr("Keybinds Cheatsheet")
@@ -108,72 +114,58 @@ ContentPage {
                 options: [
                     {
                         displayName: "󰖳",
-                        icon: "",
                         value: 0
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 3
                     },
                     {
                         displayName: "󰨡",
-                        icon: "",
                         value: 4
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 5
                     },
                     {
                         displayName: "󰣇",
-                        icon: "",
                         value: 7
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 12
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 13
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 11
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 10
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 8
                     },
                     {
                         displayName: "󱄛",
-                        icon: "",
                         value: 14
                     },
                     {
-                       displayName:  "",
+                        displayName:  "",
-                        icon: "",
                         value: 9
                     },
                     {
                         displayName: "",
-                        icon: "",
                         value: 6
                     },
                     {
                         displayName: "󰘳",
-                        icon: "",
                         value: 2
                     },
                 ]
@@ -187,7 +179,11 @@ ContentPage {
             onCheckedChanged: {
                 Config.options.appearance.keybinds.useMacSymbol = checked;
             }
+            StyledToolTip {
+                text: Translation.tr("macOS-style symbols, e.g. 󰘴  for Ctrl, 󰘵  for Alt, 󰘶  for Shift, etc")
+            }
         }
+
         ConfigSwitch {
             buttonIcon: "󱊶"
             text: Translation.tr("Use symbols for function keys")
@@ -195,6 +191,9 @@ ContentPage {
             onCheckedChanged: {
                 Config.options.appearance.keybinds.useFnSymbol = checked;
             }
+            StyledToolTip {
+              text: Translation.tr("Show 󱊷  instead of Escape, 󱊫  for F1, etc to 󱊶  for F12")
+            }
         }
         ConfigSwitch {
             buttonIcon: "󰍽"
@@ -203,6 +202,43 @@ ContentPage {
             onCheckedChanged: {
                 Config.options.appearance.keybinds.useMouseSymbol = checked;
             }
+            StyledToolTip {
+              text: Translation.tr("Replace 󱕐   for \"Scroll ↓\", 󱕑   \"Scroll ↑\", L󰍽   \"LMB\", R󰍽   \"RMB\", 󱕒   \"Scroll ↑/↓\" and Page  for \"Page_↑/↓\"")
+            }
+        }
+        ConfigSwitch {
+            buttonIcon: ""
+            text: Translation.tr("Use macOS shortcut layout")
+            checked: Config.options.appearance.keybinds.useMacLikeShortcut
+            onCheckedChanged: {
+                Config.options.appearance.keybinds.useMacLikeShortcut = checked;
+            }
+            StyledToolTip {
+                text: Translation.tr("Show mods and key in the same keycap, look better with symbols")
+            }
+
+        }
+
+        ConfigSpinBox {
+            // text: Translation.tr("Keycap")
+            text: Translation.tr("Key font size")
+            value: Config.options.appearance.keybinds.pixelSize.key
+            from: Appearance.font.pixelSize.smallest
+            to: Appearance.font.pixelSize.large
+            stepSize: 1
+            onValueChanged: {
+                Config.options.appearance.keybinds.pixelSize.key = value;
+            }
+        }
+        ConfigSpinBox {
+            text: Translation.tr("Comment font size")
+            value: Config.options.appearance.commentbinds.pixelSize.comment
+            from: Appearance.font.pixelSize.smallest
+            to: Appearance.font.pixelSize.large
+            stepSize: 1
+            onValueChanged: {
+                Config.options.appearance.commentbinds.pixelSize.comment = value;
+            }
         }
     }
 }