Merge pull request #10 from honjow/dev

Fix the margin issue.
hhd-dev · Feb 28, 2024 · e165893 · e165893
2 parents 7fcb556 + 1975772
commit e165893
Show file tree

Hide file tree

Showing 6 changed files with 46 additions and 42 deletions.
diff --git a/.gitignore b/.gitignore
@@ -55,3 +55,4 @@ out/*
 cli/
 cli/*
 cli/decky
+Makefile
diff --git a/src/components/HhdComponent.tsx b/src/components/HhdComponent.tsx
@@ -13,12 +13,11 @@ import HhdDropdown from "./HhdDropdown";
 import HhdModesDropdown from "./HhdModesDropdown";
 import { useUpdateHhdStatePending } from "../hooks/controller";
 import HhdIntSlider from "./HhdIntSlider";
-import HhdDeckyVersion from "./HhdDeckyVersion";
 import ArrowToggleButton from "./ArrowToggleButton";
 import ErrorBoundary from "./ErrorBoundary";
 // import { getLogInfo } from "../backend/utils";
 
-const noop = () => {};
+const noop = () => { };
 
 interface HhdComponentType extends SettingsType {
   renderChild?: any;
@@ -142,18 +141,20 @@ const HhdComponent: VFC<HhdComponentType> = ({
     // toggle component
     const checked = get(state, `${statePath}`, defaultValue);
     return (
-      <ToggleField
-        label={title}
-        checked={Boolean(checked)}
-        onChange={(enabled) => {
-          if (updating) {
-            return;
-          }
-          return updateState(`${statePath}`, enabled);
-        }}
-        disabled={updating}
-        {...otherProps}
-      />
+      <PanelSectionRow>
+        <ToggleField
+          label={title}
+          checked={Boolean(checked)}
+          onChange={(enabled) => {
+            if (updating) {
+              return;
+            }
+            return updateState(`${statePath}`, enabled);
+          }}
+          disabled={updating}
+          {...otherProps}
+        />
+      </PanelSectionRow>
     );
   }
 

diff --git a/src/components/HhdDropdown.tsx b/src/components/HhdDropdown.tsx
@@ -1,4 +1,4 @@
-import { DropdownItem } from "decky-frontend-lib";
+import { DropdownItem, PanelSectionRow } from "decky-frontend-lib";
 import { FC } from "react";
 
 type DropdownProps = {
@@ -29,24 +29,26 @@ const HhdDropdown: FC<DropdownProps> = ({
   });
 
   return (
-    <DropdownItem
-      label={title}
-      description={hint}
-      rgOptions={dropdownOptions.map((o) => {
-        return {
-          data: o.data,
-          label: o.label,
-          value: o.value,
-        };
-      })}
-      selectedOption={
-        dropdownOptions.find((o) => {
-          return o.data === selectedValue;
-        })?.data || defaultValue
-      }
-      onChange={onChange}
-      {...otherProps}
-    />
+    <PanelSectionRow>
+      <DropdownItem
+        label={title}
+        description={hint}
+        rgOptions={dropdownOptions.map((o) => {
+          return {
+            data: o.data,
+            label: o.label,
+            value: o.value,
+          };
+        })}
+        selectedOption={
+          dropdownOptions.find((o) => {
+            return o.data === selectedValue;
+          })?.data || defaultValue
+        }
+        onChange={onChange}
+        {...otherProps}
+      />
+    </PanelSectionRow>
   );
 };
 

diff --git a/src/components/HhdIntSlider.tsx b/src/components/HhdIntSlider.tsx
@@ -1,5 +1,5 @@
 import { FC, useState } from "react";
-import { SliderField } from "decky-frontend-lib";
+import { PanelSectionRow, SliderField } from "decky-frontend-lib";
 
 type PropType = {
   value: number;
@@ -31,7 +31,7 @@ const HhdIntSlider: FC<PropType> = ({
   };
 
   return (
-    <>
+    <PanelSectionRow>
       <SliderField
         label={title}
         value={sliderValue}
@@ -44,7 +44,7 @@ const HhdIntSlider: FC<PropType> = ({
         {...extraProps}
         {...otherProps}
       />
-    </>
+    </PanelSectionRow>
   );
 };
 

diff --git a/src/components/HhdModesDropdown.tsx b/src/components/HhdModesDropdown.tsx
@@ -1,4 +1,4 @@
-import { DropdownItem } from "decky-frontend-lib";
+import { DropdownItem, PanelSectionRow } from "decky-frontend-lib";
 import { FC } from "react";
 
 type DropdownProps = {
@@ -44,7 +44,7 @@ const HhdModesDropdown: FC<DropdownProps> = ({
   const children = currentMode ? Object.entries(currentMode.children) : [];
 
   return (
-    <>
+    <PanelSectionRow>
       <DropdownItem
         label={title}
         description={hint}
@@ -83,7 +83,7 @@ const HhdModesDropdown: FC<DropdownProps> = ({
             otherProps: additionalProps,
           });
         })}
-    </>
+    </PanelSectionRow>
   );
 };
 

diff --git a/src/components/HhdSlider.tsx b/src/components/HhdSlider.tsx
@@ -1,5 +1,5 @@
 import { FC } from "react";
-import { SliderField, NotchLabel } from "decky-frontend-lib";
+import { SliderField, NotchLabel, PanelSectionRow } from "decky-frontend-lib";
 
 type PropType = {
   value: number;
@@ -34,7 +34,7 @@ const HhdSlider: FC<PropType> = ({
     options.indexOf(value) >= 0 ? options.indexOf(value) : defaultValue;
 
   return (
-    <>
+    <PanelSectionRow>
       <SliderField
         label={title}
         value={sliderValue}
@@ -49,7 +49,7 @@ const HhdSlider: FC<PropType> = ({
         {...otherProps}
         {...extraProps}
       />
-    </>
+    </PanelSectionRow>
   );
 };