fix: updates text to image (#450)

vcync · Oct 17, 2020 · 4b5b0ef · 4b5b0ef
1 parent 34a9fef
commit 4b5b0ef
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/src/assets/graphics/Arrow-vertical.svg b/src/assets/graphics/Arrow-vertical.svg
diff --git a/src/components/CollapsibleRow.vue b/src/components/CollapsibleRow.vue
@@ -4,7 +4,12 @@
       <grid columns="4">
         <c span="1"><slot name="label"/></c>
         <c span="3">
-          <Button @mousedown="open = !open">Open/Close</Button>
+          <Button @mousedown="open = !open">
+            <img
+              :class="{ flip: !open }"
+              src="../assets/graphics/Arrow-vertical.svg"
+            />
+          </Button>
         </c>
       </grid>
     </c>
@@ -33,4 +38,8 @@ export default {
 .label-row {
   border-bottom: 1px solid #9a9a9a;
 }
+
+.flip {
+  transform: scaleY(-1);
+}
 </style>