RubyGems - fuji_admin - Versions diffs - 0.1.0 - Mend

fuji_admin 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (61) hide show

data/app/assets/javascripts/fuji_admin/palettes.js ADDED Viewed

@@ -0,0 +1,237 @@
+// Fuji Admin — live palette switcher.
+//
+// Injects a floating trigger (bottom-right) that opens a grid of 30 Coolors-
+// trending palettes. Clicking one sets `--fuji-primary` on <html>, persists
+// the choice in localStorage, and updates primary-coloured components via the
+// overrides in components/_palette_switcher.scss.
+//
+// Hidden on `body.logged_out` (login / password-reset pages, which run
+// host-supplied themed templates that shouldn't be repainted).
+(function () {
+  "use strict";
+  var STORAGE_KEY = "fuji-palette-id";
+  // --- Palettes (curated from coolors.co/palettes/trending) -----------------
+  var PALETTES = [
+    { id: "fuji-default",    name: "Fuji Default",    primary: "#41549b", swatch: ["#f2f5fc","#b2bce0","#41549b","#2a3664","#1f2849"] },
+    { id: "navy-amber",      name: "Navy & Amber",    primary: "#219ebc", swatch: ["#8ecae6","#219ebc","#023047","#ffb703","#fb8500"] },
+    { id: "warm-sunset",     name: "Warm Sunset",     primary: "#e76f51", swatch: ["#264653","#2a9d8f","#e9c46a","#f4a261","#e76f51"] },
+    { id: "forest-meadow",   name: "Forest Meadow",   primary: "#4f772d", swatch: ["#132a13","#31572c","#4f772d","#90a955","#ecf39e"] },
+    { id: "dusty-rose",      name: "Dusty Rose",      primary: "#da627d", swatch: ["#f9dbbd","#ffa5ab","#da627d","#a53860","#450920"] },
+    { id: "ocean-blue",      name: "Ocean Blue",      primary: "#0077b6", swatch: ["#03045e","#023e8a","#0077b6","#00b4d8","#48cae4"] },
+    { id: "terracotta",      name: "Terracotta",      primary: "#e07a5f", swatch: ["#f4f1de","#e07a5f","#3d405b","#81b29a","#f2cc8f"] },
+    { id: "coastal-sage",    name: "Coastal Sage",    primary: "#588157", swatch: ["#dad7cd","#a3b18a","#588157","#3a5a40","#344e41"],
+      theme: { surface: "#dad7cd", surfaceAlt: "#c2beb1", text: "#344e41", textMuted: "#a3b18a", border: "#b1ac9d" } },
+    { id: "royal-purple",    name: "Royal Purple",    primary: "#7b2cbf", swatch: ["#3c096c","#5a189a","#7b2cbf","#9d4edd","#c77dff"] },
+    { id: "editorial-navy",  name: "Editorial Navy",  primary: "#415a77", swatch: ["#0d1b2a","#1b263b","#415a77","#778da9","#e0e1dd"],
+      theme: { surface: "#e0e1dd", surfaceAlt: "#d0d1cb", text: "#0d1b2a", textMuted: "#778da9", border: "#bcc0b9" } },
+    { id: "cheerful",        name: "Cheerful",        primary: "#118ab2", swatch: ["#ef476f","#ffd166","#06d6a0","#118ab2","#073b4c"] },
+    { id: "crimson-spice",   name: "Crimson Spice",   primary: "#d62828", swatch: ["#003049","#d62828","#f77f00","#fcbf49","#eae2b7"] },
+    { id: "mint-ocean",      name: "Mint Ocean",      primary: "#168aad", swatch: ["#99d98c","#52b69a","#34a0a4","#168aad","#1e6091"] },
+    { id: "burgundy-gold",   name: "Burgundy & Gold", primary: "#9e2a2b", swatch: ["#335c67","#fff3b0","#e09f3e","#9e2a2b","#540b0e"],
+      theme: { surface: "#fff3b0", surfaceAlt: "#f5e58c", text: "#540b0e", textMuted: "#335c67", border: "#e8d47a" } },
+    { id: "scarlet",         name: "Scarlet",         primary: "#ba181b", swatch: ["#0b090a","#660708","#a4161a","#ba181b","#e5383b"] },
+    { id: "teal-warmth",     name: "Teal Warmth",     primary: "#2a9d8f", swatch: ["#264653","#2a9d8f","#e9c46a","#f4a261","#e76f51"] },
+    { id: "deep-cyan",       name: "Deep Cyan",       primary: "#005f73", swatch: ["#001219","#005f73","#0a9396","#94d2bd","#e9d8a6"],
+      theme: { surface: "#e9d8a6", surfaceAlt: "#d6c58b", text: "#001219", textMuted: "#0a9396", border: "#c9b77e" } },
+    { id: "tropical",        name: "Tropical",        primary: "#0081a7", swatch: ["#0081a7","#00afb5","#fdfcdc","#fed9b7","#f07167"],
+      theme: { surface: "#fdfcdc", surfaceAlt: "#f3f0c0", text: "#003844", textMuted: "#00afb5", border: "#e6e3b5" } },
+    { id: "spice-road",      name: "Spice Road",      primary: "#fb8b24", swatch: ["#5f0f40","#9a031e","#fb8b24","#e36414","#0f4c5c"] },
+    { id: "sunset-gradient", name: "Sunset Gradient", primary: "#f3722c", swatch: ["#f94144","#f8961e","#f9c74f","#43aa8b","#277da1"] },
+    { id: "coral-reef",      name: "Coral Reef",      primary: "#006d77", swatch: ["#006d77","#83c5be","#edf6f9","#ffddd2","#e29578"] },
+    { id: "electric",        name: "Electric",        primary: "#ff006e", swatch: ["#ffbe0b","#fb5607","#ff006e","#8338ec","#3a86ff"] },
+    { id: "muted-taupe",     name: "Muted Taupe",     primary: "#4a4e69", swatch: ["#22223b","#4a4e69","#9a8c98","#c9ada7","#f2e9e4"],
+      theme: { surface: "#f2e9e4", surfaceAlt: "#e0d6d0", text: "#22223b", textMuted: "#9a8c98", border: "#d2c4c0" } },
+    { id: "warm-lilac",      name: "Warm Lilac",      primary: "#9d4edd", swatch: ["#240046","#5a189a","#7b2cbf","#9d4edd","#e0aaff"] },
+    { id: "rose-garden",     name: "Rose Garden",     primary: "#dd2d4a", swatch: ["#880d1e","#dd2d4a","#f26a8d","#f49cbb","#cbeef3"] },
+    { id: "forest-deep",     name: "Forest Deep",     primary: "#3a5a40", swatch: ["#dad7cd","#a3b18a","#588157","#3a5a40","#344e41"] },
+    { id: "pink-sunset",     name: "Pink Sunset",     primary: "#fb6f92", swatch: ["#ffe5ec","#ffc2d1","#ffb3c6","#ff8fab","#fb6f92"] },
+    { id: "twilight-purple", name: "Twilight Purple", primary: "#5a189a", swatch: ["#10002b","#240046","#3c096c","#5a189a","#7b2cbf"] },
+    { id: "olive-gold",      name: "Olive & Gold",    primary: "#bc6c25", swatch: ["#606c38","#283618","#fefae0","#dda15e","#bc6c25"],
+      theme: { surface: "#fefae0", surfaceAlt: "#f0ebc5", text: "#283618", textMuted: "#606c38", border: "#ded9a8" } },
+    { id: "sage-terracotta", name: "Sage & Terracotta", primary: "#e07a5f", swatch: ["#f4f1de","#e07a5f","#3d405b","#81b29a","#f2cc8f"],
+      theme: { surface: "#f4f1de", surfaceAlt: "#e7e2c6", text: "#3d405b", textMuted: "#81b29a", border: "#ddd8bc" } },
+    { id: "indigo-glow",     name: "Indigo Glow",     primary: "#3a86ff", swatch: ["#8338ec","#3a86ff","#06d6a0","#ffbe0b","#fb5607"] },
+  ];
+  // --- Apply & persist ------------------------------------------------------
+  function hexToRgb(hex) {
+    hex = hex.replace("#", "");
+    if (hex.length === 3) hex = hex.split("").map(function (c) { return c + c; }).join("");
+    var n = parseInt(hex, 16);
+    return [(n >> 16) & 255, (n >> 8) & 255, n & 255];
+  }
+  var THEME_VARS = [
+    "--fuji-surface",
+    "--fuji-surface-alt",
+    "--fuji-text",
+    "--fuji-text-muted",
+    "--fuji-border",
+  ];
+  function apply(palette) {
+    var rgb = hexToRgb(palette.primary);
+    var root = document.documentElement;
+    root.style.setProperty("--fuji-primary", palette.primary);
+    root.style.setProperty("--fuji-primary-rgb", rgb[0] + ", " + rgb[1] + ", " + rgb[2]);
+    document.body.setAttribute("data-fuji-palette", palette.id);
+    if (palette.theme) {
+      root.style.setProperty("--fuji-surface",     palette.theme.surface);
+      root.style.setProperty("--fuji-surface-alt", palette.theme.surfaceAlt);
+      root.style.setProperty("--fuji-text",        palette.theme.text);
+      root.style.setProperty("--fuji-text-muted",  palette.theme.textMuted);
+      root.style.setProperty("--fuji-border",      palette.theme.border);
+      document.body.setAttribute("data-fuji-theme", "on");
+    } else {
+      THEME_VARS.forEach(function (v) { root.style.removeProperty(v); });
+      document.body.removeAttribute("data-fuji-theme");
+    }
+  }
+  function save(id) {
+    try { localStorage.setItem(STORAGE_KEY, id); } catch (e) {}
+  }
+  function load() {
+    try { return localStorage.getItem(STORAGE_KEY); } catch (e) { return null; }
+  }
+  function getPalette(id) {
+    for (var i = 0; i < PALETTES.length; i++) if (PALETTES[i].id === id) return PALETTES[i];
+    return PALETTES[0];
+  }
+  // --- UI ------------------------------------------------------------------
+  function buildUI() {
+    if (document.querySelector(".fuji-palette-switcher")) return;
+    var wrapper = document.createElement("div");
+    wrapper.className = "fuji-palette-switcher";
+    var trigger = document.createElement("button");
+    trigger.type = "button";
+    trigger.className = "fuji-palette-switcher__trigger";
+    trigger.setAttribute("aria-label", "Try a colour palette");
+    trigger.innerHTML =
+      '<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">' +
+      '<circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle>' +
+      '<circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle>' +
+      '<circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle>' +
+      '<circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle>' +
+      '<path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.79 0 1.5-.71 1.5-1.5 0-.39-.15-.74-.39-1-.23-.27-.38-.62-.38-1 0-.79.71-1.5 1.5-1.5H16c3.31 0 6-2.69 6-6 0-5.5-4.5-10-10-10z"></path>' +
+      "</svg>";
+    var panel = document.createElement("div");
+    panel.className = "fuji-palette-switcher__panel";
+    panel.hidden = true;
+    var header = document.createElement("div");
+    header.className = "fuji-palette-switcher__header";
+    header.innerHTML = '<span class="fuji-palette-switcher__title">Palettes</span>';
+    panel.appendChild(header);
+    var grid = document.createElement("div");
+    grid.className = "fuji-palette-switcher__grid";
+    PALETTES.forEach(function (p) {
+      var item = document.createElement("button");
+      item.type = "button";
+      item.className = "fuji-palette-switcher__item";
+      item.setAttribute("data-palette-id", p.id);
+      item.setAttribute("title", p.name);
+      if (p.theme) item.classList.add("fuji-palette-switcher__item--themed");
+      var swatches = document.createElement("span");
+      swatches.className = "fuji-palette-switcher__swatches";
+      p.swatch.forEach(function (color) {
+        var bar = document.createElement("span");
+        bar.className = "fuji-palette-switcher__bar";
+        bar.style.background = color;
+        swatches.appendChild(bar);
+      });
+      item.appendChild(swatches);
+      var label = document.createElement("span");
+      label.className = "fuji-palette-switcher__label";
+      label.textContent = p.name;
+      if (p.theme) {
+        var badge = document.createElement("span");
+        badge.className = "fuji-palette-switcher__badge";
+        badge.title = "Full theme (surfaces + text repaint)";
+        badge.textContent = "◐";
+        label.appendChild(badge);
+      }
+      item.appendChild(label);
+      item.addEventListener("click", function (e) {
+        e.stopPropagation();
+        apply(p);
+        save(p.id);
+        markActive(p.id);
+      });
+      grid.appendChild(item);
+    });
+    panel.appendChild(grid);
+    trigger.addEventListener("click", function (e) {
+      e.stopPropagation();
+      panel.hidden = !panel.hidden;
+    });
+    document.addEventListener("click", function (e) {
+      if (!wrapper.contains(e.target)) panel.hidden = true;
+    });
+    document.addEventListener("keydown", function (e) {
+      if (e.key === "Escape") panel.hidden = true;
+    });
+    wrapper.appendChild(trigger);
+    wrapper.appendChild(panel);
+    document.body.appendChild(wrapper);
+  }
+  function markActive(id) {
+    document.querySelectorAll(".fuji-palette-switcher__item").forEach(function (el) {
+      el.classList.toggle(
+        "fuji-palette-switcher__item--active",
+        el.getAttribute("data-palette-id") === id
+      );
+    });
+  }
+  function readMeta(name) {
+    var el = document.querySelector('meta[name="' + name + '"]');
+    return el ? el.getAttribute("content") : null;
+  }
+  function init() {
+    // Config comes from <meta> tags injected by fuji_admin/active_admin_patch.rb
+    // (Rails initializer → FujiAdmin.configure). Fallbacks apply when the host
+    // app hasn't wired the gem yet.
+    var pickerEnabled = readMeta("fuji-palette-picker") === "true";
+    var defaultId     = readMeta("fuji-default-palette") || "forest-meadow";
+    var stored = pickerEnabled ? load() : null;
+    var palette = getPalette(stored || defaultId);
+    apply(palette);
+    if (document.body.classList.contains("logged_out")) return;
+    if (!pickerEnabled) return;
+    buildUI();
+    markActive(palette.id);
+  }
+  document.addEventListener("DOMContentLoaded", init);
+  document.addEventListener("turbo:load", init);
+  document.addEventListener("turbolinks:load", init);
+})();

data/app/assets/javascripts/fuji_admin/row_actions.js ADDED Viewed

@@ -0,0 +1,123 @@
+// Fuji Admin — row-action dropdown.
+//
+// Replaces ActiveAdmin's inline row-action links (View / Edit / Delete / …)
+// with a single vertical-ellipsis trigger that opens a menu. Keeps the
+// actions column compact regardless of how many actions a resource exposes.
+//
+// Activated on `table.index_table td.col-actions` when the cell contains
+// 2+ links. A single-link cell keeps its outlined-button fallback from
+// components/_tables.scss — no dropdown needed.
+//
+// Idempotent across Turbo navigations.
+(function () {
+  "use strict";
+  function triggerSVG() {
+    return (
+      '<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor" aria-hidden="true">' +
+      '<circle cx="12" cy="5" r="1.6"></circle>' +
+      '<circle cx="12" cy="12" r="1.6"></circle>' +
+      '<circle cx="12" cy="19" r="1.6"></circle>' +
+      "</svg>"
+    );
+  }
+  function wrapCell(cell) {
+    if (cell.dataset.fujiRowActionsWired === "1") return;
+    cell.dataset.fujiRowActionsWired = "1";
+    var links = cell.querySelectorAll(".table_actions > a, :scope > a");
+    if (links.length < 2) return; // keep fallback pill styling
+    var wrapper = document.createElement("div");
+    wrapper.className = "fuji-row-actions";
+    var trigger = document.createElement("button");
+    trigger.type = "button";
+    trigger.className = "fuji-row-actions__trigger";
+    trigger.setAttribute("aria-label", "Row actions");
+    trigger.setAttribute("aria-haspopup", "menu");
+    trigger.setAttribute("aria-expanded", "false");
+    trigger.innerHTML = triggerSVG();
+    var menu = document.createElement("div");
+    menu.className = "fuji-row-actions__menu";
+    menu.setAttribute("role", "menu");
+    menu.hidden = true;
+    Array.from(links).forEach(function (link) {
+      link.classList.add("fuji-row-actions__item");
+      link.setAttribute("role", "menuitem");
+      if (
+        link.classList.contains("delete_link") ||
+        link.getAttribute("data-method") === "delete"
+      ) {
+        link.classList.add("fuji-row-actions__item--danger");
+      }
+      menu.appendChild(link);
+    });
+    // Clear the original actions container.
+    cell.innerHTML = "";
+    wrapper.appendChild(trigger);
+    wrapper.appendChild(menu);
+    cell.appendChild(wrapper);
+    trigger.addEventListener("click", function (e) {
+      e.stopPropagation();
+      var wasOpen = !menu.hidden;
+      closeAll();
+      if (!wasOpen) openMenu(trigger, menu);
+    });
+  }
+  function openMenu(trigger, menu) {
+    menu.hidden = false;
+    trigger.setAttribute("aria-expanded", "true");
+    // Position the (fixed) menu just below the trigger, right-aligned to it.
+    var rect = trigger.getBoundingClientRect();
+    menu.style.top = (rect.bottom + 4) + "px";
+    menu.style.right = (window.innerWidth - rect.right) + "px";
+    menu.style.left = "auto";
+  }
+  function closeAll() {
+    document.querySelectorAll(".fuji-row-actions__menu").forEach(function (m) {
+      m.hidden = true;
+      m.style.top = "";
+      m.style.right = "";
+      m.style.left = "";
+    });
+    document.querySelectorAll(".fuji-row-actions__trigger").forEach(function (t) {
+      t.setAttribute("aria-expanded", "false");
+    });
+  }
+  function onDocumentClick(e) {
+    if (e.target.closest(".fuji-row-actions")) return;
+    closeAll();
+  }
+  function onKey(e) {
+    if (e.key === "Escape") closeAll();
+  }
+  function bind() {
+    document
+      .querySelectorAll("table.index_table td.col-actions")
+      .forEach(wrapCell);
+  }
+  document.addEventListener("DOMContentLoaded", function () {
+    bind();
+    document.addEventListener("click", onDocumentClick);
+    document.addEventListener("keydown", onKey);
+    // Fixed-positioned menu doesn't move with the page, so close on scroll/resize.
+    window.addEventListener("scroll", closeAll, true);
+    window.addEventListener("resize", closeAll);
+  });
+  document.addEventListener("turbo:load", bind);
+  document.addEventListener("turbolinks:load", bind);
+})();

data/app/assets/stylesheets/fuji_admin/_base.scss ADDED Viewed

@@ -0,0 +1,23 @@
+// Fuji Admin — MVP theme
+//
+// Build order:
+//   1. tokens (variables/)        ← done
+//   2. mixins/                    ← done (media queries)
+//   3. reset + base typography    ← done
+//   4. grid / columns             ← done
+//   5. layout chrome              ← done
+//   6. components                 ← done
+//   7. page-specific styling      ← done
+@import url("https://fonts.googleapis.com/css2?family=Saira:wght@300;400;500;600;700&display=swap");
+@import "variables/variables";
+@import "mixins/mixins";
+@import "reset";
+@import "base_typography";
+@import "grid";
+@import "layouts/layouts";
+@import "components/components";
+@import "pages/pages";

data/app/assets/stylesheets/fuji_admin/_base_typography.scss ADDED Viewed

@@ -0,0 +1,56 @@
+// Base typography. Applied at the document root so every AA page inherits
+// consistent type without needing per-component resets.
+body {
+  font-family: $font-family-body;
+  font-size:   $font-size-base;
+  line-height: $line-height-base;
+  color:       $text-color;
+  background-color: $body-background;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+h1, h2, h3, h4, h5, h6 {
+  margin: 0 0 $space-3;
+  font-weight: $font-weight-semibold;
+  line-height: $line-height-tight;
+  color: $text-color;
+}
+h1 { font-size: $font-size-3xl; }
+h2 { font-size: $font-size-2xl; }
+h3 { font-size: $font-size-xl;  }
+h4 { font-size: $font-size-lg;  }
+h5 { font-size: $font-size-base; }
+h6 { font-size: $font-size-sm; }
+p {
+  margin: 0 0 $space-4;
+}
+a {
+  color: $link-primary-color;
+  text-decoration: none;
+  transition: color 0.15s ease;
+  &:hover {
+    color: $link-hover-color;
+    text-decoration: underline;
+  }
+}
+small {
+  font-size: $font-size-sm;
+}
+code, kbd, samp, pre {
+  font-family: $font-family-mono;
+  font-size: 0.9em;
+}
+hr {
+  border: 0;
+  border-top: 1px solid $surface-border;
+  margin: $space-5 0;
+}

data/app/assets/stylesheets/fuji_admin/_grid.scss ADDED Viewed

@@ -0,0 +1,111 @@
+// 12-column flex grid with responsive modifiers.
+//
+// Prefixed `fuji-` so it never collides with ActiveAdmin's own `.columns` /
+// `.column` classes. ActiveAdmin-specific columns will be styled separately
+// in components/_columns.scss.
+//
+// Markup:
+//   <div class="fuji-row">
+//     <div class="fuji-col-12 fuji-col-md-6 fuji-col-lg-4">...</div>
+//     <div class="fuji-col-12 fuji-col-md-6 fuji-col-lg-8">...</div>
+//   </div>
+//
+// Semantics:
+//   fuji-col        — equal-width flex child
+//   fuji-col-auto   — shrink to content
+//   fuji-col-N      — N/12 width at all breakpoints (N = 1..12)
+//   fuji-col-{bp}-N — N/12 width from breakpoint `bp` upwards (sm/md/lg/xl/xxl)
+$grid-columns: 12;
+.fuji-row {
+  display: flex;
+  flex-wrap: wrap;
+  margin-right: -#{$grid-gutter-sm / 2};
+  margin-left:  -#{$grid-gutter-sm / 2};
+  @include media-up(md) {
+    margin-right: -#{$grid-gutter / 2};
+    margin-left:  -#{$grid-gutter / 2};
+  }
+  > [class*="fuji-col"] {
+    padding-right: #{$grid-gutter-sm / 2};
+    padding-left:  #{$grid-gutter-sm / 2};
+    box-sizing: border-box;
+    @include media-up(md) {
+      padding-right: #{$grid-gutter / 2};
+      padding-left:  #{$grid-gutter / 2};
+    }
+  }
+}
+// Base equal-width column
+.fuji-col {
+  flex: 1 0 0;
+  max-width: 100%;
+}
+// Shrink-to-content
+.fuji-col-auto {
+  flex: 0 0 auto;
+  width: auto;
+  max-width: 100%;
+}
+// Helper to emit a width rule
+@mixin fuji-col-width($n) {
+  flex: 0 0 percentage($n / $grid-columns);
+  max-width: percentage($n / $grid-columns);
+}
+// Unqualified (all breakpoints) columns: fuji-col-1 … fuji-col-12
+@for $i from 1 through $grid-columns {
+  .fuji-col-#{$i} {
+    @include fuji-col-width($i);
+  }
+}
+// Responsive columns: fuji-col-sm-1 … fuji-col-xxl-12
+@each $bp-name, $bp-value in $breakpoints {
+  @include media-up($bp-name) {
+    .fuji-col-#{$bp-name} {
+      flex: 1 0 0;
+      max-width: 100%;
+    }
+    .fuji-col-#{$bp-name}-auto {
+      flex: 0 0 auto;
+      width: auto;
+      max-width: 100%;
+    }
+    @for $i from 1 through $grid-columns {
+      .fuji-col-#{$bp-name}-#{$i} {
+        @include fuji-col-width($i);
+      }
+    }
+  }
+}
+// Container helpers — centered max-width at each breakpoint
+.fuji-container {
+  width: 100%;
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: $space-4;
+  padding-left:  $space-4;
+  @each $bp-name, $max-width in $container-max-widths {
+    @include media-up($bp-name) {
+      max-width: $max-width;
+    }
+  }
+}
+.fuji-container-fluid {
+  width: 100%;
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: $space-4;
+  padding-left:  $space-4;
+}

data/app/assets/stylesheets/fuji_admin/_reset.scss ADDED Viewed

@@ -0,0 +1,48 @@
+// Minimal modern reset. Not normalize.css — just the handful of declarations
+// that every project wants. Touches only things that would interfere with
+// theming; leaves sensible browser defaults alone.
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+html {
+  -webkit-text-size-adjust: 100%;
+  text-size-adjust: 100%;
+}
+body {
+  margin: 0;
+  min-height: 100vh;
+}
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+  display: block;
+  max-width: 100%;
+}
+button,
+input,
+select,
+textarea {
+  font: inherit;
+  color: inherit;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+[hidden] {
+  display: none !important;
+}