Browse Source

[frontend] Add drop arrow icon components

Johan Åhlén 4 years ago
parent
commit
e2bbc413ef

+ 6 - 0
desktop/core/src/desktop/js/components/icons/DropDownIcon.ts

@@ -0,0 +1,6 @@
+import { defineComponent } from 'vue';
+
+export default defineComponent({
+  name: 'DropDownIcon',
+  template: '<svg class="hi hi-fw"><use xlink:href="#hueDropDownSymbol" /></svg>'
+});

+ 6 - 0
desktop/core/src/desktop/js/components/icons/DropLeftIcon.ts

@@ -0,0 +1,6 @@
+import { defineComponent } from 'vue';
+
+export default defineComponent({
+  name: 'DropLeftIcon',
+  template: '<svg class="hi hi-fw"><use xlink:href="#hueDropLeftSymbol" /></svg>'
+});

+ 6 - 0
desktop/core/src/desktop/js/components/icons/DropRightIcon.ts

@@ -0,0 +1,6 @@
+import { defineComponent } from 'vue';
+
+export default defineComponent({
+  name: 'DropRightIcon',
+  template: '<svg class="hi hi-fw"><use xlink:href="#hueDropRightSymbol" /></svg>'
+});

+ 6 - 0
desktop/core/src/desktop/js/components/icons/DropUpIcon.ts

@@ -0,0 +1,6 @@
+import { defineComponent } from 'vue';
+
+export default defineComponent({
+  name: 'DropUpIcon',
+  template: '<svg class="hi hi-fw"><use xlink:href="#hueDropUpSymbol" /></svg>'
+});

+ 16 - 0
desktop/core/src/desktop/js/components/icons/HueIcons.vue

@@ -62,6 +62,22 @@
             </g>
           </symbol>
 
+          <symbol id="hueDropDownSymbol" viewBox="0 0 24 24">
+            <polygon points="6 9 12 15 18 9" />
+          </symbol>
+
+          <symbol id="hueDropLeftSymbol" viewBox="0 0 24 24">
+            <polygon points="15 6 9 11.9988 15 18" />
+          </symbol>
+
+          <symbol id="hueDropRightSymbol" viewBox="0 0 24 24">
+            <polygon points="9 6 9 18 15 11.9988" />
+          </symbol>
+
+          <symbol id="hueDropUpSymbol" viewBox="0 0 24 24">
+            <polygon points="12.0001 9 6 15.0001 17.999 15.0001" />
+          </symbol>
+
           <symbol id="hueSpinnerLargeSymbol" viewBox="0 0 64 64">
             <path
               stroke-width="4"