button styling improved

front/src/buttons.rs

@@ -45,3 +45,32 @@ where
     })
     .on_press(press_variant(id))
 }
+
+// Utility to round a button border while keeping other default styling.
+// Note: Applying a new .style(...) replaces any previous style closure.
+// Use this helper early (or integrate its logic) if you also need custom colors.
+pub fn round_button<'a, Message>(button: Button<'a, Message>, radius: f32) -> Button<'a, Message>
+where
+    Message: 'a,
+{
+    button.style(move |_theme, status| {
+        // Start from default style for this status
+        let mut style = iced::widget::button::Style::default();
+
+        // Simple example tweak: lighter shadow when pressed
+        match status {
+            iced::widget::button::Status::Pressed => {
+                style.shadow.offset = iced::Vector { x: 1.0, y: 1.0 };
+            }
+            _ => {}
+        }
+
+        // Override only the radius, keep other border attributes
+        style.border = Border {
+            radius: radius.into(),
+            ..style.border
+        };
+
+        style
+    })
+}

front/src/main.rs

@@ -1,10 +1,11 @@
 use iced::Length::{self, Fill, FillPortion};
-use iced::widget::container;
 use iced::widget::text_editor;
+use iced::widget::{Container, container};
 use iced::{
     Background, Color, Element, Task, Theme,
     widget::{Image, column, container::Style, row, text},
 };
+use iced::{Border, Font};
 
 mod buttons;
 mod channels;
@@ -16,6 +17,7 @@ use crate::channels::get_channels_buttons;
 
 fn main() -> Result<(), iced::Error> {
     iced::application(Liscord::title, Liscord::update, Liscord::view)
+        .font(include_bytes!("../fonts/paper_plane.ttf"))
         .theme(Liscord::theme)
         .run_with(Liscord::new)
 }
@@ -32,6 +34,7 @@ enum Event {
     ServerPressed(i32),
     ChannelPressed(i32),
     MessageInput(text_editor::Action),
+    SendMessage,
 }
 
 impl Liscord {
@@ -39,8 +42,8 @@ impl Liscord {
         (
             Self {
                 user: Some(User::default()),
-                selected_server: None,
+                selected_server: Some(0),
-                selected_channel: None,
+                selected_channel: Some(0),
                 message_editor: text_editor::Content::new(),
             },
             Task::none(),
@@ -67,6 +70,7 @@ impl Liscord {
             Event::MessageInput(action) => {
                 self.message_editor.perform(action);
             }
+            Event::SendMessage => println!("Message Sent !"),
         }
         Task::none()
     }
@@ -152,7 +156,7 @@ impl Liscord {
                     selection: Color::from_rgba8(0, 120, 255, 0.35),
                     icon: Color::WHITE,
                     background: Background::Color(Color::from_rgb8(30, 30, 30)),
-                    border: iced::Border {
+                    border: Border {
                         color: if focused {
                             Color::from_rgb8(0, 180, 120)
                         } else {
@@ -163,7 +167,12 @@ impl Liscord {
                     },
                 }
             });
-        column![messages_container, text_box].into()
+        let send_button =
+            round_button(iced::widget::button(container(send_icon()).center(30)), 15.)
+                .on_press(Event::SendMessage);
+        column![messages_container, row![text_box, send_button].spacing(10)]
+            .spacing(10)
+            .into()
     }
 
     fn messages_container<'a>(&self) -> Element<'a, Event> {
@@ -174,3 +183,39 @@ impl Liscord {
             .into()
     }
 }
+
+fn icon<'a>(codepoint: char) -> Element<'a, Event> {
+    const ICON_FONT: Font = Font::with_name("editor-icons");
+
+    text(codepoint).font(ICON_FONT).into()
+}
+
+fn send_icon<'a>() -> Element<'a, Event> {
+    icon('\u{F1D8}')
+}
+
+pub fn round_button<'a, Message>(
+    button: iced::widget::Button<'a, Message>,
+    radius: f32,
+) -> iced::widget::Button<'a, Message>
+where
+    Message: 'a,
+{
+    button.style(move |_theme, status| {
+        let mut style = iced::widget::button::Style::default();
+        let green = Color::from_rgb8(0, 255, 128);
+        if status == iced::widget::button::Status::Pressed {
+            style.shadow.offset = iced::Vector { x: 1.0, y: 1.0 };
+        }
+
+        style.background = Some(Background::Color(green));
+
+        style.border = Border {
+            radius: radius.into(),
+            color: green,
+            width: 4.,
+        };
+
+        style
+    })
+}