Merge remote-tracking branch 'origin/develop' into dbkr/groups_better_groupview

src/skins/vector/css/_components.scss

@@ -58,6 +58,7 @@
 @import "./matrix-react-sdk/views/rooms/_SearchableEntityList.scss";
 @import "./matrix-react-sdk/views/rooms/_TabCompleteBar.scss";
 @import "./matrix-react-sdk/views/rooms/_TopUnreadMessagesBar.scss";
+@import "./matrix-react-sdk/views/rooms/_AppsDrawer.scss";
 @import "./matrix-react-sdk/views/settings/_DevicesPanel.scss";
 @import "./matrix-react-sdk/views/settings/_IntegrationsManager.scss";
 @import "./matrix-react-sdk/views/voip/_CallView.scss";

src/skins/vector/css/matrix-react-sdk/views/messages/_MEmoteBody.scss

@@ -14,6 +14,10 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
+.mx_MEmoteBody {
+    white-space: pre-wrap;
+}
+
 .mx_MEmoteBody_sender {
     cursor: pointer;
 }

src/skins/vector/css/matrix-react-sdk/views/rooms/_AppsDrawer.scss

@@ -0,0 +1,159 @@
+/*
+Copyright 2015, 2016 OpenMarket Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+.mx_AppsDrawer {
+}
+
+.mx_AppsContainer {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+}
+
+.mx_AddWidget_button {
+    order: 2;
+    cursor: pointer;
+    padding-right: 12px;
+    padding: 0;
+    margin: 0 0 5px 0;
+    color: $accent-color;
+    font-size: 12px;
+}
+
+.mx_SetAppURLDialog_input {
+    border-radius: 3px;
+    border: 1px solid $input-border-color;
+    padding: 9px;
+    color: $primary-hairline-color;
+    background-color: $primary-bg-color;
+    font-size: 15px;
+}
+
+.mx_AppTile {
+    width: 50%;
+    margin: 0 5px 2px 0;
+    border: 1px solid $primary-hairline-color;
+    border-radius: 2px;
+    // height: 350px;
+    // display: inline-block;
+}
+
+.mx_AppTileFullWidth {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    border: 1px solid $primary-hairline-color;
+    border-radius: 2px;
+    // height: 350px;
+    // display: inline-block;
+}
+
+.mx_AppTileMenuBar {
+    // height: 15px;
+    margin: 0;
+    padding: 2px 10px;
+    // background-color: $e2e-verified-color;
+    border-bottom: 1px solid $primary-hairline-color;
+    font-size: 10px;
+}
+
+.mx_AppTileMenuBarWidgets {
+    float: right;
+}
+.mx_AppTileMenuBarWidget {
+    // pointer-events: none;
+    cursor: pointer;
+}
+
+.mx_AppTileBody iframe {
+    width: 100%;
+    height: 350px;
+    overflow: hidden;
+    border: none;
+    padding: 0;
+    margin: 0;
+    display: block;
+}
+
+.mx_CloseAppWidget {
+}
+
+.mx_AppTileMenuBarWidgetPadding {
+    margin-right: 5px;
+}
+
+.mx_AppIconTile {
+    background-color: $lightbox-bg-color;
+    border: 1px solid rgba(0, 0, 0, 0);
+    width: 200px;
+    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
+    transition: 0.3s;
+    border-radius: 3px;
+    margin: 5px;
+    display: inline-block;
+}
+
+.mx_AppIconTile.mx_AppIconTile_active {
+    color: $accent-color;
+    border-color: $accent-color;
+}
+
+.mx_AppIconTile:hover {
+    border: 1px solid $accent-color;
+    box-shadow: 0 0 10px 5px rgba(200,200,200,0.5);
+}
+
+.mx_AppIconTile_content {
+    padding: 2px 16px;
+    height: 60px;
+    overflow: hidden;
+}
+
+.mx_AppIconTile_content h4 {
+    margin-top: 5px;
+    margin-bottom: 2px;
+}
+
+.mx_AppIconTile_content p {
+    margin-top: 0;
+    margin-bottom: 5px;
+    font-size: smaller;
+}
+
+.mx_AppIconTile_image {
+    padding: 10px;
+    width: 75%;
+    max-width:100px;
+    max-height:100px;
+    width: auto;
+    height: auto;
+}
+
+.mx_AppIconTile_imageContainer {
+    text-align: center;
+    width: 100%;
+    background-color: white;
+    border-radius: 3px 3px 0 0;
+    height: 155px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+form.mx_Custom_Widget_Form div {
+    margin-top: 10px;
+    margin-bottom: 10px;
+}

src/skins/vector/css/matrix-react-sdk/views/rooms/_Autocomplete.scss

@@ -38,6 +38,7 @@
 .mx_Autocomplete_Completion_pill {
     border-radius: 17px;
     height: 34px;
+    padding: 0px 5px;
     display: flex;
     user-select: none;
     cursor: pointer;
@@ -45,10 +46,22 @@
     color: $primary-fg-color;
 }
 
-.mx_Autocomplete_Completion_pill * {
+.mx_Autocomplete_Completion_pill > * {
     margin: 0 3px;
 }
 
+.mx_Autocomplete_Completion_container_truncate {
+    .mx_Autocomplete_Completion_title,
+    .mx_Autocomplete_Completion_subtitle,
+    .mx_Autocomplete_Completion_description {
+        /* Ellipsis for long names/subtitles/descriptions*/
+        max-width: 150px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+}
+
 /* container for pill-style completions */
 .mx_Autocomplete_Completion_container_pill {
     margin: 12px;

src/skins/vector/css/matrix-react-sdk/views/rooms/_MessageComposer.scss

@@ -78,6 +78,16 @@ limitations under the License.
     margin-right: 6px;
 }
 
+@keyframes visualbell
+{
+    from { background-color: #faa }
+    to { background-color: $primary-bg-color }
+}
+
+.mx_MessageComposer_input_error {
+    animation: 0.2s visualbell;
+}
+
 .mx_MessageComposer_input_empty .public-DraftEditorPlaceholder-root {
     display: none;
 }
@@ -87,6 +97,7 @@ limitations under the License.
     flex: 1;
     max-height: 120px;
     overflow: auto;
+    word-break: break-word;
 }
 
 .mx_MessageComposer_input blockquote {
@@ -128,7 +139,8 @@ limitations under the License.
 .mx_MessageComposer_upload,
 .mx_MessageComposer_hangup,
 .mx_MessageComposer_voicecall,
-.mx_MessageComposer_videocall {
+.mx_MessageComposer_videocall,
+.mx_MessageComposer_apps {
     /*display: table-cell;*/
     /*vertical-align: middle;*/
     /*padding-left: 10px;*/
@@ -140,7 +152,8 @@ limitations under the License.
 .mx_MessageComposer_upload object,
 .mx_MessageComposer_hangup object,
 .mx_MessageComposer_voicecall object,
-.mx_MessageComposer_videocall object {
+.mx_MessageComposer_videocall object,
+.mx_MessageComposer_apps object {
     pointer-events: none;
 }
 
@@ -181,11 +194,6 @@ limitations under the License.
     cursor: pointer;
 }
 
-.mx_MessageComposer_format_button_disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-}
-
 .mx_MessageComposer_formatbar_cancel {
     margin-right: 22px;
 }