diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 0000000..e7375ee
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,38 @@
+# EditorConfig is awesome: http://EditorConfig.org
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+
+end_of_line = lf
+charset = utf-8
+
+max_line_length = 80
+
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.html]
+indent_style = space
+indent_size = 4
+
+[*.{css,scss,less}]
+indent_style = space
+indent_size = 2
+
+[*.js]
+indent_style = space
+indent_size = 2
+
+[*.json]
+indent_style = space
+indent_size = 2
+
+[*.txt]
+indent_style = space
+indent_size = 4
+
+[*.{diff,md}]
+trim_trailing_whitespace = false
diff --git a/.jsbeautifyrc b/.jsbeautifyrc
new file mode 100644
index 0000000..40a72e4
--- /dev/null
+++ b/.jsbeautifyrc
@@ -0,0 +1,50 @@
+{
+  "editorconfig": true,
+  "indent_char": " ",
+  "force_indentation": true,
+  "preserve_newlines": false,
+  "indent_with_tabs": false,
+  "keep_array_indentation": false,
+  "break_chained_methods": false,
+  "indent_scripts": "keep",
+  "brace_style": "collapse",
+  "space_before_conditional": true,
+  "unescape_strings": false,
+  "jslint_happy": false,
+  "end_with_newline": true,
+  "wrap_line_length": "0",
+  "indent_inner_html": true,
+  "comma_first": false,
+  "e4x": true,
+  "indent_empty_lines": false,
+
+  "beautifiers": [
+    "JS-Beautify",
+    "Prettier",
+    "Pretty Diff",
+    "ESLint"
+  ],
+  "html": {
+    "allowed_file_extensions": ["htm", "html", "xhtml", "xml"],
+    "indent_size": 4,
+    "wrap_attributes": "auto",
+    "unformatted": ["img", "code", "pre", "sub", "sup", "em", "strong", "b", "i", "u", "strike", "big", "small", "pre", "svg"]
+  },
+  "css": {
+    "allowed_file_extensions": ["css", "scss", "sass", "less"],
+    "indent_size": 2,
+    "align_assignments": true,
+    "end_with_comma": true
+  },
+  "js": {
+    "allowed_file_extensions": ["js", "json", "jshintrc", "jsbeautifyrc"],
+    "indent_size": 2,
+    "indent_level": 0,
+    "quotes": "single",
+    "align_assignments": true,
+    "space_after_anon_function": true,
+    "space_in_empty_paren": true,
+    "end_with_comma": true,
+    "end_with_semicolon": true
+  }
+}
diff --git a/css/main.min.css b/css/main.min.css
index 3ed4651..88b5f08 100644
--- a/css/main.min.css
+++ b/css/main.min.css
@@ -1 +1 @@
-:root{--color-blue: #65d8ee;--color-green: #A6E22E;--color-yellow: #E6DB74;--color-orange: #FD971F;--color-red: #F92672;--color-purple: #AE81FF;--color-cyan: #0F94CF;--color-grey-light: #E9E9E9;--color-grey-medium: #7E868C;--color-grey-dark: #333E47;--color-black: #000000;--color-white: #FFFFFF;--color-primary: var(--color-blue);--color-success: var(--color-green);--color-info: var(--color-yellow);--color-warning: var(--color-orange);--color-danger: var(--color-red)}body,html{height:100%;font-size:10px}body{color:var(--color-black);font-size:1.6rem;font-family:"Roboto",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}p{color:var(--color-black);font-weight:400;font-style:normal;font-variant:normal;font-size:1.6rem;line-height:1.4}h1{margin:0;color:var(--color-blue);font-size:4rem;line-height:1}h2{margin:0;font-size:3.1rem;line-height:1}h3{margin:0;font-size:2.5rem;line-height:1}h4{margin:0;font-size:2.2rem;line-height:1}h5{margin:0;font-size:1.9rem;line-height:1}h6{margin:0;font-size:1.6rem;line-height:1}strong{font-weight:900}small{font-size:-1.4rem}em{font-style:italic}blockquote>p{margin:1.6rem;padding:0;border-color:#ccc;border-color:rgba(0,0,0,0.2);border-top:2px solid;border-bottom:2px solid;border-radius:0.25em;color:#888;letter-spacing:0.05em;font-style:italic;font-size:4.6rem}ol{padding:0}ol li{margin-left:1.6rem;padding:0}ul{padding:0}ul li{margin-left:1.6rem;padding:0}.center{text-align:center}.black{color:var(--color-black)}.white{color:var(--color-white)}.red{color:var(--color-red)}.yellow{color:var(--color-yellow)}.green{color:var(--color-green)}.blue{color:var(--color-blue)}.purple{color:var(--color-purple)}.orange{color:var(--color-orange)}.cyan{color:var(--color-cyan)}.grey-light{color:var(--color-grey-light)}.grey-medium{color:var(--color-grey-medium)}.grey-dark{color:var(--color-grey-dark)}.bg-black{background-color:var(--color-black)}.bg-white{background-color:var(--color-white)}.bg-red{background-color:var(--color-red)}.bg-yellow{background-color:var(--color-yellow)}.bg-green{background-color:var(--color-green)}.bg-blue{background-color:var(--color-blue)}.bg-purple{background-color:var(--color-purple)}.bg-orange{background-color:var(--color-orange)}.bg-cyan{background-color:var(--color-cyan)}.bg-grey-light{background-color:var(--color-grey-light)}.bg-grey-medium{background-color:var(--color-grey-medium)}.bg-grey-dark{background-color:var(--color-grey-dark)}.terminal{box-sizing:border-box;margin:0 0 50px;box-shadow:5px 5px 11px #737373, -5px -5px 11px #b1b1b1;animation:slideIn ease 0.4s forwards}.terminal .btn--terminal{display:inline-block;width:10px;height:10px;margin:0 4px;cursor:pointer;border-radius:100px;background-color:#000000}.terminal .btn--min{border:1px solid #6d6d6d;background-color:#868686}.terminal .btn--max{border:1px solid #4c4c4c;background-color:#656565}.terminal .btn--close{border:1px solid #000;background-color:#171717}.terminal .cmd__cursor{animation:1s blink step-end infinite}.terminal .bar{position:relative;width:100%;height:25px;text-align:center;border-radius:5px 5px 0 0;background-color:#D9D9D9;font-size:0}.terminal .bar .bar__title{position:absolute;top:4px;right:0;left:0;margin:0 auto;color:#424242;font-family:Arial;font-size:14px;font-weight:400;line-height:1.2}.terminal .bar .bar__btns{position:absolute;top:7px;right:10px}.terminal .body{box-sizing:border-box;padding:30px;border:1px solid #D9D9D9;border-radius:0 0 5px 5px;position:relative}.terminal .body .body__txt{margin:0 0 30px;display:none}@media (min-width: 576px){.terminal .body .body__txt{display:block}}.terminal .body .body__txt p{margin:0;padding:0;font-size:20px;line-height:1.1}@media (min-width: 576px){.terminal .body .body__txt p{font-size:1.2rem}}@media (min-width: 768px){.terminal .body .body__txt p{font-size:1.4rem}}@media (min-width: 992px){.terminal .body .body__txt p{font-size:2.0rem}}@media (min-width: 1200px){.terminal .body .body__txt p{font-size:1.8rem}}.terminal .body .body__txt p span{letter-spacing:2px;font-size:16px}@media (min-width: 768px){.terminal .body .body__txt p span{letter-spacing:1px;font-size:12px}}@media (min-width: 992px){.terminal .body .body__txt p span{letter-spacing:1.5px;font-size:15px}}@media (min-width: 1200px){.terminal .body .body__txt p span{font-size:10px}}.terminal .body .body__bar{font-size:0}.terminal .body .body__bar span{display:inline-block;width:12.5%;height:30px}.terminal .body .body__bar--bottom{margin:0 0 30px}@keyframes "blink"{from,to{opacity:0}50%{opacity:1}}@keyframes slideIn{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.btn{display:inline-block;padding:0.8rem 2.5rem 0.85rem;outline:none;border:1px solid #0d1926;border-radius:0;background-color:transparent;color:#0d1926;text-align:center;text-decoration:none;text-transform:uppercase;font-size:1.6rem;cursor:pointer;transition:all 0.3s ease}@media (min-width: 650px){.btn{font-size:1.4rem;padding:0.57rem 1.5rem 0.55rem}}@media (min-width: 768px){.btn{padding:1.3rem 2.5rem 0.85rem}}.btn:hover{background-color:#0d1926;color:#ffffff}.btn:active{position:relative;top:1px}.btn:focus{box-shadow:0 1px 2px rgba(0,0,0,0.2)}.gogh-header{display:flex;background-color:#0d1926;align-items:center;justify-content:center}.gogh-header h1{width:500px;text-align:center;font-size:1rem;line-height:1}.gogh-header h1 span{display:block;overflow:hidden;color:#fff;text-indent:100%;white-space:nowrap}.gogh-header h1 img{width:100%;height:auto}.gogh-content{padding:50px 0;min-height:200vh;background-color:#e7e7e7;color:#595647}.gogh-content h2{margin:0 0 25px;color:#595647;text-align:center;font-weight:700;font-size:2.0rem;line-height:1.2}@media (min-width: 768px){.gogh-content h2{text-align:left;font-weight:400;font-size:2.8rem;line-height:1}}@media (min-width: 450px){.gogh-content h3{font-size:2.8rem}}@media (min-width: 650px){.gogh-content h3{font-size:3.2rem}}.gogh-content h4{font-size:1.8rem}@media (min-width: 450px){.gogh-content h4{font-size:2.2rem}}@media (min-width: 650px){.gogh-content h4{font-size:2.8rem}}.gogh-content h4 span{font-weight:300;font-size:1.4rem}.gogh-content p{margin:0 0 40px;color:#595647;font-size:1.6rem;line-height:1.4}.code-wrap{position:relative;margin:0 0 40px}.code-wrap .language-bash{padding:0.8rem 0.8rem 1.5rem}@media (min-width: 450px){.code-wrap .language-bash{padding:1.5rem 1.2rem}}.code-wrap .code-holder{position:relative}.code-wrap .btn-copy{position:absolute;right:0;bottom:0;display:inline-flex;padding:5px 10px;height:100%;background-color:#F5F2F0;cursor:pointer;transition:all 0.3s ease}@media (min-width: 650px){.code-wrap .btn-copy{max-width:50px}}.code-wrap .btn-copy svg{width:100%;height:auto;transition:all 0.3s ease;fill:#363636}.code-wrap .btn-copy:hover svg{animation-name:anim-gogh;animation-duration:8s;fill:#FF0883}.github-int{margin:0 0 40px;text-align:center}.filters{display:flex;margin:0 0 40px;justify-content:center;flex-direction:column}@media (min-width: 650px){.filters{flex-direction:row}}.filters .btn{position:relative;margin:0 0 20px 0}@media (min-width: 650px){.filters .btn{margin:0 15px}}.filters .btn:hover::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1;animation-name:anim-gogh-bg;animation-duration:8s}@media (min-width: 768px){.filters .btn::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:0;height:1px;background-color:#0d1926;content:" ";opacity:0;transition:all 0.3s ease}}.filters .btn.active{background-color:#0d1926;color:#e7e7e7}@media (min-width: 768px){.filters .btn.active::before{position:absolute;right:0;bottom:-10px;left:0;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1}}.filter-background{margin:0 0 70px;border:1px solid #ffffff}.filter-background .btn--filter-bg{position:relative;padding:0;width:5%;height:40px;border:none;cursor:pointer;transition:all 0.3s ease, border-radius 0.9s ease}.filter-background .btn--filter-bg span{position:absolute;bottom:-12px;display:none;padding:1px 3px;width:100%;border-radius:1px;background:#0d1926;color:#ffffff;text-align:center;text-transform:none;font-size:0.6rem;transition:all 0.3s ease}.filter-background .btn--filter-bg:hover{z-index:20;height:40px;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}.filter-background .btn--filter-bg:hover span{display:block}.filter-background .btn--filter-bg.active{z-index:10;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}.filter-background .btn--filter-bg.active span{display:block}@media (min-width: 1400px){.gogh-terminal{margin:0 auto;max-width:96%}}@media (min-width: 1800px){.gogh-terminal{max-width:84%}}@media (min-width: 2200px){.gogh-terminal{max-width:74%}}@keyframes anim-gogh{25%{fill:#83FF08}37.5%{fill:#FF8308}50%{fill:#0883FF}62.5%{fill:#8308FF}75%{fill:#08FF83}87.5%{fill:#363636}100%{fill:#FF0883}}@keyframes anim-gogh-bg{25%{background-color:#FF0883}37.5%{background-color:#FF8308}50%{background-color:#0883FF}62.5%{background-color:#8308FF}75%{background-color:#3dba98}87.5%{background-color:#363636}100%{background-color:#47af32}}
+:root{--color-blue: #65d8ee;--color-green: #A6E22E;--color-yellow: #E6DB74;--color-orange: #FD971F;--color-red: #F92672;--color-purple: #AE81FF;--color-cyan: #0F94CF;--color-grey-light: #E9E9E9;--color-grey-medium: #7E868C;--color-grey-dark: #333E47;--color-black: #000000;--color-white: #FFFFFF;--color-primary: var(--color-blue);--color-success: var(--color-green);--color-info: var(--color-yellow);--color-warning: var(--color-orange);--color-danger: var(--color-red)}body,html{height:100%;font-size:10px}body{color:var(--color-black);font-size:1.6rem;font-family:"Roboto",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}p{color:var(--color-black);font-weight:400;font-style:normal;font-variant:normal;font-size:1.6rem;line-height:1.4}h1{margin:0;color:var(--color-blue);font-size:4rem;line-height:1}h2{margin:0;font-size:3.1rem;line-height:1}h3{margin:0;font-size:2.5rem;line-height:1}h4{margin:0;font-size:2.2rem;line-height:1}h5{margin:0;font-size:1.9rem;line-height:1}h6{margin:0;font-size:1.6rem;line-height:1}strong{font-weight:900}small{font-size:-1.4rem}em{font-style:italic}blockquote>p{margin:1.6rem;padding:0;border-color:#ccc;border-color:rgba(0,0,0,.2);border-top:2px solid;border-bottom:2px solid;border-radius:.25em;color:#888;letter-spacing:.05em;font-style:italic;font-size:4.6rem}ol{padding:0}ol li{margin-left:1.6rem;padding:0}ul{padding:0}ul li{margin-left:1.6rem;padding:0}.center{text-align:center}.black{color:var(--color-black)}.white{color:var(--color-white)}.red{color:var(--color-red)}.yellow{color:var(--color-yellow)}.green{color:var(--color-green)}.blue{color:var(--color-blue)}.purple{color:var(--color-purple)}.orange{color:var(--color-orange)}.cyan{color:var(--color-cyan)}.grey-light{color:var(--color-grey-light)}.grey-medium{color:var(--color-grey-medium)}.grey-dark{color:var(--color-grey-dark)}.bg-black{background-color:var(--color-black)}.bg-white{background-color:var(--color-white)}.bg-red{background-color:var(--color-red)}.bg-yellow{background-color:var(--color-yellow)}.bg-green{background-color:var(--color-green)}.bg-blue{background-color:var(--color-blue)}.bg-purple{background-color:var(--color-purple)}.bg-orange{background-color:var(--color-orange)}.bg-cyan{background-color:var(--color-cyan)}.bg-grey-light{background-color:var(--color-grey-light)}.bg-grey-medium{background-color:var(--color-grey-medium)}.bg-grey-dark{background-color:var(--color-grey-dark)}.terminal{box-sizing:border-box;margin:0 0 50px;box-shadow:5px 5px 11px #737373,-5px -5px 11px #b1b1b1;animation:slideIn ease .4s forwards}.terminal .btn--terminal{display:inline-block;width:10px;height:10px;margin:0 4px;cursor:pointer;border-radius:100px;background-color:#000}.terminal .btn--min{border:1px solid #6d6d6d;background-color:#868686}.terminal .btn--max{border:1px solid #4c4c4c;background-color:#656565}.terminal .btn--close{border:1px solid #000;background-color:#171717}.terminal .cmd__cursor{animation:1s blink step-end infinite}.terminal .bar{position:relative;width:100%;height:25px;text-align:center;border-radius:5px 5px 0 0;background-color:#d9d9d9;font-size:0}.terminal .bar .bar__title{position:absolute;top:4px;right:0;left:0;margin:0 auto;color:#424242;font-family:Arial;font-size:14px;font-weight:400;line-height:1.2}.terminal .bar .bar__btns{position:absolute;top:7px;right:10px}.terminal .body{box-sizing:border-box;padding:30px;border:1px solid #d9d9d9;border-radius:0 0 5px 5px;position:relative}.terminal .body .body__txt{margin:0 0 30px;display:none}@media(min-width: 576px){.terminal .body .body__txt{display:block}}.terminal .body .body__txt p{margin:0;padding:0;font-size:20px;line-height:1.1}@media(min-width: 576px){.terminal .body .body__txt p{font-size:1.2rem}}@media(min-width: 768px){.terminal .body .body__txt p{font-size:1.4rem}}@media(min-width: 992px){.terminal .body .body__txt p{font-size:2rem}}@media(min-width: 1200px){.terminal .body .body__txt p{font-size:1.8rem}}.terminal .body .body__txt p span{letter-spacing:2px;font-size:16px}@media(min-width: 576px){.terminal .body .body__txt p span{font-size:11px}}@media(min-width: 600px){.terminal .body .body__txt p span{font-size:12px}}@media(min-width: 768px){.terminal .body .body__txt p span{letter-spacing:1px;font-size:12px}}@media(min-width: 992px){.terminal .body .body__txt p span{letter-spacing:1.5px;font-size:13px}}@media(min-width: 1200px){.terminal .body .body__txt p span{font-size:12px}}@media(min-width: 1400px){.terminal .body .body__txt p span{font-size:14px}}.terminal .body .body__bar{font-size:0}.terminal .body .body__bar span{display:inline-block;width:12.5%;height:30px}.terminal .body .body__bar--bottom{margin:0 0 30px}@keyframes blink{from,to{opacity:0}50%{opacity:1}}@keyframes slideIn{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.btn{display:inline-block;padding:.8rem 2.5rem .85rem;outline:none;border:1px solid #0d1926;border-radius:0;background-color:rgba(0,0,0,0);color:#0d1926;text-align:center;text-decoration:none;text-transform:uppercase;font-size:1.6rem;cursor:pointer;transition:all .3s ease}@media(min-width: 650px){.btn{font-size:1.4rem;padding:.57rem 1.5rem .55rem}}@media(min-width: 768px){.btn{padding:1.3rem 2.5rem .85rem}}.btn:hover{background-color:#0d1926;color:#fff}.btn:active{position:relative;top:1px}.btn:focus{box-shadow:0 1px 2px rgba(0,0,0,.2)}.gogh-header{display:flex;background-color:#0d1926;align-items:center;justify-content:center}.gogh-header h1{width:500px;text-align:center;font-size:1rem;line-height:1}.gogh-header h1 span{display:block;overflow:hidden;color:#fff;text-indent:100%;white-space:nowrap}.gogh-header h1 img{width:100%;height:auto}.gogh-content{padding:50px 0;min-height:200vh;background-color:#e7e7e7;color:#595647}.gogh-content h2{margin:0 0 25px;color:#595647;text-align:center;font-weight:700;font-size:2rem;line-height:1.2}@media(min-width: 768px){.gogh-content h2{text-align:left;font-weight:400;font-size:2.8rem;line-height:1}}@media(min-width: 450px){.gogh-content h3{font-size:2.8rem}}@media(min-width: 650px){.gogh-content h3{font-size:3.2rem}}.gogh-content h4{font-size:1.8rem}@media(min-width: 450px){.gogh-content h4{font-size:2.2rem}}@media(min-width: 650px){.gogh-content h4{font-size:2.8rem}}.gogh-content h4 span{font-weight:300;font-size:1.4rem}.gogh-content p{margin:0 0 40px;color:#595647;font-size:1.6rem;line-height:1.4}.code-wrap{position:relative;margin:0 0 40px}.code-wrap .language-bash{padding:.8rem .8rem 1.5rem}@media(min-width: 450px){.code-wrap .language-bash{padding:1.5rem 1.2rem}}.code-wrap .code-holder{position:relative}.code-wrap .btn-copy{position:absolute;right:0;bottom:0;display:inline-flex;padding:5px 10px;height:100%;background-color:#f5f2f0;cursor:pointer;transition:all .3s ease}@media(min-width: 650px){.code-wrap .btn-copy{max-width:50px}}.code-wrap .btn-copy svg{width:100%;height:auto;transition:all .3s ease;fill:#363636}.code-wrap .btn-copy:hover svg{animation-name:anim-gogh;animation-duration:8s;fill:#ff0883}.github-int{margin:0 0 40px;text-align:center}.filters{display:flex;margin:0 0 40px;justify-content:center;flex-direction:column}@media(min-width: 650px){.filters{flex-direction:row}}.filters .btn{position:relative;margin:0 0 20px 0}@media(min-width: 650px){.filters .btn{margin:0 15px}}.filters .btn:hover::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1;animation-name:anim-gogh-bg;animation-duration:8s}@media(min-width: 768px){.filters .btn::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:0;height:1px;background-color:#0d1926;content:" ";opacity:0;transition:all .3s ease}}.filters .btn.active{background-color:#0d1926;color:#e7e7e7}@media(min-width: 768px){.filters .btn.active::before{position:absolute;right:0;bottom:-10px;left:0;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1}}.filter-background{margin:0 0 70px;border:1px solid #fff}.filter-background .btn--filter-bg{position:relative;padding:0;width:5%;height:40px;border:none;cursor:pointer;transition:all .3s ease,border-radius .9s ease}.filter-background .btn--filter-bg span{position:absolute;bottom:-12px;display:none;padding:1px 3px;width:100%;border-radius:1px;background:#0d1926;color:#fff;text-align:center;text-transform:none;font-size:.6rem;transition:all .3s ease}.filter-background .btn--filter-bg:hover{z-index:20;height:40px;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}.filter-background .btn--filter-bg:hover span{display:block}.filter-background .btn--filter-bg.active{z-index:10;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}.filter-background .btn--filter-bg.active span{display:block}@media(min-width: 1400px){.gogh-terminal{margin:0 auto;max-width:96%}}@media(min-width: 1800px){.gogh-terminal{max-width:84%}}@media(min-width: 2200px){.gogh-terminal{max-width:74%}}@keyframes anim-gogh{25%{fill:#83ff08}37.5%{fill:#ff8308}50%{fill:#0883ff}62.5%{fill:#8308ff}75%{fill:#08ff83}87.5%{fill:#363636}100%{fill:#ff0883}}@keyframes anim-gogh-bg{25%{background-color:#ff0883}37.5%{background-color:#ff8308}50%{background-color:#0883ff}62.5%{background-color:#8308ff}75%{background-color:#3dba98}87.5%{background-color:#363636}100%{background-color:#47af32}}
\ No newline at end of file
diff --git a/gulpfile.js b/gulpfile.js
new file mode 100644
index 0000000..df25cdc
--- /dev/null
+++ b/gulpfile.js
@@ -0,0 +1,62 @@
+/* global $, fetch, console */
+/* eslint no-undef: "error", semi: 2 */
+
+'use strict';
+
+const {
+  src,
+  dest,
+  parallel,
+  series,
+  watch
+} = require('gulp');
+
+const htmlmin      = require('gulp-htmlmin');
+const inlinesource = require('gulp-inline-source');
+const rename       = require('gulp-rename');
+const browserSync  = require('browser-sync').create();
+const sass         = require('gulp-sass')(require('sass'));
+
+function sassCompile () {
+  return src('./sass/**/main.scss')
+    .pipe(sass({ outputStyle: 'compressed' }).on('error', sass.logError))
+    .pipe(rename('main.min.css'))
+    .pipe(dest('./css'));
+}
+
+function minify () {
+  return src('./*.src.html')
+    .pipe(inlinesource())
+    .pipe(htmlmin({
+      collapseWhitespace: true
+    }))
+    .pipe(rename('index.html'))
+    .pipe(dest('./'));
+}
+
+function serve () {
+  browserSync.init({
+    port: 8890,
+    reloadDelay: 500,
+    ui: false,
+    open: true,
+    server: {
+      baseDir: './',
+      directory: true
+    }
+  });
+}
+
+function reload (done) {
+  browserSync.reload();
+  done();
+}
+
+function watchFiles () {
+  watch(['./**/*.html', '!./index.html'], series(sassCompile, minify, reload));
+  watch(['./js/**/*.js'], series(sassCompile, minify, reload));
+  watch(['./sass/**/*.scss'], series(sassCompile, minify, reload));
+}
+
+exports.default = parallel(serve, watchFiles);
+exports.dev = parallel(serve, watchFiles);
diff --git a/index.html b/index.html
index bb03b68..f4d34d1 100644
--- a/index.html
+++ b/index.html
@@ -1 +1 @@
-<!doctype html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="Color Scheme for Terminals"><meta name="author" content="Miguel D. Quintero"><link rel="author" href="humans.txt"><title>Gogh - Color Scheme</title><link rel="icon" type="image/png" sizes="16x16" href="./favicons/favicon.png"><link rel="icon" href="favicons/favicon.ico"><link rel="preconnect" href="https://fonts.gstatic.com"><link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1.23.0/themes/prism.css"><style>@keyframes "blink"{0%,to{opacity:0}50%{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes anim-gogh{25%{fill:#83ff08}37.5%{fill:#ff8308}50%{fill:#0883ff}62.5%{fill:#8308ff}75%{fill:#08ff83}87.5%{fill:#363636}to{fill:#ff0883}}@keyframes anim-gogh-bg{25%{background-color:#ff0883}37.5%{background-color:#ff8308}50%{background-color:#0883ff}62.5%{background-color:#8308ff}75%{background-color:#3dba98}87.5%{background-color:#363636}to{background-color:#47af32}}:root{--color-blue: #65d8ee;--color-green: #A6E22E;--color-yellow: #E6DB74;--color-orange: #FD971F;--color-red: #F92672;--color-purple: #AE81FF;--color-cyan: #0F94CF;--color-grey-light: #E9E9E9;--color-grey-medium: #7E868C;--color-grey-dark: #333E47;--color-black: #000000;--color-white: #FFFFFF;--color-primary: var(--color-blue);--color-success: var(--color-green);--color-info: var(--color-yellow);--color-warning: var(--color-orange);--color-danger: var(--color-red)}body,html{height:100%;font-size:10px}body{font-family:"Roboto",sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}p{font-weight:400;font-style:normal;font-variant:normal;line-height:1.4}h1,h2,h3,h4,h5,h6{margin:0;line-height:1}h1{color:var(--color-blue);font-size:4rem}h2,h3,h4,h5,h6{font-size:3.1rem}h3,h4,h5,h6{font-size:2.5rem}h4,h5,h6{font-size:2.2rem}h5,h6{font-size:1.9rem}body,h6,p{font-size:1.6rem}strong{font-weight:900}small{font-size:-1.4rem}blockquote>p,em{font-style:italic}blockquote>p{margin:1.6rem;padding:0;border-color:#ccc;border-color:rgba(0,0,0,.2);border-top:2px solid;border-bottom:2px solid;border-radius:.25em;color:#888;letter-spacing:.05em;font-size:4.6rem}ol,ul{padding:0}ol li,ul li{margin-left:1.6rem;padding:0}.center{text-align:center}.black,body,p{color:var(--color-black)}.white{color:var(--color-white)}.red{color:var(--color-red)}.yellow{color:var(--color-yellow)}.green{color:var(--color-green)}.blue{color:var(--color-blue)}.purple{color:var(--color-purple)}.orange{color:var(--color-orange)}.cyan{color:var(--color-cyan)}.grey-light{color:var(--color-grey-light)}.grey-medium{color:var(--color-grey-medium)}.grey-dark{color:var(--color-grey-dark)}.bg-black{background-color:var(--color-black)}.bg-white{background-color:var(--color-white)}.bg-red{background-color:var(--color-red)}.bg-yellow{background-color:var(--color-yellow)}.bg-green{background-color:var(--color-green)}.bg-blue{background-color:var(--color-blue)}.bg-purple{background-color:var(--color-purple)}.bg-orange{background-color:var(--color-orange)}.bg-cyan{background-color:var(--color-cyan)}.bg-grey-light{background-color:var(--color-grey-light)}.bg-grey-medium{background-color:var(--color-grey-medium)}.bg-grey-dark{background-color:var(--color-grey-dark)}.terminal{box-sizing:border-box;margin:0 0 50px;box-shadow:5px 5px 11px #737373,-5px -5px 11px #b1b1b1;animation:slideIn ease .4s forwards}.terminal .btn--terminal{display:inline-block;width:10px;height:10px;margin:0 4px;cursor:pointer;border-radius:100px;background-color:#000}.terminal .btn--min{border:1px solid #6d6d6d;background-color:#868686}.terminal .btn--max{border:1px solid #4c4c4c;background-color:#656565}.terminal .btn--close{border:1px solid #000;background-color:#171717}.terminal .cmd__cursor{animation:1s blink step-end infinite}.terminal .bar{position:relative;width:100%;height:25px;text-align:center;border-radius:5px 5px 0 0;background-color:#d9d9d9;font-size:0}.terminal .bar .bar__title{position:absolute;top:4px;right:0;left:0;margin:0 auto;color:#424242;font-family:Arial;font-size:14px;font-weight:400;line-height:1.2}.terminal .bar .bar__btns{position:absolute;top:7px;right:10px}.terminal .body{box-sizing:border-box;padding:30px;border:1px solid #d9d9d9;border-radius:0 0 5px 5px;position:relative}.terminal .body .body__txt{margin:0 0 30px;display:none}@media (min-width:576px){.terminal .body .body__txt{display:block}}.terminal .body .body__txt p{margin:0;padding:0;font-size:20px;line-height:1.1}@media (min-width:576px){.terminal .body .body__txt p{font-size:1.2rem}}@media (min-width:768px){.terminal .body .body__txt p{font-size:1.4rem}}@media (min-width:992px){.terminal .body .body__txt p{font-size:2rem}}@media (min-width:1200px){.terminal .body .body__txt p{font-size:1.8rem}}.terminal .body .body__txt p span{letter-spacing:2px;font-size:16px}@media (min-width:768px){.terminal .body .body__txt p span{letter-spacing:1px;font-size:12px}}@media (min-width:992px){.terminal .body .body__txt p span{letter-spacing:1.5px;font-size:15px}}@media (min-width:1200px){.terminal .body .body__txt p span{font-size:10px}}.terminal .body .body__bar{font-size:0}.terminal .body .body__bar span{display:inline-block;width:12.5%;height:30px}.terminal .body .body__bar--bottom{margin:0 0 30px}.btn{display:inline-block;padding:.8rem 2.5rem .85rem;outline:0;border:1px solid #0d1926;border-radius:0;background-color:transparent;color:#0d1926;text-align:center;text-decoration:none;text-transform:uppercase;font-size:1.6rem;cursor:pointer;transition:all .3s ease}@media (min-width:650px){.btn{font-size:1.4rem;padding:.57rem 1.5rem .55rem}}@media (min-width:768px){.btn{padding:1.3rem 2.5rem .85rem}}.btn:hover{background-color:#0d1926;color:#fff}.btn:active{position:relative;top:1px}.btn:focus{box-shadow:0 1px 2px rgba(0,0,0,.2)}.gogh-header{display:flex;background-color:#0d1926;align-items:center;justify-content:center}.gogh-header h1{width:500px;text-align:center;font-size:1rem;line-height:1}.gogh-header h1 span{display:block;overflow:hidden;color:#fff;text-indent:100%;white-space:nowrap}.gogh-header h1 img{width:100%;height:auto}.gogh-content{padding:50px 0;min-height:200vh;background-color:#e7e7e7;color:#595647}.gogh-content h2{margin:0 0 25px;color:#595647;text-align:center;font-weight:700;font-size:2rem;line-height:1.2}@media (min-width:768px){.gogh-content h2{text-align:left;font-weight:400;font-size:2.8rem;line-height:1}}@media (min-width:450px){.gogh-content h3{font-size:2.8rem}}@media (min-width:650px){.gogh-content h3{font-size:3.2rem}}.gogh-content h4{font-size:1.8rem}@media (min-width:450px){.gogh-content h4{font-size:2.2rem}}@media (min-width:650px){.gogh-content h4{font-size:2.8rem}}.gogh-content h4 span{font-weight:300;font-size:1.4rem}.gogh-content p{margin:0 0 40px;color:#595647;font-size:1.6rem;line-height:1.4}.code-wrap{position:relative;margin:0 0 40px}.code-wrap .language-bash{padding:.8rem .8rem 1.5rem}@media (min-width:450px){.code-wrap .language-bash{padding:1.5rem 1.2rem}}.code-wrap .code-holder{position:relative}.code-wrap .btn-copy{position:absolute;right:0;bottom:0;display:inline-flex;padding:5px 10px;height:100%;background-color:#f5f2f0;cursor:pointer;transition:all .3s ease}@media (min-width:650px){.code-wrap .btn-copy{max-width:50px}}.code-wrap .btn-copy svg{width:100%;height:auto;transition:all .3s ease;fill:#363636}.code-wrap .btn-copy:hover svg{animation-name:anim-gogh;animation-duration:8s;fill:#ff0883}.github-int{margin:0 0 40px;text-align:center}.filters{display:flex;margin:0 0 40px;justify-content:center;flex-direction:column}@media (min-width:650px){.filters{flex-direction:row}}.filters .btn{position:relative;margin:0 0 20px}@media (min-width:650px){.filters .btn{margin:0 15px}}.filters .btn:hover::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1;animation-name:anim-gogh-bg;animation-duration:8s}@media (min-width:768px){.filters .btn::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:0;height:1px;background-color:#0d1926;content:" ";opacity:0;transition:all .3s ease}}.filters .btn.active{background-color:#0d1926;color:#e7e7e7}@media (min-width:768px){.filters .btn.active::before{position:absolute;right:0;bottom:-10px;left:0;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1}}.filter-background{margin:0 0 70px;border:1px solid #fff}.filter-background .btn--filter-bg{position:relative;padding:0;width:5%;height:40px;border:0;cursor:pointer;transition:all .3s ease,border-radius .9s ease}.filter-background .btn--filter-bg span{position:absolute;bottom:-12px;display:none;padding:1px 3px;width:100%;border-radius:1px;background:#0d1926;color:#fff;text-align:center;text-transform:none;font-size:.6rem;transition:all .3s ease}.filter-background .btn--filter-bg:hover{z-index:20;height:40px;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}.filter-background .btn--filter-bg.active span,.filter-background .btn--filter-bg:hover span{display:block}.filter-background .btn--filter-bg.active{z-index:10;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}@media (min-width:1400px){.gogh-terminal{margin:0 auto;max-width:96%}}@media (min-width:1800px){.gogh-terminal{max-width:84%}}@media (min-width:2200px){.gogh-terminal{max-width:74%}}</style></head><body><a href="https://github.com/Gogh-Co/Gogh"><img loading="lazy" width="149" height="149" style="position: absolute; top: 0; right: 0; border: 0;" src="https://github.blog/wp-content/uploads/2008/12/forkme_right_darkblue_121621.png" class="attachment-full size-full" alt="Fork me on GitHub" data-recalc-dims="1"></a><header class="gogh-header"><h1><span>Gogh </span><img src="https://raw.githubusercontent.com/Gogh-Co/Gogh/master/images/gogh/Gogh-logo-dark.png" alt=""></h1></header><div class="gogh-content"><div class="container"><div class="row"><div class="col-md-12"><h2>Color Scheme for Gnome Terminal, Pantheon Terminal, Tilix, and XFCE4&nbsp;Terminal</h2><p>Color Schemes For Ubuntu, Linux Mint, Elementary OS and all distributions that use Gnome Terminal, Pantheon Terminal, Tilix, or XFCE4 Terminal; initially inspired by Elementary OS Luna. Also works on iTerm for macOS.</p><div class="github-int"><a class="github-button" href="https://github.com/Gogh-Co/Gogh" data-color-scheme="no-preference: dark; light: light; dark: dark;" data-size="large" aria-label="Star ntkme/github-buttons on GitHub">View </a><!-- Place this tag where you want the button to render. --> <a class="github-button" href="https://github.com/Gogh-Co/Gogh" data-color-scheme="no-preference: dark; light: light; dark: dark;" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star ntkme/github-buttons on GitHub">Star</a></div><h3>Install</h3><p>Just copy and paste One line command.</p><div class="code-wrap"><h4>Linux <span>(wget)</span></h4><div class="code-holder"><pre><code class="language-bash" id="code-linux">bash -c  "$(wget -qO- https://git.io/vQgMr)" </code></pre><span class="btn-copy" data-clipboard-target="#code-linux"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="#000" width="48" height="48"><path d="M27.4,14.7l-6.1-6.1C21,8.2,20.5,8,20,8h-8c-1.1,0-2,0.9-2,2v18c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V16.1C28,15.6,27.8,15.1,27.4,14.7z M20,10l5.9,6H20V10z M12,28V10h6v6c0,1.1,0.9,2,2,2h6l0,10H12z"/><path d="M6,18H4V4c0-1.1,0.9-2,2-2h14v2H6V18z"/><rect width="32" height="32" fill="none"/></svg></span></div></div><div class="code-wrap"><h4>Mac <span>(curl)</span></h4><div class="code-holder"><pre><code class="language-bash" id="code-mac">bash -c  "$(curl -sLo- https://git.io/vQgMr)" </code></pre><span class="btn-copy" data-clipboard-target="#code-mac"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="#000" width="48" height="48"><path d="M27.4,14.7l-6.1-6.1C21,8.2,20.5,8,20,8h-8c-1.1,0-2,0.9-2,2v18c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V16.1C28,15.6,27.8,15.1,27.4,14.7z M20,10l5.9,6H20V10z M12,28V10h6v6c0,1.1,0.9,2,2,2h6l0,10H12z"/><path d="M6,18H4V4c0-1.1,0.9-2,2-2h14v2H6V18z"/><rect width="32" height="32" fill="none"/></svg></span></div></div></div></div></div><main class="gogh-terminal"><div id="js-vue-app"><div class="container"><div class="row"><div class="col-md-12"><div class="filters"><button class="btn js-btn--filter" :class="{ active: filter === 'all' }" @click="setFilter('all'); resetMenuSelected()">All</button> <button class="btn js-btn--filter" :class="{ active: filter === 'light' }" @click="setFilter('light'); resetMenuSelected()">Light Themes</button> <button class="btn js-btn--filter" :class="{ active: filter === 'dark' }" @click="setFilter('dark'); resetMenuSelected()">Dark Themes</button> <button class="btn js-btn--filter-bg" :class="{ active: selected === 'background' }" @click="getBackgrounds()">by Background</button></div></div></div><div class="row"><div class="col-md-12"><div class="filter-background js-filter-background" style="display: none;"><template v-for="item in themeBackgrounds"><button class="btn btn--filter-bg" :class="{ active: filter === item.toLowerCase() }" :style="'background-color:' + item" @click="setFilter(item)"><span>{{ item.toLowerCase() }}</span></button></template></div></div></div></div><div class="container-fluid"><div class="row justify-content-center"><template v-for="theme in themes"><div class="col-md-6 col-lg-6 col-xl-4" v-show="filter === theme.category || filter === 'all' || filter === 'background' || filter === theme.background.toLowerCase()"><div class="terminal"><div class="bar"><div class="bar__title">{{ theme.name }}</div><div class="bar__btns"><span class="btn--terminal btn--min"></span> <span class="btn--terminal btn--max"></span> <span class="btn--terminal btn--close"></span></div></div><div class="body" :style="'background-color: ' + theme.background"><div class="body__bar body__bar--top"><span :style="'background-color: ' + theme.black"></span> <span :style="'background-color: ' + theme.red"></span> <span :style="'background-color: ' + theme.green"></span> <span :style="'background-color: ' + theme.yellow"></span> <span :style="'background-color: ' + theme.blue"></span> <span :style="'background-color: ' + theme.purple"></span> <span :style="'background-color: ' + theme.cyan"></span> <span :style="'background-color: ' + theme.white"></span></div><div class="body__bar body__bar--bottom"><span :style="'background-color: ' + theme.brightBlack"></span> <span :style="'background-color: ' + theme.brightRed"></span> <span :style="'background-color: ' + theme.brightGreen"></span> <span :style="'background-color: ' + theme.brightYellow"></span> <span :style="'background-color: ' + theme.brightBlue"></span> <span :style="'background-color: ' + theme.brightPurple"></span> <span :style="'background-color: ' + theme.brightCyan"></span> <span :style="'background-color: ' + theme.brightWhite"></span></div><div class="body__txt"><p :style="'color: ' + theme.black">&block;&block;&block; <span>*** AaBbMmYyZz 01 ---</span> &block;&block;&block; <span>{{ theme.black.toLowerCase() }}</span></p><p :style="'color: ' + theme.red">&block;&block;&block; <span>*** AaBbMmYyZz 02 ---</span> &block;&block;&block; <span>{{ theme.red.toLowerCase() }}</span></p><p :style="'color: ' + theme.green">&block;&block;&block; <span>*** AaBbMmYyZz 03 ---</span> &block;&block;&block; <span>{{ theme.green.toLowerCase() }}</span></p><p :style="'color: ' + theme.yellow">&block;&block;&block; <span>*** AaBbMmYyZz 04 ---</span> &block;&block;&block; <span>{{ theme.yellow.toLowerCase() }}</span></p><p :style="'color: ' + theme.blue">&block;&block;&block; <span>*** AaBbMmYyZz 05 ---</span> &block;&block;&block; <span>{{ theme.blue.toLowerCase() }}</span></p><p :style="'color: ' + theme.purple">&block;&block;&block; <span>*** AaBbMmYyZz 06 ---</span> &block;&block;&block; <span>{{ theme.purple.toLowerCase() }}</span></p><p :style="'color: ' + theme.cyan">&block;&block;&block; <span>*** AaBbMmYyZz 07 ---</span> &block;&block;&block; <span>{{ theme.cyan.toLowerCase() }}</span></p><p :style="'color: ' + theme.white">&block;&block;&block; <span>*** AaBbMmYyZz 08 ---</span> &block;&block;&block; <span>{{ theme.white.toLowerCase() }}</span></p><br><p :style="'color: ' + theme.brightBlack">&block;&block;&block; <span>*** AaBbMmYyZz 09 ---</span> &block;&block;&block; <span>{{ theme.brightBlack.toLowerCase() }}</span></p><p :style="'color: ' + theme.brightRed">&block;&block;&block; <span>*** AaBbMmYyZz 10 ---</span> &block;&block;&block; <span>{{ theme.brightRed.toLowerCase() }}</span></p><p :style="'color: ' + theme.brightGreen">&block;&block;&block; <span>*** AaBbMmYyZz 11 ---</span> &block;&block;&block; <span>{{ theme.brightGreen.toLowerCase() }}</span></p><p :style="'color: ' + theme.brightYellow">&block;&block;&block; <span>*** AaBbMmYyZz 12 ---</span> &block;&block;&block; <span>{{ theme.brightYellow.toLowerCase() }}</span></p><p :style="'color: ' + theme.brightBlue">&block;&block;&block; <span>*** AaBbMmYyZz 13 ---</span> &block;&block;&block; <span>{{ theme.brightBlue.toLowerCase() }}</span></p><p :style="'color: ' + theme.brightPurple">&block;&block;&block; <span>*** AaBbMmYyZz 14 ---</span> &block;&block;&block; <span>{{ theme.brightPurple.toLowerCase() }}</span></p><p :style="'color: ' + theme.brightCyan">&block;&block;&block; <span>*** AaBbMmYyZz 15 ---</span> &block;&block;&block; <span>{{ theme.brightCyan.toLowerCase() }}</span></p><p :style="'color: ' + theme.brightWhite">&block;&block;&block; <span>*** AaBbMmYyZz 16 ---</span> &block;&block;&block; <span>{{ theme.brightWhite.toLowerCase() }}</span></p></div><div class="cmd"><span class="cmd__ini" :style="'color: ' + theme.foreground">$ </span><span class="cmd__sudo" :style="'color: ' + theme.red">sudo </span><span class="cmd__apt" :style="'color: ' + theme.green">apt </span><span class="cmd__install" :style="'color: ' + theme.foreground">install </span><span class="cmd__linux" :style="'color: ' + theme.foreground">linux </span><span class="cmd__cursor" :style="'color: ' + theme.foreground">|</span></div></div></div></div></template></div></div></div></main></div><script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/npm/chroma-js@2.1.1/chroma.min.js"></script><script src="https://cdn.jsdelivr.net/npm/prismjs@1.23.0/prism.min.js"></script><script src="https://cdn.jsdelivr.net/npm/prismjs@1.23.0/plugins/autoloader/prism-autoloader.min.js"></script><script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script><script src="https://cdn.jsdelivr.net/npm/shufflejs@5.3.0/dist/shuffle.min.js"></script><script src="https://cdn.jsdelivr.net/npm/axios@0.27.2/dist/axios.min.js"></script><script src="https://buttons.github.io/buttons.js" async="" defer="" id="github-bjs"></script><script src="https://unpkg.com/vue@next"></script><script>function lightOrDark(e){var t,r,s;return e.match(/^rgb/)?(t=(e=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/))[1],r=e[2],s=e[3]):(t=(e=+("0x"+e.slice(1).replace(e.length<5&&/./g,"$&$&")))>>16,r=e>>8&255,s=255&e),Math.sqrt(t*t*.299+r*r*.587+s*s*.114)>127.5?"light":"dark"}function colorDistance(e,t){for(var r=0,s=0;s<e.length;s++)r+=(e[s]-t[s])*(e[s]-t[s]);return r}function sortColors(e){for(var t=[],r=0;r<e.length;r++){t[r]=[];for(var s=0;s<r;s++)t.push([e[r],e[s],colorDistance(e[r],e[s])])}t.sort(function(e,t){return e[2]-t[2]});for(var a,o={},n=0;n<e.length;n++)o[e[n]]=[e[n]];for(var l=0;l<t.length;l++){var c=t[l][0],h=t[l][1],i=o[c],g=o[h];i&&g&&i!=g&&(c!==i[i.length-1]&&i.reverse(),h!==g[0]&&g.reverse(),i.push.apply(i,g),delete o[c],delete o[h],o[i[0]]=i,o[i[i.length-1]]=i,a=i)}return a}new ClipboardJS(".btn-copy");var $getUrl="https://raw.githubusercontent.com/Gogh-Co/Gogh/master/data/themes.json";const $app={data:()=>({themes:[],filter:"all",themeBackgrounds:null,selected:null}),created(){axios.get($getUrl).then(e=>{this.themes=e.data.themes,this.themes.forEach(e=>{e.category=lightOrDark(e.background)})})},computed:{allValues(){}},methods:{setFilter(e){this.filter="",setTimeout(()=>{this.filter=e},100)},setBackground(){this.filter="background"},getBackgrounds(){const e=this.themes.map(e=>e.background).map(e=>e.toLowerCase()),t=sortColors([...new Set(e)].map(e=>chroma(e).rgb())).map(e=>chroma(e).hex());this.themeBackgrounds=t.reverse(),this.selected="background",this.filter="background"},resetMenuSelected(){this.selected=""}}};Vue.createApp($app).mount("#js-vue-app"),$(".js-btn--filter-bg").on("click",function(){$(".js-filter-background").slideToggle()}),$(".js-btn--filter").on("click",function(){$(".js-filter-background").slideUp(400)});</script><div id="master-dev" style="display:none">4d 69 67 75 65 6c 20 44 2e 20 51 75 69 6e 74 65 72 6f 20 2d 20 6d 69 67 75 65 6c 64 61 76 69 64 71 40 67 6d 61 69 6c 2e 63 6f 6d</div></body></html>
\ No newline at end of file
+<!doctype html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="Color Scheme for Terminals"><meta name="author" content="Miguel D. Quintero"><link rel="author" href="humans.txt"><title>Gogh - Color Scheme</title><link rel="icon" type="image/png" sizes="16x16" href="./favicons/favicon.png"><link rel="icon" href="favicons/favicon.ico"><link rel="preconnect" href="https://fonts.gstatic.com"><link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1.23.0/themes/prism.css"><style>@keyframes blink{0%,to{opacity:0}50%{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes anim-gogh{25%{fill:#83ff08}37.5%{fill:#ff8308}50%{fill:#0883ff}62.5%{fill:#8308ff}75%{fill:#08ff83}87.5%{fill:#363636}to{fill:#ff0883}}@keyframes anim-gogh-bg{25%{background-color:#ff0883}37.5%{background-color:#ff8308}50%{background-color:#0883ff}62.5%{background-color:#8308ff}75%{background-color:#3dba98}87.5%{background-color:#363636}to{background-color:#47af32}}:root{--color-blue: #65d8ee;--color-green: #A6E22E;--color-yellow: #E6DB74;--color-orange: #FD971F;--color-red: #F92672;--color-purple: #AE81FF;--color-cyan: #0F94CF;--color-grey-light: #E9E9E9;--color-grey-medium: #7E868C;--color-grey-dark: #333E47;--color-black: #000000;--color-white: #FFFFFF;--color-primary: var(--color-blue);--color-success: var(--color-green);--color-info: var(--color-yellow);--color-warning: var(--color-orange);--color-danger: var(--color-red)}body,html{height:100%;font-size:10px}body{font-family:"Roboto",sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}p{font-weight:400;font-style:normal;font-variant:normal;line-height:1.4}h1,h2,h3,h4,h5,h6{margin:0;line-height:1}h1{color:var(--color-blue);font-size:4rem}h2,h3,h4,h5,h6{font-size:3.1rem}h3,h4,h5,h6{font-size:2.5rem}h4,h5,h6{font-size:2.2rem}h5,h6{font-size:1.9rem}body,h6,p{font-size:1.6rem}strong{font-weight:900}small{font-size:-1.4rem}blockquote>p,em{font-style:italic}blockquote>p{margin:1.6rem;padding:0;border-color:#ccc;border-color:rgba(0,0,0,.2);border-top:2px solid;border-bottom:2px solid;border-radius:.25em;color:#888;letter-spacing:.05em;font-size:4.6rem}ol,ul{padding:0}ol li,ul li{margin-left:1.6rem;padding:0}.center{text-align:center}.black,body,p{color:var(--color-black)}.white{color:var(--color-white)}.red{color:var(--color-red)}.yellow{color:var(--color-yellow)}.green{color:var(--color-green)}.blue{color:var(--color-blue)}.purple{color:var(--color-purple)}.orange{color:var(--color-orange)}.cyan{color:var(--color-cyan)}.grey-light{color:var(--color-grey-light)}.grey-medium{color:var(--color-grey-medium)}.grey-dark{color:var(--color-grey-dark)}.bg-black{background-color:var(--color-black)}.bg-white{background-color:var(--color-white)}.bg-red{background-color:var(--color-red)}.bg-yellow{background-color:var(--color-yellow)}.bg-green{background-color:var(--color-green)}.bg-blue{background-color:var(--color-blue)}.bg-purple{background-color:var(--color-purple)}.bg-orange{background-color:var(--color-orange)}.bg-cyan{background-color:var(--color-cyan)}.bg-grey-light{background-color:var(--color-grey-light)}.bg-grey-medium{background-color:var(--color-grey-medium)}.bg-grey-dark{background-color:var(--color-grey-dark)}.terminal{box-sizing:border-box;margin:0 0 50px;box-shadow:5px 5px 11px #737373,-5px -5px 11px #b1b1b1;animation:slideIn ease .4s forwards}.terminal .btn--terminal{display:inline-block;width:10px;height:10px;margin:0 4px;cursor:pointer;border-radius:100px;background-color:#000}.terminal .btn--min{border:1px solid #6d6d6d;background-color:#868686}.terminal .btn--max{border:1px solid #4c4c4c;background-color:#656565}.terminal .btn--close{border:1px solid #000;background-color:#171717}.terminal .cmd__cursor{animation:1s blink step-end infinite}.terminal .bar{position:relative;width:100%;height:25px;text-align:center;border-radius:5px 5px 0 0;background-color:#d9d9d9;font-size:0}.terminal .bar .bar__title{position:absolute;top:4px;right:0;left:0;margin:0 auto;color:#424242;font-family:Arial;font-size:14px;font-weight:400;line-height:1.2}.terminal .bar .bar__btns{position:absolute;top:7px;right:10px}.terminal .body{box-sizing:border-box;padding:30px;border:1px solid #d9d9d9;border-radius:0 0 5px 5px;position:relative}.terminal .body .body__txt{margin:0 0 30px;display:none}@media (min-width:576px){.terminal .body .body__txt{display:block}}.terminal .body .body__txt p{margin:0;padding:0;font-size:20px;line-height:1.1}@media (min-width:576px){.terminal .body .body__txt p{font-size:1.2rem}}@media (min-width:768px){.terminal .body .body__txt p{font-size:1.4rem}}@media (min-width:992px){.terminal .body .body__txt p{font-size:2rem}}@media (min-width:1200px){.terminal .body .body__txt p{font-size:1.8rem}}.terminal .body .body__txt p span{letter-spacing:2px;font-size:16px}@media (min-width:576px){.terminal .body .body__txt p span{font-size:11px}}@media (min-width:600px){.terminal .body .body__txt p span{font-size:12px}}@media (min-width:768px){.terminal .body .body__txt p span{letter-spacing:1px;font-size:12px}}@media (min-width:992px){.terminal .body .body__txt p span{letter-spacing:1.5px;font-size:13px}}@media (min-width:1200px){.terminal .body .body__txt p span{font-size:12px}}@media (min-width:1400px){.terminal .body .body__txt p span{font-size:14px}}.terminal .body .body__bar{font-size:0}.terminal .body .body__bar span{display:inline-block;width:12.5%;height:30px}.terminal .body .body__bar--bottom{margin:0 0 30px}.btn{display:inline-block;padding:.8rem 2.5rem .85rem;outline:0;border:1px solid #0d1926;border-radius:0;background-color:transparent;color:#0d1926;text-align:center;text-decoration:none;text-transform:uppercase;font-size:1.6rem;cursor:pointer;transition:all .3s ease}@media (min-width:650px){.btn{font-size:1.4rem;padding:.57rem 1.5rem .55rem}}@media (min-width:768px){.btn{padding:1.3rem 2.5rem .85rem}}.btn:hover{background-color:#0d1926;color:#fff}.btn:active{position:relative;top:1px}.btn:focus{box-shadow:0 1px 2px rgba(0,0,0,.2)}.gogh-header{display:flex;background-color:#0d1926;align-items:center;justify-content:center}.gogh-header h1{width:500px;text-align:center;font-size:1rem;line-height:1}.gogh-header h1 span{display:block;overflow:hidden;color:#fff;text-indent:100%;white-space:nowrap}.gogh-header h1 img{width:100%;height:auto}.gogh-content{padding:50px 0;min-height:200vh;background-color:#e7e7e7;color:#595647}.gogh-content h2{margin:0 0 25px;color:#595647;text-align:center;font-weight:700;font-size:2rem;line-height:1.2}@media (min-width:768px){.gogh-content h2{text-align:left;font-weight:400;font-size:2.8rem;line-height:1}}@media (min-width:450px){.gogh-content h3{font-size:2.8rem}}@media (min-width:650px){.gogh-content h3{font-size:3.2rem}}.gogh-content h4{font-size:1.8rem}@media (min-width:450px){.gogh-content h4{font-size:2.2rem}}@media (min-width:650px){.gogh-content h4{font-size:2.8rem}}.gogh-content h4 span{font-weight:300;font-size:1.4rem}.gogh-content p{margin:0 0 40px;color:#595647;font-size:1.6rem;line-height:1.4}.code-wrap{position:relative;margin:0 0 40px}.code-wrap .language-bash{padding:.8rem .8rem 1.5rem}@media (min-width:450px){.code-wrap .language-bash{padding:1.5rem 1.2rem}}.code-wrap .code-holder{position:relative}.code-wrap .btn-copy{position:absolute;right:0;bottom:0;display:inline-flex;padding:5px 10px;height:100%;background-color:#f5f2f0;cursor:pointer;transition:all .3s ease}@media (min-width:650px){.code-wrap .btn-copy{max-width:50px}}.code-wrap .btn-copy svg{width:100%;height:auto;transition:all .3s ease;fill:#363636}.code-wrap .btn-copy:hover svg{animation-name:anim-gogh;animation-duration:8s;fill:#ff0883}.github-int{margin:0 0 40px;text-align:center}.filters{display:flex;margin:0 0 40px;justify-content:center;flex-direction:column}@media (min-width:650px){.filters{flex-direction:row}}.filters .btn{position:relative;margin:0 0 20px}@media (min-width:650px){.filters .btn{margin:0 15px}}.filters .btn:hover::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1;animation-name:anim-gogh-bg;animation-duration:8s}@media (min-width:768px){.filters .btn::before{position:absolute;right:0;bottom:-10px;left:0;margin:0 auto;width:0;height:1px;background-color:#0d1926;content:" ";opacity:0;transition:all .3s ease}}.filters .btn.active{background-color:#0d1926;color:#e7e7e7}@media (min-width:768px){.filters .btn.active::before{position:absolute;right:0;bottom:-10px;left:0;width:100%;height:1px;background-color:#0d1926;content:" ";opacity:1}}.filter-background{margin:0 0 70px;border:1px solid #fff}.filter-background .btn--filter-bg{position:relative;padding:0;width:5%;height:40px;border:0;cursor:pointer;transition:all .3s ease,border-radius .9s ease}.filter-background .btn--filter-bg span{position:absolute;bottom:-12px;display:none;padding:1px 3px;width:100%;border-radius:1px;background:#0d1926;color:#fff;text-align:center;text-transform:none;font-size:.6rem;transition:all .3s ease}.filter-background .btn--filter-bg:hover{z-index:20;height:40px;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}.filter-background .btn--filter-bg.active span,.filter-background .btn--filter-bg:hover span{display:block}.filter-background .btn--filter-bg.active{z-index:10;border:1px solid #414141;border-radius:1px;transform:scale(1.6)}@media (min-width:1400px){.gogh-terminal{margin:0 auto;max-width:96%}}@media (min-width:1800px){.gogh-terminal{max-width:84%}}@media (min-width:2200px){.gogh-terminal{max-width:74%}}</style></head><body><a href="https://github.com/Gogh-Co/Gogh"><img loading="lazy" width="149" height="149" style="position: absolute; top: 0; right: 0; border: 0;" src="https://github.blog/wp-content/uploads/2008/12/forkme_right_darkblue_121621.png" class="attachment-full size-full" alt="Fork me on GitHub" data-recalc-dims="1"></a><header class="gogh-header"><h1><span>Gogh </span><img src="https://raw.githubusercontent.com/Gogh-Co/Gogh/master/images/gogh/Gogh-logo-dark.png" alt=""></h1></header><div class="gogh-content"><div class="container"><div class="row"><div class="col-md-12"><h2>Color Scheme for Gnome Terminal, Pantheon Terminal, Tilix, and XFCE4&nbsp;Terminal</h2><p>Color Schemes For Ubuntu, Linux Mint, Elementary OS and all distributions that use Gnome Terminal, Pantheon Terminal, Tilix, or XFCE4 Terminal; initially inspired by Elementary OS Luna. Also works on iTerm for macOS.</p><div class="github-int"><a class="github-button" href="https://github.com/Gogh-Co/Gogh" data-color-scheme="no-preference: dark; light: light; dark: dark;" data-size="large" aria-label="Star ntkme/github-buttons on GitHub">View </a><!-- Place this tag where you want the button to render. --> <a class="github-button" href="https://github.com/Gogh-Co/Gogh" data-color-scheme="no-preference: dark; light: light; dark: dark;" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star ntkme/github-buttons on GitHub">Star</a></div><h3>Install</h3><p>Just copy and paste One line command.</p><div class="code-wrap"><h4>Linux <span>(wget)</span></h4><div class="code-holder"><pre><code class="language-bash" id="code-linux">bash -c  "$(wget -qO- https://git.io/vQgMr)" </code></pre><span class="btn-copy" data-clipboard-target="#code-linux"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="#000" width="48" height="48"><path d="M27.4,14.7l-6.1-6.1C21,8.2,20.5,8,20,8h-8c-1.1,0-2,0.9-2,2v18c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V16.1C28,15.6,27.8,15.1,27.4,14.7z M20,10l5.9,6H20V10z M12,28V10h6v6c0,1.1,0.9,2,2,2h6l0,10H12z"/><path d="M6,18H4V4c0-1.1,0.9-2,2-2h14v2H6V18z"/><rect width="32" height="32" fill="none"/></svg></span></div></div><div class="code-wrap"><h4>Mac <span>(curl)</span></h4><div class="code-holder"><pre><code class="language-bash" id="code-mac">bash -c  "$(curl -sLo- https://git.io/vQgMr)" </code></pre><span class="btn-copy" data-clipboard-target="#code-mac"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="#000" width="48" height="48"><path d="M27.4,14.7l-6.1-6.1C21,8.2,20.5,8,20,8h-8c-1.1,0-2,0.9-2,2v18c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V16.1C28,15.6,27.8,15.1,27.4,14.7z M20,10l5.9,6H20V10z M12,28V10h6v6c0,1.1,0.9,2,2,2h6l0,10H12z"/><path d="M6,18H4V4c0-1.1,0.9-2,2-2h14v2H6V18z"/><rect width="32" height="32" fill="none"/></svg></span></div></div></div></div></div><main class="gogh-terminal"><div id="js-vue-app"><div class="container"><div class="row"><div class="col-md-12"><div class="filters"><button class="btn js-btn--filter" :class="{ active: filter === 'all' }" @click="setFilter('all'); resetMenuSelected()">All</button> <button class="btn js-btn--filter" :class="{ active: filter === 'light' }" @click="setFilter('light'); resetMenuSelected()">Light Themes</button> <button class="btn js-btn--filter" :class="{ active: filter === 'dark' }" @click="setFilter('dark'); resetMenuSelected()">Dark Themes</button> <button class="btn js-btn--filter-bg" :class="{ active: selected === 'background' }" @click="getBackgrounds()">by Background</button></div></div></div><div class="row"><div class="col-md-12"><div class="filter-background js-filter-background" style="display: none;"><template v-for="item in themeBackgrounds"><button class="btn btn--filter-bg" :class="{ active: filter === item.toLowerCase() }" :style="'background-color:' + item" @click="setFilter(item)"><span>{{ item.toLowerCase() }}</span></button></template></div></div></div></div><div class="container-fluid"><div class="row justify-content-center"><template v-for="theme in themes"><div class="col-md-6 col-lg-6 col-xl-4" v-show="filter === theme.category || filter === 'all' || filter === 'background' || filter === theme.background.toLowerCase()"><div class="terminal"><div class="bar"><div class="bar__title">{{ theme.name }}</div><div class="bar__btns"><span class="btn--terminal btn--min"></span> <span class="btn--terminal btn--max"></span> <span class="btn--terminal btn--close"></span></div></div><div class="body" :style="'background-color: ' + theme.background"><div class="body__bar body__bar--top"><span :style="'background-color: ' + theme.black"></span> <span :style="'background-color: ' + theme.red"></span> <span :style="'background-color: ' + theme.green"></span> <span :style="'background-color: ' + theme.yellow"></span> <span :style="'background-color: ' + theme.blue"></span> <span :style="'background-color: ' + theme.purple"></span> <span :style="'background-color: ' + theme.cyan"></span> <span :style="'background-color: ' + theme.white"></span></div><div class="body__bar body__bar--bottom"><span :style="'background-color: ' + theme.brightBlack"></span> <span :style="'background-color: ' + theme.brightRed"></span> <span :style="'background-color: ' + theme.brightGreen"></span> <span :style="'background-color: ' + theme.brightYellow"></span> <span :style="'background-color: ' + theme.brightBlue"></span> <span :style="'background-color: ' + theme.brightPurple"></span> <span :style="'background-color: ' + theme.brightCyan"></span> <span :style="'background-color: ' + theme.brightWhite"></span></div><div class="row"><div class="col-sm-6 col-md-12 col-lg-6 col-xl-6"><div class="body__txt"><p :style="'color: ' + theme.black"><span>AaBbMmYyZz - {{ theme.black.toUpperCase() }}</span></p><p :style="'color: ' + theme.red"><span>AaBbMmYyZz - {{ theme.red.toUpperCase() }}</span></p><p :style="'color: ' + theme.green"><span>AaBbMmYyZz - {{ theme.green.toUpperCase() }}</span></p><p :style="'color: ' + theme.yellow"><span>AaBbMmYyZz - {{ theme.yellow.toUpperCase() }}</span></p><p :style="'color: ' + theme.blue"><span>AaBbMmYyZz - {{ theme.blue.toUpperCase() }}</span></p><p :style="'color: ' + theme.purple"><span>AaBbMmYyZz - {{ theme.purple.toUpperCase() }}</span></p><p :style="'color: ' + theme.cyan"><span>AaBbMmYyZz - {{ theme.cyan.toUpperCase() }}</span></p><p :style="'color: ' + theme.white"><span>AaBbMmYyZz - {{ theme.white.toUpperCase() }}</span></p></div></div><div class="col-sm-6 col-md-12 col-lg-6 col-xl-6"><div class="body__txt"><p :style="'color: ' + theme.brightBlack"><span>AaBbMmYyZz - {{ theme.brightBlack.toUpperCase() }}</span></p><p :style="'color: ' + theme.brightRed"><span>AaBbMmYyZz - {{ theme.brightRed.toUpperCase() }}</span></p><p :style="'color: ' + theme.brightGreen"><span>AaBbMmYyZz - {{ theme.brightGreen.toUpperCase() }}</span></p><p :style="'color: ' + theme.brightYellow"><span>AaBbMmYyZz - {{ theme.brightYellow.toUpperCase() }}</span></p><p :style="'color: ' + theme.brightBlue"><span>AaBbMmYyZz - {{ theme.brightBlue.toUpperCase() }}</span></p><p :style="'color: ' + theme.brightPurple"><span>AaBbMmYyZz - {{ theme.brightPurple.toUpperCase() }}</span></p><p :style="'color: ' + theme.brightCyan"><span>AaBbMmYyZz - {{ theme.brightCyan.toUpperCase() }}</span></p><p :style="'color: ' + theme.brightWhite"><span>AaBbMmYyZz - {{ theme.brightWhite.toUpperCase() }}</span></p></div></div></div><div class="cmd"><span class="cmd__ini" :style="'color: ' + theme.foreground">$ </span><span class="cmd__sudo" :style="'color: ' + theme.red">sudo </span><span class="cmd__apt" :style="'color: ' + theme.green">apt </span><span class="cmd__install" :style="'color: ' + theme.foreground">install </span><span class="cmd__linux" :style="'color: ' + theme.foreground">linux </span><span class="cmd__cursor" :style="'color: ' + theme.foreground">|</span></div></div></div></div></template></div></div></div></main></div><script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/npm/chroma-js@2.1.1/chroma.min.js"></script><script src="https://cdn.jsdelivr.net/npm/prismjs@1.23.0/prism.min.js"></script><script src="https://cdn.jsdelivr.net/npm/prismjs@1.23.0/plugins/autoloader/prism-autoloader.min.js"></script><script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script><script src="https://cdn.jsdelivr.net/npm/shufflejs@5.3.0/dist/shuffle.min.js"></script><script src="https://cdn.jsdelivr.net/npm/axios@0.27.2/dist/axios.min.js"></script><script src="https://buttons.github.io/buttons.js" async="" defer="" id="github-bjs"></script><script src="https://unpkg.com/vue@next"></script><script>function lightOrDark(e){var t,r,s;return e.match(/^rgb/)?(t=(e=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/))[1],r=e[2],s=e[3]):(t=(e=+("0x"+e.slice(1).replace(e.length<5&&/./g,"$&$&")))>>16,r=e>>8&255,s=255&e),Math.sqrt(t*t*.299+r*r*.587+s*s*.114)>127.5?"light":"dark"}function colorDistance(e,t){for(var r=0,s=0;s<e.length;s++)r+=(e[s]-t[s])*(e[s]-t[s]);return r}function sortColors(e){for(var t=[],r=0;r<e.length;r++){t[r]=[];for(var s=0;s<r;s++)t.push([e[r],e[s],colorDistance(e[r],e[s])])}t.sort(function(e,t){return e[2]-t[2]});for(var a,o={},n=0;n<e.length;n++)o[e[n]]=[e[n]];for(var l=0;l<t.length;l++){var c=t[l][0],h=t[l][1],i=o[c],g=o[h];i&&g&&i!=g&&(c!==i[i.length-1]&&i.reverse(),h!==g[0]&&g.reverse(),i.push.apply(i,g),delete o[c],delete o[h],o[i[0]]=i,o[i[i.length-1]]=i,a=i)}return a}new ClipboardJS(".btn-copy");var $getUrl="https://raw.githubusercontent.com/Gogh-Co/Gogh/master/data/themes.json";const $app={data:()=>({themes:[],filter:"all",themeBackgrounds:null,selected:null}),created(){axios.get($getUrl).then(e=>{this.themes=e.data.themes,this.themes.forEach(e=>{e.category=lightOrDark(e.background)})})},computed:{allValues(){}},methods:{setFilter(e){this.filter="",setTimeout(()=>{this.filter=e},100)},setBackground(){this.filter="background"},getBackgrounds(){const e=this.themes.map(e=>e.background).map(e=>e.toLowerCase()),t=sortColors([...new Set(e)].map(e=>chroma(e).rgb())).map(e=>chroma(e).hex());this.themeBackgrounds=t.reverse(),this.selected="background",this.filter="background"},resetMenuSelected(){this.selected=""}}};Vue.createApp($app).mount("#js-vue-app"),$(".js-btn--filter-bg").on("click",function(){$(".js-filter-background").slideToggle()}),$(".js-btn--filter").on("click",function(){$(".js-filter-background").slideUp(400)});</script><div id="master-dev" style="display:none">4d 69 67 75 65 6c 20 44 2e 20 51 75 69 6e 74 65 72 6f 20 2d 20 6d 69 67 75 65 6c 64 61 76 69 64 71 40 67 6d 61 69 6c 2e 63 6f 6d</div></body></html>
\ No newline at end of file
diff --git a/index.src.html b/index.src.html
index 5f67252..1051fde 100644
--- a/index.src.html
+++ b/index.src.html
@@ -187,58 +187,68 @@
                                             <span :style="'background-color: ' + theme.brightWhite"></span>
                                         </div>
 
-                                        <div class="body__txt">
-                                            <p :style="'color: ' + theme.black">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 01 ---</span>  &block;&block;&block; <span> {{ theme.black.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.red">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 02 ---</span>  &block;&block;&block; <span> {{ theme.red.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.green">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 03 ---</span>  &block;&block;&block; <span> {{ theme.green.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.yellow">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 04 ---</span>  &block;&block;&block; <span> {{ theme.yellow.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.blue">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 05 ---</span>  &block;&block;&block; <span> {{ theme.blue.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.purple">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 06 ---</span>  &block;&block;&block; <span> {{ theme.purple.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.cyan">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 07 ---</span>  &block;&block;&block; <span> {{ theme.cyan.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.white">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 08 ---</span>  &block;&block;&block; <span> {{ theme.white.toLowerCase() }}</span>
-                                            </p>
-                                            <br>
-                                            <p :style="'color: ' + theme.brightBlack">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 09 ---</span>  &block;&block;&block; <span> {{ theme.brightBlack.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.brightRed">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 10 ---</span>  &block;&block;&block; <span> {{ theme.brightRed.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.brightGreen">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 11 ---</span>  &block;&block;&block; <span> {{ theme.brightGreen.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.brightYellow">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 12 ---</span>  &block;&block;&block; <span> {{ theme.brightYellow.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.brightBlue">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 13 ---</span>  &block;&block;&block; <span> {{ theme.brightBlue.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.brightPurple">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 14 ---</span>  &block;&block;&block; <span> {{ theme.brightPurple.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.brightCyan">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 15 ---</span>  &block;&block;&block; <span> {{ theme.brightCyan.toLowerCase() }}</span>
-                                            </p>
-                                            <p :style="'color: ' + theme.brightWhite">
-                                                 &block;&block;&block; <span>*** AaBbMmYyZz 16 ---</span>  &block;&block;&block; <span> {{ theme.brightWhite.toLowerCase() }}</span>
-                                            </p>
+                                        <div class="row">
+                                            <div class="col-sm-6 col-md-12 col-lg-6 col-xl-6">
+                                                <div class="body__txt">
+                                                    <p :style="'color: ' + theme.black">
+                                                        <span> AaBbMmYyZz - {{ theme.black.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.red">
+                                                        <span> AaBbMmYyZz - {{ theme.red.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.green">
+                                                        <span> AaBbMmYyZz - {{ theme.green.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.yellow">
+                                                        <span> AaBbMmYyZz - {{ theme.yellow.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.blue">
+                                                        <span> AaBbMmYyZz - {{ theme.blue.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.purple">
+                                                        <span> AaBbMmYyZz - {{ theme.purple.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.cyan">
+                                                        <span> AaBbMmYyZz - {{ theme.cyan.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.white">
+                                                        <span> AaBbMmYyZz - {{ theme.white.toUpperCase() }}</span>
+                                                    </p>
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6 col-md-12 col-lg-6 col-xl-6">
+                                                <div class="body__txt">
+                                                    <p :style="'color: ' + theme.brightBlack">
+                                                        <span> AaBbMmYyZz - {{ theme.brightBlack.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.brightRed">
+                                                        <span> AaBbMmYyZz - {{ theme.brightRed.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.brightGreen">
+                                                        <span> AaBbMmYyZz - {{ theme.brightGreen.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.brightYellow">
+                                                        <span> AaBbMmYyZz - {{ theme.brightYellow.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.brightBlue">
+                                                        <span> AaBbMmYyZz - {{ theme.brightBlue.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.brightPurple">
+                                                        <span> AaBbMmYyZz - {{ theme.brightPurple.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.brightCyan">
+                                                        <span> AaBbMmYyZz - {{ theme.brightCyan.toUpperCase() }}</span>
+                                                    </p>
+                                                    <p :style="'color: ' + theme.brightWhite">
+                                                        <span> AaBbMmYyZz - {{ theme.brightWhite.toUpperCase() }}</span>
+                                                    </p>
+                                                </div>
+                                            </div>
                                         </div>
 
+
+
+
                                         <div class="cmd">
                                             <span class="cmd__ini" :style="'color: ' + theme.foreground">$ </span>
                                             <span class="cmd__sudo" :style="'color: ' + theme.red">sudo </span>
diff --git a/js/main.js b/js/main.js
index e46d8ae..209b33d 100644
--- a/js/main.js
+++ b/js/main.js
@@ -118,6 +118,7 @@ function sortColors (colors) {
  */
 
 var $getUrl = 'https://raw.githubusercontent.com/Gogh-Co/Gogh/master/data/themes.json';
+// var $getUrl = '../data/themes.json';
 
 const $app = {
   data () {
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..a005496
--- /dev/null
+++ b/package.json
@@ -0,0 +1,22 @@
+{
+  "name": "gogh",
+  "version": "1.0.0",
+  "description": "",
+  "main": "",
+  "scripts": {
+    "dev": "gulp dev"
+  },
+  "author": "",
+  "license": "",
+  "homepage": "",
+  "dependencies": {
+    "browser-sync": "^2.27.12",
+    "compass-mixins": "^0.12.12",
+    "gulp": "^4.0.2",
+    "gulp-htmlmin": "^5.0.1",
+    "gulp-inline-source": "^4.0.0",
+    "gulp-rename": "^2.0.0",
+    "gulp-sass": "^5.1.0",
+    "sass": "^1.58.3"
+  }
+}
diff --git a/sass/terminal.scss b/sass/terminal.scss
index 07956f0..854e0a8 100644
--- a/sass/terminal.scss
+++ b/sass/terminal.scss
@@ -124,8 +124,12 @@
           font-size     : 16px;
           @include m360 {}
           @include m450 {}
-          @include m576 {}
-          @include m600 {}
+          @include m576 {
+            font-size     : 11px;
+          }
+          @include m600 {
+            font-size     : 12px;
+          }
           @include m768 {
             letter-spacing: 1px;
             font-size     : 12px;
@@ -133,12 +137,14 @@
           @include m900 {}
           @include m992 {
             letter-spacing: 1.5px;
-            font-size     : 15px;
+            font-size     : 13px;
           }
           @include m1200 {
-            font-size: 10px;
+            font-size: 12px;
+          }
+          @include m1400 {
+            font-size: 14px;
           }
-          @include m1400 {}
           @include m1800 {}
           @include m2200 {}
         }
@@ -161,7 +167,7 @@
   }
 }
 
-@keyframes "blink" {
+@keyframes blink {
   from,
   to {
     opacity: 0;