From 645db7fa2f452d925a5356366d5e6698e2a00b8e Mon Sep 17 00:00:00 2001 From: Richard van der Hoff Date: Mon, 1 Aug 2016 13:46:14 +0100 Subject: [PATCH] CSS for device management UI --- src/skins/vector/css/common.css | 12 +++++ .../views/settings/DevicesPanel.css | 47 +++++++++++++++++++ 2 files changed, 59 insertions(+) create mode 100644 src/skins/vector/css/matrix-react-sdk/views/settings/DevicesPanel.css diff --git a/src/skins/vector/css/common.css b/src/skins/vector/css/common.css index 1d4be178b5..bc2173094d 100644 --- a/src/skins/vector/css/common.css +++ b/src/skins/vector/css/common.css @@ -270,3 +270,15 @@ input[type=text]:focus, textarea:focus { background-color: #76CFA6; color: white; } + +/** green button with rounded corners */ +.textButton { + color: #fff; + background-color: #76cfa6; + border-radius: 17px; + text-align: center; + padding-left: 1em; + padding-right: 1em; + cursor: pointer; + display: inline; +} diff --git a/src/skins/vector/css/matrix-react-sdk/views/settings/DevicesPanel.css b/src/skins/vector/css/matrix-react-sdk/views/settings/DevicesPanel.css new file mode 100644 index 0000000000..1b60834a4e --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/views/settings/DevicesPanel.css @@ -0,0 +1,47 @@ +/* +Copyright 2016 OpenMarket 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_DevicesPanel { + display: table; + table-layout: fixed; + width: 880px; + border-spacing: 2px; +} + +.mx_DevicesPanel_header { + display: table-header-group; + font-weight: bold; +} + +.mx_DevicesPanel_header > div { + display: table-cell; +} + +.mx_DevicesPanel_header .mx_DevicesPanel_deviceLastSeen { + width: 30%; +} + +.mx_DevicesPanel_header .mx_DevicesPanel_deviceButtons { + width: 20%; +} + +.mx_DevicesPanel_device { + display: table-row; +} + +.mx_DevicesPanel_device > div { + display: table-cell; +}