THE OMEGA DIRECTIVE: Mobile First at all Costs

The Omega Directive

Mobile First at all Costs

Saturday, July 13, 13

DrupalCampLA 2013

THE OMEGA DIRECTIVE: Mobile First at all Costs

DrupalCampLA 2013

Omega 3 vs. 4
Omega 4

Omega 3

Just released

One of the first responsive

themes out there

Lightweight, flexible,
managed in code

Stylesheet structure forces

mobile-first thinking

Solves a lot of what we

have been whining about
with Omega 3

Great for a low-skill client

that will manage their
theme

For Intermediate/
Advanced Themers

GREAT for beginners!

Saturday, July 13, 13

THE OMEGA DIRECTIVE: Mobile First at all Costs

DrupalCampLA 2013

Installing Omega (3)

Saturday, July 13, 13

Omega: http://drupal.org/project/omega
Omega Tools: http://drupal.org/project/omega_tools
Delta: http://drupal.org/project/delta
Context: http://drupal.org/project/context

THE OMEGA DIRECTIVE: Mobile First at all Costs

Configuring Omega (3)

Saturday, July 13, 13

Weight (code placement)

Position (visual placement - push/pull)
Prefix & Sux (gutters)
Moving Zones & Regions
Custom Classes
Extra Libraries

DrupalCampLA 2013

THE OMEGA DIRECTIVE: Mobile First at all Costs

Omega (3)
Stylesheet Logic

Saturday, July 13, 13

global.css impacts everything include Mobile

...default.css impacts everything but Mobile
and everything overrides from there
[Live Demo]
MUST THINK MOBILE FIRST, or it will take you 3
times as long to theme your site

DrupalCampLA 2013

THE OMEGA DIRECTIVE: Mobile First at all Costs

Overriding Things

Config: Delta
Config: Context
Code: tpl files

Saturday, July 13, 13

tpl file naming conventions:

http://drupal.org/node/1089656

DrupalCampLA 2013

THE OMEGA DIRECTIVE: Mobile First at all Costs

DrupalCampLA 2013

Custom Zones & Regions

Saturday, July 13, 13

[Live Demo]

THE OMEGA DIRECTIVE: Mobile First at all Costs

DrupalCampLA 2013

Additional Modules

Saturday, July 13, 13

Delta: http://drupal.org/project/delta
Context: http://drupal.org/project/context
CSS Injector: http://drupal.org/project/css_injector
Devel: http://drupal.org/project/devel

THE OMEGA DIRECTIVE: Mobile First at all Costs

Helpful Resources

Saturday, July 13, 13

960 grid explained:

http://sixrevisions.com/web_design/the-960grid-system-made-easy/

TPL file naming:

http://drupal.org/node/1089656

Omega 4 vs. 3:
https://drupal.org/node/1768686

Omega Handbook:
http://drupal.org/node/819164

DrupalCampLA 2013

THE OMEGA DIRECTIVE: Mobile First at all Costs

DrupalCampLA 2013

QUESTIONS?
CONTACT RAIN:
@rainbreaw
www.chillco.com
www.rainbreaw.com
rbreaw@chillco.com

Saturday, July 13, 13

THE OMEGA DIRECTIVE: Mobile First at all Costs

Check Out Other Cherry Hill Sessions

Saturday, July 13, 13

Moving Into Drupal Using the Migrate Module

Ashok Modi (btmash) - Sat. 10am Emerald Bay 2

Get Sassy with CSS

Rain Breaw Michaels & Chris Charlton - Sat. 1:30pm HERE!

Panel - Responsive Base Themes

Rain Breaw Michaels moderating - Sat. 2:30pm HERE!

Manage Your Site Tasks / Deployment Workflow - Use Jenkins!

Ashok Modi (btmash) - Sun. 10am Emerald Bay 2

Lets Learn Drupal 8 Together

Ashok Modi (btmash) - Sun. 2:30pm HERE!

DrupalCampLA 2013