├── .gitignore ├── README.md ├── gitbook ├── .gitignore ├── Book.txt ├── README.md ├── SUMMARY.md ├── _book │ ├── Book.txt │ ├── chapter1.html │ ├── chapter10.html │ ├── chapter11.html │ ├── chapter12.html │ ├── chapter13.html │ ├── chapter14.html │ ├── chapter15.html │ ├── chapter16.html │ ├── chapter2.html │ ├── chapter3.html │ ├── chapter4.html │ ├── chapter5.html │ ├── chapter6.html │ ├── chapter7.html │ ├── chapter8.html │ ├── chapter9.html │ ├── gitbook │ │ ├── fonts │ │ │ └── fontawesome │ │ │ │ ├── FontAwesome.otf │ │ │ │ ├── fontawesome-webfont.eot │ │ │ │ ├── fontawesome-webfont.svg │ │ │ │ ├── fontawesome-webfont.ttf │ │ │ │ ├── fontawesome-webfont.woff │ │ │ │ └── fontawesome-webfont.woff2 │ │ ├── gitbook-plugin-fontsettings │ │ │ ├── fontsettings.js │ │ │ └── website.css │ │ ├── gitbook-plugin-highlight │ │ │ ├── ebook.css │ │ │ └── website.css │ │ ├── gitbook-plugin-lunr │ │ │ ├── lunr.min.js │ │ │ └── search-lunr.js │ │ ├── gitbook-plugin-search │ │ │ ├── lunr.min.js │ │ │ ├── search-engine.js │ │ │ ├── search.css │ │ │ └── search.js │ │ ├── gitbook-plugin-sharing │ │ │ └── buttons.js │ │ ├── gitbook.js │ │ ├── images │ │ │ ├── apple-touch-icon-precomposed-152.png │ │ │ └── favicon.ico │ │ ├── style.css │ │ └── theme.js │ ├── images │ │ ├── Capitulo-1 │ │ │ ├── introduccion-editar-codepen.jpg │ │ │ ├── introduccion-expandir-html-codepen.jpg │ │ │ ├── introduccion-opciones-menu-editor-codepen.jpg │ │ │ └── introduccion-primera-vista-codepen.jpg │ │ ├── Capitulo-11 │ │ │ ├── AURE un tema de Jekyll.html │ │ │ ├── Capitulo-11-con-svg-sprite-map.jpg │ │ │ ├── Capitulo-11-defs.jpg │ │ │ ├── Capitulo-11-defsGroup.jpg │ │ │ ├── Capitulo-11-group.jpg │ │ │ ├── Capitulo-11-internet-explorer-svgsprite.jpg │ │ │ ├── Capitulo-11-sin-svg-sprite-map.jpg │ │ │ ├── Capitulo-11-useCSS.jpg │ │ │ └── Capitulo-11-useexterno.jpg │ │ ├── Capitulo-12 │ │ │ ├── Sin título-1 (1) (1).jpg │ │ │ ├── optimizar-comparativa-cien.jpg │ │ │ ├── optimizar-comparativa-diez.jpg │ │ │ ├── optimizar-svg-cleaner-attributtes.jpg │ │ │ ├── optimizar-svg-cleaner-attributtes.psd │ │ │ ├── optimizar-svg-cleaner-elements.jpg │ │ │ ├── optimizar-svg-cleaner-files.jpg │ │ │ ├── optimizar-svg-cleaner-optimizations.jpg │ │ │ ├── optimizar-svg-cleaner-paths.jpg │ │ │ ├── optimizar-svg-cleaner-preferences.jpg │ │ │ ├── optimizar-svg-cleaner-principal.jpg │ │ │ ├── optimizar-svgo-online.jpg │ │ │ ├── optimizar-svgo.jpg │ │ │ └── optimizar-svgogui.jpg │ │ ├── Capitulo-13 │ │ │ ├── voice-over-accesibilidad.jpg │ │ │ ├── voice-over-activar.jpg │ │ │ ├── voice-over-preferencias.jpg │ │ │ └── wai-aria-describler.jpg │ │ ├── Capitulo-2 │ │ │ ├── exportar-boton-sketch.jpg │ │ │ ├── exportar-codigo-illustrator.jpg │ │ │ ├── exportar-guardar-como-illustrator.jpg │ │ │ ├── exportar-menu-archivo-illustrator.jpg │ │ │ ├── exportar-menu-archivo-inkscape.jpg │ │ │ ├── exportar-menu-guardar-inkscape.jpg │ │ │ ├── exportar-menu-sketch.jpg │ │ │ ├── exportar-menu-sketch2.jpg │ │ │ ├── exportar-opciones-illustrator.jpg │ │ │ ├── exportar-sketch.jpg │ │ │ ├── exportar-svg-opciones.png │ │ │ ├── fallback-javascript.jpg │ │ │ └── wordpress-galeria-svg.jpg │ │ ├── Capitulo-3 │ │ │ ├── Capitulo-3-namespaces.jpg │ │ │ ├── Capitulo-3-preserveAspectRatio-slice.jpg │ │ │ ├── Capitulo-3-viewBox.jpg │ │ │ └── capitulo-3-preserveaspectratio.jpg │ │ ├── Capitulo-4 │ │ │ ├── Capitulo-4-circle.jpg │ │ │ ├── Capitulo-4-curveTo.jpg │ │ │ ├── Capitulo-4-ellipse.jpg │ │ │ ├── Capitulo-4-fill-opacity.jpg │ │ │ ├── Capitulo-4-fill-rule.jpg │ │ │ ├── Capitulo-4-line.jpg │ │ │ ├── Capitulo-4-lineDos.jpg │ │ │ ├── Capitulo-4-moveto.jpg │ │ │ ├── Capitulo-4-path-absolutas-relativas.jpg │ │ │ ├── Capitulo-4-path-arc.jpg │ │ │ ├── Capitulo-4-path-horizontalto.jpg │ │ │ ├── Capitulo-4-polygon.jpg │ │ │ ├── Capitulo-4-polyline.jpg │ │ │ ├── Capitulo-4-rect.jpg │ │ │ ├── Capitulo-4-smoothCuadraticCurveTo.jpg │ │ │ ├── Capitulo-4-smoothCurveTo.jpg │ │ │ ├── Capitulo-4-stroke-dasharray.jpg │ │ │ ├── Capitulo-4-stroke-dashoffset.jpg │ │ │ ├── Capitulo-4-stroke-linecap.jpg │ │ │ ├── Capitulo-4-stroke-linejoin.jpg │ │ │ └── Capitulo-4-stroke-miterlimit.jpg │ │ ├── Capitulo-5 │ │ │ ├── Capitulo-5-textPath.jpg │ │ │ ├── Capitulo-5-texto.jpg │ │ │ └── Capitulo-5-tspan.jpg │ │ ├── Capitulo-6 │ │ │ ├── Capitulo-6-matrix.jpg │ │ │ ├── Capitulo-6-rotate.jpg │ │ │ ├── Capitulo-6-scale.jpg │ │ │ ├── Capitulo-6-skewX.jpg │ │ │ ├── Capitulo-6-skewY.jpg │ │ │ └── Capitulo-6-translate.jpg │ │ ├── Capitulo-7 │ │ │ ├── Capitulo-7-feBlend.jpg │ │ │ ├── Capitulo-7-feColorMatrix.jpg │ │ │ ├── Capitulo-7-feComponentTransfer.jpg │ │ │ ├── Capitulo-7-feComposite.jpg │ │ │ ├── Capitulo-7-feConlvolveMatrix.jpg │ │ │ ├── Capitulo-7-feDiffuseLightingDistantLight.jpg │ │ │ ├── Capitulo-7-feDiffuseLightingPointLight.jpg │ │ │ ├── Capitulo-7-feDiffuseLightingSpotLight.jpg │ │ │ ├── Capitulo-7-feDisplacementMap.jpg │ │ │ ├── Capitulo-7-feFlood.jpg │ │ │ ├── Capitulo-7-feGaussianBlur.jpg │ │ │ ├── Capitulo-7-feImage.jpg │ │ │ ├── Capitulo-7-feImageconLuces.jpg │ │ │ ├── Capitulo-7-feMorphology.jpg │ │ │ ├── Capitulo-7-feOffset.jpg │ │ │ ├── Capitulo-7-feSpecularLightingDistantLight.jpg │ │ │ ├── Capitulo-7-feSpecularLightingPointLight.jpg │ │ │ ├── Capitulo-7-feSpecularLightingSpotLight.jpg │ │ │ ├── Capitulo-7-feTile.jpg │ │ │ └── Capitulo-7-feTurbulence.jpg │ │ ├── Capitulo-8 │ │ │ ├── Capitulo-8-gradientTransform.jpg │ │ │ ├── Capitulo-8-linearGradient.jpg │ │ │ ├── Capitulo-8-radialGradient.jpg │ │ │ └── Capitulo-8-spreadMethod.jpg │ │ ├── Capitulo-9 │ │ │ ├── Capitulo-9-clipPath.jpg │ │ │ ├── Capitulo-9-clipPathTexto.jpg │ │ │ ├── Capitulo-9-mask.jpg │ │ │ ├── Capitulo-9-patterns.jpg │ │ │ └── Capitulo-9-symbol.jpg │ │ ├── logo-codepen.jpg │ │ ├── logo-github.png │ │ ├── soporte │ │ │ ├── cuarta.jpg │ │ │ ├── feComponentTransfer-safari-chrome.jpg │ │ │ ├── feConvolveMatrix-safari-chrome.jpg │ │ │ ├── feDiffuseLightingPointLight-safari-chrome-firefox.jpg │ │ │ ├── feDiffuseLightingSpotLight-safari-chrome-firefox.jpg │ │ │ ├── feDisplacementMap-safari-chrome.jpg │ │ │ ├── feGaussianBlur-safari-chrome.jpg │ │ │ ├── feImage-safari-firefox.jpg │ │ │ ├── feMorphology-safari-chrome.jpg │ │ │ ├── feSpecularLightingDistantLight.jpg │ │ │ ├── feSpecularLightingPointLight.jpg │ │ │ ├── feSpecularLightingSpotLight.jpg │ │ │ ├── feTurbulence-safari-firefox.jpg │ │ │ ├── nueve.jpg │ │ │ ├── ocho.jpg │ │ │ ├── primera.jpg │ │ │ ├── quinta.jpg │ │ │ ├── segunda.jpg │ │ │ ├── septima.jpg │ │ │ ├── sexta.jpg │ │ │ └── tercera.jpg │ │ └── title_page.jpg │ ├── index.html │ └── search_index.json ├── book.json ├── chapter1.md ├── chapter10.md ├── chapter11.md ├── chapter12.md ├── chapter13.md ├── chapter14.md ├── chapter15.md ├── chapter16.md ├── chapter2.md ├── chapter3.md ├── chapter4.md ├── chapter5.md ├── chapter6.md ├── chapter7.md ├── chapter8.md ├── chapter9.md └── images │ ├── Capitulo-1 │ ├── introduccion-editar-codepen.jpg │ ├── introduccion-expandir-html-codepen.jpg │ ├── introduccion-opciones-menu-editor-codepen.jpg │ └── introduccion-primera-vista-codepen.jpg │ ├── Capitulo-11 │ ├── AURE un tema de Jekyll.html │ ├── Capitulo-11-con-svg-sprite-map.jpg │ ├── Capitulo-11-defs.jpg │ ├── Capitulo-11-defsGroup.jpg │ ├── Capitulo-11-group.jpg │ ├── Capitulo-11-internet-explorer-svgsprite.jpg │ ├── Capitulo-11-sin-svg-sprite-map.jpg │ ├── Capitulo-11-useCSS.jpg │ └── Capitulo-11-useexterno.jpg │ ├── Capitulo-12 │ ├── Sin título-1 (1) (1).jpg │ ├── optimizar-comparativa-cien.jpg │ ├── optimizar-comparativa-diez.jpg │ ├── optimizar-svg-cleaner-attributtes.jpg │ ├── optimizar-svg-cleaner-attributtes.psd │ ├── optimizar-svg-cleaner-elements.jpg │ ├── optimizar-svg-cleaner-files.jpg │ ├── optimizar-svg-cleaner-optimizations.jpg │ ├── optimizar-svg-cleaner-paths.jpg │ ├── optimizar-svg-cleaner-preferences.jpg │ ├── optimizar-svg-cleaner-principal.jpg │ ├── optimizar-svgo-online.jpg │ ├── optimizar-svgo.jpg │ └── optimizar-svgogui.jpg │ ├── Capitulo-13 │ ├── voice-over-accesibilidad.jpg │ ├── voice-over-activar.jpg │ ├── voice-over-preferencias.jpg │ └── wai-aria-describler.jpg │ ├── Capitulo-2 │ ├── exportar-boton-sketch.jpg │ ├── exportar-codigo-illustrator.jpg │ ├── exportar-guardar-como-illustrator.jpg │ ├── exportar-menu-archivo-illustrator.jpg │ ├── exportar-menu-archivo-inkscape.jpg │ ├── exportar-menu-guardar-inkscape.jpg │ ├── exportar-menu-sketch.jpg │ ├── exportar-menu-sketch2.jpg │ ├── exportar-opciones-illustrator.jpg │ ├── exportar-sketch.jpg │ ├── exportar-svg-opciones.png │ ├── fallback-javascript.jpg │ └── wordpress-galeria-svg.jpg │ ├── Capitulo-3 │ ├── Capitulo-3-namespaces.jpg │ ├── Capitulo-3-preserveAspectRatio-slice.jpg │ ├── Capitulo-3-viewBox.jpg │ └── capitulo-3-preserveaspectratio.jpg │ ├── Capitulo-4 │ ├── Capitulo-4-circle.jpg │ ├── Capitulo-4-curveTo.jpg │ ├── Capitulo-4-ellipse.jpg │ ├── Capitulo-4-fill-opacity.jpg │ ├── Capitulo-4-fill-rule.jpg │ ├── Capitulo-4-line.jpg │ ├── Capitulo-4-lineDos.jpg │ ├── Capitulo-4-moveto.jpg │ ├── Capitulo-4-path-absolutas-relativas.jpg │ ├── Capitulo-4-path-arc.jpg │ ├── Capitulo-4-path-horizontalto.jpg │ ├── Capitulo-4-polygon.jpg │ ├── Capitulo-4-polyline.jpg │ ├── Capitulo-4-rect.jpg │ ├── Capitulo-4-smoothCuadraticCurveTo.jpg │ ├── Capitulo-4-smoothCurveTo.jpg │ ├── Capitulo-4-stroke-dasharray.jpg │ ├── Capitulo-4-stroke-dashoffset.jpg │ ├── Capitulo-4-stroke-linecap.jpg │ ├── Capitulo-4-stroke-linejoin.jpg │ └── Capitulo-4-stroke-miterlimit.jpg │ ├── Capitulo-5 │ ├── Capitulo-5-textPath.jpg │ ├── Capitulo-5-texto.jpg │ └── Capitulo-5-tspan.jpg │ ├── Capitulo-6 │ ├── Capitulo-6-matrix.jpg │ ├── Capitulo-6-rotate.jpg │ ├── Capitulo-6-scale.jpg │ ├── Capitulo-6-skewX.jpg │ ├── Capitulo-6-skewY.jpg │ └── Capitulo-6-translate.jpg │ ├── Capitulo-7 │ ├── Capitulo-7-feBlend.jpg │ ├── Capitulo-7-feColorMatrix.jpg │ ├── Capitulo-7-feComponentTransfer.jpg │ ├── Capitulo-7-feComposite.jpg │ ├── Capitulo-7-feConlvolveMatrix.jpg │ ├── Capitulo-7-feDiffuseLightingDistantLight.jpg │ ├── Capitulo-7-feDiffuseLightingPointLight.jpg │ ├── Capitulo-7-feDiffuseLightingSpotLight.jpg │ ├── Capitulo-7-feDisplacementMap.jpg │ ├── Capitulo-7-feFlood.jpg │ ├── Capitulo-7-feGaussianBlur.jpg │ ├── Capitulo-7-feImage.jpg │ ├── Capitulo-7-feImageconLuces.jpg │ ├── Capitulo-7-feMorphology.jpg │ ├── Capitulo-7-feOffset.jpg │ ├── Capitulo-7-feSpecularLightingDistantLight.jpg │ ├── Capitulo-7-feSpecularLightingPointLight.jpg │ ├── Capitulo-7-feSpecularLightingSpotLight.jpg │ ├── Capitulo-7-feTile.jpg │ └── Capitulo-7-feTurbulence.jpg │ ├── Capitulo-8 │ ├── Capitulo-8-gradientTransform.jpg │ ├── Capitulo-8-linearGradient.jpg │ ├── Capitulo-8-radialGradient.jpg │ └── Capitulo-8-spreadMethod.jpg │ ├── Capitulo-9 │ ├── Capitulo-9-clipPath.jpg │ ├── Capitulo-9-clipPathTexto.jpg │ ├── Capitulo-9-mask.jpg │ ├── Capitulo-9-patterns.jpg │ └── Capitulo-9-symbol.jpg │ ├── logo-codepen.jpg │ ├── logo-github.png │ ├── soporte │ ├── cuarta.jpg │ ├── feComponentTransfer-safari-chrome.jpg │ ├── feConvolveMatrix-safari-chrome.jpg │ ├── feDiffuseLightingPointLight-safari-chrome-firefox.jpg │ ├── feDiffuseLightingSpotLight-safari-chrome-firefox.jpg │ ├── feDisplacementMap-safari-chrome.jpg │ ├── feGaussianBlur-safari-chrome.jpg │ ├── feImage-safari-firefox.jpg │ ├── feMorphology-safari-chrome.jpg │ ├── feSpecularLightingDistantLight.jpg │ ├── feSpecularLightingPointLight.jpg │ ├── feSpecularLightingSpotLight.jpg │ ├── feTurbulence-safari-firefox.jpg │ ├── nueve.jpg │ ├── ocho.jpg │ ├── primera.jpg │ ├── quinta.jpg │ ├── segunda.jpg │ ├── septima.jpg │ ├── sexta.jpg │ └── tercera.jpg │ └── title_page.jpg ├── manuscript ├── Book.txt ├── Sample.txt ├── Subset.txt ├── chapter1.txt ├── chapter10.txt ├── chapter11.txt ├── chapter12.txt ├── chapter13.txt ├── chapter14.txt ├── chapter15.txt ├── chapter16.txt ├── chapter2.txt ├── chapter3.txt ├── chapter4.txt ├── chapter5.txt ├── chapter6.txt ├── chapter7.txt ├── chapter8.txt ├── chapter9.txt └── images │ ├── Capitulo-1 │ ├── introduccion-editar-codepen.jpg │ ├── introduccion-expandir-html-codepen.jpg │ ├── introduccion-opciones-menu-editor-codepen.jpg │ └── introduccion-primera-vista-codepen.jpg │ ├── Capitulo-11 │ ├── AURE un tema de Jekyll.html │ ├── Capitulo-11-con-svg-sprite-map.jpg │ ├── Capitulo-11-defs.jpg │ ├── Capitulo-11-defsGroup.jpg │ ├── Capitulo-11-group.jpg │ ├── Capitulo-11-internet-explorer-svgsprite.jpg │ ├── Capitulo-11-sin-svg-sprite-map.jpg │ ├── Capitulo-11-useCSS.jpg │ └── Capitulo-11-useexterno.jpg │ ├── Capitulo-12 │ ├── Sin título-1 (1) (1).jpg │ ├── optimizar-comparativa-cien.jpg │ ├── optimizar-comparativa-diez.jpg │ ├── optimizar-svg-cleaner-attributtes.jpg │ ├── optimizar-svg-cleaner-attributtes.psd │ ├── optimizar-svg-cleaner-elements.jpg │ ├── optimizar-svg-cleaner-files.jpg │ ├── optimizar-svg-cleaner-optimizations.jpg │ ├── optimizar-svg-cleaner-paths.jpg │ ├── optimizar-svg-cleaner-preferences.jpg │ ├── optimizar-svg-cleaner-principal.jpg │ ├── optimizar-svgo-online.jpg │ ├── optimizar-svgo.jpg │ └── optimizar-svgogui.jpg │ ├── Capitulo-13 │ ├── voice-over-accesibilidad.jpg │ ├── voice-over-activar.jpg │ ├── voice-over-preferencias.jpg │ └── wai-aria-describler.jpg │ ├── Capitulo-14 │ ├── Capitulo-14-polynom.jpg │ └── Capitulo-14-xvg.jpg │ ├── Capitulo-2 │ ├── exportar-boton-sketch.jpg │ ├── exportar-codigo-illustrator.jpg │ ├── exportar-guardar-como-illustrator.jpg │ ├── exportar-menu-archivo-illustrator.jpg │ ├── exportar-menu-archivo-inkscape.jpg │ ├── exportar-menu-guardar-inkscape.jpg │ ├── exportar-menu-sketch.jpg │ ├── exportar-menu-sketch2.jpg │ ├── exportar-opciones-illustrator.jpg │ ├── exportar-sketch.jpg │ ├── exportar-svg-opciones.png │ ├── fallback-javascript.jpg │ └── wordpress-galeria-svg.jpg │ ├── Capitulo-3 │ ├── Capitulo-3-namespaces.jpg │ ├── Capitulo-3-preserveAspectRatio-slice.jpg │ ├── Capitulo-3-viewBox.jpg │ └── capitulo-3-preserveaspectratio.jpg │ ├── Capitulo-4 │ ├── Capitulo-4-circle.jpg │ ├── Capitulo-4-curveTo.jpg │ ├── Capitulo-4-ellipse.jpg │ ├── Capitulo-4-fill-opacity.jpg │ ├── Capitulo-4-fill-rule.jpg │ ├── Capitulo-4-line.jpg │ ├── Capitulo-4-lineDos.jpg │ ├── Capitulo-4-moveto.jpg │ ├── Capitulo-4-path-absolutas-relativas.jpg │ ├── Capitulo-4-path-arc.jpg │ ├── Capitulo-4-path-horizontalto.jpg │ ├── Capitulo-4-polygon.jpg │ ├── Capitulo-4-polyline.jpg │ ├── Capitulo-4-rect.jpg │ ├── Capitulo-4-smoothCuadraticCurveTo.jpg │ ├── Capitulo-4-smoothCurveTo.jpg │ ├── Capitulo-4-stroke-dasharray.jpg │ ├── Capitulo-4-stroke-dashoffset.jpg │ ├── Capitulo-4-stroke-linecap.jpg │ ├── Capitulo-4-stroke-linejoin.jpg │ └── Capitulo-4-stroke-miterlimit.jpg │ ├── Capitulo-5 │ ├── Capitulo-5-textPath.jpg │ ├── Capitulo-5-texto.jpg │ └── Capitulo-5-tspan.jpg │ ├── Capitulo-6 │ ├── Capitulo-6-matrix.jpg │ ├── Capitulo-6-rotate.jpg │ ├── Capitulo-6-scale.jpg │ ├── Capitulo-6-skewX.jpg │ ├── Capitulo-6-skewY.jpg │ └── Capitulo-6-translate.jpg │ ├── Capitulo-7 │ ├── Capitulo-7-feBlend.jpg │ ├── Capitulo-7-feColorMatrix.jpg │ ├── Capitulo-7-feComponentTransfer.jpg │ ├── Capitulo-7-feComposite.jpg │ ├── Capitulo-7-feConlvolveMatrix.jpg │ ├── Capitulo-7-feDiffuseLightingDistantLight.jpg │ ├── Capitulo-7-feDiffuseLightingPointLight.jpg │ ├── Capitulo-7-feDiffuseLightingSpotLight.jpg │ ├── Capitulo-7-feDisplacementMap.jpg │ ├── Capitulo-7-feFlood.jpg │ ├── Capitulo-7-feGaussianBlur.jpg │ ├── Capitulo-7-feImage.jpg │ ├── Capitulo-7-feImageconLuces.jpg │ ├── Capitulo-7-feMorphology.jpg │ ├── Capitulo-7-feOffset.jpg │ ├── Capitulo-7-feSpecularLightingDistantLight.jpg │ ├── Capitulo-7-feSpecularLightingPointLight.jpg │ ├── Capitulo-7-feSpecularLightingSpotLight.jpg │ ├── Capitulo-7-feTile.jpg │ └── Capitulo-7-feTurbulence.jpg │ ├── Capitulo-8 │ ├── Capitulo-8-gradientTransform.jpg │ ├── Capitulo-8-linearGradient.jpg │ ├── Capitulo-8-radialGradient.jpg │ └── Capitulo-8-spreadMethod.jpg │ ├── Capitulo-9 │ ├── Capitulo-9-clipPath.jpg │ ├── Capitulo-9-clipPathTexto.jpg │ ├── Capitulo-9-mask.jpg │ ├── Capitulo-9-patterns.jpg │ └── Capitulo-9-symbol.jpg │ ├── logo-codepen.jpg │ ├── logo-github.png │ ├── soporte │ ├── cuarta.jpg │ ├── feComponentTransfer-safari-chrome.jpg │ ├── feConvolveMatrix-safari-chrome.jpg │ ├── feDiffuseLightingPointLight-safari-chrome-firefox.jpg │ ├── feDiffuseLightingSpotLight-safari-chrome-firefox.jpg │ ├── feDisplacementMap-safari-chrome.jpg │ ├── feGaussianBlur-safari-chrome.jpg │ ├── feImage-safari-firefox.jpg │ ├── feMorphology-safari-chrome.jpg │ ├── feSpecularLightingDistantLight.jpg │ ├── feSpecularLightingPointLight.jpg │ ├── feSpecularLightingSpotLight.jpg │ ├── feTurbulence-safari-firefox.jpg │ ├── nueve.jpg │ ├── ocho.jpg │ ├── primera.jpg │ ├── quinta.jpg │ ├── segunda.jpg │ ├── septima.jpg │ ├── sexta.jpg │ └── tercera.jpg │ └── title_page.jpg └── portada-scalable.png /.gitignore: -------------------------------------------------------------------------------- 1 | gitbook/_book/ -------------------------------------------------------------------------------- /gitbook/.gitignore: -------------------------------------------------------------------------------- 1 | _book/ 2 | node_modules/ 3 | book/ 4 | _book 5 | -------------------------------------------------------------------------------- /gitbook/Book.txt: -------------------------------------------------------------------------------- 1 | chapter1.txt 2 | chapter2.txt 3 | chapter3.txt 4 | chapter4.txt 5 | chapter5.txt 6 | chapter6.txt 7 | chapter7.txt 8 | chapter8.txt 9 | chapter9.txt 10 | chapter10.txt 11 | chapter11.txt 12 | chapter12.txt 13 | chapter13.txt 14 | chapter14.txt 15 | chapter15.txt 16 | chapter16.txt 17 | -------------------------------------------------------------------------------- /gitbook/README.md: -------------------------------------------------------------------------------- 1 | # Un libro sobre SVG 2 | 3 | Esta es la version web de [SCALABLE, un libro sobre SVG](http://leanpub.com/scalable), si quieres descárgalo en formato PDF, ePuB o mobi simplemente tienes que ir a [Leanpub](http://leanpub.com/scalable). 4 | 5 | A lo largo de 16 capítulos y más de 120 páginas vamos a ver todo lo que podemos hacer con SVG, crearemos gráficos vectoriales como las formas básicas(círculos, rectángulos, elipses, polígonos etc...) con ellos crearemos máscaras, símbolos y patrones, los rellenaremos con degradados, los reutilizaremos a lo largo del documento ahorrando código, tiempo y espacio. 6 | 7 | Si echas de menos algo o quieres hacer cualquier aportación puedes hacerlo abriendo una *issue* en [GitHub](http://github.com/scalable) o escribiéndome a scalable@jorgeatgu.com 8 | 9 | -------------------------------------------------------------------------------- /gitbook/SUMMARY.md: -------------------------------------------------------------------------------- 1 | # Summary 2 | 3 | * [Introducción](chapter1.md) 4 | * [Un poco de historia](chapter1.md#un-poco-de-historia) 5 | * [Soporte](chapter1.md#soporte) 6 | * [Formato y ejemplos](chapter1.md#formato-y-ejemplos) 7 | [Exportar y añadir SVG](chapter2.md) 8 | * [Adobe Illustrator 17.1.0](chapter2.md#adobe-illustrator-1710) 9 | * [Inkscape 0.48.2](chapter2.md#inkscape-0482) 10 | * [Sketch 3.0.3](chapter2.md#sketch-303) 11 | * [Añadir SVG al HTML](chapter2.md#añadir-svg-al-html) 12 | * [Soporte para IE8 y Android 2.3](chapter2.md#soporte-para-ie8-y-android-23) 13 | * [Añadir SVG a WordPress con Plugin](chapter2.md#añadir-svg-a-wordpress-con-plugin) 14 | * [Añadir SVG a WordPress sin Plugin](chapter2.md#añadir-svg-a-wordpress-sin-plugin) 15 | * [Etiqueta principal](chapter3.md) 16 | * [Sistema de coordenadas y unidades de medida](chapter3.md#sistema-de-coordenadas-y-unidades-de-medida) 17 | * [viewBox](chapter3.md#viewbox) 18 | * [preserveAspectRatio](chapter3.md#preserveaspectratio) 19 | * [Las formas básicas](chapter4.md) 20 | * [Fill](chapter4.md#fill) 21 | * [Stroke](chapter4.md#stroke) 22 | * [Rect](chapter4.md#rect) 23 | * [Circle](chapter4.md#circle) 24 | * [Ellipse](chapter4.md#ellipse) 25 | * [Line](chapter4.md#line) 26 | * [Polyline](chapter4.md#polyline) 27 | * [Polygon](chapter4.md#polygon) 28 | * [Path](chapter4.md#path) 29 | * [Texto](chapter5.md) 30 | * [Text](chapter5.md#text) 31 | * [Tspan](chapter5.md#tspan) 32 | * [textPath](chapter5.md#textpath) 33 | * [Transformaciones](chapter6.md) 34 | * [Translate](chapter6.md#translate) 35 | * [Rotate](chapter6.md#rotate) 36 | * [Scale](chapter6.md#scale) 37 | * [SkewX](chapter6.md#skewx) 38 | * [SkewY](chapter6.md#skewy) 39 | * [Matrix](chapter6.md#matrix) 40 | * [Filtros](chapter7.md) 41 | * [feFlood](chapter7.md#feflood) 42 | * [feTurbulence](chapter7.md#feturbulence) 43 | * [feImage](chapter7.md#feimage) 44 | * [feColorMatrix](chapter7.md#fecolormatrix) 45 | * [feComponentTransfer](chapter7.md#fecomponenttransfer) 46 | * [feConvolveMatrix](chapter7.md#feconvolvematrix) 47 | * [feGaussianBlur](chapter7.md#fegaussianblur) 48 | * [feDisplacementMap](chapter7.md#fedisplacementmap) 49 | * [feMorphology](chapter7.md#femorphology) 50 | * [feOffset](chapter7.md#feoffset) 51 | * [Efectos de luz](chapter7.md#efectos-de-luz) 52 | * [feDistantLight](chapter7.md#efectos-de-luz) 53 | * [fePointLight](chapter7.md#fepointlight) 54 | * [feSpotLight](chapter7.md#fespotlight) 55 | * [feMerge](chapter7.md#femerge) 56 | * [feBlend](chapter7.md#feblend) 57 | * [feComposite](chapter7.md#fecomposite) 58 | * [feTile](chapter7.md#fetile) 59 | * [FILDROP](chapter7.md#fildrop) 60 | * [Degradados](chapter8.md) 61 | * [linearGradient](chapter8.md#lineargradient) 62 | * [radialGradient](chapter8.md#radialgradient) 63 | * [spreadMethod](chapter8.md#spreadmethod) 64 | * [gradientTransform](chapter8.md#gradienttransform) 65 | * [Patterns, masks, clip-path y symbol](chapter9.md) 66 | * [Patterns](chapter9.md#patterns) 67 | * [Mask](chapter9.md#mask) 68 | * [Clip-Path](chapter9.md#clip-path) 69 | * [Symbol](chapter9.md#symbol) 70 | * [Image](chapter10.md) 71 | * [Links](chapter10.md#links) 72 | * [DRY con group, defs y use](chapter11.md) 73 | * [Group](chapter11.md#group) 74 | * [Defs y use](chapter11.md#defs-y-use) 75 | * [Usando CSS para aplicar estilos](chapter11.md#usando-css-para-aplicar-estilos) 76 | * [Sprites con SVG](chapter11.md#sprites-con-svg) 77 | * [Métodos para aplicar estilos CSS a SVG](chapter11.md#métodos-para-aplicar-estilos-css-a-svg) 78 | * [Fragmentos identificadores](chapter11.md#fragmentos-identificadores) 79 | * [Optimizar SVG](chapter12.md) 80 | * [SVG CLEANER](chapter12.md#svg-cleaner) 81 | * [SVGO](chapter12.md#svgo) 82 | * [SVGO en jorgeatgu.com](chapter12.md#svgo-en-jorgeatgucom) 83 | * [Optimizando SVG con Grunt](chapter12.md#optimizando-svg-con-grunt) 84 | * [SVGO ONLINE](chapter12.md#svgo-online) 85 | * [WAI-ARIA en SVG](chapter13.md) 86 | * [SVG 1.1](chapter13.md#svg-11) 87 | * [SVG 2](chapter13.md#svg-2) 88 | * [Describler](chapter13.md#describler) 89 | * [Herramientas](chapter14.md) 90 | * [Crowbar](chapter14.md#SVG-CROWBAR) 91 | * [Polynom](chapter14.md#Polynom) 92 | * [SVGSON](chapter14.md#SVGSON) 93 | * [XVG](chapter14.md#XVG) 94 | * [CSS en SVG](chapter15.md) 95 | * [Métodos para aplicar estilos CSS a SVG](chapter15.md#metodos-para-aplicar-estilos-css-a-svg) 96 | * [A través de una etiqueta XML](chapter15.md#a-traves-de-una-etiqueta-xml) 97 | * [A través del style en el HTML](chapter15.md#a-traves-del-style-en-el-HTML) 98 | * [A través de la etiqueta style en SVG](chapter15.md#a-traves-de-la-etiqueta-style-en-SVG) 99 | * [A través de un archivo CSS externo](chapter15.md#a-traves-de-un-archivo-CSS-externo) 100 | * [Bibliografia](chapter16.md) 101 | 102 | -------------------------------------------------------------------------------- /gitbook/_book/Book.txt: -------------------------------------------------------------------------------- 1 | chapter1.txt 2 | chapter2.txt 3 | chapter3.txt 4 | chapter4.txt 5 | chapter5.txt 6 | chapter6.txt 7 | chapter7.txt 8 | chapter8.txt 9 | chapter9.txt 10 | chapter10.txt 11 | chapter11.txt 12 | chapter12.txt 13 | chapter13.txt 14 | chapter14.txt 15 | chapter15.txt 16 | chapter16.txt 17 | -------------------------------------------------------------------------------- /gitbook/_book/gitbook/fonts/fontawesome/FontAwesome.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/gitbook/fonts/fontawesome/FontAwesome.otf -------------------------------------------------------------------------------- /gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.eot -------------------------------------------------------------------------------- /gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.ttf -------------------------------------------------------------------------------- /gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.woff -------------------------------------------------------------------------------- /gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/gitbook/fonts/fontawesome/fontawesome-webfont.woff2 -------------------------------------------------------------------------------- /gitbook/_book/gitbook/gitbook-plugin-highlight/ebook.css: -------------------------------------------------------------------------------- 1 | pre, 2 | code { 3 | /* http://jmblog.github.io/color-themes-for-highlightjs */ 4 | /* Tomorrow Comment */ 5 | /* Tomorrow Red */ 6 | /* Tomorrow Orange */ 7 | /* Tomorrow Yellow */ 8 | /* Tomorrow Green */ 9 | /* Tomorrow Aqua */ 10 | /* Tomorrow Blue */ 11 | /* Tomorrow Purple */ 12 | } 13 | pre .hljs-comment, 14 | code .hljs-comment, 15 | pre .hljs-title, 16 | code .hljs-title { 17 | color: #8e908c; 18 | } 19 | pre .hljs-variable, 20 | code .hljs-variable, 21 | pre .hljs-attribute, 22 | code .hljs-attribute, 23 | pre .hljs-tag, 24 | code .hljs-tag, 25 | pre .hljs-regexp, 26 | code .hljs-regexp, 27 | pre .hljs-deletion, 28 | code .hljs-deletion, 29 | pre .ruby .hljs-constant, 30 | code .ruby .hljs-constant, 31 | pre .xml .hljs-tag .hljs-title, 32 | code .xml .hljs-tag .hljs-title, 33 | pre .xml .hljs-pi, 34 | code .xml .hljs-pi, 35 | pre .xml .hljs-doctype, 36 | code .xml .hljs-doctype, 37 | pre .html .hljs-doctype, 38 | code .html .hljs-doctype, 39 | pre .css .hljs-id, 40 | code .css .hljs-id, 41 | pre .css .hljs-class, 42 | code .css .hljs-class, 43 | pre .css .hljs-pseudo, 44 | code .css .hljs-pseudo { 45 | color: #c82829; 46 | } 47 | pre .hljs-number, 48 | code .hljs-number, 49 | pre .hljs-preprocessor, 50 | code .hljs-preprocessor, 51 | pre .hljs-pragma, 52 | code .hljs-pragma, 53 | pre .hljs-built_in, 54 | code .hljs-built_in, 55 | pre .hljs-literal, 56 | code .hljs-literal, 57 | pre .hljs-params, 58 | code .hljs-params, 59 | pre .hljs-constant, 60 | code .hljs-constant { 61 | color: #f5871f; 62 | } 63 | pre .ruby .hljs-class .hljs-title, 64 | code .ruby .hljs-class .hljs-title, 65 | pre .css .hljs-rules .hljs-attribute, 66 | code .css .hljs-rules .hljs-attribute { 67 | color: #eab700; 68 | } 69 | pre .hljs-string, 70 | code .hljs-string, 71 | pre .hljs-value, 72 | code .hljs-value, 73 | pre .hljs-inheritance, 74 | code .hljs-inheritance, 75 | pre .hljs-header, 76 | code .hljs-header, 77 | pre .hljs-addition, 78 | code .hljs-addition, 79 | pre .ruby .hljs-symbol, 80 | code .ruby .hljs-symbol, 81 | pre .xml .hljs-cdata, 82 | code .xml .hljs-cdata { 83 | color: #718c00; 84 | } 85 | pre .css .hljs-hexcolor, 86 | code .css .hljs-hexcolor { 87 | color: #3e999f; 88 | } 89 | pre .hljs-function, 90 | code .hljs-function, 91 | pre .python .hljs-decorator, 92 | code .python .hljs-decorator, 93 | pre .python .hljs-title, 94 | code .python .hljs-title, 95 | pre .ruby .hljs-function .hljs-title, 96 | code .ruby .hljs-function .hljs-title, 97 | pre .ruby .hljs-title .hljs-keyword, 98 | code .ruby .hljs-title .hljs-keyword, 99 | pre .perl .hljs-sub, 100 | code .perl .hljs-sub, 101 | pre .javascript .hljs-title, 102 | code .javascript .hljs-title, 103 | pre .coffeescript .hljs-title, 104 | code .coffeescript .hljs-title { 105 | color: #4271ae; 106 | } 107 | pre .hljs-keyword, 108 | code .hljs-keyword, 109 | pre .javascript .hljs-function, 110 | code .javascript .hljs-function { 111 | color: #8959a8; 112 | } 113 | pre .hljs, 114 | code .hljs { 115 | display: block; 116 | background: white; 117 | color: #4d4d4c; 118 | padding: 0.5em; 119 | } 120 | pre .coffeescript .javascript, 121 | code .coffeescript .javascript, 122 | pre .javascript .xml, 123 | code .javascript .xml, 124 | pre .tex .hljs-formula, 125 | code .tex .hljs-formula, 126 | pre .xml .javascript, 127 | code .xml .javascript, 128 | pre .xml .vbscript, 129 | code .xml .vbscript, 130 | pre .xml .css, 131 | code .xml .css, 132 | pre .xml .hljs-cdata, 133 | code .xml .hljs-cdata { 134 | opacity: 0.5; 135 | } 136 | -------------------------------------------------------------------------------- /gitbook/_book/gitbook/gitbook-plugin-lunr/search-lunr.js: -------------------------------------------------------------------------------- 1 | require([ 2 | 'gitbook', 3 | 'jquery' 4 | ], function(gitbook, $) { 5 | // Define global search engine 6 | function LunrSearchEngine() { 7 | this.index = null; 8 | this.store = {}; 9 | this.name = 'LunrSearchEngine'; 10 | } 11 | 12 | // Initialize lunr by fetching the search index 13 | LunrSearchEngine.prototype.init = function() { 14 | var that = this; 15 | var d = $.Deferred(); 16 | 17 | $.getJSON(gitbook.state.basePath+'/search_index.json') 18 | .then(function(data) { 19 | // eslint-disable-next-line no-undef 20 | that.index = lunr.Index.load(data.index); 21 | that.store = data.store; 22 | d.resolve(); 23 | }); 24 | 25 | return d.promise(); 26 | }; 27 | 28 | // Search for a term and return results 29 | LunrSearchEngine.prototype.search = function(q, offset, length) { 30 | var that = this; 31 | var results = []; 32 | 33 | if (this.index) { 34 | results = $.map(this.index.search(q), function(result) { 35 | var doc = that.store[result.ref]; 36 | 37 | return { 38 | title: doc.title, 39 | url: doc.url, 40 | body: doc.summary || doc.body 41 | }; 42 | }); 43 | } 44 | 45 | return $.Deferred().resolve({ 46 | query: q, 47 | results: results.slice(0, length), 48 | count: results.length 49 | }).promise(); 50 | }; 51 | 52 | // Set gitbook research 53 | gitbook.events.bind('start', function(e, config) { 54 | var engine = gitbook.search.getEngine(); 55 | if (!engine) { 56 | gitbook.search.setEngine(LunrSearchEngine, config); 57 | } 58 | }); 59 | }); 60 | -------------------------------------------------------------------------------- /gitbook/_book/gitbook/gitbook-plugin-search/search-engine.js: -------------------------------------------------------------------------------- 1 | require([ 2 | 'gitbook', 3 | 'jquery' 4 | ], function(gitbook, $) { 5 | // Global search objects 6 | var engine = null; 7 | var initialized = false; 8 | 9 | // Set a new search engine 10 | function setEngine(Engine, config) { 11 | initialized = false; 12 | engine = new Engine(config); 13 | 14 | init(config); 15 | } 16 | 17 | // Initialize search engine with config 18 | function init(config) { 19 | if (!engine) throw new Error('No engine set for research. Set an engine using gitbook.research.setEngine(Engine).'); 20 | 21 | return engine.init(config) 22 | .then(function() { 23 | initialized = true; 24 | gitbook.events.trigger('search.ready'); 25 | }); 26 | } 27 | 28 | // Launch search for query q 29 | function query(q, offset, length) { 30 | if (!initialized) throw new Error('Search has not been initialized'); 31 | return engine.search(q, offset, length); 32 | } 33 | 34 | // Get stats about search 35 | function getEngine() { 36 | return engine? engine.name : null; 37 | } 38 | 39 | function isInitialized() { 40 | return initialized; 41 | } 42 | 43 | // Initialize gitbook.search 44 | gitbook.search = { 45 | setEngine: setEngine, 46 | getEngine: getEngine, 47 | query: query, 48 | isInitialized: isInitialized 49 | }; 50 | }); -------------------------------------------------------------------------------- /gitbook/_book/gitbook/gitbook-plugin-search/search.css: -------------------------------------------------------------------------------- 1 | /* 2 | This CSS only styled the search results section, not the search input 3 | It defines the basic interraction to hide content when displaying results, etc 4 | */ 5 | #book-search-results .search-results { 6 | display: none; 7 | } 8 | #book-search-results .search-results ul.search-results-list { 9 | list-style-type: none; 10 | padding-left: 0; 11 | } 12 | #book-search-results .search-results ul.search-results-list li { 13 | margin-bottom: 1.5rem; 14 | padding-bottom: 0.5rem; 15 | /* Highlight results */ 16 | } 17 | #book-search-results .search-results ul.search-results-list li p em { 18 | background-color: rgba(255, 220, 0, 0.4); 19 | font-style: normal; 20 | } 21 | #book-search-results .search-results .no-results { 22 | display: none; 23 | } 24 | #book-search-results.open .search-results { 25 | display: block; 26 | } 27 | #book-search-results.open .search-noresults { 28 | display: none; 29 | } 30 | #book-search-results.no-results .search-results .has-results { 31 | display: none; 32 | } 33 | #book-search-results.no-results .search-results .no-results { 34 | display: block; 35 | } 36 | -------------------------------------------------------------------------------- /gitbook/_book/gitbook/gitbook-plugin-search/search.js: -------------------------------------------------------------------------------- 1 | require([ 2 | 'gitbook', 3 | 'jquery' 4 | ], function(gitbook, $) { 5 | var MAX_RESULTS = 15; 6 | var MAX_DESCRIPTION_SIZE = 500; 7 | 8 | var usePushState = (typeof history.pushState !== 'undefined'); 9 | 10 | // DOM Elements 11 | var $body = $('body'); 12 | var $bookSearchResults; 13 | var $searchInput; 14 | var $searchList; 15 | var $searchTitle; 16 | var $searchResultsCount; 17 | var $searchQuery; 18 | 19 | // Throttle search 20 | function throttle(fn, wait) { 21 | var timeout; 22 | 23 | return function() { 24 | var ctx = this, args = arguments; 25 | if (!timeout) { 26 | timeout = setTimeout(function() { 27 | timeout = null; 28 | fn.apply(ctx, args); 29 | }, wait); 30 | } 31 | }; 32 | } 33 | 34 | function displayResults(res) { 35 | $bookSearchResults.addClass('open'); 36 | 37 | var noResults = res.count == 0; 38 | $bookSearchResults.toggleClass('no-results', noResults); 39 | 40 | // Clear old results 41 | $searchList.empty(); 42 | 43 | // Display title for research 44 | $searchResultsCount.text(res.count); 45 | $searchQuery.text(res.query); 46 | 47 | // Create an
  • element for each result 48 | res.results.forEach(function(res) { 49 | var $li = $('
  • ', { 50 | 'class': 'search-results-item' 51 | }); 52 | 53 | var $title = $('

    '); 54 | 55 | var $link = $('', { 56 | 'href': gitbook.state.basePath + '/' + res.url, 57 | 'text': res.title 58 | }); 59 | 60 | var content = res.body.trim(); 61 | if (content.length > MAX_DESCRIPTION_SIZE) { 62 | content = content.slice(0, MAX_DESCRIPTION_SIZE).trim()+'...'; 63 | } 64 | var $content = $('

    ').html(content); 65 | 66 | $link.appendTo($title); 67 | $title.appendTo($li); 68 | $content.appendTo($li); 69 | $li.appendTo($searchList); 70 | }); 71 | } 72 | 73 | function launchSearch(q) { 74 | // Add class for loading 75 | $body.addClass('with-search'); 76 | $body.addClass('search-loading'); 77 | 78 | // Launch search query 79 | throttle(gitbook.search.query(q, 0, MAX_RESULTS) 80 | .then(function(results) { 81 | displayResults(results); 82 | }) 83 | .always(function() { 84 | $body.removeClass('search-loading'); 85 | }), 1000); 86 | } 87 | 88 | function closeSearch() { 89 | $body.removeClass('with-search'); 90 | $bookSearchResults.removeClass('open'); 91 | } 92 | 93 | function launchSearchFromQueryString() { 94 | var q = getParameterByName('q'); 95 | if (q && q.length > 0) { 96 | // Update search input 97 | $searchInput.val(q); 98 | 99 | // Launch search 100 | launchSearch(q); 101 | } 102 | } 103 | 104 | function bindSearch() { 105 | // Bind DOM 106 | $searchInput = $('#book-search-input input'); 107 | $bookSearchResults = $('#book-search-results'); 108 | $searchList = $bookSearchResults.find('.search-results-list'); 109 | $searchTitle = $bookSearchResults.find('.search-results-title'); 110 | $searchResultsCount = $searchTitle.find('.search-results-count'); 111 | $searchQuery = $searchTitle.find('.search-query'); 112 | 113 | // Launch query based on input content 114 | function handleUpdate() { 115 | var q = $searchInput.val(); 116 | 117 | if (q.length == 0) { 118 | closeSearch(); 119 | } 120 | else { 121 | launchSearch(q); 122 | } 123 | } 124 | 125 | // Detect true content change in search input 126 | // Workaround for IE < 9 127 | var propertyChangeUnbound = false; 128 | $searchInput.on('propertychange', function(e) { 129 | if (e.originalEvent.propertyName == 'value') { 130 | handleUpdate(); 131 | } 132 | }); 133 | 134 | // HTML5 (IE9 & others) 135 | $searchInput.on('input', function(e) { 136 | // Unbind propertychange event for IE9+ 137 | if (!propertyChangeUnbound) { 138 | $(this).unbind('propertychange'); 139 | propertyChangeUnbound = true; 140 | } 141 | 142 | handleUpdate(); 143 | }); 144 | 145 | // Push to history on blur 146 | $searchInput.on('blur', function(e) { 147 | // Update history state 148 | if (usePushState) { 149 | var uri = updateQueryString('q', $(this).val()); 150 | history.pushState({ path: uri }, null, uri); 151 | } 152 | }); 153 | } 154 | 155 | gitbook.events.on('page.change', function() { 156 | bindSearch(); 157 | closeSearch(); 158 | 159 | // Launch search based on query parameter 160 | if (gitbook.search.isInitialized()) { 161 | launchSearchFromQueryString(); 162 | } 163 | }); 164 | 165 | gitbook.events.on('search.ready', function() { 166 | bindSearch(); 167 | 168 | // Launch search from query param at start 169 | launchSearchFromQueryString(); 170 | }); 171 | 172 | function getParameterByName(name) { 173 | var url = window.location.href; 174 | name = name.replace(/[\[\]]/g, '\\$&'); 175 | var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)', 'i'), 176 | results = regex.exec(url); 177 | if (!results) return null; 178 | if (!results[2]) return ''; 179 | return decodeURIComponent(results[2].replace(/\+/g, ' ')); 180 | } 181 | 182 | function updateQueryString(key, value) { 183 | value = encodeURIComponent(value); 184 | 185 | var url = window.location.href; 186 | var re = new RegExp('([?&])' + key + '=.*?(&|#|$)(.*)', 'gi'), 187 | hash; 188 | 189 | if (re.test(url)) { 190 | if (typeof value !== 'undefined' && value !== null) 191 | return url.replace(re, '$1' + key + '=' + value + '$2$3'); 192 | else { 193 | hash = url.split('#'); 194 | url = hash[0].replace(re, '$1$3').replace(/(&|\?)$/, ''); 195 | if (typeof hash[1] !== 'undefined' && hash[1] !== null) 196 | url += '#' + hash[1]; 197 | return url; 198 | } 199 | } 200 | else { 201 | if (typeof value !== 'undefined' && value !== null) { 202 | var separator = url.indexOf('?') !== -1 ? '&' : '?'; 203 | hash = url.split('#'); 204 | url = hash[0] + separator + key + '=' + value; 205 | if (typeof hash[1] !== 'undefined' && hash[1] !== null) 206 | url += '#' + hash[1]; 207 | return url; 208 | } 209 | else 210 | return url; 211 | } 212 | } 213 | }); 214 | -------------------------------------------------------------------------------- /gitbook/_book/gitbook/gitbook-plugin-sharing/buttons.js: -------------------------------------------------------------------------------- 1 | require(['gitbook', 'jquery'], function(gitbook, $) { 2 | var SITES = { 3 | 'facebook': { 4 | 'label': 'Facebook', 5 | 'icon': 'fa fa-facebook', 6 | 'onClick': function(e) { 7 | e.preventDefault(); 8 | window.open('http://www.facebook.com/sharer/sharer.php?s=100&p[url]='+encodeURIComponent(location.href)); 9 | } 10 | }, 11 | 'twitter': { 12 | 'label': 'Twitter', 13 | 'icon': 'fa fa-twitter', 14 | 'onClick': function(e) { 15 | e.preventDefault(); 16 | window.open('http://twitter.com/home?status='+encodeURIComponent(document.title+' '+location.href)); 17 | } 18 | }, 19 | 'google': { 20 | 'label': 'Google+', 21 | 'icon': 'fa fa-google-plus', 22 | 'onClick': function(e) { 23 | e.preventDefault(); 24 | window.open('https://plus.google.com/share?url='+encodeURIComponent(location.href)); 25 | } 26 | }, 27 | 'weibo': { 28 | 'label': 'Weibo', 29 | 'icon': 'fa fa-weibo', 30 | 'onClick': function(e) { 31 | e.preventDefault(); 32 | window.open('http://service.weibo.com/share/share.php?content=utf-8&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title)); 33 | } 34 | }, 35 | 'instapaper': { 36 | 'label': 'Instapaper', 37 | 'icon': 'fa fa-instapaper', 38 | 'onClick': function(e) { 39 | e.preventDefault(); 40 | window.open('http://www.instapaper.com/text?u='+encodeURIComponent(location.href)); 41 | } 42 | }, 43 | 'vk': { 44 | 'label': 'VK', 45 | 'icon': 'fa fa-vk', 46 | 'onClick': function(e) { 47 | e.preventDefault(); 48 | window.open('http://vkontakte.ru/share.php?url='+encodeURIComponent(location.href)); 49 | } 50 | } 51 | }; 52 | 53 | 54 | 55 | gitbook.events.bind('start', function(e, config) { 56 | var opts = config.sharing; 57 | 58 | // Create dropdown menu 59 | var menu = $.map(opts.all, function(id) { 60 | var site = SITES[id]; 61 | 62 | return { 63 | text: site.label, 64 | onClick: site.onClick 65 | }; 66 | }); 67 | 68 | // Create main button with dropdown 69 | if (menu.length > 0) { 70 | gitbook.toolbar.createButton({ 71 | icon: 'fa fa-share-alt', 72 | label: 'Share', 73 | position: 'right', 74 | dropdown: [menu] 75 | }); 76 | } 77 | 78 | // Direct actions to share 79 | $.each(SITES, function(sideId, site) { 80 | if (!opts[sideId]) return; 81 | 82 | gitbook.toolbar.createButton({ 83 | icon: site.icon, 84 | label: site.text, 85 | position: 'right', 86 | onClick: site.onClick 87 | }); 88 | }); 89 | }); 90 | }); 91 | -------------------------------------------------------------------------------- /gitbook/_book/gitbook/images/apple-touch-icon-precomposed-152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/gitbook/images/apple-touch-icon-precomposed-152.png -------------------------------------------------------------------------------- /gitbook/_book/gitbook/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/gitbook/images/favicon.ico -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-1/introduccion-editar-codepen.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-1/introduccion-editar-codepen.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-1/introduccion-expandir-html-codepen.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-1/introduccion-expandir-html-codepen.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-1/introduccion-opciones-menu-editor-codepen.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-1/introduccion-opciones-menu-editor-codepen.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-1/introduccion-primera-vista-codepen.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-1/introduccion-primera-vista-codepen.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/AURE un tema de Jekyll.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | AURE un tema de Jekyll 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |

    19 | 20 |

    AURE

    21 | 22 |     27 | 28 | 70 | 71 | 72 |
    73 | 74 |
    75 |
    76 |
    77 | 78 |
      79 | 80 | 81 |
    • 82 |

      83 | Welcome to Jekyll! 84 |

      85 | 86 | Por el 87 | 27 de 88 | 89 | octubre 90 | 91 | de 92 | 2014 93 | 94 | 95 |

      You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve...

      96 | 97 | 98 |
    99 |
    100 | 101 | 102 |
    103 | 104 | 105 | 106 | 107 | 108 | 109 |
    110 | 111 |
    112 |
    113 | 114 |
    115 | 116 |
    117 | 118 |

    119 | 120 |
    121 |
    122 |
      123 |
    • 124 |
      • 125 |
    126 |
    127 | 128 |
    129 | 134 |
    135 | 136 |
    137 |

    Un tema de Jekyl

    138 |
    139 |
    140 | 141 |
    142 | 143 |
    144 | 145 | 146 | 147 | 148 | 149 |     -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-con-svg-sprite-map.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-con-svg-sprite-map.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-defs.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-defs.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-defsGroup.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-defsGroup.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-group.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-group.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-internet-explorer-svgsprite.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-internet-explorer-svgsprite.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-sin-svg-sprite-map.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-sin-svg-sprite-map.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-useCSS.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-useCSS.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-11/Capitulo-11-useexterno.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-11/Capitulo-11-useexterno.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/Sin título-1 (1) (1).jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/Sin título-1 (1) (1).jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-comparativa-cien.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-comparativa-cien.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-comparativa-diez.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-comparativa-diez.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-attributtes.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-attributtes.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-attributtes.psd: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-attributtes.psd -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-elements.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-elements.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-files.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-files.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-optimizations.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-optimizations.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-paths.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-paths.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-preferences.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-preferences.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-principal.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svg-cleaner-principal.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svgo-online.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svgo-online.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svgo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svgo.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-12/optimizar-svgogui.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-12/optimizar-svgogui.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-13/voice-over-accesibilidad.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-13/voice-over-accesibilidad.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-13/voice-over-activar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-13/voice-over-activar.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-13/voice-over-preferencias.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-13/voice-over-preferencias.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-13/wai-aria-describler.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-13/wai-aria-describler.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-boton-sketch.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-boton-sketch.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-codigo-illustrator.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-codigo-illustrator.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-guardar-como-illustrator.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-guardar-como-illustrator.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-menu-archivo-illustrator.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-menu-archivo-illustrator.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-menu-archivo-inkscape.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-menu-archivo-inkscape.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-menu-guardar-inkscape.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-menu-guardar-inkscape.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-menu-sketch.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-menu-sketch.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-menu-sketch2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-menu-sketch2.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-opciones-illustrator.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-opciones-illustrator.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-sketch.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-sketch.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/exportar-svg-opciones.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/exportar-svg-opciones.png -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/fallback-javascript.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/fallback-javascript.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-2/wordpress-galeria-svg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-2/wordpress-galeria-svg.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-3/Capitulo-3-namespaces.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-3/Capitulo-3-namespaces.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-3/Capitulo-3-preserveAspectRatio-slice.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-3/Capitulo-3-preserveAspectRatio-slice.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-3/Capitulo-3-viewBox.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-3/Capitulo-3-viewBox.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-3/capitulo-3-preserveaspectratio.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-3/capitulo-3-preserveaspectratio.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-circle.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-circle.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-curveTo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-curveTo.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-ellipse.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-ellipse.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-fill-opacity.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-fill-opacity.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-fill-rule.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-fill-rule.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-line.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-line.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-lineDos.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-lineDos.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-moveto.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-moveto.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-path-absolutas-relativas.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-path-absolutas-relativas.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-path-arc.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-path-arc.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-path-horizontalto.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-path-horizontalto.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-polygon.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-polygon.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-polyline.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-polyline.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-rect.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-rect.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-smoothCuadraticCurveTo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-smoothCuadraticCurveTo.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-smoothCurveTo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-smoothCurveTo.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-dasharray.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-dasharray.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-dashoffset.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-dashoffset.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-linecap.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-linecap.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-linejoin.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-linejoin.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-miterlimit.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-4/Capitulo-4-stroke-miterlimit.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-5/Capitulo-5-textPath.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-5/Capitulo-5-textPath.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-5/Capitulo-5-texto.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-5/Capitulo-5-texto.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-5/Capitulo-5-tspan.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-5/Capitulo-5-tspan.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-6/Capitulo-6-matrix.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-6/Capitulo-6-matrix.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-6/Capitulo-6-rotate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-6/Capitulo-6-rotate.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-6/Capitulo-6-scale.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-6/Capitulo-6-scale.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-6/Capitulo-6-skewX.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-6/Capitulo-6-skewX.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-6/Capitulo-6-skewY.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-6/Capitulo-6-skewY.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-6/Capitulo-6-translate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-6/Capitulo-6-translate.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feBlend.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feBlend.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feColorMatrix.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feColorMatrix.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feComponentTransfer.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feComponentTransfer.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feComposite.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feComposite.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feConlvolveMatrix.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feConlvolveMatrix.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feDiffuseLightingDistantLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feDiffuseLightingDistantLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feDiffuseLightingPointLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feDiffuseLightingPointLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feDiffuseLightingSpotLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feDiffuseLightingSpotLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feDisplacementMap.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feDisplacementMap.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feFlood.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feFlood.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feGaussianBlur.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feGaussianBlur.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feImage.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feImage.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feImageconLuces.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feImageconLuces.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feMorphology.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feMorphology.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feOffset.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feOffset.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feSpecularLightingDistantLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feSpecularLightingDistantLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feSpecularLightingPointLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feSpecularLightingPointLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feSpecularLightingSpotLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feSpecularLightingSpotLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feTile.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feTile.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-7/Capitulo-7-feTurbulence.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-7/Capitulo-7-feTurbulence.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-8/Capitulo-8-gradientTransform.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-8/Capitulo-8-gradientTransform.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-8/Capitulo-8-linearGradient.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-8/Capitulo-8-linearGradient.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-8/Capitulo-8-radialGradient.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-8/Capitulo-8-radialGradient.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-8/Capitulo-8-spreadMethod.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-8/Capitulo-8-spreadMethod.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-9/Capitulo-9-clipPath.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-9/Capitulo-9-clipPath.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-9/Capitulo-9-clipPathTexto.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-9/Capitulo-9-clipPathTexto.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-9/Capitulo-9-mask.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-9/Capitulo-9-mask.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-9/Capitulo-9-patterns.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-9/Capitulo-9-patterns.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/Capitulo-9/Capitulo-9-symbol.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/Capitulo-9/Capitulo-9-symbol.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/logo-codepen.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/logo-codepen.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/logo-github.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/logo-github.png -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/cuarta.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/cuarta.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feComponentTransfer-safari-chrome.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feComponentTransfer-safari-chrome.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feConvolveMatrix-safari-chrome.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feConvolveMatrix-safari-chrome.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feDiffuseLightingPointLight-safari-chrome-firefox.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feDiffuseLightingPointLight-safari-chrome-firefox.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feDiffuseLightingSpotLight-safari-chrome-firefox.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feDiffuseLightingSpotLight-safari-chrome-firefox.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feDisplacementMap-safari-chrome.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feDisplacementMap-safari-chrome.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feGaussianBlur-safari-chrome.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feGaussianBlur-safari-chrome.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feImage-safari-firefox.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feImage-safari-firefox.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feMorphology-safari-chrome.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feMorphology-safari-chrome.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feSpecularLightingDistantLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feSpecularLightingDistantLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feSpecularLightingPointLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feSpecularLightingPointLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feSpecularLightingSpotLight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feSpecularLightingSpotLight.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/feTurbulence-safari-firefox.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/feTurbulence-safari-firefox.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/nueve.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/nueve.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/ocho.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/ocho.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/primera.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/primera.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/quinta.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/quinta.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/segunda.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/segunda.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/septima.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/septima.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/sexta.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/sexta.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/soporte/tercera.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/soporte/tercera.jpg -------------------------------------------------------------------------------- /gitbook/_book/images/title_page.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jorgeatgu/scalable/033cc0abf47cfede02bded3bdec046911b8656ae/gitbook/_book/images/title_page.jpg -------------------------------------------------------------------------------- /gitbook/book.json: -------------------------------------------------------------------------------- 1 | { 2 | "author": "Jorge Aznar", 3 | "description": "A lo largo de 16 capítulos, 120 páginas y más de 70 ejemplos vamos a ver todo lo que podemos hacer con SVG.", 4 | "extension": null, 5 | "generator": "site", 6 | "links": { 7 | "home": "http://leanpub.com/scalable/", 8 | "twitter": "https://twitter.com/jorgeatgu", 9 | "github": "https://github.com/jorgeatgu", 10 | "web":"http://jorgeatgu.comnpm install gitbook-plugin-ga" 11 | }, 12 | "output": null, 13 | "plugins": ["ga"], 14 | "pluginsConfig": { 15 | "ga": { 16 | "token": "UA-36222123-1" 17 | } 18 | }, 19 | "title": "SCALABLE, un libro sobre SVG" 20 | } 21 | -------------------------------------------------------------------------------- /gitbook/chapter1.md: -------------------------------------------------------------------------------- 1 | # Introducción 2 | 3 | **SVG** es el acrónimo de **Scalable Vector Graphics**, un formato para crear archivos vectoriales en dos dimensiones. En estos momentos **SVG** está en la versión 1.1 y se espera que **SVG 2** se convierta en recomendación a finales de 2014. 4 | 5 | Este libro es una introducción bastante amplia a todos los elementos que tenemos disponibles en la especificación de **SVG 1.1**, espero que al final de este libro seas capaz de interpretar esa maraña de código que obtenemos al exportar **SVG** desde programas vectoriales como **Inkscape, Illustrator y Sketch**. También que seas capaz de crear por tu cuenta tus propios archivos **SVG** ayudado solamente de un editor de texto y tu imaginación :) 6 | 7 | ## Un poco de historia 8 | 9 | En 1996 **Chris Lilley** redactó un documento en el que incluía una serie de [requisitos generales](http://www.w3.org/Graphics/ScalableReq.html) para crear un formato vectorial estándar para la web. En 1998 ya se habían presentado seis propuestas que competían por ser el estándar. 10 | 11 | - **DrawML**, por parte de **Excosoft**. 12 | - **Hyper Graphics Markup Language**, por parte de **Orange, PCSL, y PRP**. 13 | - **PGML**, por parte de **Adobe, IBM, Netscape y Sun**. 14 | - **VML**, por parte de **Autodesk, HP, Macromedia y Microsoft**. 15 | - **WebCGM**, por parte de **Boeing, CCLRC, Inso, JISC y Xerox**. 16 | - **Web Schematics**, por parte de **CCLRC**. 17 | 18 | El grupo de trabajo de **SVG** después de estudiar las propuestas decidió no desarrollar ninguna de las seis que se habían presentado, decidió crear **SVG** partiendo de una serie de características como las curvas bezier, las máscaras y la composición, aunque recibieron muchas influencias como la compresión de **VML**, las coordenadas, transformaciones, texto y fuentes de **PGML** se puede decir que **SVG** fue diseñado desde cero. 19 | 20 | **SVG** es una recomendación de la **W3C** desde el año 2001. 21 | 22 | 23 | ## Soporte 24 | 25 | Al final del capítulo o de la sección del capítulo aparecerá una tabla con el icono de cada uno de los navegadores acompañado por un visto bueno si da soporte a ese elemento o una cruz si no da soporta a ese elemento. 26 | 27 | Para testear los ejemplos del libro he utilizado el sistema operativo **OSX Mavericks 10.9.4**, las versiones de los diferentes navegadores son las siguientes: **Google Chrome 35.0, Mozilla Firefox 30.0, Opera 22.0, Safari 7.0**. Para testear los ejemplos en **Internet Explorer 9, 10 y 11** he tenido que recurrir a las máquinas virtuales que están disponibles para su descarga en la página [modern.ie](https://www.modern.ie/en-us/virtualization-tools) de **Microsoft**. 28 | 29 | Para testear los ejemplos en dispostivos móviles he utilizando un **iPhone** con **iOS7.1.2**, un **iPad** con **iOS5.1.1** y un **Samsung** con **Android 4.0.3**. Para completar el soporte podéis utilizar [CanIuse](http://www.caniuse.com/#cats=SVG). 30 | 31 | El soporte de los navegadores a los filtros como vais a ver a lo largo del capítulo 7 es muy variado, en algunos filtros el efecto que vemos es diferente si cambiamos de navegador, he detallado en cada filtro el soporte en los navegadores y los cambios que he visto en la pantalla. 32 | 33 | ## Formato y ejemplos 34 | 35 | Todos los ejemplos de este libro van incluídos en un archivo **HTML** con el ***doctype*** de **HTML5**, y es que gracias a **HTML5** podemos añadir el código de nuestros archivos **SVG** dentro del **HTML** y ver el resultado si abrimos el archivo en un navegador como **Chrome, Firefox, Opera, Safari y IE9+**. Solamente **HTML5** deja incluir código **SVG** en línea dentro de sus etiquetas. 36 | 37 | Todos los ejemplos están disponibles para su descarga en un archivo zipeado que podéis descargar desde [esta dirección](http://jorgeatgu.com/libro/ejemplos-libro-scalable.zip). También están disponibles en **CodePen** para así poder manipular el código de los ejemplos y ver sus resultado en directo. 38 | 39 | Si queréis utilizar el código de los ejemplos os recomiendo copiar y pegar de **CodePen** o del archivo con los ejemplos zipeados, el motivo es sencillo, y es que en **LeanPub** cuando el código ocupa más del ancho de la página parte el código de los ejemplos añadiendo una molesta \ si copiáis y pegáis el código os la vais a llevar a vuestros documentos, así que mejor del zip o de **CodePen.** 40 | 41 | Por desgracia los que estéis leyendo este libro en formato **PDF** vais a tener que ir al final de la página y hacer click en la nota al pie ya que las imágenes con enlaces no funcionan, he intentado buscar una solución y no he encontrado nada que funcione conforme es debido, mis más sinceras disculpas. Si estas leyendo este libro en formato **.mobi** o **.epub** los enlaces funcionan a la perfección. 42 | 43 | Para editar los archivos que están en **CodePen** no es obligatorio estar registrado. 44 | 45 | Para acceder a los ejemplos alojados en **CodePen** hay que pinchar en el logo de **CodePen**. 46 | 47 | ![](images/logo-codepen.jpg) 48 | 49 | Cuando hacemos click vamos a ver una pantalla como esta. 50 | 51 | ![](images/capitulo-1/introduccion-primera-vista-codepen.jpg) 52 | 53 | Ahora vamos a hacer click en ***details*** y luego hacemos click en ***editor*** 54 | 55 | ![](images/capitulo-1/introduccion-opciones-menu-editor-codepen.jpg) 56 | 57 | Ahora vamos a ver la imagen con tres celdas en las que se aloja el código **HTML, CSS y JS**. 58 | 59 | ![](images/capitulo-1/introduccion-editar-codepen.jpg) 60 | 61 | A nosotros en esta ocasión solamente nos interesa el **HTML**, así que vamos a hacer click en el icono que esta situado a la derecha del todo, al hacer click en este ícono vamos a expandir el **HTML** y ocultar las celdas de **CSS** y **JS**. 62 | 63 | ![](images/capitulo-1/introduccion-expandir-html-codepen.jpg) 64 | 65 | Ahora solamente tenemos que editar el ejemplo con los valores que queramos. 66 | -------------------------------------------------------------------------------- /gitbook/chapter10.md: -------------------------------------------------------------------------------- 1 | #Image 2 | 3 | Con la etiqueta `` vamos a importar imágenes dentro de nuestros archivos **SVG**, podemos incluir **JPEG**, **PNG** e incluso otros archivos en formato **SVG**. Para incluir la imagen utilizaremos `xlink:href=”aquíVaLaRutaDondeEstaTuImagen”` también tenemos a nuestra disposición una serie de atributos que vamos a ver a continuación. 4 | 5 | Con el atributo ***x*** determinamos la posición de la coordenada en el eje horizontal. 6 | 7 | Con el atributo ***y*** determinamos la posición de la coordenada en el eje vertical. 8 | 9 | Con el atributo ***width*** determinamos la anchura de la imagen. 10 | 11 | Con el atributo ***height*** determinamos la altura de la imagen. 12 | 13 | También tenemos a nuestra disposición el atributo ***preserveAspectRatio***, por defecto y aunque no lo declaremos su valor será de ***xMidYMid meet***. 14 | 15 | ##Links 16 | 17 | Con la etiqueta `` vamos a crear enlaces en nuestros documentos **SVG**. Al igual que hemos visto en `` para incluir un enlace vamos a hacerlo también con `xlink:href=”LaDirecciónWeb”`, podemos encerrar un `` en una etiqueta `` para crear un enlace a otra página, y si le añadimos la propiedad **CSS** `cursor=”pointer”` vamos a modificar el puntero así cuando el ratón pase por encima de nuestro enlace será como si pasara por encima de un botón. 18 | 19 | 20 | 21 | ~~~~~~~ 22 | 23 | 24 | jorgeATGU 25 | 26 | ~~~~~~~ 27 | [![](images/logo-codepen.jpg)](http://codepen.io/jorgeatgu/details/DItFB/) 28 | 29 | Podemos agregar un título o una descripción al enlace a través del atributos `xlink:title=””` aunque desde la propia **W3C** nos recomiendan que para agregar un título es mejor utilizar la etiqueta ***title*** que hemos visto anteriormente. 30 | 31 | Por último un ejemplo con todos los atributos que tenemos disponible para `target=””` 32 | 33 | 34 | ~~~~~~~ 35 | 36 | 37 | _replace 38 | 39 | 40 | 41 | _self 42 | 43 | 44 | 45 | _parent 46 | 47 | 48 | 49 | _top 50 | 51 | 52 | 53 | _blank 54 | 55 | ~~~~~~~ 56 | [![](images/logo-codepen.jpg)](http://codepen.io/jorgeatgu/details/JCqyt/) 57 | 58 | ####Soporte 59 | 60 | ![](images/soporte/primera.jpg) 61 | -------------------------------------------------------------------------------- /gitbook/chapter13.md: -------------------------------------------------------------------------------- 1 | #WAI-ARIA en SVG 2 | Antes de nada una pequeña introducción para aquellos que no sepan de que trata **WAI-ARIA**. 3 | 4 | **WAI-ARIA** es el acrónimo de **Web Accessibility Initiate Accessible Rich Internet Application**, un standard de la **W3C** que tiene el fin de hacer que las webs sean accesibles para las personas con discapacidad. Para ello disponemos de una serie de atributos que funcionan como identificadores y que vamos a utilizar a lo largo de las diferentes etiquetas que tengamos en el **HTML**. 5 | 6 | A continuación os dejo un enlace con una serie de indicaciones de la **W3C** para usar [WAI-ARIA en HTML5](http://www.w3.org/TR/2013/WD-aria-in-html-20131003/). 7 | 8 | La incorporación de **WAI-ARIA** a la especificación de **SVG** será realidad en **SVG 2**, aún así podemos utilizar una serie de atributos y etiquetas para hacer más accesible nuestros archivos. 9 | 10 | ##SVG 1.1 11 | 12 | Para hacer más accesibles nuestros **SVG** vamos a utilizar las etiquetas `` y ``. Estas etiquetas sirven para añadir un título y una descripción a nuestro archivo. Para hacer más accesible nuestro documento las podemos utilizar a lo largo del documento en cualquier elemento gráfico o contenedor gráfico que vayamos a utilizar. 13 | 14 | Como ya he dicho anteriormente el soporte de **WAI-ARIA** en **SVG** será oficial en **SVG 2** pero aunque no sea oficial podemos hacer uso de la etiquetas `aria-labelledby=””` en **SVG 1.1** para hacer más accesibles nuestros archivos para los navegadores, vamos a añadirla a la etiqueta principal de `` con los valores title y dec. 15 | 16 | A continuación el código que he empleado con [VoiceOver](https://www.apple.com/es/accessibility/osx/voiceover/) y [ChromeVox](http://www.chromevox.com/) 17 | 18 | 19 | ~~~~~~~ 20 | Los patterns en SVG. 21 | A continuación vamos a ver tres ejemplos que utilizan la etiqueta patterns sobre elementos gráficos. 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | Primer ejemplo. El rectángulo se rellena por completo con un pattern creado con un rectángulo blanco y otro rojo. 37 | 38 | 39 | 40 | En este segundo ejemplo solamente se rellena la mitad del rectángulo gracias al atributo patternUnits que tiene un valor de objectboundigBox. 41 | 42 | 43 | 44 | En el último ejemplo el rectángulo se rellena por completo con un pattern que consta de un círculo rojo. 45 | 46 | 47 | ~~~~~~~ 48 | [![](images/logo-codepen.jpg)](http://codepen.io/jorgeatgu/details/IKrGu/) 49 | 50 | A continuación os dejo un enlace a un vídeo donde podéis ver el ejemplo en funcionamiento utilizando **VoiceOver de OSX con Safari 7, Firefox 30, Chrome 35 y Opera 22**. 51 | 52 | [VoiceOver](http://vimeo.com/jorgeatgu/scalable-voiceover-wai-aria) 53 | 54 | En el próximo vídeo vamos a ver en funcionamiento la extensión **ChromeVox** para **Google Chrome**. 55 | 56 | [ChromeVox](http://vimeo.com/jorgeatgu/scalable-chrome-vox) 57 | 58 | Tenemos que tener en cuenta que si utilizamos las etiquetas `` `` `` `