julian/chrom-tool
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

fix config ui

Browse Source
This commit is contained in:
Julian Freeman
2026-04-16 15:57:09 -04:00
parent b890c609d9
commit 7e912bd9d0
2 changed files with 103 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
src/App.vue
View File

@@ -118,69 +118,73 @@ const {
<h3>Add Custom Browser</h3>
<p>Provide a name, executable path, and Chromium user data path.</p>
</div>
<div class="config-form-grid">
<label class="field-group">
<span>Name</span>
<input v-model="createConfigForm.name" placeholder="Work Chrome" />
</label>
<label class="field-group">
<span>Icon</span>
<div class="icon-option-grid">
<div class="config-form-layout">
<div class="config-form-fields">
<label class="field-group">
<span>Name</span>
<input v-model="createConfigForm.name" placeholder="Work Chrome" />
</label>
<label class="field-group">
<span>Executable Path</span>
<div class="path-input-row">
<input
v-model="createConfigForm.executablePath"
placeholder="C:\Program Files\...\chrome.exe"
/>
<button
class="secondary-button"
type="button"
@click="pickExecutablePath"
>
Browse File
</button>
</div>
</label>
<label class="field-group">
<span>User Data Path</span>
<div class="path-input-row">
<input
v-model="createConfigForm.userDataPath"
placeholder="C:\Users\...\User Data"
/>
<button
class="secondary-button"
type="button"
@click="pickUserDataPath"
>
Browse Folder
</button>
</div>
</label>
</div>
<div class="config-form-side">
<label class="field-group">
<span>Icon</span>
<div class="icon-option-grid">
<button
v-for="option in browserIconOptions"
:key="option.key"
class="icon-option-button"
:class="{ active: createConfigForm.iconKey === option.key }"
type="button"
@click="createConfigForm.iconKey = option.key"
>
<img :src="option.src" :alt="option.label" />
<span>{{ option.label }}</span>
</button>
</div>
</label>
<div class="config-form-actions">
<button
v-for="option in browserIconOptions"
:key="option.key"
class="icon-option-button"
:class="{ active: createConfigForm.iconKey === option.key }"
class="primary-button"
type="button"
@click="createConfigForm.iconKey = option.key"
:disabled="savingConfig"
@click="createCustomBrowserConfig"
>
<img :src="option.src" :alt="option.label" />
<span>{{ option.label }}</span>
{{ savingConfig ? "Saving..." : "Add Config" }}
</button>
</div>
</label>
<label class="field-group">
<span>Executable Path</span>
<div class="path-input-row">
<input
v-model="createConfigForm.executablePath"
placeholder="C:\Program Files\...\chrome.exe"
/>
<button
class="secondary-button"
type="button"
@click="pickExecutablePath"
>
Browse File
</button>
</div>
</label>
<label class="field-group field-span">
<span>User Data Path</span>
<div class="path-input-row">
<input
v-model="createConfigForm.userDataPath"
placeholder="C:\Users\...\User Data"
/>
<button
class="secondary-button"
type="button"
@click="pickUserDataPath"
>
Browse Folder
</button>
</div>
</label>
</div>
<div class="config-form-actions">
<button
class="primary-button"
type="button"
:disabled="savingConfig"
@click="createCustomBrowserConfig"
>
{{ savingConfig ? "Saving..." : "Add Config" }}
</button>
</div>
</div>
</div>