mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-10-22 18:55:47 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge remote-tracking branch 'origin/experimental' into travis/develop-for-real

Browse source
This commit is contained in:
Travis Ralston 2019-01-03 16:00:23 -07:00
commit 8017f0a4a1
164 changed files with 4652 additions and 2772 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
res/css/_common.scss
View file

@ -30,8 +30,6 @@ body {
color: $primary-fg-color;
border: 0px;
margin: 0px;
/* This should render the fonts the same accross browsers */
-webkit-font-smoothing: subpixel-antialiased;
}
.error, .warning {
@ -49,20 +47,14 @@ h2 {
a:hover,
a:link,
a:visited {
color: $accent-color;
color: $accent-color-alt;
}
input[type=text], input[type=password], textarea {
background-color: transparent;
color: $primary-fg-color;
}
input[type=text].error, input[type=password].error {
border: 1px solid $warning-color;
}
input[type=text]:focus, input[type=password]:focus, textarea:focus {
border: 1px solid $accent-color;
outline: none;
box-shadow: none;
}
@ -83,11 +75,6 @@ textarea {
transition: opacity 0.2s ease-in-out;
}
.mx_fadable.mx_fadable_faded {
opacity: 0.3;
pointer-events: none;
}
/* XXX: critical hack to GeminiScrollbar to allow them to work in FF 42 and Chrome 48.
Stop the scrollbar view from pushing out the container's overall sizing, which causes
flexbox to adapt to the new size and cause the view to keep growing.
@ -314,7 +301,7 @@ textarea {
}
.mx_textButton {
@mixin mx_DialogButton_small;
@mixin mx_DialogButton_small;
}
.mx_textButton:hover {

6
res/css/_components.scss
View file

@ -1,6 +1,6 @@
// autogenerated by rethemendex.sh
@import "./_common.scss";
@import "./_fonts.scss";
@import "./structures/_AutoHideScrollbar.scss";
@import "./structures/_CompatibilityPage.scss";
@import "./structures/_ContextualMenu.scss";
@import "./structures/_CreateRoom.scss";
@ -19,6 +19,7 @@
@import "./structures/_RoomView.scss";
@import "./structures/_SearchBox.scss";
@import "./structures/_TagPanel.scss";
@import "./structures/_TopLeftMenuButton.scss";
@import "./structures/_UploadBar.scss";
@import "./structures/_UserSettings.scss";
@import "./structures/_ViewSource.scss";
@ -29,6 +30,7 @@
@import "./views/context_menus/_RoomTileContextMenu.scss";
@import "./views/context_menus/_StatusMessageContextMenu.scss";
@import "./views/context_menus/_TagTileContextMenu.scss";
@import "./views/context_menus/_TopLeftMenu.scss";
@import "./views/dialogs/_BugReportDialog.scss";
@import "./views/dialogs/_ChangelogDialog.scss";
@import "./views/dialogs/_ChatCreateOrReuseChatDialog.scss";
@ -62,6 +64,7 @@
@import "./views/elements/_MemberEventListSummary.scss";
@import "./views/elements/_ProgressBar.scss";
@import "./views/elements/_ReplyThread.scss";
@import "./views/elements/_ResizeHandle.scss";
@import "./views/elements/_RichText.scss";
@import "./views/elements/_RoleButton.scss";
@import "./views/elements/_Spinner.scss";
@ -112,6 +115,7 @@
@import "./views/rooms/_SearchableEntityList.scss";
@import "./views/rooms/_Stickers.scss";
@import "./views/rooms/_TopUnreadMessagesBar.scss";
@import "./views/rooms/_WhoIsTypingTile.scss";
@import "./views/settings/_DevicesPanel.scss";
@import "./views/settings/_IntegrationsManager.scss";
@import "./views/settings/_KeyBackupPanel.scss";

66
res/css/structures/_AutoHideScrollbar.scss Normal file
View file

@ -0,0 +1,66 @@
/*
Copyright 2018 New Vector 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.
*/
/*
1. for browsers that support native overlay auto-hiding scrollbars
*/
.mx_AutoHideScrollbar {
overflow-x: hidden;
overflow-y: auto;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
/*
2. webkit also supports overflow:overlay where the scrollbars don't take any space
in the layout but they don't autohide, so do that only on hover
*/
body.mx_scrollbar_overlay_noautohide .mx_AutoHideScrollbar {
overflow-y: hidden;
}
body.mx_scrollbar_overlay_noautohide .mx_AutoHideScrollbar:hover {
overflow-y: overlay;
}
/*
3. as a last fallback, compensate for the scrollbar taking up space in the layout
by having giving the child element (.mx_AutoHideScrollbar_offset) a
negative right margin of the width of the scrollbar when the container
is overflowing. This is what Firefox ends up using. Overflow is detected
in javascript, and adds the mx_AutoHideScrollbar_overflow class to the container.
This only works in Firefox, which should be fine as this fallback is only needed there.
*/
body.mx_scrollbar_nooverlay {
.mx_AutoHideScrollbar {
overflow-y: hidden;
}
.mx_AutoHideScrollbar:hover {
overflow-y: auto;
}
/*
offset scrollbar width with negative margin-right
include before and after psuedo-elements here so they can
be used to do something interesting like scroll-indicating
gradients (see IndicatorScrollBar)
*/
.mx_AutoHideScrollbar:hover.mx_AutoHideScrollbar_overflow > .mx_AutoHideScrollbar_offset,
.mx_AutoHideScrollbar:hover.mx_AutoHideScrollbar_overflow::before,
.mx_AutoHideScrollbar:hover.mx_AutoHideScrollbar_overflow::after
{
margin-right: calc(-1 * var(--scrollbar-width));
}
}

17
res/css/structures/_ContextualMenu.scss
View file

@ -30,12 +30,11 @@ limitations under the License.
}
.mx_ContextualMenu {
border: solid 1px $menu-border-color;
border-radius: 4px;
border-radius: 2px;
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.21);
background-color: $menu-bg-color;
color: $primary-fg-color;
position: absolute;
padding: 6px;
font-size: 14px;
z-index: 5001;
}
@ -44,6 +43,10 @@ limitations under the License.
right: 8px;
}
.mx_ContextualMenu_noChevron {
border-radius: unset !important;
}
.mx_ContextualMenu_chevron_right {
position: absolute;
right: -8px;
@ -51,7 +54,7 @@ limitations under the License.
width: 0;
height: 0;
border-top: 8px solid transparent;
border-left: 8px solid $menu-border-color;
border-left: 8px solid $menu-bg-color;
border-bottom: 8px solid transparent;
}
@ -78,7 +81,7 @@ limitations under the License.
width: 0;
height: 0;
border-top: 8px solid transparent;
border-right: 8px solid $menu-border-color;
border-right: 8px solid $menu-bg-color;
border-bottom: 8px solid transparent;
}
@ -105,7 +108,7 @@ limitations under the License.
width: 0;
height: 0;
border-left: 8px solid transparent;
border-bottom: 8px solid $menu-border-color;
border-bottom: 8px solid $menu-bg-color;
border-right: 8px solid transparent;
}
@ -132,7 +135,7 @@ limitations under the License.
width: 0;
height: 0;
border-left: 8px solid transparent;
border-top: 8px solid $menu-border-color;
border-top: 8px solid $menu-bg-color;
border-right: 8px solid transparent;
}

4
res/css/structures/_FilePanel.scss
View file

@ -16,11 +16,7 @@ limitations under the License.
.mx_FilePanel {
order: 2;
flex: 1 1 0;
width: 100%;
overflow-y: auto;
}

12
res/css/structures/_GroupView.scss
View file

@ -15,10 +15,6 @@ limitations under the License.
*/
.mx_GroupView {
max-width: 960px;
width: 100%;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: column;
overflow: hidden;
@ -29,7 +25,6 @@ limitations under the License.
}
.mx_GroupView_header {
max-width: 960px;
min-height: 70px;
align-items: center;
display: flex;
@ -39,6 +34,8 @@ limitations under the License.
.mx_GroupView_header_view {
border-bottom: 1px solid $primary-hairline-color;
padding-bottom: 0px;
padding-left: 8px;
padding-right: 8px;
}
.mx_GroupView_header_avatar, .mx_GroupView_header_info {
@ -162,6 +159,11 @@ limitations under the License.
line-height: 2em;
}
.mx_GroupView > .mx_MainSplit {
flex: 1;
display: flex;
}
.mx_GroupView_body {
flex-grow: 1;
}

50
res/css/structures/_LeftPanel.scss
View file

@ -15,32 +15,22 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_LeftPanel {
position: relative;
display: flex;
flex-direction: column;
}
.mx_LeftPanel_container {
display: flex;
/* LeftPanel 235px */
flex: 0 0 235px;
/* LeftPanel 260px */
min-width: 260px;
flex: 0 0 auto;
}
.mx_LeftPanel_container.mx_LeftPanel_container_hasTagPanel {
/* TagPanel 60px + LeftPanel 235px */
flex: 0 0 295px;
.mx_LeftPanel_container.collapsed {
min-width: unset;
/* Collapsed LeftPanel 70px */
flex: 0 0 70px;
}
.mx_LeftPanel_container_collapsed {
/* Collapsed LeftPanel 60px */
flex: 0 0 60px;
}
.mx_LeftPanel_container_collapsed.mx_LeftPanel_container_hasTagPanel {
/* TagPanel 60px + Collapsed LeftPanel 60px */
flex: 0 0 120px;
.mx_LeftPanel_container.collapsed.mx_LeftPanel_container_hasTagPanel {
/* TagPanel 70px + Collapsed LeftPanel 70px */
flex: 0 0 140px;
}
.mx_LeftPanel_hideButton {
@ -55,6 +45,14 @@ limitations under the License.
}
.mx_LeftPanel {
flex: 1;
overflow-x: hidden;
display: flex;
flex-direction: column;
min-height: 0;
}
.mx_LeftPanel .mx_AppTile_mini {
height: 132px;
}
@ -68,7 +66,7 @@ limitations under the License.
z-index: 6;
}
.mx_LeftPanel.collapsed .mx_BottomLeftMenu {
.mx_LeftPanel_container.collapsed .mx_BottomLeftMenu {
flex: 0 0 160px;
margin-bottom: 9px;
}
@ -91,12 +89,6 @@ limitations under the License.
pointer-events: none;
}
.collapsed .mx_RoleButton {
margin-right: 0px ! important;
padding-top: 3px ! important;
padding-bottom: 3px ! important;
}
.mx_BottomLeftMenu_options > div {
display: inline-block;
}
@ -115,7 +107,7 @@ limitations under the License.
margin-right: 0px;
}
.mx_LeftPanel.collapsed .mx_BottomLeftMenu_settings {
.mx_LeftPanel_container.collapsed .mx_BottomLeftMenu_settings {
float: none;
}
@ -124,7 +116,7 @@ limitations under the License.
flex: 0 0 50px;
}
.mx_LeftPanel.collapsed .mx_BottomLeftMenu {
.mx_LeftPanel_container.collapsed .mx_BottomLeftMenu {
flex: 0 0 160px;
}

32
res/css/structures/_MatrixChat.scss
View file

@ -54,6 +54,7 @@ limitations under the License.
order: 2;
flex: 1;
min-height: 0;
}
.mx_MatrixChat_syncError {
@ -68,23 +69,8 @@ limitations under the License.
transform: translateX(-50%);
}
.mx_MatrixChat .mx_LeftPanel {
order: 1;
background-color: $secondary-accent-color;
flex: 0 0 235px;
}
.mx_MatrixChat .mx_LeftPanel.collapsed {
flex: 0 0 60px;
}
.mx_MatrixChat .mx_MatrixChat_middlePanel {
order: 2;
padding-left: 20px;
padding-right: 22px;
/* not the left panel, and not the resize handle, so the roomview/groupview/... */
.mx_MatrixChat > :not(.mx_LeftPanel_container):not(.mx_ResizeHandle) {
background-color: $primary-bg-color;
flex: 1;
@ -96,21 +82,9 @@ limitations under the License.
*/
overflow-x: auto;
display: flex;
/* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari
needed height 100% all the way down to the HomePage. Height does not
have to be auto, empirically.
*/
height: 100%;
}
.mx_MatrixChat .mx_RightPanel {
order: 3;
flex: 0 0 235px;
}
.mx_MatrixChat .mx_RightPanel.collapsed {
flex: 0 0 122px;
}

36
res/css/structures/_MyGroups.scss
View file

@ -15,10 +15,6 @@ limitations under the License.
*/
.mx_MyGroups {
max-width: 960px;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: column;
}
@ -34,6 +30,11 @@ limitations under the License.
flex-wrap: wrap;
}
.mx_MyGroups > :not(.mx_RoomHeader) {
max-width: 960px;
margin: 40px;
}
.mx_MyGroups_headerCard {
flex: 1 0 50%;
margin-bottom: 30px;
@ -43,14 +44,31 @@ limitations under the License.
}
.mx_MyGroups_headerCard .mx_MyGroups_headerCard_button {
flex: 0 0 auto;
margin-right: 13px;
height: 50px;
height: 40px;
width: 40px;
border-radius: 20px;
background-color: $roomheader-addroom-color;
position: relative;
&:before {
background-color: $accent-fg-color;
mask: url('../../img/icons-create-room.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: 80%;
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
}
.mx_MyGroups_headerCard_button object {
/* Otherwise the SVG object absorbs clicks and the button doesn't work */
pointer-events: none;
}
.mx_MyGroups_headerCard_header {
font-weight: bold;

6
res/css/structures/_NotificationPanel.scss
View file

@ -16,11 +16,7 @@ limitations under the License.
.mx_NotificationPanel {
order: 2;
flex: 1 1 0;
width: 100%;
overflow-y: auto;
}
@ -97,4 +93,4 @@ limitations under the License.
.mx_NotificationPanel .mx_EventTile_content {
margin-right: 0px;
}
}

81
res/css/structures/_RightPanel.scss
View file

@ -15,8 +15,10 @@ limitations under the License.
*/
.mx_RightPanel {
overflow-x: hidden;
flex: 0 0 auto;
position: relative;
min-width: 250px;
display: flex;
flex-direction: column;
}
@ -25,55 +27,57 @@ limitations under the License.
order: 1;
border-bottom: 1px solid $primary-hairline-color;
margin-right: 20px;
flex: 0 0 70px;
flex: 0 0 52px;
}
/** Fixme - factor this out with the main header **/
.mx_RightPanel_headerButtonGroup {
margin-top: 6px;
height: 100%;
display: flex;
width: 100%;
background-color: $primary-bg-color;
margin-left: 0px;
padding: 0 9px;
align-items: center;
}
.mx_RightPanel_headerButton {
cursor: pointer;
flex: 0 0 auto;
vertical-align: top;
padding-left: 4px;
margin-top: 4px;
padding-left: 5px;
padding-right: 5px;
text-align: center;
position: relative;
border-bottom: 2px solid transparent;
}
.mx_RightPanel_headerButton object {
pointer-events: none;
padding-bottom: 3px;
}
.mx_RightPanel_headerButton_highlight {
width: 25px;
height: 5px;
border-radius: 5px;
background-color: $accent-color;
opacity: 0.2;
border-color: $button-bg-color;
}
.mx_RightPanel_headerButton_badge {
font-size: 11px;
color: $accent-color;
font-size: 8px;
border-radius: 8px;
color: $accent-fg-color;
background-color: $accent-color;
font-weight: bold;
padding-bottom: 2px;
position: absolute;
top: -4px;
left: 20px;
padding: 2px 4px;
}
.mx_RightPanel_collapsebutton {
flex: 1;
text-align: right;
margin-top: 20px;
height: 16px;
border: none;
}
.mx_RightPanel .mx_MemberList,
@ -88,46 +92,3 @@ limitations under the License.
order: 2;
margin: auto;
}
.mx_RightPanel_footer {
order: 3;
border-top: 1px solid $primary-hairline-color;
margin-right: 20px;
flex: 0 0 60px;
}
.mx_RightPanel_footer .mx_RightPanel_invite {
font-size: 14px;
color: $primary-fg-color;
padding-top: 13px;
padding-left: 5px;
cursor: pointer;
display: flex;
align-items: center;
}
.collapsed .mx_RightPanel_footer .mx_RightPanel_invite {
display: none;
}
.mx_RightPanel_invite .mx_RightPanel_icon object {
pointer-events: none;
}
.mx_RightPanel_invite .mx_RightPanel_message {
padding-left: 10px;
line-height: 18px;
}
.mx_MatrixChat_useCompactLayout {
.mx_RightPanel_footer {
flex: 0 0 50px;
}
.mx_RightPanel_footer .mx_RightPanel_invite {
line-height: 25px;
padding-top: 8px;
}
}

329
res/css/structures/_RoomSubList.scss
View file

@ -14,235 +14,188 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomSubList {
display: table;
table-layout: fixed;
width: 100%;
/* a word of explanation about the flex-shrink values employed here:
there are 3 priotized categories of screen real-estate grabbing,
each with a flex-shrink difference of 4 order of magnitude,
so they ideally wouldn't affect each other.
lowest category: .mx_RoomSubList
flex-shrink: 10000000
distribute size of items within the same categery by their size
middle category: .mx_RoomSubList.resized-sized
flex-shrink: 1000
applied when using the resizer, will have a max-height set to it,
to limit the size
highest category: .mx_RoomSubList.resized-all
flex-shrink: 1
small flex-shrink value (1), is only added if you can drag the resizer so far
so in practice you can only assign this category if there is enough space.
*/
background-color: $roomsublist-background;
.mx_RoomSubList {
min-height: 31px;
flex: 0 100000000 auto;
display: flex;
flex-direction: column;
}
.mx_RoomSubList_nonEmpty {
min-height: 70px;
.mx_AutoHideScrollbar_offset {
padding-bottom: 4px;
}
}
.mx_RoomSubList_hidden {
flex: none !important;
}
.mx_RoomSubList.resized-all {
flex: 0 1 auto;
}
.mx_RoomSubList.resized-sized {
/* resizer set max-height on resized-sized,
so that limits the height and hence
needs a very small flex-shrink */
flex: 0 10000 auto;
}
.mx_RoomSubList_labelContainer {
height: 31px; /* mx_RoomSubList_label height including border */
width: 235px; /* LHS Panel width */
position: relative;
display: flex;
flex-direction: row;
align-items: center;
flex: 0 0 auto;
margin: 0 16px;
height: 36px;
}
.mx_RoomSubList_label {
position: relative;
flex: 1;
cursor: pointer;
display: flex;
align-items: center;
padding: 0 6px;
}
.mx_RoomSubList_label > span {
flex: 1 1 auto;
text-transform: uppercase;
color: $roomsublist-label-fg-color;
font-weight: 600;
font-weight: 700;
font-size: 12px;
width: 203px; /* padding + width = LHS Panel width */
height: 19px; /* height + padding = 31px = mx_RoomSubList_label height */
padding-left: 16px; /* gutter */
padding-right: 16px; /* gutter */
padding-top: 6px;
padding-bottom: 6px;
cursor: pointer;
background-color: $secondary-accent-color;
}
.mx_RoomSubList_label.mx_RoomSubList_fixed {
position: fixed;
top: 0;
z-index: 5;
/* pointer-events: none; */
}
.collapsed .mx_RoomSubList_label {
height: 17px;
width: 28px; /* collapsed LHS Panel width */
}
.collapsed .mx_RoomSubList_labelContainer {
width: 28px; /* collapsed LHS Panel width */
}
.mx_RoomSubList_roomCount {
display: inline-block;
font-size: 12px;
font-weight: normal;
color: $accent-color;
padding-left: 5px;
text-transform: none;
}
.collapsed .mx_RoomSubList_roomCount {
display: none;
margin-left: 8px;
}
.mx_RoomSubList_badge {
display: inline-block;
min-width: 15px;
height: 15px;
position: absolute;
right: 8px; /*gutter */
top: 7px;
flex: 0 0 auto;
border-radius: 8px;
color: $accent-fg-color;
font-weight: 600;
font-size: 10px;
text-align: center;
padding-top: 1px;
padding-left: 4px;
padding-right: 4px;
background-color: $accent-color;
font-size: 12px;
padding: 0 5px;
background-color: $roomtile-name-color;
}
.mx_RoomSubList_label .mx_RoomSubList_badge:hover {
filter: brightness($focus-brightness);
.mx_RoomSubList_addRoom, .mx_RoomSubList_badge {
margin-left: 7px;
}
/*
.collapsed .mx_RoomSubList_badge {
display: none;
.mx_RoomSubList_addRoom {
background-color: $roomheader-addroom-color;
color: $roomsublist-background;
background-image: url('../../img/icons-room-add.svg');
background-repeat: no-repeat;
background-position: center;
border-radius: 10px; // 16/2 + 2 padding
height: 16px;
flex: 0 0 16px;
background-clip: content-box;
}
*/
.mx_RoomSubList_badgeHighlight {
background-color: $warning-color;
}
/* This is the bottom of the speech bubble */
.mx_RoomSubList_badgeHighlight:after {
content: "";
position: absolute;
display: block;
width: 0;
height: 0;
margin-left: 5px;
border-top: 5px solid $warning-color;
border-right: 7px solid transparent;
}
/* Hide the bottom of speech bubble */
.collapsed .mx_RoomSubList_badgeHighlight:after {
display: none;
}
.mx_RoomSubList_chevron {
pointer-events: none;
position: absolute;
right: 41px;
top: 11px;
background-image: url('../../img/topleft-chevron.svg');
background-repeat: no-repeat;
transition: transform 0.2s ease-in;
width: 10px;
height: 10px;
background-position: center;
margin-left: 2px;
}
.mx_RoomSubList_chevronDown {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 6px solid $roomsublist-chevron-color;
transform: rotateZ(0deg);
}
.mx_RoomSubList_chevronUp {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 6px solid $roomsublist-chevron-color;
transform: rotateZ(180deg);
}
.mx_RoomSubList_chevronRight {
width: 0;
height: 0;
border-top: 5px solid transparent;
border-left: 6px solid $roomsublist-chevron-color;
border-bottom: 5px solid transparent;
transform: rotateZ(-90deg);
}
/* The overflow section */
.mx_RoomSubList_ellipsis {
display: block;
line-height: 11px;
height: 18px;
position: relative;
cursor: pointer;
font-size: 13px;
background-color: $secondary-accent-color;
.mx_RoomSubList_scroll {
/* let rooms list grab as much space as it needs (auto),
potentially overflowing and showing a scrollbar */
flex: 0 1 auto;
padding: 0 8px;
}
.collapsed .mx_RoomSubList_ellipsis {
height: 20px;
// overflow indicators
.mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll {
&.mx_IndicatorScrollbar_topOverflow::before,
&.mx_IndicatorScrollbar_bottomOverflow::after {
position: sticky;
left: 0;
right: 0;
height: 30px;
content: "";
display: block;
z-index: 100;
pointer-events: none;
}
&.mx_IndicatorScrollbar_topOverflow > .mx_AutoHideScrollbar_offset {
margin-top: -30px;
}
&.mx_IndicatorScrollbar_bottomOverflow > .mx_AutoHideScrollbar_offset {
margin-bottom: -30px;
}
&.mx_IndicatorScrollbar_topOverflow::before {
top: 0;
background: linear-gradient(to top, rgba(242,245,248,0), rgba(242,245,248,1));
}
&.mx_IndicatorScrollbar_bottomOverflow::after {
bottom: 0;
background: linear-gradient(to bottom, rgba(242,245,248,0), rgba(242,245,248,1));
}
}
.mx_RoomSubList_line {
display: inline-block;
width: 159px;
border-top: dotted 2px $accent-color;
vertical-align: middle;
.collapsed {
.mx_RoomSubList_scroll {
padding: 0;
}
.mx_RoomSubList_labelContainer {
margin-right: 14px;
margin-left: 2px;
}
.mx_RoomSubList_addRoom {
margin-left: 3px;
margin-right: 10px;
}
.mx_RoomSubList_label > span {
display: none;
}
}
.collapsed .mx_RoomSubList_line {
display: none;
}
.mx_RoomSubList_more {
display: inline-block;
text-transform: uppercase;
font-size: 10px;
font-weight: 600;
text-align: left;
color: $accent-color;
padding-left: 7px;
padding-right: 7px;
padding-left: 7px;
vertical-align: middle;
}
.collapsed .mx_RoomSubList_more {
display: none;
}
.mx_RoomSubList_moreBadge {
display: inline-block;
min-width: 15px;
height: 13px;
position: absolute;
right: 8px; /*gutter */
top: -2px;
border-radius: 8px;
border: solid 1px $accent-color;
color: $accent-fg-color;
font-weight: 600;
font-size: 10px;
text-align: center;
padding-top: 1px;
padding-left: 3px;
padding-right: 3px;
background-color: $primary-bg-color;
vertical-align: middle;
}
.mx_RoomSubList_moreBadge.mx_RoomSubList_moreBadgeNotify {
background-color: $accent-color;
border: 0;
padding-top: 3px;
padding-left: 4px;
padding-right: 4px;
}
.mx_RoomSubList_moreBadge.mx_RoomSubList_moreBadgeHighlight {
background-color: $warning-color;
border: 0;
padding-top: 3px;
padding-left: 4px;
padding-right: 4px;
}
.collapsed .mx_RoomSubList_moreBadge {
position: static;
margin-left: 16px;
margin-top: 2px;
}
.mx_RoomSubList_ellipsis .mx_RoomSubList_chevronDown {
position: relative;
top: 4px;
left: 2px;
}

55
res/css/structures/_RoomView.scss
View file

@ -16,23 +16,12 @@ limitations under the License.
.mx_RoomView {
word-wrap: break-word;
position: relative;
display: flex;
width: 100%;
flex-direction: column;
}
.mx_RoomView .mx_RoomHeader {
order: 1;
flex: 0 0 70px;
}
.mx_RoomView_fileDropTarget {
min-width: 0px;
max-width: 960px;
width: 100%;
font-size: 18px;
text-align: center;
@ -50,7 +39,7 @@ limitations under the License.
border: 2px #e1dddd solid;
border-bottom: none;
position: absolute;
top: 70px;
top: 52px;
bottom: 0px;
z-index: 3000;
}
@ -63,33 +52,47 @@ limitations under the License.
}
.mx_RoomView_auxPanel {
order: 2;
min-width: 0px;
max-width: 960px;
width: 100%;
margin: 0px auto;
overflow: auto;
border-bottom: 1px solid $primary-hairline-color;
flex: 0 0 auto;
}
.mx_RoomView_auxPanel_fullHeight {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 3000;
background-color: $primary-bg-color;
}
.mx_RoomView_auxPanel_apps {
max-width: 1920px ! important;
}
.mx_RoomView_body {
order: 3;
.mx_RoomView .mx_MainSplit {
flex: 1 1 0;
flex-direction: column;
display: flex;
}
.mx_RoomView_body .mx_RoomView_topUnreadMessagesBar {
order: 1;
.mx_RoomView_body {
position: relative; //for .mx_RoomView_auxPanel_fullHeight
display: flex;
flex-direction: column;
flex: 1;
}
.mx_RoomView_body .mx_RoomView_timeline {
/* offset parent for mx_RoomView_topUnreadMessagesBar */
position: relative;
flex: 1;
display: flex;
flex-direction: column;
}
.mx_RoomView_body .mx_RoomView_messagePanel {
@ -98,7 +101,6 @@ limitations under the License.
.mx_RoomView_body .mx_RoomView_messagePanelSpinner {
order: 2;
margin: auto;
}
.mx_RoomView_body .mx_RoomView_statusArea {
@ -115,9 +117,6 @@ limitations under the License.
}
.mx_RoomView_messageListWrapper {
max-width: 960px;
margin: auto;
min-height: 100%;
display: flex;
@ -142,9 +141,8 @@ limitations under the License.
}
.mx_RoomView_MessageList {
width: 100%;
list-style-type: none;
padding: 0px;
padding: 18px;
}
.mx_RoomView_MessageList li {
@ -184,7 +182,6 @@ hr.mx_RoomView_myReadMarker {
}
.mx_RoomView_statusAreaBox {
max-width: 960px;
margin: auto;
min-height: 50px;
}

55
res/css/structures/_SearchBox.scss
View file

@ -14,55 +14,12 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SearchBox {
height: 24px;
margin-left: 16px;
margin-right: 16px;
padding-top: 24px;
padding-bottom: 22px;
border-bottom: 1px solid $panel-divider-color;
display: flex;
}
.mx_SearchBox_searchButton {
margin-right: 10px;
margin-top: 5px;
pointer-events: none;
}
.mx_SearchBox_closeButton {
cursor: pointer;
margin-top: -5px;
}
.mx_SearchBox_search {
flex: 1 1 auto;
width: 0px;
font-family: $font-family;
font-size: 12px;
margin-top: -2px;
height: 24px;
border: 0px ! important;
/* border-bottom: 1px solid rgba(0, 0, 0, 0.1) ! important; */
border: 0px;
}
.mx_SearchBox_minimise,
.mx_SearchBox_maximise {
margin-top: 3px;
cursor: pointer;
}
.mx_SearchBox_minimise {
margin-left: 10px;
}
.mx_SearchBox_maximise {
margin-left: 9px;
}
.mx_SearchBox object {
pointer-events: none;
background-image: url('../../img/icons-close.svg');
background-repeat: no-repeat;
width: 16px;
height: 16px;
background-position: center;
padding: 9px;
}

59
res/css/structures/_TagPanel.scss
View file

@ -15,8 +15,9 @@ limitations under the License.
*/
.mx_TagPanel {
flex: 0 0 60px;
background-color: $tertiary-accent-color;
flex: 0 0 70px;
background-color: $tagpanel-bg-color;
cursor: pointer;
display: flex;
flex-direction: column;
@ -38,6 +39,8 @@ limitations under the License.
display: flex;
justify-content: center;
align-items: flex-start;
display: none;
}
.mx_TagPanel .mx_TagPanel_clearButton object {
@ -50,6 +53,7 @@ limitations under the License.
height: 0px;
width: 42px;
border-bottom: 1px solid $panel-divider-color;
display: none;
}
.mx_TagPanel .mx_TagPanel_scroller {
@ -60,19 +64,21 @@ limitations under the License.
display: flex;
flex-direction: column;
align-items: center;
margin-top: 5px;
height: 100%;
}
.mx_TagPanel .mx_TagTile {
padding: 6px 3px;
opacity: 0.5;
padding-top: 9px;
padding-bottom: 9px;
// opacity: 0.5;
position: relative;
}
.mx_TagPanel .mx_TagTile:focus,
.mx_TagPanel .mx_TagTile:hover,
.mx_TagPanel .mx_TagTile.mx_TagTile_selected {
opacity: 1;
// opacity: 1;
}
.mx_TagPanel .mx_TagTile.mx_TagTile_selected {
@ -83,12 +89,12 @@ limitations under the License.
.mx_TagPanel .mx_TagTile.mx_TagTile_selected .mx_TagTile_avatar .mx_BaseAvatar {
border: 3px solid $accent-color;
background-color: $accent-color;
border-radius: 60px;
border-radius: 40px;
/* In case this is a "initial" avatar */
display: block;
height: 35px;
width: 35px;
height: 40px;
width: 40px;
}
.mx_TagPanel .mx_TagTile.mx_AccessibleButton:focus {
@ -119,11 +125,38 @@ limitations under the License.
}
.mx_TagPanel_groupsButton {
margin-bottom: 17px;
margin-top: 18px;
height: 25px;
flex: 0;
margin: 17px 0 3px 0;
}
.mx_TagPanel_groupsButton object {
pointer-events: none;
.mx_TagPanel_groupsButton > .mx_GroupsButton:before {
mask: url('../../img/feather-icons/users.svg');
mask-position: center 11px;
}
.mx_TagPanel_groupsButton > .mx_TagPanel_report:before {
mask: url('../../img/feather-icons/life-buoy.svg');
mask-position: center 9px;
}
.mx_TagPanel_groupsButton > .mx_AccessibleButton {
margin-bottom: 12px;
height: 40px;
width: 40px;
border-radius: 20px;
background-color: $roomheader-addroom-color;
position: relative;
/* overwrite mx_RoleButton inline-block */
display: block !important;
&:before {
background-color: $tagpanel-bg-color;
mask-repeat: no-repeat;
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
}

44
res/css/structures/_TopLeftMenuButton.scss Normal file
View file

@ -0,0 +1,44 @@
/*
Copyright 2018 New Vector 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_TopLeftMenuButton {
flex: 0 0 52px;
border-bottom: 1px solid $panel-divider-color;
color: $topleftmenu-color;
background-color: $primary-bg-color;
display: flex;
align-items: center;
min-width: 0;
padding: 0 7px;
overflow: hidden;
}
.mx_TopLeftMenuButton .mx_BaseAvatar {
margin: 0 7px;
}
.mx_TopLeftMenuButton_name {
margin: 0 7px;
font-size: 18px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
font-weight: 600;
}
.mx_TopLeftMenuButton_chevron {
margin: 0 7px;
}

4
res/css/views/context_menus/_MessageContextMenu.scss
View file

@ -14,6 +14,10 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MessageContextMenu {
padding: 6px;
}
.mx_MessageContextMenu_field {
padding: 3px 6px 3px 6px;
cursor: pointer;

4
res/css/views/context_menus/_RoomTileContextMenu.scss
View file

@ -14,6 +14,10 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomTileContextMenu {
padding: 6px;
}
.mx_RoomTileContextMenu_tag_field, .mx_RoomTileContextMenu_leave {
padding-top: 8px;
padding-right: 20px;

39
res/css/views/context_menus/_TopLeftMenu.scss Normal file
View file

@ -0,0 +1,39 @@
/*
Copyright 2018 New Vector 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_TopLeftMenu {
min-width: 180px;
.mx_TopLeftMenu_section:not(:last-child) {
border-bottom: 1px solid $menu-border-color;
}
.mx_TopLeftMenu_section {
list-style: none;
margin: 5px 0;
padding: 0;
li {
white-space: nowrap;
padding: 5px 20px;
}
li:hover {
background-color: $menu-selected-color;
}
}
}

3
res/css/views/elements/_AccessibleButton.scss
View file

@ -16,9 +16,8 @@ limitations under the License.
.mx_AccessibleButton:focus {
outline: 0;
filter: brightness($focus-brightness);
}
.mx_AccessibleButton {
cursor: pointer;
}
}

46
res/css/views/elements/_ResizeHandle.scss Normal file
View file

@ -0,0 +1,46 @@
/*
Copyright 2018 New Vector 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_ResizeHandle {
cursor: row-resize;
flex: 0 0 auto;
z-index: 100;
}
.mx_ResizeHandle.mx_ResizeHandle_horizontal {
margin: 0 -5px;
padding: 0 5px;
cursor: col-resize;
}
.mx_ResizeHandle.mx_ResizeHandle_vertical {
margin: -5px 0;
padding: 5px 0;
cursor: row-resize;
}
.mx_ResizeHandle > div {
background: $panel-divider-color;
}
.mx_ResizeHandle.mx_ResizeHandle_horizontal > div {
width: 1px;
height: 100%;
}
.mx_ResizeHandle.mx_ResizeHandle_vertical > div {
height: 1px;
}

6
res/css/views/groups/_GroupRoomList.scss
View file

@ -18,4 +18,10 @@ limitations under the License.
position: relative;
color: $primary-fg-color;
cursor: pointer;
display: flex;
align-items: center;
}
.mx_GroupRoomList_wrapper {
padding: 10px;
}

21
res/css/views/messages/_DateSeparator.scss
View file

@ -16,10 +16,21 @@ limitations under the License.
.mx_DateSeparator {
clear: both;
margin-top: 32px;
margin-bottom: 8px;
margin-left: 63px;
padding-bottom: 6px;
border-bottom: 1px solid $primary-hairline-color;
margin: 4px 0;
display: flex;
align-items: center;
font-size: 14px;
color: $roomtopic-color;
}
.mx_DateSeparator > hr {
flex: 1 1 0;
height: 0;
border: none;
border-bottom: 1px solid $panel-divider-color;
}
.mx_DateSeparator > date {
margin: 0 25px;
flex: 0 0 auto;
}

38
res/css/views/messages/_SenderProfile.scss
View file

@ -13,3 +13,41 @@ 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_SenderProfile_name {
font-weight: 600;
}
.mx_SenderProfile_color1 {
color: $username-variant1-color;
}
.mx_SenderProfile_color2 {
color: $username-variant2-color;
}
.mx_SenderProfile_color3 {
color: $username-variant3-color;
}
.mx_SenderProfile_color4 {
color: $username-variant4-color;
}
.mx_SenderProfile_color5 {
color: $username-variant5-color;
}
.mx_SenderProfile_color6 {
color: $username-variant6-color;
}
.mx_SenderProfile_color7 {
color: $username-variant7-color;
}
.mx_SenderProfile_color8 {
color: $username-variant8-color;
}

32
res/css/views/rooms/_EntityTile.scss
View file

@ -15,12 +15,19 @@ limitations under the License.
*/
.mx_EntityTile {
display: table-row;
position: relative;
display: flex;
align-items: center;
color: $primary-fg-color;
cursor: pointer;
}
.mx_EntityTile:hover {
background-image: url('../../img/member_chevron.png');
background-position: center right 10px;
background-repeat: no-repeat;
padding-right: 30px;
}
.mx_EntityTile_invite {
display: table-cell;
vertical-align: middle;
@ -30,12 +37,10 @@ limitations under the License.
.mx_EntityTile_avatar,
.mx_GroupRoomTile_avatar {
display: table-cell;
padding-left: 3px;
padding-right: 12px;
padding-top: 4px;
padding-bottom: 4px;
vertical-align: middle;
width: 36px;
height: 36px;
position: relative;
@ -51,32 +56,21 @@ limitations under the License.
.mx_EntityTile_name,
.mx_GroupRoomTile_name {
display: table-cell;
vertical-align: middle;
flex: 1 1 0;
overflow: hidden;
font-size: 14px;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 155px;
}
.mx_EntityTile_details {
display: table-cell;
padding-right: 14px;
vertical-align: middle;
overflow: hidden;
}
.mx_EntityTile_name_hover {
font-size: 13px;
}
.mx_EntityTile_chevron {
margin-top: 8px;
margin-right: -4px;
margin-left: 6px;
float: right;
}
.mx_EntityTile_ellipsis .mx_EntityTile_name {
font-style: italic;
color: $primary-fg-color;
@ -87,6 +81,7 @@ limitations under the License.
color: $primary-fg-color;
}
/*
.mx_EntityTile_unavailable .mx_EntityTile_avatar,
.mx_EntityTile_unavailable .mx_EntityTile_name,
.mx_EntityTile_unavailable .mx_EntityTile_name_hover,
@ -110,6 +105,7 @@ limitations under the License.
{
opacity: 0.25;
}
*/
.mx_EntityTile_subtext {
font-size: 11px;
@ -118,5 +114,3 @@ limitations under the License.
white-space: nowrap;
text-overflow: clip;
}

7
res/css/views/rooms/_EventTile.scss
View file

@ -55,11 +55,6 @@ limitations under the License.
line-height: 22px;
}
.mx_EventTile .mx_SenderProfile .mx_SenderProfile_name,
.mx_EventTile .mx_SenderProfile .mx_SenderProfile_aux {
opacity: 0.5;
}
.mx_EventTile .mx_SenderProfile .mx_Flair {
opacity: 0.7;
margin-left: 5px;
@ -450,7 +445,7 @@ limitations under the License.
}
.mx_EventTile_content .markdown-body a {
color: $accent-color;
color: $accent-color-alt;
}
.mx_EventTile_content .markdown-body .hljs {

47
res/css/views/rooms/_MemberInfo.scss
View file

@ -15,14 +15,35 @@ limitations under the License.
*/
.mx_MemberInfo {
margin-top: 20px;
padding-right: 20px;
height: 100%;
display: flex;
flex-direction: column;
flex: 1;
overflow-y: auto;
}
.mx_MemberInfo_name {
align-items: center;
display: flex;
}
.mx_MemberInfo_cancel {
height: 16px;
padding: 10px 15px;
cursor: pointer;
}
.mx_MemberInfo_name h2 {
flex: 1;
}
.mx_MemberInfo h2 {
margin-top: 6px;
font-size: 18px;
font-weight: 600;
margin: 16px 0;
}
.mx_MemberInfo_container {
padding: 8px;
}
.mx_MemberInfo .mx_RoomTile_nameContainer {
@ -37,14 +58,16 @@ limitations under the License.
width: 160px;
}
.mx_MemberInfo_cancel {
float: right;
margin-right: 10px;
cursor: pointer;
.mx_MemberInfo_avatar {
background: $tagpanel-bg-color;
}
.mx_MemberInfo_avatar {
clear: both;
.mx_MemberInfo_avatar > img {
height: auto;
width: 100%;
max-height: 30vh;
object-fit: contain;
display: block;
}
.mx_MemberInfo_avatar .mx_BaseAvatar {
@ -70,7 +93,6 @@ limitations under the License.
.mx_MemberInfo_profileField {
font-size: 13px;
position: relative;
background-color: $primary-bg-color;
}
.mx_MemberInfo_buttons {
@ -117,3 +139,6 @@ limitations under the License.
white-space: nowrap;
text-overflow: clip;
}
.mx_MemberInfo .mx_MemberInfo_scrollContainer {
flex: 1;
}

108
res/css/views/rooms/_MemberList.scss
View file

@ -17,20 +17,24 @@ limitations under the License.
.mx_MemberList,
.mx_GroupMemberList,
.mx_GroupRoomList {
height: 100%;
margin-top: 12px;
margin-right: 20px;
flex: 1;
display: flex;
flex-direction: column;
}
.mx_MemberList .mx_Spinner {
flex: 0 0 auto;
.mx_Spinner {
flex: 1 0 auto;
}
h2 {
text-transform: uppercase;
color: $h3-color;
font-weight: 600;
font-size: 13px;
padding-left: 3px;
padding-right: 12px;
margin-top: 8px;
margin-bottom: 4px;
}
}
.mx_MemberList_chevron {
@ -49,65 +53,39 @@ limitations under the License.
.mx_MemberList_query,
.mx_GroupMemberList_query,
.mx_GroupRoomList_query {
font-family: $font-family;
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
margin-left: 3px;
font-size: 14px;
margin-bottom: 8px;
width: 189px;
flex: 1 1 0;
}
.mx_MemberList_query::-moz-placeholder,
.mx_GroupMemberList_query::-moz-placeholder,
.mx_GroupRoomList_query::-moz-placeholder {
color: $primary-fg-color;
opacity: 0.5;
font-size: 14px;
}
.mx_MemberList_query::-webkit-input-placeholder,
.mx_GroupMemberList_query::-webkit-input-placeholder,
.mx_GroupRoomList_query::-webkit-input-placeholder {
color: $primary-fg-color;
opacity: 0.5;
font-size: 14px;
}
.mx_MemberList_joined {
order: 2;
flex: 1 0 0;
overflow-y: auto;
}
/*
.mx_MemberList_invited {
order: 3;
flex: 0 0 100px;
overflow-y: auto;
}
*/
.mx_GroupMemberList_invited h2,
.mx_MemberList_invited h2 {
text-transform: uppercase;
color: $h3-color;
font-weight: 600;
font-size: 13px;
padding-left: 3px;
padding-right: 12px;
margin-top: 8px;
margin-bottom: 4px;
}
/* we have to have display: table in order for the horizontal wrapping to work */
.mx_MemberList_wrapper {
display: table;
table-layout: fixed;
width: 100%;
padding: 10px;
}
.mx_MemberList_invite,
.mx_RightPanel_invite {
flex: 0 0 auto;
position: relative;
background-color: $button-bg-color;
border-radius: 4px;
padding: 8px;
margin: 9px;
display: flex;
color: $button-fg-color;
font-weight: 600;
.mx_RightPanel_icon {
padding-right: 5px;
padding-top: 2px;
}
}
.mx_MemberList_invite span {
margin: 0 auto;
background-image: url('../../img/feather-icons/user-add.svg');
background-repeat: no-repeat;
background-position: center left;
padding-left: 25px;
}

15
res/css/views/rooms/_MessageComposer.scss
View file

@ -16,7 +16,6 @@ limitations under the License.
*/
.mx_MessageComposer_wrapper {
max-width: 960px;
vertical-align: middle;
margin: auto;
border-top: 1px solid $primary-hairline-color;
@ -58,26 +57,25 @@ limitations under the License.
width: 100%;
}
.mx_MessageComposer_row > div:last-child{
padding-right: 0;
}
.mx_MessageComposer .mx_MessageComposer_avatar {
padding-left: 10px;
padding-right: 28px;
padding: 0 28px;
}
.mx_MessageComposer .mx_MessageComposer_avatar .mx_BaseAvatar {
display: block;
}
.mx_MessageComposer .mx_AccessibleButton {
padding: 0 12px 0 0;
}
.mx_MessageComposer_composecontrols {
width: 100%;
}
.mx_MessageComposer_e2eIcon {
position: absolute;
left: 44px;
left: 60px;
}
.mx_MessageComposer_noperm_error {
@ -216,7 +214,6 @@ limitations under the License.
.mx_MessageComposer_formatbar {
margin: auto;
max-width: 960px;
display: flex;
height: 30px;

97
res/css/views/rooms/_RoomHeader.scss
View file

@ -14,29 +14,24 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
/* add 20px to the height of the header when editing */
.mx_RoomHeader_editing {
flex: 0 0 93px ! important;
.mx_RoomHeader {
flex: 0 0 52px;
border-bottom: 1px solid $primary-hairline-color;
}
.mx_RoomHeader_wrapper {
max-width: 960px;
margin: auto;
height: 70px;
height: 52px;
align-items: center;
display: flex;
}
.mx_RoomHeader_leftRow {
margin-left: -2px;
order: 1;
flex: 1;
overflow: hidden;
align-items: center;
min-width: 0;
padding: 0 10px 0 19px;
}
.mx_RoomHeader_spinner {
flex: 1;
height: 36px;
order: 2;
padding-left: 12px;
padding-right: 12px;
}
@ -45,7 +40,6 @@ limitations under the License.
@mixin mx_DialogButton;
margin-right: 8px;
margin-top: -5px;
order: 2;
}
.mx_RoomHeader_textButton:hover {
@ -57,31 +51,29 @@ limitations under the License.
}
.mx_RoomHeader_cancelButton {
order: 2;
cursor: pointer;
padding-left: 12px;
padding-right: 12px;
}
.mx_RoomHeader_rightRow {
margin-top: 4px;
background-color: $primary-bg-color;
.mx_RoomHeader_buttons {
display: flex;
align-items: center;
order: 3;
background-color: $primary-bg-color;
padding-right: 5px;
}
.mx_RoomHeader_info {
display: table-cell;
width: 100%;
vertical-align: middle;
display: flex;
flex: 1;
align-items: center;
}
.mx_RoomHeader_simpleHeader {
line-height: 70px;
color: $primary-fg-color;
font-size: 22px;
font-weight: bold;
line-height: 52px;
color: $roomheader-color;
font-size: 18px;
font-weight: 600;
overflow: hidden;
margin-left: 63px;
text-overflow: ellipsis;
@ -99,22 +91,19 @@ limitations under the License.
}
.mx_RoomHeader_name {
vertical-align: middle;
width: 100%;
height: 31px;
flex: 0 1 auto;
overflow: hidden;
color: $primary-fg-color;
font-weight: bold;
font-size: 22px;
padding-left: 19px;
padding-right: 16px;
/* why isn't text-overflow working? */
text-overflow: ellipsis;
color: $roomheader-color;
font-weight: 600;
font-size: 18px;
margin: 0 7px;
border-bottom: 1px solid transparent;
}
.mx_RoomHeader_nametext {
display: inline-block;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.mx_RoomHeader_settingsHint {
@ -166,25 +155,23 @@ limitations under the License.
}
.mx_RoomHeader_topic {
vertical-align: bottom;
float: left;
max-height: 38px;
color: $settings-grey-fg-color;
font-weight: 300;
flex: 1;
color: $roomtopic-color;
font-weight: 400;
font-size: 13px;
margin-left: 19px;
margin-right: 16px;
margin: 0 7px;
overflow: hidden;
text-overflow: ellipsis;
border-bottom: 1px solid transparent;
column-width: 960px;
line-height: 1.2em;
max-height: 2.4em;
}
.mx_RoomHeader_avatar {
display: table-cell;
width: 48px;
height: 50px;
vertical-align: middle;
flex: 0;
width: 28px;
height: 28px;
margin: 0 7px;
}
.mx_RoomHeader_avatar .mx_BaseAvatar_image {
@ -192,13 +179,13 @@ limitations under the License.
}
.mx_RoomHeader_avatarPicker {
margin-top: 23px;
position: relative;
}
.mx_RoomHeader_avatarPicker_edit {
margin-left: 16px;
margin-top: 4px;
position: absolute;
left: 16px;
top: 18px;
}
.mx_RoomHeader_avatarPicker_edit > label {
@ -210,7 +197,7 @@ limitations under the License.
}
.mx_RoomHeader_button {
margin-left: 12px;
margin-left: 10px;
cursor: pointer;
}
@ -218,6 +205,10 @@ limitations under the License.
pointer-events: none;
}
.mx_RoomHeader_showPanel {
height: 16px;
}
.mx_RoomHeader_voipButton {
display: table-cell;
}

30
res/css/views/rooms/_RoomList.scss
View file

@ -16,8 +16,21 @@ limitations under the License.
*/
.mx_RoomList {
padding-bottom: 12px;
min-height: 400px;
/* take up remaining space below TopLeftMenu */
flex: 1 1 auto;
/* use flexbox to layout sublists */
display: flex;
flex-direction: column;
min-height: 0;
}
.mx_SearchBox {
flex: none;
}
/* hide resize handles next to collapsed / empty sublists */
.mx_RoomList .mx_RoomSubList:not(.mx_RoomSubList_nonEmpty) + .mx_ResizeHandle {
display: none;
}
.mx_RoomList_expandButton {
@ -27,20 +40,7 @@ limitations under the License.
padding-right: 12px;
}
/* Evil hacky override until Chrome fixes drop and drag table cells
and we can correctly fix horizontal wrapping in the sidebar again */
.mx_RoomList_scrollbar .gm-scroll-view {
overflow-x: hidden ! important;
overflow-y: scroll ! important;
}
/* Make sure the scrollbar is above the sticky headers from RoomList */
.mx_RoomList_scrollbar .gm-scrollbar.-vertical {
z-index: 6;
}
.mx_RoomList_emptySubListTip_container {
background-color: $secondary-accent-color;
padding-left: 18px;
padding-right: 18px;
padding-top: 8px;

3
res/css/views/rooms/_RoomSettings.scss
View file

@ -16,8 +16,7 @@ limitations under the License.
*/
.mx_RoomSettings {
margin-left: 65px;
margin-bottom: 20px;
margin: 40px;
}
.mx_RoomSettings_upgradeButton,

136
res/css/views/rooms/_RoomTile.scss
View file

@ -15,13 +15,30 @@ limitations under the License.
*/
.mx_RoomTile {
position: relative;
display: flex;
flex-direction: row;
align-items: center;
cursor: pointer;
font-size: 13px;
display: block;
height: 34px;
margin: 0;
padding: 0 8px 0 10px;
position: relative;
}
background-color: $secondary-accent-color;
.mx_RoomTile_menuButton {
display: none;
flex: 0 0 16px;
height: 16px;
background-image: url('../../img/icon_context.svg');
background-repeat: no-repeat;
background-position: center;
}
// toggle menuButton and badge on hover/menu displayed
.mx_LeftPanel_container:not(.collapsed) .mx_RoomTile:hover, .mx_RoomTile_menuDisplayed {
.mx_RoomTile_menuButton {
display: block;
}
}
.mx_RoomTile_tooltip {
@ -38,6 +55,11 @@ limitations under the License.
vertical-align: middle;
}
.mx_RoomTile_avatar {
flex: 0;
padding: 4px;
}
.mx_RoomTile_subtext {
display: inline-block;
font-size: 11px;
@ -78,87 +100,53 @@ limitations under the License.
}
.mx_RoomTile_name {
display: inline-block;
position: relative;
width: 165px;
vertical-align: middle;
padding-left: 6px;
padding-right: 6px;
padding-top: 2px;
padding-bottom: 3px;
flex: 1 5 auto;
font-size: 14px;
font-weight: 600;
padding: 6px;
color: $roomtile-name-color;
white-space: nowrap;
overflow: hidden;
overflow-x: hidden;
text-overflow: ellipsis;
}
.mx_RoomTile_invite {
/* color: rgba(69, 69, 69, 0.5); */
}
.collapsed {
.mx_RoomTile {
margin: 0 2px;
padding: 0 2px;
position: relative;
justify-content: center;
}
.collapsed .mx_RoomTile_nameContainer {
width: 60px; /* colapsed panel width */
}
.mx_RoomTile_name {
display: none;
}
.collapsed .mx_RoomTile_name {
display: none;
}
.mx_RoomTile_badge {
position: absolute;
right: 6px;
top: 0px;
border-radius: 16px;
z-index: 3;
border: 0.18em solid $secondary-accent-color;
}
.collapsed .mx_RoomTile_badge {
top: 0px;
min-width: 12px;
border-radius: 16px;
padding: 0px 4px 0px 4px;
z-index: 3;
}
/* Hide the bottom of speech bubble */
.collapsed .mx_RoomTile_highlight .mx_RoomTile_badge:after {
display: none;
}
/* This is the bottom of the speech bubble */
.mx_RoomTile_highlight .mx_RoomTile_badge:after {
content: "";
position: absolute;
display: block;
width: 0;
height: 0;
margin-left: 5px;
border-top: 5px solid $warning-color;
border-right: 7px solid transparent;
.mx_RoomTile_menuButton {
display: none; //no design for this for now
}
}
.mx_RoomTile_badge {
display: inline-block;
min-width: 15px;
height: 15px;
position: absolute;
right: 8px; /*gutter */
top: 9px;
border-radius: 8px;
flex: 0 1 content;
border-radius: 0.8em;
padding: 0 0.4em;
color: $accent-fg-color;
font-weight: 600;
font-size: 10px;
text-align: center;
padding-top: 1px;
padding-left: 4px;
padding-right: 4px;
}
.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton,
.mx_RoomTile.mx_RoomTile_menuDisplayed .mx_RoomTile_badge {
letter-spacing: 0.1em;
opacity: 1;
}
.mx_RoomTile.mx_RoomTile_noBadges .mx_RoomTile_badge.mx_RoomTile_badgeButton,
.mx_RoomTile.mx_RoomTile_menuDisplayed.mx_RoomTile_noBadges .mx_RoomTile_badge {
background-color: $neutral-badge-color;
font-size: 12px;
}
.mx_RoomTile_unreadNotify .mx_RoomTile_badge {
background-color: $accent-color;
background-color: $roomtile-name-color;
}
.mx_RoomTile_highlight .mx_RoomTile_badge {
@ -167,9 +155,14 @@ limitations under the License.
.mx_RoomTile_unread, .mx_RoomTile_highlight {
font-weight: 800;
.mx_RoomTile_name {
color: $roomtile-selected-color;
}
}
.mx_RoomTile_selected {
border-radius: 4px;
background-color: $roomtile-selected-bg-color;
}
@ -187,10 +180,6 @@ limitations under the License.
background-color: $roomtile-focused-bg-color;
}
.mx_RoomTile .mx_RoomTile_name.mx_RoomTile_badgeShown {
width: 140px;
}
.mx_RoomTile_arrow {
position: absolute;
right: 0px;
@ -203,4 +192,3 @@ limitations under the License.
.mx_RoomTile.mx_RoomTile_transparent:focus {
background-color: $roomtile-transparent-focused-color;
}

4
res/css/views/rooms/_RoomTooltip.scss
View file

@ -21,7 +21,7 @@ limitations under the License.
width: 0;
height: 0;
border-top: 8px solid transparent;
border-right: 8px solid $menu-border-color;
border-right: 8px solid $menu-bg-color;
border-bottom: 8px solid transparent;
}
@ -40,8 +40,8 @@ limitations under the License.
.mx_RoomTooltip {
display: none;
position: fixed;
border: 1px solid $menu-border-color;
border-radius: 5px;
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.21);
background-color: $primary-bg-color;
z-index: 2000;
padding: 5px;

66
res/css/views/rooms/_TopUnreadMessagesBar.scss
View file

@ -14,40 +14,48 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
@charset "utf-8";
.mx_TopUnreadMessagesBar {
margin: auto; /* centre horizontally */
max-width: 960px;
padding-top: 10px;
padding-bottom: 10px;
border-bottom: 1px solid $primary-hairline-color;
z-index: 1000;
position: absolute;
top: 24px;
right: 24px;
width: 38px;
}
.mx_TopUnreadMessagesBar:after {
content: "·";
position: absolute;
top: -8px;
left: 11px;
width: 16px;
height: 16px;
border-radius: 16px;
font-weight: 600;
font-size: 30px;
line-height: 14px;
text-align: center;
color: $secondary-accent-color;
background-color: $accent-color;
}
.mx_TopUnreadMessagesBar_scrollUp {
display: inline;
cursor: pointer;
text-decoration: underline;
}
.mx_TopUnreadMessagesBar_scrollUp img {
padding-left: 10px;
padding-right: 31px;
vertical-align: middle;
}
.mx_TopUnreadMessagesBar_scrollUp span {
opacity: 0.5;
}
.mx_TopUnreadMessagesBar_close {
float: right;
padding-right: 14px;
padding-top: 3px;
height: 38px;
border-radius: 19px;
box-sizing: border-box;
background: $primary-bg-color;
border: 1.3px solid $roomtile-name-color;
cursor: pointer;
}
.mx_MatrixChat_useCompactLayout {
.mx_TopUnreadMessagesBar {
padding-top: 4px;
padding-bottom: 4px;
}
.mx_TopUnreadMessagesBar_scrollUp:before {
content: "";
position: absolute;
width: 38px;
height: 38px;
mask: url('../../img/icon-jump-to-first-unread.svg');
mask-repeat: no-repeat;
mask-position: 9px 13px;
background: $roomtile-name-color;
}

77
res/css/views/rooms/_WhoIsTypingTile.scss Normal file
View file

@ -0,0 +1,77 @@
/*
Copyright 2018 New Vector 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_WhoIsTypingTile {
margin-left: -18px; //offset padding from mx_RoomView_MessageList to center avatars
padding-top: 18px;
display: flex;
align-items: center;
}
/* position the indicator in the same place horizontally as .mx_EventTile_avatar. */
.mx_WhoIsTypingTile_avatars {
flex: 0 0 83px; // 18 + 65
text-align: center;
}
.mx_WhoIsTypingTile_avatars > :not(:first-child) {
margin-left: -12px;
}
.mx_WhoIsTypingTile_avatars .mx_BaseAvatar_image {
border: 1px solid $primary-bg-color;
}
.mx_WhoIsTypingTile_avatars .mx_BaseAvatar_initial {
padding-top: 1px;
}
.mx_WhoIsTypingTile_remainingAvatarPlaceholder {
display: inline-block;
color: #acacac;
background-color: #ddd;
border: 1px solid $primary-bg-color;
border-radius: 40px;
width: 24px;
height: 24px;
line-height: 24px;
font-size: 0.8em;
vertical-align: top;
text-align: center;
}
.mx_WhoIsTypingTile_label {
flex: 1;
font-size: 14px;
font-weight: 600;
color: $eventtile-meta-color;
}
.mx_WhoIsTypingTile_label > span {
background-image: url('../../img/typing-indicator-2x.gif');
background-size: 25px;
background-position: left bottom;
background-repeat: no-repeat;
padding-bottom: 15px;
display: block;
}
.mx_MatrixChat_useCompactLayout {
.mx_WhoIsTypingTile {
padding-top: 4px;
}
}

BIN
res/fonts/Nunito/XRXQ3I6Li01BKofIMN44Y9vKUTo.ttf Normal file
View file

Binary file not shown.

BIN
res/fonts/Nunito/XRXQ3I6Li01BKofIMN5cYtvKUTo.ttf Normal file
View file

Binary file not shown.

BIN
res/fonts/Nunito/XRXV3I6Li01BKofINeaE.ttf Normal file
View file

Binary file not shown.

BIN
res/fonts/Nunito/XRXW3I6Li01BKofA6sKUYevN.ttf Normal file
View file

Binary file not shown.

BIN
res/fonts/Nunito/XRXW3I6Li01BKofAjsOUYevN.ttf Normal file
View file

Binary file not shown.

BIN
res/fonts/Nunito/XRXX3I6Li01BKofIMNaDRss.ttf Normal file
View file

Binary file not shown.

14
res/img/feather-icons/face.svg Normal file
View file

@ -0,0 +1,14 @@
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="LifeBuoy" transform="translate(-1073.000000, -872.000000)">
<g id="face-copy" transform="translate(1074.000000, 873.000000)">
<circle id="Oval" stroke="#B8BEC9" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" cx="8" cy="8" r="8"></circle>
<path d="M7.6,7.6 C8.13333333,8.71262059 8.4,9.77928725 8.4,10.8 C8.4,11.8207127 8.13333333,12.8873794 7.6,14" id="Path" stroke="#B8BEC9" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" transform="translate(8.000000, 10.800000) rotate(90.000000) translate(-8.000000, -10.800000) "></path>
<path d="" id="Path-Copy" stroke="#B8BEC9" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" transform="translate(4.800000, 4.800000) rotate(90.000000) translate(-4.800000, -4.800000) "></path>
<circle id="Oval" fill="#B8BEC9" fill-rule="nonzero" cx="4.8" cy="5.6" r="1"></circle>
<circle id="Oval-Copy" fill="#B8BEC9" fill-rule="nonzero" cx="11.2" cy="5.6" r="1"></circle>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.3 KiB

11
res/img/feather-icons/files.svg Normal file
View file

@ -0,0 +1,11 @@
<svg width="15px" height="18px" viewBox="0 0 15 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1433.000000, -90.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="file-copy" transform="translate(1434.000000, 91.000000)">
<path d="M7.3125,0 L1.625,0 C0.727537282,0 0,0.7163444 0,1.6 L0,14.4 C0,15.2836556 0.727537282,16 1.625,16 L11.375,16 C12.2724627,16 13,15.2836556 13,14.4 L13,5.6 L7.3125,0 Z" id="Path"></path>
<polyline id="Path" points="7.3125 0 7.3125 5.6 13 5.6"></polyline>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 803 B

13
res/img/feather-icons/grid.svg Normal file
View file

@ -0,0 +1,13 @@
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1350.000000, -91.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="grid-copy" transform="translate(1351.000000, 92.000000)">
<rect id="Rectangle" x="0" y="0" width="5.44444444" height="5.44444444"></rect>
<rect id="Rectangle" x="8.55555556" y="0" width="5.44444444" height="5.44444444"></rect>
<rect id="Rectangle" x="8.55555556" y="8.55555556" width="5.44444444" height="5.44444444"></rect>
<rect id="Rectangle" x="0" y="8.55555556" width="5.44444444" height="5.44444444"></rect>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 929 B

18
res/img/feather-icons/life-buoy.svg Normal file
View file

@ -0,0 +1,18 @@
<svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-77.000000, -862.000000)" stroke="#2E3648" stroke-width="1.6">
<g id="Buoy" transform="translate(68.000000, 853.000000)">
<g id="life-buoy" transform="translate(10.000000, 10.000000)">
<circle id="Oval" cx="10" cy="10" r="10"></circle>
<circle id="Oval" cx="10" cy="10" r="4"></circle>
<path d="M2.93,2.93 L7.17,7.17" id="Path"></path>
<path d="M12.83,12.83 L17.07,17.07" id="Path"></path>
<path d="M12.83,7.17 L17.07,2.93" id="Path"></path>
<path d="M12.83,7.17 L16.36,3.64" id="Path"></path>
<path d="M2.93,17.07 L7.17,12.83" id="Path"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

10
res/img/feather-icons/notifications.svg Normal file
View file

@ -0,0 +1,10 @@
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1460.000000, -90.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="bell-copy" transform="translate(1461.000000, 91.000000)">
<path d="M16,12 L0,12 C1.3254834,12 2.4,10.9254834 2.4,9.6 L2.4,5.6 C2.40000005,2.50720543 4.90720543,8.34465016e-08 8,8.3446502e-08 C11.0927946,8.34465023e-08 13.6,2.50720543 13.6,5.6 L13.6,9.6 C13.6,10.9254834 14.6745166,12 16,12 Z M9.384,15.2 C9.09776179,15.6934435 8.57045489,15.997165 8,15.997165 C7.42954511,15.997165 6.90223821,15.6934435 6.616,15.2 L9.384,15.2 Z" id="Shape"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 916 B

10
res/img/feather-icons/paperclip.svg Normal file
View file

@ -0,0 +1,10 @@
<svg width="18px" height="19px" viewBox="0 0 18 19" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1103.000000, -871.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="paperclip-copy" transform="translate(1104.000000, 872.000000)">
<path d="M15.552,8.13571429 L8.2,15.5752381 C6.32444099,17.4731252 3.28355901,17.4731252 1.408,15.5752381 C-0.46755901,13.677351 -0.46755901,10.600268 1.408,8.70238095 L8.76,1.26285714 C10.0103727,-0.00240088755 12.0376273,-0.00240087226 13.288,1.26285718 C14.5383726,2.52811523 14.5383726,4.57950384 13.288,5.8447619 L5.928,13.2842857 C5.30281366,13.9169147 4.28918634,13.9169147 3.664,13.2842857 C3.03881366,12.6516567 3.03881366,11.6259624 3.664,10.9933333 L10.456,4.12857143" id="Path"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1 KiB

10
res/img/feather-icons/phone.svg Normal file
View file

@ -0,0 +1,10 @@
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1133.000000, -872.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="phone-copy" transform="translate(1134.000000, 873.000000)">
<path d="M16.1904762,11.936 L16.1904762,14.336 C16.1923266,14.7865161 16.001896,15.2169267 15.6659678,15.5214919 C15.3300396,15.8260571 14.879747,15.9765505 14.4257143,15.936 C11.934675,15.6685126 9.54185647,14.8273156 7.43952381,13.48 C5.48357515,12.2517311 3.82527212,10.6129375 2.58238095,8.68 C1.21426795,6.59296319 0.362863382,4.21679565 0.0971428571,1.744 C0.0562402179,1.29669787 0.207458292,0.853001939 0.513858012,0.521296845 C0.820257732,0.18959175 1.25362391,0.000422952191 1.70809524,0 L4.13666667,0 C4.94931852,-0.00790412572 5.64197687,0.580773986 5.75571429,1.376 C5.85821863,2.14405316 6.04831623,2.89818151 6.32238095,3.624 C6.54478548,4.20870002 6.40253601,4.86784501 5.95809524,5.312 L4.93,6.328 C6.08240205,8.33083666 7.7604629,9.98915562 9.78714286,11.128 L10.8152381,10.112 C11.2646806,9.67278794 11.9316726,9.532212 12.5233333,9.752 C13.2577925,10.0228404 14.0208986,10.2107016 14.7980952,10.312 C15.6121222,10.4254883 16.2108681,11.1238341 16.1904762,11.936 Z" id="Path"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

11
res/img/feather-icons/search-input.svg Normal file
View file

@ -0,0 +1,11 @@
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1378.000000, -91.000000)" stroke="#61708b" stroke-width="1.6">
<g id="search-copy" transform="translate(1379.000000, 92.000000)">
<circle id="Oval" cx="6.22222222" cy="6.22222222" r="6.22222222"></circle>
<path d="M14,14 L10.6166667,10.6166667" id="Path"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 676 B

11
res/img/feather-icons/search.svg Normal file
View file

@ -0,0 +1,11 @@
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1378.000000, -91.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="search-copy" transform="translate(1379.000000, 92.000000)">
<circle id="Oval" cx="6.22222222" cy="6.22222222" r="6.22222222"></circle>
<path d="M14,14 L10.6166667,10.6166667" id="Path"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 676 B

11
res/img/feather-icons/settings.svg Normal file
View file

@ -0,0 +1,11 @@
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1290.000000, -89.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="settings-copy" transform="translate(1291.000000, 90.000000)">
<circle id="Oval" cx="9" cy="9" r="2.45454545"></circle>
<path d="M15.0545455,11.4545455 C14.8317165,11.9594373 14.938637,12.5491199 15.3245455,12.9436364 L15.3736364,12.9927273 C15.6809079,13.2996571 15.85356,13.7161485 15.85356,14.1504545 C15.85356,14.5847606 15.6809079,15.0012519 15.3736364,15.3081818 C15.0667065,15.6154533 14.6502151,15.7881054 14.2159091,15.7881054 C13.781603,15.7881054 13.3651117,15.6154533 13.0581818,15.3081818 L13.0090909,15.2590909 C12.6145745,14.8731825 12.0248919,14.766262 11.52,14.9890909 C11.0254331,15.2010559 10.7039642,15.686474 10.7018182,16.2245455 L10.7018182,16.3636364 C10.7018182,17.267375 9.96919323,18 9.06545455,18 C8.16171586,18 7.42909091,17.267375 7.42909091,16.3636364 L7.42909091,16.29 C7.41612813,15.7358216 7.06571327,15.2458897 6.54545455,15.0545455 C6.04056267,14.8317165 5.45088006,14.938637 5.05636364,15.3245455 L5.00727273,15.3736364 C4.70034285,15.6809079 4.2838515,15.85356 3.84954545,15.85356 C3.41523941,15.85356 2.99874806,15.6809079 2.69181818,15.3736364 C2.38454666,15.0667065 2.21189456,14.6502151 2.21189456,14.2159091 C2.21189456,13.781603 2.38454666,13.3651117 2.69181818,13.0581818 L2.74090909,13.0090909 C3.12681754,12.6145745 3.23373801,12.0248919 3.01090909,11.52 C2.79894413,11.0254331 2.31352603,10.7039642 1.77545455,10.7018182 L1.63636364,10.7018182 C0.732624955,10.7018182 1.81672859e-16,9.96919323 0,9.06545455 C-9.08364293e-17,8.16171586 0.732624955,7.42909091 1.63636364,7.42909091 L1.71,7.42909091 C2.26417842,7.41612813 2.75411031,7.06571327 2.94545455,6.54545455 C3.16828346,6.04056267 3.06136299,5.45088006 2.67545455,5.05636364 L2.62636364,5.00727273 C2.31909211,4.70034285 2.14644002,4.2838515 2.14644002,3.84954545 C2.14644002,3.41523941 2.31909211,2.99874806 2.62636364,2.69181818 C2.93329351,2.38454666 3.34978487,2.21189456 3.78409091,2.21189456 C4.21839695,2.21189456 4.63488831,2.38454666 4.94181818,2.69181818 L4.99090909,2.74090909 C5.38542551,3.12681754 5.97510812,3.23373801 6.48,3.01090909 L6.54545455,3.01090909 C7.04002141,2.79894413 7.36149035,2.31352603 7.36363636,1.77545455 L7.36363636,1.63636364 C7.36363636,0.732624955 8.09626132,1.81672859e-16 9,0 C9.90373868,0 10.6363636,0.732624955 10.6363636,1.63636364 L10.6363636,1.71 C10.6385096,2.24807148 10.9599786,2.73348959 11.4545455,2.94545455 C11.9594373,3.16828346 12.5491199,3.06136299 12.9436364,2.67545455 L12.9927273,2.62636364 C13.2996571,2.31909211 13.7161485,2.14644002 14.1504545,2.14644002 C14.5847606,2.14644002 15.0012519,2.31909211 15.3081818,2.62636364 C15.6154533,2.93329351 15.7881054,3.34978487 15.7881054,3.78409091 C15.7881054,4.21839695 15.6154533,4.63488831 15.3081818,4.94181818 L15.2590909,4.99090909 C14.8731825,5.38542551 14.766262,5.97510812 14.9890909,6.48 L14.9890909,6.54545455 C15.2010559,7.04002141 15.686474,7.36149035 16.2245455,7.36363636 L16.3636364,7.36363636 C17.267375,7.36363636 18,8.09626132 18,9 C18,9.90373868 17.267375,10.6363636 16.3636364,10.6363636 L16.29,10.6363636 C15.7519285,10.6385096 15.2665104,10.9599786 15.0545455,11.4545455 Z" id="Path"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.5 KiB

14
res/img/feather-icons/share.svg Normal file
View file

@ -0,0 +1,14 @@
<svg width="16px" height="18px" viewBox="0 0 16 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1322.000000, -90.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="share-2-copy" transform="translate(1323.000000, 91.000000)">
<ellipse id="Oval" cx="11.6666667" cy="2.4" rx="2.33333333" ry="2.4"></ellipse>
<ellipse id="Oval" cx="2.33333333" cy="8" rx="2.33333333" ry="2.4"></ellipse>
<ellipse id="Oval" cx="11.6666667" cy="13.6" rx="2.33333333" ry="2.4"></ellipse>
<path d="M4.34777778,9.208 L9.66,12.392" id="Path"></path>
<path d="M9.65222222,3.608 L4.34777778,6.792" id="Path"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 954 B

13
res/img/feather-icons/user-add.svg Normal file
View file

@ -0,0 +1,13 @@
<svg width="20px" height="16px" viewBox="0 0 20 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1269.000000, -143.000000)" stroke="#FFFFFF" stroke-width="1.6">
<g id="user-plus-copy" transform="translate(1270.000000, 144.000000)">
<path d="M12.2727273,14 L12.2727273,12.4444444 C12.2727273,10.7262252 10.8074774,9.33333333 9,9.33333333 L3.27272727,9.33333333 C1.46524991,9.33333333 1.81672859e-16,10.7262252 0,12.4444444 L0,14" id="Path"></path>
<ellipse id="Oval" cx="6.13636364" cy="3.11111111" rx="3.27272727" ry="3.11111111"></ellipse>
<path d="M15.5454545,3.88888889 L15.5454545,8.55555556" id="Path"></path>
<path d="M18,6.22222222 L13.0909091,6.22222222" id="Path"></path>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1 KiB

11
res/img/feather-icons/user.svg Normal file
View file

@ -0,0 +1,11 @@
<svg width="15px" height="16px" viewBox="0 0 15 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1406.000000, -91.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="user-copy" transform="translate(1407.000000, 92.000000)">
<path d="M13,14 L13,12.4444444 C13,10.7262252 11.5449254,9.33333333 9.75,9.33333333 L3.25,9.33333333 C1.45507456,9.33333333 0,10.7262252 0,12.4444444 L0,14" id="Path"></path>
<ellipse id="Oval" cx="6.5" cy="3.11111111" rx="3.25" ry="3.11111111"></ellipse>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 797 B

15
res/img/feather-icons/users.svg Normal file
View file

@ -0,0 +1,15 @@
<svg width="20px" height="16px" viewBox="0 0 20 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy-Copy" transform="translate(-78.000000, -813.000000)" stroke="#293042" stroke-width="1.6">
<g id="Buoy-Copy" transform="translate(68.000000, 802.000000)">
<g id="users-copy" transform="translate(11.000000, 12.000000)">
<path d="M13.0909091,14 L13.0909091,12.4444444 C13.0909091,10.7262252 11.6256592,9.33333333 9.81818182,9.33333333 L3.27272727,9.33333333 C1.46524991,9.33333333 1.81672859e-16,10.7262252 0,12.4444444 L0,14" id="Path"></path>
<ellipse id="Oval" cx="6.54545455" cy="3.11111111" rx="3.27272727" ry="3.11111111"></ellipse>
<path d="M18,14 L18,12.4444444 C17.9988875,11.0266471 16.9895445,9.78889348 15.5454545,9.43444444" id="Path"></path>
<path d="M12.2727273,0.101111111 C13.7208394,0.453576501 14.7336899,1.69399311 14.7336899,3.115 C14.7336899,4.53600689 13.7208394,5.7764235 12.2727273,6.12888889" id="Path"></path>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.3 KiB

11
res/img/feather-icons/video.svg Normal file
View file

@ -0,0 +1,11 @@
<svg width="20px" height="13px" viewBox="0 0 20 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="LifeBuoy" transform="translate(-1164.000000, -874.000000)" stroke="#B8BEC9" stroke-width="1.6">
<g id="video-copy" transform="translate(1165.000000, 875.000000)">
<polygon id="Path" points="18 1.57142857 12.2727273 5.5 18 9.42857143"></polygon>
<rect id="Rectangle" x="0" y="0" width="12.2727273" height="11" rx="1.6"></rect>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 707 B

9
res/img/icon-call.svg
View file

@ -1,8 +1,3 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="35" height="35" viewBox="0, 0, 35, 35">
<g id="Symbols">
<path d="M17.5,35 C27.165,35 35,27.165 35,17.5 C35,7.835 27.165,0 17.5,0 C7.835,0 0,7.835 0,17.5 C0,27.165 7.835,35 17.5,35 z" fill="#76CFA6" opacity="0.15" id="Oval-109"/>
<path d="M23,28 C21.195,28 16.807,25.624 13.122,20.524 C9.675,15.755 8,12.309 8,9.99 C8,8.164 9.225,7.293 9.883,6.825 L10.045,6.708 C10.773,6.173 11.903,6 12.337,6 C13.097,6 13.417,6.458 13.611,6.857 C13.776,7.195 15.141,10.212 15.28,10.587 C15.492,11.164 15.422,12.005 14.766,12.488 L14.65,12.571 C14.324,12.804 13.718,13.236 13.634,13.761 C13.594,14.016 13.677,14.283 13.889,14.577 C14.946,16.043 18.32,20.346 18.928,20.931 C19.405,21.389 20.009,21.455 20.42,21.098 C20.846,20.729 21.035,20.511 21.037,20.508 L21.081,20.465 C21.116,20.434 21.449,20.162 21.992,20.162 C22.385,20.162 22.783,20.302 23.178,20.576 C24.201,21.287 26.51,22.876 26.51,22.876 L26.547,22.906 C26.842,23.166 27.269,23.917 26.772,24.893 C26.256,25.907 24.655,28 23,28 L23,28 z" fill-opacity="0" stroke="#76CFA6" stroke-width="1" id="path-1"/>
</g>
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.5201 14.9653C18.3712 14.0417 17.4758 13.6112 16.7039 13.6112C15.7619 13.6112 15.1451 14.2366 14.4929 14.8995L14.2813 15.1131C14.1946 15.1991 14.0855 15.2398 13.9371 15.2398C13.3932 15.2398 12.2251 14.7202 9.75251 12.2469C6.32291 8.81727 6.69205 7.91386 6.88651 7.71874L7.09742 7.5105C8.2904 6.33663 9.32025 5.32278 7.0343 2.47967C6.23424 1.48426 5.45173 1 4.64301 1C3.55248 1 2.71952 1.87696 1.98391 2.65079C1.85901 2.78169 1.73834 2.9097 1.61922 3.0286C0.791599 3.85577 0.793599 5.66391 1.62522 7.86719C2.53951 10.2905 4.34476 12.9269 6.70961 15.2909C10.9237 19.5059 14.9276 21.0015 17.0757 21.0015C17.91 21.0015 18.5656 20.7866 18.9703 20.3802C19.0899 20.2619 19.2172 20.1404 19.3488 20.0161C20.1438 19.2607 21.0449 18.4047 20.9983 17.2741C20.966 16.4939 20.4824 15.7389 19.5201 14.9653Z" stroke="#9FA9BA"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 926 B

27
res/img/icon-invite-people.svg
View file

@ -1,24 +1,5 @@
<?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>9BA71BF4-DC4F-42D2-B2D0-9EAE0F7F8D45</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/Footer" transform="translate(-26.000000, -34.000000)">
<g id="icon_invite_people" transform="translate(26.000000, 34.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" fill="#76CFA6"></path>
<g id="Group-5" transform="translate(8.000000, 9.000000)" stroke="#FFFFFF">
<g id="Group-3" opacity="0.8" transform="translate(14.437500, 3.937500)" stroke-linecap="round">
<path d="M0,3.28125 L6.5625,3.28125" id="Line"></path>
<path d="M3.28125,0 L3.28125,6.5625" id="Line"></path>
</g>
<g id="icons_people_svg">
<path d="M13.78125,15.75 C13.78125,12.1256313 13.7812503,9.1875 7.21875,9.1875 C0.656249741,9.1875 0.65625,12.1256313 0.65625,15.75 C5.21807306,15.75 7.96856689,15.75 13.78125,15.75 Z" id="Oval-40" stroke-linecap="round" stroke-linejoin="round"></path>
<circle id="Oval" cx="7.21875" cy="3.609375" r="3.609375"></circle>
</g>
</g>
</g>
</g>
</g>
<svg width="15" height="14" viewBox="0 0 15 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.9999 3.30001C2.9999 5.02501 4.3499 6.37501 6.0749 6.37501C7.7999 6.45001 9.1499 5.02501 9.1499 3.30001C9.1499 1.57501 7.7999 0.225006 6.0749 0.225006C4.3499 0.225006 2.9999 1.57501 2.9999 3.30001ZM4.1249 3.30001C4.1249 2.25001 5.0249 1.35001 6.0749 1.35001C7.1999 1.35001 8.0249 2.25001 8.0249 3.30001C8.0249 4.35001 7.1249 5.25001 6.0749 5.25001C5.0249 5.25001 4.1249 4.35001 4.1249 3.30001Z" fill="white"/>
<path d="M6.0749 6.97501C9.2249 6.97501 11.7749 9.52501 11.7749 12.675C11.7749 12.975 11.5499 13.275 11.1749 13.275C10.8749 13.275 10.5749 13.05 10.5749 12.675C10.4999 10.2 8.3249 8.25001 5.8499 8.32501C3.4499 8.40001 1.5749 10.35 1.4999 12.675C1.4999 12.975 1.2749 13.275 0.899902 13.275C0.524902 13.275 0.299902 13.05 0.299902 12.675C0.449902 9.52501 2.9249 6.97501 6.0749 6.97501Z" fill="white"/>
<path d="M11.025 6.375C10.725 6.375 10.425 6.15 10.425 5.85C10.425 5.55 10.65 5.25 11.025 5.25H12V4.35C12 4.05 12.225 3.75 12.6 3.75C12.9 3.75 13.2 3.975 13.2 4.35V5.25H14.025C14.325 5.25 14.625 5.475 14.625 5.85C14.625 6.225 14.4 6.375 14.025 6.375H13.125V7.275C13.125 7.575 12.9 7.875 12.525 7.875C12.15 7.875 11.925 7.65 11.925 7.275V6.375H11.025Z" fill="white"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

16
res/img/icon-jump-to-first-unread.svg Normal file
View file

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
style="fill:none"
version="1.1"
viewBox="0 0 18.666187 8.7375818"
height="8.7375822"
width="18.666187">
<defs
id="defs8" />
<path
d="M 17.909095,7.981591 9.3330939,0.74997995 0.75709259,7.981591"
style="fill:none;stroke:#000000;stroke-width:1.29999995;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="path2-8-3" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 559 B

5
res/img/icon_context.svg Normal file
View file

@ -0,0 +1,5 @@
<svg width="3" height="15" viewBox="0 0 3 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 3C2.32843 3 3 2.32843 3 1.5C3 0.671573 2.32843 0 1.5 0C0.671573 0 0 0.671573 0 1.5C0 2.32843 0.671573 3 1.5 3Z" fill="#9FA9BA"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 9C2.32843 9 3 8.32843 3 7.5C3 6.67157 2.32843 6 1.5 6C0.671573 6 0 6.67157 0 7.5C0 8.32843 0.671573 9 1.5 9Z" fill="#9FA9BA"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 15C2.32843 15 3 14.3284 3 13.5C3 12.6716 2.32843 12 1.5 12C0.671573 12 0 12.6716 0 13.5C0 14.3284 0.671573 15 1.5 15Z" fill="#9FA9BA"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 655 B

3
res/img/icon_context_copy.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.79652 0.0898895H10.9556C11.4444 0.0898895 11.842 0.487424 11.842 0.976253V2.15807H13.0238C13.5126 2.15807 13.9102 2.55561 13.9102 3.04444V12.2035C13.9102 12.6924 13.5126 13.0899 13.0238 13.0899H3.8647C3.37587 13.0899 2.97834 12.6924 2.97834 12.2035V11.0217H1.79652C1.30769 11.0217 0.910156 10.6242 0.910156 10.1353V0.976253C0.910156 0.487424 1.30769 0.0898895 1.79652 0.0898895ZM3.56925 12.2035C3.56925 12.3666 3.70191 12.499 3.8647 12.499H13.0238C13.1866 12.499 13.3192 12.3666 13.3192 12.2035V3.04444C13.3192 2.88134 13.1866 2.74898 13.0238 2.74898H11.842V10.1353C11.842 10.6242 11.4444 11.0217 10.9556 11.0217H3.56925V12.2035ZM1.79652 10.4308C1.63373 10.4308 1.50107 10.2984 1.50107 10.1353V0.976253C1.50107 0.813162 1.63373 0.680799 1.79652 0.680799H10.9556C11.1184 0.680799 11.2511 0.813162 11.2511 0.976253V10.1353C11.2511 10.2984 11.1184 10.4308 10.9556 10.4308H1.79652Z" fill="#212121"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1 KiB

3
res/img/icon_context_edit.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.9071 1.33095L11.669 0.0928571C11.5452 -0.0309524 11.3595 -0.0309524 11.2357 0.0928571L9.47143 1.85714H0.309524C0.12381 1.85714 0 1.98095 0 2.16667V12.6905C0 12.8762 0.12381 13 0.309524 13H10.8333C11.019 13 11.1429 12.8762 11.1429 12.6905V3.52857L12.9071 1.76429C13.031 1.64048 13.031 1.45476 12.9071 1.33095ZM10.5238 12.381H0.619048V2.47619H8.85238L5.66429 5.66429C5.60238 5.72619 5.57143 5.78809 5.57143 5.88095V7.11905C5.57143 7.30476 5.69524 7.42857 5.88095 7.42857H7.11905C7.21191 7.42857 7.27381 7.39762 7.33571 7.33571L10.5238 4.14762V12.381ZM6.19048 6.80952H6.99524L12.2571 1.54762L11.4524 0.742857L6.19048 6.00476V6.80952Z" fill="#9FA9BA"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 805 B

13
res/img/icon_context_fave.svg
View file

@ -1,12 +1,3 @@
<?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="100%" height="100%" viewBox="0 0 15 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
<g transform="matrix(1,0,0,1,-0,-40)">
<g id="icon_context_fave" transform="matrix(0.600982,0,0,0.600982,0,40)">
<g transform="matrix(1.66394,0,0,1.66394,1.66394,2.71716)">
<rect x="0" y="0" width="13" height="13" style="fill:rgb(224,223,224);fill-opacity:0;fill-rule:nonzero;"/>
<path d="M6.572,-0.495C6.614,-0.486 6.625,-0.486 6.666,-0.472C6.793,-0.427 6.884,-0.337 6.948,-0.221L8.742,3.414L12.754,3.997L12.801,4.006C12.88,4.029 12.951,4.062 13.013,4.117C13.161,4.248 13.218,4.459 13.157,4.646C13.132,4.725 13.087,4.789 13.031,4.849L10.128,7.679L10.813,11.674L10.819,11.722C10.821,11.804 10.812,11.882 10.779,11.958C10.7,12.139 10.517,12.259 10.32,12.259C10.237,12.259 10.162,12.236 10.088,12.201L6.5,10.315L2.912,12.201L2.868,12.222C2.791,12.249 2.714,12.264 2.631,12.256C2.435,12.237 2.265,12.1 2.204,11.913C2.178,11.834 2.177,11.756 2.187,11.674L2.872,7.679L-0.031,4.849L-0.064,4.814C-0.114,4.749 -0.152,4.681 -0.17,4.599C-0.213,4.407 -0.135,4.202 0.024,4.087C0.092,4.038 0.166,4.012 0.246,3.997L4.258,3.414L6.052,-0.221L6.075,-0.264C6.099,-0.299 6.104,-0.309 6.134,-0.34C6.211,-0.423 6.316,-0.478 6.428,-0.495C6.477,-0.502 6.523,-0.499 6.572,-0.495ZM5.038,4.092C5.017,4.13 5.013,4.14 4.987,4.174C4.928,4.251 4.847,4.31 4.755,4.342C4.715,4.357 4.704,4.357 4.662,4.365L1.393,4.841L3.758,7.146L3.791,7.182C3.817,7.216 3.825,7.224 3.846,7.261C3.903,7.364 3.916,7.474 3.902,7.589L3.343,10.845L6.267,9.307L6.311,9.287C6.42,9.249 6.531,9.237 6.643,9.271C6.684,9.283 6.694,9.289 6.733,9.307L9.657,10.845L9.098,7.589L9.092,7.541C9.089,7.425 9.113,7.317 9.18,7.22C9.204,7.185 9.213,7.178 9.242,7.146L11.607,4.841L8.338,4.365L8.291,4.356C8.25,4.344 8.239,4.342 8.2,4.324C8.093,4.275 8.018,4.193 7.962,4.092L6.5,1.13C6.013,2.117 5.525,3.105 5.038,4.092Z" style="fill:rgb(205,205,205);fill-rule:nonzero;"/>
</g>
</g>
</g>
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.5 11.75L3.6794 13.7586L4.40907 9.50431L1.31813 6.49139L5.5897 5.87069L7.5 2L9.4103 5.87069L13.6819 6.49139L10.5909 9.50431L11.3206 13.7586L7.5 11.75Z" stroke="#9FA9BA"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 325 B

4
res/img/icon_context_leave.svg Normal file
View file

@ -0,0 +1,4 @@
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.4 1.4L8.6 8.6" stroke="#9FA9BA" stroke-linecap="round"/>
<path d="M8.5999 1.39999L1.3999 8.59999" stroke="#9FA9BA" stroke-linecap="round"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 255 B

3
res/img/icon_context_reply.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="16" height="12" viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.27273 1C9.097 1 8.95455 1.14245 8.95455 1.31818C8.95455 1.37624 8.95455 2.90909 8.95455 2.90909C7.26621 2.90909 5.29264 3.38838 3.71946 4.63423C2.17514 5.85722 1.04106 7.83423 1 10.7045C1 10.7045 1 10.8056 1 10.8636C1 11.0394 1.14245 11.1818 1.31818 11.1818C1.40747 11.1818 1.48817 11.145 1.54595 11.0858C1.60189 11.0285 1.78551 10.7045 1.78551 10.7045C3.78319 7.57078 6.88664 7.36364 8.63636 7.36364H8.95455C8.95455 7.36364 8.95455 8.89648 8.95455 8.95455C8.95455 9.13027 9.097 9.27273 9.27273 9.27273C9.34134 9.27273 9.40489 9.25101 9.45686 9.21407C9.47918 9.1982 14.8483 5.41935 14.9058 5.36237C14.964 5.30471 15 5.22474 15 5.13636C15 5.04073 14.9578 4.95495 14.891 4.89662C14.8351 4.84777 9.54804 1.1354 9.48032 1.07705C9.4246 1.02903 9.35205 1 9.27273 1Z" stroke="#9FA9BA" stroke-width="0.8"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 914 B

26
res/img/icons-apps.svg
View file

@ -1,14 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="35px" height="35px" viewBox="0 0 35 35" enable-background="new 0 0 35 35" xml:space="preserve">
<path id="Oval-109-Copy" opacity="0.15" fill="#76CFA6" enable-background="new " d="M17.5,35C27.165,35,35,27.165,35,17.5
S27.165,0,17.5,0S0,7.835,0,17.5S7.835,35,17.5,35z"/>
<g id="Icon">
<g>
<path fill="none" stroke="#76CFA6" d="M7.5,12.5h5v-5h-5V12.5z M15,27.5h5v-5h-5V27.5z M7.5,27.5h5v-5h-5V27.5z M7.5,20h5v-5h-5
V20z M15,20h5v-5h-5V20z M22.5,7.5v5h5v-5H22.5z M15,12.5h5v-5h-5V12.5z M22.5,20h5v-5h-5V20z M22.5,27.5h5v-5h-5V27.5z"/>
</g>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="35px" height="35px" viewBox="0 0 35 35" enable-background="new 0 0 35 35" xml:space="preserve">
<g id="Icon">
<g>
<path fill="none" stroke="#9FA9BA" d="M7.5,12.5h5v-5h-5V12.5z M15,27.5h5v-5h-5V27.5z M7.5,27.5h5v-5h-5V27.5z M7.5,20h5v-5h-5
V20z M15,20h5v-5h-5V20z M22.5,7.5v5h5v-5H22.5z M15,12.5h5v-5h-5V12.5z M22.5,20h5v-5h-5V20z M22.5,27.5h5v-5h-5V27.5z"/>
</g>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 941 B

After

Width:  |  Height:  |  Size: 750 B

119
res/img/icons-close.svg
View file

@ -1,23 +1,96 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-11 13 24 24" xml:space="preserve">
<style type="text/css">
.st1{fill:none;stroke-width:2;stroke-linecap:round;}
</style>
<title>icons_create_room</title>
<desc>Created with sketchtool.</desc>
<g id="_x30_3-Input" sketch:type="MSPage">
<g id="_x30_3_x5F_4-Uploading" transform="translate(-20.000000, -726.000000)" sketch:type="MSArtboardGroup">
<g id="Room-list" sketch:type="MSLayerGroup">
<g id="Room-list_x2F_Footer" transform="translate(0.000000, 708.000000)" sketch:type="MSShapeGroup">
<g id="icons_create_room" transform="translate(20.000000, 18.000000)">
<circle id="Oval-1-Copy-7" fill="#76CFA6" cx="1" cy="25" r="12"/>
<path id="Line" class="st1" stroke="#FFFFFF" d="M-2.5,28.5l7.1-7.1"/>
<path id="Line_1_" class="st1" stroke="#FFFFFF" d="M-2.5,21.5l7.1,7.1"/>
</g>
</g>
</g>
</g>
</g>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg
xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
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"
version="1.1"
id="Layer_1"
x="0px"
y="0px"
viewBox="-11 13 9.1202002 9.2202005"
xml:space="preserve"
sodipodi:docname="icons-close.svg"
width="9.1202002"
height="9.2202005"
inkscape:version="0.92.3 (2405546, 2018-03-11)"><metadata
id="metadata21"><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>icons_create_room</dc:title></cc:Work></rdf:RDF></metadata><defs
id="defs19" /><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1016"
id="namedview17"
showgrid="false"
showguides="false"
inkscape:zoom="9.8333333"
inkscape:cx="-0.15658729"
inkscape:cy="-1.4622263"
inkscape:window-x="0"
inkscape:window-y="27"
inkscape:window-maximized="1"
inkscape:current-layer="icons_create_room"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0" />
<style
type="text/css"
id="style2">
.st1{fill:none;stroke-width:2;stroke-linecap:round;}
</style>
<title
id="title4">icons_create_room</title>
<desc
id="desc6">Created with sketchtool.</desc>
<g
id="_x30_3-Input"
sketch:type="MSPage"
transform="translate(-7.4898998,-7.3898998)">
<g
id="_x30_3_x5F_4-Uploading"
transform="translate(-20,-726)"
sketch:type="MSArtboardGroup">
<g
id="Room-list"
sketch:type="MSLayerGroup">
<g
id="Room-list_x2F_Footer"
transform="translate(0,708)"
sketch:type="MSShapeGroup">
<g
id="icons_create_room"
transform="translate(20,18)">
<path
id="Line"
class="st1"
d="M -2.5,28.5 4.6,21.4"
style="fill:none;stroke:#454545;stroke-width:2;stroke-linecap:round;stroke-opacity:1"
inkscape:connector-curvature="0" />
<path
id="Line_1_"
class="st1"
d="m -2.5,21.5 7.1,7.1"
style="fill:none;stroke:#454545;stroke-width:2;stroke-linecap:round;stroke-opacity:1"
inkscape:connector-curvature="0" />
</g>
</g>
</g>
</g>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

20
res/img/icons-create-room.svg
View file

@ -1,18 +1,4 @@
<?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 3.8.3 (29802) - http://www.bohemiancoding.com/sketch -->
<title>0F9BCC43-B3A7-4C9F-8E34-1F38194362C2</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Room-list-Copy-3" transform="translate(-21.000000, -726.000000)">
<g id="icons_create_room" transform="translate(21.000000, 726.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-3" opacity="0.8" transform="translate(6.000000, 6.000000)" stroke="#FFFFFF" stroke-linecap="round">
<path d="M0,6.5 L13,6.5" id="Line"></path>
<path d="M6.5,0 L6.5,13" id="Line"></path>
</g>
</g>
</g>
</g>
<svg width="8" height="8" viewBox="4 4 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8 5V11" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
<path d="M11 8H5" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 253 B

34
res/img/icons-files.svg
View file

@ -1,29 +1,5 @@
<?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>
<svg width="15" height="19" viewBox="0 0 15 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.80167 1.34561C8.58197 1.1261 8.27313 1 7.95407 1H3.01704C1.88604 1 1 1.91111 1 3.07424V14.3482C1 15.4874 1.8684 16.4143 2.93589 16.4143H9.99247C11.0392 16.4143 11.9571 15.4866 11.9571 14.4294V4.95051C11.9571 4.65653 11.8216 4.35233 11.5846 4.11536L8.80167 1.34561ZM10.76 4.34286H8.95414C8.70027 4.34286 8.42857 4.18519 8.42857 3.95044V2.02236L10.76 4.34286ZM2.93589 15.6714H9.99247C10.6319 15.6714 11.2143 15.0794 11.2143 14.4294V5.08571H8.95433C8.25474 5.08571 7.68571 4.57649 7.68571 3.95044V1.74286H3.01704C2.3026 1.74286 1.74286 2.32767 1.74286 3.07424V14.3482C1.74286 15.0779 2.27809 15.6714 2.93589 15.6714Z" fill="#9FA9BA"/>
<path d="M8.80167 1.34561L8.73099 1.41635L8.73113 1.41649L8.80167 1.34561ZM11.5846 4.11536L11.6553 4.04465L11.6551 4.04448L11.5846 4.11536ZM10.76 4.34286V4.44286H11.0023L10.8306 4.27198L10.76 4.34286ZM8.42857 2.02236L8.49911 1.95148L8.32857 1.78174V2.02236H8.42857ZM11.2143 5.08571H11.3143V4.98571H11.2143V5.08571ZM7.68571 1.74286H7.78571V1.64286H7.68571V1.74286ZM7.95407 1.1C8.24738 1.1 8.53057 1.2161 8.73099 1.41635L8.87235 1.27487C8.63337 1.0361 8.29888 0.9 7.95407 0.9V1.1ZM3.01704 1.1H7.95407V0.9H3.01704V1.1ZM1.1 3.07424C1.1 1.96369 1.94389 1.1 3.01704 1.1V0.9C1.8282 0.9 0.9 1.85854 0.9 3.07424H1.1ZM1.1 14.3482V3.07424H0.9V14.3482H1.1ZM2.93589 16.3143C1.92966 16.3143 1.1 15.4384 1.1 14.3482H0.9C0.9 15.5364 1.80714 16.5143 2.93589 16.5143V16.3143ZM9.99247 16.3143H2.93589V16.5143H9.99247V16.3143ZM11.8571 14.4294C11.8571 15.4324 10.983 16.3143 9.99247 16.3143V16.5143C11.0954 16.5143 12.0571 15.5409 12.0571 14.4294H11.8571ZM11.8571 4.95051V14.4294H12.0571V4.95051H11.8571ZM11.5139 4.18607C11.7349 4.40711 11.8571 4.68679 11.8571 4.95051H12.0571C12.0571 4.62627 11.9082 4.29755 11.6553 4.04465L11.5139 4.18607ZM8.73113 1.41649L11.5141 4.18624L11.6551 4.04448L8.87221 1.27474L8.73113 1.41649ZM8.95414 4.44286H10.76V4.24286H8.95414V4.44286ZM8.32857 3.95044C8.32857 4.11034 8.42171 4.23581 8.53936 4.31699C8.65675 4.39798 8.8082 4.44286 8.95414 4.44286V4.24286C8.84621 4.24286 8.73488 4.2089 8.65295 4.15237C8.57128 4.09602 8.52857 4.02529 8.52857 3.95044H8.32857ZM8.32857 2.02236V3.95044H8.52857V2.02236H8.32857ZM10.8306 4.27198L8.49911 1.95148L8.35803 2.09323L10.6895 4.41373L10.8306 4.27198ZM9.99247 15.5714H2.93589V15.7714H9.99247V15.5714ZM11.1143 14.4294C11.1143 15.0257 10.5751 15.5714 9.99247 15.5714V15.7714C10.6887 15.7714 11.3143 15.133 11.3143 14.4294H11.1143ZM11.1143 5.08571V14.4294H11.3143V5.08571H11.1143ZM8.95433 5.18571H11.2143V4.98571H8.95433V5.18571ZM7.58571 3.95044C7.58571 4.64187 8.21025 5.18571 8.95433 5.18571V4.98571C8.29924 4.98571 7.78571 4.5111 7.78571 3.95044H7.58571ZM7.58571 1.74286V3.95044H7.78571V1.74286H7.58571ZM3.01704 1.84286H7.68571V1.64286H3.01704V1.84286ZM1.84286 3.07424C1.84286 2.37872 2.36192 1.84286 3.01704 1.84286V1.64286C2.24328 1.64286 1.64286 2.27662 1.64286 3.07424H1.84286ZM1.84286 14.3482V3.07424H1.64286V14.3482H1.84286ZM2.93589 15.5714C2.3428 15.5714 1.84286 15.0326 1.84286 14.3482H1.64286C1.64286 15.1231 2.21337 15.7714 2.93589 15.7714V15.5714Z" fill="#9FA9BA"/>
<path d="M12.0601 17.7143H5.00355C4.60147 17.7143 4.22522 17.5009 3.99716 17.1432C3.88685 16.9701 3.65749 16.9192 3.48422 17.0297C3.31132 17.1401 3.26043 17.3698 3.37093 17.5427C3.73586 18.1152 4.3463 18.4571 5.00355 18.4571H12.0601C13.1115 18.4571 13.9997 17.5596 13.9997 16.4971V7.01826C13.9997 6.71629 13.8686 6.41209 13.6361 6.17976L13.3297 5.88243C13.1824 5.73943 12.9471 5.74314 12.8045 5.89041C12.6617 6.0375 12.6652 6.2728 12.8125 6.41561L13.1148 6.70886C13.2052 6.7993 13.2569 6.91203 13.2569 7.01844V16.4973C13.2569 17.1456 12.6977 17.7143 12.0601 17.7143Z" fill="#9FA9BA" stroke="#9FA9BA" stroke-width="0.2"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

60
res/img/icons-groups-nobg.svg Normal file
View file

@ -0,0 +1,60 @@
<?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"
xml:space="preserve"
viewBox="0 0 25.087629 21.62648"
y="0px"
x="0px"
id="Layer_2"
version="1.1"
width="25.087629"
height="21.62648"><metadata
id="metadata24"><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></dc:title></cc:Work></rdf:RDF></metadata><defs
id="defs22">
</defs>
<style
id="style2"
type="text/css">
.st4{fill:none;stroke-miterlimit:10;}
</style>
<path
style="fill:none;stroke:#000000;stroke-width:1.20877647;stroke-miterlimit:10;stroke-opacity:1"
d="m 19.186977,20.022092 c 0,-3.868085 0,-6.890026 -6.890026,-6.890026 -6.8900252,0 -6.8900252,3.021941 -6.8900252,6.890026 4.8351052,0 7.7361692,0 13.7800512,0 z"
class="st4"
id="path4242_1_" /><circle
style="fill:none;stroke:#000000;stroke-width:1.20877647;stroke-miterlimit:10;stroke-opacity:1"
r="3.8680847"
cy="7.2090473"
cx="12.296951"
class="st4"
id="circle4244_1_" /><path
style="fill:#000000;fill-opacity:1;stroke-width:1.20877647"
id="path8"
d="m 2.3296541,15.626195 c 0,-3.021941 0.362633,-4.835106 5.4394941,-4.835106 0.362633,0 0.7252659,0 0.9670212,0 -0.3626329,-0.362633 -0.7252659,-0.725266 -0.9670212,-1.208776 0,0 0,0 -0.1208776,0 C 1,9.582313 1,12.846009 1,16.230583 v 0.604389 h 3.2636965 c 0.1208776,-0.362633 0.1208776,-0.846144 0.2417553,-1.208777 z" /><path
style="fill:#000000;fill-opacity:1;stroke-width:1.20877647"
id="path10"
d="m 4.9889623,5.1098401 c 0,-1.5714095 1.2087765,-2.7801859 2.7801859,-2.7801859 0.7252659,0 1.3296542,0.2417553 1.8131647,0.6043882 C 9.9449463,2.6922871 10.307579,2.5714095 10.791089,2.3296542 10.065823,1.4835106 8.9779247,1 7.8900259,1 5.7142282,1 3.9010635,2.8131648 3.9010635,4.9889624 c 0,2.1757977 1.6922871,3.8680849 3.8680847,3.9889619 C 7.6482706,8.6152923 7.5273929,8.1317812 7.4065153,7.7691483 5.9559835,7.6482706 4.9889623,6.5603718 4.9889623,5.1098401 Z" /><path
style="fill:#000000;fill-opacity:1;stroke-width:1.20877647"
id="path12"
d="m 24.08763,16.230583 c 0,-3.384574 0,-6.64827 -6.64827,-6.64827 -0.241756,0 -0.362633,0 -0.604389,0 -0.241755,0.48351 -0.604388,0.846143 -0.967021,1.208776 0.483511,0 0.967021,-0.120877 1.57141,-0.120877 5.076861,0 5.439494,1.813164 5.439494,4.835105 H 19.97779 c 0.120878,0.362633 0.241756,0.846144 0.241756,1.208777 h 3.747207 v -0.483511 z" /><path
style="fill:#000000;fill-opacity:1;stroke-width:1.20877647"
id="path14"
d="m 17.43936,2.3296542 c 1.571409,0 2.780186,1.2087764 2.780186,2.7801859 0,1.5714094 -1.208777,2.7801858 -2.780186,2.7801858 0,0 0,0 0,0 0,0.362633 -0.120878,0.8461434 -0.362633,1.2087761 0.120877,0 0.241755,0 0.362633,0 2.175797,0 3.988962,-1.8131643 3.988962,-3.9889619 0,-2.1757977 -1.813165,-3.9889624 -3.988962,-3.9889624 -1.208777,0 -2.296676,0.6043882 -3.021941,1.4505318 0.362632,0.1208776 0.725265,0.3626329 1.087898,0.6043882 0.362633,-0.4835106 1.087899,-0.8461435 1.934043,-0.8461435 z" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.3 KiB

22
res/img/icons-notifications.svg
View file

@ -1,19 +1,3 @@
<?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>
<svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.21862 14.1909C9.12216 14.6245 8.90577 15.013 8.60857 15.3189C8.19404 15.7393 7.6257 16 7 16C6.3743 16 5.80596 15.7393 5.39143 15.3189C5.09423 15.013 4.87784 14.6245 4.78138 14.1909H1.50428C1.08976 14.1909 0.714339 14.018 0.440596 13.7413C0.16946 13.4646 0 13.0788 0 12.6558C0 12.2354 0.16946 11.8497 0.440596 11.573C0.628305 11.3814 0.865549 11.2404 1.12886 11.1713C1.30615 10.6046 1.44953 9.93947 1.55382 9.2717C1.69721 8.38045 1.77281 7.48387 1.77281 6.80811C1.77281 5.33954 2.3594 4.00665 3.30838 3.0409C3.72551 2.61523 4.21043 2.26139 4.74749 1.998C4.81788 1.4872 5.05251 1.0296 5.39143 0.681077C5.80596 0.260725 6.3743 0 7 0C7.6257 0 8.19404 0.260725 8.60857 0.681077C8.94749 1.0296 9.18212 1.4872 9.25251 1.998C9.78957 2.26139 10.2745 2.61523 10.6916 3.0409C11.6406 4.00665 12.2272 5.33954 12.2272 6.80811C12.2272 7.48387 12.3028 8.38045 12.4462 9.2717C12.5505 9.93947 12.6939 10.6046 12.8711 11.1713C13.1345 11.2404 13.3717 11.3814 13.5594 11.573C13.8305 11.8497 14 12.2354 14 12.6558C14 13.0788 13.8305 13.4646 13.5594 13.7413C13.2857 14.018 12.9102 14.1909 12.4957 14.1909H9.21862ZM9.27337 13.1693H12.4957C12.6339 13.1693 12.759 13.1107 12.8503 13.0176C12.9415 12.9245 12.9963 12.7968 12.9963 12.6558C12.9963 12.5175 12.9415 12.3898 12.8503 12.2966C12.759 12.2035 12.6339 12.145 12.4957 12.145H1.50428C1.36611 12.145 1.24097 12.2035 1.14972 12.2966C1.05847 12.3898 1.00372 12.5175 1.00372 12.6558C1.00372 12.7968 1.05847 12.9245 1.14972 13.0176C1.24097 13.1107 1.36611 13.1693 1.50428 13.1693H4.72663H9.27337ZM11.8153 11.1234H2.18473C2.33073 10.5913 2.45065 10.014 2.5419 9.43399C2.69311 8.47888 2.77393 7.52378 2.77393 6.80811C2.77393 5.62421 3.25102 4.54406 4.0175 3.76455C4.78138 2.98237 5.83985 2.49551 7 2.49551C8.16015 2.49551 9.21862 2.98237 9.9825 3.76455C10.749 4.54406 11.2261 5.62421 11.2261 6.80811C11.2261 7.52378 11.3069 8.47888 11.4581 9.43399C11.5493 10.014 11.6693 10.5913 11.8153 11.1234ZM8.04544 1.58297C8.00372 1.51646 7.95419 1.45527 7.89944 1.40206C7.67002 1.16794 7.35195 1.02428 7 1.02428C6.64804 1.02428 6.32998 1.16794 6.10056 1.40206C6.04581 1.45527 5.99628 1.51646 5.95456 1.58031C6.29087 1.51114 6.64283 1.47389 7 1.47389C7.35717 1.47389 7.70912 1.51114 8.04544 1.58297ZM8.17058 14.1909C8.1054 14.3452 8.01155 14.4835 7.89944 14.6006C7.67002 14.8321 7.35196 14.9784 7 14.9784C6.64804 14.9784 6.32998 14.8321 6.10056 14.6006C5.98845 14.4835 5.8946 14.3452 5.83203 14.1909H8.17058Z" fill="#9FA9BA"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

23
res/img/icons-people.svg
View file

@ -1,22 +1,3 @@
<?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>81230A28-D944-4572-B5DB-C03CAA2B1FCA</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<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 width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.6449 12.1357C14.5931 10.8835 13.0722 10.1484 11.4486 10.0964C12.9006 9.25028 13.879 7.67736 13.879 5.87904C13.879 3.18861 11.6904 1 8.99995 1C6.30951 1 4.12091 3.18861 4.12091 5.87904C4.12091 7.67736 5.09934 9.25028 6.55128 10.0964C4.92769 10.1484 3.40678 10.8835 2.35496 12.1357C1.25651 13.4427 0.793788 15.148 1.08545 16.8136L1.14478 17.1526H16.8553L16.9146 16.8136C17.2061 15.148 16.7434 13.4427 15.6449 12.1357Z" stroke="#9FA9BA"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 552 B

30
res/img/icons-room-add.svg
View file

@ -1,23 +1,9 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1"
id="svg4196" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 25 25"
style="enable-background:new 0 0 25 25;" xml:space="preserve">
<style type="text/css">
.st1{opacity:0.7;}
.st2{fill:none;stroke-linecap:round;}
</style>
<g id="icons_people" transform="translate(50.000000, 725.000000)">
<path id="Oval-1-Copy-7" fill="#76CFA6" d="M-37.5-700c6.9,0,12.5-5.6,12.5-12.5S-30.6-725-37.5-725S-50-719.4-50-712.5
S-44.4-700-37.5-700z"/>
<g id="text3879" transform="matrix(1.0243293,0,0,0.97624855,-24.996028,0.15844144)">
<g id="Group-3" transform="translate(14.4375,3.9375)" class="st1">
<path id="Line" class="st2" stroke="#ffffff" d="M-23.2-733.8h4.6"/>
<path id="path3142" class="st2" stroke="#ffffff" d="M-20.9-736.2v4.8"/>
</g>
<path id="path3002" fill="#ffffff" d="M-11.4-731.3l-0.5,2.6h2.2v1h-2.4l-0.7,3.3h-1.1l0.7-3.3
h-2.3l-0.6,3.3h-1.1l0.6-3.3h-2v-1h2.2l0.5-2.6H-18v-1h2.3l0.6-3.4h1.1l-0.6,3.4h2.4l0.7-3.4h1l-0.7,3.4h2v1H-11.4 M-15.3-728.7
h2.3l0.5-2.6h-2.3L-15.3-728.7"/>
</g>
</g>
<svg width="8px" height="8px" viewBox="0 0 8 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Design" stroke="none" stroke-width="1.6" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Add" transform="translate(1.000000, 1.000000)" fill-rule="nonzero" stroke="#FFFFFF">
<path d="M3,0 L3,6" id="Stroke H"></path>
<path d="M3,0 L3,6" id="Stroke V" transform="translate(3.000000, 3.000000) rotate(90.000000) translate(-3.000000, -3.000000) "></path>
</g>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 580 B

28
res/img/icons-room-nobg.svg Normal file
View file

@ -0,0 +1,28 @@
<?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"
xml:space="preserve"
style="enable-background:new 0 0 25 25;"
viewBox="0 0 25 25"
y="0px"
x="0px"
id="Layer_1"
version="1.1"><metadata
id="metadata11"><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></dc:title></cc:Work></rdf:RDF></metadata><defs
id="defs9">
</defs>
<path
style="fill:#9fa9ba;fill-opacity:1;stroke-width:1.24281836"
d="m 16.418416,10.445225 -0.763833,4.003888 h 3.564555 v 1.57729 h -3.819166 l -1.018445,5.095858 H 12.726556 L 13.745,16.026403 H 9.9258345 L 8.9073901,21.122261 H 7.2524182 L 8.2708625,16.026403 H 4.9609188 v -1.57729 H 8.5254735 L 9.416612,10.445225 H 5.9793629 V 8.989265 H 9.6712233 L 10.689667,3.7720766 h 1.782277 L 11.453501,8.989265 h 3.819166 L 16.29111,3.7720766 h 1.654972 L 16.927638,8.989265 h 3.309944 v 1.45596 h -3.819166 m -6.23797,4.125218 h 3.819166 l 0.763832,-4.003888 h -3.819166 l -0.763832,4.003888"
id="path3002" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.3 KiB

10
res/img/icons-search-copy.svg
View file

@ -1,10 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="13" height="13" viewBox="0, 0, 13, 13">
<g id="Symbols">
<g>
<path d="M10.229,5.547 C10.229,8.133 8.133,10.229 5.547,10.229 C2.961,10.229 0.865,8.133 0.865,5.547 C0.865,2.961 2.961,0.865 5.547,0.865 C8.133,0.865 10.229,2.961 10.229,5.547 z" fill-opacity="0" stroke="#76CFA6" stroke-width="1" stroke-linecap="round" id="path-1" opacity="0.7"/>
<path d="M8.824,8.824 L12.135,12.135" fill-opacity="0" stroke="#76CFA6" stroke-width="1" stroke-linecap="round" id="Line" opacity="0.7"/>
</g>
</g>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 776 B

22
res/img/icons-search.svg
View file

@ -1,9 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="35" height="35" viewBox="0, 0, 35, 35">
<g id="Symbols">
<path d="M17.5,35 C27.165,35 35,27.165 35,17.5 C35,7.835 27.165,0 17.5,0 C7.835,0 0,7.835 0,17.5 C0,27.165 7.835,35 17.5,35 z" fill="#76CFA6" opacity="0.15" id="Oval-1-Copy-7"/>
<path d="M22.4,15.4 C22.4,19.266 19.266,22.4 15.4,22.4 C11.534,22.4 8.4,19.266 8.4,15.4 C8.4,11.534 11.534,8.4 15.4,8.4 C19.266,8.4 22.4,11.534 22.4,15.4 z" fill-opacity="0" stroke="#76CFA6" stroke-width="1" stroke-linecap="round" id="path-1" opacity="0.7"/>
<path d="M20.3,20.3 L25.25,25.25" fill-opacity="0" stroke="#76CFA6" stroke-width="1" stroke-linecap="round" id="Line" opacity="0.7"/>
</g>
</svg>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.3 (67297) - http://www.bohemiancoding.com/sketch -->
<title>Shape</title>
<desc>Created with Sketch.</desc>
<g id="agreed" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="matrix-files-list" transform="translate(-96.000000, -71.000000)" fill="#9FA9BA" fill-rule="nonzero">
<g id="1-copy" transform="translate(67.000000, 47.000000)">
<g id="search" transform="translate(17.000000, 16.000000)">
<path d="M27.7960817,22.7689061 L24.2910448,19.2638692 C26.6040192,16.4045943 26.2742638,12.2351072 23.5405883,9.77496046 C20.8069128,7.31481375 16.6258535,7.42483371 14.0253436,10.0253436 C11.4248337,12.6258535 11.3148138,16.8069128 13.7749605,19.5405883 C16.2351072,22.2742638 20.4045943,22.6040192 23.2638692,20.2910448 L26.7689061,23.7960817 C27.0539429,24.0713794 27.5070231,24.0674423 27.7872327,23.7872327 C28.0674423,23.5070231 28.0713794,23.0539429 27.7960817,22.7689061 Z M13.4802761,14.9285199 C13.4778286,12.4654797 15.1281652,10.3071276 17.5057384,9.66391787 C19.8833116,9.02070817 22.3967204,10.0526338 23.6363865,12.1809668 C24.8760525,14.3092997 24.5336194,17.0046354 22.8011317,18.7553664 C22.7924145,18.7633572 22.781518,18.7655365 22.7735272,18.7735272 C22.7655365,18.781518 22.7626308,18.7931409 22.7553664,18.8011317 C21.1935085,20.3473331 18.8551963,20.8029027 16.8271177,19.9561226 C14.799039,19.1093426 13.4789257,17.1262773 13.4802761,14.9285199 Z" id="Shape"/>
</g>
</g>
</g>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 910 B

After

Width:  |  Height:  |  Size: 1.7 KiB

19
res/img/icons-settings-room.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.9 KiB

After

Width:  |  Height:  |  Size: 23 KiB

2
res/img/icons-share.svg
View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 481.6 481.6" style="enable-background:new 0 0 481.6 481.6;" xml:space="preserve" width="16px" height="16px">
<g>
<path stroke="#76CFA6" stroke-width="5" d="M381.6,309.4c-27.7,0-52.4,13.2-68.2,33.6l-132.3-73.9c3.1-8.9,4.8-18.5,4.8-28.4c0-10-1.7-19.5-4.9-28.5l132.2-73.8 c15.7,20.5,40.5,33.8,68.3,33.8c47.4,0,86.1-38.6,86.1-86.1S429,0,381.5,0s-86.1,38.6-86.1,86.1c0,10,1.7,19.6,4.9,28.5 l-132.1,73.8c-15.7-20.6-40.5-33.8-68.3-33.8c-47.4,0-86.1,38.6-86.1,86.1s38.7,86.1,86.2,86.1c27.8,0,52.6-13.3,68.4-33.9 l132.2,73.9c-3.2,9-5,18.7-5,28.7c0,47.4,38.6,86.1,86.1,86.1s86.1-38.6,86.1-86.1S429.1,309.4,381.6,309.4z M381.6,27.1 c32.6,0,59.1,26.5,59.1,59.1s-26.5,59.1-59.1,59.1s-59.1-26.5-59.1-59.1S349.1,27.1,381.6,27.1z M100,299.8 c-32.6,0-59.1-26.5-59.1-59.1s26.5-59.1,59.1-59.1s59.1,26.5,59.1,59.1S132.5,299.8,100,299.8z M381.6,454.5 c-32.6,0-59.1-26.5-59.1-59.1c0-32.6,26.5-59.1,59.1-59.1s59.1,26.5,59.1,59.1C440.7,428,414.2,454.5,381.6,454.5z" fill="#76cfa6"/>
<path stroke="#9FA9BA" stroke-width="5" d="M381.6,309.4c-27.7,0-52.4,13.2-68.2,33.6l-132.3-73.9c3.1-8.9,4.8-18.5,4.8-28.4c0-10-1.7-19.5-4.9-28.5l132.2-73.8 c15.7,20.5,40.5,33.8,68.3,33.8c47.4,0,86.1-38.6,86.1-86.1S429,0,381.5,0s-86.1,38.6-86.1,86.1c0,10,1.7,19.6,4.9,28.5 l-132.1,73.8c-15.7-20.6-40.5-33.8-68.3-33.8c-47.4,0-86.1,38.6-86.1,86.1s38.7,86.1,86.2,86.1c27.8,0,52.6-13.3,68.4-33.9 l132.2,73.9c-3.2,9-5,18.7-5,28.7c0,47.4,38.6,86.1,86.1,86.1s86.1-38.6,86.1-86.1S429.1,309.4,381.6,309.4z M381.6,27.1 c32.6,0,59.1,26.5,59.1,59.1s-26.5,59.1-59.1,59.1s-59.1-26.5-59.1-59.1S349.1,27.1,381.6,27.1z M100,299.8 c-32.6,0-59.1-26.5-59.1-59.1s26.5-59.1,59.1-59.1s59.1,26.5,59.1,59.1S132.5,299.8,100,299.8z M381.6,454.5 c-32.6,0-59.1-26.5-59.1-59.1c0-32.6,26.5-59.1,59.1-59.1s59.1,26.5,59.1,59.1C440.7,428,414.2,454.5,381.6,454.5z" fill="#9FA9BA"/>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

6
res/img/icons-stickers.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.0002 22.6666C17.8912 22.6666 22.6668 17.891 22.6668 12C22.6668 6.10894 17.8912 1.33331 12.0002 1.33331C6.10913 1.33331 1.3335 6.10894 1.3335 12C1.3335 17.891 6.10913 22.6666 12.0002 22.6666Z" stroke="#9FA9BA"/>
<path d="M8.66683 9.99998C9.40321 9.99998 10.0002 9.40303 10.0002 8.66665C10.0002 7.93027 9.40321 7.33331 8.66683 7.33331C7.93045 7.33331 7.3335 7.93027 7.3335 8.66665C7.3335 9.40303 7.93045 9.99998 8.66683 9.99998Z" fill="#9FA9BA"/>
<path d="M16.0003 9.99998C16.7367 9.99998 17.3337 9.40303 17.3337 8.66665C17.3337 7.93027 16.7367 7.33331 16.0003 7.33331C15.2639 7.33331 14.667 7.93027 14.667 8.66665C14.667 9.40303 15.2639 9.99998 16.0003 9.99998Z" fill="#9FA9BA"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.3335 14.6666C7.65072 16.9899 9.65575 18.7085 12.0002 18.6666C14.3446 18.7085 16.3496 16.9899 16.6668 14.6666H7.3335V14.6666Z" stroke="#9FA9BA" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

13
res/img/icons-upload.svg
View file

@ -1,12 +1,3 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="35" height="35" viewBox="0, 0, 35, 35">
<g id="Symbols">
<path d="M17.5,35 C27.165,35 35,27.165 35,17.5 C35,7.835 27.165,0 17.5,0 C7.835,0 0,7.835 0,17.5 C0,27.165 7.835,35 17.5,35 z" fill="#76CFA6" opacity="0.15" id="Oval-109-Copy"/>
<g id="file">
<path d="M10,10.01 C10,7.795 11.782,6 14.004,6 L18.402,6 C18.402,6 25,12.492 25,12.492 L25,24.006 C25,26.212 23.206,28 21,28 L14,28 C11.791,28 10,26.2 10,23.99 L10,10.01 z" fill-opacity="0" stroke="#76CFA6" stroke-width="1" id="path-1"/>
<path d="M25,13 L20.157,13 C18.966,13 18,12.034 18,10.843 L18,6" fill-opacity="0" stroke="#76CFA6" stroke-width="1" id="path-3"/>
</g>
<path d="M21.479,19.066 C21.612,19.066 21.746,19.015 21.848,18.912 C22.051,18.706 22.051,18.374 21.848,18.168 L17.871,14.154 C17.668,13.948 17.338,13.949 17.135,14.153 L13.153,18.162 C12.95,18.367 12.949,18.701 13.152,18.906 C13.355,19.113 13.685,19.113 13.888,18.908 L16.987,15.788 L16.988,24.474 C16.988,24.764 17.222,25 17.509,25 C17.798,25 18.03,24.764 18.03,24.474 L18.029,15.801 L21.111,18.912 C21.212,19.015 21.345,19.066 21.479,19.066 L21.479,19.066 z" fill="#76CFA6" id="Fill-75"/>
</g>
<svg width="19" height="21" viewBox="0 0 19 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.95442 20.5157C4.38461 20.5157 2.89601 19.8932 1.75926 18.7835C0.622507 17.6738 0 16.1852 0 14.6425C0 13.1538 0.568376 11.7735 1.62393 10.745L11.2322 1.27208C12.0442 0.460114 13.1538 0 14.3447 0C15.6168 0 16.8348 0.48718 17.6738 1.29915C18.5128 2.13818 19 3.35613 19 4.60114C19 5.79202 18.5399 6.87464 17.7009 7.68661L9.52707 15.7792C8.93162 16.3746 8.11966 16.6994 7.28063 16.6994C6.41453 16.6994 5.54843 16.3476 4.92593 15.7251C4.30342 15.1026 3.9245 14.2635 3.9245 13.3974C3.9245 12.5584 4.27635 11.7464 4.87179 11.151L11.3675 4.73647L12.3148 5.71083L5.81909 12.1254C5.46724 12.4501 5.27778 12.9103 5.27778 13.3974C5.27778 13.9117 5.4943 14.3989 5.87322 14.7778C6.25214 15.1567 6.76638 15.3462 7.28063 15.3462C7.76781 15.3462 8.25499 15.1567 8.57977 14.8319L16.7536 6.73932C17.3219 6.17094 17.6467 5.44017 17.6467 4.62821C17.6467 3.73504 17.2949 2.86895 16.6994 2.2735C16.104 1.70513 15.2379 1.35328 14.3177 1.35328C13.5057 1.35328 12.7208 1.67806 12.1524 2.21937L2.54416 11.6923C1.75926 12.4772 1.32621 13.5057 1.32621 14.6154C1.32621 15.8063 1.81339 16.943 2.67949 17.8091C3.54558 18.6752 4.7094 19.1624 5.92735 19.1624C7.0641 19.1624 8.11966 18.7293 8.90456 17.9444L16.8348 10.1225L17.7821 11.0969L17.1595 11.7194L9.87892 18.9188C8.85043 19.9473 7.44302 20.5157 5.95442 20.5157Z" fill="#9FA9BA"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

21
res/img/icons-video.svg
View file

@ -1,20 +1,3 @@
<?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>05D354CE-86A7-4B6F-B9BE-F1CEBBD81B21</title>
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Extra-icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Extra-icons-sheet" transform="translate(-542.000000, -366.000000)">
<g id="icons_video" transform="translate(542.000000, 366.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-109-Copy-2" fill="#76CFA6" opacity="0.15"></path>
<g transform="translate(9.000000, 11.500000)" id="Rectangle-20-+-Path-16" stroke="#76CFA6">
<g transform="scale(1.0, 0.8)">
<rect id="Rectangle-20" x="0" y="0" width="13" height="17" rx="4"></rect>
<path d="M13,8.50795206 C13,11.2533934 15.8192656,12.6412404 15.8192656,12.6412404 C16.8995921,13.391019 17.7753697,12.9258617 17.7753697,11.6159552 L17.7753697,5.39994895 C17.7753697,4.08392094 16.8771592,3.5920349 15.8192656,4.37466376 C15.8192656,4.37466376 13,5.76251076 13,8.50795206 Z" id="Path-16"></path>
</g>
</g>
</g>
</g>
</g>
<svg width="28" height="17" viewBox="0 0 28 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M26.5913 3.14189C26.3386 3.00069 26.0296 3.00866 25.7844 3.15994L21.5086 5.80347V4.12871C21.5086 2.40351 20.1045 1 18.3793 1H4.12871C2.40351 1 1 2.40351 1 4.12871V12.9038C1 14.629 2.40351 16.032 4.12871 16.032H18.3799C20.1051 16.032 21.5091 14.629 21.5091 12.9038V11.2285L25.7849 13.8721C25.9129 13.9506 26.0583 13.9915 26.2038 13.9915C26.337 13.9915 26.4708 13.9575 26.5913 13.8912C26.8434 13.75 27 13.4835 27 13.1953V3.83728C26.9995 3.54851 26.8429 3.28256 26.5913 3.14189Z" stroke="#9FA9BA"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 608 B

38
res/img/maximise.svg
View file

@ -1,19 +1,19 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-254 253 10 16"
style="enable-background:new -254 253 10 16;" xml:space="preserve">
<title>minimise</title>
<desc>Created with sketchtool.</desc>
<g id="_x30_2-Chat" sketch:type="MSPage">
<g id="_x30_2_x5F_1-Chat-collapsed-w-topic" transform="translate(-176.000000, -27.000000)" sketch:type="MSArtboardGroup">
<g id="Room-list" sketch:type="MSLayerGroup">
<g id="Room-list_x2F_Header" sketch:type="MSShapeGroup">
<g id="minimise" transform="translate(172.000000, 25.000000)">
<path id="Path-53-Copy" fill="none" stroke-width="2" stroke="#76CFA6" d="M-248.7,256.3l5.7,5.7l-5.7,5.7"/>
</g>
</g>
</g>
</g>
</g>
</svg>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-254 253 10 16"
style="enable-background:new -254 253 10 16;" xml:space="preserve">
<title>minimise</title>
<desc>Created with sketchtool.</desc>
<g id="_x30_2-Chat" sketch:type="MSPage">
<g id="_x30_2_x5F_1-Chat-collapsed-w-topic" transform="translate(-176.000000, -27.000000)" sketch:type="MSArtboardGroup">
<g id="Room-list" sketch:type="MSLayerGroup">
<g id="Room-list_x2F_Header" sketch:type="MSShapeGroup">
<g id="minimise" transform="translate(172.000000, 25.000000)">
<path id="Path-53-Copy" fill="none" stroke-width="2" stroke="#9FA9BA" d="M-248.7,256.3l5.7,5.7l-5.7,5.7"/>
</g>
</g>
</g>
</g>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 987 B

After

Width:  |  Height:  |  Size: 968 B

2
res/img/minimise.svg
View file

@ -5,7 +5,7 @@
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="02-Chat" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="02_1-Chat-collapsed-w-topic" sketch:type="MSArtboardGroup" transform="translate(-176.000000, -27.000000)" stroke-width="2" stroke="#76CFA6">
<g id="02_1-Chat-collapsed-w-topic" sketch:type="MSArtboardGroup" transform="translate(-176.000000, -27.000000)" stroke-width="2" stroke="#9FA9BA">
<g id="Room-list" sketch:type="MSLayerGroup">
<g id="Room-list/Header" sketch:type="MSShapeGroup">
<g id="minimise" transform="translate(172.000000, 25.000000)">

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

17
res/img/search.svg
View file

@ -1,17 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="21px" height="19px" viewBox="0 0 21 19" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: bin/sketchtool 1.4 (305) - http://www.bohemiancoding.com/sketch -->
<title>icons_search</title>
<desc>Created with bin/sketchtool.</desc>
<defs></defs>
<g id="02-Chat" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="02_13-Chat-member-profile" sketch:type="MSArtboardGroup" transform="translate(-910.000000, -34.000000)" stroke="#76CFA6">
<g id="icons_search" sketch:type="MSLayerGroup" transform="translate(906.000000, 30.000000)">
<path d="M17.328421,15.3333333 L23.5542961,20.7357275 C23.9574623,21.085568 24.0116667,21.70516 23.6700827,22.1261351 L23.6700827,22.1261351 C23.3308636,22.5441955 22.72562,22.5965299 22.3258751,22.2496583 L16.1,16.8472641" id="Rectangle-9" sketch:type="MSShapeGroup"></path>
<g id="search" transform="translate(11.617851, 11.853553) rotate(-45.000000) translate(-11.617851, -11.853553) translate(4.117851, 3.853553)" sketch:type="MSShapeGroup">
<ellipse id="Search" cx="7.64433504" cy="7.90518519" rx="7.1665641" ry="7.41111111"></ellipse>
</g>
</g>
</g>
</g>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.4 KiB

86
res/img/topleft-chevron.svg Normal file
View file

@ -0,0 +1,86 @@
<?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="9.946106"
height="5.5662179"
viewBox="0 0 9.946106 5.5662179"
version="1.1"
id="svg14"
sodipodi:docname="topleft-chevron.svg"
inkscape:version="0.92.3 (2405546, 2018-03-11)">
<metadata
id="metadata18">
<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>dropdown</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="1277"
inkscape:window-height="653"
id="namedview16"
showgrid="false"
fit-margin-top="0.5"
fit-margin-left="0.5"
fit-margin-right="0.5"
fit-margin-bottom="0.5"
inkscape:zoom="35.2"
inkscape:cx="4.6570922"
inkscape:cy="2.9102278"
inkscape:window-x="459"
inkscape:window-y="90"
inkscape:window-maximized="0"
inkscape:current-layer="svg14" />
<!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
<title
id="title2">dropdown</title>
<desc
id="desc4">Created with Sketch.</desc>
<defs
id="defs6" />
<g
id="Page-1"
style="fill:none;fill-rule:evenodd;stroke:none;stroke-width:1;stroke-linecap:round"
transform="translate(-0.3429078,-0.34400861)">
<g
id="matrix-my-stuff-no-lines-message-context-menu-smaller-icons"
transform="translate(-203,-25)"
style="stroke:#61708b;stroke-width:1.6">
<g
id="Group-3"
transform="translate(128,15)">
<g
id="dropdown"
transform="translate(76,11)">
<path
d="M 0.5,0.5 4.3586853,3.7542227"
id="Line-5"
inkscape:connector-curvature="0" />
<path
d="M 8.1319327,0.56042139 4.3586853,3.7542227"
id="Line-5-Copy"
inkscape:connector-curvature="0" />
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
res/img/typing-indicator-2x.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 4.6 KiB

18
res/themes/dark/css/_dark.scss
View file

@ -1,6 +1,6 @@
// typical text (dark-on-white in light skin)
$primary-fg-color: #dddddd;
$primary-fg-color: #212121;
$primary-bg-color: #2d2d2d;
// used for focusing form controls
@ -12,6 +12,7 @@ $light-fg-color: #747474;
// button UI (white-on-green in light skin)
$accent-fg-color: $primary-bg-color;
$accent-color: #76CFA6;
$accent-color-alt: $accent-color;
$accent-color-50pct: #76CFA67F;
$selection-fg-color: $primary-fg-color;
@ -63,6 +64,10 @@ $primary-hairline-color: #474747;
// used for the border of input text fields
$input-border-color: #3a3a3a;
$input-darker-bg-color: #c1c9d6;
$input-darker-fg-color: #9fa9ba;
$button-bg-color: #7ac9a1;
$button-fg-color: white;
// apart from login forms, which have stronger border
$strong-input-border-color: #656565;
@ -73,9 +78,11 @@ $input-fg-color: $primary-fg-color;
// context menus
$menu-border-color: rgba(187, 187, 187, 0.5);
$menu-bg-color: #373737;
$menu-selected-color: #f5f8fa;
$avatar-initial-color: #2d2d2d;
$avatar-bg-color: #ffffff;
$menu-selected-color: #f5f8fa;
$h3-color: $primary-fg-color;
@ -108,6 +115,15 @@ $roomtile-name-color: rgba(186, 186, 186, 0.8);
$roomtile-selected-bg-color: #333;
$roomtile-focused-bg-color: rgba(255, 255, 255, 0.2);
$username-variant1-color: #1e7ddc;
$username-variant2-color: #a756a8;
$username-variant3-color: #7ac9a1;
$username-variant4-color: #f2809d;
$username-variant5-color: #ffc666;
$username-variant6-color: #76ddd7;
$username-variant7-color: #45529b;
$username-variant8-color: #bfd251;
$roomsublist-background: rgba(0, 0, 0, 0.2);
$roomsublist-label-fg-color: $h3-color;
$roomsublist-label-bg-color: $tertiary-accent-color;

322
res/themes/dharma/css/_dharma.scss Normal file
View file

@ -0,0 +1,322 @@
@import "_fonts.scss";
// XXX: check this?
/* Nunito lacks combining diacritics, so these will fall through
to the next font. Helevetica's diacritics however do not combine
nicely with Open Sans (on OSX, at least) and result in a huge
horizontal mess. Arial empirically gets it right, hence prioritising
Arial here. */
$font-family: 'Nunito', Arial, Helvetica, Sans-Serif;
// typical text (dark-on-white in light skin)
$primary-fg-color: #454545;
$primary-bg-color: #ffffff;
// used for dialog box text
$light-fg-color: #747474;
// used for focusing form controls
$focus-bg-color: #dddddd;
// button UI (white-on-green in light skin)
$accent-fg-color: #ffffff;
$accent-color: #7ac9a1;
$accent-color-50pct: #92caad;
$accent-color-alt: #238CF5;
$selection-fg-color: $primary-bg-color;
$focus-brightness: 105%;
// red warning colour
$warning-color: #f56679;
// background colour for warnings
$warning-bg-color: #DF2A8B;
$info-bg-color: #2A9EDF;
$mention-user-pill-bg-color: $warning-color;
$other-user-pill-bg-color: rgba(0, 0, 0, 0.1);
// pinned events indicator
$pinned-unread-color: #ff0064; // $warning-color
$pinned-color: #888;
// informational plinth
$info-plinth-bg-color: #f7f7f7;
$info-plinth-fg-color: #888;
$preview-bar-bg-color: #f7f7f7;
// left-panel style muted accent color
$secondary-accent-color: #f2f5f8;
$tertiary-accent-color: #d3efe1;
$tagpanel-bg-color: #2e3649;
// used by RoomDirectory permissions
$plinth-bg-color: $secondary-accent-color;
// used by RoomDropTarget
$droptarget-bg-color: rgba(255,255,255,0.5);
// used by AddressSelector
$selected-color: $secondary-accent-color;
// selected for hoverover & selected event tiles
$event-selected-color: #f7f7f7;
// used for the hairline dividers in RoomView
$primary-hairline-color: #e5e5e5;
// used for the border of input text fields
$input-border-color: #f0f0f0;
$input-darker-bg-color: rgba(193, 201, 214, 0.29);
$input-darker-fg-color: #9fa9ba;
$input-lighter-bg-color: #f2f5f8;
$input-lighter-fg-color: $input-darker-fg-color;
$button-bg-color: #7ac9a1;
$button-fg-color: white;
// apart from login forms, which have stronger border
$strong-input-border-color: #c7c7c7;
// used for UserSettings EditableText
$input-underline-color: rgba(151, 151, 151, 0.5);
$input-fg-color: rgba(74, 74, 74, 0.9);
// context menus
$menu-border-color: #ebedf8;
$menu-bg-color: #fff;
$menu-selected-color: #f5f8fa;
$avatar-initial-color: #ffffff;
$avatar-bg-color: #ffffff;
$h3-color: #3d3b39;
$dialog-background-bg-color: #e9e9e9;
$lightbox-background-bg-color: #000;
$imagebody-giflabel: rgba(0, 0, 0, 0.7);
$imagebody-giflabel-border: rgba(0, 0, 0, 0.2);
$greyed-fg-color: #888;
$neutral-badge-color: #dbdbdb;
$preview-widget-bar-color: #ddd;
$preview-widget-fg-color: $greyed-fg-color;
$blockquote-bar-color: #ddd;
$blockquote-fg-color: #777;
$settings-grey-fg-color: #a2a2a2;
$voip-decline-color: #f48080;
$voip-accept-color: #80f480;
$rte-bg-color: #e9e9e9;
$rte-code-bg-color: rgba(0, 0, 0, 0.04);
$rte-room-pill-color: #aaa;
$rte-group-pill-color: #aaa;
$topleftmenu-color: #212121;
$roomheader-color: #45474a;
$roomheader-addroom-color: #91A1C0;
$roomtopic-color: #9fa9ba;
$eventtile-meta-color: $roomtopic-color;
// ********************
$roomtile-name-color: #61708b;
$roomtile-selected-color: #212121;
$roomtile-notified-color: #212121;
$roomtile-selected-bg-color: #fff;
$roomtile-focused-bg-color: #fff;
$username-variant1-color: #1e7ddc;
$username-variant2-color: #a756a8;
$username-variant3-color: #7ac9a1;
$username-variant4-color: #f2809d;
$username-variant5-color: #ffc666;
$username-variant6-color: #76ddd7;
$username-variant7-color: #45529b;
$username-variant8-color: #bfd251;
$roomtile-transparent-focused-color: rgba(0, 0, 0, 0.1);
$roomsublist-background: $secondary-accent-color;
$roomsublist-label-fg-color: $roomtile-name-color;
$roomsublist-label-bg-color: $tertiary-accent-color;
$roomsublist-chevron-color: $accent-color;
$panel-divider-color: #dee1f3;
// ********************
$widget-menu-bar-bg-color: $tertiary-accent-color;
// ********************
// event tile lifecycle
$event-encrypting-color: #abddbc;
$event-sending-color: #ddd;
$event-notsent-color: #f44;
// event redaction
$event-redacted-fg-color: #e2e2e2;
$event-redacted-border-color: #cccccc;
// event timestamp
$event-timestamp-color: #acacac;
$edit-button-url: "../../img/icon_context_message.svg";
$copy-button-url: "../../img/icon_copy_message.svg";
// e2e
$e2e-verified-color: #76cfa5; // N.B. *NOT* the same as $accent-color
$e2e-unverified-color: #e8bf37;
$e2e-warning-color: #ba6363;
/*** ImageView ***/
$lightbox-bg-color: #454545;
$lightbox-fg-color: #ffffff;
$lightbox-border-color: #ffffff;
// unused?
$progressbar-color: #000;
/*** form elements ***/
// .mx_textinput is a container for a text input
// + some other controls like buttons, ...
// it has the appearance of a text box so the controls
// appear to be part of the input
.mx_MatrixChat {
:not(.mx_textinput) > input[type=text],
:not(.mx_textinput) > input[type=search],
.mx_textinput {
display: block;
margin: 9px;
box-sizing: border-box;
background-color: transparent;
color: $input-darker-fg-color;
border-radius: 4px;
border: 1px solid #c1c1c1;
flex: 0 0 auto;
}
.mx_textinput {
display: flex;
align-items: center;
> input[type=text],
> input[type=search] {
border: none;
flex: 1;
color: $primary-fg-color;
},
input::placeholder {
color: $roomsublist-label-fg-color;
}
}
}
input[type=text],
input[type=search],
input[type=password] {
padding: 9px;
font-family: $font-family;
font-size: 14px;
font-weight: 600;
min-width: 0;
}
/*** panels ***/
.dark-panel {
background-color: $secondary-accent-color;
}
.dark-panel {
:not(.mx_textinput) > input[type=text],
:not(.mx_textinput) > input[type=search],
.mx_textinput {
color: $input-darker-fg-color;
background-color: $input-darker-bg-color;
border: none;
}
}
.light-panel {
:not(.mx_textinput) > input[type=text],
:not(.mx_textinput) > input[type=search],
.mx_textinput {
color: $input-lighter-fg-color;
background-color: $input-lighter-bg-color;
border: none;
}
}
input[type=text].mx_textinput_icon,
input[type=search].mx_textinput_icon {
padding-left: 36px;
background-repeat: no-repeat;
background-position: 10px center;
}
// FIXME THEME - Tint by CSS rather than referencing a duplicate asset
input[type=text].mx_textinput_icon.mx_textinput_search,
input[type=search].mx_textinput_icon.mx_textinput_search {
background-image: url('../../img/feather-icons/search-input.svg');
}
// dont search UI as not all browsers support it,
// we implement it ourselves where needed instead
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
display: none;
}
.input[type=text]::-webkit-input-placeholder,
.input[type=text]::-moz-placeholder,
.input[type=search]::-webkit-input-placeholder,
.input[type=search]::-moz-placeholder {
color: #a5aab2;
}
// ***** Mixins! *****
@define-mixin mx_DialogButton {
/* align images in buttons (eg spinners) */
vertical-align: middle;
border: 0px;
border-radius: 4px;
font-family: $font-family;
font-size: 14px;
color: $button-fg-color;
background-color: $button-bg-color;
width: auto;
padding: 7px;
padding-left: 1.5em;
padding-right: 1.5em;
cursor: pointer;
display: inline-block;
outline: none;
}
@define-mixin mx_DialogButton_hover {
}
@define-mixin mx_DialogButton_danger {
background-color: $accent-color;
}
@define-mixin mx_DialogButton_small {
@mixin mx_DialogButton;
font-size: 15px;
padding: 0px 1.5em 0px 1.5em;
}

64
res/themes/dharma/css/_fonts.scss Normal file
View file

@ -0,0 +1,64 @@
/*
* Nunito.
* Includes extended Latin and Vietnamese character sets
* Current URLs are v9, derived from the contents of
* https://fonts.googleapis.com/css?family=Nunito:400,400i,600,600i,700,700i&subset=latin-ext,vietnamese
*/
/* the 'src' links are relative to the bundle.css, which is in a subdirectory.
*/
@font-face {
font-family: 'Nunito';
font-style: italic;
font-weight: 400;
src: url('../../fonts/Nunito/XRXX3I6Li01BKofIMNaDRss.ttf') format('truetype');
}
@font-face {
font-family: 'Nunito';
font-style: italic;
font-weight: 600;
src: url('../../fonts/Nunito/XRXQ3I6Li01BKofIMN5cYtvKUTo.ttf') format('truetype');
}
@font-face {
font-family: 'Nunito';
font-style: italic;
font-weight: 700;
src: url('../../fonts/Nunito/XRXQ3I6Li01BKofIMN44Y9vKUTo.ttf') format('truetype');
}
@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 400;
src: url('../../fonts/Nunito/XRXV3I6Li01BKofINeaE.ttf') format('truetype');
}
@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 600;
src: url('../../fonts/Nunito/XRXW3I6Li01BKofA6sKUYevN.ttf') format('truetype');
}
@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 700;
src: url('../../fonts/Nunito/XRXW3I6Li01BKofAjsOUYevN.ttf') format('truetype');
}
/*
* Fira Mono
* Used for monospace copy, i.e. code
*/
@font-face {
font-family: 'Fira Mono';
src: url('../../fonts/Fira_Mono/FiraMono-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Fira Mono';
src: url('../../fonts/Fira_Mono/FiraMono-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}

3
res/themes/dharma/css/dharma.scss Normal file
View file

@ -0,0 +1,3 @@
@import "_dharma.scss";
@import "../../../../res/css/_components.scss";

26
res/themes/light/css/_base.scss
View file

@ -1,3 +1,5 @@
@import "_fonts.scss";
/* Open Sans lacks combining diacritics, so these will fall through
to the next font. Helevetica's diacritics however do not combine
nicely with Open Sans (on OSX, at least) and result in a huge
@ -18,6 +20,7 @@ $focus-bg-color: #dddddd;
// button UI (white-on-green in light skin)
$accent-fg-color: #ffffff;
$accent-color: #76CFA6;
$accent-color-alt: $accent-color;
$accent-color-50pct: #76CFA67F;
$selection-fg-color: $primary-bg-color;
@ -46,6 +49,8 @@ $preview-bar-bg-color: #f7f7f7;
$secondary-accent-color: #eaf5f0;
$tertiary-accent-color: #d3efe1;
$tagpanel-bg-color: $tertiary-accent-color;
// used by RoomDirectory permissions
$plinth-bg-color: $secondary-accent-color;
@ -64,6 +69,10 @@ $primary-hairline-color: #e5e5e5;
// used for the border of input text fields
$input-border-color: #f0f0f0;
$input-darker-bg-color: #c1c9d6;
$input-darker-fg-color: #9fa9ba;
$button-bg-color: #7ac9a1;
$button-fg-color: white;
// apart from login forms, which have stronger border
$strong-input-border-color: #c7c7c7;
@ -74,6 +83,7 @@ $input-fg-color: rgba(74, 74, 74, 0.9);
// context menus
$menu-border-color: rgba(187, 187, 187, 0.5);
$menu-bg-color: #f6f6f6;
$menu-selected-color: #f5f8fa;
$avatar-initial-color: #ffffff;
$avatar-bg-color: #ffffff;
@ -103,12 +113,28 @@ $rte-code-bg-color: rgba(0, 0, 0, 0.04);
$rte-room-pill-color: #aaa;
$rte-group-pill-color: #aaa;
$topleftmenu-color: $primary-fg-color;
$roomheader-color: $primary-fg-color;
$roomheader-addroom-color: $primary-bg-color;
$roomtopic-color: $settings-grey-fg-color;
$eventtile-meta-color: $roomtopic-color;
// ********************
$roomtile-name-color: rgba(69, 69, 69, 0.8);
$roomtile-selected-color: $roomtile-name-color;
$roomtile-notified-color: $roomtile-name-color;
$roomtile-selected-bg-color: rgba(255, 255, 255, 0.8);
$roomtile-focused-bg-color: rgba(255, 255, 255, 0.9);
$username-variant1-color: #1e7ddc;
$username-variant2-color: #a756a8;
$username-variant3-color: #7ac9a1;
$username-variant4-color: #f2809d;
$username-variant5-color: #ffc666;
$username-variant6-color: #76ddd7;
$username-variant7-color: #45529b;
$username-variant8-color: #bfd251;
$roomtile-transparent-focused-color: rgba(0, 0, 0, 0.1);
$roomsublist-background: rgba(0, 0, 0, 0.05);

0
res/css/_fonts.scss → res/themes/light/css/_fonts.scss
View file

30
scripts/fetchdep.sh
View file

@ -1,7 +1,5 @@
#!/bin/sh
set -e
org="$1"
repo="$2"
defbranch="$3"
@ -10,16 +8,20 @@ defbranch="$3"
rm -r "$repo" || true
curbranch="$TRAVIS_PULL_REQUEST_BRANCH"
[ -z "$curbranch" ] && curbranch="$TRAVIS_BRANCH"
[ -z "$curbranch" ] && curbranch=`"echo $GIT_BRANCH" | sed -e 's/^origin\///'` # jenkins
clone() {
branch=$1
if [ -n "$branch" ]
then
echo "Trying to use the branch $branch"
git clone https://github.com/$org/$repo.git $repo --branch "$branch" && exit 0
fi
}
if [ -n "$curbranch" ]
then
echo "Determined branch to be $curbranch"
git clone https://github.com/$org/$repo.git $repo --branch "$curbranch" && exit 0
fi
echo "Checking out default branch $defbranch"
git clone https://github.com/$org/$repo.git $repo --branch $defbranch
# Try the PR author's branch in case it exists on the deps as well.
clone $TRAVIS_PULL_REQUEST_BRANCH
# Try the target branch of the push or PR.
clone $TRAVIS_BRANCH
# Try the current branch from Jenkins.
clone `"echo $GIT_BRANCH" | sed -e 's/^origin\///'`
# Use the default branch as the last resort.
clone $defbranch

1
src/PageTypes.js
View file

@ -20,7 +20,6 @@ export default {
HomePage: "home_page",
RoomView: "room_view",
UserSettings: "user_settings",
CreateRoom: "create_room",
RoomDirectory: "room_directory",
UserView: "user_view",
GroupView: "group_view",

16
src/PhasedRollOut.js
View file

@ -15,21 +15,7 @@ limitations under the License.
*/
import SdkConfig from './SdkConfig';
function hashCode(str) {
let hash = 0;
let i;
let chr;
if (str.length === 0) {
return hash;
}
for (i = 0; i < str.length; i++) {
chr = str.charCodeAt(i);
hash = ((hash << 5) - hash) + chr;
hash |= 0;
}
return Math.abs(hash);
}
import {hashCode} from './utils/FormattingUtils';
export function phasedRollOutExpiredForUser(username, feature, now, rollOutConfig = SdkConfig.get().phasedRollOut) {
if (!rollOutConfig) {

83
src/Presence.js
View file

@ -17,21 +17,33 @@ limitations under the License.
const MatrixClientPeg = require("./MatrixClientPeg");
const dis = require("./dispatcher");
import Timer from './utils/Timer';
// Time in ms after that a user is considered as unavailable/away
const UNAVAILABLE_TIME_MS = 3 * 60 * 1000; // 3 mins
const PRESENCE_STATES = ["online", "offline", "unavailable"];
class Presence {
constructor() {
this._activitySignal = null;
this._unavailableTimer = null;
this._onAction = this._onAction.bind(this);
this._dispatcherRef = null;
}
/**
* Start listening the user activity to evaluate his presence state.
* Any state change will be sent to the Home Server.
*/
start() {
this.running = true;
if (undefined === this.state) {
this._resetTimer();
this.dispatcherRef = dis.register(this._onAction.bind(this));
async start() {
this._unavailableTimer = new Timer(UNAVAILABLE_TIME_MS);
// the user_activity_start action starts the timer
this._dispatcherRef = dis.register(this._onAction);
while (this._unavailableTimer) {
try {
await this._unavailableTimer.finished();
this.setState("unavailable");
} catch(e) { /* aborted, stop got called */ }
}
}
@ -39,13 +51,14 @@ class Presence {
* Stop tracking user activity
*/
stop() {
this.running = false;
if (this.timer) {
clearInterval(this.timer);
this.timer = undefined;
dis.unregister(this.dispatcherRef);
if (this._dispatcherRef) {
dis.unregister(this._dispatcherRef);
this._dispatcherRef = null;
}
if (this._unavailableTimer) {
this._unavailableTimer.abort();
this._unavailableTimer = null;
}
this.state = undefined;
}
/**
@ -56,21 +69,25 @@ class Presence {
return this.state;
}
_onAction(payload) {
if (payload.action === 'user_activity') {
this.setState("online");
this._unavailableTimer.restart();
}
}
/**
* Set the presence state.
* If the state has changed, the Home Server will be notified.
* @param {string} newState the new presence state (see PRESENCE enum)
*/
setState(newState) {
async setState(newState) {
if (newState === this.state) {
return;
}
if (PRESENCE_STATES.indexOf(newState) === -1) {
throw new Error("Bad presence state: " + newState);
}
if (!this.running) {
return;
}
const old_state = this.state;
this.state = newState;
@ -78,42 +95,14 @@ class Presence {
return; // don't try to set presence when a guest; it won't work.
}
const self = this;
MatrixClientPeg.get().setPresence(this.state).done(function() {
try {
await MatrixClientPeg.get().setPresence(this.state);
console.log("Presence: %s", newState);
}, function(err) {
} catch(err) {
console.error("Failed to set presence: %s", err);
self.state = old_state;
});
}
/**
* Callback called when the user made no action on the page for UNAVAILABLE_TIME ms.
* @private
*/
_onUnavailableTimerFire() {
this.setState("unavailable");
}
_onAction(payload) {
if (payload.action === "user_activity") {
this._resetTimer();
this.state = old_state;
}
}
/**
* Callback called when the user made an action on the page
* @private
*/
_resetTimer() {
const self = this;
this.setState("online");
// Re-arm the timer
clearTimeout(this.timer);
this.timer = setTimeout(function() {
self._onUnavailableTimerFire();
}, UNAVAILABLE_TIME_MS);
}
}
module.exports = new Presence();

2
src/Tinter.js
View file

@ -154,6 +154,8 @@ class Tinter {
}
tint(primaryColor, secondaryColor, tertiaryColor) {
return;
// eslint-disable-next-line no-unreachable
this.currentTint[0] = primaryColor;
this.currentTint[1] = secondaryColor;
this.currentTint[2] = tertiaryColor;

116
src/UserActivity.js
View file

@ -15,32 +15,72 @@ limitations under the License.
*/
import dis from './dispatcher';
import Timer from './utils/Timer';
const MIN_DISPATCH_INTERVAL_MS = 500;
const CURRENTLY_ACTIVE_THRESHOLD_MS = 2000;
// important this is larger than the timeouts of timers
// used with UserActivity.timeWhileActive,
// such as READ_MARKER_INVIEW_THRESHOLD_MS,
// READ_MARKER_OUTOFVIEW_THRESHOLD_MS,
// READ_RECEIPT_INTERVAL_MS in TimelinePanel
const CURRENTLY_ACTIVE_THRESHOLD_MS = 2 * 60 * 1000;
/**
* This class watches for user activity (moving the mouse or pressing a key)
* and dispatches the user_activity action at times when the user is interacting
* with the app (but at a much lower frequency than mouse move events)
* and starts/stops attached timers while the user is active.
*/
class UserActivity {
constructor() {
this._attachedTimers = [];
this._activityTimeout = new Timer(CURRENTLY_ACTIVE_THRESHOLD_MS);
this._onUserActivity = this._onUserActivity.bind(this);
this._onDocumentBlurred = this._onDocumentBlurred.bind(this);
this._onPageVisibilityChanged = this._onPageVisibilityChanged.bind(this);
this.lastScreenX = 0;
this.lastScreenY = 0;
}
/**
* Runs the given timer while the user is active, aborting when the user becomes inactive.
* Can be called multiple times with the same already running timer, which is a NO-OP.
* Can be called before the user becomes active, in which case it is only started
* later on when the user does become active.
*/
timeWhileActive(timer) {
// important this happens first
const index = this._attachedTimers.indexOf(timer);
if (index === -1) {
this._attachedTimers.push(timer);
// remove when done or aborted
timer.finished().finally(() => {
const index = this._attachedTimers.indexOf(timer);
if (index !== -1) { // should never be -1
this._attachedTimers.splice(index, 1);
}
// as we fork the promise here,
// avoid unhandled rejection warnings
}).catch((err) => {});
}
if (this.userCurrentlyActive()) {
timer.start();
}
}
/**
* Start listening to user activity
*/
start() {
document.onmousedown = this._onUserActivity.bind(this);
document.onmousemove = this._onUserActivity.bind(this);
document.onkeydown = this._onUserActivity.bind(this);
document.onmousedown = this._onUserActivity;
document.onmousemove = this._onUserActivity;
document.onkeydown = this._onUserActivity;
document.addEventListener("visibilitychange", this._onPageVisibilityChanged);
document.addEventListener("blur", this._onDocumentBlurred);
document.addEventListener("focus", this._onUserActivity);
// can't use document.scroll here because that's only the document
// itself being scrolled. Need to use addEventListener's useCapture.
// also this needs to be the wheel event, not scroll, as scroll is
// fired when the view scrolls down for a new message.
window.addEventListener('wheel', this._onUserActivity.bind(this),
window.addEventListener('wheel', this._onUserActivity,
{ passive: true, capture: true });
this.lastActivityAtTs = new Date().getTime();
this.lastDispatchAtTs = 0;
this.activityEndTimer = undefined;
}
/**
@ -50,8 +90,12 @@ class UserActivity {
document.onmousedown = undefined;
document.onmousemove = undefined;
document.onkeydown = undefined;
window.removeEventListener('wheel', this._onUserActivity.bind(this),
window.removeEventListener('wheel', this._onUserActivity,
{ passive: true, capture: true });
document.removeEventListener("visibilitychange", this._onPageVisibilityChanged);
document.removeEventListener("blur", this._onDocumentBlurred);
document.removeEventListener("focus", this._onUserActivity);
}
/**
@ -60,10 +104,22 @@ class UserActivity {
* @returns {boolean} true if user is currently/very recently active
*/
userCurrentlyActive() {
return this.lastActivityAtTs > new Date().getTime() - CURRENTLY_ACTIVE_THRESHOLD_MS;
return this._activityTimeout.isRunning();
}
_onUserActivity(event) {
_onPageVisibilityChanged(e) {
if (document.visibilityState === "hidden") {
this._activityTimeout.abort();
} else {
this._onUserActivity(e);
}
}
_onDocumentBlurred() {
this._activityTimeout.abort();
}
async _onUserActivity(event) {
if (event.screenX && event.type === "mousemove") {
if (event.screenX === this.lastScreenX && event.screenY === this.lastScreenY) {
// mouse hasn't actually moved
@ -73,30 +129,20 @@ class UserActivity {
this.lastScreenY = event.screenY;
}
this.lastActivityAtTs = new Date().getTime();
if (this.lastDispatchAtTs < this.lastActivityAtTs - MIN_DISPATCH_INTERVAL_MS) {
this.lastDispatchAtTs = this.lastActivityAtTs;
dis.dispatch({
action: 'user_activity',
});
if (!this.activityEndTimer) {
this.activityEndTimer = setTimeout(this._onActivityEndTimer.bind(this), MIN_DISPATCH_INTERVAL_MS);
}
}
}
_onActivityEndTimer() {
const now = new Date().getTime();
const targetTime = this.lastActivityAtTs + MIN_DISPATCH_INTERVAL_MS;
if (now >= targetTime) {
dis.dispatch({
action: 'user_activity_end',
});
this.activityEndTimer = undefined;
dis.dispatch({action: 'user_activity'});
if (!this._activityTimeout.isRunning()) {
this._activityTimeout.start();
dis.dispatch({action: 'user_activity_start'});
this._attachedTimers.forEach((t) => t.start());
try {
await this._activityTimeout.finished();
} catch (_e) { /* aborted */ }
this._attachedTimers.forEach((t) => t.abort());
} else {
this.activityEndTimer = setTimeout(this._onActivityEndTimer.bind(this), targetTime - now);
this._activityTimeout.restart();
}
}
}
module.exports = new UserActivity();

6
src/WhoIsTyping.js
View file

@ -63,16 +63,16 @@ module.exports = {
if (whoIsTyping.length == 0) {
return '';
} else if (whoIsTyping.length == 1) {
return _t('%(displayName)s is typing', {displayName: whoIsTyping[0].name});
return _t('%(displayName)s is typing …', {displayName: whoIsTyping[0].name});
}
const names = whoIsTyping.map(function(m) {
return m.name;
});
if (othersCount>=1) {
return _t('%(names)s and %(count)s others are typing', {names: names.slice(0, limit - 1).join(', '), count: othersCount});
return _t('%(names)s and %(count)s others are typing …', {names: names.slice(0, limit - 1).join(', '), count: othersCount});
} else {
const lastPerson = names.pop();
return _t('%(names)s and %(lastPerson)s are typing', {names: names.join(', '), lastPerson: lastPerson});
return _t('%(names)s and %(lastPerson)s are typing …', {names: names.join(', '), lastPerson: lastPerson});
}
},
};

Some files were not shown because too many files have changed in this diff Show more