Additions

package-lock.json

@@ -3545,11 +3545,6 @@
       "integrity": "sha512-ZIzRpLJrOj7jjP2miAtgqIfmzbxa4ZOr5jJc601zklsfEx9oTzmmj2nVpIPRpNlRTIh8lc1kyViIY7BWSGNmKw==",
       "dev": true
     },
-    "devicons": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/devicons/-/devicons-1.8.0.tgz",
-      "integrity": "sha1-33JaiwrCzOJMdLeCwvFPi3ODLC0="
-    },
     "diffie-hellman": {
       "version": "5.0.3",
       "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
@@ -11240,6 +11235,11 @@
         }
       }
     },
+    "spectre.css": {
+      "version": "0.5.8",
+      "resolved": "https://registry.npmjs.org/spectre.css/-/spectre.css-0.5.8.tgz",
+      "integrity": "sha512-3N4WocWY+Dl6b3e5v3nsZYyp+VSDcBfGDzyyHw/H78ie9BoAhHkxmrhLxo9y8RadxYzVrPjfPdlev3hXEUzR2w=="
+    },
     "split-string": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
@@ -12420,11 +12420,6 @@
         "vue-style-loader": "^4.1.0"
       }
     },
-    "vue-router": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.6.tgz",
-      "integrity": "sha512-GYhn2ynaZlysZMkFE5oCHRUTqE8BWs/a9YbKpNLi0i7xD6KG1EzDqpHQmv1F5gXjr8kL5iIVS8EOtRaVUEXTqA=="
-    },
     "vue-style-loader": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",

package.json

@@ -27,23 +27,22 @@
   },
   "dependencies": {
     "codemirror": "^5.53.2",
-    "devicons": "^1.8.0",
     "knex": "^0.21.1",
     "material-design-icons": "^3.0.1",
     "source-map-support": "^0.5.16",
+    "spectre.css": "^0.5.8",
     "vue-i18n": "^8.17.4",
-    "vue-router": "^3.1.6",
     "vuex": "^3.3.0",
     "vuex-persist": "^2.2.0"
   },
   "devDependencies": {
+    "babel-eslint": "^10.1.0",
     "electron": "^8.2.4",
     "electron-builder": "^22.4.1",
     "electron-devtools-installer": "^3.0.0",
     "electron-webpack": "^2.8.2",
     "electron-webpack-vue": "^2.4.0",
     "eslint": "^6.8.0",
-    "babel-eslint": "^10.1.0",
     "eslint-config-standard": "^14.1.1",
     "eslint-plugin-import": "^2.20.1",
     "eslint-plugin-node": "^11.1.0",

src/main/index.js

@@ -13,8 +13,10 @@ let mainWindow;
 
 function createMainWindow () {
    const window = new BrowserWindow({
-      width: 1024,
+      width: 1200,
-      height: 800,
+      height: 900,
+      minHeight: 550,
+      minWidth: 450,
       title: 'Antares',
       autoHideMenuBar: true,
       icon: path.join(__static, 'logo-32.png'),

src/renderer/App.vue

@@ -1,37 +1,51 @@
 <template>
    <div id="wrapper">
-      <!-- <TheHeader @toggleSidebar="toggleSidebar" /> -->
+      <!-- <TheHeader /> -->
-      <!-- <TheSidebar /> -->
+      <TheSettingBar />
-      <div id="main-content">
+      <TheExploreBar />
+      <div id="main-content" class="container">
          <!-- <BaseLoaderLayer
             id="main-loader"
             :is-loading="isLoading"
          /> -->
-         <QueryEditor v-model="query" />
+         <TheAppWelcome @newConn="showNewConnModal" />
       </div>
-      <!-- <TheFooter /> -->
+      <TheFooter />
+      <NewConnectionModal :is-opened="isNewConnModal" />
    </div>
 </template>
 
 <script>
-import QueryEditor from '@/components/QueryEditor';
+import { mapActions, mapState } from 'vuex';
+import TheSettingBar from '@/components/TheSettingBar';
+import TheExploreBar from '@/components/TheExploreBar';
+import TheFooter from '@/components/TheFooter';
+import TheAppWelcome from '@/components/TheAppWelcome';
+import NewConnectionModal from '@/components/NewConnectionModal';
 
 export default {
    name: 'App',
    components: {
-      QueryEditor
+      TheSettingBar,
+      TheExploreBar,
+      TheFooter,
+      TheAppWelcome,
+      NewConnectionModal
    },
    data () {
       return {
-         query: ''
       };
    },
    computed: {
-      isLoading () {
+      ...mapState({
-         return this.$store.state.application.isLoading;
+         isLoading: state => state.application.isLoading,
-      }
+         isNewConnModal: state => state.connections.isNewConnModal
+      })
    },
    methods: {
+      ...mapActions({
+         showNewConnModal: 'connections/showNewConnModal'
+      })
    }
 };
 </script>
@@ -40,6 +54,15 @@ export default {
    html,
    body{
       height: 100%;
-      background: #fff;
+   }
+
+   #wrapper{
+      display: flex;
+      height: 100vh;
+      position: relative;
+   }
+
+   #main-content{
+      /* background: #232524; */
    }
 </style>

src/renderer/components/NewConnectionModal.vue

@@ -0,0 +1,49 @@
+<template>
+   <div class="modal" :class="{'active': isOpened}">
+      <a class="modal-overlay c-hand" @click="closeModal" />
+      <div class="modal-container">
+         <div class="modal-header">
+            <a class="btn btn-clear float-right c-hand" @click="closeModal" />
+            <div class="modal-title h5">
+               Create a new connection
+            </div>
+         </div>
+         <div class="modal-body">
+            <div class="content">
+               <!-- content here -->
+            </div>
+         </div>
+         <div class="modal-footer">
+            ...
+         </div>
+      </div>
+   </div>
+</template>
+
+<script>
+import { mapActions } from 'vuex';
+
+export default {
+   name: 'NewConnectionModal',
+   props: {
+      isOpened: {
+         type: Boolean,
+         default: false
+      }
+   },
+   data () {
+      return {
+
+      };
+   },
+   methods: {
+      ...mapActions({
+         closeModal: 'connections/hideNewConnModal'
+      })
+   }
+};
+</script>
+
+<style>
+
+</style>

src/renderer/components/QueryEditor.vue

@@ -69,4 +69,7 @@ export default {
 </script>
 
 <style scoped>
+   .editor-wrapper{
+      border-bottom: 1px solid #444444;
+   }
 </style>

src/renderer/components/TheAppWelcome.vue

@@ -0,0 +1,35 @@
+<template>
+   <div class="empty text-light">
+      <div class="empty-icon">
+         <i class="material-icons md-48">mood</i>
+      </div>
+      <p class="empty-title h5">
+         Welcome to Antares SQL Client!
+      </p>
+      <p class="empty-subtitle">
+         Your first step: create a new database connection.
+      </p>
+      <div class="empty-action">
+         <button class="btn btn-primary" @click="$emit('newConn')">
+            Create connection
+         </button>
+      </div>
+   </div>
+</template>
+
+<script>
+export default {
+   name: 'TheAppWelcome'
+};
+</script>
+
+<style scoped>
+   .empty{
+      height: 100%;
+      border-radius: 0;
+      background: transparent;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+   }
+</style>

src/renderer/components/TheExploreBar.vue

@@ -0,0 +1,26 @@
+<template>
+   <div id="explorebar" class="container">
+      <!-- aaa -->
+   </div>
+</template>
+
+<script>
+export default {
+   name: 'TheExploreBar'
+
+};
+</script>
+
+<style lang="scss">
+   #explorebar{
+      width: $explorebar-width;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+      align-items: center;
+      background: #272727;
+      margin-bottom: $footer-height;
+      box-shadow: 0 0 1px 0px #000;
+      z-index: 8;
+   }
+</style>

src/renderer/components/TheFooter.vue

@@ -0,0 +1,55 @@
+<template>
+   <div id="footer" class="text-light">
+      <div class="footer-left-elements">
+         <ul class="footer-elements">
+            <li class="footer-element">
+               <i class="material-icons md-18">memory</i>
+            </li>
+         </ul>
+      </div>
+
+      <div class="footer-right-elements">
+         <ul class="footer-elements">
+            <li class="footer-element">
+               <i class="material-icons md-18">favorite</i>
+            </li>
+            <li class="footer-element">
+               <i class="material-icons md-18">info_outline</i>
+            </li>
+         </ul>
+      </div>
+   </div>
+</template>
+
+<script>
+
+export default {
+
+};
+</script>
+
+<style lang="scss">
+   #footer{
+      height: $footer-height;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      background: $primary-color;
+      padding: 0 .2rem;
+      position: fixed;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      box-shadow: 0 0 1px 0px #000;
+
+      .footer-elements{
+         list-style: none;
+         margin: 0;
+         display: flex;
+
+         .footer-element{
+            padding: 0 .4rem;
+         }
+      }
+   }
+</style>

src/renderer/components/TheSettingBar.vue

@@ -0,0 +1,57 @@
+<template>
+   <div id="settingbar" class="container">
+      <div class="settingbar-top-elements">
+         <ul class="settingbar-elements">
+            <li
+               class="settingbar-element btn btn-link tooltip tooltip-right"
+               data-tooltip="Add connection"
+               @click="showNewConnModal"
+            >
+               <i class="material-icons text-light">add</i>
+            </li>
+         </ul>
+      </div>
+
+      <div class="settingbar-bottom-elements">
+         <ul class="settingbar-elements">
+            <li class="settingbar-element btn btn-link tooltip tooltip-right" data-tooltip="Settings">
+               <i class="material-icons text-light">settings</i>
+            </li>
+         </ul>
+      </div>
+   </div>
+</template>
+
+<script>
+import { mapActions } from 'vuex';
+
+export default {
+   name: 'TheSettingBar',
+   methods: {
+      ...mapActions({
+         showNewConnModal: 'connections/showNewConnModal'
+      })
+   }
+};
+</script>
+
+<style lang="scss">
+   #settingbar{
+      width: $settingbar-width;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      align-items: center;
+      background: #3f3f3f;
+      padding: .5rem 0;
+      margin-bottom: $footer-height;
+      box-shadow: 0 0 1px 0px #000;
+      z-index: 9;
+
+      .settingbar-elements{
+         list-style: none;
+         padding: 0;
+         margin: 0;
+      }
+   }
+</style>

src/renderer/main.js

@@ -2,18 +2,15 @@
 
 import Vue from 'vue';
 
-import 'devicons/css/devicons.min.css';
 import 'material-design-icons/iconfont/material-icons.css';
 import '@/scss/main.scss';
 
 import App from '@/App.vue';
 import store from '@/store';
-import router from '@/routes';
 
 Vue.config.productionTip = false;
 
 new Vue({
    render: h => h(App),
-   store,
+   store
-   router
 }).$mount('#app');

src/renderer/routes/index.js

@@ -1,10 +0,0 @@
-import Vue from 'vue';
-import Router from 'vue-router';
-
-Vue.use(Router);
-
-const router = new Router({
-   routes: []
-});
-
-export default router;

src/renderer/scss/_mdi-additions.scss

@@ -0,0 +1,16 @@
+
+.material-icons{// TODO: rewrite with rem
+   /* Rules for sizing the icon. */
+   &.md-18 { font-size: 18px; }
+   &.md-24 { font-size: 24px; }
+   &.md-36 { font-size: 36px; }
+   &.md-48 { font-size: 48px; }
+   
+   /* Rules for using icons as black on a light background. */
+   &.md-dark { color: rgba(0, 0, 0, 0.54); }
+   &.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }
+   
+   /* Rules for using icons as white on a dark background. */
+   &.md-light { color: rgba(255, 255, 255, 1); }
+   &.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }
+}

src/renderer/scss/_variables.scss

@@ -0,0 +1,9 @@
+/*Colors*/
+$body-bg: #232524;
+$primary-color: #e36929;
+$bg-color: #232524;
+
+/*Sizes*/
+$settingbar-width: 4rem;
+$explorebar-width: 16rem;
+$footer-height: 1.5rem;

src/renderer/scss/main.scss

@@ -1 +1,3 @@
 @import "variables";
+@import "mdi-additions";
+@import "~spectre.css/src/spectre";

src/renderer/store/index.js

@@ -4,12 +4,14 @@ import Vue from 'vue';
 import Vuex from 'vuex';
 
 import application from './modules/application.store';
+import connections from './modules/connections.store';
 
 Vue.use(Vuex);
 
 export default new Vuex.Store({
    strict: true,
    modules: {
-      application
+      application,
+      connections
    }
 });

src/renderer/store/modules/connections.store.js

@@ -0,0 +1,26 @@
+'use strict';
+
+export default {
+   namespaced: true,
+   strict: true,
+   state: {
+      connections: [],
+      isNewConnModal: false
+   },
+   mutations: {
+      showNewConnModal (state) {
+         state.isNewConnModal = true;
+      },
+      hideNewConnModal (state) {
+         state.isNewConnModal = false;
+      }
+   },
+   actions: {
+      showNewConnModal ({ commit }) {
+         commit('showNewConnModal');
+      },
+      hideNewConnModal ({ commit }) {
+         commit('hideNewConnModal');
+      }
+   }
+};

static/logo.svg

@@ -1,122 +1 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 210 210" height="210mm" width="210mm"><path d="M180.088 107.51a72.967 69.474 0 01-72.858 69.473 72.967 69.474 0 01-73.075-69.266 72.967 69.474 0 0172.639-69.68 72.967 69.474 0 0173.292 69.056" fill="#e36929"/><path d="M82.985 102.48a17.02 21.735 21.455 01-23.767 14.012 17.02 21.735 21.455 01-7.938-26.403 17.02 21.735 21.455 0123.744-14.091 17.02 21.735 21.455 018.009 26.36M157.83 118.562a17.472 11.51-52.488 01-1.695 20.917 17.472 11.51-52.488 01-19.742 6.678 17.472 11.51-52.488 011.635-20.897 17.472 11.51-52.488 0119.747-6.74" fill="#f8d163"/><path d="M72.979 98.717a9.143 10.562 0 01-9.13 10.562 9.143 10.562 0 01-9.156-10.53 9.143 10.562 0 019.102-10.594 9.143 10.562 0 019.184 10.499M155.659 130.732a6.21 6.986 0 01-6.2 6.987 6.21 6.986 0 01-6.22-6.966 6.21 6.986 0 016.182-7.007 6.21 6.986 0 016.238 6.945" fill="#fbfcf7"/></svg>
-<svg
-   xmlns:dc="http://purl.org/dc/elements/1.1/"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   sodipodi:docname="logo.svg"
-   inkscape:version="1.0beta2 (6465177, 2020-02-22)"
-   id="svg8"
-   version="1.1"
-   viewBox="0 0 210 210"
-   height="210mm"
-   width="210mm">
-  <defs
-     id="defs2" />
-  <sodipodi:namedview
-     inkscape:window-maximized="1"
-     inkscape:window-y="-8"
-     inkscape:window-x="1912"
-     inkscape:window-height="1027"
-     inkscape:window-width="2560"
-     showgrid="false"
-     inkscape:document-rotation="0"
-     inkscape:current-layer="layer1"
-     inkscape:document-units="mm"
-     inkscape:cy="560"
-     inkscape:cx="1016.1027"
-     inkscape:zoom="0.34085227"
-     inkscape:pageshadow="2"
-     inkscape:pageopacity="0.0"
-     borderopacity="1.0"
-     bordercolor="#666666"
-     pagecolor="#ffffff"
-     id="base" />
-  <metadata
-     id="metadata5">
-    <rdf:RDF>
-      <cc:Work
-         rdf:about="">
-        <dc:format>image/svg+xml</dc:format>
-        <dc:type
-           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-        <dc:title></dc:title>
-      </cc:Work>
-    </rdf:RDF>
-  </metadata>
-  <g
-     id="layer1"
-     inkscape:groupmode="layer"
-     inkscape:label="Livello 1">
-    <path
-       d="m 180.08778,107.50931 a 72.966606,69.473518 0 0 1 -72.8574,69.47344 72.966606,69.473518 0 0 1 -73.075482,-69.26549 72.966606,69.473518 0 0 1 72.638672,-69.68077 72.966606,69.473518 0 0 1 73.29291,69.05692"
-       sodipodi:arc-type="arc"
-       sodipodi:open="true"
-       sodipodi:end="6.2771988"
-       sodipodi:start="0"
-       sodipodi:ry="69.473518"
-       sodipodi:rx="72.966606"
-       sodipodi:cy="107.50931"
-       sodipodi:cx="107.12118"
-       sodipodi:type="arc"
-       id="path833"
-       style="fill:#e36929;stroke-width:0.264583" />
-    <path
-       transform="rotate(21.455477)"
-       d="M 114.71945,65.023537 A 17.020103,21.734734 0 0 1 97.724821,86.758246 17.020103,21.734734 0 0 1 80.679321,65.088594 17.020103,21.734734 0 0 1 97.62293,43.289022 a 17.020103,21.734734 0 0 1 17.09622,21.6044"
-       sodipodi:arc-type="arc"
-       sodipodi:open="true"
-       sodipodi:end="6.2771988"
-       sodipodi:start="0"
-       sodipodi:ry="21.734734"
-       sodipodi:rx="17.020103"
-       sodipodi:cy="65.023537"
-       sodipodi:cx="97.699348"
-       sodipodi:type="arc"
-       id="path837"
-       style="fill:#f8d163;stroke-width:0.264583" />
-    <path
-       transform="matrix(0.61426493,-0.78909986,0.78366492,0.62118378,0,0)"
-       d="m 5.1281939,197.37967 a 17.471313,11.511373 0 0 1 -17.4451659,11.51136 17.471313,11.511373 0 0 1 -17.497383,-11.4769 17.471313,11.511373 0 0 1 17.392792,-11.54572 17.471313,11.511373 0 0 1 17.5494438,11.44235"
-       sodipodi:arc-type="arc"
-       sodipodi:open="true"
-       sodipodi:end="6.2771988"
-       sodipodi:start="0"
-       sodipodi:ry="11.511373"
-       sodipodi:rx="17.471313"
-       sodipodi:cy="197.37967"
-       sodipodi:cx="-12.34312"
-       sodipodi:type="arc"
-       id="path839"
-       style="fill:#f8d163;stroke-width:0.212318" />
-    <path
-       d="M 72.978744,98.717255 A 9.1426954,10.561994 0 0 1 63.849731,109.27924 9.1426954,10.561994 0 0 1 54.693394,98.748869 9.1426954,10.561994 0 0 1 63.794999,88.155367 9.1426954,10.561994 0 0 1 72.97858,98.654026"
-       sodipodi:arc-type="arc"
-       sodipodi:open="true"
-       sodipodi:end="6.2771988"
-       sodipodi:start="0"
-       sodipodi:ry="10.561994"
-       sodipodi:rx="9.1426954"
-       sodipodi:cy="98.717255"
-       sodipodi:cx="63.836048"
-       sodipodi:type="arc"
-       id="path841"
-       style="fill:#fbfcf7;stroke-width:0.264583" />
-    <path
-       d="m 155.65887,130.73247 a 6.2099242,6.9861641 0 0 1 -6.20063,6.98615 6.2099242,6.9861641 0 0 1 -6.21919,-6.96524 6.2099242,6.9861641 0 0 1 6.18201,-7.00701 6.2099242,6.9861641 0 0 1 6.2377,6.94428"
-       sodipodi:arc-type="arc"
-       sodipodi:open="true"
-       sodipodi:end="6.2771988"
-       sodipodi:start="0"
-       sodipodi:ry="6.9861641"
-       sodipodi:rx="6.2099242"
-       sodipodi:cy="130.73247"
-       sodipodi:cx="149.44894"
-       sodipodi:type="arc"
-       id="path843"
-       style="fill:#fbfcf7;stroke-width:0.264583" />
-  </g>
-</svg>

static/svg/database.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path fill="#444" d="M16 27.534c-5.323 0-9.641-1.44-9.641-3.214v-3.214c0-.279.14-.545.341-.803 1.075 1.384 4.813 2.41 9.301 2.41s8.226-1.026 9.301-2.41c.201.259.34.524.34.803v3.214c0 1.773-4.318 3.214-9.641 3.214zm0-6.428c-5.323 0-9.641-1.441-9.641-3.214v-3.214c0-.17.064-.336.151-.5.049-.103.113-.204.19-.304 1.075 1.383 4.813 2.41 9.301 2.41s8.226-1.027 9.301-2.41c.077.1.141.201.19.304.086.164.151.33.151.5v3.214c0 1.773-4.318 3.214-9.641 3.214zm0-6.427c-5.323 0-9.641-1.44-9.641-3.214V9.858 8.251c0-1.774 4.318-3.214 9.641-3.214s9.641 1.44 9.641 3.214v3.214c0 1.774-4.318 3.214-9.641 3.214zm0-8.034c-3.55 0-6.427.718-6.427 1.607S12.451 9.859 16 9.859c3.55 0 6.427-.718 6.427-1.607S19.549 6.645 16 6.645z"/></svg>

static/svg/mariadb.svg

@@ -1 +1 @@
-<svg height="64" viewBox="0 0 45.025 44.217" width="64" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h191.356v57.344h-191.356z"/></clipPath><path clip-path="url(#a)" d="m75.198 5.328c-1.872.047-2.977.863-3.34 2.42.48.418 1.126.6 1.77.572 1.415-.06 2.817-1.138 2.42-2.965-.298-.025-.582-.035-.85-.027m9.642-5.328h-.167c-1.335.043-1.542.767-4.425 1.477-2.912.717-5.725.028-8.86 1.344-9.363 3.927-11.358 17.472-19.868 22.279-6.36 3.593-12.512 5.188-18.28 6.995-3.792 1.188-7.552 2.556-10.988 5.516-2.667 2.3-3.4 4.085-6.177 6.97-2.835 2.933-11.553-2.258-15.8 1.54a.84.84 0 0 0 .014 1.253c.92.805 2.67 2.722 4.336 3.314-.528 1-3.513 3.946-2.904 5.42.64 1.55 8.04.497 14.88-3.633 3.185-1.924 5.723-4.696 10.685-5.357 6.42-.855 13.817.55 21.25 1.62-1.103 3.286-3.315 5.473-5.088 8.1-.55.592 1.103.658 2.986.3 3.4-.838 5.832-1.513 8.4-3 3.143-1.83 3.62-6.52 7.474-7.534 1.864 2.865 6.5 3.83 10.074 2.3.198-.084.392-.177.582-.275.43-.375.178-.813-.086-1.135a6.21 6.21 0 0 1 -.362-.364c-2.012-2.162-2.472-7.266-1.58-9.748 1.017-2.824 2.022-7.343 3.046-11.075 1.1-4 1.506-9.063 2.837-11.106 2.002-3.072 4.215-4.127 6.136-5.86s3.68-3.42 3.62-7.384c-.028-1.223-.629-1.927-1.735-1.957m.204 4.163c-.397 2.734-2.144 4.237-4.208 5.687-1.8 1.27-3.794 2.493-5.07 4.477-1.305 2.03-2.134 8.985-4.16 15.852-1.68 5.698-4.184 11.335-8.467 14.05-.278.176-.645.015-.704-.3-.3-1.592-.24-4.5-.734-3.56-.62 1.77-1.322 3.458-2.143 5.027-2.52 4.816-6.166 8.505-12.057 9.95a.53.53 0 0 1 -.552-.82c2.718-3.77 5.15-7.825 5.447-14.014.025-.534-.646-.778-.983-.364-1.284 1.583-1.6 5.347-3.477 6.506-1.474.16-2.967.16-4.47.07-6.17-.37-12.502-2.226-18.274-.373-3.93 1.262-8.057 4.85-11.386 6.293-3.912 1.686-5.766 3.286-10.706 3.176-.505-.68 2.062-3.623 2.934-4.893.278-.407-.317-.835-.874-1.1-1.338-.614-2.68-2.28-4.107-2.93.183-.337.83-.674 1.187-.88 3.24-1.88 11.832 2.124 14.14-.143 1.425-1.398 2.385-2.626 3.353-4.05.94-1.38 2.368-2.838 3.847-4.047a31.3 31.3 0 0 1 1.94-1.435c2.52-1.724 3.907-1.852 7.17-3.064 4.152-1.544 9.293-2.898 13.747-4.6 2.752-1.053 5.744-2.35 8.183-4.17.58-.432 1.127-.893 1.634-1.386 6.964-6.8 8.345-18.766 19.2-19.882 1.314-.135 2.248-.192 3.228-.223 1.096-.03 2.18-.3 3.263-.818.334-.146 2.324-1.35 2.996-.768.448.388.115 2.492.086 2.72" fill="#444b5e" transform="matrix(.52012 0 0 .52012 0 7.19564)"/></svg>
+<svg height="32" viewBox="0 0 45.025 44.217" width="32" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h191.356v57.344h-191.356z"/></clipPath><path clip-path="url(#a)" d="m75.198 5.328c-1.872.047-2.977.863-3.34 2.42.48.418 1.126.6 1.77.572 1.415-.06 2.817-1.138 2.42-2.965-.298-.025-.582-.035-.85-.027m9.642-5.328h-.167c-1.335.043-1.542.767-4.425 1.477-2.912.717-5.725.028-8.86 1.344-9.363 3.927-11.358 17.472-19.868 22.279-6.36 3.593-12.512 5.188-18.28 6.995-3.792 1.188-7.552 2.556-10.988 5.516-2.667 2.3-3.4 4.085-6.177 6.97-2.835 2.933-11.553-2.258-15.8 1.54a.84.84 0 0 0 .014 1.253c.92.805 2.67 2.722 4.336 3.314-.528 1-3.513 3.946-2.904 5.42.64 1.55 8.04.497 14.88-3.633 3.185-1.924 5.723-4.696 10.685-5.357 6.42-.855 13.817.55 21.25 1.62-1.103 3.286-3.315 5.473-5.088 8.1-.55.592 1.103.658 2.986.3 3.4-.838 5.832-1.513 8.4-3 3.143-1.83 3.62-6.52 7.474-7.534 1.864 2.865 6.5 3.83 10.074 2.3.198-.084.392-.177.582-.275.43-.375.178-.813-.086-1.135a6.21 6.21 0 0 1 -.362-.364c-2.012-2.162-2.472-7.266-1.58-9.748 1.017-2.824 2.022-7.343 3.046-11.075 1.1-4 1.506-9.063 2.837-11.106 2.002-3.072 4.215-4.127 6.136-5.86s3.68-3.42 3.62-7.384c-.028-1.223-.629-1.927-1.735-1.957m.204 4.163c-.397 2.734-2.144 4.237-4.208 5.687-1.8 1.27-3.794 2.493-5.07 4.477-1.305 2.03-2.134 8.985-4.16 15.852-1.68 5.698-4.184 11.335-8.467 14.05-.278.176-.645.015-.704-.3-.3-1.592-.24-4.5-.734-3.56-.62 1.77-1.322 3.458-2.143 5.027-2.52 4.816-6.166 8.505-12.057 9.95a.53.53 0 0 1 -.552-.82c2.718-3.77 5.15-7.825 5.447-14.014.025-.534-.646-.778-.983-.364-1.284 1.583-1.6 5.347-3.477 6.506-1.474.16-2.967.16-4.47.07-6.17-.37-12.502-2.226-18.274-.373-3.93 1.262-8.057 4.85-11.386 6.293-3.912 1.686-5.766 3.286-10.706 3.176-.505-.68 2.062-3.623 2.934-4.893.278-.407-.317-.835-.874-1.1-1.338-.614-2.68-2.28-4.107-2.93.183-.337.83-.674 1.187-.88 3.24-1.88 11.832 2.124 14.14-.143 1.425-1.398 2.385-2.626 3.353-4.05.94-1.38 2.368-2.838 3.847-4.047a31.3 31.3 0 0 1 1.94-1.435c2.52-1.724 3.907-1.852 7.17-3.064 4.152-1.544 9.293-2.898 13.747-4.6 2.752-1.053 5.744-2.35 8.183-4.17.58-.432 1.127-.893 1.634-1.386 6.964-6.8 8.345-18.766 19.2-19.882 1.314-.135 2.248-.192 3.228-.223 1.096-.03 2.18-.3 3.263-.818.334-.146 2.324-1.35 2.996-.768.448.388.115 2.492.086 2.72" fill="#444b5e" transform="matrix(.52012 0 0 .52012 0 7.19564)"/></svg>

static/svg/mysql.svg

@@ -1,6 +1 @@
-<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path fill="#444" d="M5.082 5.593c-.564.564-.423 1.213.564 2.679.508.761 1.1 1.946 1.326 2.623.226.705.677 1.664.987 2.143.564.79.564.959.197 2.397-.226.902-.31 2.031-.197 2.736.169 1.185 1.128 2.905 1.72 3.102.508.169 1.241-.733 1.269-1.551 0-.705.028-.733.338-.226.536.874 2.228 2.735 2.369 2.594.056-.056-.31-.79-.846-1.607-.508-.846-1.1-1.946-1.325-2.454-.31-.846-.423-.902-.79-.508-.226.226-.508.874-.592 1.466-.226 1.354-.733 1.523-1.128.367s-.395-3.131 0-4.484c.282-.931.254-1.184-.226-1.89-.31-.423-.79-1.438-1.044-2.256-.254-.79-.846-1.974-1.325-2.595-1.1-1.551-1.1-2.115.056-1.89.479.085 1.213.423 1.664.733.423.31 1.156.564 1.607.564 1.354 0 3.723 1.326 5.443 3.046 1.326 1.325 2.002 2.397 3.441 5.302 1.692 3.44 1.833 3.638 2.877 3.976 1.241.423 3.835 2.002 3.835 2.341 0 .113-.649.282-1.438.338-2.115.226-2.313.62-.931 1.861.649.564 1.862 1.438 2.736 1.918l1.579.902-.733-.931c-.423-.508-1.297-1.297-1.974-1.72s-1.213-.874-1.213-.987c0-.113.479-.31 1.072-.395 1.579-.282 2.03-.423 2.03-.705 0-.423-2.848-2.566-4.202-3.159-1.156-.536-1.297-.762-2.792-3.835-1.326-2.82-1.861-3.61-3.553-5.302-2.171-2.171-3.666-3.102-5.584-3.384-.649-.113-1.551-.451-1.946-.733-.931-.705-2.82-.959-3.272-.479z"/></svg>
-<!-- Generated by IcoMoon.io -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
-<path fill="#444444" d="M5.082 5.593c-0.564 0.564-0.423 1.213 0.564 2.679 0.508 0.761 1.1 1.946 1.326 2.623 0.226 0.705 0.677 1.664 0.987 2.143 0.564 0.79 0.564 0.959 0.197 2.397-0.226 0.902-0.31 2.031-0.197 2.736 0.169 1.185 1.128 2.905 1.72 3.102 0.508 0.169 1.241-0.733 1.269-1.551 0-0.705 0.028-0.733 0.338-0.226 0.536 0.874 2.228 2.735 2.369 2.594 0.056-0.056-0.31-0.79-0.846-1.607-0.508-0.846-1.1-1.946-1.325-2.454-0.31-0.846-0.423-0.902-0.79-0.508-0.226 0.226-0.508 0.874-0.592 1.466-0.226 1.354-0.733 1.523-1.128 0.367s-0.395-3.131 0-4.484c0.282-0.931 0.254-1.184-0.226-1.89-0.31-0.423-0.79-1.438-1.044-2.256-0.254-0.79-0.846-1.974-1.325-2.595-1.1-1.551-1.1-2.115 0.056-1.89 0.479 0.085 1.213 0.423 1.664 0.733 0.423 0.31 1.156 0.564 1.607 0.564 1.354 0 3.723 1.326 5.443 3.046 1.326 1.325 2.002 2.397 3.441 5.302 1.692 3.44 1.833 3.638 2.877 3.976 1.241 0.423 3.835 2.002 3.835 2.341 0 0.113-0.649 0.282-1.438 0.338-2.115 0.226-2.313 0.62-0.931 1.861 0.649 0.564 1.862 1.438 2.736 1.918l1.579 0.902-0.733-0.931c-0.423-0.508-1.297-1.297-1.974-1.72s-1.213-0.874-1.213-0.987c0-0.113 0.479-0.31 1.072-0.395 1.579-0.282 2.030-0.423 2.030-0.705 0-0.423-2.848-2.566-4.202-3.159-1.156-0.536-1.297-0.762-2.792-3.835-1.326-2.82-1.861-3.61-3.553-5.302-2.171-2.171-3.666-3.102-5.584-3.384-0.649-0.113-1.551-0.451-1.946-0.733-0.931-0.705-2.82-0.959-3.272-0.479z"></path>
-</svg>

static/svg/oracle.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><path fill="#EA1B22" d="M55.387 66.469h8.333l-4.407-7.09-8.088 12.819h-3.681l9.838-15.398c.428-.622 1.14-.998 1.931-.998.765 0 1.478.363 1.892.972l9.876 15.424h-3.681l-1.736-2.865h-8.438l-1.839-2.864zm38.235 2.864v-13.375h-3.123v14.685c0 .402.156.791.454 1.089.298.298.7.466 1.141.466h14.244l1.841-2.865h-14.557zm-51.677-2.397c3.033 0 5.496-2.449 5.496-5.482s-2.462-5.496-5.496-5.496h-13.665v16.241h3.123v-13.377h10.335c1.452 0 2.618 1.18 2.618 2.631s-1.167 2.631-2.618 2.631l-8.806-.013 9.324 8.127h4.538l-6.274-5.263h1.425zm-32.886 5.262c-4.483 0-8.122-3.629-8.122-8.114s3.638-8.127 8.122-8.127h9.439c4.485 0 8.121 3.643 8.121 8.127s-3.636 8.114-8.121 8.114h-9.439zm9.229-2.865c2.905 0 5.258-2.346 5.258-5.249 0-2.903-2.353-5.263-5.258-5.263h-9.021c-2.902 0-5.256 2.359-5.256 5.263 0 2.903 2.354 5.249 5.256 5.249h9.021zm59.314 2.865c-4.484 0-8.126-3.629-8.126-8.114s3.642-8.127 8.126-8.127h11.212l-1.829 2.864h-9.175c-2.904 0-5.264 2.359-5.264 5.263 0 2.903 2.36 5.249 5.264 5.249h11.263l-1.84 2.865h-9.631zm38.197-2.865c-2.397 0-4.433-1.607-5.055-3.824h13.35l1.84-2.864h-15.19c.622-2.203 2.658-3.824 5.055-3.824h9.163l1.854-2.864h-11.225c-4.484 0-8.126 3.643-8.126 8.127s3.642 8.114 8.126 8.114h9.631l1.841-2.865h-11.264"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><path fill="#444" d="M55.387 66.469h8.333l-4.407-7.09-8.088 12.819h-3.681l9.838-15.398c.428-.622 1.14-.998 1.931-.998.765 0 1.478.363 1.892.972l9.876 15.424h-3.681l-1.736-2.865h-8.438l-1.839-2.864zm38.235 2.864v-13.375h-3.123v14.685c0 .402.156.791.454 1.089.298.298.7.466 1.141.466h14.244l1.841-2.865h-14.557zm-51.677-2.397c3.033 0 5.496-2.449 5.496-5.482s-2.462-5.496-5.496-5.496h-13.665v16.241h3.123v-13.377h10.335c1.452 0 2.618 1.18 2.618 2.631s-1.167 2.631-2.618 2.631l-8.806-.013 9.324 8.127h4.538l-6.274-5.263h1.425zm-32.886 5.262c-4.483 0-8.122-3.629-8.122-8.114s3.638-8.127 8.122-8.127h9.439c4.485 0 8.121 3.643 8.121 8.127s-3.636 8.114-8.121 8.114h-9.439zm9.229-2.865c2.905 0 5.258-2.346 5.258-5.249 0-2.903-2.353-5.263-5.258-5.263h-9.021c-2.902 0-5.256 2.359-5.256 5.263 0 2.903 2.354 5.249 5.256 5.249h9.021zm59.314 2.865c-4.484 0-8.126-3.629-8.126-8.114s3.642-8.127 8.126-8.127h11.212l-1.829 2.864h-9.175c-2.904 0-5.264 2.359-5.264 5.263 0 2.903 2.36 5.249 5.264 5.249h11.263l-1.84 2.865h-9.631zm38.197-2.865c-2.397 0-4.433-1.607-5.055-3.824h13.35l1.84-2.864h-15.19c.622-2.203 2.658-3.824 5.055-3.824h9.163l1.854-2.864h-11.225c-4.484 0-8.126 3.643-8.126 8.127s3.642 8.114 8.126 8.114h9.631l1.841-2.865h-11.264"/></svg>

static/svg/oracledb.svg

@@ -1,7 +1 @@
-<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000"><path d="M438.7 408.1c270.6 0 459.4-68.6 459.4-153.1v-91.9C898.1 78.6 709.4 10 438.7 10 168.1 10 10 78.6 10 163.1V255c0 84.6 158.1 153.1 428.7 153.1zM383.2 774.6c-185.9-6.9-294.4-49.3-351.5-106.1C17.1 683 10 698.4 10 714.4v122.5C10 921.5 168.1 990 438.7 990c27.1 0 53.5-.9 79.4-2.2-69.5-50-119.1-125.6-134.9-213.2zM377.6 713c.3-81 29.1-155.2 77-213.1-5.8 0-11.4.1-17.4.1-219.4 0-343.1-45.1-405.6-107.2-14.5 14.5-21.6 29.9-21.6 46v122.5c0 77.9 134.6 142.1 367.6 151.7zM730.1 608.7c-26.9 0-50.1 9.8-69.5 29.3-19.4 19.6-31.3 45.1-35.7 76.8-4.5 31.9.2 57.5 13.7 76.7 13.6 19.3 33.6 28.9 59.8 28.9 28.2 0 51.6-9.3 70.2-27.7 18.6-18.5 30.3-44.2 34.9-77.4 4.7-34 .5-60.3-12.6-78.8-13.2-18.6-33.4-27.8-60.8-27.8z"/><path d="M714.4 438.8c-152.2 0-275.6 123.4-275.6 275.6 0 152.2 123.4 275.6 275.6 275.6C866.6 990 990 866.6 990 714.4c0-152.2-123.4-275.6-275.6-275.6zM840 711.2c-6 42.8-22.2 76.8-48.6 101.9-26.5 25.1-58.9 37.6-97.2 37.6-37.5 0-65.8-12.3-85-37-19.2-24.7-26-56.7-20.5-96.3 5.9-42.6 22.2-76.5 48.7-101.7 26.6-25.2 59.5-37.8 99-37.8 36.7 0 64.5 12.3 83.4 36.9 19 24.9 25.7 56.9 20.2 96.4z"/></svg>
-<!-- Svg Vector Icons : http://www.onlinewebfonts.com/icon -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" enable-background="new 0 0 1000 1000" xml:space="preserve">
-<metadata> Svg Vector Icons : http://www.onlinewebfonts.com/icon </metadata>
-<g><path d="M438.7,408.1c270.6,0,459.4-68.6,459.4-153.1v-91.9C898.1,78.6,709.4,10,438.7,10C168.1,10,10,78.6,10,163.1V255C10,339.6,168.1,408.1,438.7,408.1z"/><path d="M383.2,774.6c-185.9-6.9-294.4-49.3-351.5-106.1C17.1,683,10,698.4,10,714.4v122.5C10,921.5,168.1,990,438.7,990c27.1,0,53.5-0.9,79.4-2.2C448.6,937.8,399,862.2,383.2,774.6z"/><path d="M377.6,713c0.3-81,29.1-155.2,77-213.1c-5.8,0-11.4,0.1-17.4,0.1c-219.4,0-343.1-45.1-405.6-107.2c-14.5,14.5-21.6,29.9-21.6,46v122.5C10,639.2,144.6,703.4,377.6,713z"/><path d="M730.1,608.7c-26.9,0-50.1,9.8-69.5,29.3c-19.4,19.6-31.3,45.1-35.7,76.8c-4.5,31.9,0.2,57.5,13.7,76.7c13.6,19.3,33.6,28.9,59.8,28.9c28.2,0,51.6-9.3,70.2-27.7c18.6-18.5,30.3-44.2,34.9-77.4c4.7-34,0.5-60.3-12.6-78.8C777.7,617.9,757.5,608.7,730.1,608.7z"/><path d="M714.4,438.8c-152.2,0-275.6,123.4-275.6,275.6c0,152.2,123.4,275.6,275.6,275.6C866.6,990,990,866.6,990,714.4C990,562.2,866.6,438.8,714.4,438.8z M840,711.2c-6,42.8-22.2,76.8-48.6,101.9c-26.5,25.1-58.9,37.6-97.2,37.6c-37.5,0-65.8-12.3-85-37c-19.2-24.7-26-56.7-20.5-96.3c5.9-42.6,22.2-76.5,48.7-101.7c26.6-25.2,59.5-37.8,99-37.8c36.7,0,64.5,12.3,83.4,36.9C838.8,639.7,845.5,671.7,840,711.2z"/></g>
-</svg>

static/svg/postgresql.svg

@@ -1,6 +1 @@
-<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path fill="#444" d="M26.741 18.661c-.24-.278-.65-.202-.967-.139-.762.136-1.591.294-2.329-.023 1.318-2.08 2.355-4.351 2.935-6.748.211-.911.374-1.843.343-2.781-.023-.525-.096-1.084-.417-1.519A6.019 6.019 0 0023.092 5.3c-1.585-.43-3.285-.302-4.844.18-.129.026-.256-.032-.382-.048-1.415-.287-2.975-.174-4.202.645-1.473-.53-3.056-.85-4.624-.686-1.166.121-2.337.663-3.006 1.656-.846 1.239-.961 2.821-.826 4.273.272 1.928.742 3.826 1.34 5.677.394 1.154.828 2.317 1.529 3.325.356.495.829.994 1.466 1.072.566.069 1.078-.282 1.425-.698.6-.718 1.217-1.423 1.857-2.105.418.205.872.323 1.336.358-.251.298-.458.687-.858.804-.539.208-1.17.18-1.645.539-.274.196-.287.623-.041.848.445.432 1.101.525 1.693.575a3.21 3.21 0 002.324-.768c-.004 1.334.002 2.672.152 3.999.075.777.41 1.551 1.001 2.074.557.486 1.351.587 2.058.464.694-.132 1.407-.34 1.949-.814.576-.508.822-1.275.936-2.011a93.19 93.19 0 00.514-3.969c1.483.25 3.161-.034 4.269-1.117.237-.223.462-.609.228-.912zM23.45 6.117c.89.338 1.681.925 2.275 1.668.283.355.319.832.337 1.268.013 1.04-.197 2.067-.464 3.067a21.858 21.858 0 01-2.262 5.277 4.38 4.38 0 01-.317.469 60.07 60.07 0 01-.036-.183c.121-.318.298-.618.367-.956.244-.953.038-1.934-.05-2.893-.092-.905.217-1.786.209-2.689.035-.442-.14-.86-.31-1.257-.615-1.375-1.593-2.598-2.848-3.438-.306-.21-.648-.357-.953-.568 1.334-.286 2.765-.25 4.051.234zm-.813 7.719c.078 1.071.389 2.221-.116 3.237-.677-1.347-1.552-2.633-1.857-4.133-.086-.477-.108-1.081.316-1.413.538-.382 1.241-.296 1.863-.258-.027.859-.291 1.702-.205 2.567zm-12.103 6.345c-.243.286-.571.627-.985.542-.484-.14-.792-.582-1.062-.979-.729-1.166-1.168-2.483-1.571-3.79-.451-1.547-.831-3.119-1.05-4.717-.109-1.216-.041-2.52.581-3.603.466-.82 1.335-1.343 2.248-1.514 1.462-.281 2.961.017 4.364.445a6.438 6.438 0 00-1.382 2.358 9.506 9.506 0 00-.466 3.648c.053.867.03 1.738-.091 2.598-.152 1.123.299 2.278 1.133 3.036-.568.664-1.17 1.297-1.72 1.977zm1.28-4.023c-.143-.636.044-1.276.065-1.913.049-.721-.002-1.443-.016-2.164.674-.436 1.462-.777 2.279-.73a.992.992 0 01.915.734c.371 1.477.486 3.121-.225 4.52a13.24 13.24 0 00-.622 1.666c-1.182.012-2.187-.987-2.396-2.112zm3.678 3.954c-.742 1.005-2.227 1.197-3.3.65.529-.245 1.148-.226 1.659-.528.494-.266.69-.851 1.152-1.152.503-.071.87.676.49 1.029zm6.364-1.174c-.282.454-.183 1.008-.252 1.512-.162 1.413-.321 2.828-.551 4.232-.109.673-.395 1.388-1.03 1.723-.651.331-1.407.539-2.139.426-.695-.122-1.133-.77-1.33-1.401-.144-.529-.159-1.082-.2-1.627a50.004 50.004 0 01-.037-3.949c.029-.514-.235-1.049-.694-1.299-.222-.125-.482-.142-.73-.162.195-.967.784-1.802.986-2.768.262-1.195.117-2.439-.151-3.619-.131-.589-.579-1.11-1.175-1.253-.918-.231-1.844.128-2.665.512.104-1.334.461-2.7 1.278-3.783a3.79 3.79 0 012.528-1.473c1.642-.209 3.366.243 4.671 1.27a7.406 7.406 0 012.389 3.304c-.763-.027-1.628-.058-2.245.472-.56.472-.632 1.277-.506 1.953.292 1.608 1.241 2.975 1.941 4.421.186.339.436.635.674.939-.283.143-.599.28-.76.571zm1.964 1.137c-.504.06-1.028.078-1.514-.089.002-.275-.013-.601.208-.806.175-.129.424-.248.626-.107.86.453 1.86.232 2.775.121-.559.544-1.333.798-2.095.881zm-2.642-8.347c-.179.147.014.367.168.436.373.219.884-.087.896-.513-.337-.157-.76-.141-1.065.077zm-6.602.68c.159-.09.327-.337.143-.486-.262-.213-.643-.254-.962-.168-.103.036-.211.106-.19.232.074.428.647.688 1.008.422z"/></svg>
-<!-- Generated by IcoMoon.io -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
-<path fill="#444444" d="M26.741 18.661c-0.24-0.278-0.65-0.202-0.967-0.139-0.762 0.136-1.591 0.294-2.329-0.023 1.318-2.080 2.355-4.351 2.935-6.748 0.211-0.911 0.374-1.843 0.343-2.781-0.023-0.525-0.096-1.084-0.417-1.519-0.794-1.047-1.945-1.81-3.214-2.151-1.585-0.43-3.285-0.302-4.844 0.18-0.129 0.026-0.256-0.032-0.382-0.048-1.415-0.287-2.975-0.174-4.202 0.645-1.473-0.53-3.056-0.85-4.624-0.686-1.166 0.121-2.337 0.663-3.006 1.656-0.846 1.239-0.961 2.821-0.826 4.273 0.272 1.928 0.742 3.826 1.34 5.677 0.394 1.154 0.828 2.317 1.529 3.325 0.356 0.495 0.829 0.994 1.466 1.072 0.566 0.069 1.078-0.282 1.425-0.698 0.6-0.718 1.217-1.423 1.857-2.105 0.418 0.205 0.872 0.323 1.336 0.358-0.251 0.298-0.458 0.687-0.858 0.804-0.539 0.208-1.17 0.18-1.645 0.539-0.274 0.196-0.287 0.623-0.041 0.848 0.445 0.432 1.101 0.525 1.693 0.575 0.839 0.064 1.687-0.218 2.324-0.768-0.004 1.334 0.002 2.672 0.152 3.999 0.075 0.777 0.41 1.551 1.001 2.074 0.557 0.486 1.351 0.587 2.058 0.464 0.694-0.132 1.407-0.34 1.949-0.814 0.576-0.508 0.822-1.275 0.936-2.011 0.207-1.319 0.364-2.644 0.514-3.969 1.483 0.25 3.161-0.034 4.269-1.117 0.237-0.223 0.462-0.609 0.228-0.912zM23.45 6.117c0.89 0.338 1.681 0.925 2.275 1.668 0.283 0.355 0.319 0.832 0.337 1.268 0.013 1.040-0.197 2.067-0.464 3.067-0.511 1.851-1.287 3.625-2.262 5.277-0.096 0.163-0.201 0.32-0.317 0.469-0.009-0.045-0.027-0.137-0.036-0.183 0.121-0.318 0.298-0.618 0.367-0.956 0.244-0.953 0.038-1.934-0.050-2.893-0.092-0.905 0.217-1.786 0.209-2.689 0.035-0.442-0.14-0.86-0.31-1.257-0.615-1.375-1.593-2.598-2.848-3.438-0.306-0.21-0.648-0.357-0.953-0.568 1.334-0.286 2.765-0.25 4.051 0.234zM22.637 13.836c0.078 1.071 0.389 2.221-0.116 3.237-0.677-1.347-1.552-2.633-1.857-4.133-0.086-0.477-0.108-1.081 0.316-1.413 0.538-0.382 1.241-0.296 1.863-0.258-0.027 0.859-0.291 1.702-0.205 2.567zM10.534 20.181c-0.243 0.286-0.571 0.627-0.985 0.542-0.484-0.14-0.792-0.582-1.062-0.979-0.729-1.166-1.168-2.483-1.571-3.79-0.451-1.547-0.831-3.119-1.050-4.717-0.109-1.216-0.041-2.52 0.581-3.603 0.466-0.82 1.335-1.343 2.248-1.514 1.462-0.281 2.961 0.017 4.364 0.445-0.619 0.68-1.101 1.481-1.382 2.358-0.383 1.171-0.558 2.417-0.466 3.648 0.053 0.867 0.030 1.738-0.091 2.598-0.152 1.123 0.299 2.278 1.133 3.036-0.568 0.664-1.17 1.297-1.72 1.977zM11.814 16.158c-0.143-0.636 0.044-1.276 0.065-1.913 0.049-0.721-0.002-1.443-0.016-2.164 0.674-0.436 1.462-0.777 2.279-0.73 0.423 0.018 0.813 0.317 0.915 0.734 0.371 1.477 0.486 3.121-0.225 4.52-0.248 0.54-0.449 1.099-0.622 1.666-1.182 0.012-2.187-0.987-2.396-2.112zM15.492 20.112c-0.742 1.005-2.227 1.197-3.3 0.65 0.529-0.245 1.148-0.226 1.659-0.528 0.494-0.266 0.69-0.851 1.152-1.152 0.503-0.071 0.87 0.676 0.49 1.029zM21.856 18.938c-0.282 0.454-0.183 1.008-0.252 1.512-0.162 1.413-0.321 2.828-0.551 4.232-0.109 0.673-0.395 1.388-1.030 1.723-0.651 0.331-1.407 0.539-2.139 0.426-0.695-0.122-1.133-0.77-1.33-1.401-0.144-0.529-0.159-1.082-0.2-1.627-0.070-1.315-0.071-2.633-0.037-3.949 0.029-0.514-0.235-1.049-0.694-1.299-0.222-0.125-0.482-0.142-0.73-0.162 0.195-0.967 0.784-1.802 0.986-2.768 0.262-1.195 0.117-2.439-0.151-3.619-0.131-0.589-0.579-1.11-1.175-1.253-0.918-0.231-1.844 0.128-2.665 0.512 0.104-1.334 0.461-2.7 1.278-3.783 0.601-0.806 1.533-1.344 2.528-1.473 1.642-0.209 3.366 0.243 4.671 1.27 1.078 0.852 1.93 2.006 2.389 3.304-0.763-0.027-1.628-0.058-2.245 0.472-0.56 0.472-0.632 1.277-0.506 1.953 0.292 1.608 1.241 2.975 1.941 4.421 0.186 0.339 0.436 0.635 0.674 0.939-0.283 0.143-0.599 0.28-0.76 0.571zM23.82 20.075c-0.504 0.060-1.028 0.078-1.514-0.089 0.002-0.275-0.013-0.601 0.208-0.806 0.175-0.129 0.424-0.248 0.626-0.107 0.86 0.453 1.86 0.232 2.775 0.121-0.559 0.544-1.333 0.798-2.095 0.881zM21.178 11.728c-0.179 0.147 0.014 0.367 0.168 0.436 0.373 0.219 0.884-0.087 0.896-0.513-0.337-0.157-0.76-0.141-1.065 0.077zM14.576 12.408c0.159-0.090 0.327-0.337 0.143-0.486-0.262-0.213-0.643-0.254-0.962-0.168-0.103 0.036-0.211 0.106-0.19 0.232 0.074 0.428 0.647 0.688 1.008 0.422z"></path>
-</svg>

static/svg/sqllite.svg

@@ -1,6 +1 @@
-<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 34 32"><path fill="#444" d="M21.576 3.59c-1.115-.994-2.465-.595-3.798.588a9.407 9.407 0 00-.591.579c-2.279 2.418-4.395 6.897-5.053 10.318.256.519.456 1.182.588 1.688.034.13.064.252.089.355.058.245.089.405.089.405s-.02-.077-.104-.321l-.055-.158a1.44 1.44 0 00-.035-.087c-.149-.346-.56-1.075-.741-1.393-.155.457-.292.884-.406 1.271.523.956.841 2.595.841 2.595s-.028-.106-.159-.477c-.117-.328-.697-1.345-.835-1.583-.235.869-.329 1.455-.244 1.598.164.277.32.754.457 1.282.309 1.189.524 2.637.524 2.637l.019.244c-.043.999-.017 2.034.06 2.97.103 1.239.295 2.303.541 2.873l.167-.091c-.361-1.122-.508-2.593-.444-4.289.097-2.593.694-5.719 1.796-8.978 1.863-4.919 4.447-8.866 6.811-10.751-2.155 1.947-5.073 8.248-5.946 10.581-.978 2.613-1.671 5.065-2.088 7.414.721-2.202 3.05-3.149 3.05-3.149s1.143-1.409 2.478-3.422c-.8.182-2.113.495-2.553.68-.649.272-.824.365-.824.365s2.102-1.28 3.905-1.86c2.48-3.906 5.182-9.456 2.461-11.884z"/></svg>
-<!-- Generated by IcoMoon.io -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="34" height="32" viewBox="0 0 34 32">
-<path fill="#444444" d="M21.576 3.59c-1.115-0.994-2.465-0.595-3.798 0.588-0.198 0.176-0.395 0.371-0.591 0.579-2.279 2.418-4.395 6.897-5.053 10.318 0.256 0.519 0.456 1.182 0.588 1.688 0.034 0.13 0.064 0.252 0.089 0.355 0.058 0.245 0.089 0.405 0.089 0.405s-0.020-0.077-0.104-0.321c-0.016-0.047-0.034-0.098-0.055-0.158-0.009-0.025-0.021-0.055-0.035-0.087-0.149-0.346-0.56-1.075-0.741-1.393-0.155 0.457-0.292 0.884-0.406 1.271 0.523 0.956 0.841 2.595 0.841 2.595s-0.028-0.106-0.159-0.477c-0.117-0.328-0.697-1.345-0.835-1.583-0.235 0.869-0.329 1.455-0.244 1.598 0.164 0.277 0.32 0.754 0.457 1.282 0.309 1.189 0.524 2.637 0.524 2.637s0.007 0.096 0.019 0.244c-0.043 0.999-0.017 2.034 0.060 2.97 0.103 1.239 0.295 2.303 0.541 2.873l0.167-0.091c-0.361-1.122-0.508-2.593-0.444-4.289 0.097-2.593 0.694-5.719 1.796-8.978 1.863-4.919 4.447-8.866 6.811-10.751-2.155 1.947-5.073 8.248-5.946 10.581-0.978 2.613-1.671 5.065-2.088 7.414 0.721-2.202 3.050-3.149 3.050-3.149s1.143-1.409 2.478-3.422c-0.8 0.182-2.113 0.495-2.553 0.68-0.649 0.272-0.824 0.365-0.824 0.365s2.102-1.28 3.905-1.86c2.48-3.906 5.182-9.456 2.461-11.884z"></path>
-</svg>

webpack.config.js

@@ -1,4 +1,17 @@
 module.exports = {
-   plugins: [
+   module: {
+      rules: [
+         {
+            test: /\.scss$/,
+            use: [
+               {
+                  loader: 'sass-loader',
+                  options: {
+                     prependData: '@import "@/scss/_variables.scss";'
+                  }
+               }
             ]
+         }
+      ]
+   }
 };