Add back create modal

This commit is contained in:
Carter 2024-01-22 13:40:49 -08:00
parent 3fd1a6bb93
commit 0aff72be50
No known key found for this signature in database
2 changed files with 42 additions and 7 deletions

View File

@ -12,6 +12,7 @@ import {
XIcon, XIcon,
Card, Card,
TextLogo, TextLogo,
PlusIcon,
} from 'omorphia' } from 'omorphia'
import { useLoading, useTheming } from '@/store/state' import { useLoading, useTheming } from '@/store/state'
import AccountsCard from './components/ui/AccountsCard.vue' 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"> <RouterLink v-tooltip="'Settings'" to="/settings" class="btn icon-only collapsed-button">
<SettingsIcon /> <SettingsIcon />
</RouterLink> </RouterLink>
<Button
v-tooltip="'Create profile'"
class="sleek-primary collapsed-button"
icon-only
:disabled="offline"
@click="() => $refs.installationModal.show()"
>
<PlusIcon />
</Button>
<AccountDropdown /> <AccountDropdown />
</div> </div>
</div> </div>

View File

@ -4,7 +4,7 @@
v-if="currentLoadingBars.length > 0" v-if="currentLoadingBars.length > 0"
ref="infoButton" ref="infoButton"
icon-only icon-only
class="show-card-icon" class="download icon-button"
@click="toggleCard()" @click="toggleCard()"
> >
<DownloadIcon /> <DownloadIcon />
@ -30,17 +30,17 @@
<DropdownIcon /> <DropdownIcon />
</div> </div>
</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 /> <StopCircleIcon />
</Button> </Button>
<Button v-tooltip="'View logs'" icon-only @click="goToTerminal()"> <Button v-tooltip="'View logs'" icon-only class="utility icon-button" @click="goToTerminal()">
<TerminalSquareIcon /> <TerminalSquareIcon />
</Button> </Button>
<Button <Button
v-if="currentLoadingBars.length > 0" v-if="currentLoadingBars.length > 0"
ref="infoButton" ref="infoButton"
icon-only icon-only
class="show-card-icon" class="download icon-button"
@click="toggleCard()" @click="toggleCard()"
> >
<DownloadIcon /> <DownloadIcon />
@ -77,10 +77,20 @@
@click="selectProfile(profile)" @click="selectProfile(profile)"
> >
<div class="text"><span class="circle running" /> {{ profile.metadata.name }}</div> <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 /> <StopCircleIcon />
</Button> </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 /> <TerminalSquareIcon />
</Button> </Button>
</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 { .info-card {
position: absolute; position: absolute;
top: 3.5rem; top: 3.5rem;
@ -368,7 +393,7 @@ onBeforeUnmount(() => {
} }
} }
.show-card-icon { .download {
color: var(--color-brand); color: var(--color-brand);
} }