LMMS / LMMS/lmms.io

Dynamic theming + dark theme

Open
#398 3 comments 1 reaction 1 assignee Claimed by @headquarter8302 View on GitHub
design enhancement
Dominant language
PHP
Stars
115
Forks
60
Avg merge
14h 5m
Merged PRs (30d)
1

Description

I've been given the greenlight on the Discord by @tresf to start working on a dark theme with an added feature of automatic system theme detection.

This issue ticket will be used to track progress, discuss changes, also so that the PR wouldn't dangle without an attached issue.

# To-do
- [x] Implement the dark theme completely in CSS/SCSS. Without doing additional changes to server logic or scripting

## Changes
- Darkened jumbotron's green tint
- Apply LMMS's dark tint to every background/neutral surface
- Buttons on the download page
- Made all theme changes responsive to the user's preferred color scheme. This can be observed by using the Rendering tab's "Emulate CSS media feature prefers-color-scheme" in your browser's Devtool

# Pages done
- `index`
- ![index](https://github.com/user-attachments/assets/6f6f692c-0991-4896-934d-ee3b7663a32e)
- `download`
- ![download](https://github.com/user-attachments/assets/1d258b83-baf0-4464-8613-09b5710149b8)
- `get-involved`
- ![get-involved](https://github.com/user-attachments/assets/4b6d91bc-c4ba-484e-bdb8-173bbd1ddcb3)
- `showcase`
- ![showcase](https://github.com/user-attachments/assets/2d60c6fc-7041-4c86-b38d-7570d38d6bdf)
- `branding`
- ![Image](https://github.com/user-attachments/assets/0573e1f8-c923-4b77-8842-ed75826d0f46)
- `lsp`
- ![lsp-index](https://github.com/user-attachments/assets/9a55be4a-1153-4420-bde9-bf061db3e742)
- ![lsp-post](https://github.com/user-attachments/assets/3d626293-4b38-4722-9283-a6edc6d8ea09)

# Difficulties
1. ~~**I've been unable to properly make styles for LSP**, since it wouldn't build the database. Nor am I confident that an empty DB would produce all the possible layouts and elements for the styling. This is a blocker before the PR can be merged~~ I've found a way to style LSP without building
2. It is a pain in the ass to set this up on Windows. I am definitely going to make build steps for Windows after this

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.