Hi, I was this days playing with SVG to skin a button. My target was to try to get a complete theme that could be skinned only with SVG.
After playing with Button, I don't see an easy way to make a button works ok with SVG. I think the way to do this it with "border-image" property in order to have some kind of 9-slice scaling, but this property seems not to work ok in all browser (let me know if I'm wrong) [1] So for Button I ended using CSS3 properties. In the case of buttons, I must to say that this seems to target almost 95% of what people expect. And using software like Sketch I think that get to the final CSS 3 code is in some way "quick". For square graphics like radios or checkboxes maybe SVG will fit more easily. I'll let you know as I get to that. btw, although I'm uploading some styles, don't take the current work as final. It should change a lot as I get more components and rework all as I get more experience I the complete set. In the end, I have to make a refactor to "Jewel", and the current theme is called blue but I uploaded a orange button ;), I'm getting some experience on what can I do and what not :) For example this is a first render of the current button, just for fun :) [1] https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_border-image -- Carlos Rovira http://about.me/carlosrovira
