Skip to content

Commit 1529f0b

Browse files
author
Steam Deck User
committed
feat: styling
1 parent f67a846 commit 1529f0b

File tree

3 files changed

+279
-3
lines changed

3 files changed

+279
-3
lines changed

‎common/src/adobe_spectrum_style.h‎

Lines changed: 272 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,272 @@
1+
// Modified from: https://github.com/adobe/imgui
2+
/*
3+
The MIT License (MIT)
4+
5+
Copyright (c) 2014-2025 Omar Cornut
6+
7+
Permission is hereby granted, free of charge, to any person obtaining a copy
8+
of this software and associated documentation files (the "Software"), to deal
9+
in the Software without restriction, including without limitation the rights
10+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
11+
copies of the Software, and to permit persons to whom the Software is
12+
furnished to do so, subject to the following conditions:
13+
14+
The above copyright notice and this permission notice shall be included in all
15+
copies or substantial portions of the Software.
16+
17+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
18+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
19+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
20+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
21+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
22+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
23+
SOFTWARE.
24+
*/
25+
26+
/*
27+
Color definitions in ImGui are a good starting point,
28+
but do not cover all the intricacies of Spectrum's possible colors
29+
in controls and widgets.
30+
31+
One big difference is that ImGui communicates widget activity
32+
(hover, pressed) with their background, while spectrum uses a mix
33+
of background and border, with border being the most common choice.
34+
35+
Because of this, we reference extra colors in spectrum from
36+
imgui.cpp and imgui_widgets.cpp directly, and to make that work,
37+
we need to have them defined at here at compile time.
38+
*/
39+
40+
/// Pick one, or have one defined already.
41+
#if !defined(SPECTRUM_USE_LIGHT_THEME) && !defined(SPECTRUM_USE_DARK_THEME)
42+
//#define SPECTRUM_USE_LIGHT_THEME
43+
#define SPECTRUM_USE_DARK_THEME
44+
#endif
45+
46+
namespace Spectrum {
47+
namespace {
48+
// Unnamed namespace, since we only use this here.
49+
unsigned int Color(unsigned int c) {
50+
// add alpha.
51+
// also swap red and blue channel for some reason.
52+
// todo: figure out why, and fix it.
53+
const short a = 0xFF;
54+
const short r = (c >> 16) & 0xFF;
55+
const short g = (c >> 8) & 0xFF;
56+
const short b = (c >> 0) & 0xFF;
57+
return(a << 24)
58+
| (r << 0)
59+
| (g << 8)
60+
| (b << 16);
61+
}
62+
}
63+
64+
// all colors are from http://spectrum.corp.adobe.com/color.html
65+
namespace Static { // static colors
66+
const unsigned int NONE = 0x00000000; // transparent
67+
const unsigned int WHITE = Color(0xFFFFFF);
68+
const unsigned int BLACK = Color(0x000000);
69+
const unsigned int GRAY200 = Color(0xF4F4F4);
70+
const unsigned int GRAY300 = Color(0xEAEAEA);
71+
const unsigned int GRAY400 = Color(0xD3D3D3);
72+
const unsigned int GRAY500 = Color(0xBCBCBC);
73+
const unsigned int GRAY600 = Color(0x959595);
74+
const unsigned int GRAY700 = Color(0x767676);
75+
const unsigned int GRAY800 = Color(0x505050);
76+
const unsigned int GRAY900 = Color(0x323232);
77+
const unsigned int BLUE400 = Color(0x378EF0);
78+
const unsigned int BLUE500 = Color(0x2680EB);
79+
const unsigned int BLUE600 = Color(0x1473E6);
80+
const unsigned int BLUE700 = Color(0x0D66D0);
81+
const unsigned int RED400 = Color(0xEC5B62);
82+
const unsigned int RED500 = Color(0xE34850);
83+
const unsigned int RED600 = Color(0xD7373F);
84+
const unsigned int RED700 = Color(0xC9252D);
85+
const unsigned int ORANGE400 = Color(0xF29423);
86+
const unsigned int ORANGE500 = Color(0xE68619);
87+
const unsigned int ORANGE600 = Color(0xDA7B11);
88+
const unsigned int ORANGE700 = Color(0xCB6F10);
89+
const unsigned int GREEN400 = Color(0x33AB84);
90+
const unsigned int GREEN500 = Color(0x2D9D78);
91+
const unsigned int GREEN600 = Color(0x268E6C);
92+
const unsigned int GREEN700 = Color(0x12805C);
93+
}
94+
95+
#ifdef SPECTRUM_USE_LIGHT_THEME
96+
const unsigned int GRAY50 = Color(0xFFFFFF);
97+
const unsigned int GRAY75 = Color(0xFAFAFA);
98+
const unsigned int GRAY100 = Color(0xF5F5F5);
99+
const unsigned int GRAY200 = Color(0xEAEAEA);
100+
const unsigned int GRAY300 = Color(0xE1E1E1);
101+
const unsigned int GRAY400 = Color(0xCACACA);
102+
const unsigned int GRAY500 = Color(0xB3B3B3);
103+
const unsigned int GRAY600 = Color(0x8E8E8E);
104+
const unsigned int GRAY700 = Color(0x707070);
105+
const unsigned int GRAY800 = Color(0x4B4B4B);
106+
const unsigned int GRAY900 = Color(0x2C2C2C);
107+
const unsigned int BLUE400 = Color(0x2680EB);
108+
const unsigned int BLUE500 = Color(0x1473E6);
109+
const unsigned int BLUE600 = Color(0x0D66D0);
110+
const unsigned int BLUE700 = Color(0x095ABA);
111+
const unsigned int RED400 = Color(0xE34850);
112+
const unsigned int RED500 = Color(0xD7373F);
113+
const unsigned int RED600 = Color(0xC9252D);
114+
const unsigned int RED700 = Color(0xBB121A);
115+
const unsigned int ORANGE400 = Color(0xE68619);
116+
const unsigned int ORANGE500 = Color(0xDA7B11);
117+
const unsigned int ORANGE600 = Color(0xCB6F10);
118+
const unsigned int ORANGE700 = Color(0xBD640D);
119+
const unsigned int GREEN400 = Color(0x2D9D78);
120+
const unsigned int GREEN500 = Color(0x268E6C);
121+
const unsigned int GREEN600 = Color(0x12805C);
122+
const unsigned int GREEN700 = Color(0x107154);
123+
const unsigned int INDIGO400 = Color(0x6767EC);
124+
const unsigned int INDIGO500 = Color(0x5C5CE0);
125+
const unsigned int INDIGO600 = Color(0x5151D3);
126+
const unsigned int INDIGO700 = Color(0x4646C6);
127+
const unsigned int CELERY400 = Color(0x44B556);
128+
const unsigned int CELERY500 = Color(0x3DA74E);
129+
const unsigned int CELERY600 = Color(0x379947);
130+
const unsigned int CELERY700 = Color(0x318B40);
131+
const unsigned int MAGENTA400 = Color(0xD83790);
132+
const unsigned int MAGENTA500 = Color(0xCE2783);
133+
const unsigned int MAGENTA600 = Color(0xBC1C74);
134+
const unsigned int MAGENTA700 = Color(0xAE0E66);
135+
const unsigned int YELLOW400 = Color(0xDFBF00);
136+
const unsigned int YELLOW500 = Color(0xD2B200);
137+
const unsigned int YELLOW600 = Color(0xC4A600);
138+
const unsigned int YELLOW700 = Color(0xB79900);
139+
const unsigned int FUCHSIA400 = Color(0xC038CC);
140+
const unsigned int FUCHSIA500 = Color(0xB130BD);
141+
const unsigned int FUCHSIA600 = Color(0xA228AD);
142+
const unsigned int FUCHSIA700 = Color(0x93219E);
143+
const unsigned int SEAFOAM400 = Color(0x1B959A);
144+
const unsigned int SEAFOAM500 = Color(0x16878C);
145+
const unsigned int SEAFOAM600 = Color(0x0F797D);
146+
const unsigned int SEAFOAM700 = Color(0x096C6F);
147+
const unsigned int CHARTREUSE400 = Color(0x85D044);
148+
const unsigned int CHARTREUSE500 = Color(0x7CC33F);
149+
const unsigned int CHARTREUSE600 = Color(0x73B53A);
150+
const unsigned int CHARTREUSE700 = Color(0x6AA834);
151+
const unsigned int PURPLE400 = Color(0x9256D9);
152+
const unsigned int PURPLE500 = Color(0x864CCC);
153+
const unsigned int PURPLE600 = Color(0x7A42BF);
154+
const unsigned int PURPLE700 = Color(0x6F38B1);
155+
#endif
156+
#ifdef SPECTRUM_USE_DARK_THEME
157+
const unsigned int GRAY50 = Color(0x252525);
158+
const unsigned int GRAY75 = Color(0x2F2F2F);
159+
const unsigned int GRAY100 = Color(0x323232);
160+
const unsigned int GRAY200 = Color(0x393939);
161+
const unsigned int GRAY300 = Color(0x3E3E3E);
162+
const unsigned int GRAY400 = Color(0x4D4D4D);
163+
const unsigned int GRAY500 = Color(0x5C5C5C);
164+
const unsigned int GRAY600 = Color(0x7B7B7B);
165+
const unsigned int GRAY700 = Color(0x999999);
166+
const unsigned int GRAY800 = Color(0xCDCDCD);
167+
const unsigned int GRAY900 = Color(0xFFFFFF);
168+
const unsigned int BLUE400 = Color(0x2680EB);
169+
const unsigned int BLUE500 = Color(0x378EF0);
170+
const unsigned int BLUE600 = Color(0x4B9CF5);
171+
const unsigned int BLUE700 = Color(0x5AA9FA);
172+
const unsigned int RED400 = Color(0xE34850);
173+
const unsigned int RED500 = Color(0xEC5B62);
174+
const unsigned int RED600 = Color(0xF76D74);
175+
const unsigned int RED700 = Color(0xFF7B82);
176+
const unsigned int ORANGE400 = Color(0xE68619);
177+
const unsigned int ORANGE500 = Color(0xF29423);
178+
const unsigned int ORANGE600 = Color(0xF9A43F);
179+
const unsigned int ORANGE700 = Color(0xFFB55B);
180+
const unsigned int GREEN400 = Color(0x2D9D78);
181+
const unsigned int GREEN500 = Color(0x33AB84);
182+
const unsigned int GREEN600 = Color(0x39B990);
183+
const unsigned int GREEN700 = Color(0x3FC89C);
184+
const unsigned int INDIGO400 = Color(0x6767EC);
185+
const unsigned int INDIGO500 = Color(0x7575F1);
186+
const unsigned int INDIGO600 = Color(0x8282F6);
187+
const unsigned int INDIGO700 = Color(0x9090FA);
188+
const unsigned int CELERY400 = Color(0x44B556);
189+
const unsigned int CELERY500 = Color(0x4BC35F);
190+
const unsigned int CELERY600 = Color(0x51D267);
191+
const unsigned int CELERY700 = Color(0x58E06F);
192+
const unsigned int MAGENTA400 = Color(0xD83790);
193+
const unsigned int MAGENTA500 = Color(0xE2499D);
194+
const unsigned int MAGENTA600 = Color(0xEC5AAA);
195+
const unsigned int MAGENTA700 = Color(0xF56BB7);
196+
const unsigned int YELLOW400 = Color(0xDFBF00);
197+
const unsigned int YELLOW500 = Color(0xEDCC00);
198+
const unsigned int YELLOW600 = Color(0xFAD900);
199+
const unsigned int YELLOW700 = Color(0xFFE22E);
200+
const unsigned int FUCHSIA400 = Color(0xC038CC);
201+
const unsigned int FUCHSIA500 = Color(0xCF3EDC);
202+
const unsigned int FUCHSIA600 = Color(0xD951E5);
203+
const unsigned int FUCHSIA700 = Color(0xE366EF);
204+
const unsigned int SEAFOAM400 = Color(0x1B959A);
205+
const unsigned int SEAFOAM500 = Color(0x20A3A8);
206+
const unsigned int SEAFOAM600 = Color(0x23B2B8);
207+
const unsigned int SEAFOAM700 = Color(0x26C0C7);
208+
const unsigned int CHARTREUSE400 = Color(0x85D044);
209+
const unsigned int CHARTREUSE500 = Color(0x8EDE49);
210+
const unsigned int CHARTREUSE600 = Color(0x9BEC54);
211+
const unsigned int CHARTREUSE700 = Color(0xA3F858);
212+
const unsigned int PURPLE400 = Color(0x9256D9);
213+
const unsigned int PURPLE500 = Color(0x9D64E1);
214+
const unsigned int PURPLE600 = Color(0xA873E9);
215+
const unsigned int PURPLE700 = Color(0xB483F0);
216+
#endif
217+
}
218+
static void StyleAdobeSpectrum() {
219+
ImGuiStyle* style = &ImGui::GetStyle();
220+
style->GrabRounding = 4.0f;
221+
222+
ImVec4* colors = style->Colors;
223+
colors[ImGuiCol_Text] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY800); // text on hovered controls is gray900
224+
colors[ImGuiCol_TextDisabled] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY500);
225+
colors[ImGuiCol_WindowBg] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY100);
226+
colors[ImGuiCol_ChildBg] = ImVec4(0.00f, 0.00f, 0.00f, 0.00f);
227+
colors[ImGuiCol_PopupBg] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY50); // not sure about this. Note: applies to tooltips too.
228+
colors[ImGuiCol_Border] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY300);
229+
colors[ImGuiCol_BorderShadow] = ImGui::ColorConvertU32ToFloat4(Spectrum::Static::NONE); // We don't want shadows. Ever.
230+
colors[ImGuiCol_FrameBg] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY75); // this isnt right, spectrum does not do this, but it's a good fallback
231+
colors[ImGuiCol_FrameBgHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY50);
232+
colors[ImGuiCol_FrameBgActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY200);
233+
colors[ImGuiCol_TitleBg] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY300); // those titlebar values are totally made up, spectrum does not have this.
234+
colors[ImGuiCol_TitleBgActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY200);
235+
colors[ImGuiCol_TitleBgCollapsed] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY400);
236+
colors[ImGuiCol_MenuBarBg] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY100);
237+
colors[ImGuiCol_ScrollbarBg] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY100); // same as regular background
238+
colors[ImGuiCol_ScrollbarGrab] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY400);
239+
colors[ImGuiCol_ScrollbarGrabHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY600);
240+
colors[ImGuiCol_ScrollbarGrabActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY700);
241+
colors[ImGuiCol_CheckMark] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE500);
242+
colors[ImGuiCol_SliderGrab] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY700);
243+
colors[ImGuiCol_SliderGrabActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY800);
244+
colors[ImGuiCol_Button] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY75); // match default button to Spectrum's 'Action Button'.
245+
colors[ImGuiCol_ButtonHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY50);
246+
colors[ImGuiCol_ButtonActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY200);
247+
colors[ImGuiCol_Header] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE400);
248+
colors[ImGuiCol_HeaderHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE500);
249+
colors[ImGuiCol_HeaderActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE600);
250+
colors[ImGuiCol_Separator] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY400);
251+
colors[ImGuiCol_SeparatorHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY600);
252+
colors[ImGuiCol_SeparatorActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY700);
253+
colors[ImGuiCol_ResizeGrip] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY400);
254+
colors[ImGuiCol_ResizeGripHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY600);
255+
colors[ImGuiCol_ResizeGripActive] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY700);
256+
colors[ImGuiCol_PlotLines] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE400);
257+
colors[ImGuiCol_PlotLinesHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE600);
258+
colors[ImGuiCol_PlotHistogram] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE400);
259+
colors[ImGuiCol_PlotHistogramHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE600);
260+
colors[ImGuiCol_TextSelectedBg] = ImGui::ColorConvertU32ToFloat4((Spectrum::BLUE400 & 0x00FFFFFF) | 0x33000000);
261+
colors[ImGuiCol_DragDropTarget] = ImVec4(1.00f, 1.00f, 0.00f, 0.90f);
262+
//colors[ImGuiCol_NavCursor] = ImGui::ColorConvertU32ToFloat4((Spectrum::GRAY900 & 0x00FFFFFF) | 0x0A000000);
263+
colors[ImGuiCol_NavWindowingHighlight] = ImVec4(1.00f, 1.00f, 1.00f, 0.70f);
264+
colors[ImGuiCol_NavWindowingDimBg] = ImVec4(0.80f, 0.80f, 0.80f, 0.20f);
265+
colors[ImGuiCol_ModalWindowDimBg] = ImVec4(0.20f, 0.20f, 0.20f, 0.35f);
266+
colors[ImGuiCol_CheckMark] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY50);
267+
colors[ImGuiCol_Tab] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY300);
268+
colors[ImGuiCol_TabSelected] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE500);
269+
colors[ImGuiCol_TabHovered] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE700);
270+
colors[ImGuiCol_TabDimmed] = ImGui::ColorConvertU32ToFloat4(Spectrum::GRAY400);
271+
colors[ImGuiCol_TabDimmedSelected] = ImGui::ColorConvertU32ToFloat4(Spectrum::BLUE700);
272+
}

common/src/style.h renamed to common/src/implot_style.h

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
// Modified
12
/*MIT License
23
34
Copyright (c) 2022 Evan Pezent & ImPlot Community
@@ -21,7 +22,7 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
2122
SOFTWARE.
2223
*/
2324

24-
void StyeColorsApp()
25+
void StyleImPlot()
2526
{
2627
static const ImVec4 bg_dark = ImVec4(0.15f, 0.16f, 0.21f, 1.00f);
2728
static const ImVec4 bg_mid = ImVec4(0.20f, 0.21f, 0.27f, 1.00f);

‎common/src/render.cpp‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -112,11 +112,14 @@ static void setup_imgui() {
112112
io.ConfigFlags &= ~ImGuiConfigFlags_ViewportsEnable;
113113
}
114114

115-
#include "style.h"
115+
#include "implot_style.h"
116+
#include "adobe_spectrum_style.h"
116117
void render_init(FILE *fdInput,FILE *fdOutput) {
117118
fdIn = fdInput;
118119
fdOut = fdOutput;
119-
StyeColorsApp();
120+
//StyleImPlot();
121+
//StyleAdobeSpectrum();
122+
ImGui::StyleColorsDark();
120123
setup_imgui();
121124

122125
ImPlot::CreateContext();

0 commit comments

Comments
 (0)