Commit Graph

4 Commits

Author SHA1 Message Date
Jordan Vidrine
f902e0fdd7
UX: Look and feel changes (#29245)
Some checks are pending
Licenses / run (push) Waiting to run
Linting / run (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (annotations, core) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (backend, core) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (backend, plugins) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (frontend, plugins) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (frontend, themes) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, chat) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, core) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, plugins) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, themes) (push) Waiting to run
Tests / core frontend (${{ matrix.browser }}) (Chrome) (push) Waiting to run
Tests / core frontend (${{ matrix.browser }}) (Firefox ESR) (push) Waiting to run
Tests / core frontend (${{ matrix.browser }}) (Firefox Evergreen) (push) Waiting to run
This PR:

- Removes components from being displayed in the card
- Adds a DMenu to house previous footer actions
- Allows themes to be updated from this grid, with an animation and different border to show the update is happening
- Stops position of cards changing when default changes
- Fixes outline colour not changing when default changes
- Show a global notice on the page when previewing a theme
- Allows updating a theme from the grid, and showing an indicator of what theme needs to be updated
- Moves "Set as default" to the dropdown for the theme
- Show screenshot for theme if it is available
- Prevent page reloading when updating the theme
- Fixes theme install modal on grid page
- Temporarily remove sorting of default theme to the top
2024-10-29 12:25:17 +10:00
Martin Brennan
456fbb1dbf
FEATURE: Allow themes to define screenshots (#29079)
This commit allows themes to define up to 2 screenshots
in about.json. These should be paths within the theme's
git repository, images with a 1MB max file size and max width 3840x2160.

These screenshots will be downloaded and stored against a theme
field, and we will use these in the redesigned theme grid UI.

These screenshots will be updated when the theme is updated
in the same way the additional theme files are.

For now this is gated behind a hidden `theme_download_screenshots`
site setting, to allow us to test this on a small number of sites without
making other sites make unnecessary uploads.

**Future considerations:**

* We may want to have a specialized naming system for screenshots. E.g. having light.png/dark.png/some_palette.png
* We may want to show more than one screenshot for the theme, maybe in a carousel or reacting to dark mode or color palette changes
* We may want to allow clicking on the theme screenshot to show a lightbox
* We may want to make an optimized thumbnail image for the theme grid

---------

Co-authored-by: Ted Johansson <ted@discourse.org>
2024-10-28 10:10:20 +10:00
Jordan Vidrine
f28f82f99e
UX: Multiple fixes to theme card rendering (#29225)
* Improvements, refactors, remove dead code

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2024-10-16 11:13:36 -05:00
Jordan Vidrine
3ad2fd032b
FEATURE: Initial themes config area with grid (#28828)
* UX: More additions

* UX: more

* DEV: Add admin/config/themes route

* UX: Use admin config card

* syntax merge fixes

* cleanup

* cleanup

* checkbox

* more

* error

* save on click

* more

* fix setter

* DEV: Implement vanilla checkbox

* cleanup

* UX: save themes as default

* DEV: Add component list to card

* DEV: Add placeholder for no screenshots

* DEV: Fix default theme reactivity

Also add content/optionalAction yields to config area
card and put the theme user selectable checkbox there,
along with adding styles.

* DEV: Change to generic "look and feel" config area

* DEV: Auto redirect to themes on base look and feel route

* UX: Remove computed from sorted themes

* linting

* UX: Turn update icon into button that routes to settings

* DEV: remove unused function

* UX: center icons with title

* DEV: Lint

* UX: Hook up theme preview button

* DEV: Minor fixes

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2024-10-15 10:54:38 -05:00