OOKNET                             [ /  search the index  ]  
──────────────────────────────────────────────────────────────────────────────────────
══════════════════════════════════════════════════════════════════════════════════════
OOKNET   [ /  search  ]  
────────────────────────────────────────────────
════════════════════════════════════════════════
 
HASH      31632c0b0583
DATE      2025-07-27
SUBJECT   sim: bump all
FILES     3 CHANGED
HASH      31632c0b0583
DATE      2025-07-27
SUBJECT   sim: bump all
FILES     3 CHANGED
 

diff --git a/flake.lock b/flake.lock
index 47a8c2c..afe60df 100644
--- a/flake.lock
+++ b/flake.lock
@@ -85,11 +85,11 @@
         ]
       },
       "locked": {
-        "lastModified": 1753526276,
-        "narHash": "sha256-XIqrgUb8ml9t2oEE6tuCMnVX6TtzSYa9aujtAe6r+jg=",
+        "lastModified": 1753609362,
+        "narHash": "sha256-C+zPES4XCbKMNP9tKNPgOt68Vh5ISvWloIe2jgAC5jM=",
         "owner": "ooks-io",
         "repo": "mop",
-        "rev": "49e2efe1a9b8f68e049f874142a25ce7f2e076a1",
+        "rev": "2dddc6c3ad72839f0c0042ef2bfc42156dd5fae8",
         "type": "github"
       },
       "original": {

diff --git a/flake.lock b/flake.lock
index 47a8c2c..afe60df 100644
--- a/flake.lock
+++ b/flake.lock
@@ -85,11 +85,11 @@
         ]
       },
       "locked": {
-        "lastModified": 1753526276,
-        "narHash": "sha256-XIqrgUb8ml9t2oEE
6tuCMnVX6TtzSYa9aujtAe6r+jg=",
+        "lastModified": 1753609362,
+        "narHash": "sha256-C+zPES4XCbKMNP9t
KNPgOt68Vh5ISvWloIe2jgAC5jM=",
         "owner": "ooks-io",
         "repo": "mop",
-        "rev": "49e2efe1a9b8f68e049f874142a
25ce7f2e076a1",
+        "rev": "2dddc6c3ad72839f0c0042ef2bf
c42156dd5fae8",
         "type": "github"
       },
       "original": {
 

diff --git a/web/src/layouts/ChartLayout.astro b/web/src/layouts/ChartLayout.astro
index 4164ef0..2faf73f 100644
--- a/web/src/layouts/ChartLayout.astro
+++ b/web/src/layouts/ChartLayout.astro
@@ -345,7 +345,7 @@ const isFixedClassSpec = fixedClass && fixedSpec;
         grid-column: 1 / -1;
         margin-top: 12px;
         padding: 16px;
-        background-color: rgba(255,255,255,0.03);
+        background-color: var(--bg-selection); 
         border-radius: 6px;
         border: 1px solid rgba(255,255,255,0.1);
         display: none;
@@ -488,7 +488,7 @@ const isFixedClassSpec = fixedClass && fixedSpec;
       }
 
       .equipment-detail {
-        color: var(--text-muted);
+        color: #1eff00;
         font-size: 0.8em;
         line-height: 1.2;
       }
@@ -763,10 +763,13 @@ const formatLoadout = (loadout) => {
   }
   
   // Talents & Glyphs
-  if (loadout.talentsString || loadout.glyphs) {
+  if (loadout.talents || loadout.glyphs) {
     const items = [];
-    if (loadout.talentsString) {
-      items.push({ label: 'Talents', value: loadout.talentsString, isSpecial: 'ta
lents' });
+    if (loadout.talents) {
+      const talentItems = formatTalents(loadout.talents);
+      if (talentItems && talentItems.length > 0) {
+        items.push(...talentItems);
+      }
     }
     if (loadout.glyphs) {
       const glyphItems = formatGlyphs(loadout.glyphs);
@@ -803,6 +806,30 @@ const formatClass = (className) => {
   return className.replace('Class', '').replace(/([A-Z])/g, ' $1').trim();
 };
 
+const formatTalents = (talents) => {
+  const talentItems = [];
+  if (talents && talents.talents && Array.isArray(talents.talents)) {
+    talents.talents.forEach(talent => {
+      const iconUrl = talent.icon 
+        ? `https://wow.zamimg.com/images/wow/icons/large/${talent.icon}.jpg`
+        : null;
+      const spellId = talent.spellId;
+      const wowheadUrl = spellId 
+        ? `https://www.wowhead.com/mop-classic/spell=${spellId}`
+        : null;
+      
+      talentItems.push({
+        label: `Tier ${talent.tier}`,
+        value: talent.name,
+        iconUrl: iconUrl,
+        wowheadUrl: wowheadUrl,
+        isTalent: true
+      });
+    });
+  }
+  return talentItems;
+};
+
 const formatGlyphs = (glyphs) => {
   const glyphItems = [];
   ['major1', 'major2', 'major3', 'minor1', 'minor2', 'minor3'].forEach(slot => {
@@ -959,7 +986,7 @@ const generateLoadoutDropdown = (loadout, chartData) => {
         const valueClass = item.isSpecial === 'talents' ? 'loadout-value loadout-
talents' : 'loadout-value';
         
         let valueContent;
-        if ((item.isItem || item.isGlyph) && item.wowheadUrl) {
+        if ((item.isItem || item.isGlyph || item.isTalent) && item.wowheadUrl) {
           const iconHtml = item.iconUrl 
             ? `<img src="${item.iconUrl}" alt="${item.value}" class="consumable-i
con" loading="lazy" />`
             : '';

diff --git a/web/src/layouts/ChartLayout.ast
ro b/web/src/layouts/ChartLayout.astro
index 4164ef0..2faf73f 100644
--- a/web/src/layouts/ChartLayout.astro
+++ b/web/src/layouts/ChartLayout.astro
@@ -345,7 +345,7 @@ const isFixedClassSpec =
 fixedClass && fixedSpec;
         grid-column: 1 / -1;
         margin-top: 12px;
         padding: 16px;
-        background-color: rgba(255,255,255,
0.03);
+        background-color: var(--bg-selectio
n); 
         border-radius: 6px;
         border: 1px solid rgba(255,255,255,
0.1);
         display: none;
@@ -488,7 +488,7 @@ const isFixedClassSpec =
 fixedClass && fixedSpec;
       }
 
       .equipment-detail {
-        color: var(--text-muted);
+        color: #1eff00;
         font-size: 0.8em;
         line-height: 1.2;
       }
@@ -763,10 +763,13 @@ const formatLoadout = 
(loadout) => {
   }
   
   // Talents & Glyphs
-  if (loadout.talentsString || loadout.glyp
hs) {
+  if (loadout.talents || loadout.glyphs) {
     const items = [];
-    if (loadout.talentsString) {
-      items.push({ label: 'Talents', value:
 loadout.talentsString, isSpecial: 'talents'
 });
+    if (loadout.talents) {
+      const talentItems = formatTalents(loa
dout.talents);
+      if (talentItems && talentItems.length
 > 0) {
+        items.push(...talentItems);
+      }
     }
     if (loadout.glyphs) {
       const glyphItems = formatGlyphs(loado
ut.glyphs);
@@ -803,6 +806,30 @@ const formatClass = (cl
assName) => {
   return className.replace('Class', '').rep
lace(/([A-Z])/g, ' $1').trim();
 };
 
+const formatTalents = (talents) => {
+  const talentItems = [];
+  if (talents && talents.talents && Array.i
sArray(talents.talents)) {
+    talents.talents.forEach(talent => {
+      const iconUrl = talent.icon 
+        ? `https://wow.zamimg.com/images/wo
w/icons/large/${talent.icon}.jpg`
+        : null;
+      const spellId = talent.spellId;
+      const wowheadUrl = spellId 
+        ? `https://www.wowhead.com/mop-clas
sic/spell=${spellId}`
+        : null;
+      
+      talentItems.push({
+        label: `Tier ${talent.tier}`,
+        value: talent.name,
+        iconUrl: iconUrl,
+        wowheadUrl: wowheadUrl,
+        isTalent: true
+      });
+    });
+  }
+  return talentItems;
+};
+
 const formatGlyphs = (glyphs) => {
   const glyphItems = [];
   ['major1', 'major2', 'major3', 'minor1', 
'minor2', 'minor3'].forEach(slot => {
@@ -959,7 +986,7 @@ const generateLoadoutDro
pdown = (loadout, chartData) => {
         const valueClass = item.isSpecial =
== 'talents' ? 'loadout-value loadout-talent
s' : 'loadout-value';
         
         let valueContent;
-        if ((item.isItem || item.isGlyph) &
& item.wowheadUrl) {
+        if ((item.isItem || item.isGlyph ||
 item.isTalent) && item.wowheadUrl) {
           const iconHtml = item.iconUrl 
             ? `<img src="${item.iconUrl}" a
lt="${item.value}" class="consumable-icon" l
oading="lazy" />`
             : '';
 

diff --git a/web/src/styles/global.css b/web/src/styles/global.css
index 34fb94f..f2b43a2 100644
--- a/web/src/styles/global.css
+++ b/web/src/styles/global.css
@@ -2,6 +2,7 @@
   --highlight-color: #d8a657;
   --bg-primary: #282828;
   --bg-secondary: #32302f;
+  --bg-selection: #32302f;
   --border-color: #4a4a4a;
   --text-primary: #ffffff;
   --text-secondary: #aaaaaa;

diff --git a/web/src/styles/global.css b/web
/src/styles/global.css
index 34fb94f..f2b43a2 100644
--- a/web/src/styles/global.css
+++ b/web/src/styles/global.css
@@ -2,6 +2,7 @@
   --highlight-color: #d8a657;
   --bg-primary: #282828;
   --bg-secondary: #32302f;
+  --bg-selection: #32302f;
   --border-color: #4a4a4a;
   --text-primary: #ffffff;
   --text-secondary: #aaaaaa;
 
[ BACK TO LOG ]
──────────────────────────────────────────────────────────────────────────────────────
OOKNET
────────────────────────────────────────────────
OOKNET