From 2163a54617c41ec4e56b4db5454daf343a70276c Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Wed, 1 Nov 2017 17:32:01 +0000
Subject: [PATCH 01/10] Implement simple GroupRoomInfo
See matrix-org/matrix-react-sdk#1563
---
src/components/structures/RightPanel.js | 18 +++++++++++++++---
.../views/groups/_GroupRoomList.scss | 15 ---------------
.../views/rooms/_EntityTile.scss | 2 +-
3 files changed, 16 insertions(+), 19 deletions(-)
diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js
index 311c897f..76d9dd37 100644
--- a/src/components/structures/RightPanel.js
+++ b/src/components/structures/RightPanel.js
@@ -205,7 +205,6 @@ module.exports = React.createClass({
} else if (this.props.groupId) {
this.setState({
phase: this.Phase.GroupMemberList,
- groupId: payload.groupId,
member: payload.member,
});
}
@@ -213,13 +212,20 @@ module.exports = React.createClass({
} else if (payload.action === "view_group") {
this.setState({
phase: this.Phase.GroupMemberList,
- groupId: payload.groupId,
member: null,
});
+ } else if (payload.action === "view_group_room") {
+ this.setState({
+ phase: this.Phase.GroupRoomInfo,
+ groupRoom: payload.groupRoom,
+ });
+ } else if (payload.action === "view_group_room_list") {
+ this.setState({
+ phase: this.Phase.GroupRoomList,
+ });
} else if (payload.action === "view_group_user") {
this.setState({
phase: this.Phase.GroupMemberInfo,
- groupId: payload.groupId,
member: payload.member,
});
} else if (payload.action === "view_room") {
@@ -242,6 +248,7 @@ module.exports = React.createClass({
const GroupMemberList = sdk.getComponent('groups.GroupMemberList');
const GroupMemberInfo = sdk.getComponent('groups.GroupMemberInfo');
const GroupRoomList = sdk.getComponent('groups.GroupRoomList');
+ const GroupRoomInfo = sdk.getComponent('groups.GroupRoomInfo');
const TintableSvg = sdk.getComponent("elements.TintableSvg");
@@ -340,6 +347,11 @@ module.exports = React.createClass({
groupMember={this.state.member}
groupId={this.props.groupId}
key={this.state.member.user_id} />;
+ } else if (this.state.phase == this.Phase.GroupRoomInfo) {
+ panel = <GroupRoomInfo
+ groupRoom={this.state.groupRoom}
+ groupId={this.props.groupId}
+ key={this.state.groupRoom.roomId} />;
} else if (this.state.phase == this.Phase.NotificationPanel) {
panel = <NotificationPanel />;
} else if (this.state.phase == this.Phase.FilePanel) {
diff --git a/src/skins/vector/css/matrix-react-sdk/views/groups/_GroupRoomList.scss b/src/skins/vector/css/matrix-react-sdk/views/groups/_GroupRoomList.scss
index 91f0c347..fb41ebaa 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/groups/_GroupRoomList.scss
+++ b/src/skins/vector/css/matrix-react-sdk/views/groups/_GroupRoomList.scss
@@ -19,18 +19,3 @@ limitations under the License.
color: $primary-fg-color;
cursor: pointer;
}
-
-.mx_GroupRoomTile_delete {
- opacity: 0.4;
- position: absolute;
- top: 6px;
- right: 10px;
- cursor: pointer;
-
- display: none;
-}
-
-.mx_GroupRoomTile:hover > .mx_GroupRoomTile_delete {
- display: initial;
-}
-
diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_EntityTile.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_EntityTile.scss
index 712e4bae..031894af 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_EntityTile.scss
+++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_EntityTile.scss
@@ -57,7 +57,7 @@ limitations under the License.
font-size: 14px;
text-overflow: ellipsis;
white-space: nowrap;
- max-width: 135px;
+ max-width: 155px;
}
.mx_EntityTile_details {
From cd84d86fd13f7d239b91b42fab461fb86667cd66 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Wed, 1 Nov 2017 19:45:59 +0000
Subject: [PATCH 02/10] CSS for room notification pills
---
.../matrix-react-sdk/views/elements/_RichText.scss | 13 ++++++++-----
1 file changed, 8 insertions(+), 5 deletions(-)
diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss b/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss
index 0927cfbc..11dfee93 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss
+++ b/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss
@@ -3,7 +3,8 @@
// --Matthew
.mx_UserPill,
-.mx_RoomPill {
+.mx_RoomPill,
+.mx_AtRoomPill {
border-radius: 16px;
display: inline-block;
height: 20px;
@@ -24,9 +25,10 @@
padding-right: 5px;
}
-.mx_EventTile_highlight .mx_EventTile_content .markdown-body a.mx_UserPill_me {
- color: $accent-fg-color;
- background-color: $mention-user-pill-bg-color;
+.mx_EventTile_highlight .mx_EventTile_content .markdown-body a.mx_UserPill_me, .mx_AtRoomPill {
+ /* !important because otherwise @room pills in links get their colours clobbered by links styles :( */
+ color: $accent-fg-color !important;
+ background-color: $mention-user-pill-bg-color !important;
padding-right: 5px;
}
@@ -39,7 +41,8 @@
}
.mx_UserPill .mx_BaseAvatar,
-.mx_RoomPill .mx_BaseAvatar {
+.mx_RoomPill .mx_BaseAvatar,
+.mx_AtRoomPill .mx_BaseAvatar {
position: relative;
left: -3px;
top: 2px;
From 65ea7a8460cfbe2bc93cd38b1f994a529efda19f Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Thu, 2 Nov 2017 10:37:25 +0000
Subject: [PATCH 03/10] Use more spercific selector instead of !important
---
.../css/matrix-react-sdk/views/elements/_RichText.scss | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss b/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss
index 11dfee93..8b7c8f06 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss
+++ b/src/skins/vector/css/matrix-react-sdk/views/elements/_RichText.scss
@@ -25,10 +25,10 @@
padding-right: 5px;
}
-.mx_EventTile_highlight .mx_EventTile_content .markdown-body a.mx_UserPill_me, .mx_AtRoomPill {
- /* !important because otherwise @room pills in links get their colours clobbered by links styles :( */
- color: $accent-fg-color !important;
- background-color: $mention-user-pill-bg-color !important;
+.mx_EventTile_highlight .mx_EventTile_content .markdown-body a.mx_UserPill_me,
+.mx_EventTile_content .mx_AtRoomPill {
+ color: $accent-fg-color;
+ background-color: $mention-user-pill-bg-color;
padding-right: 5px;
}
From c01ea566763733fb2525f21f15aa02afccb37dce Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Thu, 2 Nov 2017 13:40:07 +0000
Subject: [PATCH 04/10] Add toggle to alter visibility of room-group
association
---
src/components/structures/RightPanel.js | 9 ++---
.../views/elements/InlineSpinner.js | 33 +++++++++++++++++++
src/skins/vector/css/_components.scss | 5 +--
.../views/rooms/_MemberInfo.scss | 10 ++++++
.../views/elements/_InlineSpinner.scss | 24 ++++++++++++++
5 files changed, 75 insertions(+), 6 deletions(-)
create mode 100644 src/components/views/elements/InlineSpinner.js
create mode 100644 src/skins/vector/css/vector-web/views/elements/_InlineSpinner.scss
diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js
index 76d9dd37..dedd715f 100644
--- a/src/components/structures/RightPanel.js
+++ b/src/components/structures/RightPanel.js
@@ -90,6 +90,7 @@ module.exports = React.createClass({
RoomMemberList: 'RoomMemberList',
GroupMemberList: 'GroupMemberList',
GroupRoomList: 'GroupRoomList',
+ GroupRoomInfo: 'GroupRoomInfo',
FilePanel: 'FilePanel',
NotificationPanel: 'NotificationPanel',
RoomMemberInfo: 'RoomMemberInfo',
@@ -217,7 +218,7 @@ module.exports = React.createClass({
} else if (payload.action === "view_group_room") {
this.setState({
phase: this.Phase.GroupRoomInfo,
- groupRoom: payload.groupRoom,
+ groupRoomId: payload.groupRoomId,
});
} else if (payload.action === "view_group_room_list") {
this.setState({
@@ -312,7 +313,7 @@ module.exports = React.createClass({
analytics={['Right Panel', 'Group Member List Button', 'click']}
/>,
<HeaderButton key="_roomsButton" title={_t('Rooms')} iconSrc="img/icons-room.svg"
- isHighlighted={this.state.phase === this.Phase.GroupRoomList}
+ isHighlighted={[this.Phase.GroupRoomList, this.Phase.GroupRoomInfo].includes(this.state.phase)}
clickPhase={this.Phase.GroupRoomList}
analytics={['Right Panel', 'Group Room List Button', 'click']}
/>,
@@ -349,9 +350,9 @@ module.exports = React.createClass({
key={this.state.member.user_id} />;
} else if (this.state.phase == this.Phase.GroupRoomInfo) {
panel = <GroupRoomInfo
- groupRoom={this.state.groupRoom}
+ groupRoomId={this.state.groupRoomId}
groupId={this.props.groupId}
- key={this.state.groupRoom.roomId} />;
+ key={this.state.groupRoomId} />;
} else if (this.state.phase == this.Phase.NotificationPanel) {
panel = <NotificationPanel />;
} else if (this.state.phase == this.Phase.FilePanel) {
diff --git a/src/components/views/elements/InlineSpinner.js b/src/components/views/elements/InlineSpinner.js
new file mode 100644
index 00000000..adb916fc
--- /dev/null
+++ b/src/components/views/elements/InlineSpinner.js
@@ -0,0 +1,33 @@
+/*
+Copyright 2017 New Vector Ltd.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+const React = require('react');
+
+module.exports = React.createClass({
+ displayName: 'InlineSpinner',
+
+ render: function() {
+ var w = this.props.w || 16;
+ var h = this.props.h || 16;
+ var imgClass = this.props.imgClassName || "";
+
+ return (
+ <div className="mx_InlineSpinner">
+ <img src="img/spinner.gif" width={w} height={h} className={imgClass}/>
+ </div>
+ );
+ }
+});
diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss
index 82c2c186..c857a7c3 100644
--- a/src/skins/vector/css/_components.scss
+++ b/src/skins/vector/css/_components.scss
@@ -55,6 +55,8 @@
@import "./matrix-react-sdk/views/rooms/_MemberInfo.scss";
@import "./matrix-react-sdk/views/rooms/_MemberList.scss";
@import "./matrix-react-sdk/views/rooms/_MessageComposer.scss";
+@import "./matrix-react-sdk/views/rooms/_PinnedEventTile.scss";
+@import "./matrix-react-sdk/views/rooms/_PinnedEventsPanel.scss";
@import "./matrix-react-sdk/views/rooms/_PresenceLabel.scss";
@import "./matrix-react-sdk/views/rooms/_RoomHeader.scss";
@import "./matrix-react-sdk/views/rooms/_RoomList.scss";
@@ -68,8 +70,6 @@
@import "./matrix-react-sdk/views/voip/_CallView.scss";
@import "./matrix-react-sdk/views/voip/_IncomingCallbox.scss";
@import "./matrix-react-sdk/views/voip/_VideoView.scss";
-@import "./matrix-react-sdk/views/rooms/_PinnedEventsPanel.scss";
-@import "./matrix-react-sdk/views/rooms/_PinnedEventTile.scss";
@import "./vector-web/_fonts.scss";
@import "./vector-web/structures/_CompatibilityPage.scss";
@import "./vector-web/structures/_HomePage.scss";
@@ -86,6 +86,7 @@
@import "./vector-web/views/dialogs/_SetPasswordDialog.scss";
@import "./vector-web/views/directory/_NetworkDropdown.scss";
@import "./vector-web/views/elements/_ImageView.scss";
+@import "./vector-web/views/elements/_InlineSpinner.scss";
@import "./vector-web/views/elements/_Spinner.scss";
@import "./vector-web/views/globals/_MatrixToolbar.scss";
@import "./vector-web/views/messages/_DateSeparator.scss";
diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss
index 8920c6f6..567d6dba 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss
+++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss
@@ -94,3 +94,13 @@ limitations under the License.
cursor: pointer;
}
+.mx_MemberInfo label {
+ font-size: 13px;
+}
+
+.mx_MemberInfo input[type="radio"] {
+ vertical-align: -2px;
+ margin-right: 5px;
+ margin-left: 8px;
+}
+
diff --git a/src/skins/vector/css/vector-web/views/elements/_InlineSpinner.scss b/src/skins/vector/css/vector-web/views/elements/_InlineSpinner.scss
new file mode 100644
index 00000000..612b6209
--- /dev/null
+++ b/src/skins/vector/css/vector-web/views/elements/_InlineSpinner.scss
@@ -0,0 +1,24 @@
+/*
+Copyright 2017 New Vector Ltd.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+.mx_InlineSpinner {
+ display: inline;
+}
+
+.mx_InlineSpinner img {
+ margin: 0px 6px;
+ vertical-align: -3px;
+}
From 06ce4678761a6d8d0434f11fe16a6d3440a31adf Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Thu, 2 Nov 2017 15:05:08 +0000
Subject: [PATCH 05/10] Add CSS for group room visibility label alignment
---
.../css/matrix-react-sdk/views/rooms/_MemberInfo.scss | 6 ++++++
1 file changed, 6 insertions(+)
diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss
index 567d6dba..5d47275e 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss
+++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberInfo.scss
@@ -98,6 +98,12 @@ limitations under the License.
font-size: 13px;
}
+.mx_MemberInfo label .mx_MemberInfo_label_text {
+ display: inline-block;
+ max-width: 180px;
+ vertical-align: text-top;
+}
+
.mx_MemberInfo input[type="radio"] {
vertical-align: -2px;
margin-right: 5px;
From f6974407e30e358faa68e35eb6408125e60db1e9 Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Fri, 3 Nov 2017 11:22:29 +0000
Subject: [PATCH 06/10] CSS for Your Communities scrollbar
and also attempt to fix GroupTile flex weirdness.
---
.../structures/_MyGroups.scss | 35 +++++++++++++++----
1 file changed, 29 insertions(+), 6 deletions(-)
diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
index ddcf46fb..a9c7a5f0 100644
--- a/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
+++ b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
@@ -18,6 +18,9 @@ limitations under the License.
max-width: 960px;
margin-left: auto;
margin-right: auto;
+
+ display: flex;
+ flex-direction: column;
}
.mx_MyGroups .mx_RoomHeader_simpleHeader {
@@ -61,10 +64,21 @@ limitations under the License.
/* Until the button is wired up */
.mx_MyGroups_joinBox {
visibility: hidden;
+ height: 0px;
+ margin: 0px;
}
.mx_MyGroups_content {
margin-left: 2px;
+
+ flex: 1 0 0;
+
+ display: flex;
+ flex-direction: column;
+}
+
+.mx_MyGroups_content h3 {
+ margin-bottom: 10px;
}
.mx_MyGroups_placeholder {
@@ -75,19 +89,22 @@ limitations under the License.
text-align: center;
}
-.mx_MyGroups_joinedGroups {
+.mx_MyGroups_joinedGroups .gm-scroll-view {
+ border-top: 1px solid $primary-hairline-color;
+ overflow-x: hidden;
+
display: flex;
flex-direction: row;
flex-flow: wrap;
- justify-content: space-around;
+ align-content: flex-start;
}
-.mx_MyGroups_joinedGroups .mx_GroupTile {
+.mx_MyGroups_joinedGroups .gm-scroll-view .mx_GroupTile {
min-width: 300px;
- flex: 1 0 25%;
+ max-width: 33%;
+ flex: 1 0 300px;
height: 75px;
- margin-bottom: 15px;
- margin-right: 10px;
+ margin: 10px 0px;
display: flex;
align-items: flex-start;
cursor: pointer;
@@ -100,6 +117,12 @@ limitations under the License.
justify-content: center;
}
+.mx_GroupTile_profile h3.mx_GroupTile_name,
+.mx_GroupTile_profile .mx_GroupTile_groupId,
+.mx_GroupTile_profile .mx_GroupTile_desc {
+ padding-right: 10px;
+}
+
.mx_GroupTile_profile h3.mx_GroupTile_name {
margin: 0px;
font-size: 15px;
From 4d11e739b555c71177bb0a9b5379315ffd400d89 Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Fri, 3 Nov 2017 11:42:06 +0000
Subject: [PATCH 07/10] Comment 0px height and margin on joinBox
---
.../vector/css/matrix-react-sdk/structures/_MyGroups.scss | 5 +++++
1 file changed, 5 insertions(+)
diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
index a9c7a5f0..d7cbda9a 100644
--- a/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
+++ b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
@@ -64,6 +64,11 @@ limitations under the License.
/* Until the button is wired up */
.mx_MyGroups_joinBox {
visibility: hidden;
+
+ /* When joinBox wraps onto its own row, it should take up zero height so
+ that there isn't an awkward gap between MyGroups_createBox and
+ MyGroups_content.
+ */
height: 0px;
margin: 0px;
}
From c60ff5d28335b688ad152c316fbd46b8dc98216e Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Fri, 3 Nov 2017 12:15:33 +0000
Subject: [PATCH 08/10] Fix group invites such that they look similar to room
invites
- Remove CSS for GroupInviteTile - the component should be using RoomTile CSS
- Added extra tiles to roomCount of RoomSubList header
Part of fixing https://github.com/vector-im/riot-web/issues/5226
---
src/components/structures/RoomSubList.js | 9 ++-
.../views/groups/_GroupInviteTile.scss | 74 -------------------
src/skins/vector/css/themes/_base.scss | 1 -
3 files changed, 7 insertions(+), 77 deletions(-)
delete mode 100644 src/skins/vector/css/matrix-react-sdk/views/groups/_GroupInviteTile.scss
diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js
index 8fb7562f..c3f51bc8 100644
--- a/src/components/structures/RoomSubList.js
+++ b/src/components/structures/RoomSubList.js
@@ -246,10 +246,14 @@ var RoomSubList = React.createClass({
roomNotificationCount: function(truncateAt) {
var self = this;
+ if (this.props.isInvite) {
+ return [0, true];
+ }
+
return this.props.list.reduce(function(result, room, index) {
if (truncateAt === undefined || index >= truncateAt) {
var roomNotifState = RoomNotifs.getRoomNotifsState(room.roomId);
- var highlight = room.getUnreadNotificationCount('highlight') > 0 || self.props.isInvite;
+ var highlight = room.getUnreadNotificationCount('highlight') > 0;
var notificationCount = room.getUnreadNotificationCount();
const notifBadges = notificationCount > 0 && self._shouldShowNotifBadge(roomNotifState);
@@ -394,7 +398,8 @@ var RoomSubList = React.createClass({
var subListNotifCount = subListNotifications[0];
var subListNotifHighlight = subListNotifications[1];
- var roomCount = this.props.list.length > 0 ? this.props.list.length : '';
+ var totalTiles = this.props.list.length + (this.props.extraTiles || []).length;
+ var roomCount = totalTiles > 0 ? totalTiles : '';
var chevronClasses = classNames({
'mx_RoomSubList_chevron': true,
diff --git a/src/skins/vector/css/matrix-react-sdk/views/groups/_GroupInviteTile.scss b/src/skins/vector/css/matrix-react-sdk/views/groups/_GroupInviteTile.scss
deleted file mode 100644
index 6b4034b9..00000000
--- a/src/skins/vector/css/matrix-react-sdk/views/groups/_GroupInviteTile.scss
+++ /dev/null
@@ -1,74 +0,0 @@
-/*
-Copyright 2017 New Vector Ltd
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
- http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-.mx_GroupInviteTile {
- position: relative;
- cursor: pointer;
- font-size: 13px;
- display: block;
- height: 34px;
-}
-
-.mx_GroupInviteTile_nameContainer {
- display: inline-block;
- width: 180px;
- height: 24px;
-}
-
-.mx_GroupInviteTile_avatarContainer {
- display: inline-block;
- padding-top: 5px;
- padding-bottom: 5px;
- padding-left: 16px;
- padding-right: 6px;
- width: 24px;
- height: 24px;
- vertical-align: middle;
-}
-
-.mx_GroupInviteTile_name {
- display: inline-block;
- position: relative;
- width: 165px;
- vertical-align: middle;
- padding-left: 6px;
- padding-right: 6px;
- padding-top: 2px;
- padding-bottom: 3px;
- color: $roomtile-name-color;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
-}
-
-.mx_GroupInviteTile_badge {
- display: inline-block;
- min-width: 15px;
- height: 15px;
- position: absolute;
- right: 8px; /*gutter */
- top: 9px;
- border-radius: 8px;
- color: $accent-fg-color;
- background-color: $group-alert-color;
- font-weight: 600;
- font-size: 10px;
- text-align: center;
- padding-top: 1px;
- padding-left: 4px;
- padding-right: 4px;
-}
-
diff --git a/src/skins/vector/css/themes/_base.scss b/src/skins/vector/css/themes/_base.scss
index f1117a7a..1a0fa5b4 100644
--- a/src/skins/vector/css/themes/_base.scss
+++ b/src/skins/vector/css/themes/_base.scss
@@ -23,7 +23,6 @@ $mention-user-pill-bg-color: #ff0064;
$other-user-pill-bg-color: rgba(0, 0, 0, 0.1);
// groups
-$group-alert-color: #774f7e;
$group-my-groups-placeholder-bg: #f7f7f7;
$group-my-groups-placeholder-fg: #888;
From 3192c345be529bb839fea9eaa0367676cacde599 Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Fri, 3 Nov 2017 14:11:07 +0000
Subject: [PATCH 09/10] rethemedex
Needed, having removed _GroupInviteTile.scss
---
src/skins/vector/css/_components.scss | 1 -
1 file changed, 1 deletion(-)
diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss
index c857a7c3..230b5ae4 100644
--- a/src/skins/vector/css/_components.scss
+++ b/src/skins/vector/css/_components.scss
@@ -35,7 +35,6 @@
@import "./matrix-react-sdk/views/elements/_ProgressBar.scss";
@import "./matrix-react-sdk/views/elements/_RichText.scss";
@import "./matrix-react-sdk/views/elements/_RoleButton.scss";
-@import "./matrix-react-sdk/views/groups/_GroupInviteTile.scss";
@import "./matrix-react-sdk/views/groups/_GroupRoomList.scss";
@import "./matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss";
@import "./matrix-react-sdk/views/login/_ServerConfig.scss";
From 04c866ce9ccb3560a81fffcc3b127cf0efc756cf Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Fri, 3 Nov 2017 14:39:24 +0000
Subject: [PATCH 10/10] Fix #5359 - unbreakable topics not breaking
The room directory CSS has `word-break: break-word` applied to the entire mx_RoomDirectory, which is questionable. For now, add the same rule to RoomDetailList
---
src/skins/vector/css/matrix-react-sdk/structures/_GroupView.scss | 1 +
1 file changed, 1 insertion(+)
diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_GroupView.scss b/src/skins/vector/css/matrix-react-sdk/structures/_GroupView.scss
index 87b46c05..583ab2ce 100644
--- a/src/skins/vector/css/matrix-react-sdk/structures/_GroupView.scss
+++ b/src/skins/vector/css/matrix-react-sdk/structures/_GroupView.scss
@@ -204,6 +204,7 @@ limitations under the License.
flex-grow: 1;
border-top: 1px solid $primary-hairline-color;
padding-top: 10px;
+ word-break: break-word;
}
.mx_GroupView .mx_RoomView_messageListWrapper {