bvandeusen/FabledScribe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 50 Wiki Activity

Fix ShareDialog transparent background — replace undefined CSS vars

Browse Source 
--color-surface → --color-bg-card
--color-muted   → --color-text-muted
--color-hover   → --color-bg-secondary

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Bryan Van Deusen
2026-03-11 17:38:51 -04:00
parent 6d593a0ef6
commit a63f06712f
1 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/ShareDialog.vue
+13 -13
View File
@@ -206,7 +206,7 @@ onMounted(async () => {
}
.share-dialog {
background: var(--color-surface);
background: var(--color-bg-card);
border: 1px solid var(--color-border);
border-radius: var(--radius-lg);
width: 480px;
@@ -234,7 +234,7 @@ onMounted(async () => {
.btn-close {
background: none;
border: none;
color: var(--color-muted);
color: var(--color-text-muted);
cursor: pointer;
font-size: 1.1rem;
padding: 0.25rem;
@@ -262,7 +262,7 @@ onMounted(async () => {
padding: 0.3rem 0.8rem;
font-size: 0.82rem;
cursor: pointer;
color: var(--color-muted);
color: var(--color-text-muted);
transition: all 0.15s;
}
.share-tab.active {
@@ -288,7 +288,7 @@ onMounted(async () => {
padding: 0.45rem 0.7rem;
border: 1px solid var(--color-border);
border-radius: 6px;
background: var(--color-surface);
background: var(--color-bg-card);
color: var(--color-text);
font-size: 0.9rem;
outline: none;
@@ -301,7 +301,7 @@ onMounted(async () => {
top: 100%;
left: 0;
right: 0;
background: var(--color-surface);
background: var(--color-bg-card);
border: 1px solid var(--color-border);
border-radius: 6px;
margin-top: 2px;
@@ -321,16 +321,16 @@ onMounted(async () => {
cursor: pointer;
transition: background 0.1s;
}
.user-result-item:hover { background: var(--color-hover); }
.user-result-item:hover { background: var(--color-bg-secondary); }
.user-result-name { font-weight: 600; font-size: 0.88rem; }
.user-result-email { color: var(--color-muted); font-size: 0.8rem; }
.user-result-email { color: var(--color-text-muted); font-size: 0.8rem; }
.perm-select {
padding: 0.45rem 0.5rem;
border: 1px solid var(--color-border);
border-radius: 6px;
background: var(--color-surface);
background: var(--color-bg-card);
color: var(--color-text);
font-size: 0.85rem;
cursor: pointer;
@@ -359,7 +359,7 @@ onMounted(async () => {
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--color-muted);
color: var(--color-text-muted);
margin: 0 0 0.5rem;
}
@@ -378,7 +378,7 @@ onMounted(async () => {
gap: 0.5rem;
padding: 0.5rem 0.75rem;
border-radius: 8px;
background: var(--color-hover);
background: var(--color-bg-secondary);
}
.share-target-icon { font-size: 1rem; flex-shrink: 0; }
@@ -388,7 +388,7 @@ onMounted(async () => {
padding: 0.25rem 0.4rem;
border: 1px solid var(--color-border);
border-radius: 4px;
background: var(--color-surface);
background: var(--color-bg-card);
color: var(--color-text);
font-size: 0.8rem;
cursor: pointer;
@@ -397,7 +397,7 @@ onMounted(async () => {
.btn-remove-share {
background: none;
border: none;
color: var(--color-muted);
color: var(--color-text-muted);
cursor: pointer;
font-size: 0.9rem;
padding: 0.15rem 0.3rem;
@@ -408,7 +408,7 @@ onMounted(async () => {
.btn-remove-share:hover { color: var(--color-danger, #ef4444); }
.shares-empty {
color: var(--color-muted);
color: var(--color-text-muted);
font-size: 0.85rem;
font-style: italic;
text-align: center;