Commit 09f9ad6f authored by Joel Collins's avatar Joel Collins
Browse files

Switch to material icons for tabs

parent 4db11c01

package-lock.json

+6 −1
Original line number Diff line number Diff line 
{

  "name": "openflexure-ev",

  "version": "1.1.0-beta.2",

  "version": "1.1.0-beta.3",

  "lockfileVersion": 1,

  "requires": true,

  "dependencies": {
@@ -7307,6 +7307,11 @@ 
        "object-visit": "^1.0.0"

      }

    },

    "material-design-icons": {

      "version": "3.0.1",

      "resolved": "https://registry.npmjs.org/material-design-icons/-/material-design-icons-3.0.1.tgz",

      "integrity": "sha1-mnHEh0chjrylHlGmbaaCA4zct78="

    },

    "md5.js": {

      "version": "1.3.5",

      "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",

package.json

+2 −1
Original line number Diff line number Diff line
@@ -27,7 +27,8 @@ 
    "custom-electron-titlebar": "^3.0.8",

    "electron-context-menu": "^0.11.0",

    "electron-store": "^3.2.0",

    "electron-updater": "^4.0.6"

    "electron-updater": "^4.0.6",

    "material-design-icons": "^3.0.1"

  },

  "devDependencies": {

    "@vue/cli-plugin-babel": "^3.3.0",

src/assets/less/theme.less

+4 −0
Original line number Diff line number Diff line
@@ -207,6 +207,10 @@ 
/*

 * Links

 */

.uk-link {

    color: @global-muted-color;

}



.uk-link:hover, a:hover {

    color: @global-primary-background;

}

src/components/genericComponents/tabIcon.vue

+2 −0
Original line number Diff line number Diff line 
<template>

  <a 

    href="#" 

    class="uk-link"

    :class="classObject" 

    :uk-tooltip="tooltipOptions"

    @click="setThisTab">

    <slot></slot>

  </a>



</template>

src/components/panelLeft.vue

+17 −7
Original line number Diff line number Diff line
@@ -3,12 +3,22 @@ 


    <!-- Vertical tab bar -->

    <div id="switcher-left" class="uk-flex uk-flex-column uk-padding-remove uk-width-auto uk-height-1-1">

      <tabIcon id="connect" uk-icon="server" :requireConnection="false" :currentTab="currentTab" @set-tab="setTab" />

      <tabIcon id="navigate" uk-icon="location" :requireConnection="true" :currentTab="currentTab" @set-tab="setTab" />

      <tabIcon id="capture" uk-icon="camera" :requireConnection="true" :currentTab="currentTab" @set-tab="setTab" />

      <tabIcon id="settings" uk-icon="cog" :requireConnection="false" :currentTab="currentTab" @set-tab="setTab" />



      <tabIcon v-for="plugin in $store.state.apiPlugins" :key="plugin.id" :id="plugin.id" :uk-icon="plugin.icon" :requireConnection="plugin.requiresConnection" :currentTab="currentTab" @set-tab="setTab" />

      <tabIcon id="connect" :requireConnection="false" :currentTab="currentTab" @set-tab="setTab">

        <i class="material-icons">settings_ethernet</i>

      </tabIcon>

      <tabIcon id="navigate" :requireConnection="true" :currentTab="currentTab" @set-tab="setTab">

        <i class="material-icons">gamepad</i>  

      </tabIcon>

      <tabIcon id="capture" :requireConnection="true" :currentTab="currentTab" @set-tab="setTab">

        <i class="material-icons">camera_alt</i>

      </tabIcon>

      <tabIcon id="settings" :requireConnection="false" :currentTab="currentTab" @set-tab="setTab">

        <i class="material-icons">settings</i>  

      </tabIcon>



      <tabIcon v-for="plugin in $store.state.apiPlugins" :key="plugin.id" :id="plugin.id" :uk-icon="plugin.icon" :requireConnection="plugin.requiresConnection" :currentTab="currentTab" @set-tab="setTab">

        <i class="material-icons">{{ plugin.icon || "extension" }}</i> 

      </tabIcon>



    </div>
@@ -118,7 +128,7 @@ export default { 
}



#switcher-left a{

  padding: 12px 20px;

  padding: 10px 16px;

}



#switcher-left{