FFXIV Wiki:Update site CSS, main page, & sidebar

From Final Fantasy XIV Online Wiki
Jump to navigation Jump to search
Project description
Refresh the wiki's CSS, update the sidebar, and make the landing page more functional.
Members
Cryebunnie (talk), Erin Umbreon (talk)
Status
In progress
Last updated
26 August
Discussion
Talk page
Discord threads
Update default Vector Skin CSS, Update wiki Main Page & sidebar

Goals

  1. Update the wiki's main page:
    • Feature commonly looked for links
    • Include a clear 'How to Help' section on the main page
  2. Update the wiki's sidebar navigation to:
    • Reduce length
    • Contain high-use links
    • Be more accessible to site users
  3. Update the wiki's overall look through CSS to:
    • Create a consistent visual cohesion across the wiki
    • Be easily adaptable between light and dark mode
    • Convey a clear relation to FFXIV through color & style

Resources

Tasks

Site CSS

Dark theme

  • Add dark theme tweaks for interfaces added by the user profile extension
    Assignee: Erin Umbreon (talk)
  • Move CSS for {{Recipe}} to templatestyles
    Assignee: Erin Umbreon (talk)
  • Update {{Recipe}} dark theme colors to more closely match light theme
  • Make weapon/armor/accessory params compatable with Meteor Dark
  • Update new {{STDT}} dark theme colors to more closely match the old colors
    Assignee: Tempest Dawn (talk)

Mobile

This is complicated because the Theme Toggle extension uses a different set of CSS classes for light/dark/etc theme presentation from the classes adopted by Minerva/Vector 2022.

  • Theme toggle: .view-light, .view-dark, OS pref → light/dark class is applied for you
  • Minerva: .skin-theme-clientpref-night, OS pref → .skin-theme-clientpref-os (manual media query is required)
  • Currently our template stylesheets are mostly standardized around .theme-dark for setting dark theme styles, I think.

Potential solution: a gadget that translates all these classes and ensures the one set we standardize on is always present on the page when appropriate

  • this probably takes the form of a custom minerva-specific theme picker gadget that implements the Theme Picker API + hiding Minerva/MobileFrontend's theme picker controls from the settings menu entirely

Erin Umbreon (she/it • talk) 22:47, 25 August 2026 (UTC)

  • Additional gadget configuration options for right sidebar and other new Vector features
    Assignee: Erin Umbreon (talk)

Mainpage Tasks

Mainpage prototype: User:Erin_Umbreon/Sandbox/Main_page_rewrite
Mainpage content: User:Erin_Umbreon/Sandbox/Main_page_rewrite/Content

Additional Followup

  • Add collapsible functionality to sidebar sections, similar to Minecraft Wiki
  • Investigate skin usage and potentially remove some skins from the wiki
    Assignee: Erin Umbreon (talk)
    • This is inspired by wiki.gg only supporting Vector Legacy on their wikis, and even using custom CSS to make it responsive rather than using Minerva Neue. Less skins means less CSS edge cases and less nitpicking which styles should go in Common.css / Vector.css / etc
    • This would also greatly simplify the mobile/dark theme issues above if we can get rid of Minerva completely. However I don't think that's going to happen - Erin Umbreon (she/it • talk) 22:47, 25 August 2026 (UTC)
  • Make navboxes compatible with mobile, similar to Minecraft Wiki
  • Update navbox and infobox styles to be more congruent with the Meteor theme

Completed tasks

CSS tasks

Dark theme stuff

  • 🗹 Rearrange content of sidebar links to be more useful (have high access links at top like Main/Random/Special, etc.)
    Assignee: Cryebunnie (talk)
  • 🗹 Implement right sidebar gadget
    Assignee: Erin Umbreon (talk)
  • 🗹 Fix fixed-width toggle CSS to not conflict with right sidebar gadget's styles
    Assignee: Erin Umbreon (talk)

Mainpage Tasks