feat: better fonts and colorsHEADmain

2 files changed, 134 insertions, 20 deletions

diff --git a/src/main.rs b/src/main.rs
index e83f789..b785562 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -15,6 +15,7 @@ use filamento::files::Files;
 use filamento::presence::{Offline, Presence, PresenceType};
 use filamento::{roster::Contact, user::User, UpdateMessage};
 use iced::alignment::Horizontal::Right;
+use iced::font::{Stretch, Weight};
 use iced::futures::{SinkExt, Stream, StreamExt};
 use iced::keyboard::{on_key_press, on_key_release, Key, Modifiers};
 use iced::theme::palette::{Background, Danger, Extended, Pair, Primary, Secondary, Success};
@@ -26,7 +27,7 @@ use iced::widget::{
     scrollable, stack, text, text_input, toggler, Column, Svg, Text, Toggler,
 };
 use iced::Length::{self, Fill, Shrink};
-use iced::{color, stream, Color, Element, Subscription, Task, Theme};
+use iced::{color, stream, Color, Element, Font, Subscription, Task, Theme};
 use icons::Icon;
 use indexmap::{indexmap, IndexMap};
 use jid::JID;
@@ -525,9 +526,31 @@ async fn main() -> iced::Result {
                 ])
             }
         };
+        let mut font = Font::with_name("K2D");
+        font.weight = Weight::Medium;
+        // font.stretch = Stretch::Condensed;
         iced::application("Macaw", Macaw::update, Macaw::view)
+            .font(include_bytes!("../assets/fonts/Diolce-Regular.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-Italic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-Thin.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-ExtraBold.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-ExtraLightItalic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-ExtraLight.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-Light.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-Light.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-BoldItalic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-MediumItalic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-ThinItalic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-Medium.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-Bold.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-Regular.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-ExtraBoldItalic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-LightItalic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-SemiBoldItalic.ttf"))
+            .font(include_bytes!("../assets/fonts/K2D-SemiBold.ttf"))
+            .default_font(font)
             .subscription(subscription)
-            // .theme(Macaw::theme)
+            .theme(Macaw::theme)
             .run_with(|| {
                 (
                     Macaw::new(
@@ -549,9 +572,49 @@ async fn main() -> iced::Result {
     } else {
         if let Some(e) = client_creation_error {
             iced::application("Macaw", Macaw::update, Macaw::view)
+                .font(include_bytes!("../assets/fonts/Diolce-Regular.otf"))
+                .font(include_bytes!("../assets/fonts/K2D-Italic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Thin.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraBold.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraLightItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraLight.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Light.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Light.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-BoldItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-MediumItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ThinItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Medium.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Bold.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Regular.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraBoldItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-LightItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-SemiBoldItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-SemiBold.ttf"))
+                .default_font(Font::with_name("K2D"))
+                .theme(Macaw::theme)
                 .run_with(|| (Macaw::new(None, cfg), Task::done(Message::Error(e))))
         } else {
             iced::application("Macaw", Macaw::update, Macaw::view)
+                .font(include_bytes!("../assets/fonts/Diolce-Regular.otf"))
+                .font(include_bytes!("../assets/fonts/K2D-Italic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Thin.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraBold.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraLightItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraLight.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Light.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Light.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-BoldItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-MediumItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ThinItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Medium.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Bold.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-Regular.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-ExtraBoldItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-LightItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-SemiBoldItalic.ttf"))
+                .font(include_bytes!("../assets/fonts/K2D-SemiBold.ttf"))
+                .default_font(Font::with_name("K2D"))
+                .theme(Macaw::theme)
                 .run_with(|| (Macaw::new(None, cfg), Task::none()))
         }
     }
@@ -1185,15 +1248,15 @@ impl Macaw {
         let extended = Extended {
             background: Background {
                 base: Pair {
-                    color: color!(0x392c25),
+                    color: color!(0x503e34),
                     text: color!(0xdcdcdc),
                 },
                 weak: Pair {
-                    color: color!(0xdcdcdc),
-                    text: color!(0x392c25),
+                    color: color!(0x392c25),
+                    text: color!(0xdcdcdc),
                 },
                 strong: Pair {
-                    color: color!(0x364b3b),
+                    color: color!(0x293f2e),
                     text: color!(0xdcdcdc),
                 },
             },
@@ -1214,15 +1277,15 @@ impl Macaw {
             secondary: Secondary {
                 base: Pair {
                     color: color!(0xffce07),
-                    text: color!(0x000000),
+                    text: color!(0xdcdcdc),
                 },
                 weak: Pair {
                     color: color!(0xffce07),
-                    text: color!(0x000000),
+                    text: color!(0xdcdcdc),
                 },
                 strong: Pair {
                     color: color!(0xffce07),
-                    text: color!(0x000000),
+                    text: color!(0xdcdcdc),
                 },
             },
             success: Success {
@@ -1395,10 +1458,12 @@ fn chat_list_item<'a>(
                 .spacing(8)
                 .width(Fill)
             ]
+            .spacing(8)
         ]
+        .spacing(8)
         .into()
     } else {
-        row![avatar_stack, text(name)].into()
+        row![avatar_stack, text(name)].spacing(8).into()
     };
     let mut button =
         button(content).on_press(Message::ToggleChat(chat_list_item.correspondent().clone()));
diff --git a/src/message_view.rs b/src/message_view.rs
index 8378164..f5319bd 100644
--- a/src/message_view.rs
+++ b/src/message_view.rs
@@ -1,12 +1,13 @@
 use std::{path::PathBuf, time::Duration};
 
 use chrono::{NaiveDate, NaiveDateTime, TimeDelta};
+use iced::color;
+use iced::widget::text_editor;
 use iced::{
     border::Radius,
-    widget::{
-        button, column, container, image, row, scrollable, text, text_editor, text_editor::Content,
-    },
-    Border, Color, Element,
+    font::{Style, Weight},
+    widget::{button, column, container, image, row, scrollable, text, text_editor::Content},
+    Border, Color, Element, Font,
     Length::{Fill, Shrink},
     Theme,
 };
@@ -164,13 +165,26 @@ impl MessageView {
         let text_editor = text_editor(&self.new_message)
             .placeholder("new message")
             .on_action(Message::MessageCompose)
-            .wrapping(text::Wrapping::WordOrGlyph);
+            .wrapping(text::Wrapping::WordOrGlyph)
+            .style(|theme, status| text_editor::Style {
+                background: color!(0xdcdcdc).into(),
+                border: Border {
+                    color: Color::BLACK,
+                    width: 0.0,
+                    radius: 0.into(),
+                },
+                icon: color!(0x00000000),
+                placeholder: color!(0xacacac),
+                value: color!(0x000000),
+                selection: color!(0xffce07),
+            });
         let message_send_input = row![
             text_editor,
-            button(Icon::NewBubble24).on_press(Message::SendMessage(self.new_message.text()))
+            // button(Icon::NewBubble24).on_press(Message::SendMessage(self.new_message.text()))
         ]
         .padding(8);
         column![
+            self.header(),
             scrollable(messages_view)
                 .height(Fill)
                 .width(Fill)
@@ -181,6 +195,38 @@ impl MessageView {
         .into()
     }
 
+    pub fn header(&self) -> Element<'_, Message> {
+        // TODO: contact stored here for name
+        let mut bold = Font::with_name("K2D");
+        bold.weight = Weight::Bold;
+        let mut sweet = Font::with_name("Diolce");
+        sweet.style = Style::Italic;
+        let mut name_and_jid = column![];
+        if let Some(nick) = &self.chat.user.nick {
+            name_and_jid = name_and_jid.push(text(nick).font(bold).size(20));
+        }
+        let jid = self.chat.user.jid.as_bare().to_string();
+        name_and_jid = name_and_jid.push(text(jid).font(sweet));
+        let mut header = row![];
+        if let Some(avatar) = &self.chat.user.avatar {
+            let mut path = self.file_root.join(avatar);
+            path.set_extension("jpg");
+            header = header.push(container(image(path).width(48).height(48)));
+        }
+        header = header.push(name_and_jid);
+        container(
+            container(header.spacing(8).padding(8))
+                .style(|theme: &Theme| {
+                    container::Style::default()
+                        .background(theme.extended_palette().background.strong.color)
+                })
+                .width(Fill),
+        )
+        .padding(8)
+        .width(Fill)
+        .into()
+    }
+
     pub fn message<'a>(&'a self, message: &'a MacawMessage, major: bool) -> Element<'a, Message> {
         let timestamp = message.timestamp.naive_local();
         let timestamp = timestamp.time().format("%H:%M").to_string();
@@ -191,7 +237,9 @@ impl MessageView {
             } else {
                 message.from.jid.as_bare().to_string()
             };
-            let mut header = row![text(nick), text(timestamp)];
+            let mut bold = Font::with_name("K2D");
+            bold.weight = Weight::Bold;
+            let mut header = row![text(nick).font(bold), text(timestamp)].spacing(8);
             if let Some(delivery) = message.delivery {
                 let icon = match delivery {
                     filamento::chat::Delivery::Sending => Some(Icon::Sending16),
@@ -206,21 +254,22 @@ impl MessageView {
                     header = header.push(icon);
                 }
             }
-            let message_right = column![header, text(&message.body.body)];
+            let message_right = column![header, text(&message.body.body)].spacing(8);
             let mut major_message = row([]);
             if let Some(avatar) = &message.from.avatar {
                 let mut path = self.file_root.join(avatar);
                 path.set_extension("jpg");
                 // info!("got avatar: {:?}", path);
-                major_message = major_message.push(image(path).width(48).height(48));
+                major_message = major_message.push(container(image(path).width(48).height(48)));
             }
             major_message = major_message.push(message_right);
-            major_message.into()
+            major_message.spacing(8).into()
         } else {
             row![
                 container(text(timestamp)).width(48),
                 text(&message.body.body)
             ]
+            .spacing(8)
             .into()
         }
     }