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

fix custom config ui

Browse Source
This commit is contained in:
Julian Freeman
2026-04-17 17:17:08 -04:00
parent 2d319b7f7a
commit 1c43a318c6
1 changed files with 9 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/config/ConfigurationView.vue
View File

@@ -46,7 +46,6 @@ const iconOptions = computed(() =>
<div class="config-form-header collapsible"> <div class="config-form-header collapsible">
<div> <div>
<h3>Add Custom Browser</h3> <h3>Add Custom Browser</h3>
<p>Add a custom executable and Chromium user data path when needed.</p>
</div> </div>
<button <button
class="secondary-button config-toggle-button" class="secondary-button config-toggle-button"
@@ -112,9 +111,6 @@ const iconOptions = computed(() =>
</button> </button>
</div> </div>
</div> </div>
<div v-else class="config-form-collapsed-note">
<span>Collapsed by default to keep this page focused on existing configs.</span>
</div>
</div> </div>
<div v-if="configsLoading" class="empty-card"> <div v-if="configsLoading" class="empty-card">
@@ -188,7 +184,8 @@ const iconOptions = computed(() =>
.config-form-header h3, .config-form-header h3,
.config-title-row h4 { .config-title-row h4 {
margin: 0; margin: 0;
font-size: 0.94rem; font-size: 1.1rem;
line-height: 1.2;
} }
.config-form-header.collapsible { .config-form-header.collapsible {
@@ -198,7 +195,6 @@ const iconOptions = computed(() =>
gap: 12px; gap: 12px;
} }
.config-form-header p,
.config-meta-row p { .config-meta-row p {
margin: 6px 0 0; margin: 6px 0 0;
color: var(--muted); color: var(--muted);
@@ -221,16 +217,6 @@ const iconOptions = computed(() =>
align-items: end; align-items: end;
} }
.config-form-collapsed-note {
margin-top: 12px;
padding: 10px 12px;
border-radius: 12px;
background: rgba(248, 250, 252, 0.78);
border: 1px solid rgba(148, 163, 184, 0.12);
color: var(--muted);
font-size: 0.82rem;
}
.field-group { .field-group {
display: grid; display: grid;
gap: 6px; gap: 6px;
@@ -265,11 +251,12 @@ const iconOptions = computed(() =>
.field-group :deep(.sort-dropdown-trigger) { .field-group :deep(.sort-dropdown-trigger) {
width: 100%; width: 100%;
min-width: 0; min-width: 0;
min-height: 40px;
} }
.path-input-row { .path-input-row {
display: grid; display: grid;
grid-template-columns: minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr) 118px;
gap: 10px; gap: 10px;
} }
@@ -277,6 +264,11 @@ const iconOptions = computed(() =>
white-space: nowrap; white-space: nowrap;
} }
.path-input-row .secondary-button {
width: 118px;
justify-content: center;
}
.config-form-actions { .config-form-actions {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;