Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 7f9f2db

Browse files
committed
Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2 parents acd37d2 + ea20e04 commit 7f9f2db

File tree

109 files changed

+1346
-728
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

109 files changed

+1346
-728
lines changed

.github/PULL_REQUEST_TEMPLATE.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
1-
<!-- Please read https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.rst before submitting your pull request -->
1+
<!-- Please read https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.md before submitting your pull request -->
22

3-
<!-- Include a Sign-Off as described in https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.rst#sign-off -->
3+
<!-- Include a Sign-Off as described in https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.md#sign-off -->

.github/workflows/develop.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
name: Develop
22
on:
3+
# These tests won't work for non-develop branches at the moment as they
4+
# won't pull in the right versions of other repos, so they're only enabled
5+
# on develop.
36
push:
47
branches: [develop]
58
pull_request:
File renamed without changes.

__mocks__/workerMock.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
module.exports = jest.fn();

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,8 @@
187187
"\\$webapp/i18n/languages.json": "<rootDir>/__mocks__/languages.json",
188188
"decoderWorker\\.min\\.js": "<rootDir>/__mocks__/empty.js",
189189
"decoderWorker\\.min\\.wasm": "<rootDir>/__mocks__/empty.js",
190-
"waveWorker\\.min\\.js": "<rootDir>/__mocks__/empty.js"
190+
"waveWorker\\.min\\.js": "<rootDir>/__mocks__/empty.js",
191+
"workers/(.+)\\.worker\\.ts": "<rootDir>/__mocks__/workerMock.js"
191192
},
192193
"transformIgnorePatterns": [
193194
"/node_modules/(?!matrix-js-sdk).+$"

res/css/_components.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -120,6 +120,7 @@
120120
@import "./views/elements/_AddressTile.scss";
121121
@import "./views/elements/_DesktopBuildsNotice.scss";
122122
@import "./views/elements/_DesktopCapturerSourcePicker.scss";
123+
@import "./views/elements/_DialPadBackspaceButton.scss";
123124
@import "./views/elements/_DirectorySearchBox.scss";
124125
@import "./views/elements/_Dropdown.scss";
125126
@import "./views/elements/_EditableItemList.scss";

res/css/structures/_TabbedView.scss

Lines changed: 87 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
/*
22
Copyright 2017 Travis Ralston
33
Copyright 2019 New Vector Ltd
4+
Copyright 2021 The Matrix.org Foundation C.I.C.
45
56
Licensed under the Apache License, Version 2.0 (the "License");
67
you may not use this file except in compliance with the License.
@@ -20,19 +21,100 @@ limitations under the License.
2021
padding: 0 0 0 16px;
2122
display: flex;
2223
flex-direction: column;
23-
position: absolute;
2424
top: 0;
2525
bottom: 0;
2626
left: 0;
2727
right: 0;
2828
margin-top: 8px;
2929
}
3030

31+
.mx_TabbedView_tabsOnLeft {
32+
flex-direction: column;
33+
position: absolute;
34+
35+
.mx_TabbedView_tabLabels {
36+
width: 170px;
37+
max-width: 170px;
38+
position: fixed;
39+
}
40+
41+
.mx_TabbedView_tabPanel {
42+
margin-left: 240px; // 170px sidebar + 70px padding
43+
flex-direction: column;
44+
}
45+
46+
.mx_TabbedView_tabLabel_active {
47+
background-color: $tab-label-active-bg-color;
48+
color: $tab-label-active-fg-color;
49+
}
50+
51+
.mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
52+
background-color: $tab-label-active-icon-bg-color;
53+
}
54+
55+
.mx_TabbedView_maskedIcon {
56+
width: 16px;
57+
height: 16px;
58+
margin-left: 8px;
59+
margin-right: 16px;
60+
}
61+
62+
.mx_TabbedView_maskedIcon::before {
63+
mask-size: 16px;
64+
width: 16px;
65+
height: 16px;
66+
}
67+
}
68+
69+
.mx_TabbedView_tabsOnTop {
70+
flex-direction: column;
71+
72+
.mx_TabbedView_tabLabels {
73+
display: flex;
74+
margin-bottom: 8px;
75+
}
76+
77+
.mx_TabbedView_tabLabel {
78+
padding-left: 0px;
79+
padding-right: 52px;
80+
81+
.mx_TabbedView_tabLabel_text {
82+
font-size: 15px;
83+
color: $tertiary-fg-color;
84+
}
85+
}
86+
87+
.mx_TabbedView_tabPanel {
88+
flex-direction: row;
89+
}
90+
91+
.mx_TabbedView_tabLabel_active {
92+
color: $accent-color;
93+
.mx_TabbedView_tabLabel_text {
94+
color: $accent-color;
95+
}
96+
}
97+
98+
.mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
99+
background-color: $accent-color;
100+
}
101+
102+
.mx_TabbedView_maskedIcon {
103+
width: 22px;
104+
height: 22px;
105+
margin-left: 0px;
106+
margin-right: 8px;
107+
}
108+
109+
.mx_TabbedView_maskedIcon::before {
110+
mask-size: 22px;
111+
width: inherit;
112+
height: inherit;
113+
}
114+
}
115+
31116
.mx_TabbedView_tabLabels {
32-
width: 170px;
33-
max-width: 170px;
34117
color: $tab-label-fg-color;
35-
position: fixed;
36118
}
37119

38120
.mx_TabbedView_tabLabel {
@@ -46,43 +128,25 @@ limitations under the License.
46128
position: relative;
47129
}
48130

49-
.mx_TabbedView_tabLabel_active {
50-
background-color: $tab-label-active-bg-color;
51-
color: $tab-label-active-fg-color;
52-
}
53-
54131
.mx_TabbedView_maskedIcon {
55-
margin-left: 8px;
56-
margin-right: 16px;
57-
width: 16px;
58-
height: 16px;
59132
display: inline-block;
60133
}
61134

62135
.mx_TabbedView_maskedIcon::before {
63136
display: inline-block;
64-
background-color: $tab-label-icon-bg-color;
137+
background-color: $icon-button-color;
65138
mask-repeat: no-repeat;
66-
mask-size: 16px;
67-
width: 16px;
68-
height: 16px;
69139
mask-position: center;
70140
content: '';
71141
}
72142

73-
.mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
74-
background-color: $tab-label-active-icon-bg-color;
75-
}
76-
77143
.mx_TabbedView_tabLabel_text {
78144
vertical-align: middle;
79145
}
80146

81147
.mx_TabbedView_tabPanel {
82-
margin-left: 240px; // 170px sidebar + 70px padding
83148
flex-grow: 1;
84149
display: flex;
85-
flex-direction: column;
86150
min-height: 0; // firefox
87151
}
88152

res/css/views/dialogs/_InviteDialog.scss

Lines changed: 101 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,10 @@ See the License for the specific language governing permissions and
1414
limitations under the License.
1515
*/
1616

17+
.mx_InviteDialog_transferWrapper .mx_Dialog {
18+
padding-bottom: 16px;
19+
}
20+
1721
.mx_InviteDialog_addressBar {
1822
display: flex;
1923
flex-direction: row;
@@ -286,24 +290,48 @@ limitations under the License.
286290
}
287291
}
288292

289-
.mx_InviteDialog {
293+
.mx_InviteDialog_other {
290294
// Prevent the dialog from jumping around randomly when elements change.
291295
height: 600px;
292296
padding-left: 20px; // the design wants some padding on the left
293-
display: flex;
297+
298+
.mx_InviteDialog_userSections {
299+
height: calc(100% - 115px); // mx_InviteDialog's height minus some for the upper and lower elements
300+
}
301+
}
302+
303+
.mx_InviteDialog_content {
304+
height: calc(100% - 36px); // full height minus the size of the header
305+
overflow: hidden;
306+
}
307+
308+
.mx_InviteDialog_transfer {
309+
width: 496px;
310+
height: 466px;
294311
flex-direction: column;
295312

296313
.mx_InviteDialog_content {
297-
overflow: hidden;
298-
height: 100%;
314+
flex-direction: column;
315+
316+
.mx_TabbedView {
317+
height: calc(100% - 60px);
318+
}
319+
overflow: visible;
320+
}
321+
322+
.mx_InviteDialog_addressBar {
323+
margin-top: 8px;
324+
}
325+
326+
input[type="checkbox"] {
327+
margin-right: 8px;
299328
}
300329
}
301330

302331
.mx_InviteDialog_userSections {
303332
margin-top: 4px;
304333
overflow-y: auto;
305334
padding: 0 45px 4px 0;
306-
height: calc(100% - 115px); // mx_InviteDialog's height minus some for the upper and lower elements
307335
}
308336

309337
.mx_InviteDialog_hasFooter .mx_InviteDialog_userSections {
@@ -318,6 +346,74 @@ limitations under the License.
318346
padding: 0;
319347
}
320348

349+
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField {
350+
border-top: 0;
351+
border-left: 0;
352+
border-right: 0;
353+
border-radius: 0;
354+
margin-top: 0;
355+
border-color: $quaternary-fg-color;
356+
357+
input {
358+
font-size: 18px;
359+
font-weight: 600;
360+
padding-top: 0;
361+
}
362+
}
363+
364+
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField:focus-within {
365+
border-color: $accent-color;
366+
}
367+
368+
.mx_InviteDialog_dialPadField .mx_Field_postfix {
369+
/* Remove border separator between postfix and field content */
370+
border-left: none;
371+
}
372+
373+
.mx_InviteDialog_dialPad {
374+
width: 224px;
375+
margin-top: 16px;
376+
margin-left: auto;
377+
margin-right: auto;
378+
}
379+
380+
.mx_InviteDialog_dialPad .mx_DialPad {
381+
row-gap: 16px;
382+
column-gap: 48px;
383+
384+
margin-left: auto;
385+
margin-right: auto;
386+
}
387+
388+
.mx_InviteDialog_transferConsultConnect {
389+
padding-top: 16px;
390+
/* This wants a drop shadow the full width of the dialog, so relative-position it
391+
* and make it wider, then compensate with padding
392+
*/
393+
position: relative;
394+
width: 496px;
395+
left: -24px;
396+
padding-left: 24px;
397+
padding-right: 24px;
398+
border-top: 1px solid $message-body-panel-bg-color;
399+
400+
display: flex;
401+
flex-direction: row;
402+
align-items: center;
403+
}
404+
405+
.mx_InviteDialog_transferConsultConnect_pushRight {
406+
margin-left: auto;
407+
}
408+
409+
.mx_InviteDialog_userDirectoryIcon::before {
410+
mask-image: url('$(res)/img/voip/tab-userdirectory.svg');
411+
}
412+
413+
.mx_InviteDialog_dialPadIcon::before {
414+
mask-image: url('$(res)/img/voip/tab-dialpad.svg');
415+
}
416+
321417
.mx_InviteDialog_multiInviterError {
322418
> h4 {
323419
font-size: $font-15px;
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
/*
2+
Copyright 2021 The Matrix.org Foundation C.I.C.
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
*/
16+
17+
.mx_DialPadBackspaceButton {
18+
position: relative;
19+
height: 28px;
20+
width: 28px;
21+
22+
&::before {
23+
/* force this element to appear on the DOM */
24+
content: "";
25+
26+
background-color: #8D97A5;
27+
width: inherit;
28+
height: inherit;
29+
top: 0px;
30+
left: 0px;
31+
position: absolute;
32+
display: inline-block;
33+
vertical-align: middle;
34+
35+
mask-image: url('$(res)/img/element-icons/call/delete.svg');
36+
mask-position: 8px;
37+
mask-size: 20px;
38+
mask-repeat: no-repeat;
39+
}
40+
}

0 commit comments

Comments
 (0)