Migrate site controls to Nebula design system
All checks were successful
Deploy Sokko G / deploy (push) Successful in 17s
All checks were successful
Deploy Sokko G / deploy (push) Successful in 17s
This commit is contained in:
parent
e3d0925eb1
commit
817e21567b
127 changed files with 5380 additions and 2363 deletions
|
|
@ -40,7 +40,7 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
function resizeMemoTextarea(element) {
|
||||
if (!element) return;
|
||||
element.style.height = "auto";
|
||||
element.style.height = `${element.scrollHeight}px`;
|
||||
element.style.height = `${element.scrollHeight + 2}px`;
|
||||
}
|
||||
|
||||
function save(nextData) {
|
||||
|
|
@ -93,7 +93,7 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
|
||||
{editing && (
|
||||
<div className="module-add-panel">
|
||||
<button className="primary memos-add-button" type="button" onClick={addMemo}>
|
||||
<button className="memos-add-button nds-button" data-size="sm" data-variant="primary" type="button" onClick={addMemo}>
|
||||
<Icon name="add" />
|
||||
<span>{textContent.addButton || "Ajouter"}</span>
|
||||
</button>
|
||||
|
|
@ -102,7 +102,8 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
|
||||
<div className="memos-toolbar">
|
||||
<button
|
||||
className={`memos-ticker-toggle ${data.tickerEnabled ? "active" : ""}`}
|
||||
className={`memos-ticker-toggle nds-icon-button ${data.tickerEnabled ? "active" : ""}`}
|
||||
data-size="sm"
|
||||
type="button"
|
||||
onClick={() => save({ ...data, tickerEnabled: !data.tickerEnabled })}
|
||||
aria-pressed={data.tickerEnabled}
|
||||
|
|
@ -135,7 +136,9 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
return (
|
||||
<article className={className} key={memo.id} style={{ "--memo-color": memo.color }} {...getItemProps({ itemId: memo.id, parentId: moduleId })}>
|
||||
<button
|
||||
className="memo-drag-handle"
|
||||
className="memo-drag-handle nds-icon-button"
|
||||
data-size="sm"
|
||||
data-variant="ghost"
|
||||
type="button"
|
||||
onPointerDown={(event) => itemReorder.startDrag(event, memo.id)}
|
||||
aria-label={`${textContent.reorderTitle || "Déplacer"} ${memo.text}`}
|
||||
|
|
@ -144,6 +147,9 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
<Icon name="drag" />
|
||||
</button>
|
||||
<textarea
|
||||
className="nds-textarea"
|
||||
data-size="sm"
|
||||
data-variant="ghost"
|
||||
ref={(element) => {
|
||||
if (element) {
|
||||
textareaRefs.current.set(memo.id, element);
|
||||
|
|
@ -169,7 +175,7 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
label={textContent.colorLabel || "Couleur du mémo"}
|
||||
renderTrigger={({ toggle }) => (
|
||||
<button
|
||||
className="notepad-color-toggle"
|
||||
className="notepad-color-toggle nds-swatch"
|
||||
type="button"
|
||||
style={{ "--swatch-color": memo.color }}
|
||||
onClick={toggle}
|
||||
|
|
@ -183,7 +189,7 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
{TEXT_COLORS.map((color) => (
|
||||
<button
|
||||
key={color}
|
||||
className={`notepad-swatch ${memo.color === color ? "active" : ""}`}
|
||||
className={`notepad-swatch nds-swatch ${memo.color === color ? "active" : ""}`}
|
||||
type="button"
|
||||
style={{ "--swatch-color": color }}
|
||||
onClick={() => {
|
||||
|
|
@ -196,14 +202,14 @@ export function MemosModule({ toolboxId, moduleId, context, editing, textExchang
|
|||
</>
|
||||
)}
|
||||
</CompactDropdown>
|
||||
<button className="memo-delete-button danger" type="button" onClick={() => deleteMemo(memo.id)} aria-label={textContent.deleteTitle || "Supprimer le mémo"} title={textContent.deleteTitle || "Supprimer"}>
|
||||
<button className="memo-delete-button nds-icon-button" data-size="sm" data-variant="danger" type="button" onClick={() => deleteMemo(memo.id)} aria-label={textContent.deleteTitle || "Supprimer le mémo"} title={textContent.deleteTitle || "Supprimer"}>
|
||||
<Icon name="trash" />
|
||||
</button>
|
||||
</footer>
|
||||
</article>
|
||||
);
|
||||
}) : (
|
||||
<button className="memos-empty" type="button" onClick={addMemo}>
|
||||
<button className="memos-empty nds-button" data-size="sm" data-variant="dashed" type="button" onClick={addMemo}>
|
||||
<Icon name="add" />
|
||||
<span>{textContent.emptyLabel || "Ajouter un premier mémo"}</span>
|
||||
</button>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue