left iconbar

packages/web-svelte/src/widgets/WidgetIconPanel.svelte

@@ -0,0 +1,59 @@
+<script>
+  import FontIcon from '../icons/FontIcon.svelte';
+
+  const widgets = [
+    {
+      icon: 'icon database',
+      name: 'database',
+      title: 'Database connections',
+    },
+    // {
+    //   icon: 'fa-table',
+    //   name: 'table',
+    // },
+    {
+      icon: 'icon file',
+      name: 'file',
+      title: 'Closed tabs & Saved SQL files',
+    },
+    {
+      icon: 'icon archive',
+      name: 'archive',
+      title: 'Archive (saved tabular data)',
+    },
+    {
+      icon: 'icon plugin',
+      name: 'plugins',
+      title: 'Extensions & Plugins',
+    },
+    {
+      icon: 'icon favorite',
+      name: 'favorites',
+      title: 'Favorites',
+    },
+    // {
+    //   icon: 'fa-cog',
+    //   name: 'settings',
+    // },
+    // {
+    //   icon: 'fa-check',
+    //   name: 'settings',
+    // },
+  ];
+</script>
+
+{#each widgets as item}
+  <div class="wrapper">
+    <FontIcon icon={item.icon} />
+  </div>
+{/each}
+
+<style>
+  .wrapper {
+    font-size: 23pt;
+    height: 60px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+</style>