diff --git a/jenkins.sh b/jenkins.sh index 3a4ee0c704..2bccf0f88c 100755 --- a/jenkins.sh +++ b/jenkins.sh @@ -13,6 +13,12 @@ npm install # apparently npm 3.10.3 on node 6.4.0 doesn't upgrade #develop target with npm install unless explicitly asked. npm install matrix-react-sdk matrix-js-sdk +# install olm. A naive 'npm i ./olm/olm-*.tgz' fails because it uses the url +# from our package.json (or even matrix-js-sdk's) in preference. +tar -C olm -xz < olm/olm-*.tgz +rm -r node_modules/olm +cp -r olm/package node_modules/olm + # we may be using a dev branch of react-sdk, in which case we need to build it (cd node_modules/matrix-react-sdk && npm run build) diff --git a/package.json b/package.json index cc87daf5a6..c52e26d0a0 100644 --- a/package.json +++ b/package.json @@ -90,6 +90,6 @@ "webpack": "^1.12.14" }, "optionalDependencies": { - "olm": "https://matrix.org/packages/npm/olm/olm-1.1.0.tgz" + "olm": "https://matrix.org/packages/npm/olm/olm-1.2.0.tgz" } } diff --git a/src/components/structures/BottomLeftMenu.js b/src/components/structures/BottomLeftMenu.js index d36966d297..27ae2924f2 100644 --- a/src/components/structures/BottomLeftMenu.js +++ b/src/components/structures/BottomLeftMenu.js @@ -17,48 +17,88 @@ limitations under the License. 'use strict'; var React = require('react'); +var ReactDOM = require('react-dom'); var sdk = require('matrix-react-sdk') var dis = require('matrix-react-sdk/lib/dispatcher'); module.exports = React.createClass({ displayName: 'BottomLeftMenu', + propTypes: { + collapsed: React.PropTypes.bool.isRequired, + }, + + getInitialState: function() { + return({ + roomsHover : false, + peopleHover : false, + settingsHover : false, + }); + }, + + // Room events + onRoomsClick: function() { + dis.dispatch({action: 'view_create_room'}); + }, + + onRoomsMouseEnter: function() { + this.setState({ roomsHover: true }); + }, + + onRoomsMouseLeave: function() { + this.setState({ roomsHover: false }); + }, + + // People events + onPeopleClick: function() { + dis.dispatch({action: 'view_create_chat'}); + }, + + onPeopleMouseEnter: function() { + this.setState({ peopleHover: true }); + }, + + onPeopleMouseLeave: function() { + this.setState({ peopleHover: false }); + }, + + // Settings events onSettingsClick: function() { dis.dispatch({action: 'view_user_settings'}); }, - onRoomDirectoryClick: function() { - dis.dispatch({action: 'view_room_directory'}); + onSettingsMouseEnter: function() { + this.setState({ settingsHover: true }); }, - onCreateRoomClick: function() { - dis.dispatch({action: 'view_create_room'}); + onSettingsMouseLeave: function() { + this.setState({ settingsHover: false }); }, - getLabel: function(name) { - if (!this.props.collapsed) { - return
{name}
- } - else if (this.state.hover) { + // Get the label/tooltip to show + getLabel: function(label, show) { + if (show) { var RoomTooltip = sdk.getComponent("rooms.RoomTooltip"); - return ; + return ; } }, render: function() { - var BottomLeftMenuTile = sdk.getComponent('rooms.BottomLeftMenuTile'); var TintableSvg = sdk.getComponent('elements.TintableSvg'); return (
-
- +
+ + { this.getLabel("Rooms", this.state.roomsHover) }
-
- +
+ + { this.getLabel("New direct message", this.state.peopleHover) }
-
- +
+ + { this.getLabel("Settings", this.state.settingsHover) }
diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 63b340563f..4d6a5dc804 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -418,8 +418,18 @@ var RoomSubList = React.createClass({ badge =
{subListNotifCount > 99 ? "99+" : subListNotifCount}
; } + // When collapsed, allow a long hover on the header to show user + // the full tag name and room count + var title; + if (this.props.collapsed) { + title = this.props.label; + if (roomCount !== '') { + title += " [" + roomCount + "]"; + } + } + return ( -
+
{ this.props.collapsed ? '' : this.props.label }
{roomCount}
diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index 737b7faa41..ff6ace619a 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -84,6 +84,14 @@ module.exports = React.createClass({ if (this.props.onFinished) this.props.onFinished(); }, + onQuoteClick: function () { + console.log(this.props.mxEvent); + dis.dispatch({ + action: 'quote', + event: this.props.mxEvent, + }); + }, + render: function() { var eventStatus = this.props.mxEvent.status; var resendButton; @@ -141,6 +149,12 @@ module.exports = React.createClass({
); + const quoteButton = ( +
+ Quote +
+ ); + return (
{resendButton} @@ -149,6 +163,7 @@ module.exports = React.createClass({ {viewSourceButton} {unhidePreviewButton} {permalinkButton} + {quoteButton}
); } diff --git a/src/components/views/context_menus/RoomTagContextMenu.js b/src/components/views/context_menus/RoomTagContextMenu.js index 3637a3a5ee..43fd7a553a 100644 --- a/src/components/views/context_menus/RoomTagContextMenu.js +++ b/src/components/views/context_menus/RoomTagContextMenu.js @@ -21,6 +21,8 @@ var React = require('react'); var classNames = require('classnames'); var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); var dis = require('matrix-react-sdk/lib/dispatcher'); +var DMRoomMap = require('matrix-react-sdk/lib/utils/DMRoomMap'); +var Rooms = require('matrix-react-sdk/lib/Rooms'); module.exports = React.createClass({ displayName: 'RoomTagContextMenu', @@ -32,9 +34,11 @@ module.exports = React.createClass({ }, getInitialState: function() { + const dmRoomMap = new DMRoomMap(MatrixClientPeg.get()); return { isFavourite: this.props.room.tags.hasOwnProperty("m.favourite"), isLowPriority: this.props.room.tags.hasOwnProperty("m.lowpriority"), + isDirectMessage: Boolean(dmRoomMap.getUserIdForRoomId(this.props.room.roomId)), }; }, @@ -113,6 +117,43 @@ module.exports = React.createClass({ } }, + _onClickDM: function() { + const newIsDirectMessage = !this.state.isDirectMessage; + this.setState({ + isDirectMessage: newIsDirectMessage, + }); + + if (MatrixClientPeg.get().isGuest()) return; + + let newTarget; + if (newIsDirectMessage) { + const guessedTarget = Rooms.guessDMRoomTarget( + this.props.room, + this.props.room.getMember(MatrixClientPeg.get().credentials.userId), + ); + newTarget = guessedTarget.userId; + } else { + newTarget = null; + } + + // give some time for the user to see the icon change first, since + // this will hide the context menu once it completes + q.delay(500).done(() => { + return Rooms.setDMRoom(this.props.room.roomId, newTarget).finally(() => { + // Close the context menu + if (this.props.onFinished) { + this.props.onFinished(); + }; + }, (err) => { + var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); + Modal.createDialog(ErrorDialog, { + title: "Failed to set Direct Message status of room", + description: err.toString() + }); + }); + }); + }, + _onClickLeave: function() { // Leave room dis.dispatch({ @@ -146,27 +187,33 @@ module.exports = React.createClass({ }, render: function() { - var myUserId = MatrixClientPeg.get().credentials.userId; - var myMember = this.props.room.getMember(myUserId); + const myUserId = MatrixClientPeg.get().credentials.userId; + const myMember = this.props.room.getMember(myUserId); - var favouriteClasses = classNames({ + const favouriteClasses = classNames({ 'mx_RoomTagContextMenu_field': true, 'mx_RoomTagContextMenu_fieldSet': this.state.isFavourite, 'mx_RoomTagContextMenu_fieldDisabled': false, }); - var lowPriorityClasses = classNames({ + const lowPriorityClasses = classNames({ 'mx_RoomTagContextMenu_field': true, 'mx_RoomTagContextMenu_fieldSet': this.state.isLowPriority, 'mx_RoomTagContextMenu_fieldDisabled': false, }); - var leaveClasses = classNames({ + const leaveClasses = classNames({ 'mx_RoomTagContextMenu_field': true, 'mx_RoomTagContextMenu_fieldSet': false, 'mx_RoomTagContextMenu_fieldDisabled': false, }); + const dmClasses = classNames({ + 'mx_RoomTagContextMenu_field': true, + 'mx_RoomTagContextMenu_fieldSet': this.state.isDirectMessage, + 'mx_RoomTagContextMenu_fieldDisabled': false, + }); + if (myMember && myMember.membership === "leave") { return (
@@ -190,6 +237,11 @@ module.exports = React.createClass({ Low Priority
+
+ + + Direct Message +
diff --git a/src/components/views/rooms/RoomTooltip.js b/src/components/views/rooms/RoomTooltip.js index 2f5de83721..bbed5df8a5 100644 --- a/src/components/views/rooms/RoomTooltip.js +++ b/src/components/views/rooms/RoomTooltip.js @@ -18,42 +18,79 @@ limitations under the License. var React = require('react'); var ReactDOM = require('react-dom'); - var dis = require('matrix-react-sdk/lib/dispatcher'); module.exports = React.createClass({ displayName: 'RoomTooltip', - componentDidMount: function() { - var tooltip = ReactDOM.findDOMNode(this); - if (!this.props.bottom) { - // tell the roomlist about us so it can position us - dis.dispatch({ - action: 'view_tooltip', - tooltip: tooltip, - }); - } - else { - tooltip.style.top = (70 + tooltip.parentElement.getBoundingClientRect().top) + "px"; - tooltip.style.display = "block"; - } + propTypes: { + // Alllow the tooltip to be styled by the parent element + className: React.PropTypes.string.isRequired, + // The tooltip is derived from either the room name or a label + room: React.PropTypes.object, + label: React.PropTypes.string, }, + // Create a wrapper for the tooltip outside the parent and attach it to the body element + componentDidMount: function() { + this.tooltipContainer = document.createElement("div"); + this.tooltipContainer.className = "mx_RoomTileTooltip_wrapper"; + document.body.appendChild(this.tooltipContainer); + + this._renderTooltip(); + }, + + componentDidUpdate: function() { + this._renderTooltip(); + }, + + // Remove the wrapper element, as the tooltip has finished using it componentWillUnmount: function() { - if (!this.props.bottom) { - dis.dispatch({ - action: 'view_tooltip', - tooltip: null, - }); - } + dis.dispatch({ + action: 'view_tooltip', + tooltip: null, + parent: null, + }); + + ReactDOM.unmountComponentAtNode(this.tooltipContainer); + document.body.removeChild(this.tooltipContainer); + }, + + _renderTooltip: function() { + var label = this.props.room ? this.props.room.name : this.props.label; + + // Add the parent's position to the tooltips, so it's correctly + // positioned, also taking into account any window zoom + // NOTE: The additional 6 pixels for the left position, is to take account of the + // tooltips chevron + var parent = ReactDOM.findDOMNode(this); + var style = {}; + style.top = parent.getBoundingClientRect().top + window.pageYOffset; + style.left = 6 + parent.getBoundingClientRect().right + window.pageXOffset; + style.display = "block"; + + var tooltip = ( +
+
+ { label } +
+ ); + + // Render the tooltip manually, as we wish it not to be rendered within the parent + this.tooltip = ReactDOM.render(tooltip, this.tooltipContainer); + + // Tell the roomlist about us so it can manipulate us if it wishes + dis.dispatch({ + action: 'view_tooltip', + tooltip: this.tooltip, + parent: parent, + }); }, render: function() { - var label = this.props.room ? this.props.room.name : this.props.label; + // Render a placeholder return ( -
- - { label } +
); } diff --git a/src/skins/vector/css/common.css b/src/skins/vector/css/common.css index 9eb67c3c54..d6047ae825 100644 --- a/src/skins/vector/css/common.css +++ b/src/skins/vector/css/common.css @@ -64,6 +64,11 @@ input[type=text]:focus, textarea:focus { box-shadow: none; } +/* Required by Firefox */ +textarea { + font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; +} + /* Prevent ugly dotted highlight around selected elements in Firefox */ ::-moz-focus-inner { border: 0; @@ -198,14 +203,15 @@ input[type=text]:focus, textarea:focus { height: 36px; border-radius: 40px; border: solid 1px #76cfa6; - font-weight: 400; - font-size: 15px; + font-weight: 600; + font-size: 14px; + font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; margin-left: 0px; margin-right: 8px; padding-left: 1.5em; padding-right: 1.5em; outline: none; - + cursor: pointer; color: #76cfa6; background-color: #fff; } diff --git a/src/skins/vector/css/matrix-react-sdk/views/dialogs/ChatInviteDialog.css b/src/skins/vector/css/matrix-react-sdk/views/dialogs/ChatInviteDialog.css new file mode 100644 index 0000000000..9bd9934ea2 --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/views/dialogs/ChatInviteDialog.css @@ -0,0 +1,83 @@ +/* +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. +*/ + +/* Using a textarea for this element, to circumvent autofill */ +.mx_ChatInviteDialog_input, +.mx_ChatInviteDialog_input:focus +{ + height: 26px; + font-size: 14px; + font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; + padding-left: 12px; + padding-right: 12px; + margin: 0 !important; + border: 0 !important; + outline: 0 !important; + width: 1000%; /* Pretend that this is an "input type=text" */ + resize: none; + overflow: hidden; + vertical-align: middle; + box-sizing: border-box; + word-wrap: nowrap; +} + +.mx_ChatInviteDialog_inputContainer { + border-radius: 3px; + border: solid 1px #f0f0f0; + line-height: 36px; + padding-left: 4px; + padding-right: 4px; + padding-top: 1px; + padding-bottom: 1px; + overflow: hidden; +} + +.mx_ChatInviteDialog_queryList { + position: absolute; + background-color: #fff; + width: 470px; + max-height: 116px; + overflow-y: scroll; + border-radius: 3px; + background-color: #fff; + border: solid 1px #76cfa6; + cursor: pointer; +} + +.mx_ChatInviteDialog_queryListElement .mx_AddressTile { + background-color: #fff; + border: solid 1px #fff; +} + +.mx_ChatInviteDialog_queryListElement.mx_ChatInviteDialog_selected { + background-color: #eaf5f0; /* selected colour */ +} + +.mx_ChatInviteDialog_queryListElement.mx_ChatInviteDialog_selected .mx_AddressTile { + background-color: #eaf5f0; /* selected colour */ + border: solid 1px #eaf5f0; /* selected colour */ +} + +.mx_ChatInviteDialog_cancel { + position: absolute; + right: 11px; + top: 13px; + cursor: pointer; +} + +.mx_ChatInviteDialog_cancel object { + pointer-events: none; +} diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/AddressTile.css b/src/skins/vector/css/matrix-react-sdk/views/elements/AddressTile.css new file mode 100644 index 0000000000..5e22ccaf8d --- /dev/null +++ b/src/skins/vector/css/matrix-react-sdk/views/elements/AddressTile.css @@ -0,0 +1,83 @@ +/* +Copyright 2015, 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_AddressTile { + display: inline-block; + border-radius: 3px; + background-color: rgba(74, 73, 74, 0.1); + border: solid 1px #f0f0f0; + line-height: 26px; + color: #454545; + font-size: 14px; + font-weight: normal; +} + +.mx_AddressTile_network { + display: inline-block; + position: relative; + padding-left: 2px; + padding-right: 4px; + vertical-align: middle; +} + +.mx_AddressTile_avatar { + display: inline-block; + position: relative; + padding-left: 2px; + padding-right: 7px; + vertical-align: middle; +} + +.mx_AddressTile_name { + display: inline-block; + padding-right: 4px; + font-weight: 600; + overflow: hidden; + height: 26px; + vertical-align: middle; +} + +.mx_AddressTile_name.mx_AddressTile_justified { + width: 180px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + vertical-align: middle; +} + +.mx_AddressTile_id { + display: inline-block; + padding-right: 11px; +} + +.mx_AddressTile_id.mx_AddressTile_justified { + width: 200px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + vertical-align: middle; +} + +.mx_AddressTile_dismiss { + display: inline-block; + padding-right: 11px; + padding-left: 1px; + cursor: pointer; +} + +.mx_AddressTile_dismiss object { + pointer-events: none; +} diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css b/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css index 171482a362..f0b3c04645 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css +++ b/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css @@ -20,3 +20,20 @@ .mx_Markdown_ITALIC { font-style: italic; } + +.mx_Markdown_CODE { + padding: .2em 0; + margin: 0; + font-size: 85%; + background-color: rgba(0,0,0,.04); + border-radius: 3px; +} + +.mx_Markdown_HR { + display: block; + background: #e7e7e7; +} + +.mx_Markdown_STRIKETHROUGH { + text-decoration: line-through; +} diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberDeviceInfo.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberDeviceInfo.css index 4eef01ce1a..bba31e3dcd 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberDeviceInfo.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberDeviceInfo.css @@ -15,14 +15,9 @@ limitations under the License. */ .mx_MemberDeviceInfo { - font-size: 12px; - display: table-row; - height: 17px; + padding: 10px 0px; } -.mx_MemberDeviceInfo div { - display: table-cell; -} .mx_MemberDeviceInfo_textButton { color: #fff; @@ -33,25 +28,25 @@ limitations under the License. padding-right: 1em; cursor: pointer; + display: inline; } .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified, .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified, .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked { - color: #fff; width: 17px; border-radius: 17px; text-align: center; } .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified { - background-color: #76cfa6; + color: #76cfa6; } .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified { - background-color: #eca46f; + color: #b2b2b2; } .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked { - background-color: #e55e5e; + color: #e55e5e; } diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css index 57da9faaa6..4c60881561 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css @@ -73,8 +73,3 @@ limitations under the License. margin-left: 8px; line-height: 23px; } - -.mx_MemberInfo_devices { - display: table; - border-spacing: 5px; -} \ No newline at end of file diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css index 9dd93b804c..45bc39cf3b 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css @@ -57,20 +57,31 @@ limitations under the License. .mx_MessageComposer_input { flex: 1; vertical-align: middle; - min-height: 60px; - max-height: 120px; display: flex; - align-items: center; - overflow: auto; + flex-direction: column; + min-height: 60px; + justify-content: center; + align-items: flex-start; font-size: 14px; margin-right: 6px; } -.mx_MessageComposer_input_rte { - border-top: 2px solid #76cfa6; /* placeholder RTE indicator */ + +.mx_MessageComposer_input_empty .public-DraftEditorPlaceholder-root { + display: none; } .mx_MessageComposer_input .DraftEditor-root { + width: 100%; flex: 1; + max-height: 120px; + overflow: auto; +} + +.mx_MessageComposer_input blockquote { + color: rgb(119, 119, 119); + margin: 0 0 16px; + padding: 0 15px; + border-left: 4px solid rgb(221, 221, 221); } .mx_MessageComposer_input textarea { @@ -88,7 +99,8 @@ limitations under the License. color: #454545; background-color: #fff; font-size: 14px; - + max-height: 120px; + overflow: auto; /* needed for FF */ font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; } @@ -122,3 +134,59 @@ limitations under the License. pointer-events: none; } +.mx_MessageComposer_formatting { + cursor: pointer; + margin: 0 11px; +} + +.mx_MessageComposer_formatbar_wrapper { + width: 100%; + background-color: #f7f7f7; + box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.08); +} + +.mx_MessageComposer_formatbar { + margin: auto; + max-width: 960px; + display: flex; + + height: 30px; + + box-sizing: border-box; + padding-left: 62px; + + flex-direction: row; + align-items: center; + font-size: 10px; + color: #888; +} + +.mx_MessageComposer_formatbar * { + margin-right: 4px; +} + +.mx_MessageComposer_format_button, +.mx_MessageComposer_formatbar_cancel, +.mx_MessageComposer_formatbar_markdown { + cursor: pointer; +} + +.mx_MessageComposer_format_button_disabled { + cursor: not-allowed; + opacity: 0.5; +} + +.mx_MessageComposer_formatbar_cancel { + margin-right: 22px; +} + +.mx_MessageComposer_formatbar_markdown { + margin-right: 64px; +} + +.mx_MessageComposer_input_markdownIndicator { + cursor: pointer; + height: 10px; + padding: 4px 4px 4px 0; + opacity: 0.8; +} diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css index 2545650350..2f1da5b292 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css @@ -22,6 +22,14 @@ limitations under the License. height: 34px; } +.mx_RoomTile_tooltip { + display: inline-block; + position: relative; + top: -62px; + left: 46px; +} + + .mx_RoomTile_nameContainer { display: inline-block; width: 180px; @@ -113,7 +121,7 @@ limitations under the License. min-width: 12px; border-radius: 16px; padding: 0px 4px 0px 4px; - z-index: 200; + z-index: 3; } /* Hide the bottom of speech bubble */ diff --git a/src/skins/vector/css/vector-web/structures/LeftPanel.css b/src/skins/vector/css/vector-web/structures/LeftPanel.css index fb023ffeac..12991fc2db 100644 --- a/src/skins/vector/css/vector-web/structures/LeftPanel.css +++ b/src/skins/vector/css/vector-web/structures/LeftPanel.css @@ -80,21 +80,21 @@ limitations under the License. } .mx_LeftPanel .mx_BottomLeftMenu_createRoom, -.mx_LeftPanel .mx_BottomLeftMenu_directory, +.mx_LeftPanel .mx_BottomLeftMenu_people, .mx_LeftPanel .mx_BottomLeftMenu_settings { display: inline-block; cursor: pointer; } .collapsed .mx_BottomLeftMenu_createRoom, -.collapsed .mx_BottomLeftMenu_directory, +.collapsed .mx_BottomLeftMenu_people, .collapsed .mx_BottomLeftMenu_settings { margin-left: 0px ! important; padding-top: 3px ! important; padding-bottom: 3px ! important; } -.mx_LeftPanel .mx_BottomLeftMenu_directory { +.mx_LeftPanel .mx_BottomLeftMenu_people { margin-left: 10px; } @@ -105,3 +105,10 @@ limitations under the License. .mx_LeftPanel.collapsed .mx_BottomLeftMenu_settings { float: none; } + +.mx_LeftPanel .mx_BottomLeftMenu_tooltip { + display: inline-block; + position: relative; + top: -25px; + left: 6px; +} diff --git a/src/skins/vector/css/vector-web/structures/RoomSubList.css b/src/skins/vector/css/vector-web/structures/RoomSubList.css index 4d9b0668fc..fef044162e 100644 --- a/src/skins/vector/css/vector-web/structures/RoomSubList.css +++ b/src/skins/vector/css/vector-web/structures/RoomSubList.css @@ -39,7 +39,7 @@ limitations under the License. padding-top: 6px; padding-bottom: 6px; cursor: pointer; - background-color: rgba(118, 207, 166, 0.2); + background-color: rgba(118, 207, 166, 0.2); /* Should be #d3ede1, but not a magic colour */ border-top: solid 2px #eaf5f0; } @@ -90,9 +90,11 @@ limitations under the License. background-color: #76cfa6; } +/* .collapsed .mx_RoomSubList_badge { display: none; } +*/ .mx_RoomSubList_badgeHighlight { background-color: #ff0064; diff --git a/src/skins/vector/css/vector-web/views/rooms/RoomTooltip.css b/src/skins/vector/css/vector-web/views/rooms/RoomTooltip.css index deb8cd3f96..bf69f9e7bc 100644 --- a/src/skins/vector/css/vector-web/views/rooms/RoomTooltip.css +++ b/src/skins/vector/css/vector-web/views/rooms/RoomTooltip.css @@ -16,17 +16,37 @@ limitations under the License. .mx_RoomTooltip_chevron { position: absolute; - left: -9px; - top: 7px; + left: -8px; + top: 4px; + width: 0; + height: 0; + border-top: 8px solid transparent; + border-right: 8px solid rgba(187, 187, 187, 0.5); + border-bottom: 8px solid transparent; +} + +.mx_RoomTooltip_chevron:after{ + content:''; + width: 0; + height: 0; + border-top: 7px solid transparent; + border-right: 7px solid #fff; + border-bottom: 7px solid transparent; + position:absolute; + top: -7px; + left: 1px; } .mx_RoomTooltip { display: none; position: fixed; - border: 1px solid #a4a4a4; - border-radius: 8px; + border: 1px solid rgba(187, 187, 187, 0.5); + border-radius: 5px; background-color: #fff; z-index: 2000; - left: 52px; - padding: 6px; + padding: 5px; + pointer-events: none; + line-height: 14px; + font-size: 13px; } + diff --git a/src/skins/vector/img/button-md-false.png b/src/skins/vector/img/button-md-false.png new file mode 100644 index 0000000000..6debbccc93 Binary files /dev/null and b/src/skins/vector/img/button-md-false.png differ diff --git a/src/skins/vector/img/button-md-false.svg b/src/skins/vector/img/button-md-false.svg new file mode 100644 index 0000000000..6414933d96 --- /dev/null +++ b/src/skins/vector/img/button-md-false.svg @@ -0,0 +1,29 @@ + + + + D335F9E8-C813-47D7-B1BE-C8DEF2C8214F + Created with sketchtool. + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-md-false@2x.png b/src/skins/vector/img/button-md-false@2x.png new file mode 100644 index 0000000000..497f5385d1 Binary files /dev/null and b/src/skins/vector/img/button-md-false@2x.png differ diff --git a/src/skins/vector/img/button-md-false@3x.png b/src/skins/vector/img/button-md-false@3x.png new file mode 100644 index 0000000000..1184e6b351 Binary files /dev/null and b/src/skins/vector/img/button-md-false@3x.png differ diff --git a/src/skins/vector/img/button-md-true.png b/src/skins/vector/img/button-md-true.png new file mode 100644 index 0000000000..2e39c55e1e Binary files /dev/null and b/src/skins/vector/img/button-md-true.png differ diff --git a/src/skins/vector/img/button-md-true.svg b/src/skins/vector/img/button-md-true.svg new file mode 100644 index 0000000000..2acc4f675c --- /dev/null +++ b/src/skins/vector/img/button-md-true.svg @@ -0,0 +1,14 @@ + + + + 2A63B135-4281-4FBB-A88C-012AE22E9594 + Created with sketchtool. + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-md-true@2x.png b/src/skins/vector/img/button-md-true@2x.png new file mode 100644 index 0000000000..ad9067f385 Binary files /dev/null and b/src/skins/vector/img/button-md-true@2x.png differ diff --git a/src/skins/vector/img/button-md-true@3x.png b/src/skins/vector/img/button-md-true@3x.png new file mode 100644 index 0000000000..d615867dc4 Binary files /dev/null and b/src/skins/vector/img/button-md-true@3x.png differ diff --git a/src/skins/vector/img/button-text-bold-o-n.svg b/src/skins/vector/img/button-text-bold-o-n.svg new file mode 100644 index 0000000000..161e740e90 --- /dev/null +++ b/src/skins/vector/img/button-text-bold-o-n.svg @@ -0,0 +1,17 @@ + + + + 01F3F9B2-8F38-4BAF-A345-AECAC3D88E79 + Created with sketchtool. + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-bold.svg b/src/skins/vector/img/button-text-bold.svg new file mode 100644 index 0000000000..0fd0baa07e --- /dev/null +++ b/src/skins/vector/img/button-text-bold.svg @@ -0,0 +1,17 @@ + + + + 9BC64A5B-F157-43FF-BCC4-02D30CDF520B + Created with sketchtool. + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-bullet-o-n.svg b/src/skins/vector/img/button-text-bullet-o-n.svg new file mode 100644 index 0000000000..d4a40e889c --- /dev/null +++ b/src/skins/vector/img/button-text-bullet-o-n.svg @@ -0,0 +1,20 @@ + + + + 654917CF-20A4-49B6-B0A1-9875D7B733C8 + Created with sketchtool. + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-bullet.svg b/src/skins/vector/img/button-text-bullet.svg new file mode 100644 index 0000000000..ae3e640d8e --- /dev/null +++ b/src/skins/vector/img/button-text-bullet.svg @@ -0,0 +1,20 @@ + + + + B7D94619-44BC-4184-A60A-DBC5BB54E5F9 + Created with sketchtool. + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-code-o-n.svg b/src/skins/vector/img/button-text-code-o-n.svg new file mode 100644 index 0000000000..8d1439c97b --- /dev/null +++ b/src/skins/vector/img/button-text-code-o-n.svg @@ -0,0 +1,25 @@ + + + + B76754AB-42E6-48D2-9443-80CBC0DE02ED + Created with sketchtool. + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-code.svg b/src/skins/vector/img/button-text-code.svg new file mode 100644 index 0000000000..24026cb709 --- /dev/null +++ b/src/skins/vector/img/button-text-code.svg @@ -0,0 +1,25 @@ + + + + 4CAFF494-61AE-4916-AFE8-D1E62F7CF0DE + Created with sketchtool. + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-formatting.svg b/src/skins/vector/img/button-text-formatting.svg new file mode 100644 index 0000000000..d3fc3f5f54 --- /dev/null +++ b/src/skins/vector/img/button-text-formatting.svg @@ -0,0 +1,18 @@ + + + + F69CBF5F-0BEC-47E8-B1DF-125D6376C0C9 + Created with sketchtool. + + + + + + + A + a + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-italic-o-n.svg b/src/skins/vector/img/button-text-italic-o-n.svg new file mode 100644 index 0000000000..15fe588596 --- /dev/null +++ b/src/skins/vector/img/button-text-italic-o-n.svg @@ -0,0 +1,17 @@ + + + + 116426C2-0B55-480E-92B3-57D4B3ABAB90 + Created with sketchtool. + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-italic.svg b/src/skins/vector/img/button-text-italic.svg new file mode 100644 index 0000000000..b5722e827b --- /dev/null +++ b/src/skins/vector/img/button-text-italic.svg @@ -0,0 +1,17 @@ + + + + 9FBC844D-96CF-4DCB-B545-FCD23727218B + Created with sketchtool. + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-numbullet-o-n.svg b/src/skins/vector/img/button-text-numbullet-o-n.svg new file mode 100644 index 0000000000..869a2c2cc2 --- /dev/null +++ b/src/skins/vector/img/button-text-numbullet-o-n.svg @@ -0,0 +1,20 @@ + + + + 294F929B-31AA-4D0C-98B3-9CA96764060D + Created with sketchtool. + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-numbullet.svg b/src/skins/vector/img/button-text-numbullet.svg new file mode 100644 index 0000000000..8e5b8b87b6 --- /dev/null +++ b/src/skins/vector/img/button-text-numbullet.svg @@ -0,0 +1,20 @@ + + + + F0F58459-A13A-48C5-9332-ABFB96726F05 + Created with sketchtool. + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-quote-o-n.svg b/src/skins/vector/img/button-text-quote-o-n.svg new file mode 100644 index 0000000000..f8a86125c9 --- /dev/null +++ b/src/skins/vector/img/button-text-quote-o-n.svg @@ -0,0 +1,17 @@ + + + + 3B24B8C7-64BE-4B3E-A748-94DB72E1210F + Created with sketchtool. + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-quote.svg b/src/skins/vector/img/button-text-quote.svg new file mode 100644 index 0000000000..d70c261f5d --- /dev/null +++ b/src/skins/vector/img/button-text-quote.svg @@ -0,0 +1,17 @@ + + + + BFC0418B-9081-4789-A231-B75953157748 + Created with sketchtool. + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-strike-o-n.svg b/src/skins/vector/img/button-text-strike-o-n.svg new file mode 100644 index 0000000000..2914fcabe6 --- /dev/null +++ b/src/skins/vector/img/button-text-strike-o-n.svg @@ -0,0 +1,18 @@ + + + + 69B11088-0F3A-4E14-BD9F-4FEF4115E99B + Created with sketchtool. + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-strike.svg b/src/skins/vector/img/button-text-strike.svg new file mode 100644 index 0000000000..5f262dc350 --- /dev/null +++ b/src/skins/vector/img/button-text-strike.svg @@ -0,0 +1,18 @@ + + + + A34F2223-34C6-46AE-AA47-38EC8984E9B3 + Created with sketchtool. + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-underline-o-n.svg b/src/skins/vector/img/button-text-underline-o-n.svg new file mode 100644 index 0000000000..870be3ce6a --- /dev/null +++ b/src/skins/vector/img/button-text-underline-o-n.svg @@ -0,0 +1,18 @@ + + + + FD84FF7C-43E4-4312-90AB-5A59AD018377 + Created with sketchtool. + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/button-text-underline.svg b/src/skins/vector/img/button-text-underline.svg new file mode 100644 index 0000000000..26f448539c --- /dev/null +++ b/src/skins/vector/img/button-text-underline.svg @@ -0,0 +1,18 @@ + + + + 13E7EE68-9B16-4A3D-8F9F-31E4BAB7E438 + Created with sketchtool. + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/icon-address-delete.svg b/src/skins/vector/img/icon-address-delete.svg new file mode 100644 index 0000000000..1289d5aafc --- /dev/null +++ b/src/skins/vector/img/icon-address-delete.svg @@ -0,0 +1,15 @@ + + + + 943783E9-DBD7-4D4E-BAC9-35437C17C2C4 + Created with sketchtool. + + + + + + + + + + diff --git a/src/skins/vector/img/icon-text-cancel.svg b/src/skins/vector/img/icon-text-cancel.svg new file mode 100644 index 0000000000..ce28d128aa --- /dev/null +++ b/src/skins/vector/img/icon-text-cancel.svg @@ -0,0 +1,15 @@ + + + + 28D80248-63BA-4A5F-9216-4CFE72784BAC + Created with sketchtool. + + + + + + + + + + \ No newline at end of file diff --git a/src/skins/vector/img/icon_context_person.svg b/src/skins/vector/img/icon_context_person.svg new file mode 100644 index 0000000000..fff019d377 --- /dev/null +++ b/src/skins/vector/img/icon_context_person.svg @@ -0,0 +1,85 @@ + + + + + + image/svg+xml + + 81230A28-D944-4572-B5DB-C03CAA2B1FCA + + + + + + 81230A28-D944-4572-B5DB-C03CAA2B1FCA + Created with sketchtool. + + + + + + + + + + diff --git a/src/skins/vector/img/icon_context_person_on.svg b/src/skins/vector/img/icon_context_person_on.svg new file mode 100644 index 0000000000..362944332d --- /dev/null +++ b/src/skins/vector/img/icon_context_person_on.svg @@ -0,0 +1,85 @@ + + + + + + image/svg+xml + + 81230A28-D944-4572-B5DB-C03CAA2B1FCA + + + + + + 81230A28-D944-4572-B5DB-C03CAA2B1FCA + Created with sketchtool. + + + + + + + + + + diff --git a/src/skins/vector/img/icons-close-button.svg b/src/skins/vector/img/icons-close-button.svg new file mode 100644 index 0000000000..f17940f58c --- /dev/null +++ b/src/skins/vector/img/icons-close-button.svg @@ -0,0 +1,15 @@ + + + + 206C270A-EB00-48E4-8CC3-5D403C59177C + Created with sketchtool. + + + + + + + + + + diff --git a/src/skins/vector/img/icons-people.svg b/src/skins/vector/img/icons-people.svg index d6867a3f3a..8854506127 100644 --- a/src/skins/vector/img/icons-people.svg +++ b/src/skins/vector/img/icons-people.svg @@ -1,9 +1,22 @@ - - - - - - - - + + + + 81230A28-D944-4572-B5DB-C03CAA2B1FCA + Created with sketchtool. + + + + + + + + + + + + + + + + diff --git a/src/skins/vector/img/search-icon-vector.svg b/src/skins/vector/img/search-icon-vector.svg new file mode 100644 index 0000000000..13728f97ae --- /dev/null +++ b/src/skins/vector/img/search-icon-vector.svg @@ -0,0 +1,53 @@ + + + + 2EFF6BB8-D2CC-44E6-85E9-D057E4AE9DF2 + Created with sketchtool. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +