From 105c54a1f12ab3f0d297bab93d56cf91c4a9ac1f Mon Sep 17 00:00:00 2001 From: David Baker Date: Wed, 28 Jun 2017 13:57:20 +0100 Subject: [PATCH 1/5] CSS for Groups page --- src/skins/vector/css/_components.scss | 1 + .../structures/_MyGroups.scss | 20 +++++++++++++++++++ 2 files changed, 21 insertions(+) create mode 100644 src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss index 18518bea..bc99cf3d 100644 --- a/src/skins/vector/css/_components.scss +++ b/src/skins/vector/css/_components.scss @@ -6,6 +6,7 @@ @import "./matrix-react-sdk/structures/_GroupView.scss"; @import "./matrix-react-sdk/structures/_LoginBox.scss"; @import "./matrix-react-sdk/structures/_MatrixChat.scss"; +@import "./matrix-react-sdk/structures/_MyGroups.scss"; @import "./matrix-react-sdk/structures/_NotificationPanel.scss"; @import "./matrix-react-sdk/structures/_RoomStatusBar.scss"; @import "./matrix-react-sdk/structures/_RoomView.scss"; diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss new file mode 100644 index 00000000..59908f4d --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss @@ -0,0 +1,20 @@ +/* +Copyright 2017 Vector Creations 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_MyGroups_buttonRow { + margin-bottom: 20px; +} + From 796b51113f8a0dcd7f930e012660354340acc4d1 Mon Sep 17 00:00:00 2001 From: David Baker Date: Thu, 29 Jun 2017 16:59:26 +0100 Subject: [PATCH 2/5] CSS for Create Group dialog --- src/skins/vector/css/_components.scss | 1 + .../views/dialogs/_CreateGroupDialog.scss | 30 +++++++++++++++++++ 2 files changed, 31 insertions(+) create mode 100644 src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss index bc99cf3d..6680b282 100644 --- a/src/skins/vector/css/_components.scss +++ b/src/skins/vector/css/_components.scss @@ -19,6 +19,7 @@ @import "./matrix-react-sdk/views/dialogs/_ChatCreateOrReuseChatDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_ChatInviteDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_ConfirmUserActionDialog.scss"; +@import "./matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_EncryptedEventDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_SetMxIdDialog.scss"; @import "./matrix-react-sdk/views/dialogs/_UnknownDeviceDialog.scss"; diff --git a/src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss new file mode 100644 index 00000000..f946a07a --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss @@ -0,0 +1,30 @@ +/* +Copyright 2017 Vector Creations 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_CreateGroupDialog_label { + text-align: left; + padding-bottom: 12px; +} + +.mx_CreateGroupDialog_input { + font-size: 15px; + border-radius: 3px; + border: 1px solid $input-border-color; + padding: 9px; + color: $primary-fg-color; + background-color: $primary-bg-color; +} + From 17bd32337619998aea5b3448552039847914643f Mon Sep 17 00:00:00 2001 From: David Baker Date: Fri, 30 Jun 2017 14:00:17 +0100 Subject: [PATCH 3/5] Make Groups page look more like design --- .../structures/_MyGroups.scss | 27 +++++++++++++++++-- 1 file changed, 25 insertions(+), 2 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 59908f4d..9b7871e7 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss @@ -14,7 +14,30 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_MyGroups_buttonRow { - margin-bottom: 20px; +.mx_MyGroups_joinCreateBox { + display: table; + margin-bottom: 30px; } +.mx_MyGroups_createBox, .mx_MyGroups_joinBox { + display: table-cell; + width: 40%; +} + +.mx_MyGroups_joinCreateHeader { + font-weight: bold; + margin-bottom: 10px; +} + +.mx_MyGroups_joinCreateButton { + float: left; + margin: 10px; +} + +.mx_MyGroups_joinCreateButton object { + pointer-events: none; +} + +.mx_MyGroups_content { + clear: left; +} From b4602fd2b106005229bf3a764cbc0ce7ee2ad9a6 Mon Sep 17 00:00:00 2001 From: David Baker Date: Fri, 7 Jul 2017 10:49:19 +0100 Subject: [PATCH 4/5] Comment --- src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss | 1 + 1 file changed, 1 insertion(+) 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 9b7871e7..8de7b20f 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss @@ -35,6 +35,7 @@ limitations under the License. } .mx_MyGroups_joinCreateButton object { + /* Otherwise the SVG object absorbs clicks and the button doesn't work */ pointer-events: none; } From 5f5a802b44e8da36c4ec1f156a50417fb3936f69 Mon Sep 17 00:00:00 2001 From: David Baker Date: Fri, 7 Jul 2017 18:34:57 +0100 Subject: [PATCH 5/5] Add CSS from react-sdk PR feedback --- .../matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss index f946a07a..ebe89027 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/dialogs/_CreateGroupDialog.scss @@ -14,6 +14,11 @@ See the License for the specific language governing permissions and limitations under the License. */ +.mx_CreateGroupDialog_inputRow { + margin-top: 10px; + margin-bottom: 10px; +} + .mx_CreateGroupDialog_label { text-align: left; padding-bottom: 12px;