Update Telegram button added to DialogsWidget/Intro. Three dot menu.

Telegram/SourceFiles/dialogs/dialogs.style

@@ -33,18 +33,9 @@ dialogsUnreadFont: font(12px bold);
 dialogsUnreadHeight: 19px;
 dialogsUnreadPadding: 5px;
 
-dialogsBg: windowBg;
-dialogsBgOver: #f5f5f5;
-dialogsBgActive: #6a91b1;
 dialogsTextFont: font(fsize);
-dialogsTextFg: #888888;
-dialogsTextFgService: #4981af;
-dialogsTextFgActive: #ffffff;
 dialogsDateFont: font(13px);
-dialogsDateFgActive: #ffffff;
-dialogsDateFg: #a8a8a8;
 dialogsDateSkip: 5px;
-dialogsNameFg: #000000;
 dialogsNameTop: 2px;
 
 dialogsRowHeight: 62px;
@@ -70,17 +61,25 @@ dialogsTextStyle: textStyle(defaultTextStyle) {
 	linkFgDown: dialogsTextFgService;
 	linkFlagsOver: font(fsize);
 }
-dialogsTextStyleDraft: textStyle(dialogsTextStyle) {
-	linkFg: #dd4b39;
-	linkFgDown: #dd4b39;
+dialogsTextStyleOver: textStyle(dialogsTextStyle) {
+	linkFg: dialogsTextFgServiceOver;
+	linkFgDown: dialogsTextFgServiceOver;
 }
 dialogsTextStyleActive: textStyle(dialogsTextStyle) {
-	linkFg: dialogsTextFgActive;
-	linkFgDown: dialogsTextFgActive;
+	linkFg: dialogsTextFgServiceActive;
+	linkFgDown: dialogsTextFgServiceActive;
+}
+dialogsTextStyleDraft: textStyle(dialogsTextStyle) {
+	linkFg: dialogsDraftFg;
+	linkFgDown: dialogsDraftFg;
+}
+dialogsTextStyleDraftOver: textStyle(dialogsTextStyle) {
+	linkFg: dialogsDraftFgOver;
+	linkFgDown: dialogsDraftFgOver;
 }
 dialogsTextStyleDraftActive: textStyle(dialogsTextStyle) {
-	linkFg: #c6e1f7;
-	linkFgDown: #c6e1f7;
+	linkFg: dialogsDraftFgActive;
+	linkFgDown: dialogsDraftFgActive;
 }
 
 dialogsMenuToggle: IconButton {
@@ -127,30 +126,61 @@ dialogsMenuSettings: icon {{ "menu_settings", menuIconFg }};
 dialogsMenuHelp: icon {{ "menu_help", menuIconFg }};
 
 dialogsChatTypeSkip: 22px;
-dialogsChatIcon: icon {{ "dialogs_chat", #373737, point(1px, 4px) }};
-dialogsChatActiveIcon: icon {{ "dialogs_chat", #ffffff, point(1px, 4px) }};
-dialogsChannelIcon: icon {{ "dialogs_channel", #373737, point(3px, 4px) }};
-dialogsChannelActiveIcon: icon {{ "dialogs_channel", #ffffff, point(3px, 4px) }};
+dialogsChatIcon: icon {{ "dialogs_chat", dialogsChatIconFg, point(1px, 4px) }};
+dialogsChatIconOver: icon {{ "dialogs_chat", dialogsChatIconFgOver, point(1px, 4px) }};
+dialogsChatIconActive: icon {{ "dialogs_chat", dialogsChatIconFgActive, point(1px, 4px) }};
+dialogsChannelIcon: icon {{ "dialogs_channel", dialogsChatIconFg, point(3px, 4px) }};
+dialogsChannelIconOver: icon {{ "dialogs_channel", dialogsChatIconFgOver, point(3px, 4px) }};
+dialogsChannelIconActive: icon {{ "dialogs_channel", dialogsChatIconFgActive, point(3px, 4px) }};
 
-dialogsSentStateFg: #5dc452;
 dialogsSendStateSkip: 20px;
-dialogsSendingIcon: icon {{ "dialogs_sending", #c1c1c1, point(8px, 4px) }};
-dialogsSendingActiveIcon: icon {{ "dialogs_sending", #ffffff99, point(8px, 4px) }};
-dialogsSentIcon: icon {{ "dialogs_sent", dialogsSentStateFg, point(10px, 4px) }};
-dialogsSentActiveIcon: icon {{ "dialogs_sent", #ffffff, point(10px, 4px) }};
-dialogsReceivedIcon: icon {{ "dialogs_received", dialogsSentStateFg, point(5px, 4px) }};
-dialogsReceivedActiveIcon: icon {{ "dialogs_received", #ffffff, point(5px, 4px) }};
+dialogsSendingIcon: icon {{ "dialogs_sending", dialogsSendingIconFg, point(8px, 4px) }};
+dialogsSendingIconOver: icon {{ "dialogs_sending", dialogsSendingIconFgOver, point(8px, 4px) }};
+dialogsSendingIconActive: icon {{ "dialogs_sending", dialogsSendingIconFgActive, point(8px, 4px) }};
+dialogsSentIcon: icon {{ "dialogs_sent", dialogsSentIconFg, point(10px, 4px) }};
+dialogsSentIconOver: icon {{ "dialogs_sent", dialogsSentIconFgOver, point(10px, 4px) }};
+dialogsSentIconActive: icon {{ "dialogs_sent", dialogsSentIconFgActive, point(10px, 4px) }};
+dialogsReceivedIcon: icon {{ "dialogs_received", dialogsSentIconFg, point(5px, 4px) }};
+dialogsReceivedIconOver: icon {{ "dialogs_received", dialogsSentIconFgOver, point(5px, 4px) }};
+dialogsReceivedIconActive: icon {{ "dialogs_received", dialogsSentIconFgActive, point(5px, 4px) }};
 
 dialogsVerifiedIcon: icon {
-	{ "dialogs_verified_star", #4abcf1, point(4px, 2px) },
-	{ "dialogs_verified_check", #ffffff, point(7px, 7px) },
+	{ "dialogs_verified_star", dialogsVerifiedIconBg, point(4px, 2px) },
+	{ "dialogs_verified_check", dialogsVerifiedIconFg, point(7px, 7px) },
 };
-dialogsVerifiedActiveIcon: icon {
-	{ "dialogs_verified_star", #ffffff, point(4px, 2px) },
-	{ "dialogs_verified_check", #6a91b1, point(7px, 7px) },
+dialogsVerifiedIconOver: icon {
+	{ "dialogs_verified_star", dialogsVerifiedIconBgOver, point(4px, 2px) },
+	{ "dialogs_verified_check", dialogsVerifiedIconFgOver, point(7px, 7px) },
+};
+dialogsVerifiedIconActive: icon {
+	{ "dialogs_verified_star", dialogsVerifiedIconBgActive, point(4px, 2px) },
+	{ "dialogs_verified_check", dialogsVerifiedIconFgActive, point(7px, 7px) },
 };
 
 historySendingIcon: icon {{ "dialogs_sending", #98d292, point(5px, 5px) }};
 historySendingInvertedIcon: icon {{ "dialogs_sending", #ffffffc8, point(5px, 5px) }};
 historyViewsSendingIcon: icon {{ "dialogs_sending", #a0adb5, point(3px, 0px) }};
 historyViewsSendingInvertedIcon: icon  {{ "dialogs_sending", #ffffffc8, point(3px, 0px) }};
+
+dialogsUpdateButton: flatButton {
+	duration: 0;
+	cursor: cursor(pointer);
+
+	color: activeButtonFg;
+	overColor: activeButtonFgOver;
+	downColor: activeButtonFgOver;
+
+	bgColor: activeButtonBg;
+	overBgColor: activeButtonBgOver;
+	downBgColor: activeButtonBgOver;
+
+	width: -34px;
+	height: 46px;
+
+	textTop: 14px;
+	overTextTop: 14px;
+	downTextTop: 15px;
+
+	font: semiboldFont;
+	overFont: semiboldFont;
+}

Telegram/SourceFiles/dialogs/dialogs_layout.cpp

@@ -35,9 +35,12 @@ namespace {
 // Show all dates that are in the last 20 hours in time format.
 constexpr int kRecentlyInSeconds = 20 * 3600;
 
-void paintRowDate(Painter &p, const QDateTime &date, QRect &rectForName, bool active) {
-	QDateTime now(QDateTime::currentDateTime()), lastTime(date);
-	QDate nowDate(now.date()), lastDate(lastTime.date());
+void paintRowDate(Painter &p, const QDateTime &date, QRect &rectForName, bool active, bool selected) {
+	auto now = QDateTime::currentDateTime();
+	auto lastTime = date;
+	auto nowDate = now.date();
+	auto lastDate = lastTime.date();
+
 	QString dt;
 	bool wasSameDay = (lastDate == nowDate);
 	bool wasRecently = qAbs(lastTime.secsTo(now)) < kRecentlyInSeconds;
@@ -51,7 +54,7 @@ void paintRowDate(Painter &p, const QDateTime &date, QRect &rectForName, bool ac
 	int32 dtWidth = st::dialogsDateFont->width(dt);
 	rectForName.setWidth(rectForName.width() - dtWidth - st::dialogsDateSkip);
 	p.setFont(st::dialogsDateFont);
-	p.setPen(active ? st::dialogsDateFgActive : st::dialogsDateFg);
+	p.setPen(active ? st::dialogsDateFgActive : (selected ? st::dialogsDateFgOver : st::dialogsDateFg));
 	p.drawText(rectForName.left() + rectForName.width() + st::dialogsDateSkip, rectForName.top() + st::msgNameFont->height - st::msgDateFont->descent, dt);
 }
 
@@ -68,57 +71,56 @@ void paintRow(Painter &p, History *history, HistoryItem *item, Data::Draft *draf
 	int32 namewidth = w - nameleft - st::dialogsPadding.x();
 	QRect rectForName(nameleft, st::dialogsPadding.y() + st::dialogsNameTop, namewidth, st::msgNameFont->height);
 
-	if (auto chatTypeIcon = ChatTypeIcon(history->peer, active)) {
+	if (auto chatTypeIcon = ChatTypeIcon(history->peer, active, selected)) {
 		chatTypeIcon->paint(p, rectForName.topLeft(), w);
 		rectForName.setLeft(rectForName.left() + st::dialogsChatTypeSkip);
 	}
 
 	int texttop = st::dialogsPadding.y() + st::msgNameFont->height + st::dialogsSkip;
 	if (draft) {
-		paintRowDate(p, date, rectForName, active);
+		paintRowDate(p, date, rectForName, active, selected);
 
 		p.setFont(st::dialogsTextFont);
-		p.setPen(active ? st::dialogsTextFgActive : st::dialogsTextFgService);
 		if (history->typing.isEmpty() && history->sendActions.isEmpty()) {
 			if (history->cloudDraftTextCache.isEmpty()) {
 				auto draftWrapped = textcmdLink(1, lng_dialogs_text_from_wrapped(lt_from, lang(lng_from_draft)));
 				auto draftText = lng_dialogs_text_with_from(lt_from_part, draftWrapped, lt_message, textClean(draft->textWithTags.text));
 				history->cloudDraftTextCache.setText(st::dialogsTextFont, draftText, _textDlgOptions);
 			}
-			textstyleSet(&(active ? st::dialogsTextStyleDraftActive : st::dialogsTextStyleDraft));
-			p.setFont(st::dialogsTextFont);
-			p.setPen(active ? st::dialogsTextFgActive : st::dialogsTextFg);
+			p.setPen(active ? st::dialogsTextFgActive : (selected ? st::dialogsTextFgOver : st::dialogsTextFg));
+			textstyleSet(&(active ? st::dialogsTextStyleDraftActive : (selected ? st::dialogsTextStyleDraftOver : st::dialogsTextStyleDraft)));
 			history->cloudDraftTextCache.drawElided(p, nameleft, texttop, namewidth, 1);
 			textstyleRestore();
 		} else {
+			p.setPen(active ? st::dialogsTextFgServiceActive : (selected ? st::dialogsTextFgServiceOver : st::dialogsTextFgService));
 			history->typingText.drawElided(p, nameleft, texttop, namewidth);
 		}
 	} else if (!item) {
 		p.setFont(st::dialogsTextFont);
-		p.setPen(active ? st::dialogsTextFgActive : st::dialogsTextFgService);
+		p.setPen(active ? st::dialogsTextFgServiceActive : (selected ? st::dialogsTextFgServiceOver : st::dialogsTextFgService));
 		if (history->typing.isEmpty() && history->sendActions.isEmpty()) {
 			p.drawText(nameleft, texttop + st::msgNameFont->ascent, lang(lng_empty_history));
 		} else {
 			history->typingText.drawElided(p, nameleft, texttop, namewidth);
 		}
 	} else if (!item->isEmpty()) {
-		paintRowDate(p, date, rectForName, active);
+		paintRowDate(p, date, rectForName, active, selected);
 
 		paintItemCallback(nameleft, namewidth, item);
 	}
-	auto sendStateIcon = ([draft, item, active]() -> const style::icon* {
+	auto sendStateIcon = ([draft, item, active, selected]() -> const style::icon* {
 		if (draft) {
 			if (draft->saveRequestId) {
-				return &(active ? st::dialogsSendingActiveIcon : st::dialogsSendingIcon);
+				return &(active ? st::dialogsSendingIconActive : (selected ? st::dialogsSendingIconOver : st::dialogsSendingIcon));
 			}
 		} else if (item && !item->isEmpty() && item->needCheck()) {
 			if (item->id > 0) {
 				if (item->unread()) {
-					return &(active ? st::dialogsSentActiveIcon : st::dialogsSentIcon);
+					return &(active ? st::dialogsSentIconActive : (selected ? st::dialogsSentIconOver : st::dialogsSentIcon));
 				}
-				return &(active ? st::dialogsReceivedActiveIcon : st::dialogsReceivedIcon);
+				return &(active ? st::dialogsReceivedIconActive : (selected ? st::dialogsReceivedIconOver : st::dialogsReceivedIcon));
 			}
-			return &(active ? st::dialogsSendingActiveIcon : st::dialogsSendingIcon);
+			return &(active ? st::dialogsSendingIconActive : (selected ? st::dialogsSendingIconOver : st::dialogsSendingIcon));
 		}
 		return nullptr;
 	})();
@@ -128,12 +130,12 @@ void paintRow(Painter &p, History *history, HistoryItem *item, Data::Draft *draf
 	}
 
 	if (history->peer->isUser() && history->peer->isVerified()) {
-		auto icon = &(active ? st::dialogsVerifiedActiveIcon : st::dialogsVerifiedIcon);
+		auto icon = &(active ? st::dialogsVerifiedIconActive : (selected ? st::dialogsVerifiedIconOver : st::dialogsVerifiedIcon));
 		rectForName.setWidth(rectForName.width() - icon->width());
 		icon->paint(p, rectForName.topLeft() + QPoint(qMin(history->peer->dialogName().maxWidth(), rectForName.width()), 0), w);
 	}
 
-	p.setPen(active ? st::dialogsTextFgActive : st::dialogsNameFg);
+	p.setPen(active ? st::dialogsNameFgActive : (selected ? st::dialogsNameFgOver : st::dialogsNameFg));
 	history->peer->dialogName().drawElided(p, rectForName.left(), rectForName.top(), rectForName.width());
 }
 
@@ -167,11 +169,11 @@ QImage colorizeCircleHalf(UnreadBadgeSizeData *data, int size, int half, int xof
 
 } // namepsace
 
-const style::icon *ChatTypeIcon(PeerData *peer, bool active) {
+const style::icon *ChatTypeIcon(PeerData *peer, bool active, bool selected) {
 	if (peer->isChat() || peer->isMegagroup()) {
-		return &(active ? st::dialogsChatActiveIcon : st::dialogsChatIcon);
+		return &(active ? st::dialogsChatIconActive : (selected ? st::dialogsChatIconOver : st::dialogsChatIcon));
 	} else if (peer->isChannel()) {
-		return &(active ? st::dialogsChannelActiveIcon : st::dialogsChannelIcon);
+		return &(active ? st::dialogsChannelIconActive : (selected ? st::dialogsChannelIconOver : st::dialogsChannelIcon));
 	}
 	return nullptr;
 }
@@ -263,7 +265,7 @@ void RowPainter::paint(Painter &p, const Row *row, int w, bool active, bool sele
 	if (item && cloudDraft && unreadCount > 0) {
 		cloudDraft = nullptr; // Draw item, if draft is older.
 	}
-	paintRow(p, history, item, cloudDraft, displayDate(), w, active, selected, onlyBackground, [&p, w, active, history, unreadCount](int nameleft, int namewidth, HistoryItem *item) {
+	paintRow(p, history, item, cloudDraft, displayDate(), w, active, selected, onlyBackground, [&p, w, active, selected, history, unreadCount](int nameleft, int namewidth, HistoryItem *item) {
 		int availableWidth = namewidth;
 		int texttop = st::dialogsPadding.y() + st::msgNameFont->height + st::dialogsSkip;
 		if (unreadCount) {
@@ -280,9 +282,9 @@ void RowPainter::paint(Painter &p, const Row *row, int w, bool active, bool sele
 			availableWidth -= unreadWidth + st::dialogsUnreadPadding;
 		}
 		if (history->typing.isEmpty() && history->sendActions.isEmpty()) {
-			item->drawInDialog(p, QRect(nameleft, texttop, availableWidth, st::dialogsTextFont->height), active, history->textCachedFor, history->lastItemTextCache);
+			item->drawInDialog(p, QRect(nameleft, texttop, availableWidth, st::dialogsTextFont->height), active, selected, history->textCachedFor, history->lastItemTextCache);
 		} else {
-			p.setPen(active ? st::dialogsTextFgActive : st::dialogsTextFgService);
+			p.setPen(active ? st::dialogsTextFgServiceActive : (selected ? st::dialogsTextFgServiceOver : st::dialogsTextFgService));
 			history->typingText.drawElided(p, nameleft, texttop, availableWidth);
 		}
 	});
@@ -291,9 +293,9 @@ void RowPainter::paint(Painter &p, const Row *row, int w, bool active, bool sele
 void RowPainter::paint(Painter &p, const FakeRow *row, int w, bool active, bool selected, bool onlyBackground) {
 	auto item = row->item();
 	auto history = item->history();
-	paintRow(p, history, item, nullptr, item->date, w, active, selected, onlyBackground, [&p, row, active](int nameleft, int namewidth, HistoryItem *item) {
+	paintRow(p, history, item, nullptr, item->date, w, active, selected, onlyBackground, [&p, row, active, selected](int nameleft, int namewidth, HistoryItem *item) {
 		int lastWidth = namewidth, texttop = st::dialogsPadding.y() + st::msgNameFont->height + st::dialogsSkip;
-		item->drawInDialog(p, QRect(nameleft, texttop, lastWidth, st::dialogsTextFont->height), active, row->_cacheFor, row->_cache);
+		item->drawInDialog(p, QRect(nameleft, texttop, lastWidth, st::dialogsTextFont->height), active, selected, row->_cacheFor, row->_cache);
 	});
 }
 

Telegram/SourceFiles/dialogs/dialogs_layout.h

@@ -27,7 +27,7 @@ class FakeRow;
 
 namespace Layout {
 
-const style::icon *ChatTypeIcon(PeerData *peer, bool active);
+const style::icon *ChatTypeIcon(PeerData *peer, bool active, bool selected);
 
 class RowPainter {
 public: