DotNetNuke 6 includes an updated, modern user interface throughout the framework. The practices and conventions followed to create this user interface can be utilized by DotNetNuke extension developers as well. This creates user interface consistency throughout the framework, and helps to speed up the development process as well by providing the basics out of the box.
Overview
The goals for building user interface components are as follows:
- Allow for reuse across the framework for a consistent user experience
- Create a DNN CSS scope to avoid compatibility issues with other frameworks
- Save time on front end development
Semantic Markup
To do:
write out an overview of the concept - benefits, etc - and point to some helpful articles.
Generic non-dnn examples
HTML Conventions (Form Patterns)
- Full Form Example
- Module Wrapper (establish scope)
- Navigation (tabs)
- Sections (panels)
- Groups (fieldsets)
- Items (row of data, label and input)
- Messaging (validation -inline and summary - warning, success, error)
- Buttons - action items - command buttons
The DNN CSS Foundations
Default.css stuff
Augmenting the foundation
Module.css, etc, overiding the foundation