Egyéni szerkesztőmód (színséma)

A szerkesztő módját (színsémáját) néhány CSS-változó módosításával a saját ízlésedhez igazíthatod.

1. Állítsd a Bricks → Beállítások → Szerkesztő lapon a szerkesztő módját Egyéni értékre, és mentsd a beállításokat.
2. Megjelenik az új, Szerkesztőmód (egyéni) beállítás.
3. Illeszd be ide a CSS-t, és mentsd a beállításokat.

Az alábbi kiindulási kódrészlet a gyakran testreszabott szerkesztő-CSS-változókat tartalmazza. A Bricks 2.x további változókat is definiál osztályokhoz, komponensekhez, állapotszínekhez, tompított színekhez és a vászon görgetősávjához, ezért ezt kiindulópontnak használd, és írd felül azokat a további változókat, amelyekre az egyéni módodnak szüksége van.

[data-builder-mode=custom] {
  --builder-bg: #f6f4f2;
  --builder-bg-2: #efebe6;
  --builder-bg-3: #e7e1da;
  --builder-bg-4: #dbd2c8;
  --builder-bg-accent: #EED8FD;
  --builder-color: #2e271e;
  --builder-color-description: #76634c;
  --builder-color-accent: #7209B7;
  --builder-color-accent-inverse: #fff;
  --builder-color-knob: #c8baaa;
  --builder-border-color: #d8cec2;
  --builder-placeholder-opacity: .33;
  --builder-color-class: #2b6cb0;
  --builder-bg-class: #d8e8f6;
  --builder-color-component: #6b46c1;
  --builder-bg-component: #eadcf8;
  --builder-color-info: #006c9c;
  --builder-bg-info: #d9f1ff;
  --builder-color-danger: #b42318;
  --builder-bg-danger: #ffe4e2;
  --builder-color-success: #027a48;
  --builder-bg-success: #dcfae6;
  --builder-color-muted: #7a6f63;
  --builder-bg-muted: #e2ddd6;
  --builder-canvas-scrollbar-thumb: #c8baaa;
  --builder-canvas-scrollbar-thumb_hover: #76634c;
  --builder-canvas-scrollbar-track: #efebe6;
  --bricks-tooltip-bg: #16130f;
  --bricks-tooltip-text: #f6f4f2;
}

Ha ezt a CSS-t bemásolod a Szerkesztőmód (egyéni) beállításba, és mented, a szerkesztő a megadott színsémát kapja.

Megjegyzés: egyéni szerkesztőmódban a Kód elem háttérszíne világos színsémára vált.

Segédeszközök színekhez

Színpalettákat és árnyalatgenerátorokat bármelyik szokásos színválasztó webhelyen találsz; ezek segítenek a változók értékeinek kiválasztásában.