From fdf75eebf3d8fa1e00d73b3a7fc7cc398ffdf691 Mon Sep 17 00:00:00 2001 From: 23rd <23rd@vivaldi.net> Date: Thu, 23 Apr 2026 21:08:43 +0300 Subject: [PATCH] [img-editor] Restyled popups and sticker panel as mediaview dark theme. --- .../controllers/stickers_panel_controller.cpp | 2 +- Telegram/SourceFiles/editor/editor.style | 9 ++++++-- .../editor/scene/scene_item_base.cpp | 9 ++++---- .../editor/scene/scene_item_text.cpp | 13 ++++++------ .../SourceFiles/media/view/media_view.style | 21 +++++++++++++++++++ Telegram/SourceFiles/ui/menu_icons.style | 8 ++++--- 6 files changed, 46 insertions(+), 16 deletions(-) diff --git a/Telegram/SourceFiles/editor/controllers/stickers_panel_controller.cpp b/Telegram/SourceFiles/editor/controllers/stickers_panel_controller.cpp index 831ccfaa8c..2958e1b4e2 100644 --- a/Telegram/SourceFiles/editor/controllers/stickers_panel_controller.cpp +++ b/Telegram/SourceFiles/editor/controllers/stickers_panel_controller.cpp @@ -27,7 +27,7 @@ StickersPanelController::StickersPanelController( nullptr, ChatHelpers::TabbedSelectorDescriptor{ .show = show, - .st = st::storiesComposeControls.tabbed, + .st = st::mediaviewEmojiPan, .level = Window::GifPauseReason::Layer, .mode = ChatHelpers::TabbedSelector::Mode::MediaEditor, .features = { diff --git a/Telegram/SourceFiles/editor/editor.style b/Telegram/SourceFiles/editor/editor.style index ec1f8397e0..1d1aede531 100644 --- a/Telegram/SourceFiles/editor/editor.style +++ b/Telegram/SourceFiles/editor/editor.style @@ -10,6 +10,7 @@ using "ui/basic.style"; using "window/window.style"; using "ui/widgets/widgets.style"; using "ui/chat/chat.style"; +using "media/view/media_view.style"; // photoEditorControlsBottomSkip * 2 + photoEditorControlsCenterSkip + photoEditorButtonBarHeight * 2 photoEditorControlsHeight: 146px; @@ -106,12 +107,16 @@ photoEditorCornersMenuAboutLabel: FlatLabel(defaultFlatLabel) { font: font(11px); } minWidth: 136px; + textFg: groupCallMemberNotJoinedStatus; } photoEditorCornersMenuAboutPosition: point(12px, 4px); -photoEditorCropRatioMenu: PopupMenu(popupMenuWithIcons) { - menu: Menu(menuWithIcons) { +photoEditorMenuSubmenuArrow: icon {{ "menu/submenu_arrow", groupCallMemberNotJoinedStatus }}; + +photoEditorCropRatioMenu: PopupMenu(mediaviewPopupMenu) { + menu: Menu(mediaviewMenu) { widthMin: 108px; + arrow: photoEditorMenuSubmenuArrow; } } diff --git a/Telegram/SourceFiles/editor/scene/scene_item_base.cpp b/Telegram/SourceFiles/editor/scene/scene_item_base.cpp index be84c2773b..3f29567ad6 100644 --- a/Telegram/SourceFiles/editor/scene/scene_item_base.cpp +++ b/Telegram/SourceFiles/editor/scene/scene_item_base.cpp @@ -12,6 +12,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "ui/widgets/popup_menu.h" #include "ui/painter.h" #include "styles/style_editor.h" +#include "styles/style_media_view.h" #include "styles/style_menu_icons.h" #include @@ -211,22 +212,22 @@ void ItemBase::contextMenuEvent(QGraphicsSceneContextMenuEvent *event) { _menu = base::make_unique_q( nullptr, - st::popupMenuWithIcons); + st::mediaviewPopupMenu); add( tr::lng_photo_editor_menu_delete, kDeleteSequence, [=] { actionDelete(); }, - &st::menuIconDelete); + &st::mediaMenuIconDelete); add( tr::lng_photo_editor_menu_flip, kFlipSequence, [=] { actionFlip(); }, - &st::menuIconFlip); + &st::mediaMenuIconFlip); add( tr::lng_photo_editor_menu_duplicate, kDuplicateSequence, [=] { actionDuplicate(); }, - &st::menuIconCopy); + &st::mediaMenuIconCopy); _menu->popup(event->screenPos()); } diff --git a/Telegram/SourceFiles/editor/scene/scene_item_text.cpp b/Telegram/SourceFiles/editor/scene/scene_item_text.cpp index 32870696e1..834375157a 100644 --- a/Telegram/SourceFiles/editor/scene/scene_item_text.cpp +++ b/Telegram/SourceFiles/editor/scene/scene_item_text.cpp @@ -14,6 +14,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL #include "ui/painter.h" #include "ui/widgets/popup_menu.h" #include "styles/style_editor.h" +#include "styles/style_media_view.h" #include "styles/style_menu_icons.h" #include @@ -587,7 +588,7 @@ void ItemText::contextMenuEvent(QGraphicsSceneContextMenuEvent *event) { _contextMenu = base::make_unique_q( nullptr, - st::popupMenuWithIcons); + st::mediaviewPopupMenu); const auto add = [&]( const QString &text, TextStyle style, @@ -604,26 +605,26 @@ void ItemText::contextMenuEvent(QGraphicsSceneContextMenuEvent *event) { add( tr::lng_photo_editor_text_style_plain(tr::now), TextStyle::Plain, - &st::menuIconTextStylePlain); + &st::mediaMenuIconTextStylePlain); add( tr::lng_photo_editor_text_style_framed(tr::now), TextStyle::Framed, - &st::menuIconTextStyleFramed); + &st::mediaMenuIconTextStyleFramed); add( tr::lng_photo_editor_text_style_semi_transparent(tr::now), TextStyle::SemiTransparent, - &st::menuIconTextStyleSemiTransparent); + &st::mediaMenuIconTextStyleSemiTransparent); _contextMenu->addSeparator(); _contextMenu->addAction( tr::lng_photo_editor_menu_duplicate(tr::now), [=] { actionDuplicate(); }, - &st::menuIconCopy); + &st::mediaMenuIconCopy); _contextMenu->addAction( tr::lng_photo_editor_menu_delete(tr::now), [=] { actionDelete(); }, - &st::menuIconDelete); + &st::mediaMenuIconDelete); _contextMenu->popup(event->screenPos()); } diff --git a/Telegram/SourceFiles/media/view/media_view.style b/Telegram/SourceFiles/media/view/media_view.style index e36d5176a2..526ca28306 100644 --- a/Telegram/SourceFiles/media/view/media_view.style +++ b/Telegram/SourceFiles/media/view/media_view.style @@ -941,6 +941,27 @@ storiesWhoViewed: WhoRead(defaultWhoRead) { align: align(left); } } +mediaviewEmojiPan: EmojiPan(storiesEmojiPan) { + showAnimation: PanelAnimation(emojiPanAnimation) { + fadeBg: groupCallMenuBg; + } + bg: groupCallMenuBg; + overBg: groupCallMenuBgOver; + pathBg: groupCallMenuBgRipple; + pathFg: groupCallMenuBgOver; + categoriesBg: groupCallMenuBg; + categoriesBgOver: groupCallMenuBgOver; + fadeLeft: icon {{ "fade_horizontal-flip_horizontal", groupCallMenuBg }}; + fadeRight: icon {{ "fade_horizontal", groupCallMenuBg }}; + tabs: SettingsSlider(emojiTabs) { + barFgActive: storiesComposeBlue; + labelFg: storiesComposeGrayText; + labelFgActive: storiesComposeBlue; + rippleBg: groupCallMenuBgOver; + rippleBgActive: groupCallMenuBgOver; + } +} + storiesReactionsPan: EmojiPan(storiesEmojiPan) { margin: margins(reactStripSkip, 0px, reactStripSkip, 0px); padding: margins(reactStripSkip, 0px, reactStripSkip, reactStripSkip); diff --git a/Telegram/SourceFiles/ui/menu_icons.style b/Telegram/SourceFiles/ui/menu_icons.style index 5d11dbe729..4cf3d7e74b 100644 --- a/Telegram/SourceFiles/ui/menu_icons.style +++ b/Telegram/SourceFiles/ui/menu_icons.style @@ -211,9 +211,6 @@ menuIconDownloadOff: icon {{ "menu/download_off-24x24", menuIconColor }}; menuIconShareOff: icon {{ "menu/share_off-24x24", menuIconColor }}; menuIconShareOn: icon {{ "menu/share_on-24x24", menuIconColor }}; menuIconStar: icon {{ "menu/star", menuIconColor }}; -menuIconTextStylePlain: icon {{ "menu/text_style_plain-22x22", menuIconColor, point(0px, 2px) }}; -menuIconTextStyleFramed: icon {{ "menu/text_style_framed-22x22", menuIconColor, point(0px, 2px) }}; -menuIconTextStyleSemiTransparent: icon {{ "menu/text_style_semi-22x22", menuIconColor, point(0px, 2px) }}; menuIconTTLAny: icon {{ "menu/auto_delete_plain", menuIconColor }}; menuIconTTLAnyTextPosition: point(11px, 22px); @@ -257,6 +254,11 @@ mediaMenuIconRetractVote: icon {{ "menu/retract_vote", mediaviewMenuFg }}; mediaMenuIconInfo: icon {{ "menu/info", mediaviewMenuFg }}; mediaMenuIconBlock: icon {{ "menu/block", mediaviewMenuFg }}; +mediaMenuIconFlip: icon {{ "menu/flip", mediaviewMenuFg }}; +mediaMenuIconTextStylePlain: icon {{ "menu/text_style_plain-22x22", mediaviewMenuFg, point(0px, 2px) }}; +mediaMenuIconTextStyleFramed: icon {{ "menu/text_style_framed-22x22", mediaviewMenuFg, point(0px, 2px) }}; +mediaMenuIconTextStyleSemiTransparent: icon {{ "menu/text_style_semi-22x22", mediaviewMenuFg, point(0px, 2px) }}; + menuIconDeleteAttention: icon {{ "menu/delete", menuIconAttentionColor }}; menuIconLeaveAttention: icon {{ "menu/leave", menuIconAttentionColor }}; menuIconDisableAttention: icon {{ "menu/disable", menuIconAttentionColor }};