Converting frontend themes to Twitter Bootstrap
Locked
12
12
Re: Converting frontend themes to Twitter Bootstrap
 
|
I see your point. Maybe you are right, probably there's no need to use an
external framework. I proposed to use Bootstrap because that will make the task much easier. I'm not against the idea of creating a new styling and such on our own, but that will require much more effort imo. Also I don't feel capable of doing a good job designing it myself, as I said I am not a web designer, so in case we decide to do that, someone that knows better how to do a proper HTML5 design from scratch w/o a framework will be needed. As for the fact that the them will be probably thrown away or no simply not used, my guess is that it applies for the current themes in all cases. I don't think they are used by anybody to be honest. So the possibility of ending up with a similar result exists but also could be that more people gets interested. From my POV it will definitely catch up more attention. On Tue, May 7, 2013 at 5:32 PM, Adrian Crum < [hidden email]> wrote: > I understand what you are proposing. So, let me try this again... > > HTML cleanups are fine. Updating the markup to HTML 5 is fine. That sort > of overhaul has been done before and it is always welcome. > > What we are discussing here is introducing an outside styling framework > for the eCommerce application. I question the need for the framework > because most businesses don't use the eCommerce application out of the box. > In other words, we would be investing a lot of time and effort into > something that a lot of businesses will just throw away. > > As Christian pointed out, it would be nice to have a better looking > eCommerce demonstration, and I agree. But again, I think that can be done > with consistent and concise markup - coupled with some good styling. > > I'm not opposed to the external framework idea, I just question the need > for it. > > -Adrian > > > On 5/7/2013 4:21 PM, Jonatan Soto wrote: > >> Hi Adrian, >> >> Thanks a lot for your input. >> >> I agree with you that OFBiz is not an eCommerce platform and also that the >> current themes are there for demonstration but that doesn't change the >> fact >> that it needs a complete rework. So what I'm referring to is more about to >> adapt all of the ftls and screen definitions using one of the fancy HTML5 >> frameworks available rather a cleanup. >> >> >> >> On Tue, May 7, 2013 at 4:29 PM, Adrian Crum < >> adrian.crum@sandglass-**software.com <[hidden email]>> >> wrote: >> >> I agree in principle with this reply. Very few shops use the OFBiz >>> eCommerce front-end - it wasn't intended to be used as-is, instead its >>> there for demonstration purposes. >>> >>> Each business will have a preference for styling their site, so choosing >>> one theme over all others seems presumptuous. >>> >>> As I mentioned in the Jira issue, HTML cleanups are always welcome. >>> Consistent and concise markup makes it easier to design themes - and from >>> my perspective that provides the most benefit to OFBiz developers. >>> >>> -Adrian >>> >>> >>> On 5/7/2013 2:49 PM, Richard Siddall wrote: >>> >>> Jonatan Soto wrote: >>>> >>>> Would be anyone interested in convert the existing frontend themes into >>>>> Bootstrap http://twitter.github.io/****bootstrap/<http://twitter.github.io/**bootstrap/> >>>>> <http://twitter.**github.io/bootstrap/<http://twitter.github.io/bootstrap/> >>>>> > >>>>> >>>>> ? >>>>> >>>>> The idea is to create a theme from scratch that will replace the >>>>> current >>>>> default and multiplex themes. >>>>> >>>>> [snip] >>>> >>>> While I think having more modern front-end themes would be great, let me >>>> play devil's advocate... >>>> >>>> Why Bootstrap? >>>> >>>> Why not Zurb Foundation (http://foundation.zurb.com/), HTML5 >>>> Boilerplate >>>> (http://html5boilerplate.com/) or some other starting point? Or as >>>> Scott Kellum argued on the Compass list (on January 8), use a >>>> combination >>>> of components such as Susy, Sassy-buttons, Color-Schemer, and >>>> Modular-Scale. >>>> >>>> Bootstrap is an easy way of getting a lot of functionality, but it's >>>> arguable overused. It's fast becoming to HTML5 frameworks what Times >>>> Roman >>>> is to web fonts. If you want your web shop to look like everyone else's >>>> web shop, it's a great choice. If you want to differentiate yourself in >>>> the market, use something else. >>>> >>>> Plus, many Bootstrap-based themes just throw the whole bloated framework >>>> at the browser, regardless of which pieces they use, slowing page loads >>>> and >>>> wasting mobile bandwidth allocations. But Bootstrap is built on LESS, >>>> so >>>> you can choose which chunks of CSS and JavaScript should be included in >>>> your site's copy of Bootstrap, as well as using variables and mixins to >>>> get >>>> more consistent CSS styling. >>>> >>>> LESS is based on JavaScript, which practically requires you to install >>>> Node.js to use it. Zurb Foundation is based on SASS, which is written >>>> in >>>> Ruby. It looks like SASS will run on JRuby on the JVM. >>>> >>>> To summarize: >>>> - Bootstrap is just one of several great HTML5 frameworks >>>> - You can get the same effects using straight CSS3 and JavaScript, or >>>> smaller projects for areas like responsive design, button styling, text >>>> spacing, etc. >>>> - Bootstrap is overused >>>> - Bootstrap is frequently ineptly used, penalizing the end user >>>> - A major reason to use Bootstrap is to use LESS and other languages >>>> that >>>> abstract CSS and JavaScript >>>> - Bootstrap may not be the best framework for a Java-based project >>>> >>>> I hope this helps. >>>> >>>> Regards, >>>> >>>> Richard Siddall >>>> >>>> >>> >> > -- ----- Jonatan Soto |
Re: Converting frontend themes to Twitter Bootstrap
|
In reply to this post by Richard Siddall
Hi Richard and everyone,
We are currently using less for our own project based on OFBiz, and it really is cleaning up a lot of noise in stylesheets. We are using a gradle plugin that compiles less to css without node: https://github.com/obecker/gradle-lesscss-plugin and that's working well. So it is likely there are jars out there that compile less to css without node. Cheers Paul Foxworthy
--
Coherent Software Australia Pty Ltd http://www.coherentsoftware.com.au/ Bonsai ERP, the all-inclusive ERP system http://www.bonsaierp.com.au/ |
Re: Converting frontend themes to Twitter Bootstrap
Administrator
|
I'd be also inclined to follow this way.
Though Jonatan's point is to provide an easy mean using a HTLM5 web framework not only one of the tools embedded in those HTLM5 web framework. BTW found this http://stackoverflow.com/questions/9739724/java-compiler-for-less-css Jacques From: "Paul Foxworthy" <[hidden email]> > Hi Richard and everyone, > > We are currently using less for our own project based on OFBiz, and it > really is cleaning up a lot of noise in stylesheets. We are using a gradle > plugin that compiles less to css without node: > > https://github.com/obecker/gradle-lesscss-plugin > > and that's working well. So it is likely there are jars out there that > compile less to css without node. > > Cheers > > Paul Foxworthy > > > Richard Siddall wrote >> Jonatan Soto wrote: >>> Would be anyone interested in convert the existing frontend themes into >>> Bootstrap http://twitter.github.io/bootstrap/? >>> >>> The idea is to create a theme from scratch that will replace the current >>> default and multiplex themes. >> [snip] >> >> While I think having more modern front-end themes would be great, let me >> play devil's advocate... >> >> Why Bootstrap? >> >> Why not Zurb Foundation (http://foundation.zurb.com/), HTML5 Boilerplate >> (http://html5boilerplate.com/) or some other starting point? Or as >> Scott Kellum argued on the Compass list (on January 8), use a >> combination of components such as Susy, Sassy-buttons, Color-Schemer, >> and Modular-Scale. >> >> Bootstrap is an easy way of getting a lot of functionality, but it's >> arguable overused. It's fast becoming to HTML5 frameworks what Times >> Roman is to web fonts. If you want your web shop to look like everyone >> else's web shop, it's a great choice. If you want to differentiate >> yourself in the market, use something else. >> >> Plus, many Bootstrap-based themes just throw the whole bloated framework >> at the browser, regardless of which pieces they use, slowing page loads >> and wasting mobile bandwidth allocations. But Bootstrap is built on >> LESS, so you can choose which chunks of CSS and JavaScript should be >> included in your site's copy of Bootstrap, as well as using variables >> and mixins to get more consistent CSS styling. >> >> LESS is based on JavaScript, which practically requires you to install >> Node.js to use it. Zurb Foundation is based on SASS, which is written >> in Ruby. It looks like SASS will run on JRuby on the JVM. >> >> To summarize: >> - Bootstrap is just one of several great HTML5 frameworks >> - You can get the same effects using straight CSS3 and JavaScript, or >> smaller projects for areas like responsive design, button styling, text >> spacing, etc. >> - Bootstrap is overused >> - Bootstrap is frequently ineptly used, penalizing the end user >> - A major reason to use Bootstrap is to use LESS and other languages >> that abstract CSS and JavaScript >> - Bootstrap may not be the best framework for a Java-based project >> >> I hope this helps. >> >> Regards, >> >> Richard Siddall > > > > > > ----- > -- > Coherent Software Australia Pty Ltd > http://www.coherentsoftware.com.au/ > > Bonsai ERP, the all-inclusive ERP system > http://www.bonsaierp.com.au/ > > -- > View this message in context: http://ofbiz.135035.n4.nabble.com/Converting-frontend-themes-to-Twitter-Bootstrap-tp4641013p4641076.html > Sent from the OFBiz - Dev mailing list archive at Nabble.com. |
|
|
In reply to this post by jonatan soto
Comments inline.
On Tue, 07 May 2013 21:02:21 +0530, Adrian Crum <[hidden email]> wrote: > I understand what you are proposing. So, let me try this again... > > HTML cleanups are fine. Updating the markup to HTML 5 is fine. That sort > of overhaul has been done before and it is always welcome. > > What we are discussing here is introducing an outside styling framework > for the eCommerce application. I question the need for the framework > because most businesses don't use the eCommerce application out of the > box. In other words, we would be investing a lot of time and effort into > something that a lot of businesses will just throw away. > > As Christian pointed out, it would be nice to have a better looking > eCommerce demonstration, and I agree. But again, I think that can be > done with consistent and concise markup - coupled with some good styling. It can be. But the framework helps in defining "consistent and concise markup". Why reinvent? > > I'm not opposed to the external framework idea, I just question the need > for it. > > -Adrian > > On 5/7/2013 4:21 PM, Jonatan Soto wrote: >> Hi Adrian, >> >> Thanks a lot for your input. >> >> I agree with you that OFBiz is not an eCommerce platform and also that >> the >> current themes are there for demonstration but that doesn't change the >> fact >> that it needs a complete rework. So what I'm referring to is more about >> to >> adapt all of the ftls and screen definitions using one of the fancy >> HTML5 >> frameworks available rather a cleanup. >> >> >> >> On Tue, May 7, 2013 at 4:29 PM, Adrian Crum < >> [hidden email]> wrote: >> >>> I agree in principle with this reply. Very few shops use the OFBiz >>> eCommerce front-end - it wasn't intended to be used as-is, instead its >>> there for demonstration purposes. >>> >>> Each business will have a preference for styling their site, so >>> choosing >>> one theme over all others seems presumptuous. >>> >>> As I mentioned in the Jira issue, HTML cleanups are always welcome. >>> Consistent and concise markup makes it easier to design themes - and >>> from >>> my perspective that provides the most benefit to OFBiz developers. >>> >>> -Adrian >>> >>> >>> On 5/7/2013 2:49 PM, Richard Siddall wrote: >>> >>>> Jonatan Soto wrote: >>>> >>>>> Would be anyone interested in convert the existing frontend themes >>>>> into >>>>> Bootstrap >>>>> http://twitter.github.io/**bootstrap/<http://twitter.github.io/bootstrap/> >>>>> ? >>>>> >>>>> The idea is to create a theme from scratch that will replace the >>>>> current >>>>> default and multiplex themes. >>>>> >>>> [snip] >>>> >>>> While I think having more modern front-end themes would be great, let >>>> me >>>> play devil's advocate... >>>> >>>> Why Bootstrap? >>>> >>>> Why not Zurb Foundation (http://foundation.zurb.com/), HTML5 >>>> Boilerplate >>>> (http://html5boilerplate.com/) or some other starting point? Or as >>>> Scott Kellum argued on the Compass list (on January 8), use a >>>> combination >>>> of components such as Susy, Sassy-buttons, Color-Schemer, and >>>> Modular-Scale. >>>> >>>> Bootstrap is an easy way of getting a lot of functionality, but it's >>>> arguable overused. It's fast becoming to HTML5 frameworks what Times >>>> Roman >>>> is to web fonts. If you want your web shop to look like everyone >>>> else's >>>> web shop, it's a great choice. If you want to differentiate yourself >>>> in >>>> the market, use something else. >>>> >>>> Plus, many Bootstrap-based themes just throw the whole bloated >>>> framework >>>> at the browser, regardless of which pieces they use, slowing page >>>> loads and >>>> wasting mobile bandwidth allocations. But Bootstrap is built on >>>> LESS, so >>>> you can choose which chunks of CSS and JavaScript should be included >>>> in >>>> your site's copy of Bootstrap, as well as using variables and mixins >>>> to get >>>> more consistent CSS styling. >>>> >>>> LESS is based on JavaScript, which practically requires you to install >>>> Node.js to use it. Zurb Foundation is based on SASS, which is >>>> written in >>>> Ruby. It looks like SASS will run on JRuby on the JVM. >>>> >>>> To summarize: >>>> - Bootstrap is just one of several great HTML5 frameworks >>>> - You can get the same effects using straight CSS3 and JavaScript, or >>>> smaller projects for areas like responsive design, button styling, >>>> text >>>> spacing, etc. >>>> - Bootstrap is overused >>>> - Bootstrap is frequently ineptly used, penalizing the end user >>>> - A major reason to use Bootstrap is to use LESS and other languages >>>> that >>>> abstract CSS and JavaScript >>>> - Bootstrap may not be the best framework for a Java-based project >>>> >>>> I hope this helps. >>>> >>>> Regards, >>>> >>>> Richard Siddall >>>> >>> >> > -- Using Opera's revolutionary email client: http://www.opera.com/mail/ |
Converting frontend themes using HTML5/CSS framework/s [was Re: Converting frontend themes to Twitter Bootstrap]
|
Administrator
|
Hi,
Jonatan wants to give it a go and begin this weekend. So I created the frontendNewTheme2013-05-10 branch for that, if anybody complains it's always possible to drop it but I see no reasons. For convenience here is the branch creation commit comment Following the thread "Converting frontend themes to Twitter Bootstrap" here is a new branch for that. Actually the thread subject was misleading since we agreed that Twitter Bootstrap is not the only solution. The idea is though to introduce and use a HTML5/CSS framework, Bootstrap, H5Boilerplate and Zurb Foundation will be tried in the process... So I changed the thread subject to Converting frontend themes using HTML5/CSS framework/s. Jacques From: "Atul Vani" <[hidden email]> > Comments inline. > > On Tue, 07 May 2013 21:02:21 +0530, Adrian Crum > <[hidden email]> wrote: > >> I understand what you are proposing. So, let me try this again... >> >> HTML cleanups are fine. Updating the markup to HTML 5 is fine. That sort >> of overhaul has been done before and it is always welcome. >> >> What we are discussing here is introducing an outside styling framework >> for the eCommerce application. I question the need for the framework >> because most businesses don't use the eCommerce application out of the >> box. In other words, we would be investing a lot of time and effort into >> something that a lot of businesses will just throw away. >> >> As Christian pointed out, it would be nice to have a better looking >> eCommerce demonstration, and I agree. But again, I think that can be >> done with consistent and concise markup - coupled with some good styling. > > It can be. But the framework helps in defining "consistent and concise > markup". Why reinvent? > >> >> I'm not opposed to the external framework idea, I just question the need >> for it. >> >> -Adrian >> >> On 5/7/2013 4:21 PM, Jonatan Soto wrote: >>> Hi Adrian, >>> >>> Thanks a lot for your input. >>> >>> I agree with you that OFBiz is not an eCommerce platform and also that >>> the >>> current themes are there for demonstration but that doesn't change the >>> fact >>> that it needs a complete rework. So what I'm referring to is more about >>> to >>> adapt all of the ftls and screen definitions using one of the fancy >>> HTML5 >>> frameworks available rather a cleanup. >>> >>> >>> >>> On Tue, May 7, 2013 at 4:29 PM, Adrian Crum < >>> [hidden email]> wrote: >>> >>>> I agree in principle with this reply. Very few shops use the OFBiz >>>> eCommerce front-end - it wasn't intended to be used as-is, instead its >>>> there for demonstration purposes. >>>> >>>> Each business will have a preference for styling their site, so >>>> choosing >>>> one theme over all others seems presumptuous. >>>> >>>> As I mentioned in the Jira issue, HTML cleanups are always welcome. >>>> Consistent and concise markup makes it easier to design themes - and >>>> from >>>> my perspective that provides the most benefit to OFBiz developers. >>>> >>>> -Adrian >>>> >>>> >>>> On 5/7/2013 2:49 PM, Richard Siddall wrote: >>>> >>>>> Jonatan Soto wrote: >>>>> >>>>>> Would be anyone interested in convert the existing frontend themes >>>>>> into >>>>>> Bootstrap >>>>>> http://twitter.github.io/**bootstrap/<http://twitter.github.io/bootstrap/> >>>>>> ? >>>>>> >>>>>> The idea is to create a theme from scratch that will replace the >>>>>> current >>>>>> default and multiplex themes. >>>>>> >>>>> [snip] >>>>> >>>>> While I think having more modern front-end themes would be great, let >>>>> me >>>>> play devil's advocate... >>>>> >>>>> Why Bootstrap? >>>>> >>>>> Why not Zurb Foundation (http://foundation.zurb.com/), HTML5 >>>>> Boilerplate >>>>> (http://html5boilerplate.com/) or some other starting point? Or as >>>>> Scott Kellum argued on the Compass list (on January 8), use a >>>>> combination >>>>> of components such as Susy, Sassy-buttons, Color-Schemer, and >>>>> Modular-Scale. >>>>> >>>>> Bootstrap is an easy way of getting a lot of functionality, but it's >>>>> arguable overused. It's fast becoming to HTML5 frameworks what Times >>>>> Roman >>>>> is to web fonts. If you want your web shop to look like everyone >>>>> else's >>>>> web shop, it's a great choice. If you want to differentiate yourself >>>>> in >>>>> the market, use something else. >>>>> >>>>> Plus, many Bootstrap-based themes just throw the whole bloated >>>>> framework >>>>> at the browser, regardless of which pieces they use, slowing page >>>>> loads and >>>>> wasting mobile bandwidth allocations. But Bootstrap is built on >>>>> LESS, so >>>>> you can choose which chunks of CSS and JavaScript should be included >>>>> in >>>>> your site's copy of Bootstrap, as well as using variables and mixins >>>>> to get >>>>> more consistent CSS styling. >>>>> >>>>> LESS is based on JavaScript, which practically requires you to install >>>>> Node.js to use it. Zurb Foundation is based on SASS, which is >>>>> written in >>>>> Ruby. It looks like SASS will run on JRuby on the JVM. >>>>> >>>>> To summarize: >>>>> - Bootstrap is just one of several great HTML5 frameworks >>>>> - You can get the same effects using straight CSS3 and JavaScript, or >>>>> smaller projects for areas like responsive design, button styling, >>>>> text >>>>> spacing, etc. >>>>> - Bootstrap is overused >>>>> - Bootstrap is frequently ineptly used, penalizing the end user >>>>> - A major reason to use Bootstrap is to use LESS and other languages >>>>> that >>>>> abstract CSS and JavaScript >>>>> - Bootstrap may not be the best framework for a Java-based project >>>>> >>>>> I hope this helps. >>>>> >>>>> Regards, >>>>> >>>>> Richard Siddall >>>>> >>>> >>> >> > > > -- > Using Opera's revolutionary email client: http://www.opera.com/mail/ |
Re: Converting frontend themes to Twitter Bootstrap
|
|
In reply to this post by Jacques Le Roux
Jacques Le Roux wrote:
> Thanks Richard, > > Would you be interested in such an effort? > > For those interested by this discussion and, like me, not aware of those frameworks, I found those 2 Quoras links > http://www.quora.com/Front-End-Web-Development/Which-should-I-use-Foundation-Bootstrap-or-HTML5-Boilerplate > http://www.quora.com/Is-Bootstrap-a-complement-OR-an-alternative-to-HTML5-Boilerplate-or-viceversa > > Jacques > Jacques, Yes, I'd love to help, but I'm not sure how much time I'd have to help, and I'm a beginner at OFBiz development. Richard. |
Re: Converting frontend themes to Twitter Bootstrap
|
|
In reply to this post by jonatan soto
Jonatan Soto wrote:
> Hi Richard, > Hi Jonatan, > First of all, thanks a lot for you input. > > In response to your question about why Bootstrap, I just suggested it > because that's the one I already used in a couple of OFBiz projects. > Actually the designer who introduced Bootstrap for one of those projects > also suggested Zurb, but since I already had a bit of Bootstrap knowledge I > decided to use it as well for the other project. > Well, that doesn't change the fact that you are right. There is no reason > to do it with Bootstrap exclusively so I think we could rename this thread > to just 'Converting frontend themes to a HTML5 framework' until we decide > which framework (if any) we should use. > As a side note, I must say that I am not a web designer. > I think it would be useful to have sample themes that use Bootstrap, Zurb Foundation, and straight HTML5/CSS3. But as I understand it those should all go in extras; we'd only distribute one theme as part of the OFBiz distribution. >>From my understanding your idea is to let users to compile a customized > framework based on Bootstrap, HTML5Boilerplate or Zurb within OFBiz, > correct? If so, my initial idea was a bit different, I just wanted to use a > customized version of Bootstrap compiled directly from their site: > http://twitter.github.io/bootstrap/customize.html > I think using a customized bootstrap would be fine. It would be neat if building OFBiz could do the customization for you automatically, but it's more pragmatic to do the customization manually. Richard. |
Re: Converting frontend themes to Twitter Bootstrap
|
|
random thoughts...
I have been doing a lot of CSS stuff recently and studied most of the framework discussed here. Working with Bootstrap or Zurb means to comply with their markup, philosophy, and such. Therefore any HTML/CSS is definitively tied to these frameworks thus far less reusable, flexible and customisable, than a more general purpose markup. As great as bootstrap may be (wich remains to be seen), it may not be suited to most of ecommerce projects. Which greatly, greatly increase the risk of the new frontend theme being thrown away by most of the companies. HTML5BP is more a condensed of HTML/CSS best practices. As such it seems to be a much better starting point. Less is generally considered inferior as Sass by many CSS gurus. http://sass-lang.com/ OOCSS principles seems popular among people used to maintain large-scale websites (facebook, yahoo, etc.) https://github.com/stubbornella/oocss/wiki/faq http://csswizardry.com/ Some light-weight CSS frameworks are based on these principles : http://inuitcss.com/ http://www.knacss.com/ Again, as for HTML5BP, this is more of a condensed of best practices and CSS rules wich can be used on a per-need basis, rather than a full-bloated CSS framework. It could be used to restructure the current theme and markup into something more maintenable, easily customisable and more likely to be re-used by companies. Christophe |
«
Return to OFBiz - Dev
|
1 view|%1 views
| Free forum by Nabble | Edit this page |