Prettier UI

burrow-gtk/src/components/app.rs

@@ -49,7 +49,7 @@ impl AsyncComponent for App {
     view! {
         adw::Window {
             set_title: Some("Burrow"),
-            set_default_size: (640, 480),
+            set_default_size: (640, 800),
         }
     }
 

burrow-gtk/src/components/main/network_card.rs

@@ -32,36 +32,54 @@ impl AsyncComponent for NetworkCard {
 
     view! {
         gtk::ListBoxRow {
+            set_halign: Align::Fill,
+            set_margin_vertical: 5,
+            set_margin_horizontal: 25,
             set_hexpand: true,
-            set_halign: Align::Center,
+
             gtk::Box {
-                gtk::Label {
+                set_halign: Align::Fill,
-                    set_label: &init.name
+                set_hexpand: true,
+                set_spacing: 10,
+
+                gtk::Box {
+                    set_halign: Align::Start,
+
+                    gtk::Switch {
+                        set_active: init.enabled,
+                    },
                 },
-                gtk::Switch {
+
+                gtk::Box {
                     set_halign: Align::Center,
-                    set_hexpand: false,
+                    set_hexpand: true,
-                    set_vexpand: false,
-                    set_state: init.enabled,
-                },
-                gtk::Button {
-                    set_icon_name: "list-remove",
-                    set_margin_all: 12,
 
-                    connect_clicked => NetworkCardMsg::NetworkDelete,
+                    gtk::Label {
+                        set_label: &init.name
+                    },
                 },
-                gtk::Button {
-                    set_icon_name: "pan-up-symbolic",
-                    set_margin_all: 12,
 
-                    connect_clicked => NetworkCardMsg::MoveUp,
-                },
-                gtk::Button {
-                    set_icon_name: "pan-down-symbolic",
-                    set_margin_all: 12,
 
-                    connect_clicked => NetworkCardMsg::MoveDown,
+                gtk::Box {
-                },
+                    set_halign: Align::End,
+                    set_spacing: 5,
+
+                    gtk::Button {
+                        set_icon_name: "list-remove",
+
+                        connect_clicked => NetworkCardMsg::NetworkDelete,
+                    },
+                    gtk::Button {
+                        set_icon_name: "pan-up-symbolic",
+
+                        connect_clicked => NetworkCardMsg::MoveUp,
+                    },
+                    gtk::Button {
+                        set_icon_name: "pan-down-symbolic",
+
+                        connect_clicked => NetworkCardMsg::MoveDown,
+                    },
+                }
             }
         }
     }
@@ -86,7 +104,7 @@ impl AsyncComponent for NetworkCard {
     async fn update(
         &mut self,
         msg: Self::Input,
-        _: AsyncComponentSender<Self>,
+        _sender: AsyncComponentSender<Self>,
         _root: &Self::Root,
     ) {
         match msg {

burrow-gtk/src/components/main/networks.rs

@@ -32,19 +32,43 @@ impl AsyncComponent for Networks {
     view! {
         gtk::Box {
             set_orientation: gtk::Orientation::Vertical,
-            set_spacing: 5,
+            set_spacing: 20,
             set_margin_all: 5,
-            set_valign: Align::Start,
+            set_valign: Align::Fill,
+            set_vexpand: true,
 
-            #[name = "networks"]
+            gtk::Box {
-            gtk::ListBox {},
+                set_orientation: gtk::Orientation::Horizontal,
+                set_spacing: 10,
+                set_margin_all: 5,
+                set_valign: Align::Start,
+                set_halign: Align::Center,
 
-            gtk::Button {
+                gtk::Label {
-                set_icon_name: "list-add",
+                    set_label: "Add Network",
-                set_margin_all: 12,
+                },
 
-                connect_clicked => NetworksMsg::NetworkAdd,
+                gtk::Button {
+                    set_icon_name: "list-add",
+                    set_margin_all: 12,
+
+                    connect_clicked => NetworksMsg::NetworkAdd,
+                },
             },
+
+
+            gtk::ScrolledWindow {
+                set_valign: Align::Fill,
+                set_vexpand: true,
+                set_margin_bottom: 50,
+                set_margin_start: 50,
+                set_margin_end: 50,
+
+                #[name = "networks"]
+                gtk::ListBox {
+                    set_vexpand: true,
+                },
+            }
         }
     }
 
@@ -86,10 +110,30 @@ impl AsyncComponent for Networks {
                     enabled: false,
                 })
                 .forward(sender.input_sender(), |_| NetworksMsg::None),
+            NetworkCard::builder()
+                .launch(NetworkCardInit {
+                    id: 2,
+                    index: 2,
+                    index_max: 3,
+                    daemon_client: Arc::clone(&init.daemon_client),
+                    name: "Yay".to_owned(),
+                    enabled: false,
+                })
+                .forward(sender.input_sender(), |_| NetworksMsg::None),
+            NetworkCard::builder()
+                .launch(NetworkCardInit {
+                    id: 2,
+                    index: 2,
+                    index_max: 3,
+                    daemon_client: Arc::clone(&init.daemon_client),
+                    name: "Yay".to_owned(),
+                    enabled: false,
+                })
+                .forward(sender.input_sender(), |_| NetworksMsg::None),
         ];
-        widgets.networks.append(network_cards[0].widget());
+        for network_card in network_cards.iter() {
-        widgets.networks.append(network_cards[1].widget());
+            widgets.networks.append(network_card.widget());
-        widgets.networks.append(network_cards[2].widget());
+        }
         // let network_cards = vec![];
 
         let model = Networks {

burrow-gtk/src/components/main/switch.rs

@@ -48,14 +48,13 @@ impl AsyncComponent for Switch {
             },
 
             gtk::Box {
-                set_orientation: gtk::Orientation::Vertical,
+                set_orientation: gtk::Orientation::Horizontal,
                 set_spacing: 10,
                 set_margin_all: 5,
-                set_valign: Align::Center,
+                set_halign: Align::Center,
-                set_vexpand: true,
 
                 gtk::Label {
-                    set_label: "Burrow Switch",
+                    set_label: "Burrow Tunnel",
                 },
 
                 #[name(switch)]

burrow-gtk/src/components/main_screen.rs

@@ -29,7 +29,7 @@ impl AsyncComponent for MainScreen {
         gtk::Box {
             set_orientation: gtk::Orientation::Vertical,
             set_valign: Align::Fill,
-            set_valign: Align::Center,
+            set_vexpand: true,
 
             gtk::Box {
                 set_orientation: gtk::Orientation::Vertical,
@@ -43,25 +43,13 @@ impl AsyncComponent for MainScreen {
                 },
             },
 
-            gtk::Box {
-                set_orientation: gtk::Orientation::Vertical,
-                set_spacing: 10,
-                set_margin_all: 5,
-                set_valign: Align::Center,
-                set_vexpand: true,
-            },
-
             #[name(content)]
             gtk::Box {
                 set_orientation: gtk::Orientation::Vertical,
                 set_spacing: 10,
                 set_margin_all: 5,
-                set_valign: Align::Center,
+                set_valign: Align::Fill,
                 set_vexpand: true,
-
-                gtk::Label {
-                    set_label: "Main Screen",
-                },
             }
         }
     }
@@ -85,8 +73,8 @@ impl AsyncComponent for MainScreen {
 
         let widgets = view_output!();
 
-        widgets.content.append(networks.widget());
         widgets.content.append(switch.widget());
+        widgets.content.append(networks.widget());
 
         let model = MainScreen {
             _switch: switch,