nextcloud-server/apps/theming
Joas Schilling cca3b9495c
chore(autoloader): Update autoloaders with composer 2.5.5
Signed-off-by: Joas Schilling <coding@schilljs.com>
2023-04-21 15:53:55 +07:00
..
appinfo chore(release): Bump requirements and versions in apps/ 2023-03-03 06:44:27 +07:00
composer chore(autoloader): Update autoloaders with composer 2.5.5 2023-04-21 15:53:55 +07:00
css Lighten default color slightly for increased contrast 2022-12-06 01:13:55 +07:00
fonts Update opendyslexia 2022-10-01 16:29:36 +07:00
img Add distraction free backgrounds for Nextcloud 26 2023-03-03 17:55:19 +07:00
js Purge unused legacy code and drop 3rdparty jscolor dependency 2022-10-28 00:18:47 +07:00
l10n Fix(l10n): Update translations from Transifex 2023-04-20 02:29:13 +07:00
lib Add distraction free backgrounds for Nextcloud 26 2023-03-03 17:55:19 +07:00
src chore(npm): fix warning and build 2023-04-21 14:01:41 +07:00
templates Rewrite admin theming in Vue 2022-10-28 00:18:47 +07:00
tests feat(theming): Only convert a background image if it benefits from it 2023-02-20 13:11:19 +07:00
.l10nignore
README.md Add distraction free backgrounds for Nextcloud 26 2023-03-03 17:55:19 +07:00

README.md

Theming

Background picture requirements

A reference to why it was very difficult to actually find good background pictures there are quite some requirements when it comes to picking:

  • It needs to be an exceptionally good photo of course since when chosen, people will see it every day.
  • We need to have a good balance of different motives, e.g. not too many landscape pics.
  • Same for a good balance of different colors.
  • The photo needs to work as a background. Photos with objects focused in the middle dont really work as they will be overlapped by the widgets and content anyway.
  • Especially the top part cannot have too much differing contrast, as then its not possible to see the navigation icons.
  • Especially the top part should be either dark-ish or light-ish, but not a shade exactly inbetween because then contrast can neither be achieved with light nor dark icons.
  • We serve the pictures at 4k resolution and most of the selected images are also available in 6k or higher so it is future-proof.
  • For the search of course we had to limit to CC0, CC By and CC By-Sa. Only CC0 would have been practically impossible cause theres just not so many good ones which fit.
  • Good pages to find photos are StockSnap, Wikimedia Commons, Openverse and Flickr (with license "commercial use & mods allowed"), sorting by interesting or downloads. Most others like Unsplash, Pexels, Pixabay, etc. meanwhile have a non-standard license.

Background picture technicals

  • All backgrounds are sized to maximum 3840px width (4K resolution).
  • To ensure quick loading times, the image needs to be compressed, ideally to around 1 MB or less. E.g. via 9095% quality in GIMP export. We could also explore using newer formats.
  • Previews are sized to 352px width (min height 192px), which is double of the current picker grid size so it looks nice on high-res displays. Quality is also set to around 90% at export.

Background picture credits

In img/background/: