minor style updates

src/assets/css/main.scss

@@ -419,11 +419,23 @@ $cond-text: (
   stroke: var(--bs-danger);
 }
 
+.edit-svg {
+  width: 1.25rem;
+  height: 1.25rem;
+  fill: var(--bs-warning);
+  stroke: var(--bs-warning);
+}
+
 .btn:hover .delete-svg {
   fill: var(--bs-danger-border-subtle);
   stroke: var(--bs-danger-border-subtle);
 }
 
+.btn:hover .edit-svg {
+  fill: var(--bs-warning-border-subtle);
+  stroke: var(--bs-warning-border-subtle);
+}
+
 .shadow-filter {
   filter:
     drop-shadow(0 5px 5px rgba(0, 0, 0, 0.3))
@@ -463,15 +475,18 @@ $cond-text: (
   );
 }
 
-.inventory-button {
+.inventory-button, .btn-vendor {
-  margin-bottom: -2.25rem;
-  margin-right: -0.5rem;
-  z-index: 2;
   background-color: hsl(262, 47%, 55%);
   color: #fff;
 }
 
-.inventory-button:hover {
+.inventory-button {
+  margin-bottom: -2.25rem;
+  margin-right: -0.5rem;
+  z-index: 2;
+}
+
+.inventory-button:hover, .btn-vendor:hover {
   background-color: hsl(262, 39%, 40%);
   color: #fff;
 }

src/pages/dashboard.astro

@@ -9,7 +9,7 @@ import FirstEditionIcon from "../components/FirstEditionIcon.astro";
 // skus mirror the real shape: marketPrice is in cents (÷100 = dollars).
 const inventory = [
   {
-    productId: "3830",
+    productId: "42382",
     productName: "Charizard",
     setName: "Base Set",
     setCode: "BS",
@@ -28,7 +28,7 @@ const inventory = [
     ],
   },
   {
-    productId: "3959",
+    productId: "146682",
     productName: "Pikachu",
     setName: "Shining Legends",
     setCode: "SLG",
@@ -47,26 +47,7 @@ const inventory = [
     ],
   },
   {
-    productId: "3729",
+    productId: "246723",
-    productName: "Mewtwo",
-    setName: "Fossil",
-    setCode: "FO",
-    number: "10/62",
-    rarityName: "Rare Holo",
-    energyType: "Psychic",
-    variant: "Normal",
-    qty: 1,
-    purchasePrice: 12000,
-    skus: [
-      { condition: "Near Mint", marketPrice: 13000 },
-      { condition: "Lightly Played", marketPrice: 10000 },
-      { condition: "Moderately Played", marketPrice: 7200 },
-      { condition: "Heavily Played", marketPrice: 4500 },
-      { condition: "Damaged", marketPrice: 2500 },
-    ],
-  },
-  {
-    productId: "4114",
     productName: "Umbreon VMAX",
     setName: "Evolving Skies",
     setCode: "EVS",
@@ -85,7 +66,7 @@ const inventory = [
     ],
   },
   {
-    productId: "3887",
+    productId: "197660",
     productName: "Gyarados",
     setName: "Hidden Fates",
     setCode: "HIF",
@@ -104,7 +85,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4201",
+    productId: "246733",
     productName: "Rayquaza VMAX",
     setName: "Evolving Skies",
     setCode: "EVS",
@@ -123,7 +104,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4055",
+    productId: "264218",
     productName: "Eevee",
     setName: "Sword & Shield",
     setCode: "SSH",
@@ -142,7 +123,7 @@ const inventory = [
     ],
   },
   {
-    productId: "3991",
+    productId: "451834",
     productName: "Lugia V",
     setName: "Silver Tempest",
     setCode: "SIT",
@@ -161,7 +142,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4301",
+    productId: "106997",
     productName: "Blastoise",
     setName: "Base Set",
     setCode: "BS",
@@ -180,26 +161,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4302",
+    productId: "253265",
-    productName: "Venusaur",
-    setName: "Base Set",
-    setCode: "BS",
-    number: "15/102",
-    rarityName: "Rare Holo",
-    energyType: "Grass",
-    variant: "1st Edition",
-    qty: 1,
-    purchasePrice: 22000,
-    skus: [
-      { condition: "Near Mint", marketPrice: 19500 },
-      { condition: "Lightly Played", marketPrice: 15000 },
-      { condition: "Moderately Played", marketPrice: 10500 },
-      { condition: "Heavily Played", marketPrice: 6500 },
-      { condition: "Damaged", marketPrice: 3500 },
-    ],
-  },
-  {
-    productId: "4303",
     productName: "Espeon VMAX",
     setName: "Evolving Skies",
     setCode: "EVS",
@@ -218,7 +180,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4304",
+    productId: "253266",
     productName: "Gengar VMAX",
     setName: "Fusion Strike",
     setCode: "FST",
@@ -237,7 +199,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4305",
+    productId: "226432",
     productName: "Pikachu VMAX",
     setName: "Vivid Voltage",
     setCode: "VIV",
@@ -256,45 +218,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4306",
+    productId: "253275",
-    productName: "Alakazam",
-    setName: "Base Set",
-    setCode: "BS",
-    number: "1/102",
-    rarityName: "Rare Holo",
-    energyType: "Psychic",
-    variant: "Shadowless",
-    qty: 2,
-    purchasePrice: 9500,
-    skus: [
-      { condition: "Near Mint", marketPrice: 12000 },
-      { condition: "Lightly Played", marketPrice: 9300 },
-      { condition: "Moderately Played", marketPrice: 6600 },
-      { condition: "Heavily Played", marketPrice: 4100 },
-      { condition: "Damaged", marketPrice: 2200 },
-    ],
-  },
-  {
-    productId: "4307",
-    productName: "Sylveon VMAX",
-    setName: "Evolving Skies",
-    setCode: "EVS",
-    number: "212/203",
-    rarityName: "Secret Rare",
-    energyType: "Psychic",
-    variant: "Alternate Art",
-    qty: 1,
-    purchasePrice: 6800,
-    skus: [
-      { condition: "Near Mint", marketPrice: 8500 },
-      { condition: "Lightly Played", marketPrice: 6700 },
-      { condition: "Moderately Played", marketPrice: 4800 },
-      { condition: "Heavily Played", marketPrice: 3000 },
-      { condition: "Damaged", marketPrice: 1500 },
-    ],
-  },
-  {
-    productId: "4308",
     productName: "Mew VMAX",
     setName: "Fusion Strike",
     setCode: "FST",
@@ -313,7 +237,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4309",
+    productId: "478077",
     productName: "Darkrai VSTAR",
     setName: "Astral Radiance",
     setCode: "ASR",
@@ -332,7 +256,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4310",
+    productId: "477060",
     productName: "Leafeon VSTAR",
     setName: "Pokémon GO",
     setCode: "PGO",
@@ -351,64 +275,7 @@ const inventory = [
     ],
   },
   {
-    productId: "4311",
+    productId: "478100",
-    productName: "Snorlax",
-    setName: "Celebrations",
-    setCode: "CEL",
-    number: "005/025",
-    rarityName: "Rare Holo",
-    energyType: "Colorless",
-    variant: "Classic Collection",
-    qty: 6,
-    purchasePrice: 600,
-    skus: [
-      { condition: "Near Mint", marketPrice: 750 },
-      { condition: "Lightly Played", marketPrice: 580 },
-      { condition: "Moderately Played", marketPrice: 420 },
-      { condition: "Heavily Played", marketPrice: 260 },
-      { condition: "Damaged", marketPrice: 130 },
-    ],
-  },
-  {
-    productId: "4312",
-    productName: "Articuno",
-    setName: "Fossil",
-    setCode: "FO",
-    number: "2/62",
-    rarityName: "Rare Holo",
-    energyType: "Water",
-    variant: "1st Edition",
-    qty: 1,
-    purchasePrice: 14000,
-    skus: [
-      { condition: "Near Mint", marketPrice: 11500 },
-      { condition: "Lightly Played", marketPrice: 9000 },
-      { condition: "Moderately Played", marketPrice: 6400 },
-      { condition: "Heavily Played", marketPrice: 4000 },
-      { condition: "Damaged", marketPrice: 2200 },
-    ],
-  },
-  {
-    productId: "4313",
-    productName: "Radiant Charizard",
-    setName: "Pokemon GO",
-    setCode: "PGO",
-    number: "011/078",
-    rarityName: "Radiant Rare",
-    energyType: "Fire",
-    variant: "Normal",
-    qty: 2,
-    purchasePrice: 2800,
-    skus: [
-      { condition: "Near Mint", marketPrice: 4200 },
-      { condition: "Lightly Played", marketPrice: 3300 },
-      { condition: "Moderately Played", marketPrice: 2400 },
-      { condition: "Heavily Played", marketPrice: 1500 },
-      { condition: "Damaged", marketPrice: 800 },
-    ],
-  },
-  {
-    productId: "4314",
     productName: "Giratina VSTAR",
     setName: "Lost Origin",
     setCode: "LOR",
@@ -448,7 +315,7 @@ const totalGain = inventory.reduce((s, c) => s + gain(c) * c.qty, 0);
       <div class="d-flex justify-content-between align-items-center">
         <h6 class="mb-0 text-uppercase text-secondary fw-bold ls-wide" style="letter-spacing:.08em">Catalogs</h6>
         <button
-          class="btn btn-sm btn-info fs-7"
+          class="btn btn-sm btn-success fs-7"
           title="New catalog"
           type="button"
           data-bs-toggle="modal"
@@ -509,7 +376,7 @@ const totalGain = inventory.reduce((s, c) => s + gain(c) * c.qty, 0);
 
         <button
           type="button"
-          class="btn btn-sm btn-info"
+          class="btn btn-sm btn-vendor"
           data-bs-toggle="modal"
           data-bs-target="#addCardModal"
         >+ Add Card</button>
@@ -519,7 +386,7 @@ const totalGain = inventory.reduce((s, c) => s + gain(c) * c.qty, 0);
           class="btn btn-sm btn-outline-light"
           data-bs-toggle="modal"
           data-bs-target="#bulkImportModal"
-        >⬆ CSV Import</button>
+        >Bulk Import</button>
 
         <div class="ms-auto position-relative">
           <input
@@ -557,7 +424,7 @@ const totalGain = inventory.reduce((s, c) => s + gain(c) * c.qty, 0);
                     data-bs-target="#cardModal"
                   >
                     <div
-                      class="image-grow rounded-4 card-image"
+                      class="rounded-4 card-image"
                       data-energy={card.energyType}
                       data-rarity={card.rarityName}
                       data-variant={card.variant}
@@ -577,14 +444,10 @@ const totalGain = inventory.reduce((s, c) => s + gain(c) * c.qty, 0);
                     </div>
                   </div>
                   <div class="d-flex flex-row justify-content-between my-1 align-items-center">
-                    <div class="btn-group" role="group" aria-label="Quantity controls">
+                      <input type="number" class="form-control text-center" style="max-width: 50%;" value="1" min="1" max="999" aria-label="Quantity input" aria-describedby="button-minus button-plus">
-                      <button type="button" class="btn btn-outline-secondary btn-sm">−</button>
+                    <div class="" aria-label="Edit controls">
-                      <button type="button" class="btn btn-outline-secondary btn-sm" tabindex="-1">2</button>
+                      <button type="button" class="btn btn-outline-warning btn-sm"><svg class="edit-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path d="M100.4 417.2C104.5 402.6 112.2 389.3 123 378.5L304.2 197.3L338.1 163.4C354.7 180 389.4 214.7 442.1 267.4L476 301.3L442.1 335.2L260.9 516.4C250.2 527.1 236.8 534.9 222.2 539L94.4 574.6C86.1 576.9 77.1 574.6 71 568.4C64.9 562.2 62.6 553.3 64.9 545L100.4 417.2zM156 413.5C151.6 418.2 148.4 423.9 146.7 430.1L122.6 517L209.5 492.9C215.9 491.1 221.7 487.8 226.5 483.2L155.9 413.5zM510 267.4C493.4 250.8 458.7 216.1 406 163.4L372 129.5C398.5 103 413.4 88.1 416.9 84.6C430.4 71 448.8 63.4 468 63.4C487.2 63.4 505.6 71 519.1 84.6L554.8 120.3C568.4 133.9 576 152.3 576 171.4C576 190.5 568.4 209 554.8 222.5C551.3 226 536.4 240.9 509.9 267.4z"/></svg></button>
-                      <button type="button" class="btn btn-outline-secondary btn-sm">+</button>
+                      <button type="button" class="btn btn-outline-danger btn-sm"><svg class="delete-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path d="M232.7 69.9L224 96L128 96C110.3 96 96 110.3 96 128C96 145.7 110.3 160 128 160L512 160C529.7 160 544 145.7 544 128C544 110.3 529.7 96 512 96L416 96L407.3 69.9C402.9 56.8 390.7 48 376.9 48L263.1 48C249.3 48 237.1 56.8 232.7 69.9zM512 208L128 208L149.1 531.1C150.7 556.4 171.7 576 197 576L443 576C468.3 576 489.3 556.4 490.9 531.1L512 208z"/></svg></button>
-                    </div>
-                    <div class="btn-group" role="group" aria-label="Quantity controls">
-                      <button type="button" class="btn btn-outline-secondary btn-sm">Edit</button>
-                      <button type="button" class="btn btn-outline-danger btn-sm"><svg class="delete-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="var(--bs-danger)" width="1.25rem"><path d="M232.7 69.9L224 96L128 96C110.3 96 96 110.3 96 128C96 145.7 110.3 160 128 160L512 160C529.7 160 544 145.7 544 128C544 110.3 529.7 96 512 96L416 96L407.3 69.9C402.9 56.8 390.7 48 376.9 48L263.1 48C249.3 48 237.1 56.8 232.7 69.9zM512 208L128 208L149.1 531.1C150.7 556.4 171.7 576 197 576L443 576C468.3 576 489.3 556.4 490.9 531.1L512 208z"/></svg></button>
                     </div>
                   </div>
                   <div class="d-flex flex-row mt-1">