nikrozman/element-web
1
0
Fork 0
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Pull in changes from develop

Browse Source
This commit is contained in:
Richard Lewis
2018-02-23 17:31:24 +00:00
parent 095130a569 3bf04095b1
commit c198dd381f
93 changed files with 2028 additions and 1083 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/skins/vector/css/_components.scss
View File

@@ -36,6 +36,7 @@
@import "./matrix-react-sdk/views/elements/_EditableItemList.scss";
@import "./matrix-react-sdk/views/elements/_MemberEventListSummary.scss";
@import "./matrix-react-sdk/views/elements/_ProgressBar.scss";
@import "./matrix-react-sdk/views/elements/_Quote.scss";
@import "./matrix-react-sdk/views/elements/_RichText.scss";
@import "./matrix-react-sdk/views/elements/_RoleButton.scss";
@import "./matrix-react-sdk/views/elements/_ToolTipButton.scss";
@@ -45,6 +46,7 @@
@import "./matrix-react-sdk/views/login/_InteractiveAuthEntryComponents.scss";
@import "./matrix-react-sdk/views/login/_ServerConfig.scss";
@import "./matrix-react-sdk/views/messages/_MEmoteBody.scss";
@import "./matrix-react-sdk/views/messages/_MFileBody.scss";
@import "./matrix-react-sdk/views/messages/_MImageBody.scss";
@import "./matrix-react-sdk/views/messages/_MNoticeBody.scss";
@import "./matrix-react-sdk/views/messages/_MTextBody.scss";
@@ -64,6 +66,7 @@
@import "./matrix-react-sdk/views/rooms/_PinnedEventTile.scss";
@import "./matrix-react-sdk/views/rooms/_PinnedEventsPanel.scss";
@import "./matrix-react-sdk/views/rooms/_PresenceLabel.scss";
@import "./matrix-react-sdk/views/rooms/_QuotePreview.scss";
@import "./matrix-react-sdk/views/rooms/_RoomHeader.scss";
@import "./matrix-react-sdk/views/rooms/_RoomList.scss";
@import "./matrix-react-sdk/views/rooms/_RoomPreviewBar.scss";
@@ -87,6 +90,7 @@
@import "./vector-web/views/context_menus/_MessageContextMenu.scss";
@import "./vector-web/views/context_menus/_PresenceContextMenuOption.scss";
@import "./vector-web/views/context_menus/_RoomTileContextMenu.scss";
@import "./vector-web/views/context_menus/_TagTileContextMenu.scss";
@import "./vector-web/views/dialogs/_ChangelogDialog.scss";
@import "./vector-web/views/dialogs/_DevtoolsDialog.scss";
@import "./vector-web/views/dialogs/_SetEmailDialog.scss";
@@ -95,6 +99,7 @@
@import "./vector-web/views/elements/_ImageView.scss";
@import "./vector-web/views/elements/_InlineSpinner.scss";
@import "./vector-web/views/elements/_Spinner.scss";
@import "./vector-web/views/elements/_SyntaxHighlight.scss";
@import "./vector-web/views/globals/_MatrixToolbar.scss";
@import "./vector-web/views/messages/_DateSeparator.scss";
@import "./vector-web/views/messages/_MessageTimestamp.scss";

2
src/skins/vector/css/matrix-react-sdk/structures/_GroupView.scss
View File

@@ -90,6 +90,8 @@ limitations under the License.
.mx_GroupView_header_leftCol {
flex: 1;
overflow: hidden;
}
.mx_GroupView_header_rightCol {

8
src/skins/vector/css/matrix-react-sdk/structures/_MyGroups.scss
View File

@@ -94,7 +94,7 @@ limitations under the License.
text-align: center;
}
.mx_MyGroups_joinedGroups .gm-scroll-view {
.mx_MyGroups_joinedGroups {
border-top: 1px solid $primary-hairline-color;
overflow-x: hidden;
@@ -104,7 +104,7 @@ limitations under the License.
align-content: flex-start;
}
.mx_MyGroups_joinedGroups .gm-scroll-view .mx_GroupTile {
.mx_MyGroups_joinedGroups .mx_GroupTile {
min-width: 300px;
max-width: 33%;
flex: 1 0 300px;
@@ -115,6 +115,10 @@ limitations under the License.
cursor: pointer;
}
.mx_GroupTile_avatar {
cursor: grab, -webkit-grab;
}
.mx_GroupTile_profile {
margin-left: 10px;
display: flex;

2
src/skins/vector/css/matrix-react-sdk/structures/_NotificationPanel.scss
View File

@@ -54,7 +54,7 @@ limitations under the License.
left: 0px;
}
.mx_NotificationPanel .mx_EventTile .mx_SenderProfile,
.mx_NotificationPanel .mx_EventTile .mx_SenderProfile,
.mx_NotificationPanel .mx_EventTile .mx_MessageTimestamp {
color: $primary-fg-color;
font-size: 12px;

5
src/skins/vector/css/matrix-react-sdk/structures/_RoomView.scss
View File

@@ -96,6 +96,11 @@ limitations under the License.
order: 2;
}
.mx_RoomView_body .mx_RoomView_messagePanelSpinner {
order: 2;
margin: auto;
}
.mx_RoomView_body .mx_RoomView_statusArea {
order: 3;
}

57
src/skins/vector/css/matrix-react-sdk/structures/_TagPanel.scss
View File

@@ -15,7 +15,7 @@ limitations under the License.
*/
.mx_TagPanel {
width: 60px;
flex: 0 0 60px;
background-color: $tertiary-accent-color;
cursor: pointer;
@@ -25,16 +25,47 @@ limitations under the License.
justify-content: space-between;
}
.mx_TagPanel .mx_TagPanel_clearButton {
/* Constant height within flex mx_TagPanel */
height: 70px;
width: 60px;
flex: none;
display: flex;
justify-content: center;
align-items: center;
}
.mx_TagPanel .mx_TagPanel_clearButton.mx_AccessibleButton:focus {
filter: none;
background: rgba(255,255,255, 0.2);
}
.mx_TagPanel .mx_TagPanel_clearButton object {
pointer-events: none;
}
.mx_TagPanel .mx_TagPanel_divider {
height: 0px;
width: 42px;
border-bottom: 1px solid $panel-divider-color;
}
.mx_TagPanel .mx_TagPanel_scroller {
flex-grow: 1;
}
.mx_TagPanel .mx_TagPanel_tagTileContainer {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 65px;
}
.mx_TagPanel .mx_TagTile {
margin: 6px 0px;
padding: 6px 3px;
opacity: 0.5;
position: relative;
}
.mx_TagPanel .mx_TagTile:focus,
.mx_TagPanel .mx_TagTile:hover,
@@ -44,7 +75,7 @@ limitations under the License.
.mx_TagPanel .mx_TagTile.mx_TagTile_selected {
/* To offset border of mx_TagTile_avatar */
margin: 3px 0px;
padding: 3px 0px;
}
.mx_TagPanel .mx_TagTile.mx_TagTile_selected .mx_TagTile_avatar {
@@ -62,9 +93,27 @@ limitations under the License.
left: 5px;
}
.mx_TagTile_context_button {
min-width: 15px;
height: 15px;
position: absolute;
right: -5px;
top: 1px;
border-radius: 8px;
background-color: $neutral-badge-color;
color: #ffffff;
font-weight: 600;
font-size: 10px;
text-align: center;
padding-top: 1px;
padding-left: 4px;
padding-right: 4px;
}
.mx_TagPanel_createGroupButton {
opacity: 0.5;
margin-bottom: 17px;
margin-top: 18px;
height: 25px;
}

26
src/skins/vector/css/matrix-react-sdk/views/elements/_Quote.scss Normal file
View File

@@ -0,0 +1,26 @@
/*
Copyright 2017 Vector Creations 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_Quote .mx_DateSeparator {
font-size: 1em !important;
margin-bottom: 0;
padding-bottom: 1px;
bottom: -5px;
}
.mx_Quote_show {
cursor: pointer;
}

47
src/skins/vector/css/matrix-react-sdk/views/messages/_MFileBody.scss Normal file
View File

@@ -0,0 +1,47 @@
/*
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_MFileBody_download {
color: $accent-color;
}
.mx_MFileBody_download a {
color: $accent-color;
text-decoration: none;
cursor: pointer;
}
.mx_MFileBody_download object {
margin-left: -16px;
padding-right: 4px;
margin-top: -4px;
vertical-align: middle;
pointer-events: none;
}
/* Remove the border and padding for iframes for download links. */
.mx_MFileBody_download iframe {
margin: 0px;
padding: 0px;
border: none;
width: 100%;
/* Set the height of the iframe to be 1 line of text.
* Iframes don't automatically size themselves to fit their content.
* So either we have to fix the height of the iframe using CSS or
* use javascript's cross-origin postMessage API to communicate how
* big the content of the iframe is. */
height: 1.5em;
}

31
src/skins/vector/css/matrix-react-sdk/views/messages/_MImageBody.scss
View File

@@ -27,34 +27,3 @@ limitations under the License.
border-radius: 1px;
*/
}
.mx_MImageBody_download {
color: $accent-color;
}
.mx_MImageBody_download a {
color: $accent-color;
text-decoration: none;
}
.mx_MImageBody_download object {
margin-left: -16px;
padding-right: 4px;
margin-top: -4px;
vertical-align: middle;
pointer-events: none;
}
/* Remove the border and padding for iframes for download links. */
.mx_MImageBody_download iframe {
margin: 0px;
padding: 0px;
border: none;
width: 100%;
/* Set the height of the iframe to be 1 line of text.
* Iframes don't automatically size themselves to fit their content.
* So either we have to fix the height of the iframe using CSS or
* use javascript's cross-origin postMessage API to communicate how
* big the content of the iframe is. */
height: 1.5em;
}

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

@@ -1,7 +1,7 @@
.mx_Autocomplete {
position: absolute;
bottom: 0;
z-index: 1000;
z-index: 1001;
width: 100%;
border: 1px solid $primary-hairline-color;
background: $primary-bg-color;
@@ -90,3 +90,4 @@
.mx_Autocomplete_Completion_description {
color: gray;
}

10
src/skins/vector/css/matrix-react-sdk/views/rooms/_EventTile.scss
View File

@@ -96,6 +96,10 @@ limitations under the License.
line-height: 22px;
}
.mx_EventTile_quote {
margin-right: 10px;
}
.mx_EventTile_info .mx_EventTile_line {
padding-left: 83px;
}
@@ -109,13 +113,13 @@ limitations under the License.
/* this is used for the tile for the event which is selected via the URL.
* TODO: ultimately we probably want some transition on here.
*/
.mx_EventTile_selected .mx_EventTile_line {
.mx_EventTile_selected > .mx_EventTile_line {
border-left: $accent-color 5px solid;
padding-left: 60px;
background-color: $event-selected-color;
}
.mx_EventTile:hover .mx_EventTile_line,
.mx_EventTile:hover .mx_EventTile_line:not(.mx_EventTile_quote),
.mx_EventTile.menu .mx_EventTile_line
{
background-color: $event-selected-color;
@@ -209,7 +213,7 @@ limitations under the License.
visibility: visible;
}
.mx_EventTile_selected .mx_MessageTimestamp {
.mx_EventTile_selected > div > a > .mx_MessageTimestamp {
left: 3px;
width: auto;
}

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

@@ -112,6 +112,10 @@ limitations under the License.
padding-top: 2px;
}
.mx_MessageComposer .public-DraftStyleDefault-block {
overflow-x: hidden;
}
.mx_MessageComposer_input blockquote {
color: $blockquote-fg-color;
margin: 0 0 16px;

36
src/skins/vector/css/matrix-react-sdk/views/rooms/_QuotePreview.scss Normal file
View File

@@ -0,0 +1,36 @@
.mx_QuotePreview {
position: absolute;
bottom: 0;
z-index: 1000;
width: 100%;
border: 1px solid $primary-hairline-color;
background: $primary-bg-color;
border-bottom: none;
border-radius: 4px 4px 0 0;
max-height: 50vh;
overflow: auto
}
.mx_QuotePreview_section {
border-bottom: 1px solid $primary-hairline-color;
}
.mx_QuotePreview_header {
margin: 12px;
color: $primary-fg-color;
font-weight: 400;
opacity: 0.4;
}
.mx_QuotePreview_title {
float: left;
}
.mx_QuotePreview_cancel {
float: right;
cursor: pointer;
}
.mx_QuotePreview_clear {
clear: both;
}

12
src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomList.scss
View File

@@ -39,12 +39,16 @@ limitations under the License.
z-index: 6;
}
.mx_RoomList_emptySubListTip_container {
background-color: $secondary-accent-color;
padding-left: 18px;
padding-right: 18px;
padding-top: 8px;
padding-bottom: 7px;
}
.mx_RoomList_emptySubListTip {
font-size: 13px;
margin-left: 18px;
margin-right: 18px;
margin-top: 8px;
margin-bottom: 7px;
padding: 5px;
border: 1px dashed $accent-color;
color: $primary-fg-color;

11
src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomTile.scss
View File

@@ -20,6 +20,8 @@ limitations under the License.
font-size: 13px;
display: block;
height: 34px;
background-color: $secondary-accent-color;
}
.mx_RoomTile_tooltip {
@@ -155,6 +157,15 @@ limitations under the License.
background-color: $roomtile-selected-bg-color;
}
.mx_DNDRoomTile {
transform: none;
transition: transform 0.2s;
}
.mx_DNDRoomTile_dragging {
transform: scale(1.05, 1.05);
}
.mx_RoomTile:focus {
filter: none ! important;
background-color: $roomtile-focused-bg-color;

1
src/skins/vector/css/themes/_base.scss
View File

@@ -104,6 +104,7 @@ $roomtile-name-color: rgba(69, 69, 69, 0.8);
$roomtile-selected-bg-color: rgba(255, 255, 255, 0.8);
$roomtile-focused-bg-color: rgba(255, 255, 255, 0.9);
$roomsublist-background: rgba(0, 0, 0, 0.05);
$roomsublist-label-fg-color: $h3-color;
$roomsublist-label-bg-color: $tertiary-accent-color;
$roomsublist-chevron-color: $accent-color;

8
src/skins/vector/css/themes/_dark.scss
View File

@@ -100,9 +100,10 @@ $rte-code-bg-color: #000;
// ********************
$roomtile-name-color: rgba(186, 186, 186, 0.8);
$roomtile-selected-bg-color: rgba(255, 255, 255, 0.05);
$roomtile-selected-bg-color: #333;
$roomtile-focused-bg-color: rgba(255, 255, 255, 0.2);
$roomsublist-background: rgba(0, 0, 0, 0.2);
$roomsublist-label-fg-color: $h3-color;
$roomsublist-label-bg-color: $tertiary-accent-color;
$roomsublist-chevron-color: $accent-color;
@@ -196,3 +197,8 @@ $progressbar-color: #000;
}
}
}
// Add a line to the right side of the left panel to distinguish it from the middle panel
.mx_LeftPanel {
border-right: 1px solid $tertiary-accent-color;
}

21
src/skins/vector/css/vector-web/structures/_LeftPanel.scss
View File

@@ -21,6 +21,27 @@ limitations under the License.
flex-direction: column;
}
.mx_LeftPanel_container {
display: flex;
/* LeftPanel 235px */
flex: 0 0 235px;
}
.mx_LeftPanel_container.mx_LeftPanel_container_hasTagPanel {
/* TagPanel 60px + LeftPanel 235px */
flex: 0 0 295px;
}
.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_hideButton {
position: absolute;
top: 10px;

5
src/skins/vector/css/vector-web/structures/_RightPanel.scss
View File

@@ -84,6 +84,11 @@ limitations under the License.
flex: 1 1 0;
}
.mx_RightPanel .mx_RoomView_messagePanelSpinner {
order: 2;
margin: auto;
}
.mx_RightPanel_footer {
order: 3;

4
src/skins/vector/css/vector-web/structures/_RoomSubList.scss
View File

@@ -18,6 +18,8 @@ limitations under the License.
display: table;
table-layout: fixed;
width: 100%;
background-color: $roomsublist-background;
}
.mx_RoomSubList_labelContainer {
@@ -155,6 +157,8 @@ limitations under the License.
position: relative;
cursor: pointer;
font-size: 13px;
background-color: $secondary-accent-color;
}
.collapsed .mx_RoomSubList_ellipsis {

44
src/skins/vector/css/vector-web/views/context_menus/_TagTileContextMenu.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_TagTileContextMenu_item {
padding-top: 8px;
padding-right: 20px;
padding-bottom: 8px;
cursor: pointer;
white-space: nowrap;
display: flex;
align-items: center;
line-height: 16px;
}
.mx_TagTileContextMenu_item_icon {
padding-right: 8px;
padding-left: 4px;
display: inline-block
}
.mx_TagTileContextMenu_separator {
margin-top: 0;
margin-bottom: 0;
border-bottom-style: none;
border-left-style: none;
border-right-style: none;
border-top-style: solid;
border-top-width: 1px;
border-color: $menu-border-color;
}

21
src/skins/vector/css/vector-web/views/elements/_SyntaxHighlight.scss Normal file
View File

@@ -0,0 +1,21 @@
/*
Copyright 2017 Michael Telatynski <7t3chguy@gmail.com>
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_SyntaxHighlight {
/* inhibit hljs styling */
background: none !important;
color: $light-fg-color !important;
}

21
src/skins/vector/css/vector-web/views/rooms/_RoomDropTarget.scss
View File

@@ -14,12 +14,21 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RoomDropTarget_container {
background-color: $secondary-accent-color;
padding-left: 18px;
padding-right: 18px;
padding-top: 8px;
padding-bottom: 7px;
}
.collapsed .mx_RoomDropTarget_container {
padding-right: 10px;
padding-left: 10px;
}
.mx_RoomDropTarget {
font-size: 13px;
margin-left: 18px;
margin-right: 18px;
margin-top: 8px;
margin-bottom: 7px;
padding-top: 5px;
padding-bottom: 5px;
border: 1px dashed $accent-color;
@@ -28,10 +37,6 @@ limitations under the License.
border-radius: 4px;
}
.collapsed .mx_RoomDropTarget {
margin-right: 10px;
margin-left: 10px;
}
.mx_RoomDropTarget_label {
position: relative;