PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Merge branch 'develop' into matthew/notif-panel

Browse source
This commit is contained in:
Matthew Hodgson 2016-09-09 11:20:10 +01:00
commit e75148e799
50 changed files with 1182 additions and 92 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
jenkins.sh
View file

@ -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. # 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 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 # 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) (cd node_modules/matrix-react-sdk && npm run build)

2
package.json
View file

@ -90,6 +90,6 @@
"webpack": "^1.12.14" "webpack": "^1.12.14"
}, },
"optionalDependencies": { "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"
} }
} }

74
src/components/structures/BottomLeftMenu.js
View file

@ -17,48 +17,88 @@ limitations under the License.
'use strict'; 'use strict';
var React = require('react'); var React = require('react');
var ReactDOM = require('react-dom');
var sdk = require('matrix-react-sdk') var sdk = require('matrix-react-sdk')
var dis = require('matrix-react-sdk/lib/dispatcher'); var dis = require('matrix-react-sdk/lib/dispatcher');
module.exports = React.createClass({ module.exports = React.createClass({
displayName: 'BottomLeftMenu', 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() { onSettingsClick: function() {
dis.dispatch({action: 'view_user_settings'}); dis.dispatch({action: 'view_user_settings'});
}, },
onRoomDirectoryClick: function() { onSettingsMouseEnter: function() {
dis.dispatch({action: 'view_room_directory'}); this.setState({ settingsHover: true });
}, },
onCreateRoomClick: function() { onSettingsMouseLeave: function() {
dis.dispatch({action: 'view_create_room'}); this.setState({ settingsHover: false });
}, },
getLabel: function(name) { // Get the label/tooltip to show
if (!this.props.collapsed) { getLabel: function(label, show) {
return <div className="mx_RoomTile_name">{name}</div> if (show) {
}
else if (this.state.hover) {
var RoomTooltip = sdk.getComponent("rooms.RoomTooltip"); var RoomTooltip = sdk.getComponent("rooms.RoomTooltip");
return <RoomTooltip name={name}/>; return <RoomTooltip className="mx_BottomLeftMenu_tooltip" label={label} />;
} }
}, },
render: function() { render: function() {
var BottomLeftMenuTile = sdk.getComponent('rooms.BottomLeftMenuTile');
var TintableSvg = sdk.getComponent('elements.TintableSvg'); var TintableSvg = sdk.getComponent('elements.TintableSvg');
return ( return (
<div className="mx_BottomLeftMenu"> <div className="mx_BottomLeftMenu">
<div className="mx_BottomLeftMenu_options"> <div className="mx_BottomLeftMenu_options">
<div className="mx_BottomLeftMenu_createRoom" title="Start chat" onClick={ this.onCreateRoomClick }> <div className="mx_BottomLeftMenu_createRoom" onClick={ this.onRoomsClick } onMouseEnter={ this.onRoomsMouseEnter } onMouseLeave={ this.onRoomsMouseLeave } >
<TintableSvg src="img/icons-create-room.svg" width="25" height="25"/> <TintableSvg src="img/icons-create-room.svg" width="25" height="25" />
{ this.getLabel("Rooms", this.state.roomsHover) }
</div> </div>
<div className="mx_BottomLeftMenu_directory" title="Room directory" onClick={ this.onRoomDirectoryClick }> <div className="mx_BottomLeftMenu_people" onClick={ this.onPeopleClick } onMouseEnter={ this.onPeopleMouseEnter } onMouseLeave={ this.onPeopleMouseLeave } >
<TintableSvg src="img/icons-directory.svg" width="25" height="25"/> <TintableSvg src="img/icons-people.svg" width="25" height="25" />
{ this.getLabel("New direct message", this.state.peopleHover) }
</div> </div>
<div className="mx_BottomLeftMenu_settings" title="Settings" onClick={ this.onSettingsClick }> <div className="mx_BottomLeftMenu_settings" onClick={ this.onSettingsClick } onMouseEnter={ this.onSettingsMouseEnter } onMouseLeave={ this.onSettingsMouseLeave } >
<TintableSvg src="img/icons-settings.svg" width="25" height="25"/> <TintableSvg src="img/icons-settings.svg" width="25" height="25" />
{ this.getLabel("Settings", this.state.settingsHover) }
</div> </div>
</div> </div>
</div> </div>

12
src/components/structures/RoomSubList.js
View file

@ -418,8 +418,18 @@ var RoomSubList = React.createClass({
badge = <div className={badgeClasses}>{subListNotifCount > 99 ? "99+" : subListNotifCount}</div>; badge = <div className={badgeClasses}>{subListNotifCount > 99 ? "99+" : subListNotifCount}</div>;
} }
// 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 ( return (
<div className="mx_RoomSubList_labelContainer" ref="header"> <div className="mx_RoomSubList_labelContainer" title={ title } ref="header">
<div onClick={ this.onClick } className="mx_RoomSubList_label"> <div onClick={ this.onClick } className="mx_RoomSubList_label">
{ this.props.collapsed ? '' : this.props.label } { this.props.collapsed ? '' : this.props.label }
<div className="mx_RoomSubList_roomCount">{roomCount}</div> <div className="mx_RoomSubList_roomCount">{roomCount}</div>

15
src/components/views/context_menus/MessageContextMenu.js
View file

@ -84,6 +84,14 @@ module.exports = React.createClass({
if (this.props.onFinished) this.props.onFinished(); if (this.props.onFinished) this.props.onFinished();
}, },
onQuoteClick: function () {
console.log(this.props.mxEvent);
dis.dispatch({
action: 'quote',
event: this.props.mxEvent,
});
},
render: function() { render: function() {
var eventStatus = this.props.mxEvent.status; var eventStatus = this.props.mxEvent.status;
var resendButton; var resendButton;
@ -141,6 +149,12 @@ module.exports = React.createClass({
</div> </div>
); );
const quoteButton = (
<div className="mx_MessageContextMenu_field" onClick={this.onQuoteClick}>
Quote
</div>
);
return ( return (
<div> <div>
{resendButton} {resendButton}
@ -149,6 +163,7 @@ module.exports = React.createClass({
{viewSourceButton} {viewSourceButton}
{unhidePreviewButton} {unhidePreviewButton}
{permalinkButton} {permalinkButton}
{quoteButton}
</div> </div>
); );
} }

62
src/components/views/context_menus/RoomTagContextMenu.js
View file

@ -21,6 +21,8 @@ var React = require('react');
var classNames = require('classnames'); var classNames = require('classnames');
var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
var dis = require('matrix-react-sdk/lib/dispatcher'); 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({ module.exports = React.createClass({
displayName: 'RoomTagContextMenu', displayName: 'RoomTagContextMenu',
@ -32,9 +34,11 @@ module.exports = React.createClass({
}, },
getInitialState: function() { getInitialState: function() {
const dmRoomMap = new DMRoomMap(MatrixClientPeg.get());
return { return {
isFavourite: this.props.room.tags.hasOwnProperty("m.favourite"), isFavourite: this.props.room.tags.hasOwnProperty("m.favourite"),
isLowPriority: this.props.room.tags.hasOwnProperty("m.lowpriority"), 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() { _onClickLeave: function() {
// Leave room // Leave room
dis.dispatch({ dis.dispatch({
@ -146,27 +187,33 @@ module.exports = React.createClass({
}, },
render: function() { render: function() {
var myUserId = MatrixClientPeg.get().credentials.userId; const myUserId = MatrixClientPeg.get().credentials.userId;
var myMember = this.props.room.getMember(myUserId); const myMember = this.props.room.getMember(myUserId);
var favouriteClasses = classNames({ const favouriteClasses = classNames({
'mx_RoomTagContextMenu_field': true, 'mx_RoomTagContextMenu_field': true,
'mx_RoomTagContextMenu_fieldSet': this.state.isFavourite, 'mx_RoomTagContextMenu_fieldSet': this.state.isFavourite,
'mx_RoomTagContextMenu_fieldDisabled': false, 'mx_RoomTagContextMenu_fieldDisabled': false,
}); });
var lowPriorityClasses = classNames({ const lowPriorityClasses = classNames({
'mx_RoomTagContextMenu_field': true, 'mx_RoomTagContextMenu_field': true,
'mx_RoomTagContextMenu_fieldSet': this.state.isLowPriority, 'mx_RoomTagContextMenu_fieldSet': this.state.isLowPriority,
'mx_RoomTagContextMenu_fieldDisabled': false, 'mx_RoomTagContextMenu_fieldDisabled': false,
}); });
var leaveClasses = classNames({ const leaveClasses = classNames({
'mx_RoomTagContextMenu_field': true, 'mx_RoomTagContextMenu_field': true,
'mx_RoomTagContextMenu_fieldSet': false, 'mx_RoomTagContextMenu_fieldSet': false,
'mx_RoomTagContextMenu_fieldDisabled': 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") { if (myMember && myMember.membership === "leave") {
return ( return (
<div> <div>
@ -190,6 +237,11 @@ module.exports = React.createClass({
<img className="mx_RoomTagContextMenu_icon_set" src="img/icon_context_low_on.svg" width="15" height="15" /> <img className="mx_RoomTagContextMenu_icon_set" src="img/icon_context_low_on.svg" width="15" height="15" />
Low Priority Low Priority
</div> </div>
<div className={ dmClasses } onClick={this._onClickDM} >
<img className="mx_RoomTagContextMenu_icon" src="img/icon_context_person.svg" width="15" height="15" />
<img className="mx_RoomTagContextMenu_icon_set" src="img/icon_context_person_on.svg" width="15" height="15" />
Direct Message
</div>
<hr className="mx_RoomTagContextMenu_separator" /> <hr className="mx_RoomTagContextMenu_separator" />
<div className={ leaveClasses } onClick={(myMember && myMember.membership === "join") ? this._onClickLeave : null} > <div className={ leaveClasses } onClick={(myMember && myMember.membership === "join") ? this._onClickLeave : null} >
<img className="mx_RoomTagContextMenu_icon" src="img/icon_context_delete.svg" width="15" height="15" /> <img className="mx_RoomTagContextMenu_icon" src="img/icon_context_delete.svg" width="15" height="15" />

85
src/components/views/rooms/RoomTooltip.js
View file

@ -18,42 +18,79 @@ limitations under the License.
var React = require('react'); var React = require('react');
var ReactDOM = require('react-dom'); var ReactDOM = require('react-dom');
var dis = require('matrix-react-sdk/lib/dispatcher'); var dis = require('matrix-react-sdk/lib/dispatcher');
module.exports = React.createClass({ module.exports = React.createClass({
displayName: 'RoomTooltip', displayName: 'RoomTooltip',
componentDidMount: function() { propTypes: {
var tooltip = ReactDOM.findDOMNode(this); // Alllow the tooltip to be styled by the parent element
if (!this.props.bottom) { className: React.PropTypes.string.isRequired,
// tell the roomlist about us so it can position us // The tooltip is derived from either the room name or a label
dis.dispatch({ room: React.PropTypes.object,
action: 'view_tooltip', label: React.PropTypes.string,
tooltip: tooltip,
});
}
else {
tooltip.style.top = (70 + tooltip.parentElement.getBoundingClientRect().top) + "px";
tooltip.style.display = "block";
}
}, },
// 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() { componentWillUnmount: function() {
if (!this.props.bottom) { dis.dispatch({
dis.dispatch({ action: 'view_tooltip',
action: 'view_tooltip', tooltip: null,
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 = (
<div className="mx_RoomTooltip" style={style} >
<div className="mx_RoomTooltip_chevron"></div>
{ label }
</div>
);
// 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() { render: function() {
var label = this.props.room ? this.props.room.name : this.props.label; // Render a placeholder
return ( return (
<div className="mx_RoomTooltip"> <div className={ this.props.className } >
<img className="mx_RoomTooltip_chevron" src="img/chevron-left.png" width="9" height="16"/>
{ label }
</div> </div>
); );
} }

12
src/skins/vector/css/common.css
View file

@ -64,6 +64,11 @@ input[type=text]:focus, textarea:focus {
box-shadow: none; box-shadow: none;
} }
/* Required by Firefox */
textarea {
font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
}
/* Prevent ugly dotted highlight around selected elements in Firefox */ /* Prevent ugly dotted highlight around selected elements in Firefox */
::-moz-focus-inner { ::-moz-focus-inner {
border: 0; border: 0;
@ -198,14 +203,15 @@ input[type=text]:focus, textarea:focus {
height: 36px; height: 36px;
border-radius: 40px; border-radius: 40px;
border: solid 1px #76cfa6; border: solid 1px #76cfa6;
font-weight: 400; font-weight: 600;
font-size: 15px; font-size: 14px;
font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
margin-left: 0px; margin-left: 0px;
margin-right: 8px; margin-right: 8px;
padding-left: 1.5em; padding-left: 1.5em;
padding-right: 1.5em; padding-right: 1.5em;
outline: none; outline: none;
cursor: pointer;
color: #76cfa6; color: #76cfa6;
background-color: #fff; background-color: #fff;
} }

83
src/skins/vector/css/matrix-react-sdk/views/dialogs/ChatInviteDialog.css Normal file
View file

@ -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;
}

83
src/skins/vector/css/matrix-react-sdk/views/elements/AddressTile.css Normal file
View file

@ -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;
}

17
src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css
View file

@ -20,3 +20,20 @@
.mx_Markdown_ITALIC { .mx_Markdown_ITALIC {
font-style: 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;
}

15
src/skins/vector/css/matrix-react-sdk/views/rooms/MemberDeviceInfo.css
View file

@ -15,14 +15,9 @@ limitations under the License.
*/ */
.mx_MemberDeviceInfo { .mx_MemberDeviceInfo {
font-size: 12px; padding: 10px 0px;
display: table-row;
height: 17px;
} }
.mx_MemberDeviceInfo div {
display: table-cell;
}
.mx_MemberDeviceInfo_textButton { .mx_MemberDeviceInfo_textButton {
color: #fff; color: #fff;
@ -33,25 +28,25 @@ limitations under the License.
padding-right: 1em; padding-right: 1em;
cursor: pointer; cursor: pointer;
display: inline;
} }
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified, .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified,
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified, .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified,
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked { .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked {
color: #fff;
width: 17px; width: 17px;
border-radius: 17px; border-radius: 17px;
text-align: center; text-align: center;
} }
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified { .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_verified {
background-color: #76cfa6; color: #76cfa6;
} }
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified { .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_unverified {
background-color: #eca46f; color: #b2b2b2;
} }
.mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked { .mx_MemberDeviceInfo div.mx_MemberDeviceInfo_blocked {
background-color: #e55e5e; color: #e55e5e;
} }

5
src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css
View file

@ -73,8 +73,3 @@ limitations under the License.
margin-left: 8px; margin-left: 8px;
line-height: 23px; line-height: 23px;
} }
.mx_MemberInfo_devices {
display: table;
border-spacing: 5px;
}

82
src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
View file

@ -57,20 +57,31 @@ limitations under the License.
.mx_MessageComposer_input { .mx_MessageComposer_input {
flex: 1; flex: 1;
vertical-align: middle; vertical-align: middle;
min-height: 60px;
max-height: 120px;
display: flex; display: flex;
align-items: center; flex-direction: column;
overflow: auto; min-height: 60px;
justify-content: center;
align-items: flex-start;
font-size: 14px; font-size: 14px;
margin-right: 6px; 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 { .mx_MessageComposer_input .DraftEditor-root {
width: 100%;
flex: 1; 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 { .mx_MessageComposer_input textarea {
@ -88,7 +99,8 @@ limitations under the License.
color: #454545; color: #454545;
background-color: #fff; background-color: #fff;
font-size: 14px; font-size: 14px;
max-height: 120px;
overflow: auto;
/* needed for FF */ /* needed for FF */
font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
} }
@ -122,3 +134,59 @@ limitations under the License.
pointer-events: none; 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;
}

10
src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css
View file

@ -22,6 +22,14 @@ limitations under the License.
height: 34px; height: 34px;
} }
.mx_RoomTile_tooltip {
display: inline-block;
position: relative;
top: -62px;
left: 46px;
}
.mx_RoomTile_nameContainer { .mx_RoomTile_nameContainer {
display: inline-block; display: inline-block;
width: 180px; width: 180px;
@ -113,7 +121,7 @@ limitations under the License.
min-width: 12px; min-width: 12px;
border-radius: 16px; border-radius: 16px;
padding: 0px 4px 0px 4px; padding: 0px 4px 0px 4px;
z-index: 200; z-index: 3;
} }
/* Hide the bottom of speech bubble */ /* Hide the bottom of speech bubble */

13
src/skins/vector/css/vector-web/structures/LeftPanel.css
View file

@ -80,21 +80,21 @@ limitations under the License.
} }
.mx_LeftPanel .mx_BottomLeftMenu_createRoom, .mx_LeftPanel .mx_BottomLeftMenu_createRoom,
.mx_LeftPanel .mx_BottomLeftMenu_directory, .mx_LeftPanel .mx_BottomLeftMenu_people,
.mx_LeftPanel .mx_BottomLeftMenu_settings { .mx_LeftPanel .mx_BottomLeftMenu_settings {
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
} }
.collapsed .mx_BottomLeftMenu_createRoom, .collapsed .mx_BottomLeftMenu_createRoom,
.collapsed .mx_BottomLeftMenu_directory, .collapsed .mx_BottomLeftMenu_people,
.collapsed .mx_BottomLeftMenu_settings { .collapsed .mx_BottomLeftMenu_settings {
margin-left: 0px ! important; margin-left: 0px ! important;
padding-top: 3px ! important; padding-top: 3px ! important;
padding-bottom: 3px ! important; padding-bottom: 3px ! important;
} }
.mx_LeftPanel .mx_BottomLeftMenu_directory { .mx_LeftPanel .mx_BottomLeftMenu_people {
margin-left: 10px; margin-left: 10px;
} }
@ -105,3 +105,10 @@ limitations under the License.
.mx_LeftPanel.collapsed .mx_BottomLeftMenu_settings { .mx_LeftPanel.collapsed .mx_BottomLeftMenu_settings {
float: none; float: none;
} }
.mx_LeftPanel .mx_BottomLeftMenu_tooltip {
display: inline-block;
position: relative;
top: -25px;
left: 6px;
}

4
src/skins/vector/css/vector-web/structures/RoomSubList.css
View file

@ -39,7 +39,7 @@ limitations under the License.
padding-top: 6px; padding-top: 6px;
padding-bottom: 6px; padding-bottom: 6px;
cursor: pointer; 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; border-top: solid 2px #eaf5f0;
} }
@ -90,9 +90,11 @@ limitations under the License.
background-color: #76cfa6; background-color: #76cfa6;
} }
/*
.collapsed .mx_RoomSubList_badge { .collapsed .mx_RoomSubList_badge {
display: none; display: none;
} }
*/
.mx_RoomSubList_badgeHighlight { .mx_RoomSubList_badgeHighlight {
background-color: #ff0064; background-color: #ff0064;

32
src/skins/vector/css/vector-web/views/rooms/RoomTooltip.css
View file

@ -16,17 +16,37 @@ limitations under the License.
.mx_RoomTooltip_chevron { .mx_RoomTooltip_chevron {
position: absolute; position: absolute;
left: -9px; left: -8px;
top: 7px; 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 { .mx_RoomTooltip {
display: none; display: none;
position: fixed; position: fixed;
border: 1px solid #a4a4a4; border: 1px solid rgba(187, 187, 187, 0.5);
border-radius: 8px; border-radius: 5px;
background-color: #fff; background-color: #fff;
z-index: 2000; z-index: 2000;
left: 52px; padding: 5px;
padding: 6px; pointer-events: none;
line-height: 14px;
font-size: 13px;
} }

BIN
src/skins/vector/img/button-md-false.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 569 B

29
src/skins/vector/img/button-md-false.svg Normal file
View file

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="23px" height="15px" viewBox="0 0 23 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>D335F9E8-C813-47D7-B1BE-C8DEF2C8214F</title>
<desc>Created with sketchtool.</desc>
<defs>
<text id="text-1" font-family="markdown" font-size="14" font-weight="normal" fill="#DDDDDD">
<tspan x="829.125" y="759"></tspan>
</text>
<filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="filter-2">
<feOffset dx="1" dy="1" in="SourceAlpha" result="shadowOffsetInner1"></feOffset>
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0526494565 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
</filter>
<filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="filter-3">
<feOffset dx="1" dy="1" in="SourceAlpha" result="shadowOffsetInner1"></feOffset>
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0526494565 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
</filter>
</defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" fill-opacity="1">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-829.000000, -745.000000)" fill="#DDDDDD">
<g id="button_md_off">
<use filter="url(#filter-2)" xlink:href="#text-1"></use>
<use filter="url(#filter-3)" xlink:href="#text-1"></use>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

BIN
src/skins/vector/img/button-md-false@2x.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
src/skins/vector/img/button-md-false@3x.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
src/skins/vector/img/button-md-true.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 483 B

14
src/skins/vector/img/button-md-true.svg Normal file
View file

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="23px" height="15px" viewBox="0 0 23 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>2A63B135-4281-4FBB-A88C-012AE22E9594</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" font-size="14" font-family="markdown" font-weight="normal">
<g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-829.000000, -745.000000)" fill="#4A4A4A">
<text id="button_markdown_on">
<tspan x="829.125" y="759"></tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 820 B

BIN
src/skins/vector/img/button-md-true@2x.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 906 B

BIN
src/skins/vector/img/button-md-true@3x.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.2 KiB

17
src/skins/vector/img/button-text-bold-o-n.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>01F3F9B2-8F38-4BAF-A345-AECAC3D88E79</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-294.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_bold_ON">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M10.9882812,3.92523872 L13.4321289,3.92523872 C14.5457412,3.92523872 15.3540828,4.0836844 15.8571777,4.40058051 C16.3602727,4.71747663 16.6118164,5.22145922 16.6118164,5.9125434 C16.6118164,6.38162127 16.5017101,6.76654581 16.2814941,7.06732856 C16.0612782,7.36811131 15.7685565,7.54893633 15.4033203,7.60980903 L15.4033203,7.66351997 C15.9010442,7.77452312 16.2600087,7.98220334 16.4802246,8.28656684 C16.7004406,8.59093034 16.8105469,8.99554869 16.8105469,9.50043403 C16.8105469,10.2165834 16.5518418,10.7751716 16.0344238,11.1762153 C15.5170059,11.5772589 14.8142948,11.7777778 13.9262695,11.7777778 L10.9882812,11.7777778 L10.9882812,3.92523872 Z M12.6533203,7.035102 L13.6201172,7.035102 C14.0712913,7.035102 14.3980296,6.96527848 14.6003418,6.82562934 C14.802654,6.6859802 14.9038086,6.45502548 14.9038086,6.13275825 C14.9038086,5.83197549 14.7937023,5.61623872 14.5734863,5.48554145 C14.3532704,5.35484418 14.005048,5.28949653 13.5288086,5.28949653 L12.6533203,5.28949653 L12.6533203,7.035102 Z M12.6533203,8.35639106 L12.6533203,10.4027778 L13.7382812,10.4027778 C14.1966169,10.4027778 14.5349924,10.3150508 14.753418,10.1395942 C14.9718435,9.96413758 15.0810547,9.69558558 15.0810547,9.33393012 C15.0810547,8.68223415 14.6155646,8.35639106 13.6845703,8.35639106 L12.6533203,8.35639106 Z" id="B" fill="#FFFFFF"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

17
src/skins/vector/img/button-text-bold.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>9BC64A5B-F157-43FF-BCC4-02D30CDF520B</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off" transform="translate(-294.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_bold">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M10.9882812,3.92523872 L13.4321289,3.92523872 C14.5457412,3.92523872 15.3540828,4.0836844 15.8571777,4.40058051 C16.3602727,4.71747663 16.6118164,5.22145922 16.6118164,5.9125434 C16.6118164,6.38162127 16.5017101,6.76654581 16.2814941,7.06732856 C16.0612782,7.36811131 15.7685565,7.54893633 15.4033203,7.60980903 L15.4033203,7.66351997 C15.9010442,7.77452312 16.2600087,7.98220334 16.4802246,8.28656684 C16.7004406,8.59093034 16.8105469,8.99554869 16.8105469,9.50043403 C16.8105469,10.2165834 16.5518418,10.7751716 16.0344238,11.1762153 C15.5170059,11.5772589 14.8142948,11.7777778 13.9262695,11.7777778 L10.9882812,11.7777778 L10.9882812,3.92523872 Z M12.6533203,7.035102 L13.6201172,7.035102 C14.0712913,7.035102 14.3980296,6.96527848 14.6003418,6.82562934 C14.802654,6.6859802 14.9038086,6.45502548 14.9038086,6.13275825 C14.9038086,5.83197549 14.7937023,5.61623872 14.5734863,5.48554145 C14.3532704,5.35484418 14.005048,5.28949653 13.5288086,5.28949653 L12.6533203,5.28949653 L12.6533203,7.035102 Z M12.6533203,8.35639106 L12.6533203,10.4027778 L13.7382812,10.4027778 C14.1966169,10.4027778 14.5349924,10.3150508 14.753418,10.1395942 C14.9718435,9.96413758 15.0810547,9.69558558 15.0810547,9.33393012 C15.0810547,8.68223415 14.6155646,8.35639106 13.6845703,8.35639106 L12.6533203,8.35639106 Z" id="B" fill="#4A4A4A"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

20
src/skins/vector/img/button-text-bullet-o-n.svg Normal file
View file

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>654917CF-20A4-49B6-B0A1-9875D7B733C8</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-422.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_bullet_ON" transform="translate(128.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M5.57421875,5.39496528 C5.57421875,4.79339977 5.71874855,4.33344343 6.0078125,4.01508247 C6.29687645,3.6967215 6.71288791,3.5375434 7.25585938,3.5375434 C7.7910183,3.5375434 8.20507666,3.69769805 8.49804688,4.01801215 C8.79101709,4.33832625 8.9375,4.79730604 8.9375,5.39496528 C8.9375,5.98871825 8.79004054,6.44769803 8.49511719,6.7719184 C8.20019384,7.09613877 7.78711203,7.25824653 7.25585938,7.25824653 C6.71679418,7.25824653 6.30175927,7.09613877 6.01074219,6.7719184 C5.71972511,6.44769803 5.57421875,5.98871825 5.57421875,5.39496528 L5.57421875,5.39496528 Z" id="•" fill="#FFFFFF"></path>
<path d="M11.5,5.5 L19.5,5.5" id="Line" stroke="#FFFFFF" stroke-linecap="round"></path>
<path d="M11.5,8.5 L19.5,8.5" id="Line-Copy" stroke="#FFFFFF" stroke-linecap="round"></path>
<path d="M11.5,11.5 L19.5,11.5" id="Line-Copy-3" stroke="#FFFFFF" stroke-linecap="round"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

20
src/skins/vector/img/button-text-bullet.svg Normal file
View file

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>B7D94619-44BC-4184-A60A-DBC5BB54E5F9</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off" transform="translate(-422.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_bullet" transform="translate(128.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M5.57421875,5.39496528 C5.57421875,4.79339977 5.71874855,4.33344343 6.0078125,4.01508247 C6.29687645,3.6967215 6.71288791,3.5375434 7.25585938,3.5375434 C7.7910183,3.5375434 8.20507666,3.69769805 8.49804688,4.01801215 C8.79101709,4.33832625 8.9375,4.79730604 8.9375,5.39496528 C8.9375,5.98871825 8.79004054,6.44769803 8.49511719,6.7719184 C8.20019384,7.09613877 7.78711203,7.25824653 7.25585938,7.25824653 C6.71679418,7.25824653 6.30175927,7.09613877 6.01074219,6.7719184 C5.71972511,6.44769803 5.57421875,5.98871825 5.57421875,5.39496528 L5.57421875,5.39496528 Z" id="•" fill="#4A4A4A"></path>
<path d="M11.5,5.5 L19.5,5.5" id="Line" stroke="#4A4A4A" stroke-linecap="round"></path>
<path d="M11.5,8.5 L19.5,8.5" id="Line-Copy" stroke="#4A4A4A" stroke-linecap="round"></path>
<path d="M11.5,11.5 L19.5,11.5" id="Line-Copy-3" stroke="#4A4A4A" stroke-linecap="round"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

25
src/skins/vector/img/button-text-code-o-n.svg Normal file
View file

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>B76754AB-42E6-48D2-9443-80CBC0DE02ED</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-422.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_code_ON" transform="translate(128.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<polygon id="/" fill="#FFFFFF" points="15.9262695 4.14746094 12.9990234 12 12.1074219 12 15.034668 4.14746094"></polygon>
<g id="Group-5" opacity="0.5" transform="translate(17.000000, 5.000000)" stroke="#FFFFFF" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
<g id="Group-5-Copy" opacity="0.5" transform="translate(9.500000, 8.000000) scale(-1, 1) translate(-9.500000, -8.000000) translate(8.000000, 5.000000)" stroke="#FFFFFF" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

25
src/skins/vector/img/button-text-code.svg Normal file
View file

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>4CAFF494-61AE-4916-AFE8-D1E62F7CF0DE</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-422.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_code" transform="translate(128.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<polygon id="/" fill-opacity="0.7" fill="#000000" points="15.9262695 4.14746094 12.9990234 12 12.1074219 12 15.034668 4.14746094"></polygon>
<g id="Group-5" opacity="0.5" transform="translate(17.000000, 5.000000)" stroke="#4A4A4A" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
<g id="Group-5-Copy" opacity="0.5" transform="translate(9.500000, 8.000000) scale(-1, 1) translate(-9.500000, -8.000000) translate(8.000000, 5.000000)" stroke="#4A4A4A" stroke-linecap="round">
<path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
<path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

18
src/skins/vector/img/button-text-formatting.svg Normal file
View file

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="24px" height="18px" viewBox="0 0 24 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>F69CBF5F-0BEC-47E8-B1DF-125D6376C0C9</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-" transform="translate(-829.000000, -729.000000)">
<g id="button_text_formatting" transform="translate(829.000000, 729.000000)">
<rect id="Rectangle-111" fill="#F6F6F6" x="0" y="0" width="24" height="18" rx="9"></rect>
<text id="Aa" font-family="OpenSans-Bold, Open Sans" font-size="12" font-weight="bold" letter-spacing="-1.20000005" fill="#4A4A4A">
<tspan x="5" y="13">A</tspan>
<tspan x="12.0792968" y="13" font-family="OpenSans-Italic, Open Sans" font-style="italic" font-weight="normal">a</tspan>
</text>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.2 KiB

17
src/skins/vector/img/button-text-italic-o-n.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>116426C2-0B55-480E-92B3-57D4B3ABAB90</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-326.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_italic_ON" transform="translate(32.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<polygon id="I" fill="#FFFFFF" points="12.4619141 11.7777778 14.1323242 3.92523872 15.034668 3.92523872 13.3642578 11.7777778"></polygon>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

17
src/skins/vector/img/button-text-italic.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>9FBC844D-96CF-4DCB-B545-FCD23727218B</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off" transform="translate(-326.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_italic" transform="translate(32.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<polygon id="I" fill="#4A4A4A" points="12.4619141 11.7777778 14.1323242 3.92523872 15.034668 3.92523872 13.3642578 11.7777778"></polygon>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

20
src/skins/vector/img/button-text-numbullet-o-n.svg Normal file
View file

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>294F929B-31AA-4D0C-98B3-9CA96764060D</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-454.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_numbullet_ON" transform="translate(160.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M8.3046875,8.77777778 L7.09765625,8.77777778 L7.09765625,5.47309028 L7.109375,4.93012153 L7.12890625,4.33637153 C6.92838441,4.53689336 6.78906289,4.66840247 6.7109375,4.73090278 L6.0546875,5.25824653 L5.47265625,4.53168403 L7.3125,3.06684028 L8.3046875,3.06684028 L8.3046875,8.77777778 Z" id="1" fill="#FFFFFF"></path>
<path d="M11.5,5.5 L19.5,5.5" id="Line" stroke="#FFFFFF" stroke-linecap="round"></path>
<path d="M11.5,8.5 L19.5,8.5" id="Line-Copy" stroke="#FFFFFF" stroke-linecap="round"></path>
<path d="M11.5,11.5 L19.5,11.5" id="Line-Copy-3" stroke="#FFFFFF" stroke-linecap="round"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

20
src/skins/vector/img/button-text-numbullet.svg Normal file
View file

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>F0F58459-A13A-48C5-9332-ABFB96726F05</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off" transform="translate(-454.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_numbullet" transform="translate(160.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M8.3046875,8.77777778 L7.09765625,8.77777778 L7.09765625,5.47309028 L7.109375,4.93012153 L7.12890625,4.33637153 C6.92838441,4.53689336 6.78906289,4.66840247 6.7109375,4.73090278 L6.0546875,5.25824653 L5.47265625,4.53168403 L7.3125,3.06684028 L8.3046875,3.06684028 L8.3046875,8.77777778 Z" id="1" fill="#4A4A4A"></path>
<path d="M11.5,5.5 L19.5,5.5" id="Line" stroke="#4A4A4A" stroke-linecap="round"></path>
<path d="M11.5,8.5 L19.5,8.5" id="Line-Copy" stroke="#4A4A4A" stroke-linecap="round"></path>
<path d="M11.5,11.5 L19.5,11.5" id="Line-Copy-3" stroke="#4A4A4A" stroke-linecap="round"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

17
src/skins/vector/img/button-text-quote-o-n.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>3B24B8C7-64BE-4B3E-A748-94DB72E1210F</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-390.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_quote_ON" transform="translate(96.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M13.6762695,4.58734809 C13.2019833,4.85981039 12.8185236,5.09442718 12.5258789,5.29120551 C12.2332342,5.48798384 11.9355484,5.74782825 11.6328125,6.07074653 C11.350259,6.37348242 11.1333015,6.69135033 10.9819336,7.02435981 C10.8305656,7.35736929 10.7246097,7.7862387 10.6640625,8.3109809 L11.390625,8.3109809 C12.0162792,8.3109809 12.5082176,8.46486934 12.8664551,8.77265082 C13.2246925,9.08043231 13.4038086,9.53200657 13.4038086,10.1273872 C13.4038086,10.5512174 13.2448746,10.9472909 12.927002,11.3156196 C12.6091293,11.6839482 12.1726916,11.8681098 11.6176758,11.8681098 C10.7498329,11.8681098 10.1292336,11.5830378 9.75585938,11.0128852 C9.38248511,10.4427326 9.19580078,9.69347252 9.19580078,8.76508247 C9.19580078,8.10915471 9.33707541,7.51126029 9.61962891,6.97138129 C9.9021824,6.43150229 10.2452779,5.9496549 10.6489258,5.52582465 C11.0626648,5.09190321 11.5016253,4.72358007 11.9658203,4.42084418 C12.4300153,4.1181083 12.8185206,3.87087769 13.1313477,3.67914497 L13.6762695,4.58734809 Z M19.2768555,4.58734809 C18.8025692,4.85981039 18.4191095,5.09442718 18.1264648,5.29120551 C17.8338202,5.48798384 17.5361343,5.74782825 17.2333984,6.07074653 C16.9407537,6.38357361 16.7212735,6.70396429 16.5749512,7.03192817 C16.4286288,7.35989205 16.3251956,7.7862387 16.2646484,8.3109809 L16.9912109,8.3109809 C17.6168651,8.3109809 18.1088035,8.46486934 18.467041,8.77265082 C18.8252785,9.08043231 19.0043945,9.53200657 19.0043945,10.1273872 C19.0043945,10.5512174 18.8454606,10.9472909 18.5275879,11.3156196 C18.2097152,11.6839482 17.7732775,11.8681098 17.2182617,11.8681098 C16.3504188,11.8681098 15.7298196,11.5830378 15.3564453,11.0128852 C14.983071,10.4427326 14.7963867,9.69347252 14.7963867,8.76508247 C14.7963867,8.10915471 14.9376613,7.51126029 15.2202148,6.97138129 C15.5027683,6.43150229 15.8458639,5.9496549 16.2495117,5.52582465 C16.6632508,5.09190321 17.1022112,4.72358007 17.5664062,4.42084418 C18.0306013,4.1181083 18.4191065,3.87087769 18.7319336,3.67914497 L19.2768555,4.58734809 Z" id="“" fill="#FFFFFF"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

17
src/skins/vector/img/button-text-quote.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>BFC0418B-9081-4789-A231-B75953157748</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off" transform="translate(-390.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_quote" transform="translate(96.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M13.6762695,4.58734809 C13.2019833,4.85981039 12.8185236,5.09442718 12.5258789,5.29120551 C12.2332342,5.48798384 11.9355484,5.74782825 11.6328125,6.07074653 C11.350259,6.37348242 11.1333015,6.69135033 10.9819336,7.02435981 C10.8305656,7.35736929 10.7246097,7.7862387 10.6640625,8.3109809 L11.390625,8.3109809 C12.0162792,8.3109809 12.5082176,8.46486934 12.8664551,8.77265082 C13.2246925,9.08043231 13.4038086,9.53200657 13.4038086,10.1273872 C13.4038086,10.5512174 13.2448746,10.9472909 12.927002,11.3156196 C12.6091293,11.6839482 12.1726916,11.8681098 11.6176758,11.8681098 C10.7498329,11.8681098 10.1292336,11.5830378 9.75585938,11.0128852 C9.38248511,10.4427326 9.19580078,9.69347252 9.19580078,8.76508247 C9.19580078,8.10915471 9.33707541,7.51126029 9.61962891,6.97138129 C9.9021824,6.43150229 10.2452779,5.9496549 10.6489258,5.52582465 C11.0626648,5.09190321 11.5016253,4.72358007 11.9658203,4.42084418 C12.4300153,4.1181083 12.8185206,3.87087769 13.1313477,3.67914497 L13.6762695,4.58734809 Z M19.2768555,4.58734809 C18.8025692,4.85981039 18.4191095,5.09442718 18.1264648,5.29120551 C17.8338202,5.48798384 17.5361343,5.74782825 17.2333984,6.07074653 C16.9407537,6.38357361 16.7212735,6.70396429 16.5749512,7.03192817 C16.4286288,7.35989205 16.3251956,7.7862387 16.2646484,8.3109809 L16.9912109,8.3109809 C17.6168651,8.3109809 18.1088035,8.46486934 18.467041,8.77265082 C18.8252785,9.08043231 19.0043945,9.53200657 19.0043945,10.1273872 C19.0043945,10.5512174 18.8454606,10.9472909 18.5275879,11.3156196 C18.2097152,11.6839482 17.7732775,11.8681098 17.2182617,11.8681098 C16.3504188,11.8681098 15.7298196,11.5830378 15.3564453,11.0128852 C14.983071,10.4427326 14.7963867,9.69347252 14.7963867,8.76508247 C14.7963867,8.10915471 14.9376613,7.51126029 15.2202148,6.97138129 C15.5027683,6.43150229 15.8458639,5.9496549 16.2495117,5.52582465 C16.6632508,5.09190321 17.1022112,4.72358007 17.5664062,4.42084418 C18.0306013,4.1181083 18.4191065,3.87087769 18.7319336,3.67914497 L19.2768555,4.58734809 Z" id="“" fill="#4A4A4A"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

18
src/skins/vector/img/button-text-strike-o-n.svg Normal file
View file

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>69B11088-0F3A-4E14-BD9F-4FEF4115E99B</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-358.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_strike_ON" transform="translate(64.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M16.5107422,9.68842231 C16.5107422,10.3795065 16.2600937,10.9184008 15.7587891,11.3051215 C15.2574845,11.6918422 14.5771527,11.8851997 13.7177734,11.8851997 C12.7867792,11.8851997 12.0706405,11.7652464 11.5693359,11.5253364 L11.5693359,10.644477 C11.8916032,10.7805454 12.2425111,10.8879662 12.6220703,10.9667426 C13.0016295,11.0455191 13.3776023,11.0849067 13.75,11.0849067 C14.358727,11.0849067 14.8170558,10.9694293 15.125,10.7384711 C15.4329442,10.507513 15.5869141,10.1861457 15.5869141,9.77435981 C15.5869141,9.50222303 15.5323085,9.27932487 15.4230957,9.10565864 C15.3138829,8.9319924 15.1312676,8.77175638 14.8752441,8.62494575 C14.6192207,8.47813512 14.2298203,8.31163288 13.7070312,8.12543403 C12.9765588,7.86403949 12.4546728,7.55430952 12.1413574,7.19623481 C11.8280421,6.8381601 11.6713867,6.37087962 11.6713867,5.79437934 C11.6713867,5.18923309 11.8987607,4.70762983 12.3535156,4.34955512 C12.8082705,3.99148041 13.409827,3.81244575 14.1582031,3.81244575 C14.938806,3.81244575 15.656735,3.95567348 16.3120117,4.24213325 L16.0273438,5.03705512 C15.3792285,4.76491834 14.7490265,4.628852 14.1367188,4.628852 C13.6533179,4.628852 13.2755547,4.7326921 13.003418,4.94037543 C12.7312812,5.14805876 12.5952148,5.43630458 12.5952148,5.80512153 C12.5952148,6.07725831 12.6453446,6.30015647 12.7456055,6.4738227 C12.8458664,6.64748893 13.0150541,6.80682979 13.2531738,6.95185004 C13.4912935,7.0968703 13.8556291,7.25710633 14.3461914,7.43256293 C15.1697632,7.72618419 15.736408,8.04128521 16.0461426,8.37787543 C16.3558772,8.71446566 16.5107422,9.15131025 16.5107422,9.68842231 L16.5107422,9.68842231 Z" id="S-" fill="#FFFFFF"></path>
<path d="M9.5,8.5 L18.7195444,7.5" id="Line" stroke="#FFFFFF" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 8.000000) scale(1, -1) translate(-14.109772, -8.000000) "></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB

18
src/skins/vector/img/button-text-strike.svg Normal file
View file

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>A34F2223-34C6-46AE-AA47-38EC8984E9B3</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off" transform="translate(-358.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_strike" transform="translate(64.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M16.5107422,9.68842231 C16.5107422,10.3795065 16.2600937,10.9184008 15.7587891,11.3051215 C15.2574845,11.6918422 14.5771527,11.8851997 13.7177734,11.8851997 C12.7867792,11.8851997 12.0706405,11.7652464 11.5693359,11.5253364 L11.5693359,10.644477 C11.8916032,10.7805454 12.2425111,10.8879662 12.6220703,10.9667426 C13.0016295,11.0455191 13.3776023,11.0849067 13.75,11.0849067 C14.358727,11.0849067 14.8170558,10.9694293 15.125,10.7384711 C15.4329442,10.507513 15.5869141,10.1861457 15.5869141,9.77435981 C15.5869141,9.50222303 15.5323085,9.27932487 15.4230957,9.10565864 C15.3138829,8.9319924 15.1312676,8.77175638 14.8752441,8.62494575 C14.6192207,8.47813512 14.2298203,8.31163288 13.7070312,8.12543403 C12.9765588,7.86403949 12.4546728,7.55430952 12.1413574,7.19623481 C11.8280421,6.8381601 11.6713867,6.37087962 11.6713867,5.79437934 C11.6713867,5.18923309 11.8987607,4.70762983 12.3535156,4.34955512 C12.8082705,3.99148041 13.409827,3.81244575 14.1582031,3.81244575 C14.938806,3.81244575 15.656735,3.95567348 16.3120117,4.24213325 L16.0273438,5.03705512 C15.3792285,4.76491834 14.7490265,4.628852 14.1367188,4.628852 C13.6533179,4.628852 13.2755547,4.7326921 13.003418,4.94037543 C12.7312812,5.14805876 12.5952148,5.43630458 12.5952148,5.80512153 C12.5952148,6.07725831 12.6453446,6.30015647 12.7456055,6.4738227 C12.8458664,6.64748893 13.0150541,6.80682979 13.2531738,6.95185004 C13.4912935,7.0968703 13.8556291,7.25710633 14.3461914,7.43256293 C15.1697632,7.72618419 15.736408,8.04128521 16.0461426,8.37787543 C16.3558772,8.71446566 16.5107422,9.15131025 16.5107422,9.68842231 L16.5107422,9.68842231 Z" id="S-" fill="#4A4A4A"></path>
<path d="M9.5,8.5 L18.7195444,7.5" id="Line" stroke="#4A4A4A" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 8.000000) scale(1, -1) translate(-14.109772, -8.000000) "></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB

18
src/skins/vector/img/button-text-underline-o-n.svg Normal file
View file

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>FD84FF7C-43E4-4312-90AB-5A59AD018377</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-390.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_underline_ON" transform="translate(96.000000, 0.000000)">
<rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M17.0092773,4.14746094 L17.0092773,9.22851562 C17.0092773,10.1237024 16.738935,10.8273086 16.1982422,11.3393555 C15.6575494,11.8514023 14.9145555,12.1074219 13.9692383,12.1074219 C13.0239211,12.1074219 12.2925644,11.849612 11.7751465,11.3339844 C11.2577285,10.8183568 10.9990234,10.1093795 10.9990234,9.20703125 L10.9990234,4.14746094 L11.9121094,4.14746094 L11.9121094,9.27148438 C11.9121094,9.92676109 12.091144,10.4298485 12.4492188,10.7807617 C12.8072935,11.1316749 13.3336554,11.3071289 14.0283203,11.3071289 C14.6907585,11.3071289 15.2010073,11.1307798 15.559082,10.7780762 C15.9171567,10.4253726 16.0961914,9.91959965 16.0961914,9.26074219 L16.0961914,4.14746094 L17.0092773,4.14746094 Z" id="U" fill="#FFFFFF"></path>
<path d="M9.5,13.5 L18.7195444,13.5" id="Line" stroke="#4A4A4A" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 13.500000) scale(1, -1) translate(-14.109772, -13.500000) "></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

18
src/skins/vector/img/button-text-underline.svg Normal file
View file

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>13E7EE68-9B16-4A3D-8F9F-31E4BAB7E438</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-390.000000, -745.000000)">
<g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
<g id="button_text_underline" transform="translate(96.000000, 0.000000)">
<rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
<path d="M17.0092773,4.14746094 L17.0092773,9.22851562 C17.0092773,10.1237024 16.738935,10.8273086 16.1982422,11.3393555 C15.6575494,11.8514023 14.9145555,12.1074219 13.9692383,12.1074219 C13.0239211,12.1074219 12.2925644,11.849612 11.7751465,11.3339844 C11.2577285,10.8183568 10.9990234,10.1093795 10.9990234,9.20703125 L10.9990234,4.14746094 L11.9121094,4.14746094 L11.9121094,9.27148438 C11.9121094,9.92676109 12.091144,10.4298485 12.4492188,10.7807617 C12.8072935,11.1316749 13.3336554,11.3071289 14.0283203,11.3071289 C14.6907585,11.3071289 15.2010073,11.1307798 15.559082,10.7780762 C15.9171567,10.4253726 16.0961914,9.91959965 16.0961914,9.26074219 L16.0961914,4.14746094 L17.0092773,4.14746094 Z" id="U" fill-opacity="0.7" fill="#000000"></path>
<path d="M9.5,13.5 L18.7195444,13.5" id="Line" stroke="#4A4A4A" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 13.500000) scale(1, -1) translate(-14.109772, -13.500000) "></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

15
src/skins/vector/img/icon-address-delete.svg Normal file
View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="11px" height="9px" viewBox="0 0 11 9" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>943783E9-DBD7-4D4E-BAC9-35437C17C2C4</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="1:1-chat" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Chat-People-2b-Invite-modal" transform="translate(-579.000000, -346.000000)" stroke="#FF0064">
<g id="icon_context_delete-copy" transform="translate(580.000000, 346.000000)">
<path d="M0.45,0.45 L8.55,8.55" id="Line"></path>
<path d="M0.45,0.45 L8.55,8.55" id="Line-Copy-2" transform="translate(4.500000, 4.500000) scale(-1, 1) translate(-4.500000, -4.500000) "></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 984 B

15
src/skins/vector/img/icon-text-cancel.svg Normal file
View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="11px" height="9px" viewBox="0 0 11 9" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39 (31667) - http://www.bohemiancoding.com/sketch -->
<title>28D80248-63BA-4A5F-9216-4CFE72784BAC</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-915.000000, -749.000000)" stroke="#000000">
<g id="icon_text_cancel" transform="translate(916.000000, 749.000000)">
<path d="M0.45,0.45 L8.55,8.55" id="Line"></path>
<path d="M0.45,0.45 L8.55,8.55" id="Line-Copy-2" transform="translate(4.500000, 4.500000) scale(-1, 1) translate(-4.500000, -4.500000) "></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 994 B

85
src/skins/vector/img/icon_context_person.svg Normal file
View file

@ -0,0 +1,85 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="11.000464"
height="13"
viewBox="0 0 11.000464 13"
version="1.1"
id="svg4500"
inkscape:version="0.91 r13725"
sodipodi:docname="icon_context_person.svg">
<metadata
id="metadata4520">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>81230A28-D944-4572-B5DB-C03CAA2B1FCA</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1013"
inkscape:window-height="777"
id="namedview4518"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:zoom="24.48"
inkscape:cx="4.9078557"
inkscape:cy="9.7756405"
inkscape:window-x="495"
inkscape:window-y="175"
inkscape:window-maximized="0"
inkscape:current-layer="icons_people_svg" />
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title
id="title4502">81230A28-D944-4572-B5DB-C03CAA2B1FCA</title>
<desc
id="desc4504">Created with sketchtool.</desc>
<defs
id="defs4506" />
<g
style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1"
id="g4511"
transform="translate(-56.999768,-730.5)">
<g
transform="translate(50,725)"
id="icons_people">
<g
style="stroke:#00000f;stroke-opacity:0.94117647"
transform="translate(7,6)"
id="icons_people_svg">
<path
style="stroke:#cecece;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1"
inkscape:connector-curvature="0"
id="Oval-40"
d="m 10.5,12 c 0,-2.7614237 0,-5 -5,-5 -5.0000002,0 -5,2.2385763 -5,5 3.4756747,0 5.5712891,0 10,0 z" />
<circle
r="2.75"
cy="2.75"
cx="5.5"
id="Oval"
style="stroke:#cecece;stroke-opacity:1" />
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.6 KiB

85
src/skins/vector/img/icon_context_person_on.svg Normal file
View file

@ -0,0 +1,85 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="11.000464"
height="13"
viewBox="0 0 11.000464 13"
version="1.1"
id="svg4500"
inkscape:version="0.91 r13725"
sodipodi:docname="icon_context_person_on.svg">
<metadata
id="metadata4520">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>81230A28-D944-4572-B5DB-C03CAA2B1FCA</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1013"
inkscape:window-height="777"
id="namedview4518"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:zoom="24.48"
inkscape:cx="4.9078557"
inkscape:cy="9.7756405"
inkscape:window-x="495"
inkscape:window-y="175"
inkscape:window-maximized="0"
inkscape:current-layer="icons_people_svg" />
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title
id="title4502">81230A28-D944-4572-B5DB-C03CAA2B1FCA</title>
<desc
id="desc4504">Created with sketchtool.</desc>
<defs
id="defs4506" />
<g
style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1"
id="g4511"
transform="translate(-56.999768,-730.5)">
<g
transform="translate(50,725)"
id="icons_people">
<g
style="stroke:#00000f;stroke-opacity:0.94117647"
transform="translate(7,6)"
id="icons_people_svg">
<path
style="stroke:#4a4a4a;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;fill:#4a4a4a;fill-opacity:1"
inkscape:connector-curvature="0"
id="Oval-40"
d="m 10.5,12 c 0,-2.7614237 0,-5 -5,-5 -5.0000002,0 -5,2.2385763 -5,5 3.4756747,0 5.5712891,0 10,0 z" />
<circle
r="2.75"
cy="2.75"
cx="5.5"
id="Oval"
style="stroke:#4a4a4a;stroke-opacity:1;fill:#4a4a4a;fill-opacity:1" />
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

15
src/skins/vector/img/icons-close-button.svg Normal file
View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="35px" height="35px" viewBox="0 0 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>206C270A-EB00-48E4-8CC3-5D403C59177C</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="1:1-chat" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Chat-People-2-Invite-modal-(similar-to-chat-group-5)" transform="translate(-909.000000, -263.000000)">
<g id="icons_close" transform="translate(909.000000, 263.000000)">
<path d="M17.5,35 C27.1649831,35 35,27.1649831 35,17.5 C35,7.83501688 27.1649831,0 17.5,0 C7.83501688,0 0,7.83501688 0,17.5 C0,27.1649831 7.83501688,35 17.5,35 Z" id="Oval-1-Copy-7" fill="#EAF5F0"></path>
<polyline id="icon_close" fill="#76CFA6" opacity="0.9" transform="translate(17.468897, 17.470577) rotate(-315.000000) translate(-17.468897, -17.470577) " points="18.2115394 5.97057742 16.674774 5.97057742 16.674774 16.7275762 5.9688975 16.7275762 5.9688975 18.2642903 16.674774 18.2642903 16.674774 28.9705774 18.2115394 28.9705774 18.2115394 18.2642903 28.9688975 18.2642903 28.9688975 16.7275762 18.2115394 16.7275762 18.2115394 5.97057742"></polyline>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

29
src/skins/vector/img/icons-people.svg
View file

@ -1,9 +1,22 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="25px" height="25px" viewBox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="25" height="25" viewBox="0, 0, 25, 25"> <!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<g id="Symbols"> <title>81230A28-D944-4572-B5DB-C03CAA2B1FCA</title>
<path d="M12.5,25 C19.404,25 25,19.404 25,12.5 C25,5.596 19.404,0 12.5,0 C5.596,0 0,5.596 0,12.5 C0,19.404 5.596,25 12.5,25 z" fill="#76CFA6" id="Oval-1-Copy-7"/> <desc>Created with sketchtool.</desc>
<path d="M12.5,11.439 C13.881,11.439 15,10.32 15,8.939 C15,7.558 13.881,6.439 12.5,6.439 C11.119,6.439 10,7.558 10,8.939 C10,10.32 11.119,11.439 12.5,11.439 z" fill-opacity="0" stroke="#FFFFFF" stroke-width="1" id="path-1" opacity="0.8"/> <defs></defs>
<path d="M17.89,19 C17.89,15.134 17.89,12 12.445,12 C6.999,12 6.999,15.134 6.999,19 C10.785,19 13.067,19 17.89,19 z" fill-opacity="0" stroke="#FFFFFF" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-3" opacity="0.8"/> <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
</g> <g id="Left-nav-default" transform="translate(-50.000000, -725.000000)">
<g id="Left-panel">
<g>
<g id="icons_people" transform="translate(50.000000, 725.000000)">
<path d="M12.5,25 C19.4035594,25 25,19.4035594 25,12.5 C25,5.59644063 19.4035594,0 12.5,0 C5.59644063,0 0,5.59644063 0,12.5 C0,19.4035594 5.59644063,25 12.5,25 Z" id="Oval-1-Copy-7" fill="#76CFA6"></path>
<g id="icons_people_svg" transform="translate(7.000000, 6.000000)" stroke="#FFFFFF">
<path d="M10.5,12 C10.5,9.23857625 10.5000002,7 5.5,7 C0.499999803,7 0.5,9.23857625 0.5,12 C3.97567472,12 6.07128906,12 10.5,12 Z" id="Oval-40" stroke-linecap="round" stroke-linejoin="round"></path>
<circle id="Oval" cx="5.5" cy="2.75" r="2.75"></circle>
</g>
</g>
</g>
</g>
</g>
</g>
</svg> </svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 984 B

After

Width:  |  Height:  |  Size: 1.4 KiB

53
src/skins/vector/img/search-icon-vector.svg Normal file
View file

@ -0,0 +1,53 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="25px" height="25px" viewBox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
<title>2EFF6BB8-D2CC-44E6-85E9-D057E4AE9DF2</title>
<desc>Created with sketchtool.</desc>
<defs>
<ellipse id="path-1" cx="7.68292683" cy="15.4246795" rx="1.35501355" ry="1.40224359"></ellipse>
<mask id="mask-2" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="-0.780487805" y="-0.780487805" width="4.36546279" height="4.27100271">
<rect x="5.50019543" y="13.2891781" width="4.36546279" height="4.27100271" fill="white"></rect>
<use xlink:href="#path-1" fill="black"></use>
</mask>
<ellipse id="path-3" cx="1.72109346" cy="4.95482816" rx="1.35501355" ry="1.40224359"></ellipse>
<mask id="mask-4" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="-0.780487805" y="-0.780487805" width="4.29534171" height="4.3426507">
<rect x="-0.426577393" y="2.78350281" width="4.29534171" height="4.3426507" fill="white"></rect>
<use xlink:href="#path-3" fill="black"></use>
</mask>
<ellipse id="path-5" cx="13.4645442" cy="4.95482816" rx="1.35501355" ry="1.40224359"></ellipse>
<mask id="mask-6" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="-0.780487805" y="-0.780487805" width="4.29534171" height="4.3426507">
<rect x="11.3168734" y="2.78350281" width="4.29534171" height="4.3426507" fill="white"></rect>
<use xlink:href="#path-5" fill="black"></use>
</mask>
</defs>
<g id="1:1-chat" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Chat-People-2a-Invite-modal-HOVER" transform="translate(-314.000000, -391.000000)">
<g id="search_icon_vector" transform="translate(314.000000, 391.000000)">
<circle id="Oval-2-Copy" fill="#FFFFFF" cx="12.5" cy="12.5" r="12.5"></circle>
<g id="Mark" transform="translate(5.000000, 4.000000)">
<ellipse id="large-circ-copy-42" stroke="#E2E2E2" stroke-width="0.780487805" fill="#FFFFFF" cx="7.68292683" cy="8.50694444" rx="6.77506775" ry="7.01121795"></ellipse>
<ellipse id="Oval-1-Copy-200" stroke="#E2E2E2" stroke-width="0.780487805" fill="#FFFFFF" cx="7.68292683" cy="1.40224359" rx="1.35501355" ry="1.40224359"></ellipse>
<ellipse id="Oval-1-Copy-201" stroke="#E2E2E2" stroke-width="0.780487805" fill="#FFFFFF" cx="1.72109346" cy="11.8725632" rx="1.35501355" ry="1.40224359"></ellipse>
<ellipse id="Oval-1-Copy-202" stroke="#E2E2E2" stroke-width="0.780487805" fill="#FFFFFF" cx="13.4645442" cy="11.8725632" rx="1.35501355" ry="1.40224359"></ellipse>
<path d="M7.77326107,14.0224359 C7.77326107,14.0224359 3.07588076,10.0441118 3.07588076,5.04807692" id="Path-72-Copy-2" stroke="#73D0A5" stroke-width="0.780487805"></path>
<path d="M12.2899729,14.0224359 C12.2899729,14.0224359 7.59259259,10.0441118 7.59259259,5.04807692" id="Path-72-Copy-3" stroke="#73D0A5" stroke-width="0.780487805" transform="translate(9.941283, 9.535256) scale(-1, 1) translate(-9.941283, -9.535256) "></path>
<g id="Oval-1-Copy-203">
<use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-1"></use>
<use stroke="#FFFFFF" mask="url(#mask-2)" stroke-width="1.56097561" xlink:href="#path-1"></use>
<use stroke="#73D0A5" stroke-width="0.780487805" xlink:href="#path-1"></use>
</g>
<g id="Oval-1-Copy-204">
<use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-3"></use>
<use stroke="#FFFFFF" mask="url(#mask-4)" stroke-width="1.56097561" xlink:href="#path-3"></use>
<use stroke="#73D0A5" stroke-width="0.780487805" xlink:href="#path-3"></use>
</g>
<g id="Oval-1-Copy-205">
<use fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-5"></use>
<use stroke="#FFFFFF" mask="url(#mask-6)" stroke-width="1.56097561" xlink:href="#path-5"></use>
<use stroke="#76CFA6" stroke-width="0.780487805" xlink:href="#path-5"></use>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 4.5 KiB