search

zeljkoprsa / waterlee-boilerplate

Magento HTML5 Responsive Theme Boilerplate
Creative Commons Zero v1.0 Universal
293 stars 102 forks source link

wip-1.9 Feature Questions/Suggestions #82

Open azeemism opened 9 years ago

azeemism commented 9 years ago
1. Does/will this include ` * { Box-sizing: Border-box } FTW ` possible best practice?

http://www.paulirish.com/2012/box-sizing-border-box-ftw/ https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/

Making it easier to size box elements

2. Is html5 clearfix used or is this taken care of through Foundations?

http://leveluptuts.com/tutorials/css-tutorials/16-creating-two-column-layouts-floats https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css

 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
3. Is bxSlider a better option than Owl Carousel?

http://bxslider.com/ http://owlgraphic.com/owlcarousel/ http://devdocs.magento.com/guides/m1x/ce19-ee114/RWD_dev-guide.html

Magento rwd doc suggest using Owl Carousel because it is fully touch responsive. Is bxSlider also fully touch responsive? From the demos it doesn't look like bxSlider responds well to swiping an image?

4. Does Elevate Zoom transition between zoom types 2px too quickly?

http://waterlee.jakesharp.co/demo19/vip/madison-rx3400.html#additional|demoTab1 http://waterlee.jakesharp.co/demo19/men/shirts/slim-fit-dobby-oxford-shirt-469.html

I really like the way you have setup Elevate Zoom to transition between zoom types. If the transition were delayed until page pixel width of 642, it would work better with how the page design transition and make the page more mobile friendly (tested in chrome with the two demo links above). Currently I believe the transition happens at 640px, putting the zoom windows almost totally off the view area.

I think you guys do great work. Thanks for being a great resource to the community.

Much appreciation.

marjanbonus commented 9 years ago

Hi @azeemism Thanks for kind words, suggestions & spotting some issues! :+1: It's important to us, especially because we are finalizing a new Waterlee version. Here are quick answers:

  1. It's included in Foundation under _global.scss (Paul Irish principle) I've included it under scss/_foundation.scss and it'll be soon on master branch.
  2. Foundation has it in _global.scss which is included by default from now. To clear floats, simply add class .clearfix to the parent.
  3. You are right about owl, it's a great slider. We put bx simply because it's often used on our projects but recently owl is used also and it proved to be an excellent, so we could set it to be default one in Waterlee.
  4. True, I incresed the breaking point to avoid zoom window position problem.
azeemism commented 9 years ago

Hi @marjanbonus,

Excellent quick response. Sounds Great. Thanks.

I feel if Waterlee has a focus in wip-1.9 to make future website design transitions to 2.0 easier, it will be a real winner with developers worried about transitioning later when 2.0 is stable and somewhat mature.

azeemism commented 9 years ago

Hi @marjanbonus,

Yes setting Owl Carousel as the default slider would be great!