Skip to content

Commit 10caa7d

Browse files
authored
Merge pull request #620 from kevinaboos/ui_shading_add_room
2 parents e05e6d0 + 02bb2f0 commit 10caa7d

18 files changed

Lines changed: 347 additions & 126 deletions

resources/icon_add.svg

Lines changed: 0 additions & 5 deletions
This file was deleted.

resources/icons/icon_home.svg

Lines changed: 0 additions & 5 deletions
This file was deleted.

src/home/home_screen.rs

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,8 @@ live_design! {
99

1010
use crate::home::main_mobile_ui::MainMobileUI;
1111
use crate::home::rooms_sidebar::RoomsSideBar;
12-
use crate::home::spaces_dock::SpacesDock;
12+
use crate::home::navigation_tab_bar::NavigationTabBar;
13+
use crate::home::search_messages::*;
1314
use crate::shared::styles::*;
1415
use crate::shared::room_filter_input_bar::RoomFilterInputBar;
1516
use crate::home::main_desktop_ui::MainDesktopUI;
@@ -35,9 +36,9 @@ live_design! {
3536
padding: 0,
3637
margin: 0,
3738

38-
// On the left, show the spaces sidebar.
39+
// On the left, show the navigation tab bar vertically.
3940
<CachedWidget> {
40-
spaces_dock = <SpacesDock> {}
41+
navigation_tab_bar = <NavigationTabBar> {}
4142
}
4243

4344
// To the right of that, we use the PageFlip widget to show either
@@ -52,9 +53,26 @@ live_design! {
5253
width: Fill, height: Fill
5354
flow: Down
5455

55-
<CachedWidget> {
56-
room_filter_input_bar = <RoomFilterInputBar> {}
56+
<View> {
57+
width: Fill,
58+
height: 39,
59+
flow: Right
60+
padding: {top: 2, bottom: 2}
61+
margin: {right: 2}
62+
spacing: 2
63+
align: {y: 0.5}
64+
65+
<CachedWidget> {
66+
room_filter_input_bar = <RoomFilterInputBar> {}
67+
}
68+
69+
search_messages_button = <SearchMessagesButton> {
70+
// make this button match/align with the RoomFilterInputBar
71+
height: 32.5,
72+
margin: {right: 2}
73+
}
5774
}
75+
5876
<MainDesktopUI> {}
5977
}
6078

@@ -108,9 +126,9 @@ live_design! {
108126
}
109127
}
110128

111-
// At the bottom of the root view, show the spaces dock.
129+
// At the bottom of the root view, show the navigation tab bar horizontally.
112130
<CachedWidget> {
113-
spaces_dock = <SpacesDock> {}
131+
navigation_tab_bar = <NavigationTabBar> {}
114132
}
115133
}
116134

@@ -142,7 +160,7 @@ live_design! {
142160
}
143161

144162

145-
/// Which space is currently selected in the SpacesDock.
163+
/// Which space is currently selected in the NavigationTabBar.
146164
#[derive(Clone, Debug, Default)]
147165
pub enum SelectedSpace {
148166
#[default]

src/home/light_themed_dock.rs

Lines changed: 40 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,10 @@ live_design! {
77

88
use crate::shared::styles::*;
99

10+
COLOR_TAB_BAR = (COLOR_PRIMARY * 0.96)
11+
COLOR_DOCK_TAB = #E1EEFA // a light blue-ish color, de-saturated from `COLOR_ACTIVE_PRIMARY`
12+
COLOR_DRAG_TARGET = (COLOR_ACTIVE_PRIMARY)
13+
1014
pub Splitter = <SplitterBase> {
1115
draw_bg: {
1216
uniform border_radius: 1.0
@@ -18,33 +22,37 @@ live_design! {
1822

1923
fn pixel(self) -> vec4 {
2024
let sdf = Sdf2d::viewport(self.pos * self.rect_size);
21-
sdf.clear(#ef);
22-
23-
if self.is_vertical > 0.5 {
24-
sdf.box(
25-
self.splitter_pad,
26-
self.rect_size.y * 0.5 - self.splitter_grabber * 0.5,
27-
self.rect_size.x - 2.0 * self.splitter_pad,
28-
self.splitter_grabber,
29-
self.border_radius
30-
);
31-
}
32-
else {
33-
sdf.box(
34-
self.rect_size.x * 0.5 - self.splitter_grabber * 0.5,
35-
self.splitter_pad,
36-
self.splitter_grabber,
37-
self.rect_size.y - 2.0 * self.splitter_pad,
38-
self.border_radius
39-
);
40-
}
25+
sdf.clear(COLOR_SECONDARY);
26+
27+
sdf.box(
28+
-1.,
29+
-1.,
30+
self.rect_size.x + 2,
31+
self.rect_size.y + 2,
32+
2.5
33+
);
34+
// if self.is_vertical > 0.5 {
35+
// sdf.box(
36+
// self.splitter_pad,
37+
// self.rect_size.y * 0.5 - self.splitter_grabber * 0.5,
38+
// self.rect_size.x - 2.0 * self.splitter_pad,
39+
// self.splitter_grabber,
40+
// self.border_radius
41+
// );
42+
// }
43+
// else {
44+
// sdf.box(
45+
// self.rect_size.x * 0.5 - self.splitter_grabber * 0.5,
46+
// self.splitter_pad,
47+
// self.splitter_grabber,
48+
// self.rect_size.y - 2.0 * self.splitter_pad,
49+
// self.border_radius
50+
// );
51+
// }
52+
4153
return sdf.fill_keep(mix(
42-
THEME_COLOR_D_HIDDEN,
43-
mix(
44-
THEME_COLOR_OUTSET_HOVER,
45-
THEME_COLOR_OUTSET_HOVER * 1.2,
46-
self.down
47-
),
54+
COLOR_SECONDARY,
55+
COLOR_ROBRIX_PURPLE,
4856
self.hover
4957
));
5058
}
@@ -94,7 +102,7 @@ live_design! {
94102
pub TabCloseButton = <TabCloseButtonBase> {
95103
// TODO: NEEDS FOCUS STATE
96104
height: 10.0, width: 10.0,
97-
margin: { right: (THEME_SPACE_2), left: -3.5 },
105+
margin: { right: (THEME_SPACE_2), left: -1 },
98106
draw_button: {
99107

100108
instance hover: float;
@@ -175,14 +183,14 @@ live_design! {
175183
self.rect_size.x + 2,
176184
self.rect_size.y + 2,
177185
1.
178-
)
186+
);
179187
sdf.fill_keep(
180188
mix(
181-
(COLOR_SECONDARY) * 0.95,
189+
(COLOR_DOCK_TAB),
182190
(COLOR_ACTIVE_PRIMARY),
183191
self.active
184192
)
185-
)
193+
);
186194
return sdf.result
187195
}
188196
}
@@ -240,7 +248,7 @@ live_design! {
240248
color: #x0
241249
}
242250
draw_fill: {
243-
color: (COLOR_SECONDARY)
251+
color: (COLOR_TAB_BAR)
244252
}
245253

246254
width: Fill, height: (THEME_TAB_HEIGHT)
@@ -286,7 +294,7 @@ live_design! {
286294
padding: {left: (THEME_DOCK_BORDER_SIZE), top: 0, right: (THEME_DOCK_BORDER_SIZE), bottom: (THEME_DOCK_BORDER_SIZE)}
287295
drag_target_preview: {
288296
draw_depth: 10.0
289-
color: (mix((COLOR_SECONDARY), #FFFFFF00, pow(0.25, THEME_COLOR_CONTRAST)))
297+
color: (mix((COLOR_DRAG_TARGET), #FFFFFF00, pow(0.5, THEME_COLOR_CONTRAST)))
290298
}
291299
tab_bar: <TabBar> {}
292300
splitter: <Splitter> {}

src/home/main_desktop_ui.rs

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,9 @@ live_design! {
2424
height: Fill,
2525
padding: 0,
2626
spacing: 0,
27+
// Align the dock with the RoomFilterInputBar. Not sure why we need this...
28+
margin: {left: 1.75}
29+
2730

2831
root = Splitter {
2932
axis: Horizontal,

src/home/mod.rs

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,13 +16,15 @@ pub mod rooms_list;
1616
pub mod rooms_list_entry;
1717
pub mod rooms_list_header;
1818
pub mod rooms_sidebar;
19-
pub mod spaces_dock;
19+
pub mod search_messages;
20+
pub mod navigation_tab_bar;
2021
pub mod welcome_screen;
2122
pub mod event_reaction_list;
2223
pub mod new_message_context_menu;
2324
pub mod link_preview;
2425

2526
pub fn live_design(cx: &mut Cx) {
27+
search_messages::live_design(cx);
2628
home_screen::live_design(cx);
2729
loading_pane::live_design(cx);
2830
location_preview::live_design(cx);
@@ -39,7 +41,7 @@ pub fn live_design(cx: &mut Cx) {
3941
rooms_sidebar::live_design(cx);
4042
main_mobile_ui::live_design(cx);
4143
main_desktop_ui::live_design(cx);
42-
spaces_dock::live_design(cx);
44+
navigation_tab_bar::live_design(cx);
4345
welcome_screen::live_design(cx);
4446
light_themed_dock::live_design(cx);
4547
event_reaction_list::live_design(cx);

0 commit comments

Comments
 (0)