change tab colors from green to blue/gray to reduce visual competition

- tabs now use neutral gray (inactive) and blue (active) instead of green
- prevents distraction from green translate button (call-to-action)
- inactive tabs: light gray background with dark gray text
- active tab: blue background with white text
- hover: slightly darker gray
- updated both builtin and pico CSS versions
This commit is contained in:
Russell Ballestrini 2025-07-12 11:37:22 -04:00
parent 3bd518ff20
commit 97af1d9b1a
2 changed files with 22 additions and 10 deletions

View file

@ -404,10 +404,9 @@ dialog#translate-modal {
display: block;
padding: 12px 16px;
text-decoration: none;
color: #4CAF50;
background: #4CAF50;
color: white;
border: 2px solid #4CAF50;
color: #6c757d;
background: #f8f9fa;
border: 2px solid #dee2e6;
border-bottom: none;
border-radius: 6px 6px 0 0;
text-align: center;
@ -417,7 +416,14 @@ dialog#translate-modal {
}
.translate-tab-nav a:hover {
background: #45a049;
background: #e9ecef;
color: #495057;
}
.translate-tab-nav a[aria-selected="true"] {
background: #007bff;
color: white;
border-color: #007bff;
}
/* Form elements */

View file

@ -447,10 +447,9 @@ dialog#translate-modal {
display: block;
padding: 12px 16px;
text-decoration: none;
color: #4CAF50;
background: #4CAF50;
color: white;
border: 2px solid #4CAF50;
color: #6c757d;
background: #f8f9fa;
border: 2px solid #dee2e6;
border-bottom: none;
border-radius: 6px 6px 0 0;
text-align: center;
@ -460,7 +459,14 @@ dialog#translate-modal {
}
.translate-tab-nav a:hover {
background: #45a049;
background: #e9ecef;
color: #495057;
}
.translate-tab-nav a[aria-selected="true"] {
background: #007bff;
color: white;
border-color: #007bff;
}
/* Form elements */