mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-26 03:05:51 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge branch 'develop' of github.com:vector-im/vector-web into develop

Browse source
This commit is contained in:
Aviral Dasgupta 2016-09-13 15:42:36 +05:30
commit 81bbc05028
18 changed files with 494 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
src/components/structures/RightPanel.js
View file

@ -26,9 +26,16 @@ var rate_limited_func = require('matrix-react-sdk/lib/ratelimitedfunc');
module.exports = React.createClass({
displayName: 'RightPanel',
propTypes: {
userId: React.PropTypes.string, // if showing an orphaned MemberInfo page, this is set
roomId: React.PropTypes.string, // if showing panels for a given room, this is set
collapsed: React.PropTypes.bool,
},
Phase : {
MemberList: 'MemberList',
FileList: 'FileList',
FilePanel: 'FilePanel',
NotificationPanel: 'NotificationPanel',
MemberInfo: 'MemberInfo',
},
@ -61,7 +68,7 @@ module.exports = React.createClass({
},
onMemberListButtonClick: function() {
if (this.props.collapsed) {
if (this.props.collapsed || this.state.phase !== this.Phase.MemberList) {
this.setState({ phase: this.Phase.MemberList });
dis.dispatch({
action: 'show_right_panel',
@ -74,6 +81,34 @@ module.exports = React.createClass({
}
},
onFileListButtonClick: function() {
if (this.props.collapsed || this.state.phase !== this.Phase.FilePanel) {
this.setState({ phase: this.Phase.FilePanel });
dis.dispatch({
action: 'show_right_panel',
});
}
else {
dis.dispatch({
action: 'hide_right_panel',
});
}
},
onNotificationListButtonClick: function() {
if (this.props.collapsed || this.state.phase !== this.Phase.NotificationPanel) {
this.setState({ phase: this.Phase.NotificationPanel });
dis.dispatch({
action: 'show_right_panel',
});
}
else {
dis.dispatch({
action: 'hide_right_panel',
});
}
},
onRoomStateMember: function(ev, state, member) {
// redraw the badge on the membership list
if (this.state.phase == this.Phase.MemberList && member.roomId === this.props.roomId) {
@ -118,19 +153,25 @@ module.exports = React.createClass({
render: function() {
var MemberList = sdk.getComponent('rooms.MemberList');
var NotificationPanel = sdk.getComponent('structures.NotificationPanel');
var FilePanel = sdk.getComponent('structures.FilePanel');
var TintableSvg = sdk.getComponent("elements.TintableSvg");
var buttonGroup;
var panel;
var filesHighlight;
var membersHighlight;
var notificationsHighlight;
if (!this.props.collapsed) {
if (this.state.phase == this.Phase.MemberList || this.state.phase === this.Phase.MemberInfo) {
membersHighlight = <div className="mx_RightPanel_headerButton_highlight"></div>;
}
else if (this.state.phase == this.Phase.FileList) {
else if (this.state.phase == this.Phase.FilePanel) {
filesHighlight = <div className="mx_RightPanel_headerButton_highlight"></div>;
}
else if (this.state.phase == this.Phase.NotificationPanel) {
notificationsHighlight = <div className="mx_RightPanel_headerButton_highlight"></div>;
}
}
var membersBadge;
@ -138,7 +179,7 @@ module.exports = React.createClass({
var cli = MatrixClientPeg.get();
var room = cli.getRoom(this.props.roomId);
if (room) {
membersBadge = <div className="mx_RightPanel_headerButton_badge">{ room.getJoinedMembers().length }</div>;
membersBadge = room.getJoinedMembers().length;
}
}
@ -146,14 +187,20 @@ module.exports = React.createClass({
buttonGroup =
<div className="mx_RightPanel_headerButtonGroup">
<div className="mx_RightPanel_headerButton" title="Members" onClick={ this.onMemberListButtonClick }>
{ membersBadge }
<div className="mx_RightPanel_headerButton_badge">{ membersBadge ? membersBadge : <span>&nbsp;</span>}</div>
<TintableSvg src="img/icons-people.svg" width="25" height="25"/>
{ membersHighlight }
</div>
<div className="mx_RightPanel_headerButton mx_RightPanel_filebutton" title="Files">
<TintableSvg src="img/files.svg" width="17" height="22"/>
<div className="mx_RightPanel_headerButton mx_RightPanel_filebutton" title="Files" onClick={ this.onFileListButtonClick }>
<div className="mx_RightPanel_headerButton_badge">&nbsp;</div>
<TintableSvg src="img/icons-files.svg" width="25" height="25"/>
{ filesHighlight }
</div>
<div className="mx_RightPanel_headerButton mx_RightPanel_notificationbutton" title="Notifications" onClick={ this.onNotificationListButtonClick }>
<div className="mx_RightPanel_headerButton_badge">&nbsp;</div>
<TintableSvg src="img/icons-notifications.svg" width="25" height="25"/>
{ notificationsHighlight }
</div>
</div>;
}
@ -165,6 +212,12 @@ module.exports = React.createClass({
var MemberInfo = sdk.getComponent('rooms.MemberInfo');
panel = <MemberInfo member={this.state.member} key={this.props.roomId || this.props.userId} />
}
else if (this.state.phase == this.Phase.NotificationPanel) {
panel = <NotificationPanel />
}
else if (this.state.phase == this.Phase.FilePanel) {
panel = <FilePanel roomId={this.props.roomId} />
}
}
if (!panel) {

6
src/skins/vector/css/hide.css
View file

@ -1,6 +0,0 @@
.mx_RoomSettings_encrypt,
.mx_CreateRoom_encrypt,
.mx_RightPanel_filebutton
{
display: none !important;
}

118
src/skins/vector/css/matrix-react-sdk/structures/FilePanel.css Normal file
View file

@ -0,0 +1,118 @@
/*
Copyright 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_FilePanel {
-webkit-box-ordinal-group: 2;
-moz-box-ordinal-group: 2;
-ms-flex-order: 2;
-webkit-order: 2;
order: 2;
-webkit-flex: 1 1 0;
flex: 1 1 0;
width: 100%;
overflow-y: auto;
}
.mx_FilePanel .mx_RoomView_messageListWrapper {
margin-right: 20px;
}
.mx_FilePanel .mx_RoomView_MessageList h2 {
display: none;
}
/* FIXME: rather than having EventTile's default CSS be for MessagePanel,
we should make EventTile a base CSS class and customise it specifically
for usage in {Message,File,Notification}Panel. */
.mx_FilePanel .mx_EventTile_avatar {
display: none;
}
/* Overrides for the attachment body tiles */
.mx_FilePanel .mx_EventTile .mx_MImageBody {
margin-right: 0px;
}
.mx_FilePanel .mx_EventTile .mx_MImageBody_download {
display: flex;
font-size: 14px;
color: #acacac;
}
.mx_FilePanel .mx_EventTile .mx_MImageBody_downloadLink {
flex: 1 1 auto;
color: #747474;
word-wrap: break-word;
}
.mx_FilePanel .mx_EventTile .mx_MImageBody_size {
flex: 1 0 0;
font-size: 11px;
text-align: right;
white-space: nowrap;
}
/* Overides for the sender details line */
.mx_FilePanel .mx_EventTile_senderDetails {
display: flex;
margin-top: -2px;
}
.mx_FilePanel .mx_EventTile_senderDetailsLink {
text-decoration: none;
}
.mx_FilePanel .mx_EventTile .mx_SenderProfile {
flex: 1 1 auto;
line-height: initial;
padding: 0px;
font-size: 11px;
opacity: 1.0;
color: #acacac;
word-wrap: break-word;
}
.mx_FilePanel .mx_EventTile .mx_MessageTimestamp {
flex: 1 0 0;
text-align: right;
visibility: visible;
position: initial;
font-size: 11px;
opacity: 1.0;
color: #acacac;
}
/* Overrides for the wrappers around the body tile */
.mx_FilePanel .mx_EventTile_line {
margin-right: 0px;
padding-left: 0px;
}
.mx_FilePanel .mx_EventTile:hover .mx_EventTile_line {
background-color: #fff;
}
.mx_FilePanel .mx_EventTile_selected .mx_EventTile_line {
padding-left: 0px;
}

104
src/skins/vector/css/matrix-react-sdk/structures/NotificationPanel.css Normal file
View file

@ -0,0 +1,104 @@
/*
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_NotificationPanel {
-webkit-box-ordinal-group: 2;
-moz-box-ordinal-group: 2;
-ms-flex-order: 2;
-webkit-order: 2;
order: 2;
-webkit-flex: 1 1 0;
flex: 1 1 0;
width: 100%;
overflow-y: auto;
}
.mx_NotificationPanel .mx_RoomView_messageListWrapper {
margin-right: 20px;
}
.mx_NotificationPanel .mx_RoomView_MessageList h2 {
margin-left: 0px;
}
/* FIXME: rather than having EventTile's default CSS be for MessagePanel,
we should make EventTile a base CSS class and customise it specifically
for usage in {Message,File,Notification}Panel. */
.mx_NotificationPanel .mx_EventTile_roomName {
font-weight: bold;
font-size: 14px;
word-wrap: break-word;
}
.mx_NotificationPanel .mx_EventTile_roomName a {
color: #4a4a4a;
}
.mx_NotificationPanel .mx_EventTile_avatar {
top: 8px;
left: 0px;
}
.mx_NotificationPanel .mx_EventTile .mx_SenderProfile,
.mx_NotificationPanel .mx_EventTile .mx_MessageTimestamp {
color: #000;
opacity: 0.3;
font-size: 12px;
display: inline;
padding-left: 0px;
word-wrap: break-word;
}
.mx_NotificationPanel .mx_EventTile_senderDetails {
padding-left: 32px;
padding-top: 8px;
position: relative;
}
.mx_NotificationPanel .mx_EventTile_roomName a,
.mx_NotificationPanel .mx_EventTile_senderDetails a {
text-decoration: none ! important;
}
.mx_NotificationPanel .mx_EventTile .mx_MessageTimestamp {
visibility: visible;
position: initial;
display: inline;
}
.mx_NotificationPanel .mx_EventTile_line {
margin-right: 0px;
padding-left: 32px;
padding-top: 0px;
padding-bottom: 0px;
padding-right: 0px;
}
.mx_NotificationPanel .mx_EventTile:hover .mx_EventTile_line {
background-color: #fff;
}
.mx_NotificationPanel .mx_EventTile_selected .mx_EventTile_line {
padding-left: 0px;
}
.mx_NotificationPanel .mx_EventTile_content {
margin-right: 0px;
}

39
src/skins/vector/css/matrix-react-sdk/views/dialogs/EncryptedEventDialog.css Normal file
View file

@ -0,0 +1,39 @@
/*
Copyright 2016 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EncryptedEventDialog .mx_MemberDeviceInfo {
float: right;
padding: 0px;
margin-right: 42px;
}
.mx_EncryptedEventDialog .mx_MemberDeviceInfo_textButton {
border: 0px;
height: 36px;
border-radius: 40px;
border: solid 1px #76cfa6;
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;
}

1
src/skins/vector/css/matrix-react-sdk/views/messages/MImageBody.css
View file

@ -30,7 +30,6 @@ limitations under the License.
.mx_MImageBody_download {
color: #76cfa6;
cursor: pointer;
}
.mx_MImageBody_download a {

58
src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css
View file

@ -36,21 +36,13 @@ limitations under the License.
.mx_EventTile.mx_EventTile_info .mx_EventTile_avatar {
top: 8px;
left: 44px;
left: 65px;
}
.mx_EventTile_continuation {
padding-top: 0px ! important;
}
.mx_EventTile_verified {
background-color: #eaf5f0;
}
.mx_EventTile_unverified {
background-color: #ffa0a0;
}
.mx_EventTile .mx_SenderProfile {
color: #454545;
opacity: 0.5;
@ -87,6 +79,10 @@ limitations under the License.
line-height: 22px;
}
.mx_EventTile_info .mx_EventTile_line {
padding-left: 83px;
}
/* HACK to override line-height which is already marked important elsewhere */
.mx_EventTile_bigEmoji.mx_EventTile_bigEmoji {
font-size: 48px ! important;
@ -122,6 +118,10 @@ limitations under the License.
color: #fff;
}
.mx_EventTile_encrypting {
color: #abddbc ! important;
}
.mx_EventTile_sending {
color: #ddd;
}
@ -227,6 +227,46 @@ limitations under the License.
overflow-y: hidden;
}
/* End to end encryption stuff */
.mx_EventTile_e2eIcon {
display: block;
position: absolute;
top: 9px;
left: 46px;
z-index: 2;
cursor: pointer;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
padding-left: 60px;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line {
border-left: #76cfa5 5px solid;
}
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
border-left: #e8bf37 5px solid;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_MessageTimestamp,
.mx_EventTile:hover.mx_EventTile_unverified .mx_MessageTimestamp {
left: 3px;
}
/*
.mx_EventTile_verified .mx_EventTile_e2eIcon {
display: none;
}
*/
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_e2eIcon,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_e2eIcon {
display: block;
left: 41px;
}
/* Various markdown overrides */
.mx_EventTile_content .markdown-body {

2
src/skins/vector/css/matrix-react-sdk/views/rooms/LinkPreviewWidget.css
View file

@ -50,7 +50,7 @@ limitations under the License.
.mx_LinkPreviewWidget_description {
margin-top: 8px;
white-space: normal;
word-break: break-word;
word-wrap: break-word;
}
.mx_LinkPreviewWidget_cancel {

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

@ -19,6 +19,7 @@ limitations under the License.
vertical-align: middle;
margin: auto;
border-top: 1px solid #e5e5e5;
position: relative;
}
.mx_MessageComposer_autocomplete_wrapper {
@ -46,6 +47,11 @@ limitations under the License.
width: 100%;
}
.mx_MessageComposer_e2eIcon {
position: absolute;
left: 44px;
}
.mx_MessageComposer_noperm_error {
width: 100%;
height: 60px;

2
src/skins/vector/css/matrix-react-sdk/views/rooms/RoomSettings.css
View file

@ -88,12 +88,14 @@ limitations under the License.
height: 37px;
border: 1px solid #979797;
margin-right: 13px;
cursor: pointer;
}
.mx_RoomSettings .mx_RoomSettings_roomColor_selected {
position: absolute;
left: 10px;
top: 4px;
cursor: default ! important;
}
.mx_RoomSettings .mx_RoomSettings_roomColorPrimary {

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

@ -63,7 +63,7 @@ limitations under the License.
z-index: 2;
}
.mx_RoomTile_avatar_container:hover:before,
.mx_RoomTile:hover .mx_RoomTile_avatar_container:before,
.mx_RoomTile_avatar_container.mx_RoomTile_avatar_roomTagMenu:before {
display: block;
position: absolute;
@ -76,7 +76,7 @@ limitations under the License.
z-index: 4;
}
.mx_RoomTile_avatar_container:hover:after,
.mx_RoomTile:hover .mx_RoomTile_avatar_container:after,
.mx_RoomTile_avatar_container.mx_RoomTile_avatar_roomTagMenu:after {
display: block;
position: absolute;
@ -90,11 +90,11 @@ limitations under the License.
z-index: 1;
}
.collapsed .mx_RoomTile_avatar_container:hover:before {
.collapsed .mx_RoomTile:hover .mx_RoomTile_avatar_container:before {
display: none;
}
.collapsed .mx_RoomTile_avatar_container:hover:after {
.collapsed .mx_RoomTile:hover .mx_RoomTile_avatar_container:after {
display: none;
}

8
src/skins/vector/css/vector-web/structures/RightPanel.css
View file

@ -46,15 +46,15 @@ limitations under the License.
margin-top: 6px;
float: left;
background-color: #fff;
margin-left: -4px;
margin-left: 0px;
}
.mx_RightPanel_headerButton {
cursor: pointer;
display: table-cell;
vertical-align: middle;
padding-left: 15px;
padding-right: 15px;
vertical-align: top;
padding-left: 4px;
padding-right: 5px;
text-align: center;
position: relative;
}

12
src/skins/vector/img/e2e-blocked.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" 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>2805649B-D39D-43EA-A357-659EF9B97BA4</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Typing-Indicator" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="typing-indicator" transform="translate(-301.000000, -328.000000)" fill="#BA6363">
<path d="M307,340 C310.313708,340 313,337.313708 313,334 C313,330.686292 310.313708,328 307,328 C303.686292,328 301,330.686292 301,334 C301,337.313708 303.686292,340 307,340 Z M304,333 L310,333 L310,335 L304,335 L304,333 Z" id="blocked_icon"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 883 B

23
src/skins/vector/img/e2e-unencrypted.svg Normal file
View file

@ -0,0 +1,23 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="14px" height="12px" viewBox="0 0 14 12" 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>16F5F38E-A6A3-472A-BC13-13F0F12876CF</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Typing-Indicator" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.200000003">
<g id="typing-indicator" transform="translate(-301.000000, -141.000000)" fill="#000000">
<g id="unencrypted_icon" transform="translate(301.000000, 141.000000)">
<g id="Lock-Copy" transform="translate(0.000000, 4.000000)">
<g id="Layer_1">
<polygon id="Shape" points="1.33333333 0.666666667 0 0.666666667 0 8 5 8 10 8 10 0.666666667 8.66666667 0.666666667"></polygon>
</g>
</g>
<g id="Lock-Copy-2" transform="translate(6.000000, 0.000000)">
<g id="Layer_1">
<path d="M7.66666667,3.66666667 C7.66666667,1.63333333 6.03333333,0 4,0 C1.96666667,0 0.333333333,1.63333333 0.333333333,3.66666667 L0.333333333,4.66666667 L7.66666667,4.66666667 L7.66666667,3.66666667 Z M1.66666667,4.66666667 L1.66666667,3.66666667 C1.66666667,2.36666667 2.7,1.33333333 4,1.33333333 C5.3,1.33333333 6.33333333,2.36666667 6.33333333,3.66666667 L6.33333333,4.66666667 L4,4.66666667 L1.66666667,4.66666667 Z" id="Shape"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

12
src/skins/vector/img/e2e-verified.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="10px" height="12px" viewBox="0 0 10 12" 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>48BF5D32-306C-4B20-88EB-24B1F743CAC9</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Typing-Indicator" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="typing-indicator" transform="translate(-301.000000, -172.000000)" fill="#76CFA6">
<path d="M309.666667,175.666667 C309.666667,173.633333 308.033333,172 306,172 C303.966667,172 302.333333,173.633333 302.333333,175.666667 L302.333333,176.666667 L301,176.666667 L301,184 L306,184 L311,184 L311,176.666667 L309.666667,176.666667 L309.666667,175.666667 Z M306,176.666667 L303.666667,176.666667 L303.666667,175.666667 C303.666667,174.366667 304.7,173.333333 306,173.333333 C307.3,173.333333 308.333333,174.366667 308.333333,175.666667 L308.333333,176.666667 L306,176.666667 L306,176.666667 Z" id="verified_icon"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

12
src/skins/vector/img/e2e-warning.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="15px" height="12px" viewBox="0 0 15 12" 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>CCDDE6F6-B552-48FD-AD54-6939841CA2DD</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Typing-Indicator" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="typing-indicator" transform="translate(-299.000000, -294.000000)" fill="#E9BF37">
<path d="M313.568455,304.982113 L306.898576,294.310305 C306.776309,294.117108 306.563606,294 306.334971,294 C306.106335,294 305.893632,294.117108 305.771366,294.310305 L299.101486,304.982113 C298.971497,305.189962 298.966004,305.452367 299.087182,305.665474 C299.20836,305.87858 299.436676,306.008036 299.681766,306.002604 L313.021525,306.002604 C313.260642,305.995965 313.477893,305.861783 313.590891,305.650946 C313.703889,305.440108 313.695328,305.184904 313.568455,304.982113 L313.568455,304.982113 Z M307.018633,304.00164 L305.684657,304.00164 L305.684657,302.667664 L307.018633,302.667664 L307.018633,304.00164 Z M307.018633,301.333689 L305.684657,301.333689 L305.684657,297.998749 L307.018633,297.998749 L307.018633,301.333689 Z" id="unverified_icon"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

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

@ -0,0 +1,29 @@
<?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>7C98C075-AB4D-45A3-85F9-CCD46F84DA7F</title>
<desc>Created with sketchtool.</desc>
<defs>
<path d="M0,2.00276013 C0,0.896666251 0.889186576,0 1.99983124,0 L4.84793814,0 C4.84793814,0 9.25,4.54127763 9.25,4.54127763 L9.25,10.9954009 C9.25,12.1025104 8.36307111,13 7.24288777,13 L2.00711223,13 C0.898614756,13 0,12.1064574 0,10.9972399 L0,2.00276013 Z" id="path-1"></path>
<mask id="mask-2" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="9.25" height="13" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<path d="M9.28225806,5 L5.82322134,5 C4.97217082,5 4.28225806,4.31002094 4.28225806,3.45903672 L4.28225806,0" id="path-3"></path>
<mask id="mask-4" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="5" height="5" fill="white">
<use xlink:href="#path-3"></use>
</mask>
</defs>
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Right-panel/Header" transform="translate(-66.000000, -23.000000)">
<g id="icons_files" transform="translate(66.000000, 23.000000)">
<g id="Group-5-Copy-2" fill="#76CFA6">
<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"></path>
</g>
<g id="Rectangle-5-+-Rectangle-6-Copy-2" transform="translate(8.000000, 6.000000)" stroke="#FFFFFF" stroke-width="2">
<use id="Rectangle-5" mask="url(#mask-2)" opacity="0.8" xlink:href="#path-1"></use>
<use id="Rectangle-6" mask="url(#mask-4)" xlink:href="#path-3"></use>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

19
src/skins/vector/img/icons-notifications.svg Normal file
View file

@ -0,0 +1,19 @@
<?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>5E723325-BD0B-454D-BE25-638AF09A97AC</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Right-panel/Header" transform="translate(-100.000000, -23.000000)">
<g id="icons_notifications" transform="translate(100.000000, 23.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="Group-8" opacity="0.8" transform="translate(7.000000, 4.000000)">
<path d="M5.41666667,16.7222222 C6.38316498,16.7222222 7.16666667,15.9387205 7.16666667,14.9722222 C7.16666667,14.0057239 6.38316498,13.2222222 5.41666667,13.2222222 C4.45016835,13.2222222 3.66666667,14.0057239 3.66666667,14.9722222 C3.66666667,15.9387205 4.45016835,16.7222222 5.41666667,16.7222222 Z" id="Oval-49" stroke="#FFFFFF"></path>
<path d="M1,12.4488669 C1,12.4468729 10.0044225,12.4444444 10.0044225,12.4444444 C10.0024284,12.4444444 10,7.94444444 10,7.94444444 C10,5.46303559 7.98297457,3.44444444 5.5,3.44444444 C3.01859115,3.44444444 1,5.46146988 1,7.94444444 L1,12.4488669 Z M5.5,2.44444444 C8.53756612,2.44444444 11,4.91305916 11,7.94444444 L11,12.4488669 C11,12.9987092 10.555163,13.4444444 10.0044225,13.4444444 L0.995577499,13.4444444 C0.445735229,13.4444444 0,12.9996075 0,12.4488669 L0,7.94444444 C0,4.90687832 2.46861471,2.44444444 5.5,2.44444444 Z" id="Rectangle-15" fill="#FFFFFF"></path>
<path d="M4.27777778,1.83333333 L6.72222222,1.83333333" id="Line" stroke="#FFFFFF" stroke-linecap="round"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB