Totem Application

Last modified by Vincent Massol on 2024/02/26 17:54

 XWiki
 Design
 Dormant
 
 

Description

This proposal was done following Google's Material Design guidelines and using FezVrasta's Material design theme for Bootstrap 3.

While the proposals displays the Totem application using Macaw Skin, the proposed structure can be applied also on Flamingo Skin.

Homepage

Add inline-form (Colibri/Flamingo style)
addColibri.png

Add button (Macaw style)
addMacaw.png

Forms

Single-line fields

Placeholder
addPlaceholder.png

Value and Success Message
addValueSuccess.png

Error Message
addValueError.png

Floating labels

Label
configLabel.png

Label + Hint
configHint.png

Label + Value
configValue.png

Totem

View Mode
totemView.png

Edit Mode

'Add Section', 'Delete Section'
'Edit Section', 'Edit Section Items'

Launch dialogs
'Manage items'Links to Totem.Items

Edit Mode
totemEdit.png

Section

Section View
section.png

'Drag&Drop' Button
sectionDrag.png

'Edit Section Items' Button
sectionEditItems.png

'Edit Section Items' Dialog
sectionEditItemsDialog.png


 

Tags:
    

Get Connected