• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Styling frameworks v2
 

Styling frameworks v2

on

  • 454 views

 

Statistics

Views

Total Views
454
Views on SlideShare
454
Embed Views
0

Actions

Likes
0
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Styling frameworks v2 Styling frameworks v2 Presentation Transcript

  • #styling-frameworks { /* Nelson Wong */
  • .overview {• Current issues• Strategy• LESS• Bootstrap• Implementation plan• Issues
  • .current-issues {• Legacy CSS techniques• CSS3 support in browsers (prefixes)• Duplicate, redundant code (Tii, Pd)• Inconsistent styling• Unorganized code• No design pattern library
  • .strategy {• Best CSS practices• LESS• Bootstrap• Design patterns & style guide for common components
  • .tii-panel {
  • .less {• Extends CSS, compiles into CSS• Makes writing and maintaining styles a breeze• Faster development• A lot less code• Encourages structured and organized code• Easy to learn and maintain• Backwards compatible with CSS
  • .variables {
  • .mixins {
  • .nested-rules {
  • .functions.operations {
  • .now-vs-less {
  • .bootstrap {• CSS Toolkit• Customizable grid• Nice base styles• Basic javascript components (jQuery)• Written in LESS• Good documentation / style guide• http://twitter.github.com/bootstrap/
  • .implementation-plan {• FED support • Compiling of LESS • Isolate new stylesheet usage (Tii)• Develop new stylesheet • For new and existing components • Existing HTML untouched• Style guide / design pattern library
  • }