[CONTEDIT-143] Final content editor UI polish Created: 09/Aug/17  Updated: 24/Aug/17  Resolved: 21/Aug/17

Status: Closed
Project: Content Editor
Component/s: None
Affects Version/s: None
Fix Version/s: 1.0.6

Type: Improvement Priority: Neutral
Reporter: Anja von Gunten Assignee: Cedric Reichenbach
Resolution: Fixed Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Issue Links:
Relates
relates to MGNLUI-4279 Properly support i18n on link field b... Closed
relates to CONTEDIT-151 More possible polishing ideas Closed
relates to MGNLDEMO-226 Stories demo final visual tweaks Closed
Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Date of First Response:
Epic Link: Content Editor fine-tuning
Sprint: Basel 109, Basel 110
Story Points: 5

 Description   

This ticket is intended in such a way that UX (Anja) will work together with a Developer to polish the final CSS and minor things such as pixels, spacings, wording, etc. and should not take more than 2 days.


General

  • Check Font size for normal text fields (14 px ?)
  • Check Font size for labels (11px ?)
  • Font size (11px) & padding in buttons
  • Collapsable tabs: center align font within tab
  • Delete icon: center align X ( probably sub-pixel rendering issue on Hi-DPI screens, browser-specific)
  • Font in footer banner: should be DINPro

Outline

Title
  • Invitations: change wording to 'Add title…' and 'Add lead…'
Lead visual
  • Check spacing between fields (fields 'jump' when switching between radios)
Image
  • Label Caption: remove „en“ ?
  • Button label: change to browse ( not properly done, see CONTEDIT-148)
Video
Embed
  • Text area field should be an expandable field as fx. title/lead
Author
  • Button label: change to browse
Related content
  • Spacing of the buttons: too close to the label
  • Replace trash icon with delete icon -> currently not possible; icon is hard-coded in MultiField
  • Related tours button label: change to browse (don’t distinguish between select new / select another)
  • Related tours: invitations missing
  • Related tours: remove Caps of tours => needs to be done in stories demo
Dates & URL

Blocks

Icon picker
  • Plus icon not centered -> same sub-pixel rendering issue as for deletion "X" (see above)
  • Icons and spacing bigger if possible
Image block
  • Re-order fields: 1. Alt text / 2. Caption / 3. Credits (make it same as in outline)
  • Zoom icon: too small
  • Make grey preview bg (stripes) slightly darker
Video block
  • Switch between radios: fonts jumping and also scroll location jumping
  • When clicking checkboxes: flashes white bg => CONTEDIT-144
  • Change label names same as in outline: Video, File, Alternate image, …
  • Make grey bg of image preview slightly darker
  • Font size for radios and checkboxes too small
  • Dropdowns: too wide, provide visual spec -> this is a nasty one: cannot be styled specific to content-editor due to the wacky way it's implemented by Vaadin (technical background: it's an overlay div living directly under body)
Embed block
  • Cut text length with elipsis (max 2 lines)
Tour block
  • Button label: change to browse (don’t distinguish between select new / select another) => needs to be done in stories demo

Generated at Mon Feb 12 00:17:30 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.