Pick a color scheme

Registered by Robbi on 2010-09-02

Pick a color scheme provided in a JQuery UI theme, and imitate that color scheme in our code.

Blueprint information

Status:
Complete
Approver:
None
Priority:
Undefined
Drafter:
None
Direction:
Needs approval
Assignee:
Mona Wilson
Definition:
New
Series goal:
Accepted for trunk
Implementation:
Implemented
Milestone target:
milestone icon 0.2
Started by
Mona Wilson on 2010-12-01
Completed by
Mona Wilson on 2010-12-01

Related branches

Sprints

Whiteboard

DONE - Pick a color scheme from http://jqueryui.com/themeroller/#themeGallery .

e.g., http://jqueryui.com/themeroller/#ffDefault=Segoe+UI,+Helvetica,+Arial,+sans-serif&fwDefault=bold&fsDefault=1.1em&cornerRadius=6px&bgColorHeader=9fda58&bgTextureHeader=12_gloss_wave.png&bgImgOpacityHeader=85&borderColorHeader=000000&fcHeader=222222&iconColorHeader=1f1f1f&bgColorContent=000000&bgTextureContent=12_gloss_wave.png&bgImgOpacityContent=55&borderColorContent=4a4a4a&fcContent=ffffff&iconColorContent=9fda58&bgColorDefault=0a0a0a&bgTextureDefault=02_glass.png&bgImgOpacityDefault=40&borderColorDefault=1b1613&fcDefault=b8ec79&iconColorDefault=b8ec79&bgColorHover=000000&bgTextureHover=02_glass.png&bgImgOpacityHover=60&borderColorHover=000000&fcHover=96f226&iconColorHover=b8ec79&bgColorActive=4c4c4c&bgTextureActive=01_flat.png&bgImgOpacityActive=0&borderColorActive=696969&fcActive=ffffff&iconColorActive=ffffff&bgColorHighlight=f1fbe5&bgTextureHighlight=02_glass.png&bgImgOpacityHighlight=55&borderColorHighlight=8cce3b&fcHighlight=030303&iconColorHighlight=000000&bgColorError=f6ecd5&bgTextureError=12_gloss_wave.png&bgImgOpacityError=95&borderColorError=f1ac88&fcError=74736d&iconColorError=cd0a0a&bgColorOverlay=262626&bgTextureOverlay=07_diagonals_small.png&bgImgOpacityOverlay=50&opacityOverlay=30&bgColorShadow=303030&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=50&thicknessShadow=6px&offsetTopShadow=-6px&offsetLeftShadow=-6px&cornerRadiusShadow=12px

DONE -After picking & downloading a color scheme, integrate it into an installation of http://pypi.python.org/pypi/tw2.jquery & http://pypi.python.org/pypi/tw.uitheme in our virtualenv. This step is done with the theme named "Trontastic," but I think Mona picked a different theme than Trontastic, so she'll need to follow the instructions in revision 44, linked to below.

DONE - Document for other CaneyPUGgies members how they can install tw.jquery on the wiki: within your activated virtualenv (named "tg21env"), run "easy_install tw.jquery tw.uitheme".

DONE: Then figure out whether the color scheme needs to go into rcl/public (which I think is the case), or needs to go into tg21env/lib/python2.6/site-packages/tw.uitheme (which I doubt). Update: It only goes into rcl/public if we want to use a custom theme not included in tw.uitheme. More instructions on how to properly select a theme are here: http://bazaar.launchpad.net/~caneypuggies/reformedchurcheslocator/trunk/revision/44

Then either

1) apply the correct jQueryUI theme CSS classes to HTML elements throughout our templates to get that theme's colors & styles (this is the best method), or

2) hard-code the jQueryUI theme's colors into public/css/style.css (I really hope we don't have to use this method, because it will prevent us from easily switching to a new jQueryUI theme). If 2) is necessary, we may have to hard-code those colors into the Blueprint CSS .css files once we get to the point where we use Blueprint.

Use http://kuler.adobe.com to figure out what other colors coordinate with the chosen color scheme if we need to make highlights, etc.

(?)

Work Items

This blueprint contains Public information 
Everyone can see this information.

Subscribers

No subscribers.