Polishing: Modals + Popovers + Tooltips

Version 83.1 by Ecaterina Moraru (Valica) on 2018/08/09 17:42

 
 Requirements
 Idea
 

Description

Generic

Purpose

  • Assure consistency across UI
  • Replace old components with newer ones and deprecate the oldest
  • Limit the modals usage since they pose accessibility and mobile issues

Note: Screenshots done on 10.6-rc-1+ 

To Do Modals 

  • Use BS modals instead
    • Don't have No Modal and Browser Modal modals
    • Deprecate the Lighbox Modals
  • Fix the UI in some broken XDialog-Modals or replace with a newer modal type

To Do Popovers 

To Do Tooltips 

  • Use just one type of tooltips

Modals

Overview

FeatureNO Modal M0Browser Modal (confirm(), alert(), prompt(), etc.) M1XDialog-Modal / Confirmation Box M2Lightbox M3Cke_Modal M4Bootstrap Modal M5Drawer M6Feature Total
Actions45413
Administration22
Administration Groups123
Administration Users123
AWM224
CKEditor2327
Dashboard123
Docextra235
Flamingo11
Help11
Index22
Notifications112
Profile11
Other11
Skin + Themes33
Tags22
Wiki22
Compatibility, error messages, etc. ???
Modal Total6+10+2143101(55)+

Actions

  • Create - Select Page (1): M5
  • Create Non existing (1): M2
  • Edit - Mandatory Summary (1): M1
  • Edit Class - Delete Property - Save (2): 2xM2
  • Edit Object - Delete Object (1): M2
  • Version Delete | Rollback (2): 2xM1
  • Export (1): M5
  • Share Page by Email (1): M5
  • Annotations Delete (1): M2

To Do

Done

Administration

  • Groups Add / Edit / Delete (3): 2xM3, M1
  • Users Add / Edit / Delete (3): 2xM3, M1
  • Search Suggest Delete (1): M2
  • Import Delete (1): M2
  • Extension - Replay History - Delete (1): M1
  • Templates - Create - Location (1): M5

AWM

  • AWM Delete Application | All Entries (2): 2xM0
  • AWM Create Entry (1): M2
  • AWM Delete Property (1): M2

CKEditor

  • CKEditor (3): 3xM4
  • Macros Add | Edit (2): 2xM5
  • Leave (1): M1
  • Change Syntax (1): M1

Dashboard

  • Gadget Add | Edit (2): 2xM5
  • Gadget Delete (1): M2

Docextra

  • Comments Delete / Permalink (2): 2xM2
  • Attachments Delete (1): M2
  • History Delete / Rollback (2): 2xM1

Flamingo

  • Drawer (1): M6

Help

  • Video View (N): NxM5

Index

  • Delete Deleted Page / Attachment (2): 2xM2

Notifications

  • Filter Add (1): M5
  • Filter Delete (1): M2

Profile

  • Profile Change Avatar (1): M2

Other

  • Go to Page (1): M2

Skin + Themes

  • Skin Add Logo | Remove Template (1): 2xM2
  • Flamingo Themes - Add Logo (1): M2

Tags

  • Tags Rename / Delete (2): 2xM0

Wiki

  • Delete Wiki (1): M0
  • Join Wiki (1): M0

Popovers

Overview

Annotations

  • Annotations Create + View + Edit (3): P1

AWM

  • Pickers Date, User, Group, Icon (3): P3, 2xP4
  • Icon Themes AppBar | Template Provider (2): 2xP6

Color Themes

  • Flamingo Themes Pick Color (1): P5

Deprecate

Flamingo

  • Breadcrumbs (1): P8
  • Menus (2): 2xP8

Notifications

  • Notifications Menu (1): P8

Suggest

  • Search Suggest (2): P4
    • Search Input from Navbar
    • Search Input from Go to page
  • For more places see the Auto-complete on Reference investigation

Deprecate

  • userpicker replaced by a new component
  • .suggestUsers and .suggestGroups classes
    • since we have the .suggest-users and .suggest-groups equivalents
  • .suggestSpaces and .suggestDocuments classes
    • replace with .suggest-pages

Tags

  • Tags Create (1): P2

Templates

  • Administration: Template Providers (1): P6

Tour

  • Tour Steps (N): NxP7

Tooltips

Overview

FeatureNO Tooltip T0HTML Tooltip T1Panel Wizard Tooltip T2Notifications Tooltip T3Feature Total
Notifications33
Panel Wizard11
Other**?
Tooltip Total?+?13(4)+

Notifications

  • Watch Switched Tooltip: Page, Space, Wiki (3): 3xT3

Panel Wizard

  • Panel Tooltips (N): T2

 

Tags: consistency
    

Get Connected