svg.escobar.life

A simple SVG markup editor for the web

Commit
275e60021c31e025a79f777f097f48c2f2d6a5d7
Parent
fa588ec6a82213ca3bb79b1bb83390bd3684b5f1
Author
Pablo Escobar Gaviria <gark.garcia@protonmail.com>
Date

Updated elm-syntax-highlight to version 3.1.1

Diffstat

17 files changed, 437 insertions, 436 deletions

Status File Name N° Changes Insertions Deletions
Modified .gitignore 12 6 6
Modified LICENSE 18 9 9
Modified README.md 6 3 3
Modified assets/example.svg 10 5 5
Modified assets/github.svg 8 4 4
Modified assets/icons/favicon.svg 8 5 3
Modified assets/logo.svg 8 4 4
Modified build/build.py 32 16 16
Modified elm.json 65 32 33
Type change index.html 0 0 0
Modified manifest.json 38 19 19
Type change script.min.js 0 0 0
Modified service-worker.js 34 17 17
Modified src/Editor.elm 112 56 56
Modified src/Main.elm 184 92 92
Modified src/Types.elm 78 39 39
Modified src/View.elm 260 130 130
diff --git a/.gitignore b/.gitignore
@@ -1,7 +1,7 @@
-.vscode
-.idea
-elm-stuff
-build/output
-src/assets
-output
+.vscode
+.idea
+elm-stuff
+build/output
+src/assets
+output
 *.afphoto 
\ No newline at end of file
diff --git a/LICENSE b/LICENSE
@@ -1,9 +1,9 @@
-
-
-Copyright 2019 Thiago Brevidelli
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+
+Copyright 2019 Thiago Brevidelli
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
diff --git a/README.md b/README.md
@@ -1,4 +1,4 @@
-# RawSvg
-A simple SVG markup editor for the web. Avaiable in for free in [here](https://garkgarcia.github.io/RawSvg/)!
-
+# RawSvg
+A simple SVG markup editor for the web. Avaiable in for free in [here](https://garkgarcia.github.io/RawSvg/)!
+
 The color scheme used in the app's design is based on [Ahmad Awais](https://github.com/ahmadawais)'s [Shades of Purple theme](https://github.com/ahmadawais/shades-of-purple-vscode). 
\ No newline at end of file
diff --git a/assets/example.svg b/assets/example.svg
@@ -1,5 +1,5 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Edit the source code of the image and preview the results -->
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 70">
-  <path fill="#2D2B55" d="M22.58 8.37h-3.67l-.66 1.69h-3.31L19.17.39h3.2l4.23 9.67h-3.37l-.65-1.69zm-.9-2.35l-.94-2.43-.94 2.43h1.88zm13.2 4.26c-.8 0-1.58-.1-2.35-.28a6.36 6.36 0 0 1-1.87-.71l1.05-2.38a6.38 6.38 0 0 0 3.2.88c.45 0 .77-.04.96-.12.2-.1.3-.22.3-.4 0-.21-.13-.36-.4-.46-.24-.1-.66-.2-1.24-.33-.63-.12-1.25-.29-1.86-.5-.5-.18-.95-.49-1.3-.88a2.4 2.4 0 0 1-.56-1.67c0-.61.17-1.16.52-1.66.34-.5.84-.89 1.52-1.18a6.3 6.3 0 0 1 2.47-.42 8.4 8.4 0 0 1 3.65.84l-.98 2.36a5.96 5.96 0 0 0-2.7-.72c-.84 0-1.26.21-1.26.61 0 .2.13.35.38.44.25.1.66.2 1.23.3.73.15 1.35.31 1.86.49s.94.47 1.31.87c.38.4.57.95.57 1.66 0 .6-.16 1.16-.5 1.66-.36.48-.87.88-1.54 1.17-.68.28-1.5.43-2.46.43zm5.47-9.9h3.26v9.68h-3.26V.39zm13.47 9.68l-.03-4.4-2.1 3.53h-1.43l-2.1-3.39v4.26h-2.97V.39h2.68l3.15 5.15L54.08.39h2.68l.03 9.67h-2.97zm9.2-9.67c.9 0 1.67.15 2.34.44a3.4 3.4 0 0 1 1.53 1.27c.36.55.54 1.2.54 1.93 0 .74-.18 1.39-.54 1.94-.36.55-.87.98-1.53 1.27-.67.29-1.44.44-2.34.44h-1.4v2.38h-3.25V.39h4.65zm-.2 4.78c.44 0 .77-.1.99-.3.22-.2.33-.48.33-.84 0-.35-.1-.63-.33-.82-.22-.21-.55-.3-1-.3h-1.18v2.26h1.18zM68.48.39h3.26v7.14h4.37v2.53H68.5V.39zm16.57 7.2v2.47h-8.04V.39h7.86v2.46h-4.66v1.13h4.1v2.35h-4.1V7.6h4.84zM3.98 30.29c-.84 0-1.63-.1-2.36-.28a6.6 6.6 0 0 1-1.82-.7l1.25-2.4c1.04.59 2.13.9 3.26.9.42 0 .74-.06.96-.16.22-.1.33-.23.33-.41 0-.17-.11-.3-.35-.4a7.6 7.6 0 0 0-1.06-.34c-.54-.13-1.08-.3-1.6-.5-.43-.17-.81-.44-1.12-.78A2.05 2.05 0 0 1 1 23.8c0-.73.2-1.37.58-1.9.4-.56.97-.99 1.7-1.28a8.35 8.35 0 0 1 4.61-.23c.57.12 1.12.32 1.62.6l-1.17 2.38a5.18 5.18 0 0 0-2.65-.72c-.46 0-.8.07-1.06.2-.25.12-.37.27-.37.45s.11.32.33.42c.24.1.6.2 1.12.33.62.15 1.15.3 1.58.47.42.17.8.43 1.12.77.31.35.47.82.47 1.38 0 .72-.2 1.36-.6 1.9-.4.54-.97.96-1.7 1.25-.73.3-1.6.46-2.6.46zm17.51-9.9l-6.02 9.68h-3.21l-2.16-9.67h3.35l1.2 5.63 3.5-5.63h3.34zm5.66 4.58H30l-.83 4.17c-.51.38-1.1.65-1.77.86-.7.2-1.43.3-2.16.29-.98 0-1.85-.18-2.6-.54a4.12 4.12 0 0 1-2.36-3.78c0-1.12.27-2.13.8-3a5.41 5.41 0 0 1 2.19-2.05 6.8 6.8 0 0 1 3.23-.74c2 0 3.47.63 4.4 1.89l-2.34 1.8c-.3-.38-.64-.65-.98-.8a2.83 2.83 0 0 0-1.23-.25c-.57 0-1.05.12-1.47.37-.42.24-.76.6-.98 1.05-.22.44-.33.95-.33 1.52 0 .56.2 1.03.57 1.38.37.35.9.51 1.56.51.33 0 .65-.04.95-.14l.51-2.54zm16.75 5.1l-.03-4.4-2.1 3.53h-1.43l-2.1-3.39v4.26h-2.97v-9.67h2.68l3.15 5.15 3.06-5.15h2.68l.03 9.67H43.9zm11.14-1.69h-3.68l-.65 1.69H47.4l4.22-9.67h3.2l4.24 9.67h-3.37l-.65-1.69zm-.9-2.35l-.94-2.43-.94 2.43h1.88zm9.59 1.6h-.89v2.44h-3.26v-9.67h4.66c.9 0 1.67.15 2.33.44a3.4 3.4 0 0 1 1.54 1.27c.36.55.54 1.2.54 1.93 0 .7-.16 1.3-.47 1.81-.32.52-.76.93-1.36 1.23l2.03 2.99h-3.48l-1.64-2.43zm1.63-3.59c0-.35-.11-.63-.33-.82-.23-.21-.56-.3-1-.3h-1.19v2.26h1.2c.43 0 .76-.1.99-.3.22-.2.33-.48.33-.84zm8.45 2.82l-.73.82v2.39h-3.2v-9.67h3.2v3.5l3.18-3.5h3.55l-3.87 4.25L80 30.06h-3.77l-2.42-3.2zm11.13 3.43c-1.48 0-2.64-.4-3.47-1.2a4.46 4.46 0 0 1-1.25-3.37v-5.32h3.27v5.22c0 .7.12 1.23.37 1.55.26.32.62.48 1.1.48.49 0 .85-.16 1.1-.48.26-.32.38-.85.38-1.55v-5.22h3.2v5.32c0 1.45-.4 2.57-1.24 3.37-.83.8-1.99 1.2-3.46 1.2zm10.86-9.9c.9 0 1.67.16 2.33.45.66.29 1.18.72 1.53 1.27.36.55.54 1.2.54 1.93 0 .74-.18 1.39-.54 1.94-.35.55-.87.98-1.53 1.27-.66.29-1.44.44-2.33.44h-1.4v2.38h-3.26v-9.67h4.66zm-.21 4.79c.44 0 .77-.1 1-.3.21-.2.33-.48.33-.84 0-.35-.11-.63-.34-.82-.22-.21-.55-.3-1-.3H94.4v2.26h1.19zM13.48 47.6v2.46H5.43v-9.67h7.87v2.46H8.64v1.13h4.09v2.35H8.64v1.27h4.84zm1.25-7.21h4.77c1.08 0 2.03.19 2.86.6.82.38 1.46.93 1.92 1.66.44.74.68 1.6.68 2.57 0 .98-.24 1.84-.68 2.57a4.57 4.57 0 0 1-1.92 1.69 6.7 6.7 0 0 1-2.86.58h-4.77v-9.67zm4.63 7.13c.7 0 1.26-.2 1.69-.6.41-.4.62-.96.62-1.7 0-.73-.2-1.28-.64-1.68a2.3 2.3 0 0 0-1.67-.61H18v4.59h1.37zm6.79-7.13h3.26v9.67h-3.26v-9.67zm6.93 2.52h-2.83V40.4h8.93v2.52h-2.84v7.15h-3.26V42.9zm11.87 7.37a6.03 6.03 0 0 1-2.8-.65 4.84 4.84 0 0 1-2.66-4.4c0-.98.24-1.85.7-2.62a4.9 4.9 0 0 1 1.96-1.8 6.05 6.05 0 0 1 2.8-.65c1.04 0 1.98.23 2.8.66a4.89 4.89 0 0 1 2.66 4.4 4.85 4.85 0 0 1-2.65 4.41c-.83.43-1.77.65-2.81.65zm0-2.64c.4 0 .77-.1 1.1-.3.32-.2.59-.47.78-.85.2-.36.29-.78.29-1.27 0-.48-.1-.9-.3-1.28a2.07 2.07 0 0 0-1.88-1.13c-.39 0-.76.1-1.1.28-.32.21-.59.5-.77.85-.2.37-.29.8-.29 1.28 0 .49.1.91.3 1.27a2.08 2.08 0 0 0 1.87 1.15zm10.79-.01h-.88v2.43H51.6v-9.67h4.65c.9 0 1.67.15 2.34.44.66.29 1.17.72 1.53 1.27.36.55.54 1.2.54 1.93 0 .7-.15 1.3-.47 1.81-.32.51-.76.93-1.35 1.23l2.03 2.99h-3.48l-1.65-2.43zm1.63-3.6c0-.36-.1-.63-.33-.83-.22-.2-.55-.3-1-.3h-1.18v2.27h1.18c.45 0 .78-.1 1-.3.22-.2.33-.48.33-.84zm11.93-1.18v1.65h4.03v2.46h-4.04v3.1h-3.26v-9.67h7.87v2.46h-4.6zm10.63 7.43a6.03 6.03 0 0 1-2.8-.65 4.84 4.84 0 0 1-2.65-4.4c0-.98.23-1.85.7-2.62a4.9 4.9 0 0 1 1.95-1.8 6.05 6.05 0 0 1 2.8-.65c1.04 0 1.98.23 2.8.65a4.89 4.89 0 0 1 2.66 4.41 4.85 4.85 0 0 1-2.65 4.41c-.83.43-1.77.65-2.8.65zm0-2.64c.4 0 .78-.1 1.1-.3.33-.2.59-.47.78-.85.2-.36.3-.78.3-1.27 0-.48-.1-.9-.3-1.28a2.07 2.07 0 0 0-1.88-1.13c-.4 0-.77.1-1.1.28-.33.21-.6.5-.78.85-.19.37-.29.8-.29 1.28 0 .49.1.91.3 1.27a2.08 2.08 0 0 0 1.87 1.15zm10.8-.01h-.89v2.43h-3.26v-9.67h4.66c.9 0 1.67.15 2.33.44.66.29 1.18.72 1.54 1.27.36.55.53 1.2.53 1.93 0 .7-.15 1.3-.47 1.81-.31.51-.76.93-1.35 1.23l2.03 2.99h-3.48l-1.64-2.43zm1.62-3.6c0-.36-.1-.63-.33-.83-.22-.2-.55-.3-1-.3h-1.18v2.27h1.19c.44 0 .77-.1 1-.3.21-.2.32-.48.32-.84zm-74.1 18.88H15.4V60.4h8.92v2.52H21.5v7.15h-3.26V62.9zM34.7 60.4v9.67h-3.26v-3.57h-3.01v3.57h-3.26v-9.67h3.26v3.42h3.01V60.4h3.26zm9.62 7.2v2.47h-8.04v-9.67h7.86v2.46h-4.66v1.13h4.1v2.35h-4.1v1.27h4.84zm21.14-7.2l-3.1 9.67h-3.5l-1.55-5.17-1.65 5.17h-3.5l-3.09-9.67h3.36l1.68 5.5 1.79-5.5h3l1.68 5.56 1.78-5.56h3.1zm8.76 7.2v2.47h-8.04v-9.67h7.86v2.46h-4.66v1.13h4.1v2.35h-4.1v1.27h4.84zm9-2.59c.56.2 1 .53 1.32.93.32.4.47.9.47 1.46 0 .84-.35 1.5-1.05 1.98a5.6 5.6 0 0 1-3.04.69h-5.45v-9.67h5.17a5.1 5.1 0 0 1 2.92.69c.66.45 1 1.07 1 1.83 0 .46-.12.86-.34 1.22-.23.36-.56.65-1 .87zm-4.54-2.33v1.43h1.52c.7 0 1.06-.23 1.06-.71 0-.49-.36-.72-1.06-.72h-1.52zm1.96 5.1c.72 0 1.08-.24 1.08-.75s-.36-.76-1.08-.76H78.7v1.52h1.96z"/>
-</svg>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Edit the source code of the image and preview the results -->
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 70">
+  <path fill="#2D2B55" d="M22.58 8.37h-3.67l-.66 1.69h-3.31L19.17.39h3.2l4.23 9.67h-3.37l-.65-1.69zm-.9-2.35l-.94-2.43-.94 2.43h1.88zm13.2 4.26c-.8 0-1.58-.1-2.35-.28a6.36 6.36 0 0 1-1.87-.71l1.05-2.38a6.38 6.38 0 0 0 3.2.88c.45 0 .77-.04.96-.12.2-.1.3-.22.3-.4 0-.21-.13-.36-.4-.46-.24-.1-.66-.2-1.24-.33-.63-.12-1.25-.29-1.86-.5-.5-.18-.95-.49-1.3-.88a2.4 2.4 0 0 1-.56-1.67c0-.61.17-1.16.52-1.66.34-.5.84-.89 1.52-1.18a6.3 6.3 0 0 1 2.47-.42 8.4 8.4 0 0 1 3.65.84l-.98 2.36a5.96 5.96 0 0 0-2.7-.72c-.84 0-1.26.21-1.26.61 0 .2.13.35.38.44.25.1.66.2 1.23.3.73.15 1.35.31 1.86.49s.94.47 1.31.87c.38.4.57.95.57 1.66 0 .6-.16 1.16-.5 1.66-.36.48-.87.88-1.54 1.17-.68.28-1.5.43-2.46.43zm5.47-9.9h3.26v9.68h-3.26V.39zm13.47 9.68l-.03-4.4-2.1 3.53h-1.43l-2.1-3.39v4.26h-2.97V.39h2.68l3.15 5.15L54.08.39h2.68l.03 9.67h-2.97zm9.2-9.67c.9 0 1.67.15 2.34.44a3.4 3.4 0 0 1 1.53 1.27c.36.55.54 1.2.54 1.93 0 .74-.18 1.39-.54 1.94-.36.55-.87.98-1.53 1.27-.67.29-1.44.44-2.34.44h-1.4v2.38h-3.25V.39h4.65zm-.2 4.78c.44 0 .77-.1.99-.3.22-.2.33-.48.33-.84 0-.35-.1-.63-.33-.82-.22-.21-.55-.3-1-.3h-1.18v2.26h1.18zM68.48.39h3.26v7.14h4.37v2.53H68.5V.39zm16.57 7.2v2.47h-8.04V.39h7.86v2.46h-4.66v1.13h4.1v2.35h-4.1V7.6h4.84zM3.98 30.29c-.84 0-1.63-.1-2.36-.28a6.6 6.6 0 0 1-1.82-.7l1.25-2.4c1.04.59 2.13.9 3.26.9.42 0 .74-.06.96-.16.22-.1.33-.23.33-.41 0-.17-.11-.3-.35-.4a7.6 7.6 0 0 0-1.06-.34c-.54-.13-1.08-.3-1.6-.5-.43-.17-.81-.44-1.12-.78A2.05 2.05 0 0 1 1 23.8c0-.73.2-1.37.58-1.9.4-.56.97-.99 1.7-1.28a8.35 8.35 0 0 1 4.61-.23c.57.12 1.12.32 1.62.6l-1.17 2.38a5.18 5.18 0 0 0-2.65-.72c-.46 0-.8.07-1.06.2-.25.12-.37.27-.37.45s.11.32.33.42c.24.1.6.2 1.12.33.62.15 1.15.3 1.58.47.42.17.8.43 1.12.77.31.35.47.82.47 1.38 0 .72-.2 1.36-.6 1.9-.4.54-.97.96-1.7 1.25-.73.3-1.6.46-2.6.46zm17.51-9.9l-6.02 9.68h-3.21l-2.16-9.67h3.35l1.2 5.63 3.5-5.63h3.34zm5.66 4.58H30l-.83 4.17c-.51.38-1.1.65-1.77.86-.7.2-1.43.3-2.16.29-.98 0-1.85-.18-2.6-.54a4.12 4.12 0 0 1-2.36-3.78c0-1.12.27-2.13.8-3a5.41 5.41 0 0 1 2.19-2.05 6.8 6.8 0 0 1 3.23-.74c2 0 3.47.63 4.4 1.89l-2.34 1.8c-.3-.38-.64-.65-.98-.8a2.83 2.83 0 0 0-1.23-.25c-.57 0-1.05.12-1.47.37-.42.24-.76.6-.98 1.05-.22.44-.33.95-.33 1.52 0 .56.2 1.03.57 1.38.37.35.9.51 1.56.51.33 0 .65-.04.95-.14l.51-2.54zm16.75 5.1l-.03-4.4-2.1 3.53h-1.43l-2.1-3.39v4.26h-2.97v-9.67h2.68l3.15 5.15 3.06-5.15h2.68l.03 9.67H43.9zm11.14-1.69h-3.68l-.65 1.69H47.4l4.22-9.67h3.2l4.24 9.67h-3.37l-.65-1.69zm-.9-2.35l-.94-2.43-.94 2.43h1.88zm9.59 1.6h-.89v2.44h-3.26v-9.67h4.66c.9 0 1.67.15 2.33.44a3.4 3.4 0 0 1 1.54 1.27c.36.55.54 1.2.54 1.93 0 .7-.16 1.3-.47 1.81-.32.52-.76.93-1.36 1.23l2.03 2.99h-3.48l-1.64-2.43zm1.63-3.59c0-.35-.11-.63-.33-.82-.23-.21-.56-.3-1-.3h-1.19v2.26h1.2c.43 0 .76-.1.99-.3.22-.2.33-.48.33-.84zm8.45 2.82l-.73.82v2.39h-3.2v-9.67h3.2v3.5l3.18-3.5h3.55l-3.87 4.25L80 30.06h-3.77l-2.42-3.2zm11.13 3.43c-1.48 0-2.64-.4-3.47-1.2a4.46 4.46 0 0 1-1.25-3.37v-5.32h3.27v5.22c0 .7.12 1.23.37 1.55.26.32.62.48 1.1.48.49 0 .85-.16 1.1-.48.26-.32.38-.85.38-1.55v-5.22h3.2v5.32c0 1.45-.4 2.57-1.24 3.37-.83.8-1.99 1.2-3.46 1.2zm10.86-9.9c.9 0 1.67.16 2.33.45.66.29 1.18.72 1.53 1.27.36.55.54 1.2.54 1.93 0 .74-.18 1.39-.54 1.94-.35.55-.87.98-1.53 1.27-.66.29-1.44.44-2.33.44h-1.4v2.38h-3.26v-9.67h4.66zm-.21 4.79c.44 0 .77-.1 1-.3.21-.2.33-.48.33-.84 0-.35-.11-.63-.34-.82-.22-.21-.55-.3-1-.3H94.4v2.26h1.19zM13.48 47.6v2.46H5.43v-9.67h7.87v2.46H8.64v1.13h4.09v2.35H8.64v1.27h4.84zm1.25-7.21h4.77c1.08 0 2.03.19 2.86.6.82.38 1.46.93 1.92 1.66.44.74.68 1.6.68 2.57 0 .98-.24 1.84-.68 2.57a4.57 4.57 0 0 1-1.92 1.69 6.7 6.7 0 0 1-2.86.58h-4.77v-9.67zm4.63 7.13c.7 0 1.26-.2 1.69-.6.41-.4.62-.96.62-1.7 0-.73-.2-1.28-.64-1.68a2.3 2.3 0 0 0-1.67-.61H18v4.59h1.37zm6.79-7.13h3.26v9.67h-3.26v-9.67zm6.93 2.52h-2.83V40.4h8.93v2.52h-2.84v7.15h-3.26V42.9zm11.87 7.37a6.03 6.03 0 0 1-2.8-.65 4.84 4.84 0 0 1-2.66-4.4c0-.98.24-1.85.7-2.62a4.9 4.9 0 0 1 1.96-1.8 6.05 6.05 0 0 1 2.8-.65c1.04 0 1.98.23 2.8.66a4.89 4.89 0 0 1 2.66 4.4 4.85 4.85 0 0 1-2.65 4.41c-.83.43-1.77.65-2.81.65zm0-2.64c.4 0 .77-.1 1.1-.3.32-.2.59-.47.78-.85.2-.36.29-.78.29-1.27 0-.48-.1-.9-.3-1.28a2.07 2.07 0 0 0-1.88-1.13c-.39 0-.76.1-1.1.28-.32.21-.59.5-.77.85-.2.37-.29.8-.29 1.28 0 .49.1.91.3 1.27a2.08 2.08 0 0 0 1.87 1.15zm10.79-.01h-.88v2.43H51.6v-9.67h4.65c.9 0 1.67.15 2.34.44.66.29 1.17.72 1.53 1.27.36.55.54 1.2.54 1.93 0 .7-.15 1.3-.47 1.81-.32.51-.76.93-1.35 1.23l2.03 2.99h-3.48l-1.65-2.43zm1.63-3.6c0-.36-.1-.63-.33-.83-.22-.2-.55-.3-1-.3h-1.18v2.27h1.18c.45 0 .78-.1 1-.3.22-.2.33-.48.33-.84zm11.93-1.18v1.65h4.03v2.46h-4.04v3.1h-3.26v-9.67h7.87v2.46h-4.6zm10.63 7.43a6.03 6.03 0 0 1-2.8-.65 4.84 4.84 0 0 1-2.65-4.4c0-.98.23-1.85.7-2.62a4.9 4.9 0 0 1 1.95-1.8 6.05 6.05 0 0 1 2.8-.65c1.04 0 1.98.23 2.8.65a4.89 4.89 0 0 1 2.66 4.41 4.85 4.85 0 0 1-2.65 4.41c-.83.43-1.77.65-2.8.65zm0-2.64c.4 0 .78-.1 1.1-.3.33-.2.59-.47.78-.85.2-.36.3-.78.3-1.27 0-.48-.1-.9-.3-1.28a2.07 2.07 0 0 0-1.88-1.13c-.4 0-.77.1-1.1.28-.33.21-.6.5-.78.85-.19.37-.29.8-.29 1.28 0 .49.1.91.3 1.27a2.08 2.08 0 0 0 1.87 1.15zm10.8-.01h-.89v2.43h-3.26v-9.67h4.66c.9 0 1.67.15 2.33.44.66.29 1.18.72 1.54 1.27.36.55.53 1.2.53 1.93 0 .7-.15 1.3-.47 1.81-.31.51-.76.93-1.35 1.23l2.03 2.99h-3.48l-1.64-2.43zm1.62-3.6c0-.36-.1-.63-.33-.83-.22-.2-.55-.3-1-.3h-1.18v2.27h1.19c.44 0 .77-.1 1-.3.21-.2.32-.48.32-.84zm-74.1 18.88H15.4V60.4h8.92v2.52H21.5v7.15h-3.26V62.9zM34.7 60.4v9.67h-3.26v-3.57h-3.01v3.57h-3.26v-9.67h3.26v3.42h3.01V60.4h3.26zm9.62 7.2v2.47h-8.04v-9.67h7.86v2.46h-4.66v1.13h4.1v2.35h-4.1v1.27h4.84zm21.14-7.2l-3.1 9.67h-3.5l-1.55-5.17-1.65 5.17h-3.5l-3.09-9.67h3.36l1.68 5.5 1.79-5.5h3l1.68 5.56 1.78-5.56h3.1zm8.76 7.2v2.47h-8.04v-9.67h7.86v2.46h-4.66v1.13h4.1v2.35h-4.1v1.27h4.84zm9-2.59c.56.2 1 .53 1.32.93.32.4.47.9.47 1.46 0 .84-.35 1.5-1.05 1.98a5.6 5.6 0 0 1-3.04.69h-5.45v-9.67h5.17a5.1 5.1 0 0 1 2.92.69c.66.45 1 1.07 1 1.83 0 .46-.12.86-.34 1.22-.23.36-.56.65-1 .87zm-4.54-2.33v1.43h1.52c.7 0 1.06-.23 1.06-.71 0-.49-.36-.72-1.06-.72h-1.52zm1.96 5.1c.72 0 1.08-.24 1.08-.75s-.36-.76-1.08-.76H78.7v1.52h1.96z"/>
+</svg>
diff --git a/assets/github.svg b/assets/github.svg
@@ -1,4 +1,4 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg viewBox="0 0 50 50" xmlns="http://www.w3.org/2000/svg">
-    <path d="M24.998 0C11.193 0 0 11.476 0 25.633c0 11.325 7.163 20.932 17.097 24.323 1.25.235 1.707-.557 1.707-1.237 0-.607-.022-2.22-.034-4.358-6.954 1.548-8.421-3.437-8.421-3.437-1.138-2.96-2.777-3.748-2.777-3.748-2.27-1.591.172-1.56.172-1.56 2.51.183 3.83 2.642 3.83 2.642 2.23 3.917 5.851 2.785 7.276 2.13.227-1.656.871-2.786 1.586-3.426-5.55-.647-11.387-2.847-11.387-12.67 0-2.797.974-5.085 2.574-6.877-.258-.649-1.116-3.254.244-6.784 0 0 2.1-.69 6.875 2.628 1.994-.568 4.133-.853 6.259-.862 2.122.009 4.262.294 6.258.862 4.773-3.317 6.868-2.628 6.868-2.628 1.365 3.53.507 6.135.249 6.784 1.602 1.792 2.57 4.08 2.57 6.878 0 9.847-5.845 12.014-11.415 12.648.898.792 1.698 2.356 1.698 4.748 0 3.425-.031 6.19-.031 7.03 0 .686.45 1.484 1.719 1.234C42.844 46.556 50 36.955 50 25.633 50 11.476 38.806 0 24.998 0" fill="#eef"/>
-</svg>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg viewBox="0 0 50 50" xmlns="http://www.w3.org/2000/svg">
+    <path d="M24.998 0C11.193 0 0 11.476 0 25.633c0 11.325 7.163 20.932 17.097 24.323 1.25.235 1.707-.557 1.707-1.237 0-.607-.022-2.22-.034-4.358-6.954 1.548-8.421-3.437-8.421-3.437-1.138-2.96-2.777-3.748-2.777-3.748-2.27-1.591.172-1.56.172-1.56 2.51.183 3.83 2.642 3.83 2.642 2.23 3.917 5.851 2.785 7.276 2.13.227-1.656.871-2.786 1.586-3.426-5.55-.647-11.387-2.847-11.387-12.67 0-2.797.974-5.085 2.574-6.877-.258-.649-1.116-3.254.244-6.784 0 0 2.1-.69 6.875 2.628 1.994-.568 4.133-.853 6.259-.862 2.122.009 4.262.294 6.258.862 4.773-3.317 6.868-2.628 6.868-2.628 1.365 3.53.507 6.135.249 6.784 1.602 1.792 2.57 4.08 2.57 6.878 0 9.847-5.845 12.014-11.415 12.648.898.792 1.698 2.356 1.698 4.748 0 3.425-.031 6.19-.031 7.03 0 .686.45 1.484 1.719 1.234C42.844 46.556 50 36.955 50 25.633 50 11.476 38.806 0 24.998 0" fill="#eef"/>
+</svg>
diff --git a/assets/icons/favicon.svg b/assets/icons/favicon.svg
@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 100 100">
-    <circle cx="50" cy="50" r="50" fill="#2d2b55"/>
-    <path fill="#fff" fill-rule="nonzero" d="M46.6365964 63.20753129h-4.4881496L39.4319352 76.57454H21.1545365L31.9910556 23.4254h24.3009679c7.1160793 0 12.6672117 1.54132506 16.6238699 4.59740061 3.9271309 3.05607555 5.90546 7.36115589 5.90546 12.86209188.45176769 8.83752089-5.45369231 16.99591388-14.6160135 20.1966732l8.8877173 15.25380318-18.8088901.23917113-7.677098-13.36700871h.0295273zm6.8798609-25.96335489h-6.1121511l-2.5688751 12.46347333h7.5294615c2.5098205 0 4.4881496-.63778968 5.8759327-1.8602199 1.3877831-1.24900479 2.066911-2.97635184 2.066911-5.20861572 0-3.58756695-2.2440748-5.39463771-6.791279-5.39463771z"/>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1.73337,0,0,1.73337,-36.6687,-36.6685)">
+        <path d="M46.637,63.208L42.148,63.208L39.432,76.575L21.155,76.575L31.991,23.425L56.292,23.425C63.408,23.425 68.959,24.967 72.916,28.023C76.843,31.079 78.821,35.384 78.821,40.885C79.273,49.722 73.368,57.881 64.205,61.082L73.093,76.335L54.284,76.575L46.607,63.208L46.637,63.208ZM53.516,37.244L47.404,37.244L44.835,49.708L52.365,49.708C54.875,49.708 56.853,49.07 58.241,47.847C59.629,46.598 60.308,44.871 60.308,42.639C60.308,39.051 58.064,37.244 53.516,37.244Z" style="fill:rgb(45,43,85);fill-rule:nonzero;"/>
+    </g>
 </svg>
diff --git a/assets/logo.svg b/assets/logo.svg
@@ -1,4 +1,4 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" fill="#eeeeff" viewBox="0 0 100 18">
-    <path d="M8.68 13.473H7.16L6.24 18H.05L3.72 0h8.23c2.41 0 4.29.522 5.63 1.557 1.33 1.035 2 2.493 2 4.356.153 2.9925-1.847 5.7555-4.95 6.84l3.01 5.166L29.28 0h6.08l4.35 18h-6.16l-.6-3.141h-7L24.12 18H11.27l-2.6-4.527h.01zM50.93 18H44.3L42.1 0h6.1l1.19 10.26L54.84 0h5.69l1.04 10.413L67.11 0h6.08l-9.54 18H57l-1.04-9.486L50.93 18zm23.57 0c-.8 0-1.58-.09-2.34-.27-.663-.1368-1.296-.3744-1.87-.702l1.05-2.34c.959.5391 2.06.8406 3.19.873.45 0 .77-.045.97-.126.19-.09.29-.216.29-.387 0-.198-.13-.36-.38-.45-.406-.1395-.824-.2484-1.25-.324-.636-.1233-1.261-.2889-1.87-.495-.5-.18-.93-.468-1.3-.873-.39-.468-.585-1.0449-.55-1.629 0-.594.17-1.143.5-1.629.35-.486.86-.873 1.54-1.152.67-.279 1.5-.423 2.46-.423.67 0 1.32.072 1.96.216.64.135 1.2.342 1.7.612l-.99 2.322c-.818-.4392-1.748-.684-2.7-.711-.83 0-1.25.207-1.25.603 0 .18.12.333.37.423.25.09.66.198 1.23.306.74.135 1.36.288 1.87.468.5.18.94.468 1.32.864.37.396.56.936.56 1.62.019 1.2132-.793 2.3202-2.04 2.781-.779.3015-1.622.4464-2.47.423zm22.39-5.22h2.83v4.014c-.57.387-1.23.684-1.99.9-.75.198-1.5.306-2.22.306-.972.0144-1.931-.2034-2.78-.63-.814-.414-1.483-1.0251-1.93-1.764-.475-.7866-.716-1.6704-.7-2.565 0-.963.24-1.818.7-2.574.451-.7425 1.127-1.3545 1.95-1.764.83-.414 1.78-.63 2.83-.63.95 0 1.8.162 2.55.468.75.315 1.37.765 1.87 1.368l-2.09 1.8c-.6-.693-1.33-1.044-2.17-1.044-.72 0-1.29.216-1.71.63-.452.4878-.681 1.1124-.64 1.746 0 .711.21 1.287.63 1.719.42.432.98.648 1.68.648.42 0 .81-.072 1.19-.225V12.78zm-10.67 5.004h-3.2L78.91 8.28h3.51l2.31 5.553L87.1 8.28h3.2l-4.09 9.495.01.009zm-54.14-7.29l-.89-4.608-2.7 4.608h3.6-.01zM11.01 4.68H8.94l-.87 4.221h2.55c.85 0 1.52-.216 1.99-.63.47-.423.7-1.008.7-1.764 0-1.215-.76-1.827-2.3-1.827z"/>
-</svg>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" fill="#eeeeff" viewBox="0 0 100 18">
+    <path d="M8.68 13.473H7.16L6.24 18H.05L3.72 0h8.23c2.41 0 4.29.522 5.63 1.557 1.33 1.035 2 2.493 2 4.356.153 2.9925-1.847 5.7555-4.95 6.84l3.01 5.166L29.28 0h6.08l4.35 18h-6.16l-.6-3.141h-7L24.12 18H11.27l-2.6-4.527h.01zM50.93 18H44.3L42.1 0h6.1l1.19 10.26L54.84 0h5.69l1.04 10.413L67.11 0h6.08l-9.54 18H57l-1.04-9.486L50.93 18zm23.57 0c-.8 0-1.58-.09-2.34-.27-.663-.1368-1.296-.3744-1.87-.702l1.05-2.34c.959.5391 2.06.8406 3.19.873.45 0 .77-.045.97-.126.19-.09.29-.216.29-.387 0-.198-.13-.36-.38-.45-.406-.1395-.824-.2484-1.25-.324-.636-.1233-1.261-.2889-1.87-.495-.5-.18-.93-.468-1.3-.873-.39-.468-.585-1.0449-.55-1.629 0-.594.17-1.143.5-1.629.35-.486.86-.873 1.54-1.152.67-.279 1.5-.423 2.46-.423.67 0 1.32.072 1.96.216.64.135 1.2.342 1.7.612l-.99 2.322c-.818-.4392-1.748-.684-2.7-.711-.83 0-1.25.207-1.25.603 0 .18.12.333.37.423.25.09.66.198 1.23.306.74.135 1.36.288 1.87.468.5.18.94.468 1.32.864.37.396.56.936.56 1.62.019 1.2132-.793 2.3202-2.04 2.781-.779.3015-1.622.4464-2.47.423zm22.39-5.22h2.83v4.014c-.57.387-1.23.684-1.99.9-.75.198-1.5.306-2.22.306-.972.0144-1.931-.2034-2.78-.63-.814-.414-1.483-1.0251-1.93-1.764-.475-.7866-.716-1.6704-.7-2.565 0-.963.24-1.818.7-2.574.451-.7425 1.127-1.3545 1.95-1.764.83-.414 1.78-.63 2.83-.63.95 0 1.8.162 2.55.468.75.315 1.37.765 1.87 1.368l-2.09 1.8c-.6-.693-1.33-1.044-2.17-1.044-.72 0-1.29.216-1.71.63-.452.4878-.681 1.1124-.64 1.746 0 .711.21 1.287.63 1.719.42.432.98.648 1.68.648.42 0 .81-.072 1.19-.225V12.78zm-10.67 5.004h-3.2L78.91 8.28h3.51l2.31 5.553L87.1 8.28h3.2l-4.09 9.495.01.009zm-54.14-7.29l-.89-4.608-2.7 4.608h3.6-.01zM11.01 4.68H8.94l-.87 4.221h2.55c.85 0 1.52-.216 1.99-.63.47-.423.7-1.008.7-1.764 0-1.215-.76-1.827-2.3-1.827z"/>
+</svg>
diff --git a/build/build.py b/build/build.py
@@ -1,16 +1,16 @@
-import os
-
-BUILD_CMD = "elm make \"src/Main.elm\" --optimize --output=build/output/script.js"
-COMPRESS_CMD = "minify build/output/script.js --mangle -o script.min.js"
-COPYRIGHT = "// Thiago Brevidelli ⓒ 2019. ALL RIGHTS RESERVED"
-
-print("Compiling source files...")
-os.system(BUILD_CMD)
-
-print("Compressing compiled ouput...")
-os.system(COMPRESS_CMD)
-
-with open("script.min.js", "rw", encoding="utf8") as c_file:
-    c_file.write(COPYRIGHT + c_file.read())
-
-print("\nAll done!")
+import os
+
+BUILD_CMD = "elm make \"src/Main.elm\" --optimize --output=build/output/script.js"
+COMPRESS_CMD = "minify build/output/script.js --mangle -o script.min.js"
+COPYRIGHT = "// Thiago Brevidelli ⓒ 2019. ALL RIGHTS RESERVED"
+
+print("Compiling source files...")
+os.system(BUILD_CMD)
+
+print("Compressing compiled ouput...")
+os.system(COMPRESS_CMD)
+
+with open("script.min.js", "w+", encoding="utf8") as c_file:
+    c_file.write(COPYRIGHT + c_file.read())
+
+print("\nAll done!")
diff --git a/elm.json b/elm.json
@@ -1,32 +1,32 @@
-{
-    "type": "application",
-    "source-directories": [
-        "src"
-    ],
-    "elm-version": "0.19.0",
-    "dependencies": {
-        "direct": {
-            "elm/browser": "1.0.1",
-            "elm/core": "1.0.2",
-            "elm/file": "1.0.5",
-            "elm/html": "1.0.0",
-            "elm/http": "2.0.0",
-            "elm/json": "1.1.3",
-            "elm/regex": "1.0.0",
-            "pablohirafuji/elm-syntax-highlight": "3.1.0"
-        },
-        "indirect": {
-            "andre-dietrich/parser-combinators": "3.1.1",
-            "elm/bytes": "1.0.8",
-            "elm/parser": "1.1.0",
-            "elm/time": "1.0.0",
-            "elm/url": "1.0.0",
-            "elm/virtual-dom": "1.0.2",
-            "pilatch/flip": "1.0.0"
-        }
-    },
-    "test-dependencies": {
-        "direct": {},
-        "indirect": {}
-    }
-}-
\ No newline at end of file
+{
+    "type": "application",
+    "source-directories": [
+        "src"
+    ],
+    "elm-version": "0.19.0",
+    "dependencies": {
+        "direct": {
+            "elm/browser": "1.0.1",
+            "elm/core": "1.0.2",
+            "elm/file": "1.0.5",
+            "elm/html": "1.0.0",
+            "elm/http": "2.0.0",
+            "elm/json": "1.1.3",
+            "elm/regex": "1.0.0",
+            "pablohirafuji/elm-syntax-highlight": "3.1.1"
+        },
+        "indirect": {
+            "andre-dietrich/parser-combinators": "3.1.1",
+            "elm/bytes": "1.0.8",
+            "elm/parser": "1.1.0",
+            "elm/time": "1.0.0",
+            "elm/url": "1.0.0",
+            "elm/virtual-dom": "1.0.2",
+            "pilatch/flip": "1.0.0"
+        }
+    },
+    "test-dependencies": {
+        "direct": {},
+        "indirect": {}
+    }
+}
diff --git a/index.html b/index.html
diff --git a/manifest.json b/manifest.json
@@ -1,20 +1,20 @@
-{
-  "name": "RawSvg",
-  "short_name": "RawSvg",
-  "display": "standalone",
-  "icons": [
-    {
-      "src": "assets/icons/android-chrome-192x192.png",
-      "sizes": "192x192",
-      "type": "image/png"
-    },
-    {
-      "src": "assets/icons/android-chrome-512x512.png",
-      "sizes": "512x512",
-      "type": "image/png"
-    }
-  ],
-  "start_url": "index.html",
-  "background_color": "#eeeeff",
-  "theme_color": "#B362FF"
+{
+  "name": "RawSvg",
+  "short_name": "RawSvg",
+  "display": "standalone",
+  "icons": [
+    {
+      "src": "assets/icons/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "assets/icons/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "index.html",
+  "background_color": "#eeeeff",
+  "theme_color": "#B362FF"
 } 
\ No newline at end of file
diff --git a/script.min.js b/script.min.js
diff --git a/service-worker.js b/service-worker.js
@@ -1,18 +1,18 @@
-self.addEventListener('install', installHandler);
-self.addEventListener('fetch', fetchHandler);
-
-function installHandler(e) {
-    e.waitUntil(
-        caches.open('progessive-elm')
-            .then((cache) => cache.addAll(['/', '/index.html']))
-            .catch(console.error)
-    );
-}
-
-function fetchHandler(e) {
-    e.respondWith(
-        caches.match(event.request)
-            .then((response) => response || fetch(e.request))
-            .catch(console.error)
-    );
+self.addEventListener('install', installHandler);
+self.addEventListener('fetch', fetchHandler);
+
+function installHandler(e) {
+    e.waitUntil(
+        caches.open('progessive-elm')
+            .then((cache) => cache.addAll(['/', '/index.html']))
+            .catch(console.error)
+    );
+}
+
+function fetchHandler(e) {
+    e.respondWith(
+        caches.match(event.request)
+            .then((response) => response || fetch(e.request))
+            .catch(console.error)
+    );
 } 
\ No newline at end of file
diff --git a/src/Editor.elm b/src/Editor.elm
@@ -1,57 +1,57 @@
-module Editor exposing (editor)
-
-import Types exposing (..)
-import Html exposing (Html, Attribute, div, pre, code, text, textarea)
-import Html.Attributes exposing (id, value, style, spellcheck, alt)
-import Html.Events exposing (onInput, on)
-import Json.Decode
-import SyntaxHighlight exposing (xml, toBlockHtml)
-
-editor : Model -> Html Msg
-editor model =
-    div [ id "editor", alt "Text Editor" ]
-        [ div [ translate model.editorScroll ]
-            [ codeDisplay model ]
-        , textarea model
-        ]
-
-textarea : Model -> Html Msg
-textarea model =
-    Html.textarea
-        [ value model.image
-        , onInput Update
-        , onScroll Scroll
-        , spellcheck False
-        , alt "Text Editor"
-        ] []
-
-codeDisplay : Model -> Html Msg
-codeDisplay model =
-    xml (if model.image == "" then placeholder else model.image)
-        |> Result.map (toBlockHtml Nothing)
-        |> Result.withDefault
-            (pre [] [ code [] [ text model.image ] ])
-
-onScroll : ((Int, Int) -> msg) -> Attribute msg
-onScroll f = 
-    on "scroll"
-        (Json.Decode.map2 (\x -> \y -> (x, y))
-            (Json.Decode.at [ "target", "scrollLeft" ] Json.Decode.int)
-            (Json.Decode.at [ "target", "scrollTop" ]  Json.Decode.int)
-            |> Json.Decode.map f
-        )
-
-transform : String -> Attribute msg
-transform str =
-    style "transform" str
-
-translate : (Int, Int) -> Attribute Msg
-translate (x, y) =
-    transform ("translate(" ++ (show -x) ++ "px, " ++ (show -y) ++ "px)")
-
-placeholder : String
-placeholder =
-    "<svg ...> ... </svg>"
-
-show : Int -> String
+module Editor exposing (editor)
+
+import Types exposing (..)
+import Html exposing (Html, Attribute, div, pre, code, text, textarea)
+import Html.Attributes exposing (id, value, style, spellcheck, alt)
+import Html.Events exposing (onInput, on)
+import Json.Decode
+import SyntaxHighlight exposing (xml, toBlockHtml)
+
+editor : Model -> Html Msg
+editor model =
+    div [ id "editor", alt "Text Editor" ]
+        [ div [ translate model.editorScroll ]
+            [ codeDisplay model ]
+        , textarea model
+        ]
+
+textarea : Model -> Html Msg
+textarea model =
+    Html.textarea
+        [ value model.image
+        , onInput Update
+        , onScroll Scroll
+        , spellcheck False
+        , alt "Text Editor"
+        ] []
+
+codeDisplay : Model -> Html Msg
+codeDisplay model =
+    xml (if model.image == "" then placeholder else model.image)
+        |> Result.map (toBlockHtml Nothing)
+        |> Result.withDefault
+            (pre [] [ code [] [ text model.image ] ])
+
+onScroll : ((Int, Int) -> msg) -> Attribute msg
+onScroll f = 
+    on "scroll"
+        (Json.Decode.map2 (\x -> \y -> (x, y))
+            (Json.Decode.at [ "target", "scrollLeft" ] Json.Decode.int)
+            (Json.Decode.at [ "target", "scrollTop" ]  Json.Decode.int)
+            |> Json.Decode.map f
+        )
+
+transform : String -> Attribute msg
+transform str =
+    style "transform" str
+
+translate : (Int, Int) -> Attribute Msg
+translate (x, y) =
+    transform ("translate(" ++ (show -x) ++ "px, " ++ (show -y) ++ "px)")
+
+placeholder : String
+placeholder =
+    "<svg ...> ... </svg>"
+
+show : Int -> String
 show = String.fromInt 
\ No newline at end of file
diff --git a/src/Main.elm b/src/Main.elm
@@ -1,93 +1,93 @@
-module Main exposing (main)
-
-import View exposing (view)
-import Types exposing (..)
-import Browser exposing (document)
-import Http
-import File exposing (File)
-import File.Download as Download
-import File.Select as Select
-import Regex
-import Task
-
-
-main : Program () Model Msg
-main =
-  document
-    { init = \_ -> (init, loadContent)
-    , update = update
-    , view = view
-    , subscriptions = \_ -> Sub.none
-    }
-
-
-update : Msg -> Model -> (Model, Cmd Msg)
-update msg model =
-    case msg of
-        Update image ->
-            ({ model | image = image }, Cmd.none)
-
-        Load res ->
-            (load model res, Cmd.none)
-
-        Validation val ->
-            ({ model | status = val }, Cmd.none)
-
-        ToggleDarkMode ->
-            ({ model | mode = toggle model.mode }, Cmd.none)
-
-        Download ->
-            (model, Download.string model.fileName "image/svg+xml" model.image)
-
-        Upload upl ->
-            upload model upl
-
-        Scroll scroll ->
-            ({model | editorScroll = scroll}, Cmd.none)
-
-load : Model -> Result Http.Error String -> Model
-load model res =
-    case res of
-        Ok svg ->
-            { model | image = svg, load = Loaded }
-
-        Err _ ->
-            { model | load = Loaded }
-
-upload : Model -> Upload -> (Model, Cmd Msg)
-upload model upl =
-    case upl of
-        Requested  ->
-            (model, Select.file [ "image/svg+xml" ] (\file -> Upload (Selected file)))
-
-        Selected file ->
-            ({ model | fileName = File.name file }, Task.perform Update (File.toString file))
-
-init : Model
-init =
-    { image = emptySvg
-    , status = Valid
-    , mode = Light
-    , uriEncoder = Maybe.withDefault Regex.never
-        <| Regex.fromString "!|#|\\$|%|&|'|\\(|\\)|\\*|\\+|,|\\/|:|;|=|\\?|@|\\[|\\]"
-    , fileName = "example.svg"
-    , editorScroll = (0, 0)
-    , load = Loading
-    }
-
-loadContent : Cmd Msg
-loadContent =
-    Http.get
-        { url = "assets/example.svg"
-        , expect = Http.expectString Load
-        }
-
-toggle : Mode -> Mode
-toggle mode =
-    case mode of
-        Light -> Dark
-
-        Dark  -> Light
-
-emptySvg : String
+module Main exposing (main)
+
+import View exposing (view)
+import Types exposing (..)
+import Browser exposing (document)
+import Http
+import File exposing (File)
+import File.Download as Download
+import File.Select as Select
+import Regex
+import Task
+
+
+main : Program () Model Msg
+main =
+  document
+    { init = \_ -> (init, loadContent)
+    , update = update
+    , view = view
+    , subscriptions = \_ -> Sub.none
+    }
+
+
+update : Msg -> Model -> (Model, Cmd Msg)
+update msg model =
+    case msg of
+        Update image ->
+            ({ model | image = image }, Cmd.none)
+
+        Load res ->
+            (load model res, Cmd.none)
+
+        Validation val ->
+            ({ model | status = val }, Cmd.none)
+
+        ToggleDarkMode ->
+            ({ model | mode = toggle model.mode }, Cmd.none)
+
+        Download ->
+            (model, Download.string model.fileName "image/svg+xml" model.image)
+
+        Upload upl ->
+            upload model upl
+
+        Scroll scroll ->
+            ({model | editorScroll = scroll}, Cmd.none)
+
+load : Model -> Result Http.Error String -> Model
+load model res =
+    case res of
+        Ok svg ->
+            { model | image = svg, load = Loaded }
+
+        Err _ ->
+            { model | load = Loaded }
+
+upload : Model -> Upload -> (Model, Cmd Msg)
+upload model upl =
+    case upl of
+        Requested  ->
+            (model, Select.file [ "image/svg+xml" ] (\file -> Upload (Selected file)))
+
+        Selected file ->
+            ({ model | fileName = File.name file }, Task.perform Update (File.toString file))
+
+init : Model
+init =
+    { image = emptySvg
+    , status = Valid
+    , mode = Light
+    , uriEncoder = Maybe.withDefault Regex.never
+        <| Regex.fromString "!|#|\\$|%|&|'|\\(|\\)|\\*|\\+|,|\\/|:|;|=|\\?|@|\\[|\\]"
+    , fileName = "example.svg"
+    , editorScroll = (0, 0)
+    , load = Loading
+    }
+
+loadContent : Cmd Msg
+loadContent =
+    Http.get
+        { url = "assets/example.svg"
+        , expect = Http.expectString Load
+        }
+
+toggle : Mode -> Mode
+toggle mode =
+    case mode of
+        Light -> Dark
+
+        Dark  -> Light
+
+emptySvg : String
 emptySvg = "<svg> . . . </svg>" 
\ No newline at end of file
diff --git a/src/Types.elm b/src/Types.elm
@@ -1,40 +1,40 @@
-module Types exposing (..)
-
-import Http
-import File exposing (File)
-import Regex exposing (Regex)
-
-type alias Model =
-    { image : String
-    , status : Status
-    , mode : Mode
-    , uriEncoder : Regex
-    , fileName : String
-    , editorScroll : (Int, Int)
-    , load : Load
-    }
-
-type Status
-    = Valid
-    | Invalid
-
-type Mode
-    = Light
-    | Dark
-
-type Load
-    = Loading
-    | Loaded
-
-type Upload
-    = Requested
-    | Selected File
-
-type Msg
-    = Update String
-    | Load (Result Http.Error String)
-    | Validation Status
-    | ToggleDarkMode
-    | Download
-    | Upload Upload
+module Types exposing (..)
+
+import Http
+import File exposing (File)
+import Regex exposing (Regex)
+
+type alias Model =
+    { image : String
+    , status : Status
+    , mode : Mode
+    , uriEncoder : Regex
+    , fileName : String
+    , editorScroll : (Int, Int)
+    , load : Load
+    }
+
+type Status
+    = Valid
+    | Invalid
+
+type Mode
+    = Light
+    | Dark
+
+type Load
+    = Loading
+    | Loaded
+
+type Upload
+    = Requested
+    | Selected File
+
+type Msg
+    = Update String
+    | Load (Result Http.Error String)
+    | Validation Status
+    | ToggleDarkMode
+    | Download
+    | Upload Upload
     | Scroll (Int, Int) 
\ No newline at end of file
diff --git a/src/View.elm b/src/View.elm
@@ -1,131 +1,131 @@
-module View exposing (view)
-
-import Types exposing (..)
-import Editor exposing (editor)
-
-import Html exposing (Html, Attribute, div, img, button, a, text)
-import Html.Events exposing (onClick, on)
-import Html.Attributes exposing (id, class, src, href, target, rel, alt)
-import Html.Lazy exposing (lazy)
-import Browser exposing (Document)
-import Json.Decode
-import Regex exposing (Regex, Match, replace)
-
-
-view : Model -> Document Msg
-view model =
-    { title = "RawSvg"
-    , body =
-        case model.load of
-            Loading -> []
-
-            Loaded  -> [ lazy container model ]
-    }
-
-container : Model -> Html Msg
-container model =
-    div [ id "container", class (if valid model.status then "valid" else "error") ]
-        [ div [ id "title" ]
-            [ logo
-            , link [ href "https://github.com/GarkGarcia/RawSvg", id "github" ]
-                [ githubIcon ]
-            , link
-                [ href "https://github.com/GarkGarcia/RawSvg/blob/master/LICENSE"
-                , id "copyright"
-                , class "elmsh-comm"
-                , alt "License Information"
-                ] [ text "<!-- GarkGarcia (C) 2019 -->" ]
-            ]
-        , display model
-        , lazy editor model
-        ]
-
-display : Model -> Html Msg
-display model =
-    div [ id "display", class (if darkMode model.mode then "dark" else "light") ]
-        [ img [ id "image", src (uri model), loaded model, alt "Picture Display" ] []
-        , errorIcon
-        , button [ onClick Download, alt "Download" ] [ downloadIcon ]
-        , button [ onClick (Upload Requested), alt "Upload" ] [ uploadIcon ]
-        , button [ onClick ToggleDarkMode, alt "Toggle Dark Mode" ] [ bulbIcon model.mode ]
-        ]
-
-uri : Model -> String
-uri model =
-    "data:image/svg+xml;utf8," ++ (replace model.uriEncoder percentEscape model.image)
-
-percentEscape : Match -> String
-percentEscape m =
-    case m.match of
-        "!" -> "%21"
-        "#" -> "%23"
-        "$" -> "%24"
-        "%" -> "%25"
-        "&" -> "%26"
-        "'" -> "%27"
-        "(" -> "%28"
-        ")" -> "%29"
-        "*" -> "%2A"
-        "+" -> "%2B"
-        "," -> "%2C"
-        "/" -> "%2F"
-        ":" -> "%3A"
-        ";" -> "%3B"
-        "=" -> "%3D"
-        "?" -> "%3F"
-        "@" -> "%40"
-        "[" -> "%5B"
-        "]" -> "%5D"
-        str -> str
-
-onError : msg -> Attribute msg
-onError f = 
-    on "error" (Json.Decode.succeed f)
-
-onLoad : msg -> Attribute msg
-onLoad f = 
-    on "load" (Json.Decode.succeed f)
-
-loaded : Model -> Attribute Msg
-loaded model =
-    if valid model.status then onError (Validation Invalid) else onLoad (Validation Valid)
-
-link : List (Attribute Msg) -> List (Html Msg) -> Html Msg
-link attrs content =
-    a ([ target "_blank", rel "noopener noreferrer" ] ++ attrs)
-        content
-
-valid : Status -> Bool
-valid status =
-    case status of
-        Valid   -> True
-
-        Invalid -> False
-
-darkMode : Mode -> Bool
-darkMode mode =
-    case mode of
-        Light -> False
-
-        Dark  -> True
-        
-logo : Html Msg
-logo = img [ src "assets/logo.svg", alt "RawSvg" ] []
-
-downloadIcon : Html Msg
-downloadIcon = img [ src "assets/download.svg", alt "Download" ] []
-
-uploadIcon : Html Msg
-uploadIcon = img [ src "assets/upload.svg", alt "Upload" ] []
-
-bulbIcon : Mode -> Html Msg
-bulbIcon mode =
-    img [ src (if darkMode mode then "assets/bulb-on.svg" else "assets/bulb-off.svg")
-        , alt "Toggle Dark Mode"
-        ] []
-
-errorIcon : Html Msg
-errorIcon = img [ id "error", src "assets/error.svg", alt "Something Went Wrong" ] []
-
-githubIcon : Html Msg
+module View exposing (view)
+
+import Types exposing (..)
+import Editor exposing (editor)
+
+import Html exposing (Html, Attribute, div, img, button, a, text)
+import Html.Events exposing (onClick, on)
+import Html.Attributes exposing (id, class, src, href, target, rel, alt)
+import Html.Lazy exposing (lazy)
+import Browser exposing (Document)
+import Json.Decode
+import Regex exposing (Regex, Match, replace)
+
+
+view : Model -> Document Msg
+view model =
+    { title = "RawSvg"
+    , body =
+        case model.load of
+            Loading -> []
+
+            Loaded  -> [ lazy container model ]
+    }
+
+container : Model -> Html Msg
+container model =
+    div [ id "container", class (if valid model.status then "valid" else "error") ]
+        [ div [ id "title" ]
+            [ logo
+            , link [ href "https://github.com/GarkGarcia/RawSvg", id "github" ]
+                [ githubIcon ]
+            , link
+                [ href "https://github.com/GarkGarcia/RawSvg/blob/master/LICENSE"
+                , id "copyright"
+                , class "elmsh-comm"
+                , alt "License Information"
+                ] [ text "<!-- GarkGarcia (C) 2019 -->" ]
+            ]
+        , display model
+        , lazy editor model
+        ]
+
+display : Model -> Html Msg
+display model =
+    div [ id "display", class (if darkMode model.mode then "dark" else "light") ]
+        [ img [ id "image", src (uri model), loaded model, alt "Picture Display" ] []
+        , errorIcon
+        , button [ onClick Download, alt "Download" ] [ downloadIcon ]
+        , button [ onClick (Upload Requested), alt "Upload" ] [ uploadIcon ]
+        , button [ onClick ToggleDarkMode, alt "Toggle Dark Mode" ] [ bulbIcon model.mode ]
+        ]
+
+uri : Model -> String
+uri model =
+    "data:image/svg+xml;utf8," ++ (replace model.uriEncoder percentEscape model.image)
+
+percentEscape : Match -> String
+percentEscape m =
+    case m.match of
+        "!" -> "%21"
+        "#" -> "%23"
+        "$" -> "%24"
+        "%" -> "%25"
+        "&" -> "%26"
+        "'" -> "%27"
+        "(" -> "%28"
+        ")" -> "%29"
+        "*" -> "%2A"
+        "+" -> "%2B"
+        "," -> "%2C"
+        "/" -> "%2F"
+        ":" -> "%3A"
+        ";" -> "%3B"
+        "=" -> "%3D"
+        "?" -> "%3F"
+        "@" -> "%40"
+        "[" -> "%5B"
+        "]" -> "%5D"
+        str -> str
+
+onError : msg -> Attribute msg
+onError f = 
+    on "error" (Json.Decode.succeed f)
+
+onLoad : msg -> Attribute msg
+onLoad f = 
+    on "load" (Json.Decode.succeed f)
+
+loaded : Model -> Attribute Msg
+loaded model =
+    if valid model.status then onError (Validation Invalid) else onLoad (Validation Valid)
+
+link : List (Attribute Msg) -> List (Html Msg) -> Html Msg
+link attrs content =
+    a ([ target "_blank", rel "noopener noreferrer" ] ++ attrs)
+        content
+
+valid : Status -> Bool
+valid status =
+    case status of
+        Valid   -> True
+
+        Invalid -> False
+
+darkMode : Mode -> Bool
+darkMode mode =
+    case mode of
+        Light -> False
+
+        Dark  -> True
+        
+logo : Html Msg
+logo = img [ src "assets/logo.svg", alt "RawSvg" ] []
+
+downloadIcon : Html Msg
+downloadIcon = img [ src "assets/download.svg", alt "Download" ] []
+
+uploadIcon : Html Msg
+uploadIcon = img [ src "assets/upload.svg", alt "Upload" ] []
+
+bulbIcon : Mode -> Html Msg
+bulbIcon mode =
+    img [ src (if darkMode mode then "assets/bulb-on.svg" else "assets/bulb-off.svg")
+        , alt "Toggle Dark Mode"
+        ] []
+
+errorIcon : Html Msg
+errorIcon = img [ id "error", src "assets/error.svg", alt "Something Went Wrong" ] []
+
+githubIcon : Html Msg
 githubIcon = img [ src "assets/github.svg", alt "Github Repository" ] [] 
\ No newline at end of file