shinuwa/sokko-g
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Polish Nebula design system controls before release
All checks were successful
Deploy Sokko G / deploy (push) Successful in 16s
Details

Browse source
This commit is contained in:
Shinuwa 2026-08-29 16:07:16 +02:00
parent 817e21567b
commit 07de342fc2
31 changed files with 79 additions and 58 deletions
Download patch file Download diff file Expand all files Collapse all files

2
website/src/features/toolboxes/ToolboxCard.jsx
View file

@ -36,7 +36,7 @@ export function ToolboxCard({ toolbox, game, actions, reorder }) {
<button
className="toolbox-card-drag-handle nds-icon-button"
data-size="md"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, toolbox.id)}
aria-label={`Déplacer ${toolbox.name}`}

2
website/src/features/toolboxes/modules/CalculatorEntries.jsx
View file

@ -43,7 +43,7 @@ export function CalculatorEntries({ entries, parentId, getScopedParentId, active
<button
className="calculator-drag-handle nds-icon-button"
data-size="xs"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, entry.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${entry.label || formatResult(entry.value)}`}

2
website/src/features/toolboxes/modules/CalendarEventControls.jsx
View file

@ -118,7 +118,7 @@ export function CalendarAlertModeSwitch({ mode, textContent, onChange }) {
};
return (
<div className="timer-alert-mode-switch calendar-alert-mode-switch nds-radio-button-group" data-size="xs" role="group" aria-label={textContent.alertModeTitle || "Mode d'alerte"}>
<div className="timer-alert-mode-switch calendar-alert-mode-switch nds-radio-button-group" data-size="md" role="group" aria-label={textContent.alertModeTitle || "Mode d'alerte"}>
{ALERT_MODES.map((option) => (
<button
key={option.mode}

2
website/src/features/toolboxes/modules/ChecklistModule.jsx
View file

@ -127,7 +127,7 @@ export function ChecklistModule({ toolboxId, moduleId, context, editing, textExc
)}
{namedSections.length > 0 && (
<div className="checklist-toolbar">
<div className="checklist-complete-mode-group nds-radio-button-group" data-size="xs" role="radiogroup" aria-label={textContent.completedSectionsModeTitle || "Affichage des catégories terminées"}>
<div className="checklist-complete-mode-group nds-radio-button-group" data-size="md" role="radiogroup" aria-label={textContent.completedSectionsModeTitle || "Affichage des catégories terminées"}>
{[
{ mode: "visible", label: textContent.completedSectionsVisibleLabel || "Visible", icon: "eye-open" },
{ mode: "reduced", label: textContent.completedSectionsReducedLabel || "Réduit", icon: "hide" },

4
website/src/features/toolboxes/modules/ChecklistParts.jsx
View file

@ -69,7 +69,7 @@ export function ChecklistSection({ section, context, data, reorder, onRenameSect
<button
className="checklist-drag-handle nds-icon-button"
data-size="xs"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.groupReorder.startDrag(event, { groupId: section.id })}
aria-label={`${textContent.reorderSectionTitle || "Déplacer la catégorie"} ${section.title}`}
@ -166,7 +166,7 @@ function ChecklistItem({ item, section, context, reorder, items, save, onUpdateI
<button
className="checklist-drag-handle nds-icon-button"
data-size="xs"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, item.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${item.label}`}

4
website/src/features/toolboxes/modules/CombosList.jsx
View file

@ -29,7 +29,7 @@ export function CombosList({
<button
className="task-planner-drag-handle combo-drag-handle nds-icon-button"
data-size="xs"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, combo.id)}
aria-label={`${textContent.reorderComboTitle || "Déplacer le combo"} ${combo.name}`}
@ -92,7 +92,7 @@ export function CombosList({
<button
className="task-planner-category-drag-handle nds-icon-button"
data-size="xs"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.groupReorder.startDrag(event, { groupId: category })}
aria-label={`${textContent.reorderCategoryTitle || "Déplacer la catégorie"} ${category}`}

2
website/src/features/toolboxes/modules/CountersModule.jsx
View file

@ -71,7 +71,7 @@ export function CountersModule({ toolboxId, moduleId, context, editing, textExch
<button
className="counter-drag-handle nds-icon-button"
data-size="sm"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => itemReorder.startDrag(event, counter.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${counter.label}`}

4
website/src/features/toolboxes/modules/EquipmentPlannerCharacteristics.jsx
View file

@ -145,7 +145,7 @@ function TraitCategoryList({ traits, categories, collapsedCategories, reorder, t
return (
<section className={className} key={category} {...reorder.getGroupProps({ groupId: category })}>
<div className="equipment-planner-trait-category-header">
<button type="button" className="task-planner-category-drag-handle nds-icon-button" data-size="xs" data-variant="ghost" onPointerDown={(event) => reorder.groupReorder.startDrag(event, { groupId: category })} title={textContent.reorderCategoryTitle || "Déplacer la catégorie"}>
<button type="button" className="task-planner-category-drag-handle nds-icon-button" data-size="xs" data-variant="secondary" onPointerDown={(event) => reorder.groupReorder.startDrag(event, { groupId: category })} title={textContent.reorderCategoryTitle || "Déplacer la catégorie"}>
<Icon name="drag" />
</button>
<strong>{category}</strong>
@ -182,7 +182,7 @@ function EquipmentTraitRow({ trait, className, itemProps, editing, textContent,
<li className={className} {...itemProps}>
{editing ? (
<>
<button type="button" className="task-planner-drag-handle nds-icon-button" data-size="xs" data-variant="ghost" onPointerDown={onStartDrag} title={textContent.reorderTraitTitle || "Déplacer"}>
<button type="button" className="task-planner-drag-handle nds-icon-button" data-size="xs" data-variant="secondary" onPointerDown={onStartDrag} title={textContent.reorderTraitTitle || "Déplacer"}>
<Icon name="drag" />
</button>
<IconChoiceDropdown

2
website/src/features/toolboxes/modules/EquipmentPlannerItem.jsx
View file

@ -32,7 +32,7 @@ export function EquipmentItem({ equipment, reorder, textContent, onUpdate, onDel
<button
className="task-planner-drag-handle nds-icon-button"
data-size="sm"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, equipment.id)}
aria-label={`${textContent.reorderEquipmentTitle || "Déplacer"} ${equipment.name}`}

2
website/src/features/toolboxes/modules/GoalTreeBranch.jsx
View file

@ -61,7 +61,7 @@ export function GoalTreeBranch({ nodes, parentId, selectedNodeId, editing, reord
<button
className="goal-tree-drag-handle nds-icon-button"
data-size="micro"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, node.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${node.title}`}

2
website/src/features/toolboxes/modules/GoalTreeEditor.jsx
View file

@ -200,7 +200,7 @@ function GoalTreeAdvancedPanel({ selectedNode, selectedNodeIsStep, selectedProgr
<div className="goal-tree-form-section-title">{textContent.progressSectionTitle || "Progression"}</div>
<button
className={`tool-split-scroll-toggle goal-tree-progress-mode-toggle nds-switch ${selectedProgressMode === "auto" ? "active" : ""}`}
data-size="lg"
data-size="md"
type="button"
onClick={() => onUpdateNode(selectedNode.id, (node) => ({ ...node, progressMode: selectedProgressMode === "auto" ? "manual" : "auto" }))}
aria-pressed={selectedProgressMode === "auto"}

2
website/src/features/toolboxes/modules/ImagesModule.jsx
View file

@ -106,7 +106,7 @@ export function ImagesModule({ toolboxId, moduleId, context, editing, textExchan
<button
className="image-drag-handle nds-icon-button"
data-size="sm"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => itemReorder.startDrag(event, image.id)}
aria-label={textContent.reorderAriaLabel || "Déplacer l'image"}

2
website/src/features/toolboxes/modules/LinksModule.jsx
View file

@ -84,7 +84,7 @@ export function LinksModule({ toolboxId, moduleId, context, editing, textExchang
<button
className="link-drag-handle nds-icon-button"
data-size="sm"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => itemReorder.startDrag(event, link.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${link.title || link.url}`}

2
website/src/features/toolboxes/modules/MemosModule.jsx
View file

@ -138,7 +138,7 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
<button
className="memo-drag-handle nds-icon-button"
data-size="sm"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => itemReorder.startDrag(event, memo.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${memo.text}`}

2
website/src/features/toolboxes/modules/NotepadModule.jsx
View file

@ -296,7 +296,7 @@ export function NotepadModule({ toolboxId, moduleId, context, textExchangeOpen }
renderTrigger={({ open, toggle }) => (
<button
className={`notepad-pages-toggle nds-icon-button ${open ? "active" : ""}`}
data-size="sm"
data-size="md"
data-variant="panel-toggle"
data-edge="right"
data-border="joined"

2
website/src/features/toolboxes/modules/TaskPlannerBranch.jsx
View file

@ -162,7 +162,7 @@ export function TaskPlannerBranch({
<button
className="task-planner-category-drag-handle nds-icon-button"
data-size="xs"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.groupReorder.startDrag(event, { groupId: group.category, parentId })}
aria-label={`${textContent.categoryReorderTitle || "Déplacer la catégorie"} ${group.category}`}

2
website/src/features/toolboxes/modules/TaskPlannerItem.jsx
View file

@ -67,7 +67,7 @@ export function TaskPlannerItem({
<button
className="task-planner-drag-handle nds-icon-button"
data-size="xs"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, task.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${task.title}`}

1
website/src/features/toolboxes/modules/TimerCountdown.jsx
View file

@ -104,6 +104,7 @@ export function CountdownList({ countdowns, nowMs, textContent, reorder, reorder
<button
className="timer-drag-handle nds-icon-button"
data-size="xs"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, countdown.id)}
aria-label={`${textContent.reorderTitle || "Déplacer"} ${countdown.label}`}

4
website/src/features/toolboxes/modules/TimerSharedControls.jsx
View file

@ -16,7 +16,7 @@ export function TimerValue({ ms, compact = false, showCentiseconds = true }) {
);
}
export function TimerAlertModeSwitch({ mode, blocked, textContent, onChange }) {
export function TimerAlertModeSwitch({ mode, blocked, textContent, size = "xs", onChange }) {
const labels = {
off: textContent.alertOffTitle || "Pas d'alerte",
visible: textContent.alertVisibleTitle || "Alerte quand la toolbox est affichée",
@ -27,7 +27,7 @@ export function TimerAlertModeSwitch({ mode, blocked, textContent, onChange }) {
return (
<div
className={`timer-alert-mode-switch nds-radio-button-group ${blocked ? "is-blocked" : ""}`}
data-size="xs"
data-size={size}
role="group"
aria-label={textContent.alertModeTitle || "Mode d'alerte"}
title={blocked ? blockedTitle : undefined}

2
website/src/features/toolboxes/modules/ToolboxModules.jsx
View file

@ -190,7 +190,7 @@ function ModuleShell({ toolbox, module, context, reorder, itemGroup = "", onRena
<button
className="module-drag-handle nds-icon-button"
data-size="md"
data-variant="ghost"
data-variant="secondary"
type="button"
onPointerDown={(event) => reorder.itemReorder.startDrag(event, module.id)}
aria-label={`Déplacer ${module.title || label}`}