From 0aff72be5054fb898aae4fb1fdf13120ef99f2ac Mon Sep 17 00:00:00 2001
From: Carter <safe@fea.st>
Date: Mon, 22 Jan 2024 13:40:49 -0800
Subject: [PATCH] Add back create modal

---
 theseus_gui/src/App.vue                       | 10 +++++
 .../src/components/ui/RunningAppBar.vue       | 39 +++++++++++++++----
 2 files changed, 42 insertions(+), 7 deletions(-)

diff --git a/theseus_gui/src/App.vue b/theseus_gui/src/App.vue
index 929dc96bc..f18489548 100644
--- a/theseus_gui/src/App.vue
+++ b/theseus_gui/src/App.vue
@@ -12,6 +12,7 @@ import {
   XIcon,
   Card,
   TextLogo,
+  PlusIcon,
 } from 'omorphia'
 import { useLoading, useTheming } from '@/store/state'
 import AccountsCard from './components/ui/AccountsCard.vue'
@@ -336,6 +337,15 @@ command_listener(async (e) => {
         <RouterLink v-tooltip="'Settings'" to="/settings" class="btn icon-only collapsed-button">
           <SettingsIcon />
         </RouterLink>
+        <Button
+          v-tooltip="'Create profile'"
+          class="sleek-primary collapsed-button"
+          icon-only
+          :disabled="offline"
+          @click="() => $refs.installationModal.show()"
+        >
+          <PlusIcon />
+        </Button>
         <AccountDropdown />
       </div>
     </div>
diff --git a/theseus_gui/src/components/ui/RunningAppBar.vue b/theseus_gui/src/components/ui/RunningAppBar.vue
index 53be85111..dedc6fa0f 100644
--- a/theseus_gui/src/components/ui/RunningAppBar.vue
+++ b/theseus_gui/src/components/ui/RunningAppBar.vue
@@ -4,7 +4,7 @@
       v-if="currentLoadingBars.length > 0"
       ref="infoButton"
       icon-only
-      class="show-card-icon"
+      class="download icon-button"
       @click="toggleCard()"
     >
       <DownloadIcon />
@@ -30,17 +30,17 @@
           <DropdownIcon />
         </div>
       </div>
-      <Button v-tooltip="'Stop instance'" icon-only class="stop" @click="stop()">
+      <Button v-tooltip="'Stop instance'" icon-only class="stop icon-button" @click="stop()">
         <StopCircleIcon />
       </Button>
-      <Button v-tooltip="'View logs'" icon-only @click="goToTerminal()">
+      <Button v-tooltip="'View logs'" icon-only class="utility icon-button" @click="goToTerminal()">
         <TerminalSquareIcon />
       </Button>
       <Button
         v-if="currentLoadingBars.length > 0"
         ref="infoButton"
         icon-only
-        class="show-card-icon"
+        class="download icon-button"
         @click="toggleCard()"
       >
         <DownloadIcon />
@@ -77,10 +77,20 @@
         @click="selectProfile(profile)"
       >
         <div class="text"><span class="circle running" /> {{ profile.metadata.name }}</div>
-        <Button v-tooltip="'Stop instance'" icon-only class="stop" @click.stop="stop(profile.path)">
+        <Button
+          v-tooltip="'Stop instance'"
+          icon-only
+          class="stop icon-button"
+          @click.stop="stop(profile.path)"
+        >
           <StopCircleIcon />
         </Button>
-        <Button v-tooltip="'View logs'" icon-only @click.stop="goToTerminal(profile.path)">
+        <Button
+          v-tooltip="'View logs'"
+          icon-only
+          class="utility icon-button"
+          @click.stop="goToTerminal(profile.path)"
+        >
           <TerminalSquareIcon />
         </Button>
       </Button>
@@ -309,6 +319,21 @@ onBeforeUnmount(() => {
   }
 }
 
+.icon-button {
+  background-color: rgba(0, 0, 0, 0);
+  box-shadow: none;
+
+  padding: 0 !important;
+}
+
+.stop {
+  color: var(--color-red);
+}
+
+.utility {
+  color: var(--color-contrast);
+}
+
 .info-card {
   position: absolute;
   top: 3.5rem;
@@ -368,7 +393,7 @@ onBeforeUnmount(() => {
   }
 }
 
-.show-card-icon {
+.download {
   color: var(--color-brand);
 }