Opened 8 years ago

Closed 6 years ago

Last modified 5 years ago

#14518 closed enhancement (fixed)

Bootstrap as a Dojo Theme

Reported by: dylan Owned by: dylan
Priority: low Milestone: 1.8
Component: themes Version: 1.7.1
Keywords: Cc:
Blocked By: Blocking:

Description

Suggestion was made by Pete Smith to make Bootstrap ( http://twitter.github.com/bootstrap/ ) a theme for Dojo. It's licensed under Apache 2, and uses less.

Change History (32)

comment:1 Changed 8 years ago by bill

Resolution: wontfix
Status: newclosed

It looks interesting. Unfortunately I'm not taking any more themes into dijit itself, being that all the current themes have been abandoned by their owners. You should suggest to Pete Smith that he put the theme in github and link it from packages.dojotoolkit.org.

If he was able to make a theme based on the claro files, with just it's own version of variables.less, I'd reconsider putting it into dijit.

comment:2 Changed 8 years ago by dylan

Resolution: wontfix
Status: closedreopened

I'm reopening this, because we need a better approach to themes for 2012 than just having 1 theme.

comment:3 Changed 8 years ago by dylan

Owner: changed from nonken to dylan
Status: reopenednew

comment:4 Changed 8 years ago by ben hockey

i've thought a bootstrap theme would be good too. the greatest value in a bootstrap theme would come from leveraging their variables.less to produce our theme.

comment:5 Changed 8 years ago by bill

@dylan's comment is incorrect. Dijit has 4 supported themes, not 1.

If someone wants to work on this new theme that's great, but like I said I'm not allowing a fifth theme as part of dijit, unless maybe (like I said) it can be minimized to a separate variables.less file from claro.

And if you insist on using the "themes" component in this bugdb for tracking non-dijit tasks then I'll need to remove the component from the trac reports about dijit bugs" and thus from the tickets I'm (no pun intended) tracking.

As per @neonstalwart's comment, bootstrap does have a variables.less file, but it's quite different from ours in that it refers to colors rather than semantic meanings like "disabled".

comment:6 Changed 8 years ago by dylan

@bill... my comment was based on "Unfortunately I'm not taking any more themes into dijit itself, being that all the current themes have been abandoned by their owners."

As far as the trac component goes, there's Dijit, Dijit - LnF, and themes. I would think then that there should be Dijit - themes and themes if that's a concern. We currently have themes in charts, gauges, various extensions (like dgrid), as well as Dijit.

comment:7 Changed 8 years ago by bill

No need for yet another component, can just use "Dijit" or "Dijit - LnF" for bugs with the code in the dijit/themes/ directory.

comment:8 Changed 8 years ago by ben hockey

Priority: highlow
Status: newopen

comment:9 Changed 8 years ago by chrisweb

I searched for a dojo toolkit twitter bootstrap theme but couldn't find one. But i found one for jQuery, that's why our team will use jQuery for our next project. I would have preferred dojo, but we haven't enough time to adapt a dojo theme to match the twitter boostrap. Bill said he wouldn't allow such a theme to be distributed with dojo, but i think it would be good to have such a theme in the future, because lots of users use the twitter bootstrap. I'm sure it would help dojo toolkits adoption among developers.

comment:10 Changed 8 years ago by Alex Ehlke

I'd love to see this also. I'm interested in using bootstrap for prebuilt layout purposes mainly, and it'd be nice to be able to supplement my Dijit widgets with bootstrap widgets as needed and not have their themes clash.

Another possibility would be to have a custom bootstrap theme that looks like a dijit theme, though that seems counterproductive.

comment:11 in reply to:  9 Changed 8 years ago by bill

Replying to chrisweb:

Bill said he wouldn't allow such a theme to be distributed with dojo

This is beside the point. As I said in my next sentence: You should suggest to Pete Smith that he put the theme in github and link it from packages.dojotoolkit.org.

You can look at firefox or chrome as examples; they both have many themes that are not distributed with the browser, but that users can download separately.

Last edited 8 years ago by bill (previous) (diff)

comment:12 Changed 7 years ago by andy

Its a pity we dont have community voting on DTK issues, as this one would definitely get my vote. Some of us remember the comparisons around dojo 0.4 time when DTK lost some midshare to toolkits like Ext because the UI was not as polished. Well now claro is polished, but the world and their dog seem to want Twitter bootstrap clones and a world of Helvetica Neue. Whilst some of us may balk at this and think DTK would be jumping on the bandwagon, or might think that this is just polish and themeing rather than anything 'difficult', I would suggest that you ignore the bootstrap movement at your peril. We all know that DTK is technically superior to lots of other offerings - by making it visually superior as well would really be a great asset for DTK. Claro degrades better than Twitter bootstrap (IMHO), and has A11Y as well so could be seen as bootstrap++. Maybe guidelines from the committers on how to start thinking about a community developed github theme would be useful step here?

comment:13 Changed 7 years ago by nedosa

I'd like second the opinions here. We use dojo/dijit heavily, but we are looking into progressing our infrastructure using bootstrap. The lack of integration between dojo <=> twitter bootstrap is definitely a pain point.

comment:14 Changed 7 years ago by Pete Smith

I am finding that in order to pull this off, something like preboot.less mixins http://markdotto.com/bootstrap/ would be a great platform for all the cool effects people need. It is a nightmare building your own less mixin library. Dojo would absolutely KILL with

A Twitter Bootstrap theme

Built with Preboot.less for color / font and advanced effects.

This would render jquery's color picker obsolete. You would have a fine base, easily configurable to your own color / font theme and have a platform to build upon for your own widgets using preboot.less.

Last edited 7 years ago by Pete Smith (previous) (diff)

comment:15 in reply to:  14 Changed 7 years ago by Nuba Princigalli

Replying to httpete:

... preboot.less mixins http://markdotto.com/bootstrap/ ...

This fork is being actively maintained: https://github.com/saymedia/bootstrap

comment:16 in reply to:  14 Changed 7 years ago by bill

Replying to httpete:

I am finding that in order to pull this off, something like preboot.less mixins http://markdotto.com/bootstrap/ would be a great platform for all the cool effects people need. It is a nightmare building your own less mixin library.

Why not just use preboot.less?

comment:17 Changed 7 years ago by Pete Smith

the new fork is WAY better.

comment:18 Changed 7 years ago by Pete Smith

Microsoft is creating a metro theme for jquery mobile.

comment:19 Changed 7 years ago by thesociable

For those that are interested I have started a port to a Bootstrap-esque theme at https://github.com/thesociable/dbootstrap. Note that I am using Stylus rather than Less.

Contributions welcome!

comment:20 Changed 7 years ago by karim

Bootstrap is great and I really hope there will be official support for it as a Dijit theme.

In the mean time there is also Dojo-Bootstrap:

https://github.com/xsokev/Dojo-Bootstrap

comment:21 Changed 7 years ago by thesociable

Live preview of dbootstrap (Bootstrap theme for Dojo) now available at http://thesociable.github.com/dbootstrap/ Still lots to do, but getting there.

https://raw.github.com/thesociable/dbootstrap/master/resource/preview.png

comment:22 Changed 7 years ago by bill

Cool, looks like it's coming along nicely.

comment:23 Changed 7 years ago by dylan

Status: openassigned

thesociable, how are things progressing? Would be awesome to get this finished off and make it an official Dojo theme at some point in the near future.

comment:24 Changed 7 years ago by dylan

And before Bill freaks out, I don't mean something that lives inside dijit, but something that we consider done and can promote and distribute more widely.

Also, you're using Stylus which is what many of us prefer for Dojo 2.0.

Anyway, thesociable, please reach out when you get a chance, I'm easy to find.

comment:25 Changed 7 years ago by thesociable

Hey Dylan. Things have progressed well with most of the Dijits present in the gallery styled. I have already split out the theme and demo to make it easier to integrate, but I still want to do a cleanup pass on the Stylus files (move from "make it work" to "make it manageable"!).

Due to the use of font based icons (Font-Awesome) I have had to include a Javascript package that patches incompatible Dijit templates at runtime - not sure if there is a better solution?

A list of current issues is at https://github.com/thesociable/dbootstrap/issues

I think the project would definitely benefit from some experienced Dojo folks taking a look and advising on areas that could be done better as well as testing against different browsers (I currently only have a Mac with Firefox and Safari).

Meanwhile, I am going to make a focussed push on it over this month.

comment:26 Changed 7 years ago by bill

Funny you should mention font based icons because someone else just filed #16699 about that. As I wrote there, the main reason for using <img> for icons was to get Tree alignment to work right, without lots of hacks. Trying to make Tree layout correctly regardless of the size of app's icons and the TreeNode font size. Maybe there's a better way now, especially if we ignore IE6 and IE7.

Another option is to give each TreeNode both a <img> and a <span> and the theme can use whichever it likes for the icon. It's ugly (from a technical point of view) but no worse than a lot of the a11y code currently in dijit.

comment:27 Changed 7 years ago by thesociable

Interesting. For reference, the exact patch I am applying can be found at https://github.com/thesociable/dbootstrap/blob/master/source/dbootstrap/icon_support.js - might be useful for testing purposes.

comment:28 Changed 7 years ago by bill

Thanks. Incidentally, the Tree expando and folder icons work even on IE8, but I can't figure out how. Developer toolbar doesn't tell me anything useful. There's no :before CSS selector on IE8 is there? I thought you might have an actual character in the markup but seems like it's all done through CSS.

comment:29 Changed 7 years ago by bill

Oh I spoke too soon, it doesn't run on IE8, just IE9 in IE8 compat mode. apparently. Too bad.

comment:30 Changed 6 years ago by dylan

Resolution: fixed
Status: assignedclosed

Because this is being handled with solid success under the dbootstrap project, I'm going to close this ticket out, and encourage Martin (maintainer of dbootstrap) to help promote it, and to work more closely with him for Dojo 2.

comment:31 Changed 6 years ago by bill

Milestone: tbd1.8

Just setting a version fixed so it doesn't show up in my report of tickets w/out version fixed.

comment:32 Changed 5 years ago by johane

I'm questioning the closing of this defect. The dboostrap project is pretty much to be considered dead, it relies on some hacks and it hasn't been updated to bootstrap 3. Dojo is in serious need of a modern theme - be it bootstrap or something else. Closing this defect serves no real purpose, the need is still here.

Note: See TracTickets for help on using tickets.