diff options
author | Jaakko Keränen <jaakko.keranen@iki.fi> | 2021-02-23 19:04:42 +0200 |
---|---|---|
committer | Jaakko Keränen <jaakko.keranen@iki.fi> | 2021-02-23 19:04:42 +0200 |
commit | 78ab2ead2f907ea869cc71fb9900bdfcb1bf2834 (patch) | |
tree | 9abee49224a244e510eaf47f501d6b6af951508c | |
parent | 8f7a1033f37be1a4d47c626ffb36a28385340699 (diff) |
SidebarWidget: Improved appearance
Added a color for sidebar background. Removed the right-edge separator line; instead, use color to separate. Page outline uses bold font for level 1 headings.
-rw-r--r-- | src/ui/color.c | 21 | ||||
-rw-r--r-- | src/ui/color.h | 1 | ||||
-rw-r--r-- | src/ui/sidebarwidget.c | 24 |
3 files changed, 30 insertions, 16 deletions
diff --git a/src/ui/color.c b/src/ui/color.c index 3adf857d..ab95906d 100644 --- a/src/ui/color.c +++ b/src/ui/color.c | |||
@@ -79,6 +79,8 @@ void setThemePalette_Color(enum iColorTheme theme) { | |||
79 | copy_(uiBackgroundPressed_ColorId, orange_ColorId); | 79 | copy_(uiBackgroundPressed_ColorId, orange_ColorId); |
80 | copy_(uiBackgroundSelected_ColorId, teal_ColorId); | 80 | copy_(uiBackgroundSelected_ColorId, teal_ColorId); |
81 | copy_(uiBackgroundFramelessHover_ColorId, teal_ColorId); | 81 | copy_(uiBackgroundFramelessHover_ColorId, teal_ColorId); |
82 | set_Color(uiBackgroundSidebar_ColorId, | ||
83 | mix_Color(get_Color(black_ColorId), get_Color(gray25_ColorId), 0.66f)); | ||
82 | copy_(uiText_ColorId, gray75_ColorId); | 84 | copy_(uiText_ColorId, gray75_ColorId); |
83 | copy_(uiTextPressed_ColorId, black_ColorId); | 85 | copy_(uiTextPressed_ColorId, black_ColorId); |
84 | copy_(uiTextStrong_ColorId, white_ColorId); | 86 | copy_(uiTextStrong_ColorId, white_ColorId); |
@@ -125,6 +127,8 @@ void setThemePalette_Color(enum iColorTheme theme) { | |||
125 | copy_(uiBackgroundPressed_ColorId, orange_ColorId); | 127 | copy_(uiBackgroundPressed_ColorId, orange_ColorId); |
126 | copy_(uiBackgroundSelected_ColorId, teal_ColorId); | 128 | copy_(uiBackgroundSelected_ColorId, teal_ColorId); |
127 | copy_(uiBackgroundFramelessHover_ColorId, teal_ColorId); | 129 | copy_(uiBackgroundFramelessHover_ColorId, teal_ColorId); |
130 | set_Color(uiBackgroundSidebar_ColorId, | ||
131 | mix_Color(get_Color(black_ColorId), get_Color(gray25_ColorId), 0.66f)); | ||
128 | copy_(uiText_ColorId, gray75_ColorId); | 132 | copy_(uiText_ColorId, gray75_ColorId); |
129 | copy_(uiTextPressed_ColorId, black_ColorId); | 133 | copy_(uiTextPressed_ColorId, black_ColorId); |
130 | copy_(uiTextStrong_ColorId, white_ColorId); | 134 | copy_(uiTextStrong_ColorId, white_ColorId); |
@@ -170,6 +174,8 @@ void setThemePalette_Color(enum iColorTheme theme) { | |||
170 | copy_(uiBackgroundSelected_ColorId, orange_ColorId); | 174 | copy_(uiBackgroundSelected_ColorId, orange_ColorId); |
171 | copy_(uiBackgroundPressed_ColorId, cyan_ColorId); | 175 | copy_(uiBackgroundPressed_ColorId, cyan_ColorId); |
172 | copy_(uiBackgroundFramelessHover_ColorId, orange_ColorId); | 176 | copy_(uiBackgroundFramelessHover_ColorId, orange_ColorId); |
177 | set_Color(uiBackgroundSidebar_ColorId, | ||
178 | mix_Color(get_Color(white_ColorId), get_Color(gray75_ColorId), 0.5f)); | ||
173 | copy_(uiText_ColorId, black_ColorId); | 179 | copy_(uiText_ColorId, black_ColorId); |
174 | copy_(uiTextStrong_ColorId, black_ColorId); | 180 | copy_(uiTextStrong_ColorId, black_ColorId); |
175 | copy_(uiTextDim_ColorId, gray25_ColorId); | 181 | copy_(uiTextDim_ColorId, gray25_ColorId); |
@@ -215,6 +221,8 @@ void setThemePalette_Color(enum iColorTheme theme) { | |||
215 | copy_(uiBackgroundSelected_ColorId, orange_ColorId); | 221 | copy_(uiBackgroundSelected_ColorId, orange_ColorId); |
216 | copy_(uiBackgroundPressed_ColorId, cyan_ColorId); | 222 | copy_(uiBackgroundPressed_ColorId, cyan_ColorId); |
217 | copy_(uiBackgroundFramelessHover_ColorId, orange_ColorId); | 223 | copy_(uiBackgroundFramelessHover_ColorId, orange_ColorId); |
224 | set_Color(uiBackgroundSidebar_ColorId, | ||
225 | mix_Color(get_Color(white_ColorId), get_Color(gray75_ColorId), 0.5f)); | ||
218 | set_Color(uiText_ColorId, | 226 | set_Color(uiText_ColorId, |
219 | mix_Color(get_Color(black_ColorId), get_Color(gray25_ColorId), 0.5f)); | 227 | mix_Color(get_Color(black_ColorId), get_Color(gray25_ColorId), 0.5f)); |
220 | copy_(uiTextPressed_ColorId, black_ColorId); | 228 | copy_(uiTextPressed_ColorId, black_ColorId); |
@@ -260,14 +268,15 @@ void setThemePalette_Color(enum iColorTheme theme) { | |||
260 | mix_Color(get_Color(uiText_ColorId), | 268 | mix_Color(get_Color(uiText_ColorId), |
261 | get_Color(uiIcon_ColorId), | 269 | get_Color(uiIcon_ColorId), |
262 | isDark_ColorTheme(theme) ? 0.5f : 0.75f)); | 270 | isDark_ColorTheme(theme) ? 0.5f : 0.75f)); |
263 | set_Color(uiBackgroundUnfocusedSelection_ColorId, mix_Color(get_Color(uiBackground_ColorId), | 271 | set_Color(uiBackgroundUnfocusedSelection_ColorId, |
264 | get_Color(uiBackgroundSelected_ColorId), | 272 | mix_Color(get_Color(uiBackground_ColorId), |
265 | isDark_ColorTheme(theme) ? 0.25f : 0.66f)); | 273 | get_Color(uiBackgroundSelected_ColorId), |
274 | isDark_ColorTheme(theme) ? 0.25f : 0.66f)); | ||
266 | setHsl_Color(uiBackgroundFolder_ColorId, | 275 | setHsl_Color(uiBackgroundFolder_ColorId, |
267 | addSatLum_HSLColor(get_HSLColor(uiBackground_ColorId), | 276 | addSatLum_HSLColor(get_HSLColor(uiBackgroundSidebar_ColorId), |
268 | 0, | 277 | 0, |
269 | theme == pureBlack_ColorTheme ? 0.075 | 278 | theme == pureBlack_ColorTheme ? -1 |
270 | : theme == dark_ColorTheme ? -0.033 | 279 | : theme == dark_ColorTheme ? -0.04 |
271 | : -0.075)); | 280 | : -0.075)); |
272 | palette_[uiMarked_ColorId].a = 128; | 281 | palette_[uiMarked_ColorId].a = 128; |
273 | palette_[uiMatching_ColorId].a = 128; | 282 | palette_[uiMatching_ColorId].a = 128; |
diff --git a/src/ui/color.h b/src/ui/color.h index 8039506f..f65600d2 100644 --- a/src/ui/color.h +++ b/src/ui/color.h | |||
@@ -107,6 +107,7 @@ enum iColorId { | |||
107 | uiTextDim_ColorId, | 107 | uiTextDim_ColorId, |
108 | uiSubheading_ColorId, | 108 | uiSubheading_ColorId, |
109 | uiTextAppTitle_ColorId, | 109 | uiTextAppTitle_ColorId, |
110 | uiBackgroundSidebar_ColorId, | ||
110 | 111 | ||
111 | /* content theme colors */ | 112 | /* content theme colors */ |
112 | tmFirst_ColorId, | 113 | tmFirst_ColorId, |
diff --git a/src/ui/sidebarwidget.c b/src/ui/sidebarwidget.c index 9ca09fe8..e7eb6bde 100644 --- a/src/ui/sidebarwidget.c +++ b/src/ui/sidebarwidget.c | |||
@@ -212,6 +212,7 @@ static void updateItems_SidebarWidget_(iSidebarWidget *d) { | |||
212 | item->id = index_ArrayConstIterator(&i); | 212 | item->id = index_ArrayConstIterator(&i); |
213 | setRange_String(&item->label, head->text); | 213 | setRange_String(&item->label, head->text); |
214 | item->indent = head->level * 5 * gap_UI; | 214 | item->indent = head->level * 5 * gap_UI; |
215 | item->isBold = head->level == 0; | ||
215 | addItem_ListWidget(d->list, item); | 216 | addItem_ListWidget(d->list, item); |
216 | iRelease(item); | 217 | iRelease(item); |
217 | } | 218 | } |
@@ -425,7 +426,7 @@ iBool setMode_SidebarWidget(iSidebarWidget *d, enum iSidebarMode mode) { | |||
425 | } | 426 | } |
426 | setBackgroundColor_Widget(as_Widget(d->list), | 427 | setBackgroundColor_Widget(as_Widget(d->list), |
427 | d->mode == documentOutline_SidebarMode ? tmBannerBackground_ColorId | 428 | d->mode == documentOutline_SidebarMode ? tmBannerBackground_ColorId |
428 | : uiBackground_ColorId); | 429 | : uiBackgroundSidebar_ColorId); |
429 | updateItemHeight_SidebarWidget_(d); | 430 | updateItemHeight_SidebarWidget_(d); |
430 | /* Restore previous scroll position. */ | 431 | /* Restore previous scroll position. */ |
431 | setScrollPos_ListWidget(d->list, d->modeScroll[mode]); | 432 | setScrollPos_ListWidget(d->list, d->modeScroll[mode]); |
@@ -473,7 +474,7 @@ void init_SidebarWidget(iSidebarWidget *d, enum iSidebarSide side) { | |||
473 | iTrue); | 474 | iTrue); |
474 | iZap(d->modeScroll); | 475 | iZap(d->modeScroll); |
475 | d->side = side; | 476 | d->side = side; |
476 | d->mode = -1; | 477 | d->mode = -1; |
477 | #if defined (iPlatformAppleMobile) | 478 | #if defined (iPlatformAppleMobile) |
478 | d->width = 73 * gap_UI; | 479 | d->width = 73 * gap_UI; |
479 | d->itemFonts[0] = defaultBig_FontId; | 480 | d->itemFonts[0] = defaultBig_FontId; |
@@ -501,17 +502,18 @@ void init_SidebarWidget(iSidebarWidget *d, enum iSidebarSide side) { | |||
501 | iClob(new_LabelWidget( | 502 | iClob(new_LabelWidget( |
502 | tightModeLabels_[i], | 503 | tightModeLabels_[i], |
503 | format_CStr("%s.mode arg:%d", cstr_String(id_Widget(w)), i))), | 504 | format_CStr("%s.mode arg:%d", cstr_String(id_Widget(w)), i))), |
504 | frameless_WidgetFlag | (isPhone ? noBackground_WidgetFlag : 0)); | 505 | frameless_WidgetFlag | noBackground_WidgetFlag); |
505 | } | 506 | } |
506 | setButtonFont_SidebarWidget(d, isPhone ? uiLabelLarge_FontId : uiLabel_FontId); | 507 | setButtonFont_SidebarWidget(d, isPhone ? uiLabelLarge_FontId : uiLabel_FontId); |
507 | addChildFlags_Widget(vdiv, | 508 | addChildFlags_Widget(vdiv, |
508 | iClob(buttons), | 509 | iClob(buttons), |
509 | arrangeHorizontal_WidgetFlag | resizeWidthOfChildren_WidgetFlag | | 510 | arrangeHorizontal_WidgetFlag | |
511 | resizeWidthOfChildren_WidgetFlag | | ||
510 | arrangeHeight_WidgetFlag | resizeToParentWidth_WidgetFlag | | 512 | arrangeHeight_WidgetFlag | resizeToParentWidth_WidgetFlag | |
511 | drawBackgroundToHorizontalSafeArea_WidgetFlag); | 513 | drawBackgroundToHorizontalSafeArea_WidgetFlag); |
512 | if (deviceType_App() == phone_AppDeviceType) { | 514 | // if (deviceType_App() == phone_AppDeviceType) { |
513 | setBackgroundColor_Widget(buttons, uiBackground_ColorId); | 515 | setBackgroundColor_Widget(buttons, uiBackgroundSidebar_ColorId); |
514 | } | 516 | // } |
515 | } | 517 | } |
516 | else { | 518 | else { |
517 | iLabelWidget *heading = new_LabelWidget("Identities", NULL); | 519 | iLabelWidget *heading = new_LabelWidget("Identities", NULL); |
@@ -1227,8 +1229,10 @@ static void draw_SidebarWidget_(const iSidebarWidget *d) { | |||
1227 | iPaint p; | 1229 | iPaint p; |
1228 | init_Paint(&p); | 1230 | init_Paint(&p); |
1229 | draw_Widget(w); | 1231 | draw_Widget(w); |
1230 | drawVLine_Paint( | 1232 | if (d->mode == documentOutline_SidebarMode) { |
1231 | &p, addX_I2(topRight_Rect(bounds), -1), height_Rect(bounds), uiSeparator_ColorId); | 1233 | drawVLine_Paint( |
1234 | &p, addX_I2(topRight_Rect(bounds), -1), height_Rect(bounds), uiSeparator_ColorId); | ||
1235 | } | ||
1232 | } | 1236 | } |
1233 | 1237 | ||
1234 | static void draw_SidebarItem_(const iSidebarItem *d, iPaint *p, iRect itemRect, | 1238 | static void draw_SidebarItem_(const iSidebarItem *d, iPaint *p, iRect itemRect, |
@@ -1243,7 +1247,7 @@ static void draw_SidebarItem_(const iSidebarItem *d, iPaint *p, iRect itemRect, | |||
1243 | const int iconColor = isHover ? (isPressing ? uiTextPressed_ColorId : uiIconHover_ColorId) | 1247 | const int iconColor = isHover ? (isPressing ? uiTextPressed_ColorId : uiIconHover_ColorId) |
1244 | : uiIcon_ColorId; | 1248 | : uiIcon_ColorId; |
1245 | const int font = sidebar->itemFonts[d->isBold ? 1 : 0]; | 1249 | const int font = sidebar->itemFonts[d->isBold ? 1 : 0]; |
1246 | int bg = uiBackground_ColorId; | 1250 | int bg = uiBackgroundSidebar_ColorId; |
1247 | if (isHover) { | 1251 | if (isHover) { |
1248 | bg = isPressing ? uiBackgroundPressed_ColorId | 1252 | bg = isPressing ? uiBackgroundPressed_ColorId |
1249 | : uiBackgroundFramelessHover_ColorId; | 1253 | : uiBackgroundFramelessHover_ColorId; |