Module:Sandbox/LVL: Difference between revisions

LVL (talk | contribs)
No edit summary
LVL (talk | contribs)
No edit summary
Line 526: Line 526:
-- First column in each row is hero name. Make it sticky to the left for horizontal scrolling.
-- First column in each row is hero name. Make it sticky to the left for horizontal scrolling.
-- Added explicit background-color and a box-shadow for better UX.
-- Explicit background-color prevents scrolling content from showing through. z-index helps with stacking.
local hero_cell_style = 'style="position: sticky; left: 0; background-color: #f8f9fa; box-shadow: 2px 0 5px -2px rgba(0,0,0,0.2);"'
row_str = row_str .. '<td style="position: sticky; left: 0; background-color: #ffffff; z-index: 1;">' .. hero_icon .. "</td>"
row_str = row_str .. "<td " .. hero_cell_style .. ">" .. hero_icon .. "</td>"
-- Consecutive columns are then stats
-- Consecutive columns are then stats
Line 595: Line 594:
-- First header is Hero. The top-left corner cell needs to be sticky in both directions.
-- First header is Hero. The top-left corner cell needs to be sticky in both directions.
-- z-index: 2 ensures it's on top of other sticky cells. Added explicit background and shadow.
-- z-index: 2 ensures it's on top of other sticky cells. Background color matches standard wikitable headers.
local hero_header_style = 'style="position: sticky; top: 0; left: 0; z-index: 2; background-color: #eaecf0; box-shadow: 2px 0 5px -2px rgba(0,0,0,0.2);"'
local headers_str = '<th style="position: sticky; top: 0; left: 0; z-index: 2; background-color: #eaecf0;">' .. "Hero" .. "</th>"
local headers_str = "<th " .. hero_header_style .. ">" .. "Hero" .. "</th>"
local header_style = ""
local category_data = attribute_module.get_category_data()
local category_data = attribute_module.get_category_data()
local postfix
local postfix
Line 617: Line 614:
-- Iterate stats again for displaying headers with their respective color
-- Iterate stats again for displaying headers with their respective color
for _, category in ipairs(attribute_orders["category_order"]) do
for _, category in ipairs(attribute_orders["category_order"]) do
category_attrs = attributes_data[category]
local category_attrs = attributes_data[category]
category_rgb = category_data[category]["rgb"]
local category_rgb = category_data[category]["rgb"]
-- Iterate attributes within the category
-- Iterate attributes within the category
if (stats_to_include[category] ~= nil) then  
if (stats_to_include[category] ~= nil) then  
-- Define style once per category for efficiency
local header_style = ' style="position: sticky; top: 0; z-index: 1; background-color: rgb(' .. category_rgb .. ');"'
for _, attr_key in ipairs(stats_to_include[category]) do
for _, attr_key in ipairs(stats_to_include[category]) do
attr_data = category_attrs[attr_key]
local attr_data = category_attrs[attr_key]
local attr_localized
if (attr_data ~= nil) then
if (attr_data ~= nil) then
Line 647: Line 648:
end
end
end
end
-- Make header cells sticky to the top (for vertical scrolling). z-index: 1 keeps them above the body but below the corner cell.
header_style = ' style="position: sticky; top: 0; z-index: 1; background-color: ' .. "rgb(" .. category_rgb .. ') ;"'
headers_str = headers_str .. "<th" .. header_style .. ">" .. attr_localized .. postfix .. "</th>"
headers_str = headers_str .. "<th" .. header_style .. ">" .. attr_localized .. postfix .. "</th>"