feat(12-01): style DeploymentStep form controls and ReviewStep checkbox

- DeploymentStep: include-install label uses text-on-surface, checkbox uses accent-primary
- DeploymentStep: fieldset legends use text-on-surface-container font-medium
- DeploymentStep: all radio/checkbox labels use flex gap-2 text-on-surface cursor-pointer
- DeploymentStep: all radios and checkboxes use accent-primary
- ReviewStep: security checkbox uses accent-[var(--r2b-warning)] for warning-themed accent
This commit is contained in:
2026-04-01 14:05:14 +02:00
parent f6b4070ff9
commit 945f90d789
2 changed files with 21 additions and 15 deletions
+20 -15
View File
@@ -28,25 +28,27 @@ export function DeploymentStep() {
</p>
{/* Include rclone installation toggle */}
<div>
<label>
<div className="flex flex-col gap-2 mb-4">
<label className="flex items-center gap-2 text-sm text-on-surface cursor-pointer">
<input
type="checkbox"
className="accent-primary"
checked={includeInstall}
onChange={(e) =>
dispatch({ type: 'SET_DEPLOYMENT', payload: { includeInstall: e.target.checked } })
}
/>
{' '}Include rclone installation
Include rclone installation
</label>
</div>
{/* Config deployment path radio group */}
<fieldset>
<legend>Config deployment path</legend>
<label>
<fieldset className="mb-4">
<legend className="text-sm font-medium text-on-surface-container mb-2">Config deployment path</legend>
<label className="flex items-center gap-2 text-sm text-on-surface cursor-pointer">
<input
type="radio"
className="accent-primary"
name="configPath"
value="machine-wide"
checked={configPath === 'machine-wide'}
@@ -54,11 +56,12 @@ export function DeploymentStep() {
dispatch({ type: 'SET_DEPLOYMENT', payload: { configPath: 'machine-wide' } })
}
/>
{' '}Machine-wide (C:\ProgramData\rclone\)
Machine-wide (C:\ProgramData\rclone\)
</label>
<label>
<label className="flex items-center gap-2 text-sm text-on-surface cursor-pointer">
<input
type="radio"
className="accent-primary"
name="configPath"
value="user-profile"
checked={configPath === 'user-profile'}
@@ -66,28 +69,30 @@ export function DeploymentStep() {
dispatch({ type: 'SET_DEPLOYMENT', payload: { configPath: 'user-profile' } })
}
/>
{' '}User profile (%APPDATA%\rclone\)
User profile (%APPDATA%\rclone\)
</label>
</fieldset>
{/* Script targets checkboxes */}
<fieldset>
<legend>Script targets</legend>
<label>
<fieldset className="mb-4">
<legend className="text-sm font-medium text-on-surface-container mb-2">Script targets</legend>
<label className="flex items-center gap-2 text-sm text-on-surface cursor-pointer">
<input
type="checkbox"
className="accent-primary"
checked={scriptTargets.includes('intune')}
onChange={(e) => handleScriptTargetChange('intune', e.target.checked)}
/>
{' '}Intune
Intune
</label>
<label>
<label className="flex items-center gap-2 text-sm text-on-surface cursor-pointer">
<input
type="checkbox"
className="accent-primary"
checked={scriptTargets.includes('rmm')}
onChange={(e) => handleScriptTargetChange('rmm', e.target.checked)}
/>
{' '}RMM
RMM
</label>
</fieldset>
+1
View File
@@ -91,6 +91,7 @@ export function ReviewStep() {
<label className="flex items-center gap-2 text-sm text-warning cursor-pointer">
<input
type="checkbox"
className="accent-[var(--r2b-warning)]"
checked={acknowledged}
onChange={(e) => setAcknowledged(e.target.checked)}
/>