✨ Nextcloud 21 design review polishing

[jancborchardt]

We did some reviews of the specific apps recently, and this is more of an overview and also a first run experience review as we did in the past.

This was a review session with @ma12-co @georgehrke @GretaD @nickvergessen @violoncelloCH @skjnldsv @juliushaertl @jancborchardt

If you want to fix any of the issues in this list, feel free to just go ahead. :)

Setup

• Recommended apps installation: Collabora & CODE server should be sorted down so the others can be enabled first
• Loading spinner placement could be improved
• Loading spinner color is off
• Icons for Collabora and Talk are missing
• Talk title & text is misaligned because of different icon size
• Icons have alternative text, should not have since they are decorative → empty alt="" please

First run

• Permanently show "Next" button in the first run wizard so it doesn’t hide when mouse is not moved
• Header background has no-repeat
• icon-link missing in second slide
• second slide (3 icons): adjust font size to be the same, put icons left of text as in a list, more margin on the side, first paragraph bold
• third slide (app store): icon/icons instead of screenshot, first paragraph bold, left-align link
• fourth slide (apps to sync): more whitespace inbetween, bold first paragraph
• fifth slide (get involved): bold headings, fix spacing of lists (more space below, less above)

Dashboard

• "Upcoming events" button "Create new event" button is not 44px min
• Check v-deep overwrite for weather and status buttons (they go dark on hover)
• h2 padding-top change from 120px to 10vh or smth similar so it adjusts with screen height
• Custom status: There was an error saving the status? (can not find the route)
• Customize: "Get more widgets" button is 48, should be 44
• When no avatar is set, and you choose a light background (like the bug) the gear icon in the heading is not set to dark
• When you set white or light theming color
  • the heading icons are not inverted on plain background, nor is the text
  • and with default background, there is a white line below the heading

Files

• Sidebar:
  • Subline for files and folders is missing
  • Preview of files doesn’t need to show in the sidebar as well when it’s already open in the viewer
  • Sometimes when opening the sidebar, the header shows through on top
• files_pdfviewer: Should take full width and go to the bottom too

Photos

• "Tagged photos" has no emptycontent
• Less generic emptycontent for Favorites and Shared albums:
  • No favorites yet "Photos you favorite will show up here"
  • No shared albums yet "Photos shared with you will show up here"
• Would be great to at some point have previews for videos ;) But yeah, difficult problem

Settings

• "Reasons to use Nextcloud.pdf" button does not work?

[skjnldsv]

• "Reasons to use Nextcloud.pdf" button does not work?

works for me™ Latest viewer and latest files_pdfviewer

[thefeiter]

When in Dark Mode, the background color of the buttons on the dashboard changes to white on hover, making the text unreadable.
Also on widget editing screen the widgets appear in light design, making it unreadable as well.
Is there already a fix for this?

[violoncelloCH]

@thefeiter I can't reproduce this on 20.0.4

[MikeyMike22]

the blue folder icons in "files" menu in the dark theme have an awkward visibility due to a very strange blue-grey-tone color combination. See screenshot:

open and close right and left eye and notice the difference.

[blizzz]

@jancborchardt what's the state of this issue? keep it open?

[blizzz]

As there is no feedback since a while I will close this ticket. If this is still happening please feel free to reopen.