diff --git a/Cargo.toml b/Cargo.toml index ded1960..452401f 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -10,8 +10,8 @@ web = ["dioxus/web"] [dependencies] dioxus = "0.5.*" -dioxus-free-icons = { version = "0.8", features = ["material-design-icons-navigation", "ionicons"] } dioxus-sdk = { version = "0.5.*", features = ["utils"] } +dioxus-free-icons = { version = "0.8.*", features = ["ionicons", "font-awesome-solid", "material-design-icons-navigation"] } # matrix-sdk = { git = "https://github.com/matrix-org/matrix-rust-sdk.git", branch = "main", default-features = false, features = ["js", "rustls-tls"] } matrix-sdk = { version = "0.7.*", default-features = false, features = ["js", "rustls-tls"] } diff --git a/src/ui/components/icons.rs b/src/ui/components/icons.rs index c79de79..e978c23 100644 --- a/src/ui/components/icons.rs +++ b/src/ui/components/icons.rs @@ -1,5 +1,8 @@ use const_format::formatcp; use dioxus::prelude::*; +use dioxus_free_icons::icons::fa_solid_icons::{ + FaComments, FaLayerGroup, FaMagnifyingGlass, FaPeopleGroup, +}; use dioxus_free_icons::icons::md_navigation_icons::MdArrowDropDown; use dioxus_free_icons::{Icon, IconShape}; @@ -9,7 +12,28 @@ include!(concat!(env!("OUT_DIR"), "/style_vars.rs")); use style::{COLOR_PRIMARY_100, COLOR_TERNARY_100}; -pub fn DownArrowIcon() -> Element { +macro_rules! transparent_icon { + ($name:ident, $icon:ident) => { + pub fn $name() -> Element { + rsx! { + style { {STYLE_SHEET} }, + Icon { + class: ClassName::TRANSPARENT_ICON, + icon: $icon, + } + } + } + }; +} + +// TODO: Remove this icon once the conversation panel finished +transparent_icon!(DownArrowIcon, MdArrowDropDown); + +transparent_icon!(SearchIcon, FaMagnifyingGlass); +transparent_icon!(SpacesIcon, FaLayerGroup); +transparent_icon!(ChatsIcon, FaComments); +transparent_icon!(RoomsIcon, FaPeopleGroup); + #[derive(Clone, PartialEq)] pub(crate) struct LogoShape; impl IconShape for LogoShape { diff --git a/src/ui/components/icons.scss b/src/ui/components/icons.scss index 494370c..5faeb01 100644 --- a/src/ui/components/icons.scss +++ b/src/ui/components/icons.scss @@ -1,4 +1,4 @@ -.down-arrow-icon { +.transparent-icon { color: transparent; path:last-child {