Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
A straight conversion of Dijit's Claro theme from Less to Stylus.
CSS
branch: master
Failed to load latest commit information.
form Port Claro changes between 1.8 and 1.9
images Bring up to date with Claro on current dijit master
layout Port Claro changes between 1.8 and 1.9
Calendar.styl Bring up to date with Claro on current dijit master
Calendar_rtl.styl Initial conversion
ColorPalette.styl Initial conversion
Common.styl Port Claro changes between Dojo 1.7.4 and 1.8.1
Dialog.styl Port Claro changes between 1.9 and 1.10
Dialog_rtl.styl Initial conversion
Editor.styl Port Claro changes between Dojo 1.7.4 and 1.8.1
Editor_rtl.styl Port Claro changes between 1.8 and 1.9
InlineEditBox.styl Initial conversion
Menu.styl Port Claro changes between 1.9 and 1.10
Menu_rtl.styl Initial conversion
ProgressBar.styl Port Claro changes between 1.8 and 1.9
ProgressBar_rtl.styl Port Claro changes between 1.9 and 1.10
README.md Update README for 1.10
TimePicker.styl Port Claro changes between 1.8 and 1.9
TimePicker_rtl.styl Initial conversion
TitlePane.styl Port Claro changes between 1.8 and 1.9
TitlePane_rtl.styl Port Claro changes between 1.8 and 1.9
Toolbar.styl Port Claro changes between Dojo 1.7.4 and 1.8.1
Toolbar_rtl.styl Initial conversion
Tree.styl Bring up to date with Claro on current dijit master
Tree_rtl.styl Bring up to date with Claro on current dijit master
claro.css Initial conversion
claro_rtl.css Bring up to date with Claro on current dijit master
document.styl Initial conversion
variables.styl Bring up to date with Claro on current dijit master

README.md

Dijit Claro Stylus Conversion

This repository contains a port of Dijit's Claro theme (as of Dojo version 1.10.4) from Less to Stylus.

Note: conversions for earlier Dojo versions (back to 1.7) are available on separate branches:

Usage

Make sure Stylus is installed...

npm install -g stylus

...then inside the top level of this repository, run:

stylus . form layout

Notes

The results of this conversion have been checked for accuracy via the following processes:

  • Compared CSS output of both LESS and Stylus for (near-)matching values
  • Compared diffs between the previous and current Dojo version's LESS against the corresponding diffs between the previous and current versions in this repository
  • Visually compared using dijit/themes/themeTester.html

Differences

The intent of this conversion is generally to maintain parity with the CSS output by Claro's LESS resources. To some extent there are minor differences, including blank lines, line breaks between multiple selectors, and off-by-one differences from BIFs such as saturate, lighten, and darken.

Any notable or intentional differences between Claro's LESS resources and the Stylus resources in this conversion are explained below.

Disabled Text Input Styles

There was a noticeable difference in the result of 2 calculations for disabled textbox/textarea styles for WebKit in form/Common.css, which have had their source values tweaked such that the resulting output matches the output from Claro's form/Common.less.

The alpha-white-gradient Mixin

The input argument format to the alpha-white-gradient mixin differs from the overloaded set of mixins in Claro's variables.less, in order to allow a single mixin to handle any number of arguments.

In variables.styl, the alpha-white-gradient mixin expects an optional direction followed by any number of tuples containing 2 values, the first being an alpha value and the second being the position within the gradient at which to apply it. For example:

alpha-white-gradient((0.3 0%), (0 100%))

Or, with a direction:

alpha-white-gradient(left, (0.3 0%), (0 100%))

Note that this does not affect the CSS output at all, only the styl files.

License

The contents of this repository are available under the same dual modified BSD / AFL 2.1 license as the Dojo Toolkit.

Something went wrong with that request. Please try again.