Skip to content

Commit 7f2d747

Browse files
committed
Switch question buttons to yellow theme
Introduce --question-yellow and --question-yellow-hover (light + dark variants) and remove the obsolete --_placeholder-color. Update question buttons (submit/reset/show) to use the new yellow background and hover colors instead of the previous blue, and set a readable text color for these buttons in dark theme to improve contrast.
1 parent a331c98 commit 7f2d747

1 file changed

Lines changed: 11 additions & 3 deletions

File tree

src/teachbooks_questions/_static/teachbooks_questions.css

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@
1010
--question-gray-border: #d0d0d0;
1111
--question-white: #eeeeee;
1212
--question-white-border: #c6c6c6;
13-
--_placeholder-color: var(--pst-color-text-base);
13+
--question-yellow: #f7e9c4;
14+
--question-yellow-hover: #e6d7b0;
1415
}
1516

1617
html[data-theme="dark"] {
@@ -24,6 +25,8 @@ html[data-theme="dark"] {
2425
--question-gray-border: #555555;
2526
--question-white: #666666;
2627
--question-white-border: #777777;
28+
--question-yellow: #d6b55a;
29+
--question-yellow-hover: #eac96e;
2730
}
2831

2932
/* General style for the question options */
@@ -127,17 +130,22 @@ section.question-buttons div.sd-card.show-button {
127130

128131
/* Button‑like visuals */
129132
border: 2px solid var(--question-gray-border);
130-
background-color: var(--question-blue);
133+
background-color: var(--question-yellow);
131134
transition:
132135
background 0.15s ease,
133136
border-color 0.15s ease,
134137
box-shadow 0.15s ease,
135138
transform 0.1s ease;
136139
}
140+
html[data-theme="dark"] section.question-buttons div.sd-card.submit-button,
141+
html[data-theme="dark"] section.question-buttons div.sd-card.reset-button,
142+
html[data-theme="dark"] section.question-buttons div.sd-card.show-button {
143+
color: rgb(34, 40, 50);
144+
}
137145
section.question-buttons div.sd-card.submit-button:hover,
138146
section.question-buttons div.sd-card.reset-button:hover,
139147
section.question-buttons div.sd-card.show-button:hover {
140-
background: var(--question-blue-hover);
148+
background: var(--question-yellow-hover);
141149
border-color: var(--question-white-border);
142150
transform: translateY(-2px);
143151
}

0 commit comments

Comments
 (0)