diff --git a/data/resources/style.css b/data/resources/style.css index a4dd75b0..a368d2c6 100644 --- a/data/resources/style.css +++ b/data/resources/style.css @@ -595,18 +595,35 @@ room-history-row .event-content .emote { color: var(--accent-color); } -.content-thumbnail { +.visual-content.opaque-bg { border-radius: 6px; background-color: var(--border-color); } -.content-thumbnail .osd.circular { +.visual-content .spinner { + min-width: 32px; + min-height: 32px; +} + +.visual-content.compact .spinner { + min-width: 16px; + min-height: 16px; +} + +.visual-content image.osd.circular { min-width: 64px; min-height: 64px; border-radius: 32px; + -gtk-icon-size: 32px; +} + +.visual-content.compact image.osd.circular { + min-width: 32px; + min-height: 32px; + -gtk-icon-size: 16px; } -.content-thumbnail .timestamp { +.visual-content .timestamp { border-radius: 4px; padding: 2px 5px; } diff --git a/src/session/view/content/room_history/message_row/location.rs b/src/session/view/content/room_history/message_row/location.rs index c25b689e..8c665b8a 100644 --- a/src/session/view/content/room_history/message_row/location.rs +++ b/src/session/view/content/room_history/message_row/location.rs @@ -85,6 +85,7 @@ impl MessageLocation { glib::Object::new() } + /// Set the `geo:` URI to display. pub fn set_geo_uri(&self, uri: &str, format: ContentFormat) { let imp = self.imp(); let compact = matches!(format, ContentFormat::Compact | ContentFormat::Ellipsized); @@ -107,8 +108,10 @@ impl MessageLocation { if compact { self.set_halign(gtk::Align::Start); + self.add_css_class("compact"); } else { self.set_halign(gtk::Align::Fill); + self.remove_css_class("compact"); } } } diff --git a/src/session/view/content/room_history/message_row/location.ui b/src/session/view/content/room_history/message_row/location.ui index 04525adf..89366b82 100644 --- a/src/session/view/content/room_history/message_row/location.ui +++ b/src/session/view/content/room_history/message_row/location.ui @@ -5,7 +5,8 @@ User Location hidden @@ -22,7 +23,6 @@ center center error-symbolic - large true diff --git a/src/session/view/content/room_history/message_row/visual_media.rs b/src/session/view/content/room_history/message_row/visual_media.rs index c9815195..4f79674a 100644 --- a/src/session/view/content/room_history/message_row/visual_media.rs +++ b/src/session/view/content/room_history/message_row/visual_media.rs @@ -49,10 +49,10 @@ mod imp { #[template_child] pub overlay_spinner: TemplateChild, /// The intended display width of the media. - #[property(get, set = Self::set_width, explicit_notify, default = -1, minimum = -1)] + #[property(get, default = -1, minimum = -1)] pub width: Cell, /// The intended display height of the media. - #[property(get, set = Self::set_height, explicit_notify, default = -1, minimum = -1)] + #[property(get, default = -1, minimum = -1)] pub height: Cell, /// The loading state of the media. #[property(get, builder(LoadingState::default()))] @@ -73,6 +73,7 @@ mod imp { Self::bind_template(klass); Self::Type::bind_template_callbacks(klass); + klass.set_css_name("message-visual-media"); klass.set_accessible_role(gtk::AccessibleRole::Group); } @@ -184,7 +185,7 @@ mod imp { impl MessageVisualMedia { /// Set the intended display width of the media. - fn set_width(&self, width: i32) { + pub(super) fn set_width(&self, width: i32) { if self.width.get() == width { return; } @@ -194,7 +195,7 @@ mod imp { } /// Set the intended display height of the media. - fn set_height(&self, height: i32) { + pub(super) fn set_height(&self, height: i32) { if self.height.get() == height { return; } @@ -247,6 +248,23 @@ mod imp { .replace(Some(paintable.animation_ref())); } } + + /// Set whether to display this media in a compact format. + pub(super) fn set_compact(&self, compact: bool) { + if self.compact.get() == compact { + return; + } + + self.compact.set(compact); + + if compact { + self.media.add_css_class("compact"); + } else { + self.media.remove_css_class("compact"); + } + + self.obj().notify_compact(); + } } } @@ -269,12 +287,6 @@ impl MessageVisualMedia { .unwrap(); } - /// Set whether to display this media in a compact format. - fn set_compact(&self, compact: bool) { - self.imp().compact.set(compact); - self.notify_compact(); - } - /// Display the given visual media message. pub fn set_media_message( &self, @@ -285,9 +297,10 @@ impl MessageVisualMedia { let (width, height) = media_message.dimensions().unzip(); let compact = matches!(format, ContentFormat::Compact | ContentFormat::Ellipsized); - self.set_width(width.and_then(|w| w.try_into().ok()).unwrap_or(-1)); - self.set_height(height.and_then(|h| h.try_into().ok()).unwrap_or(-1)); - self.set_compact(compact); + let imp = self.imp(); + imp.set_width(width.and_then(|w| w.try_into().ok()).unwrap_or(-1)); + imp.set_height(height.and_then(|h| h.try_into().ok()).unwrap_or(-1)); + imp.set_compact(compact); self.build(media_message, session); } @@ -379,11 +392,9 @@ impl MessageVisualMedia { child.set_tooltip_text(Some(&filename)); if is_sticker { - if imp.media.has_css_class("content-thumbnail") { - imp.media.remove_css_class("content-thumbnail"); - } - } else if !imp.media.has_css_class("content-thumbnail") { - imp.media.add_css_class("content-thumbnail"); + imp.media.remove_css_class("opaque-bg"); + } else { + imp.media.add_css_class("opaque-bg"); } } Err(error) => { diff --git a/src/session/view/content/room_history/message_row/visual_media.ui b/src/session/view/content/room_history/message_row/visual_media.ui index ed4fbaff..9f1e1047 100644 --- a/src/session/view/content/room_history/message_row/visual_media.ui +++ b/src/session/view/content/room_history/message_row/visual_media.ui @@ -6,7 +6,8 @@ hidden @@ -16,6 +17,8 @@ + center + center true @@ -30,7 +33,6 @@ center center error-symbolic - large true