violet-void-theme

A dark Violet-Void theme for ArchWiki that applies a consistent, handcrafted color palette.

Description

This theme replaces the default ArchWiki appearance with a dark, violet-themed interface designed for readability and aesthetics. It includes:

• A consistent color palette.
• Customized syntax highlighting for code blocks.
• Modernized UI elements (buttons, inputs, tables).
• Responsive design adjustments.
• Accessibility features (focus indicators, reduced motion support).
• Comprehensive coverage across all Arch Linux sites.

Features

• Full Arch Linux Ecosystem Support: Works on wiki.archlinux.org, bbs.archlinux.org, aur.archlinux.org, and more
• Accessibility First: Proper focus indicators, reduced motion support, screen reader optimizations
• Responsive Design: Adapts to all screen sizes from desktop to mobile
• Print-Friendly: Optimized print styles for paper and PDF exports
• Performance Optimized: Minimal CSS footprint with efficient selectors
• Regular Updates: Actively maintained with continuous improvements

Changelog

See CHANGELOG.md for a complete history of changes.

Installation

Using Stylus Extension

1. Install the Stylus browser extension (Chrome, Firefox).
2. Click on the extension icon and select "Manage".
3. Create a new style.
4. Copy the contents of dist/main.css (or build it yourself) into the editor.
5. Set the domain to wiki.archlinux.org.
6. Save and enjoy!

Development

Prerequisites

• Node.js (v14 or later recommended)
• npm

Setup

1. Clone the repository:

   git clone https://github.com/aaronedev/violet-void-theme.git
   cd violet-void-theme

2. Install dependencies:

   npm install

Build

To compile the Stylus files into CSS:

npm run build

The output file will be located at dist/main.css.

Watch

To automatically recompile changes during development:

npm run watch

Lint & Format

Check for style issues:

npm run lint

Format code:

npm run format

License

MIT © aaronedev