Post on 08-May-2015
description
Wednesday, July 16, 2008 Damien Howley
Skinning MindTouch Deki
Presented By
Damien Howley
Wednesday, July 16, 2008 Damien Howley
Overview
• Introduction• Resources• What is skinning?• Audience experience
• Templates vs. Skins• CSS modifications
– File system architecture– CSS variables
• Questions
Wednesday, July 16, 2008 Damien Howley
Introduction
• Damien Howley– title: Graphic Designer / Evangelist– email: DamienH@mindtouch.com– twitter: @DamienH
– contribution: Created Fiesta Skin
Wednesday, July 16, 2008 Damien Howley
Resources
• Wiki Documentation– http://wiki.developer.mindtouch.com– http://wiki.developer.mindtouch.com/MindTouch_Deki/Skinning
• Fiesta– http://wiki.developer.mindtouch.com/MindTouch_Deki/Skinning/Fiesta
• Forums– http://forums.developer.mindtouch.com/
• MindTouch– http://www.mindtouch.com– http://www.mindtouch.com/blog
Wednesday, July 16, 2008 Damien Howley
What is skinning?
• Skinning is the process of creating or modifying the look & feed of your Deki.
– HTML markup– CSS styles
Wednesday, July 16, 2008 Damien Howley
Audience experience
• Who has tried to skin MindTouch Deki?– why/why not?– successes / frustrations?– why do you want to skin MindTouch Deki?
Wednesday, July 16, 2008 Damien Howley
Templates vs Skins
Template (php, html) Skins (CSS)
ace
base
fiesta
Mindtouch, blue, neutral
wireframe
pro, caesious Sunset, wireframe, grazing-green, smokey-ocean, summer-city, Mindtouch, sunflower-rainbow, christmas-blizzard, charcoal-forest, sunrise-fog, sky-tangerine, rustic-azure, maroon-flash, cobalt-marine
Wednesday, July 16, 2008 Damien Howley
Template vs Skins
Ace Fiesta
Wednesday, July 16, 2008 Damien Howley
Templates vs Skins
• Other Templates– Deki CMS– Deuce (Kilen Woods)
Wednesday, July 16, 2008 Damien Howley
CSS modifications
• How do I change the CSS?– Control Panel– File system
Wednesday, July 16, 2008 Damien Howley
CSS modifications
• Using the control panel to modify the CSS– Deki Control Panel Visual Appearance
Wednesday, July 16, 2008 Damien Howley
CSS modifications
• Using the file system to modify the CSS– File System 192.168.xxx.xxx\drive\var\www\deki-xxx\skins
Wednesday, July 16, 2008 Damien Howley
CSS modifications
• Using the file system to modify the CSS– File System 192.168.xxx.xxx\drive\var\www\deki-xxx\skins\
fiesta
1. _common.css
2. _style.css
3. Fiesta.php
Wednesday, July 16, 2008 Damien Howley
CSS modifications
• Using the file system to modify the CSS– File System 192.168.xxx.xxx\drive\var\www\deki-xxx\skins\fiesta\
grazing-green
1. _content.css
2. css.php
3. style.css
Wednesday, July 16, 2008 Damien Howley
CSS modifications
• CSS variables (PHP in CSS)– File System 192.168.xxx.xxx\drive\var\www\deki-xxx\skins\fiesta\grazing-green\
style.css– Proposed Spec for CSS 3
Wednesday, July 16, 2008 Damien Howley
CSS hierarchy
• Template– Template Styles (_common.css)
– Skin• Consolidated style css (_style.css)
• Unique style css (/style.css)– Control panel override template styles
• Unique content css (/content.css)– Control panel override content styles
Wednesday, July 16, 2008 Damien Howley
Recap
• What is skinning?• Resources
• Templates vs. Skins• CSS modifications
– File system architecture– CSS variables
Wednesday, July 16, 2008 Damien Howley
Questions
• Does anyone have any questions?– things that are unclear?– barriers to skinning?
Wednesday, July 16, 2008 Damien Howley
Contact Me
• Damien Howley– title: Graphic Designer / Evangelist– email: DamienH@mindtouch.com– twitter: @DamienH