Skip to content

Commit e62f629

Browse files
tjprescotttjprescott
committed
Style tweaks.
1 parent bcfad75 commit e62f629

File tree

5 files changed

+64
-48
lines changed

5 files changed

+64
-48
lines changed

‎src/dotnet/APIView/APIViewWeb/Client/css/shared/theme-colors.scss‎

Lines changed: 49 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
/*----Diagnostic Details Link------------------------------------*/
2727
--details-link-color: #{bootstrap.$primary};
2828
--details-link-active-hover: #00CBEB;
29-
--link-visited: #{bootstrap.shade-color(bootstrap.$primary, 40%)};
29+
--details-link-visited: #{bootstrap.shade-color(bootstrap.$primary, 40%)};
3030
/*----Shadows and Glows------------------------------------------*/
3131
--outer-glow: #{bootstrap.tint-color(bootstrap.$primary, 80%)};
3232
--shadow-color: rgba(#{bootstrap.$black}, .15);
@@ -86,6 +86,22 @@
8686
--code-delta: #fdefc6;
8787
--dark-overlay: rgba(0, 0, 0, 0.1);
8888
--client-type-bg: rgba(13, 110, 253, 0.08);
89+
/*----Severity Badges----------------------------------------*/
90+
--severity-question-bg: #F0F7FF;
91+
--severity-question-text: #1E40AF;
92+
--severity-question-border: #B3D4FF;
93+
--severity-suggestion-bg: #F0F0F0;
94+
--severity-suggestion-text: #616161;
95+
--severity-suggestion-border: #E0E0E0;
96+
--severity-should-fix-bg: #FFF9F5;
97+
--severity-should-fix-text: #8A3707;
98+
--severity-should-fix-border: #FDCFB4;
99+
--severity-must-fix-bg: #FDF3F4;
100+
--severity-must-fix-text: #B10E1C;
101+
--severity-must-fix-border: #EEACB2;
102+
/*----Toggle Switch------------------------------------------*/
103+
--toggle-switch-off: #6c757d;
104+
--toggle-switch-on: #ffffff;
89105
/*----SVG-------------------------------------------------*/
90106
--svg-check-box: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
91107
--svg-switch: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
@@ -180,6 +196,22 @@
180196
--code-delta: #4c401a;
181197
--dark-overlay: rgba(0, 0, 0, 0.3);
182198
--client-type-bg: rgba(0, 132, 255, 0.25);
199+
/*----Severity Badges----------------------------------------*/
200+
--severity-question-bg: #1E3A8A;
201+
--severity-question-text: #BFDBFE;
202+
--severity-question-border: #3B82F6;
203+
--severity-suggestion-bg: #374151;
204+
--severity-suggestion-text: #D1D5DB;
205+
--severity-suggestion-border: #6B7280;
206+
--severity-should-fix-bg: #92400E;
207+
--severity-should-fix-text: #FED7AA;
208+
--severity-should-fix-border: #F59E0B;
209+
--severity-must-fix-bg: #991B1B;
210+
--severity-must-fix-text: #FECACA;
211+
--severity-must-fix-border: #EF4444;
212+
/*----Toggle Switch------------------------------------------*/
213+
--toggle-switch-off: #6c757d;
214+
--toggle-switch-on: #ffffff;
183215
/*----SVG-------------------------------------------------*/
184216
--svg-check-box: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
185217
--svg-switch: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
@@ -276,6 +308,22 @@
276308
--code-delta: #695b32;
277309
--dark-overlay: rgba(0, 0, 0, 0.3);
278310
--client-type-bg: rgba(255, 189, 0, 0.15);
311+
/*----Severity Badges----------------------------------------*/
312+
--severity-question-bg: #1E3A8A;
313+
--severity-question-text: #BFDBFE;
314+
--severity-question-border: #3B82F6;
315+
--severity-suggestion-bg: #374151;
316+
--severity-suggestion-text: #D1D5DB;
317+
--severity-suggestion-border: #6B7280;
318+
--severity-should-fix-bg: #92400E;
319+
--severity-should-fix-text: #FED7AA;
320+
--severity-should-fix-border: #F59E0B;
321+
--severity-must-fix-bg: #991B1B;
322+
--severity-must-fix-text: #FECACA;
323+
--severity-must-fix-border: #EF4444;
324+
/*----Toggle Switch------------------------------------------*/
325+
--toggle-switch-off: #6c757d;
326+
--toggle-switch-on: #ffffff;
279327
/*----SVG-------------------------------------------------*/
280328
--svg-check-box: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
281329
--svg-switch: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");

‎src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-severity/comment-severity.component.scss‎

Lines changed: 8 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -36,44 +36,21 @@
3636

3737
// Severity badge colors
3838
.severity-question {
39-
background-color: #e3f2fd;
40-
color: #1976d2;
39+
background-color: var(--severity-question-bg);
40+
color: var(--severity-question-text);
4141
}
4242

4343
.severity-suggestion {
44-
background-color: #f3e5f5;
45-
color: #7b1fa2;
44+
background-color: var(--severity-suggestion-bg);
45+
color: var(--severity-suggestion-text);
4646
}
4747

4848
.severity-should-fix {
49-
background-color: #fff3e0;
50-
color: #e65100;
49+
background-color: var(--severity-should-fix-bg);
50+
color: var(--severity-should-fix-text);
5151
}
5252

5353
.severity-must-fix {
54-
background-color: #ffebee;
55-
color: #c62828;
56-
}
57-
58-
// Dark mode support
59-
:host-context(.dark-mode) {
60-
.severity-question {
61-
background-color: rgba(33, 150, 243, 0.2);
62-
color: #90caf9;
63-
}
64-
65-
.severity-suggestion {
66-
background-color: rgba(156, 39, 176, 0.2);
67-
color: #ce93d8;
68-
}
69-
70-
.severity-should-fix {
71-
background-color: rgba(255, 152, 0, 0.2);
72-
color: #ffb74d;
73-
}
74-
75-
.severity-must-fix {
76-
background-color: rgba(244, 67, 54, 0.2);
77-
color: #ef5350;
78-
}
54+
background-color: var(--severity-must-fix-bg);
55+
color: var(--severity-must-fix-text);
7956
}

‎src/dotnet/APIView/ClientSPA/src/app/_components/shared/comment-thread/comment-thread.component.scss‎

Lines changed: 4 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -144,10 +144,10 @@
144144
.severity-edit-icon { font-size: .7rem; opacity: .7; transition: all .2s; }
145145
}
146146

147-
.severity-question { background-color: #F0F7FF; color: #1E40AF; border-color: #B3D4FF; }
148-
.severity-suggestion { background-color: #F0F0F0; color: #616161; border-color: #E0E0E0; }
149-
.severity-should-fix { background-color: #FFF9F5; color: #8A3707; border-color: #FDCFB4; }
150-
.severity-must-fix { background-color: #FDF3F4; color: #B10E1C; border-color: #EEACB2; }
147+
.severity-question { background-color: var(--severity-question-bg); color: var(--severity-question-text); border-color: var(--severity-question-border); }
148+
.severity-suggestion { background-color: var(--severity-suggestion-bg); color: var(--severity-suggestion-text); border-color: var(--severity-suggestion-border); }
149+
.severity-should-fix { background-color: var(--severity-should-fix-bg); color: var(--severity-should-fix-text); border-color: var(--severity-should-fix-border); }
150+
.severity-must-fix { background-color: var(--severity-must-fix-bg); color: var(--severity-must-fix-text); border-color: var(--severity-must-fix-border); }
151151

152152
.severity-edit-container { display: inline-block; position: relative; }
153153

@@ -159,15 +159,6 @@
159159
}
160160
}
161161

162-
:host-context(.dark-theme), :host-context(.dark-solarized-theme) {
163-
::ng-deep {
164-
.severity-question { background-color: #1E3A8A; color: #BFDBFE; border-color: #3B82F6; }
165-
.severity-suggestion { background-color: #374151; color: #D1D5DB; border-color: #6B7280; }
166-
.severity-should-fix { background-color: #92400E; color: #FED7AA; border-color: #F59E0B; }
167-
.severity-must-fix { background-color: #991B1B; color: #FECACA; border-color: #EF4444; }
168-
}
169-
}
170-
171162

172163
::ng-deep .ai-info-overlay {
173164
&.p-popover {

‎src/dotnet/APIView/ClientSPA/src/app/_components/shared/editor/editor.component.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
}
3333

3434
.editor-toolbar i.separator {
35-
border-left: 1px solid #d9d9d9;
35+
border-left: 1px solid var(--border-color);
3636
border-right: 1px solid var(--border-color);
3737
}
3838

‎src/dotnet/APIView/ClientSPA/src/ng-prime-overrides.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -912,7 +912,7 @@ p-inputswitch, .p-inputswitch, .p-toggleswitch {
912912
}
913913

914914
.p-toggleswitch-handle {
915-
background: #6c757d !important;
915+
background: var(--toggle-switch-off) !important;
916916
width: 16px !important;
917917
height: 16px !important;
918918
left: 2px !important;
@@ -925,7 +925,7 @@ p-inputswitch, .p-inputswitch, .p-toggleswitch {
925925

926926
.p-toggleswitch-checked .p-toggleswitch-handle {
927927
left: 20px !important;
928-
background: #ffffff !important;
928+
background: var(--toggle-switch-on) !important;
929929
}
930930

931931
.p-inputswitch .p-inputswitch-slider:before,

0 commit comments

Comments
 (0)