You've already forked AstralRinth
forked from didirus/AstralRinth
Library page (#53)
* launcher base gui initial * Bootstraps router, Omorphia, and prettier. * Adds pages. Adds Vuex. SideBar nav contains user section and pages section. * Adds Instance markup. Instances added to Home page. * Adds News to home page. * Adds settings to nav. Other touches. * Polishing initial base GUI. * Moves some styling to assets. Changes px values to rem. * Removes pointless border-radius CSS. * Implements Omorphia vars. * Adds trending mods section. * Updates home page. * Swaps Vuex implementation for Pinia. * Fixes invalid CSS on instance list item hover. * Adds @ path resolve for imports. * Fix some styling of row display * Gridview on library page * Cleaning up styles and markup. * Fixes overall layout issues. * Cleans up more styling. Modifies AppBar coloring. * instance routing * Allows pagination arrows to conditionally appear in RowDisplay. * Adds paging behavior in RowDisplay. * Initial modlist layout * Updates nav and settings button styling. * Brings in Knossos style for trending mods. Polishes News CSS. * Page redesign * More tweaks * Base library pages * Remove errant css * Update play.svg * Addressed issues --------- Co-authored-by: Jai A <jaiagr+gpg@pm.me> Co-authored-by: Zachary Baird <zdb1994@yahoo.com> Co-authored-by: Zach Baird <30800863+ZachBaird@users.noreply.github.com>
This commit is contained in:
230
theseus_gui/src/pages/instance/Options.vue
Normal file
230
theseus_gui/src/pages/instance/Options.vue
Normal file
@@ -0,0 +1,230 @@
|
||||
<template>
|
||||
<Card class="settings-card">
|
||||
<h2 class="settings-title"> Java </h2>
|
||||
<div class="settings-group">
|
||||
<h3>Installation</h3>
|
||||
<input
|
||||
type="text"
|
||||
class="input installation-input"
|
||||
placeholder="/Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home"
|
||||
ref="javaPath"
|
||||
v-model="javaPath"
|
||||
/>
|
||||
<span class="installation-buttons">
|
||||
<Button @click="saveJavaPath">
|
||||
<SearchIcon/>
|
||||
Auto Detect
|
||||
</Button>
|
||||
<Button @click="saveJavaPath">
|
||||
<BrowseIcon/>
|
||||
Browse
|
||||
</Button>
|
||||
<Button @click="saveJavaPath">
|
||||
<PlayIcon/>
|
||||
Test
|
||||
</Button>
|
||||
</span>
|
||||
</div>
|
||||
<hr class="card-divider">
|
||||
<div class="settings-group">
|
||||
<h3>Arguments</h3>
|
||||
<input
|
||||
type="text"
|
||||
class="input installation-input"
|
||||
ref="javaArgs"
|
||||
v-model="javaArgs"
|
||||
/>
|
||||
</div>
|
||||
<hr class="card-divider">
|
||||
<div class="settings-group">
|
||||
<div class="sliders">
|
||||
<span class="slider">
|
||||
Minimum Memory
|
||||
<Slider
|
||||
v-model="javaMemory"
|
||||
:min="1024"
|
||||
:max="8192"
|
||||
:step="1024"
|
||||
/>
|
||||
</span>
|
||||
<span class="slider">
|
||||
Maximum Memory
|
||||
<Slider
|
||||
v-model="javaMemory"
|
||||
:min="1024"
|
||||
:max="8192"
|
||||
:step="1024"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Card class="settings-card">
|
||||
<h2 class="settings-title"> Window </h2>
|
||||
<div class="settings-group">
|
||||
<div class="settings-group">
|
||||
<div class="sliders">
|
||||
<span class="slider">
|
||||
Width
|
||||
<Slider
|
||||
v-model="javaMemory"
|
||||
:min="1024"
|
||||
:max="8192"
|
||||
:step="1024"
|
||||
/>
|
||||
</span>
|
||||
<span class="slider">
|
||||
Height
|
||||
<Slider
|
||||
v-model="javaMemory"
|
||||
:min="1024"
|
||||
:max="8192"
|
||||
:step="1024"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<div class="toggle-setting">
|
||||
Start in Fullscreen
|
||||
<input
|
||||
type="checkbox"
|
||||
id="fullscreen"
|
||||
name="fullscreen"
|
||||
v-model="fullscreen"
|
||||
class="switch stylized-toggle"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="card-divider">
|
||||
<div class="settings-group">
|
||||
<h3>Console</h3>
|
||||
<div class="toggle-setting">
|
||||
Show console while game is running
|
||||
<input
|
||||
type="checkbox"
|
||||
id="fullscreen"
|
||||
name="fullscreen"
|
||||
v-model="fullscreen"
|
||||
class="switch stylized-toggle"
|
||||
/>
|
||||
</div>
|
||||
<div class="toggle-setting">
|
||||
Close console when game quits
|
||||
<input
|
||||
type="checkbox"
|
||||
id="fullscreen"
|
||||
name="fullscreen"
|
||||
v-model="fullscreen"
|
||||
class="switch stylized-toggle"
|
||||
/>
|
||||
</div>
|
||||
<div class="toggle-setting">
|
||||
Show console when game crashes
|
||||
<input
|
||||
type="checkbox"
|
||||
id="fullscreen"
|
||||
name="fullscreen"
|
||||
v-model="fullscreen"
|
||||
class="switch stylized-toggle"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Card class="settings-card">
|
||||
<h2 class="settings-title"> Commands </h2>
|
||||
<div class="settings-group">
|
||||
<div class="toggle-setting">
|
||||
Pre Launch
|
||||
<input
|
||||
type="text"
|
||||
class="input"
|
||||
ref="javaArgs"
|
||||
v-model="javaArgs"
|
||||
/>
|
||||
</div>
|
||||
<div class="toggle-setting">
|
||||
Wrapper
|
||||
<input
|
||||
type="text"
|
||||
class="input"
|
||||
ref="javaArgs"
|
||||
v-model="javaArgs"
|
||||
/>
|
||||
</div>
|
||||
<div class="toggle-setting">
|
||||
Post Launch
|
||||
<input
|
||||
type="text"
|
||||
class="input"
|
||||
ref="javaArgs"
|
||||
v-model="javaArgs"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {Card, Button, SearchIcon, Slider } from 'omorphia'
|
||||
import {BrowseIcon, PlayIcon} from "@/assets/icons";
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.settings-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.settings-title {
|
||||
color: var(--color-contrast)
|
||||
}
|
||||
|
||||
.settings-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.installation-input {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.installation-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: .5rem;
|
||||
margin: 0;
|
||||
|
||||
}
|
||||
|
||||
.sliders {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
gap: 1rem;
|
||||
width: 100%;
|
||||
|
||||
.slider {
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.toggle-setting {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.card-divider {
|
||||
background-color: var(--color-button-bg);
|
||||
border: none;
|
||||
color: var(--color-button-bg);
|
||||
height: 1px;
|
||||
margin: var(--gap-sm) 0;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user