Reformat AMS drying presets table (#732)

Group columns by AMS type (AMS 2 Pro, AMS-HT) with inline °C and h
  unit labels next to each input instead of separate column headers.
This commit is contained in:
maziggy
2026-03-17 13:36:39 +01:00
parent 98cb88a06b
commit aeae5cfa23
4 changed files with 78 additions and 39 deletions
+1
View File
@@ -17,6 +17,7 @@ All notable changes to Bambuddy will be documented in this file.
### Improved
- **Compact Assign Spool Modal** ([#725](https://github.com/maziggy/bambuddy/issues/725)) — The "Assign Spool" modal now uses a compact 3-column grid layout instead of a vertical list, showing more spools at once without scrolling. Each card displays the spool name, color, and remaining/total weight. The modal is wider with a taller scroll area. Requested by @RosdasHH.
- **Reformatted AMS Drying Presets Table** ([#732](https://github.com/maziggy/bambuddy/issues/732)) — The drying presets table in Settings now groups columns by AMS type (AMS 2 Pro, AMS-HT) with inline °C and h unit labels next to each input, replacing the previous flat column layout. Requested by @cadtoolbox.
### Security
+51 -13
View File
@@ -3505,11 +3505,9 @@ export function SettingsPage() {
<table className="w-full text-xs">
<thead>
<tr className="text-bambu-gray border-b border-bambu-dark-tertiary">
<th className="text-left py-1.5 pr-2">{t('settings.dryingFilament')}</th>
<th className="text-center py-1.5 px-1">AMS 2 Pro °C</th>
<th className="text-center py-1.5 px-1">AMS-HT °C</th>
<th className="text-center py-1.5 px-1">AMS 2 Pro h</th>
<th className="text-center py-1.5 px-1">AMS-HT h</th>
<th className="text-left py-1.5">{t('settings.dryingFilament')}</th>
<th className="text-center py-1.5" colSpan={2}>AMS 2 Pro</th>
<th className="text-center py-1.5" colSpan={2}>AMS-HT</th>
</tr>
</thead>
<tbody>
@@ -3542,18 +3540,58 @@ export function SettingsPage() {
return Object.entries(presets).map(([fil, preset]) => (
<tr key={fil} className="border-b border-bambu-dark-tertiary/50">
<td className="py-1.5 pr-2 text-white font-medium">{fil}</td>
{(['n3f', 'n3s', 'n3f_hours', 'n3s_hours'] as const).map(key => (
<td key={key} className="py-1 px-1">
<td className="py-1 px-1">
<div className="flex items-center justify-end gap-1">
<input
type="number"
min={key.includes('hours') ? 1 : 30}
max={key.includes('hours') ? 24 : (key === 'n3s' ? 85 : 65)}
value={preset[key]}
onChange={e => updatePreset(fil, key, Math.max(1, parseInt(e.target.value) || 0))}
min={30}
max={65}
value={preset.n3f}
onChange={e => updatePreset(fil, 'n3f', Math.max(1, parseInt(e.target.value) || 0))}
className="w-14 px-1.5 py-1 bg-bambu-dark border border-bambu-dark-tertiary rounded text-white text-center text-xs focus:border-amber-500/50 focus:outline-none [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
/>
</td>
))}
<span className="text-bambu-gray">°C</span>
</div>
</td>
<td className="py-1 px-1">
<div className="flex items-center gap-1">
<input
type="number"
min={1}
max={24}
value={preset.n3f_hours}
onChange={e => updatePreset(fil, 'n3f_hours', Math.max(1, parseInt(e.target.value) || 0))}
className="w-14 px-1.5 py-1 bg-bambu-dark border border-bambu-dark-tertiary rounded text-white text-center text-xs focus:border-amber-500/50 focus:outline-none [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
/>
<span className="text-bambu-gray">h</span>
</div>
</td>
<td className="py-1 px-1">
<div className="flex items-center justify-end gap-1">
<input
type="number"
min={30}
max={85}
value={preset.n3s}
onChange={e => updatePreset(fil, 'n3s', Math.max(1, parseInt(e.target.value) || 0))}
className="w-14 px-1.5 py-1 bg-bambu-dark border border-bambu-dark-tertiary rounded text-white text-center text-xs focus:border-amber-500/50 focus:outline-none [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
/>
<span className="text-bambu-gray">°C</span>
</div>
</td>
<td className="py-1 px-1">
<div className="flex items-center gap-1">
<input
type="number"
min={1}
max={24}
value={preset.n3s_hours}
onChange={e => updatePreset(fil, 'n3s_hours', Math.max(1, parseInt(e.target.value) || 0))}
className="w-14 px-1.5 py-1 bg-bambu-dark border border-bambu-dark-tertiary rounded text-white text-center text-xs focus:border-amber-500/50 focus:outline-none [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
/>
<span className="text-bambu-gray">h</span>
</div>
</td>
</tr>
));
})()}
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -23,7 +23,7 @@
<!-- Splash screens for iOS -->
<link rel="apple-touch-startup-image" href="/img/android-chrome-512x512.png" />
<script type="module" crossorigin src="/assets/index-DfydSnCI.js"></script>
<script type="module" crossorigin src="/assets/index-CCS49h9H.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-hKLgfdEQ.css">
</head>
<body>