refactor(ui): Nest inputs under their labels

oliversalzburg · Oct 9, 2022 · 32a3084 · 32a3084
1 parent 7e03e80
commit 32a3084
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 6 deletions.
diff --git a/packages/userscript/source/ui/TimeControlSettingsUi.ts b/packages/userscript/source/ui/TimeControlSettingsUi.ts
@@ -959,7 +959,8 @@ export class TimeControlSettingsUi extends SettingsSectionUi {
  }
  });
 
- element.append(input, label);
+ label.prepend(input);
+ element.append(input);
 
  return element;
  }
@@ -1015,7 +1016,8 @@ export class TimeControlSettingsUi extends SettingsSectionUi {
  }
  });
 
- element.append(input, label);
+ label.prepend(input);
+ element.append(label);
 
  return element;
  }

diff --git a/packages/userscript/source/ui/TradeSettingsUi.ts b/packages/userscript/source/ui/TradeSettingsUi.ts
@@ -151,7 +151,8 @@ export class TradeSettingsUi extends SettingsSectionUi {
  }
  });
 
- element.append(input, label);
+ label.prepend(input);
+ element.append(label);
 
  return element;
  }

diff --git a/packages/userscript/source/ui/UserInterface.ts b/packages/userscript/source/ui/UserInterface.ts
@@ -167,7 +167,7 @@ export class UserInterface {
  this._addRule(
  `#ks ul li.ks-setting .ks-label {
  display: inline-block;
- min-width: 100px;
+ min-width: 120px;
  }`
  );
  // Setting: +/- Expando Toggle

diff --git a/packages/userscript/source/ui/components/LimitedButton.ts b/packages/userscript/source/ui/components/LimitedButton.ts
@@ -37,7 +37,8 @@ export class LimitedButton extends UiComponent {
  }
  });
 
- element.append(checkbox, elementLabel);
+ elementLabel.prepend(checkbox);
+ element.append(elementLabel);
 
  setting.$limited = this;
 

diff --git a/packages/userscript/source/ui/components/SettingListItem.ts b/packages/userscript/source/ui/components/SettingListItem.ts
@@ -71,7 +71,8 @@ export class SettingListItem extends UiComponent {
  }
  });
 
- element.append(checkbox, elementLabel);
+ elementLabel.prepend(checkbox);
+ element.append(elementLabel);
 
  setting.$enabled = this;