Opened 12 years ago

Closed 12 years ago

Last modified 12 years ago

#3067 closed task (fixed)

Get basic tundra CSS going

Reported by: owen Owned by: owen
Priority: high Milestone: 0.9beta
Component: Dijit Version: 0.9
Keywords: Cc:
Blocked By: Blocking:

Description

Blanket bug for a big checkin that gets a first pass of the dijits converted over to use the tundra theme. There are individual bugs for many of the widgets, I'll update those after this big checkin is done. Below are my notes on where things are in the process.

  • TabContainer?
    • tab templates are defined in code
    • active and hover states were not working at all

-- changed PageButton? (superclass of TabButton?):

  • added selectedClass property

-- name of class applied to PageButton/TabButton? when button is selected

  • added hoverClass property

-- name of class applied to PageButton/TabButton? on hover

  • added closeHoverClass property

-- name of class applied to PageButton/TabButton? on hover

  • added onMouseOver and onMouseOut handlers to set hoverClass
  • updated PageButton? to use properties above rather than hard-coded strings
  • default is the same as the old hard-coded string
  • button has 'dojoButtonEnabled' along with 'dojoButtonActive' -- parallel for TabContainer?? ? make PageButton? subclass of Button ? ? why is labelPosition "left-h" or "right-h" rather that just "left" or "right"
  • Button
  • Checkbox/Radio?
    • images are in a sprite -- can't do automatically from photoshop
      • rename 'checkmark' to something else
    • should have some way of figuring out width/height rather than always 16px
    • need some method of consolidating for themes?
    • Radio in its own file?
  • TitlePane?
    • added a 'contentClass' property, default is 'dojoTitlePaneContent'

which allows you to use a custom class for custom border, etc

? rename to 'contentNodeClass' ?

  • default tundra impl. of dojoTitlePaneContent does 10px padding. ??
  • Menu
    • Menu templates are in-lined rather than being separate template files
    • 'dojoMenuSeparator2'? renamed to "dojoMenuSeparator"

? focus outline around entire menu item, not just label

-- tbody?

x remove tabIndex on a disabled menu item? x submenu flashes when first appearing x submenu delay is too long? x mode to not show icon column

x iframe slider -- border on iframe eats into slider, looks crappy x not sure we're supporting sizerWidth properly -- not sure how it's supposed to work x doesn't use a template at all

  • PageContainer?
    • hard to tell if it's looking right or not, seems to work
  • Accordion
    • added an 'arrow' div inside the label
    • wierd one extra pixel for selected
    • bg image for selected? TitleBar?, TitleBar?-active, TitleBar?-hover, etc ? x a11y the image! x Accordion pane on the bottom doesn't clip properly?

? why is there an explicit image, rather than creating an image programmatically?

we're creating each cell anyway, and we already have the colors...

x can't apply different style in theme, feels lame x move palette arrays into another file and load in explicitly ? to save space? x more palette options (visibone, ???) x work with key:value palette object, so we can use the named color map? x drag in color palette should be turned off?

  • Tooltip

x bg image? add to PSD x tooltip with long text -- arrow doesn't show up properly

  • InlineEditBox?
    • basic functionality is working x save and cancel buttons are not dijit.form.Buttons x tooltip covers over the save/cancel buttons x more indication that inline edit box is there when not active (other than cursor?) x can't type return character into Textarea x can 'save' when field is in an invalid state!

x appearance is off x image replacement code doesn't fire properly

(probably because calendar hasn't been put in the body yet when it fires)

x image conversion code is not firing (wasn't in old way either)

  • needs to fire after image has been loaded?
  • generalize to have a 'imagesToConvert' property for all widgets?
  • Autocompleter

x tooltip covers save/cancel

  • Select
    • converted arrow stuff to use images ala Calendar (w/new .wai code) x popup is too far below the bottom of the select x name of arrow class when selected should be 'dijitArrowButton-selected' x code to imageBgToSrc should be in mixin, not in individual classes x tooltip falls under menu

  • Textarea

x red textarea in example doesn't allow for return key?

  • Spinner

x in large spinner, buttons are not aligned properly and arrows are too low

  • Tree

x tree class names need to be dijitized x tree icons/etc into theme psd ? different style for tree emphasizesd? change to 'focused'? ? can we do tree w/o bars? do for tundra?

  • Calendar

x names need to be dijitized

TODO:

  • tests need margins -- look like crap
  • table stuff is not safe -- talk to Torrey

-- torrey says to lose all of it, can add to test CSS if necessary

  • bug/check in theme tester
  • skins w/own JS? templates? -- simple proposal
  • consolidate images

-- check/radio -- arrows -- how to do generically?

  • move menu to use file templates ?
  • move tab to use file templates
  • color palette design is silly
  • didn't change CSS class names in examples
  • add class name change to porting guide?
  • doc all of the classes/interesting things for each widget
  • dojo.toggleClass(node, str, state) dijit.toggleClass(...) ?

saves from having to do:

(isSelected ? dojo.addClass : dojo.removeClass)(this.domNode, cn+"-selected");

  • remove classes that aren't used (how to tell? diff?)
  • review all colors for consistency

(some way to substitute ???)

  • named color map as explicit pull-in (overriding small one in dojo)
  • go through all widgets for consistency of property names?
  • templates should be able to include other templates, like InlineEdit? including a couple of buttons
  • file bug to change wai.js to a11y.js#FAFAFA url(images/dijitTitleBar.png) repeat-x scroll left bottom
  • only do a11y stuff if necessary?

Attachments (1)

tundra.diff (409 bytes) - added by guest 12 years ago.
fix for erronous semicolon in _Calendar style

Download all attachments as: .zip

Change History (13)

comment:1 Changed 12 years ago by owen

(In [8660]) refs #3067 Checkin of initial pass for getting dijits to use tundra. See bug for more details.

comment:2 Changed 12 years ago by bill

Milestone: 0.90.9beta

Changed 12 years ago by guest

Attachment: tundra.diff added

fix for erronous semicolon in _Calendar style

comment:3 in reply to:  description Changed 12 years ago by guest

[pete higgins]

new patch: simple css bug, breaking calendar month background image.

comment:4 Changed 12 years ago by Karl Tiedt

(In [8697]) fixes #3093 (Thanks Pete!) refs #3067 (fixes a small typo)

comment:5 Changed 12 years ago by bill

(In [8759]) Test file was referencing Tree but it was commented out. Since Tree isn't a layout widget, I just changed it to ContentPane?. Refs #3067.

comment:6 Changed 12 years ago by alex

(In [8789]) remove odd blue background on accordion panes. Still some strange padding below labels. Refs #3067

comment:7 Changed 12 years ago by owen

Resolution: fixed
Status: newclosed

(In [8855]) fixes #3067 Tundra templates are done (I hope) for Button, ComboButton?, DropDownButton?, Spinner, AutoCompleter?. Anything else, please file another bug

comment:8 Changed 12 years ago by bill

(In [8858]) Not sure what the problem is on Safari, but at the least we should be testing for high contrast mode on FF in addition to IE (at least on Windows)

Refs #3067

comment:9 Changed 12 years ago by bill

(In [8932]) Rename setStateClass() to _onMouse() since that function does more than just setting CSS classes.

Refs #3067.

comment:10 Changed 12 years ago by bill

(In [8934]) Rename setArrowStateClass() to _onArrowMouse() to be consistent with _onMouse() naming.

Refs #3067.

comment:11 Changed 12 years ago by Adam Peller

(In [9027]) Inline one-line private method. Refs #3067

comment:12 Changed 12 years ago by bill

(In [9995]) Dijit.css was referencing no.gif even though that's a tundra image (it couldn't find it because it's in the tundra directory). Moved rules to tundra.css. Refs #3067.

Note: See TracTickets for help on using tickets.