obsqrbtz/goose-highlighter
1
0
Fork 0
mirror of https://github.com/obsqrbtz/goose-highlighter.git synced 2026-04-08 20:19:06 +03:00
Code Issues Packages Projects Releases Wiki Activity

restyled buttons

Browse Source
This commit is contained in:
Daniel Dada
2026-02-06 12:01:15 +03:00
parent 1bff2bd28d
commit b7f98912f2
3 changed files with 128 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
list-manager/list-manager.css
View File

@@ -84,6 +84,12 @@ body.dark .title img {
opacity: 0.6;
}
.topbar-actions {
display: flex;
align-items: center;
gap: 8px;
}
.topbar-actions button {
min-height: 28px;
padding: 4px 10px;
@@ -95,13 +101,26 @@ body.dark .title img {
}
.topbar-actions button.primary {
background: var(--accent);
color: var(--accent-text);
border: none;
background: rgba(255, 140, 0, 0.1);
color: var(--accent);
border: 1px solid rgba(255, 140, 0, 0.35);
}
.topbar-actions button.primary:hover {
background: var(--accent-hover);
background: rgba(255, 140, 0, 0.18);
border-color: rgba(255, 140, 0, 0.5);
}
html.dark .topbar-actions button.primary,
body.dark .topbar-actions button.primary {
background: rgba(255, 140, 0, 0.12);
border-color: rgba(255, 140, 0, 0.4);
}
html.dark .topbar-actions button.primary:hover,
body.dark .topbar-actions button.primary:hover {
background: rgba(255, 140, 0, 0.2);
border-color: rgba(255, 140, 0, 0.55);
}
.topbar-actions button.ghost {
@@ -188,6 +207,27 @@ body.dark .title img {
min-height: 28px;
}
.lists-panel .panel-actions button.ghost {
background: var(--input-bg);
border: 1px solid var(--input-border);
color: var(--text-color);
}
.lists-panel .panel-actions button.ghost:hover {
background: var(--section-bg);
}
.lists-panel .panel-actions button.danger {
background: rgba(239, 68, 68, 0.08);
border: 1px solid rgba(239, 68, 68, 0.3);
color: var(--danger);
}
.lists-panel .panel-actions button.danger:hover {
background: rgba(239, 68, 68, 0.15);
border-color: rgba(239, 68, 68, 0.45);
}
.panel-actions.secondary {
margin-top: 0;
gap: 6px;
@@ -426,6 +466,29 @@ body.dark .list-item.selected {
flex-shrink: 0;
}
.add-words button.primary {
background: rgba(255, 140, 0, 0.1);
color: var(--accent);
border: 1px solid rgba(255, 140, 0, 0.35);
}
.add-words button.primary:hover {
background: rgba(255, 140, 0, 0.18);
border-color: rgba(255, 140, 0, 0.5);
}
html.dark .add-words button.primary,
body.dark .add-words button.primary {
background: rgba(255, 140, 0, 0.12);
border-color: rgba(255, 140, 0, 0.4);
}
html.dark .add-words button.primary:hover,
body.dark .add-words button.primary:hover {
background: rgba(255, 140, 0, 0.2);
border-color: rgba(255, 140, 0, 0.55);
}
/* Word controls: action row matches popup .word-actions-row / .word-action-btn */
.word-controls .row {
display: flex;
@@ -458,6 +521,30 @@ body.dark .list-item.selected {
background: rgba(239, 68, 68, 0.2);
}
/* Subdued primary/danger in list manager – outline style, less distracting */
.compact-btn.primary {
background: rgba(255, 140, 0, 0.1);
color: var(--accent);
border: 1px solid rgba(255, 140, 0, 0.35);
}
.compact-btn.primary:hover {
background: rgba(255, 140, 0, 0.18);
border-color: rgba(255, 140, 0, 0.5);
}
html.dark .compact-btn.primary,
body.dark .compact-btn.primary {
background: rgba(255, 140, 0, 0.12);
border-color: rgba(255, 140, 0, 0.4);
}
html.dark .compact-btn.primary:hover,
body.dark .compact-btn.primary:hover {
background: rgba(255, 140, 0, 0.2);
border-color: rgba(255, 140, 0, 0.55);
}
.word-controls input[type="text"],
.word-controls select {
flex: 1;

4
list-manager/list-manager.html
View File

@@ -36,8 +36,8 @@
<div class="panel-header">
<h2 data-i18n="tab_lists">Lists</h2>
<div class="panel-actions">
<button id="duplicateListBtn"><i class="fa-solid fa-clone"></i> <span data-i18n="duplicate">Duplicate</span></button>
<button id="mergeListsBtn"><i class="fa-solid fa-code-merge"></i> <span data-i18n="merge">Merge</span></button>
<button id="duplicateListBtn" class="ghost"><i class="fa-solid fa-clone"></i> <span data-i18n="duplicate">Duplicate</span></button>
<button id="mergeListsBtn" class="ghost"><i class="fa-solid fa-code-merge"></i> <span data-i18n="merge">Merge</span></button>
<button id="deleteListsBtn" class="danger"><i class="fa-solid fa-trash"></i> <span data-i18n="delete_selected">Delete</span></button>
</div>
</div>

44
popup/popup.css
View File

@@ -590,7 +590,7 @@ body.dark .header-logo {
opacity: 0.6;
}
/* Apply Button */
/* Apply Button – same subdued primary style as list-manager */
.apply-button {
width: 100%;
height: 32px;
@@ -598,9 +598,9 @@ body.dark .header-logo {
align-items: center;
justify-content: center;
gap: 8px;
background: var(--accent);
color: var(--accent-text);
border: none;
background: rgba(255, 140, 0, 0.1);
color: var(--accent);
border: 1px solid rgba(255, 140, 0, 0.35);
border-radius: 6px;
cursor: pointer;
font-size: var(--text-base);
@@ -610,7 +610,20 @@ body.dark .header-logo {
}
.apply-button:hover {
background: var(--accent-hover);
background: rgba(255, 140, 0, 0.18);
border-color: rgba(255, 140, 0, 0.5);
}
html.dark .apply-button,
body.dark .apply-button {
background: rgba(255, 140, 0, 0.12);
border-color: rgba(255, 140, 0, 0.4);
}
html.dark .apply-button:hover,
body.dark .apply-button:hover {
background: rgba(255, 140, 0, 0.2);
border-color: rgba(255, 140, 0, 0.55);
}
.apply-button i {
@@ -673,9 +686,9 @@ body.dark .header-logo {
display: flex;
align-items: center;
justify-content: center;
background: var(--accent);
color: var(--accent-text);
border: none;
background: rgba(255, 140, 0, 0.1);
color: var(--accent);
border: 1px solid rgba(255, 140, 0, 0.35);
border-radius: 8px;
cursor: pointer;
font-size: var(--text-md);
@@ -684,7 +697,20 @@ body.dark .header-logo {
}
.add-words-button:hover {
background: var(--accent-hover);
background: rgba(255, 140, 0, 0.18);
border-color: rgba(255, 140, 0, 0.5);
}
html.dark .add-words-button,
body.dark .add-words-button {
background: rgba(255, 140, 0, 0.12);
border-color: rgba(255, 140, 0, 0.4);
}
html.dark .add-words-button:hover,
body.dark .add-words-button:hover {
background: rgba(255, 140, 0, 0.2);
border-color: rgba(255, 140, 0, 0.55);
}
.add-words-button:disabled {