Show stories reactions in dark theme.

This commit is contained in:
John Preston 2023-06-09 17:02:23 +04:00
parent 0ed200beee
commit 39538e89e0
9 changed files with 206 additions and 143 deletions

View file

@ -69,6 +69,11 @@ ComposeIcons {
menuWhenOnline: icon; menuWhenOnline: icon;
menuSpoiler: icon; menuSpoiler: icon;
menuSpoilerOff: icon; menuSpoilerOff: icon;
stripBubble: icon;
stripPremiumLocked: icon;
stripExpandPanel: icon;
stripExpandDropdown: icon;
} }
EmojiSuggestions { EmojiSuggestions {
@ -532,6 +537,23 @@ defaultComposeIcons: ComposeIcons {
menuWhenOnline: menuIconWhenOnline; menuWhenOnline: menuIconWhenOnline;
menuSpoiler: menuIconSpoiler; menuSpoiler: menuIconSpoiler;
menuSpoilerOff: menuIconSpoilerOff; menuSpoilerOff: menuIconSpoilerOff;
stripBubble: icon{
{ "chat/reactions_bubble_shadow", windowShadowFg },
{ "chat/reactions_bubble", windowBg },
};
stripPremiumLocked: icon{
{ "chat/reactions_premium_bg", historyPeerArchiveUserpicBg },
{ "chat/reactions_premium_star", historyPeerUserpicFg },
};
stripExpandPanel: icon{
{ "chat/reactions_round_big", windowBgRipple },
{ "chat/reactions_expand_panel", windowSubTextFg },
};
stripExpandDropdown: icon{
{ "chat/reactions_round_small", windowBgRipple },
{ "chat/reactions_expand_panel", windowSubTextFg },
};
} }
defaultEmojiPan: EmojiPan { defaultEmojiPan: EmojiPan {
margin: margins(7px, 0px, 7px, 0px); margin: margins(7px, 0px, 7px, 0px);
@ -646,10 +668,6 @@ reactStripSize: 32px;
reactStripMinWidth: 60px; reactStripMinWidth: 60px;
reactStripImage: 26px; reactStripImage: 26px;
reactStripSkip: 7px; reactStripSkip: 7px;
reactStripBubble: icon{
{ "chat/reactions_bubble_shadow", windowShadowFg },
{ "chat/reactions_bubble", windowBg },
};
reactStripBubbleRight: 20px; reactStripBubbleRight: 20px;
userpicBuilderEmojiPan: EmojiPan(statusEmojiPan) { userpicBuilderEmojiPan: EmojiPan(statusEmojiPan) {
margin: margins(reactStripSkip, 0px, reactStripSkip, 0px); margin: margins(reactStripSkip, 0px, reactStripSkip, 0px);

View file

@ -22,6 +22,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL
#include "main/main_session.h" #include "main/main_session.h"
#include "base/event_filter.h" #include "base/event_filter.h"
#include "styles/style_chat.h" #include "styles/style_chat.h"
#include "styles/style_chat_helpers.h"
#include "styles/style_menu_icons.h" #include "styles/style_menu_icons.h"
namespace HistoryView::Reactions { namespace HistoryView::Reactions {
@ -318,6 +319,7 @@ Manager::Manager(
: _outer(CountOuterSize()) : _outer(CountOuterSize())
, _inner(QRect({}, st::reactionCornerSize)) , _inner(QRect({}, st::reactionCornerSize))
, _strip( , _strip(
st::reactPanelEmojiPan,
_inner, _inner,
st::reactionCornerImage, st::reactionCornerImage,
crl::guard(this, [=] { updateCurrentButton(); }), crl::guard(this, [=] { updateCurrentButton(); }),

View file

@ -105,6 +105,7 @@ bool StripEmoji::readyInDefaultState() {
Selector::Selector( Selector::Selector(
not_null<QWidget*> parent, not_null<QWidget*> parent,
const style::EmojiPan &st,
std::shared_ptr<ChatHelpers::Show> show, std::shared_ptr<ChatHelpers::Show> show,
const Data::PossibleItemReactionsRef &reactions, const Data::PossibleItemReactionsRef &reactions,
IconFactory iconFactory, IconFactory iconFactory,
@ -112,6 +113,7 @@ Selector::Selector(
bool child) bool child)
: Selector( : Selector(
parent, parent,
st,
std::move(show), std::move(show),
reactions, reactions,
(reactions.customAllowed (reactions.customAllowed
@ -125,6 +127,7 @@ Selector::Selector(
Selector::Selector( Selector::Selector(
not_null<QWidget*> parent, not_null<QWidget*> parent,
const style::EmojiPan &st,
std::shared_ptr<ChatHelpers::Show> show, std::shared_ptr<ChatHelpers::Show> show,
ChatHelpers::EmojiListMode mode, ChatHelpers::EmojiListMode mode,
std::vector<DocumentId> recent, std::vector<DocumentId> recent,
@ -132,6 +135,7 @@ Selector::Selector(
bool child) bool child)
: Selector( : Selector(
parent, parent,
st,
std::move(show), std::move(show),
{ .customAllowed = true }, { .customAllowed = true },
mode, mode,
@ -143,6 +147,7 @@ Selector::Selector(
Selector::Selector( Selector::Selector(
not_null<QWidget*> parent, not_null<QWidget*> parent,
const style::EmojiPan &st,
std::shared_ptr<ChatHelpers::Show> show, std::shared_ptr<ChatHelpers::Show> show,
const Data::PossibleItemReactionsRef &reactions, const Data::PossibleItemReactionsRef &reactions,
ChatHelpers::EmojiListMode mode, ChatHelpers::EmojiListMode mode,
@ -151,6 +156,7 @@ Selector::Selector(
Fn<void(bool fast)> close, Fn<void(bool fast)> close,
bool child) bool child)
: RpWidget(parent) : RpWidget(parent)
, _st(st)
, _show(std::move(show)) , _show(std::move(show))
, _reactions(reactions) , _reactions(reactions)
, _recent(std::move(recent)) , _recent(std::move(recent))
@ -162,6 +168,7 @@ Selector::Selector(
st::reactStripHeight) st::reactStripHeight)
, _strip(iconFactory , _strip(iconFactory
? std::make_unique<Strip>( ? std::make_unique<Strip>(
_st,
QRect(0, 0, st::reactStripSize, st::reactStripSize), QRect(0, 0, st::reactStripSize, st::reactStripSize),
st::reactStripImage, st::reactStripImage,
crl::guard(this, [=] { update(_inner); }), crl::guard(this, [=] { update(_inner); }),
@ -241,14 +248,14 @@ QMargins Selector::extentsForShadow() const {
} }
int Selector::extendTopForCategories() const { int Selector::extendTopForCategories() const {
return _reactions.customAllowed ? st::reactPanelEmojiPan.footer : 0; return _reactions.customAllowed ? _st.footer : 0;
} }
int Selector::minimalHeight() const { int Selector::minimalHeight() const {
return _skipy return _skipy
+ (_recentRows * _size) + (_recentRows * _size)
+ st::emojiPanRadius + st::emojiPanRadius
+ st::reactPanelEmojiPan.padding.bottom(); + _st.padding.bottom();
} }
void Selector::setSpecialExpandTopSkip(int skip) { void Selector::setSpecialExpandTopSkip(int skip) {
@ -269,7 +276,7 @@ void Selector::initGeometry(int innerTop) {
? (extendTopForCategories() + _specialExpandTopSkip) ? (extendTopForCategories() + _specialExpandTopSkip)
: 0; : 0;
const auto top = innerTop - extents.top() - _collapsedTopSkip; const auto top = innerTop - extents.top() - _collapsedTopSkip;
const auto add = st::reactStripBubble.height() - extents.bottom(); const auto add = _st.icons.stripBubble.height() - extents.bottom();
_outer = QRect(0, _collapsedTopSkip, width, height); _outer = QRect(0, _collapsedTopSkip, width, height);
_outerWithBubble = _outer.marginsAdded({ 0, 0, 0, add }); _outerWithBubble = _outer.marginsAdded({ 0, 0, 0, add });
setGeometry(_outerWithBubble.marginsAdded( setGeometry(_outerWithBubble.marginsAdded(
@ -329,7 +336,7 @@ void Selector::paintAppearing(QPainter &p) {
if (_paintBuffer.size() != _outerWithBubble.size() * factor) { if (_paintBuffer.size() != _outerWithBubble.size() * factor) {
_paintBuffer = _cachedRound.PrepareImage(_outerWithBubble.size()); _paintBuffer = _cachedRound.PrepareImage(_outerWithBubble.size());
} }
_paintBuffer.fill(st::defaultPopupMenu.menu.itemBg->c); _paintBuffer.fill(_st.bg->c);
auto q = QPainter(&_paintBuffer); auto q = QPainter(&_paintBuffer);
const auto extents = extentsForShadow(); const auto extents = extentsForShadow();
const auto appearedWidth = anim::interpolate( const auto appearedWidth = anim::interpolate(
@ -348,7 +355,7 @@ void Selector::paintAppearing(QPainter &p) {
1., 1.,
false); false);
_cachedRound.setBackgroundColor(st::defaultPopupMenu.menu.itemBg->c); _cachedRound.setBackgroundColor(_st.bg->c);
_cachedRound.setShadowColor(st::shadowFg->c); _cachedRound.setShadowColor(st::shadowFg->c);
q.translate(QPoint(0, _collapsedTopSkip) - _inner.topLeft()); q.translate(QPoint(0, _collapsedTopSkip) - _inner.topLeft());
const auto radius = st::reactStripHeight / 2; const auto radius = st::reactStripHeight / 2;
@ -383,7 +390,7 @@ void Selector::paintBackgroundToBuffer() {
} }
_paintBuffer.fill(Qt::transparent); _paintBuffer.fill(Qt::transparent);
_cachedRound.setBackgroundColor(st::defaultPopupMenu.menu.itemBg->c); _cachedRound.setBackgroundColor(_st.bg->c);
_cachedRound.setShadowColor(st::shadowFg->c); _cachedRound.setShadowColor(st::shadowFg->c);
auto p = QPainter(&_paintBuffer); auto p = QPainter(&_paintBuffer);
@ -403,7 +410,7 @@ void Selector::paintCollapsed(QPainter &p) {
} }
p.drawImage(_outer.topLeft(), _paintBuffer); p.drawImage(_outer.topLeft(), _paintBuffer);
} else { } else {
p.fillRect(_inner, st::defaultPopupMenu.menu.itemBg); p.fillRect(_inner, _st.bg);
} }
_strip->paint( _strip->paint(
p, p,
@ -426,7 +433,7 @@ void Selector::paintExpanding(Painter &p, float64 progress) {
} }
_list->paintExpanding( _list->paintExpanding(
p, p,
rects.list.marginsRemoved(st::reactPanelEmojiPan.margin), rects.list.marginsRemoved(_st.margin),
rects.finalBottom, rects.finalBottom,
rects.expanding, rects.expanding,
progress, progress,
@ -458,11 +465,11 @@ auto Selector::paintExpandingBg(QPainter &p, float64 progress)
const auto pattern = _cachedRound.validateFrame(frame, 1., radius); const auto pattern = _cachedRound.validateFrame(frame, 1., radius);
const auto fill = _cachedRound.FillWithImage(p, outer, pattern); const auto fill = _cachedRound.FillWithImage(p, outer, pattern);
if (!fill.isEmpty()) { if (!fill.isEmpty()) {
p.fillRect(fill, st::defaultPopupMenu.menu.itemBg); p.fillRect(fill, _st.bg);
} }
} else { } else {
const auto inner = outer.marginsRemoved(extentsForShadow()); const auto inner = outer.marginsRemoved(extentsForShadow());
p.fillRect(inner, st::defaultPopupMenu.menu.itemBg); p.fillRect(inner, _st.bg);
p.fillRect( p.fillRect(
inner.x(), inner.x(),
inner.y() + inner.height(), inner.y() + inner.height(),
@ -513,7 +520,7 @@ void Selector::paintExpanded(QPainter &p) {
p.drawImage(0, 0, _paintBuffer); p.drawImage(0, 0, _paintBuffer);
} else { } else {
const auto inner = rect().marginsRemoved(extentsForShadow()); const auto inner = rect().marginsRemoved(extentsForShadow());
p.fillRect(inner, st::defaultPopupMenu.menu.itemBg); p.fillRect(inner, _st.bg);
p.fillRect( p.fillRect(
inner.x(), inner.x(),
inner.y() + inner.height(), inner.y() + inner.height(),
@ -536,7 +543,7 @@ void Selector::finishExpand() {
st::emojiPanRadius); st::emojiPanRadius);
const auto fill = _cachedRound.FillWithImage(q, rect(), pattern); const auto fill = _cachedRound.FillWithImage(q, rect(), pattern);
if (!fill.isEmpty()) { if (!fill.isEmpty()) {
q.fillRect(fill, st::defaultPopupMenu.menu.itemBg); q.fillRect(fill, _st.bg);
} }
} }
if (_footer) { if (_footer) {
@ -548,7 +555,7 @@ void Selector::finishExpand() {
} }
void Selector::paintBubble(QPainter &p, int innerWidth) { void Selector::paintBubble(QPainter &p, int innerWidth) {
const auto &bubble = st::reactStripBubble; const auto &bubble = _st.icons.stripBubble;
const auto bubbleRight = std::min( const auto bubbleRight = std::min(
st::reactStripBubbleRight, st::reactStripBubbleRight,
(innerWidth - bubble.width()) / 2); (innerWidth - bubble.width()) / 2);
@ -772,8 +779,7 @@ void Selector::createList() {
_scroll = Ui::CreateChild<Ui::ScrollArea>(this, st::reactPanelScroll); _scroll = Ui::CreateChild<Ui::ScrollArea>(this, st::reactPanelScroll);
_scroll->hide(); _scroll->hide();
const auto st = lifetime().make_state<style::EmojiPan>( const auto st = lifetime().make_state<style::EmojiPan>(_st);
st::reactPanelEmojiPan);
st->padding.setTop(_skipy); st->padding.setTop(_skipy);
if (!_reactions.customAllowed) { if (!_reactions.customAllowed) {
st->bg = st::transparent; st->bg = st::transparent;
@ -835,8 +841,7 @@ void Selector::createList() {
}, _shadow->lifetime()); }, _shadow->lifetime());
_shadow->show(); _shadow->show();
} }
const auto geometry = inner.marginsRemoved( const auto geometry = inner.marginsRemoved(_st.margin);
st::reactPanelEmojiPan.margin);
_list->move(0, 0); _list->move(0, 0);
_list->resizeToWidth(geometry.width()); _list->resizeToWidth(geometry.width());
_list->refreshEmoji(); _list->refreshEmoji();
@ -857,7 +862,7 @@ void Selector::createList() {
}, _list->lifetime()); }, _list->lifetime());
_scroll->setGeometry(inner.marginsRemoved({ _scroll->setGeometry(inner.marginsRemoved({
st::reactPanelEmojiPan.margin.left(), _st.margin.left(),
_footer ? _footer->height() : 0, _footer ? _footer->height() : 0,
0, 0,
0, 0,
@ -942,6 +947,7 @@ AttachSelectorResult MakeJustSelectorMenu(
Fn<void(ChosenReaction)> chosen) { Fn<void(ChosenReaction)> chosen) {
const auto selector = Ui::CreateChild<Selector>( const auto selector = Ui::CreateChild<Selector>(
menu.get(), menu.get(),
st::reactPanelEmojiPan,
controller->uiShow(), controller->uiShow(),
mode, mode,
std::move(recent), std::move(recent),
@ -1017,6 +1023,7 @@ AttachSelectorResult AttachSelectorToMenu(
const auto withSearch = reactions.customAllowed; const auto withSearch = reactions.customAllowed;
const auto selector = Ui::CreateChild<Selector>( const auto selector = Ui::CreateChild<Selector>(
menu.get(), menu.get(),
st::reactPanelEmojiPan,
controller->uiShow(), controller->uiShow(),
std::move(reactions), std::move(reactions),
std::move(iconFactory), std::move(iconFactory),

View file

@ -42,6 +42,7 @@ class Selector final : public Ui::RpWidget {
public: public:
Selector( Selector(
not_null<QWidget*> parent, not_null<QWidget*> parent,
const style::EmojiPan &st,
std::shared_ptr<ChatHelpers::Show> show, std::shared_ptr<ChatHelpers::Show> show,
const Data::PossibleItemReactionsRef &reactions, const Data::PossibleItemReactionsRef &reactions,
IconFactory iconFactory, IconFactory iconFactory,
@ -49,6 +50,7 @@ public:
bool child = false); bool child = false);
Selector( Selector(
not_null<QWidget*> parent, not_null<QWidget*> parent,
const style::EmojiPan &st,
std::shared_ptr<ChatHelpers::Show> show, std::shared_ptr<ChatHelpers::Show> show,
ChatHelpers::EmojiListMode mode, ChatHelpers::EmojiListMode mode,
std::vector<DocumentId> recent, std::vector<DocumentId> recent,
@ -95,6 +97,7 @@ private:
Selector( Selector(
not_null<QWidget*> parent, not_null<QWidget*> parent,
const style::EmojiPan &st,
std::shared_ptr<ChatHelpers::Show> show, std::shared_ptr<ChatHelpers::Show> show,
const Data::PossibleItemReactionsRef &reactions, const Data::PossibleItemReactionsRef &reactions,
ChatHelpers::EmojiListMode mode, ChatHelpers::EmojiListMode mode,
@ -129,6 +132,7 @@ private:
void finishExpand(); void finishExpand();
ChosenReaction lookupChosen(const Data::ReactionId &id) const; ChosenReaction lookupChosen(const Data::ReactionId &id) const;
const style::EmojiPan &_st;
const std::shared_ptr<ChatHelpers::Show> _show; const std::shared_ptr<ChatHelpers::Show> _show;
const Data::PossibleItemReactions _reactions; const Data::PossibleItemReactions _reactions;
const std::vector<DocumentId> _recent; const std::vector<DocumentId> _recent;

View file

@ -16,6 +16,7 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL
#include "ui/animated_icon.h" #include "ui/animated_icon.h"
#include "ui/painter.h" #include "ui/painter.h"
#include "styles/style_chat.h" #include "styles/style_chat.h"
#include "styles/style_chat_helpers.h"
namespace HistoryView::Reactions { namespace HistoryView::Reactions {
namespace { namespace {
@ -44,11 +45,13 @@ constexpr auto kHoverScale = 1.24;
} // namespace } // namespace
Strip::Strip( Strip::Strip(
const style::EmojiPan &st,
QRect inner, QRect inner,
int size, int size,
Fn<void()> update, Fn<void()> update,
IconFactory iconFactory) IconFactory iconFactory)
: _iconFactory(std::move(iconFactory)) : _st(st)
, _iconFactory(std::move(iconFactory))
, _inner(inner) , _inner(inner)
, _finalSize(size) , _finalSize(size)
, _update(std::move(update)) { , _update(std::move(update)) {
@ -173,7 +176,7 @@ void Strip::paintOne(
} else { } else {
const auto paintFrame = [&](not_null<Ui::AnimatedIcon*> animation) { const auto paintFrame = [&](not_null<Ui::AnimatedIcon*> animation) {
const auto size = int(std::floor(target.width() + 0.01)); const auto size = int(std::floor(target.width() + 0.01));
const auto &textColor = st::windowFg->c; const auto &textColor = _st.textFg->c;
const auto frame = animation->frame( const auto frame = animation->frame(
textColor, textColor,
{ size, size }, { size, size },
@ -238,9 +241,9 @@ int Strip::fillChosenIconGetIndex(ChosenReaction &chosen) const {
} }
const auto &icon = *i; const auto &icon = *i;
if (const auto &appear = icon.appear; appear && appear->animating()) { if (const auto &appear = icon.appear; appear && appear->animating()) {
chosen.icon = appear->frame(st::windowFg->c); chosen.icon = appear->frame(_st.textFg->c);
} else if (const auto &select = icon.select; select && select->valid()) { } else if (const auto &select = icon.select; select && select->valid()) {
chosen.icon = select->frame(st::windowFg->c); chosen.icon = select->frame(_st.textFg->c);
} }
return (i - begin(_icons)); return (i - begin(_icons));
} }
@ -263,7 +266,7 @@ void Strip::paintPremiumIcon(
p.translate(-target.center()); p.translate(-target.center());
} }
auto hq = PainterHighQualityEnabler(p); auto hq = PainterHighQualityEnabler(p);
st::reactionPremiumLocked.paintInCenter(p, to); _st.icons.stripPremiumLocked.paintInCenter(p, to);
if (scale != 1.) { if (scale != 1.) {
p.restore(); p.restore();
} }
@ -288,8 +291,8 @@ void Strip::paintExpandIcon(
} }
auto hq = PainterHighQualityEnabler(p); auto hq = PainterHighQualityEnabler(p);
((_finalSize == st::reactionCornerImage) ((_finalSize == st::reactionCornerImage)
? st::reactionsExpandDropdown ? _st.icons.stripExpandDropdown
: st::reactionExpandPanel).paintInCenter(p, to); : _st.icons.stripExpandPanel).paintInCenter(p, to);
if (scale != 1.) { if (scale != 1.) {
p.restore(); p.restore();
} }
@ -495,7 +498,7 @@ void Strip::setMainReactionIcon() {
if (i != end(_loadCache) && i->second.icon) { if (i != end(_loadCache) && i->second.icon) {
const auto &icon = i->second.icon; const auto &icon = i->second.icon;
if (!icon->frameIndex() && icon->width() == MainReactionSize()) { if (!icon->frameIndex() && icon->width() == MainReactionSize()) {
_mainReactionImage = i->second.icon->frame(st::windowFg->c); _mainReactionImage = i->second.icon->frame(_st.textFg->c);
return; return;
} }
} }
@ -543,7 +546,7 @@ Ui::ImageSubrect Strip::validateEmoji(int frameIndex, float64 scale) {
if (_mainReactionImage.isNull() if (_mainReactionImage.isNull()
&& _mainReactionIcon) { && _mainReactionIcon) {
_mainReactionImage = base::take(_mainReactionIcon)->frame( _mainReactionImage = base::take(_mainReactionIcon)->frame(
st::windowFg->c); _st.textFg->c);
} }
if (!_mainReactionImage.isNull()) { if (!_mainReactionImage.isNull()) {
const auto target = QRect( const auto target = QRect(

View file

@ -11,6 +11,10 @@ https://github.com/telegramdesktop/tdesktop/blob/master/LEGAL
#include "ui/effects/round_area_with_shadow.h" #include "ui/effects/round_area_with_shadow.h"
#include "data/data_message_reaction_id.h" #include "data/data_message_reaction_id.h"
namespace style {
struct EmojiPan;
} // namespace style
class HistoryItem; class HistoryItem;
namespace Data { namespace Data {
@ -44,7 +48,12 @@ class Strip final {
public: public:
using ReactionId = Data::ReactionId; using ReactionId = Data::ReactionId;
Strip(QRect inner, int size, Fn<void()> update, IconFactory iconFactory); Strip(
const style::EmojiPan &st,
QRect inner,
int size,
Fn<void()> update,
IconFactory iconFactory);
enum class AddedButton : uchar { enum class AddedButton : uchar {
None, None,
@ -121,6 +130,7 @@ private:
void resolveMainReactionIcon(); void resolveMainReactionIcon();
void setMainReactionIcon(); void setMainReactionIcon();
const style::EmojiPan &_st;
const IconFactory _iconFactory; const IconFactory _iconFactory;
const QRect _inner; const QRect _inner;
const int _finalSize = 0; const int _finalSize = 0;

View file

@ -134,6 +134,7 @@ void Reactions::create() {
const auto withSearch = reactions.customAllowed; const auto withSearch = reactions.customAllowed;
_selector = std::make_unique<HistoryView::Reactions::Selector>( _selector = std::make_unique<HistoryView::Reactions::Selector>(
_parent.get(), _parent.get(),
st::storiesReactionsPan,
_controller->uiShow(), _controller->uiShow(),
std::move(reactions), std::move(reactions),
_controller->cachedReactionIconFactory().createMethod(), _controller->cachedReactionIconFactory().createMethod(),

View file

@ -525,6 +525,122 @@ storiesComposePremium: PremiumLimits(defaultPremiumLimits) {
nonPremiumBg: storiesComposeBgOver; nonPremiumBg: storiesComposeBgOver;
nonPremiumFg: storiesComposeWhiteText; nonPremiumFg: storiesComposeWhiteText;
} }
storiesEmojiTabbedSearch: TabbedSearch(defaultTabbedSearch) {
outer: storiesComposeBg;
bg: storiesComposeBgOver;
bgActive: storiesComposeBgRipple;
fg: storiesComposeGrayIcon;
fgActive: storiesComposeWhiteText;
fadeLeft: icon {{ "fade_horizontal-flip_horizontal", storiesComposeBgOver }};
fadeRight: icon {{ "fade_horizontal", storiesComposeBgOver }};
field: InputField(defaultTabbedSearchField) {
textFg: storiesComposeWhiteText;
placeholderFg: storiesComposeGrayText;
placeholderFgActive: storiesComposeGrayText;
placeholderFgError: storiesComposeGrayText;
}
search: IconButton(defaultTabbedSearchButton) {
icon: icon{{ "emoji/emoji_search_input", storiesComposeGrayIcon }};
iconOver: icon{{ "emoji/emoji_search_input", storiesComposeGrayIcon }};
ripple: storiesComposeRipple;
}
back: IconButton(defaultTabbedSearchBack) {
icon: icon{{ "emoji/emoji_back", storiesComposeGrayIcon }};
iconOver: icon{{ "emoji/emoji_back", storiesComposeGrayIcon }};
ripple: storiesComposeRipple;
}
cancel: CrossButton(defaultTabbedSearchCancel) {
crossFg: storiesComposeGrayIcon;
crossFgOver: storiesComposeGrayIcon;
ripple: emptyRippleAnimation;
}
}
storiesEmojiPan: EmojiPan(defaultEmojiPan) {
showAnimation: PanelAnimation(emojiPanAnimation) {
fadeBg: storiesComposeBg;
}
bg: storiesComposeBg;
headerFg: storiesComposeGrayText;
trendingHeaderFg: storiesComposeWhiteText;
trendingSubheaderFg: storiesComposeGrayText;
trendingUnreadFg: storiesComposeBlue;
trendingInstalled: icon {{ "chat/input_save", storiesComposeBlue }};
overBg: storiesComposeBgOver;
pathBg: storiesComposeBgRipple;
pathFg: storiesComposeBgOver;
textFg: storiesComposeWhiteText;
categoriesBg: storiesComposeBg;
categoriesBgOver: storiesComposeBgOver;
fadeLeft: icon {{ "fade_horizontal-flip_horizontal", storiesComposeBg }};
fadeRight: icon {{ "fade_horizontal", storiesComposeBg }};
menu: storiesPopupMenuWithIcons;
expandedSeparator: MenuSeparator(storiesMenuSeparator) {
padding: margins(0px, 4px, 0px, 4px);
width: 6px;
}
tabs: SettingsSlider(emojiTabs) {
barFgActive: storiesComposeBlue;
labelFg: storiesComposeGrayText;
labelFgActive: storiesComposeBlue;
rippleBg: storiesComposeBgOver;
rippleBgActive: storiesComposeBgOver;
}
search: storiesEmojiTabbedSearch;
removeSet: storiesRemoveSet;
boxLabel: FlatLabel(boxLabel) {
textFg: groupCallMembersFg;
}
icons: ComposeIcons {
settings: icon {{ "emoji/emoji_settings", storiesComposeGrayIcon }};
recent: icon {{ "emoji/emoji_recent", storiesComposeGrayIcon }};
recentActive: icon {{ "emoji/emoji_recent", storiesComposeWhiteText }};
people: icon {{ "emoji/emoji_smile", storiesComposeGrayIcon }};
peopleActive: icon {{ "emoji/emoji_smile", storiesComposeWhiteText }};
nature: icon {{ "emoji/emoji_nature", storiesComposeGrayIcon }};
natureActive: icon {{ "emoji/emoji_nature", storiesComposeWhiteText }};
food: icon {{ "emoji/emoji_food", storiesComposeGrayIcon }};
foodActive: icon {{ "emoji/emoji_food", storiesComposeWhiteText }};
activity: icon {{ "emoji/emoji_activities", storiesComposeGrayIcon }};
activityActive: icon {{ "emoji/emoji_activities", storiesComposeWhiteText }};
travel: icon {{ "emoji/emoji_travel", storiesComposeGrayIcon }};
travelActive: icon {{ "emoji/emoji_travel", storiesComposeWhiteText }};
objects: icon {{ "emoji/emoji_objects", storiesComposeGrayIcon }};
objectsActive: icon {{ "emoji/emoji_objects", storiesComposeWhiteText }};
symbols: icon {{ "emoji/emoji_love", storiesComposeGrayIcon }};
symbolsActive: icon {{ "emoji/emoji_love", storiesComposeWhiteText }};
menuFave: icon {{ "menu/favorite", storiesComposeWhiteText }};
menuUnfave: icon {{ "menu/unfavorite", storiesComposeWhiteText }};
menuStickerSet: icon {{ "menu/stickers", storiesComposeWhiteText }};
menuRecentRemove: icon {{ "menu/delete", storiesComposeWhiteText }};
menuGifAdd: icon {{ "menu/gif", storiesComposeWhiteText }};
menuGifRemove: icon {{ "menu/delete", storiesComposeWhiteText }};
menuMute: icon {{ "menu/mute", storiesComposeWhiteText }};
menuSchedule: icon {{ "menu/calendar", storiesComposeWhiteText }};
menuWhenOnline: icon {{ "menu/send_when_online", storiesComposeWhiteText }};
menuSpoiler: icon {{ "menu/spoiler_on", storiesComposeWhiteText }};
menuSpoilerOff: icon {{ "menu/spoiler_off", storiesComposeWhiteText }};
stripBubble: icon{
{ "chat/reactions_bubble_shadow", windowShadowFg },
{ "chat/reactions_bubble", storiesComposeBg },
};
stripPremiumLocked: icon{
{ "chat/reactions_premium_bg", storiesComposeBgRipple },
{ "chat/reactions_premium_star", storiesComposeGrayIcon },
};
stripExpandPanel: icon{
{ "chat/reactions_round_big", storiesComposeBgRipple },
{ "chat/reactions_expand_panel", storiesComposeGrayIcon },
};
stripExpandDropdown: icon{
{ "chat/reactions_round_small", storiesComposeBgRipple },
{ "chat/reactions_expand_panel", storiesComposeGrayIcon },
};
}
autocompleteBottomSkip: 10px;
}
storiesComposeControls: ComposeControls(defaultComposeControls) { storiesComposeControls: ComposeControls(defaultComposeControls) {
bg: storiesComposeBg; bg: storiesComposeBg;
radius: storiesRadius; radius: storiesRadius;
@ -560,104 +676,7 @@ storiesComposeControls: ComposeControls(defaultComposeControls) {
fadeLeft: icon {{ "fade_horizontal-flip_horizontal", storiesComposeBg }}; fadeLeft: icon {{ "fade_horizontal-flip_horizontal", storiesComposeBg }};
fadeRight: icon {{ "fade_horizontal", storiesComposeBg }}; fadeRight: icon {{ "fade_horizontal", storiesComposeBg }};
} }
tabbed: EmojiPan(defaultEmojiPan) { tabbed: storiesEmojiPan;
showAnimation: PanelAnimation(emojiPanAnimation) {
fadeBg: storiesComposeBg;
}
bg: storiesComposeBg;
headerFg: storiesComposeGrayText;
trendingHeaderFg: storiesComposeWhiteText;
trendingSubheaderFg: storiesComposeGrayText;
trendingUnreadFg: storiesComposeBlue;
trendingInstalled: icon {{ "chat/input_save", storiesComposeBlue }};
overBg: storiesComposeBgOver;
pathBg: storiesComposeBgRipple;
pathFg: storiesComposeBgOver;
textFg: storiesComposeWhiteText;
categoriesBg: storiesComposeBg;
categoriesBgOver: storiesComposeBgOver;
fadeLeft: icon {{ "fade_horizontal-flip_horizontal", storiesComposeBg }};
fadeRight: icon {{ "fade_horizontal", storiesComposeBg }};
menu: storiesPopupMenuWithIcons;
expandedSeparator: MenuSeparator(storiesMenuSeparator) {
padding: margins(0px, 4px, 0px, 4px);
width: 6px;
}
tabs: SettingsSlider(emojiTabs) {
barFgActive: storiesComposeBlue;
labelFg: storiesComposeGrayText;
labelFgActive: storiesComposeBlue;
rippleBg: storiesComposeBgOver;
rippleBgActive: storiesComposeBgOver;
}
search: TabbedSearch(defaultTabbedSearch) {
outer: storiesComposeBg;
bg: storiesComposeBgOver;
bgActive: storiesComposeBgRipple;
fg: storiesComposeGrayIcon;
fgActive: storiesComposeWhiteText;
fadeLeft: icon {{ "fade_horizontal-flip_horizontal", storiesComposeBgOver }};
fadeRight: icon {{ "fade_horizontal", storiesComposeBgOver }};
field: InputField(defaultTabbedSearchField) {
textFg: storiesComposeWhiteText;
placeholderFg: storiesComposeGrayText;
placeholderFgActive: storiesComposeGrayText;
placeholderFgError: storiesComposeGrayText;
}
search: IconButton(defaultTabbedSearchButton) {
icon: icon{{ "emoji/emoji_search_input", storiesComposeGrayIcon }};
iconOver: icon{{ "emoji/emoji_search_input", storiesComposeGrayIcon }};
ripple: storiesComposeRipple;
}
back: IconButton(defaultTabbedSearchBack) {
icon: icon{{ "emoji/emoji_back", storiesComposeGrayIcon }};
iconOver: icon{{ "emoji/emoji_back", storiesComposeGrayIcon }};
ripple: storiesComposeRipple;
}
cancel: CrossButton(defaultTabbedSearchCancel) {
crossFg: storiesComposeGrayIcon;
crossFgOver: storiesComposeGrayIcon;
ripple: emptyRippleAnimation;
}
}
removeSet: storiesRemoveSet;
boxLabel: FlatLabel(boxLabel) {
textFg: groupCallMembersFg;
}
icons: ComposeIcons {
settings: icon {{ "emoji/emoji_settings", storiesComposeGrayIcon }};
recent: icon {{ "emoji/emoji_recent", storiesComposeGrayIcon }};
recentActive: icon {{ "emoji/emoji_recent", storiesComposeWhiteText }};
people: icon {{ "emoji/emoji_smile", storiesComposeGrayIcon }};
peopleActive: icon {{ "emoji/emoji_smile", storiesComposeWhiteText }};
nature: icon {{ "emoji/emoji_nature", storiesComposeGrayIcon }};
natureActive: icon {{ "emoji/emoji_nature", storiesComposeWhiteText }};
food: icon {{ "emoji/emoji_food", storiesComposeGrayIcon }};
foodActive: icon {{ "emoji/emoji_food", storiesComposeWhiteText }};
activity: icon {{ "emoji/emoji_activities", storiesComposeGrayIcon }};
activityActive: icon {{ "emoji/emoji_activities", storiesComposeWhiteText }};
travel: icon {{ "emoji/emoji_travel", storiesComposeGrayIcon }};
travelActive: icon {{ "emoji/emoji_travel", storiesComposeWhiteText }};
objects: icon {{ "emoji/emoji_objects", storiesComposeGrayIcon }};
objectsActive: icon {{ "emoji/emoji_objects", storiesComposeWhiteText }};
symbols: icon {{ "emoji/emoji_love", storiesComposeGrayIcon }};
symbolsActive: icon {{ "emoji/emoji_love", storiesComposeWhiteText }};
menuFave: icon {{ "menu/favorite", storiesComposeWhiteText }};
menuUnfave: icon {{ "menu/unfavorite", storiesComposeWhiteText }};
menuStickerSet: icon {{ "menu/stickers", storiesComposeWhiteText }};
menuRecentRemove: icon {{ "menu/delete", storiesComposeWhiteText }};
menuGifAdd: icon {{ "menu/gif", storiesComposeWhiteText }};
menuGifRemove: icon {{ "menu/delete", storiesComposeWhiteText }};
menuMute: icon {{ "menu/mute", storiesComposeWhiteText }};
menuSchedule: icon {{ "menu/calendar", storiesComposeWhiteText }};
menuWhenOnline: icon {{ "menu/send_when_online", storiesComposeWhiteText }};
menuSpoiler: icon {{ "menu/spoiler_on", storiesComposeWhiteText }};
menuSpoilerOff: icon {{ "menu/spoiler_off", storiesComposeWhiteText }};
}
autocompleteBottomSkip: 10px;
}
tabbedHeightMin: 220px; tabbedHeightMin: 220px;
tabbedHeightMax: 480px; tabbedHeightMax: 480px;
record: RecordBar(defaultRecordBar) { record: RecordBar(defaultRecordBar) {
@ -747,6 +766,18 @@ storiesWhoViewed: WhoRead(defaultWhoRead) {
align: align(left); align: align(left);
} }
} }
storiesReactionsPan: EmojiPan(storiesEmojiPan) {
margin: margins(reactStripSkip, 0px, reactStripSkip, 0px);
padding: margins(reactStripSkip, 0px, reactStripSkip, reactStripSkip);
desiredSize: reactStripSize;
verticalSizeSub: 0px;
overBg: transparent;
search: TabbedSearch(storiesEmojiTabbedSearch) {
defaultFieldWidth: 88px;
}
searchMargin: margins(1px, 10px, 2px, 6px);
}
storiesReactionsWidth: 210px; storiesReactionsWidth: 210px;
storiesReactionsBottomSkip: 29px; storiesReactionsBottomSkip: 29px;
storiesReactionsAddedTop: 200px; storiesReactionsAddedTop: 200px;

View file

@ -827,19 +827,6 @@ reactionMainAppearShift: 20px;
reactionCollapseFadeThreshold: 40px; reactionCollapseFadeThreshold: 40px;
reactionFlyUp: 50px; reactionFlyUp: 50px;
reactionPremiumLocked: icon{
{ "chat/reactions_premium_bg", historyPeerArchiveUserpicBg },
{ "chat/reactions_premium_star", historyPeerUserpicFg },
};
reactionExpandPanel: icon{
{ "chat/reactions_round_big", windowBgRipple },
{ "chat/reactions_expand_panel", windowSubTextFg },
};
reactionsExpandDropdown: icon{
{ "chat/reactions_round_small", windowBgRipple },
{ "chat/reactions_expand_panel", windowSubTextFg },
};
searchInChatMultiSelectItem: MultiSelectItem(defaultMultiSelectItem) { searchInChatMultiSelectItem: MultiSelectItem(defaultMultiSelectItem) {
maxWidth: 200px; maxWidth: 200px;
} }