[MGNLUI-3840] Distinguish instances visually in AdminCentral Created: 05/Apr/16  Updated: 05/Apr/18  Resolved: 31/Jan/18

Status: Closed
Project: Magnolia UI
Component/s: admincentral
Affects Version/s: None
Fix Version/s: 5.6.2

Type: Improvement Priority: Neutral
Reporter: Antti Hietala Assignee: Jaroslav Simak
Resolution: Fixed Votes: 4
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Attachments: PNG File environment-tag.png     PNG File sticker_collapsed.png     PNG File sticker_environments.png     PNG File sticker_environments_expanded.png     PNG File sticker_expanded.png     PNG File ui-mockup.png    
Issue Links:
Relates
dependency
duplicate
relation
is related to MGNLUI-4366 Sticker widget: fix font for Linux di... 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)
Release notes required:
Yes
Documentation update required:
Yes
Date of First Response:
Sprint: Kromeriz 131, Kromeriz 132
Story Points: 5

 Description   

From SUGGEST-18

all of them looks absolutely same except url in browsed address bar all looks same and its really easy to do mistake and remove or edit something on wrong instance because of that. So the idea is to have for example optional string, or box, or colored box, or colored background, or "prefix" around Magnolia logo, etc...

Attached ui-mockup.png for sticker placement and visual appearance.



 Comments   
Comment by Tom Wespi [ 09/May/17 ]

+1 would be very usefull

Comment by Christoph Meier [ 10/May/17 ]

This would be especially useful on NOW, where you may have 3 different environments - sometimes having them open all in parallel

Comment by Marc Johnen [ 10/May/17 ]

If you ever implement this, it would be great to make it customizable like the status bar and page bar in the pageditor.

Comment by Antti Hietala [ 18/Jan/18 ]

It was suggested in SUGGEST-18 that a developer would want to configure the sticker in a .properties file so they can have different stickers for different webapps.

Does it need to be configured anywhere else? In the Configuration app?

What would the configuration look like? Just two properties: text and color?

nbarbe, does configuration via .properties files work for you in the Cloud?

Comment by Anja von Gunten [ 23/Jan/18 ]

Here the Style specs from UX team, see also images attached

The sticker has 2 stati and are switchable on click

  • collapsed: only environment name (verdana bold)
  • expanded: environment name (verdana bold) + instance name (verdana normal)

Style specs

  • height: 25 px
  • padding left/right: 10px
  • width is flexible according to name length
  • space between user name and sticker: 15px
  • sticker color for LIVE: #9A3332
  • sticker color for UAT: #FFBF28
  • sticker color for INT: #A3A3A3
  • font: verdana 12 px bold and normal
Comment by Jaroslav Simak [ 24/Jan/18 ]

Sticker is configurable via .properties file
example configuration:

magnolia.ui.sticker.environment=INT
magnolia.ui.sticker.color=#A3A3A3

Instance name is taken from MagnoliaConfigurationProperties#MAGNOLIA_WEBAPP property.

Comment by Anja von Gunten [ 26/Jan/18 ]

UX team has reviewed implementation
Note: the white font color on the yellow sticker (UAT #FFBF28) is not ideally readable. As far as i understood yellow is the standard color for testing environment. In Magnolia color palette this is the darkest yellow available. So i suggest implement it as it is but keep in mind If there is feedback on non-readable we need to adjust that color.

Comment by Magnolia International [ 16/Feb/18 ]

ahietala Java properties work for us.

Generated at Mon Feb 12 09:10:36 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.