Hi,

I was working hard this past days to make Jewel look ok on IE11. I think I
get it and I can show you the results in a browser stack screen capture

https://snag.gy/IlVFmY.jpg

So we now supports IE11, Edge, Chrome, Firefox, Safari, Opera, and in
mobile most important devices iOS (I think from 9.0+), Android (almost all
I tested looks the same), Windows Phone (If anyone uses it ;)), maybe even
more, it's a matter of test more with Browserstack ;). So I think we have
support for almost all important browsers out there right?

There's still some issues left:

* Slider: Since the -ms-thumb can overflow track, and can't find the way to
do this, in IE11 instead of scale up when press, it scale down a bit...
* Alert, the width in IE11 is still huge, and still didn't find a way to
solve it, if some
* Dropdownlist is in the example, but I still couldn't work on it, so is
still a first iteration based on old basic code, so this will change a lot
as I can get over it.
* I think Button has still some issue with width that needs to be looked...
* Actual layouts are working ok, but I hope to change all this soon to
something more final and very important: Responsive ;)

Spetial mention to SVGs (used in CheckBox and RadioButton for now), since I
past many hours dealing with how to load SVG in IE11, and had to try many
things and almost nothing was working. Finaly after some days, the trick
was to use SVG with a bit of encoding (no base64, not works) and change
strategy on how to skin (only pseudo elements did the work). All this to
get coloring and size working on IE11 since there's some bugs that prevents
IE11 to read styles on SVG. All this was totally hacky, maybe there's more
way, but I must say after many days this was the only that solves the issue.

The good part of this is that now Check and Radio looks better (I think)
since I adjusted the icons and added some scale animations that work great
cross browser.

finaly I'm very happy with the solution, since the encoding is made with a
SASS function that takes the SVG, calculate the right color (as normal in
Jewel themes) and then encode the SVG to get the final shape compatible
with all devices and browsers, and saving few space as well :)

Now is time to concentrate in layouts, since this is critical now to make
Jewel UI set more useful, I already made some work on it, but find some
problems, and need to see how to overcome it. Important points as I already
said here are: make layouts responsive, so css will take into account media
screen sizes, and make those layouts work only with class names, so no JS
computation should be made. Let's see if I can get this working.

Another point I want to try is exploding components since I'm interested in
see if I can declare components with it's beads as Alex said. And if those
not work, see why, and see if Basic is still capable of do this. Another
task will be to try SWF and see what is missing to make it work at least
with "bounding boxes" for now.

Finaly, I plan to update all blog examples post but maybe I'll wait to have
new layouts more operative...

Hope you like all this! :)


-- 
Carlos Rovira
http://about.me/carlosrovira

Reply via email to