Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[feature] User-selectable preset CSS themes for accounts #2777

Merged
merged 10 commits into from
Mar 25, 2024

Conversation

tsmethurst
Copy link
Contributor

@tsmethurst tsmethurst commented Mar 22, 2024

Description

If this is a code change, please include a summary of what you've coded, and link to the issue(s) it closes/implements.

If this is a documentation change, please briefly describe what you've changed and why.

This pull request adds functionality for user-selectable preset CSS themes, and includes some themes to start with.

Themes are parsed from web/assets/themes on startup, and pointers to parsed theme info are stored in the accounts processor, retrieved using the new /api/v1/accounts/themes endpoint, and set along with other settings using /api/v1/accounts/update_credentials. Theme CSS files themselves are served from the assets folder along with other assets (and therefore get etag stuff too).

Documentation added for how to select a theme, and how to add new themes (for admins).

Some screenshots!

Settings panel:

Settings panel

Dark blurple:

Dark blurple

Light blurple:

Light blurple

Midnight trip:

Midnight trip

Soft:

Soft

Sunset light:

Sunset light

Checklist

Please put an x inside each checkbox to indicate that you've read and followed it: [ ] -> [x]

If this is a documentation change, only the first checkbox must be filled (you can delete the others if you want).

  • I/we have read the GoToSocial contribution guidelines.
  • I/we have discussed the proposed changes already, either in an issue on the repository, or in the Matrix chat.
  • I/we have not leveraged AI to create the proposed changes.
  • I/we have performed a self-review of added code.
  • I/we have written code that is legible and maintainable by others.
  • I/we have commented the added code, particularly in hard-to-understand areas.
  • I/we have made any necessary changes to documentation.
  • I/we have added tests that cover new code.
  • I/we have run tests and they pass locally with the changes.
  • I/we have run go fmt ./... and golangci-lint run.

@daenney
Copy link
Member

daenney commented Mar 25, 2024

These themes are awesome! 💜

@daenney
Copy link
Member

daenney commented Mar 25, 2024

The one thing I'm wondering is if it would make the implementation simpler if we extracted the current default theme as a "user" theme too, and then in the migration set that value. Then you don't have to deal with things being optional/unset/empty in the DB and the various structs.

That may also make it easier for folks who like the official theme but want to tweak it a bit to work from?

@tsmethurst
Copy link
Contributor Author

extracted the current default theme as a "user" theme too

Mmm that would be a very good idea for a future change! It's quite a lot of work unfortunately because the official theme is really a combination of a bunch of the basic stuff, and the colors etc are defined quite high up in the cascade, so pulling them out will be a bit of a headache. In other words, it's something we should do as part of a proper refactor I think.

Copy link
Member

@daenney daenney left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Gimme themes 🚀


// Convert themes to apimodel.
themes := make([]apimodel.Theme, len(gtsThemes.SortedByTitle))
for i, gtsTheme := range gtsThemes.SortedByTitle {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think it's probably worth moving this to the typeconverter package just for conformity. though probably not something that needs to be a method receiver to the Converter{} type itself, just a regular package function

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

and i assume probably worth making the account function instead return api theme models too, just to fit with how a lot of it is already done. what do you think??

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mmm yes, I will change it!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done: 54d53a1

@@ -140,16 +140,31 @@ func (m *Module) profileGETHandler(c *gin.Context) {
return
}

// Basic profile stylesheets.
stylesheets := []string{
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

not that important, but you could preallocate the slice here with stylesheets = make([]string, 5, 6); stylesheets[0] = ...; stylesheets[1] = ...'; etc.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mmm I tried and it came out a bit messy, so I compromised by preallocating the total size but still appending. I think that's probably fine for this case :P

@@ -138,16 +138,31 @@ func (m *Module) threadGETHandler(c *gin.Context) {
return
}

// Basic thread stylesheets.
stylesheets := []string{
cssFA, cssStatus, cssThread,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

same as above (though 4,5)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See above.

@NyaaaWhatsUpDoc
Copy link
Member

very nice work, excited to try this 👀

@NyaaaWhatsUpDoc NyaaaWhatsUpDoc merged commit 8953f57 into main Mar 25, 2024
3 checks passed
@NyaaaWhatsUpDoc NyaaaWhatsUpDoc deleted the preset_css_themes branch March 25, 2024 17:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants