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

Commit 1f2895d

Browse files
aaronraimistaaronraimist
committed
Merge branch 'develop' into blank-device-name
2 parents 5d75357 + b5c2549 commit 1f2895d

File tree

22 files changed

+540
-208
lines changed

22 files changed

+540
-208
lines changed

‎res/css/views/messages/_MFileBody.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -61,9 +61,9 @@ limitations under the License.
6161

6262
.mx_MFileBody_info {
6363
background-color: $message-body-panel-bg-color;
64-
border-radius: 4px;
65-
width: 270px;
66-
padding: 8px;
64+
border-radius: 12px;
65+
width: 243px; // same width as a playable voice message, accounting for padding
66+
padding: 6px 12px;
6767
color: $message-body-panel-fg-color;
6868

6969
.mx_MFileBody_info_icon {
@@ -82,7 +82,7 @@ limitations under the License.
8282
mask-position: center;
8383
mask-size: cover;
8484
mask-image: url('$(res)/img/element-icons/room/composer/attach.svg');
85-
background-color: $message-body-panel-fg-color;
85+
background-color: $message-body-panel-icon-fg-color;
8686
width: 13px;
8787
height: 15px;
8888

‎res/css/views/voip/_CallView.scss‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -65,14 +65,17 @@ limitations under the License.
6565
}
6666
}
6767

68-
.mx_CallView_voice {
68+
.mx_CallView_content {
6969
position: relative;
7070
display: flex;
71-
flex-direction: column;
71+
border-radius: 8px;
72+
}
73+
74+
.mx_CallView_voice {
7275
align-items: center;
7376
justify-content: center;
77+
flex-direction: column;
7478
background-color: $inverted-bg-color;
75-
border-radius: 8px;
7679
}
7780

7881
.mx_CallView_voice_avatarsContainer {
@@ -109,9 +112,7 @@ limitations under the License.
109112
.mx_CallView_video {
110113
width: 100%;
111114
height: 100%;
112-
position: relative;
113115
z-index: 30;
114-
border-radius: 8px;
115116
overflow: hidden;
116117
}
117118

‎res/css/views/voip/_VideoFeed.scss‎

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

17+
.mx_VideoFeed_voice {
18+
// We don't want to collide with the call controls that have 52px of height
19+
padding-bottom: 52px;
20+
background-color: $inverted-bg-color;
21+
}
22+
23+
1724
.mx_VideoFeed_remote {
1825
width: 100%;
1926
height: 100%;
20-
background-color: #000;
21-
z-index: 50;
27+
display: flex;
28+
justify-content: center;
29+
align-items: center;
30+
31+
&.mx_VideoFeed_video {
32+
background-color: #000;
33+
}
2234
}
2335

2436
.mx_VideoFeed_local {
25-
width: 25%;
26-
height: 25%;
37+
max-width: 25%;
38+
max-height: 25%;
2739
position: absolute;
2840
right: 10px;
2941
top: 10px;
3042
z-index: 100;
3143
border-radius: 4px;
44+
45+
&.mx_VideoFeed_video {
46+
background-color: transparent;
47+
}
3248
}
3349

3450
.mx_VideoFeed_mirror {

‎res/themes/dark/css/_dark.scss‎

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -43,14 +43,6 @@ $preview-bar-bg-color: $header-panel-bg-color;
4343
$groupFilterPanel-bg-color: rgba(38, 39, 43, 0.82);
4444
$inverted-bg-color: $base-color;
4545

46-
$voice-record-stop-border-color: $quaternary-fg-color;
47-
$voice-record-waveform-bg-color: #394049; // "Dark Tile"
48-
$voice-record-waveform-fg-color: $secondary-fg-color;
49-
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
50-
$voice-record-icon-color: $quaternary-fg-color;
51-
$voice-playback-button-bg-color: $tertiary-fg-color;
52-
$voice-playback-button-fg-color: #21262C; // "Separator"
53-
5446
// used by AddressSelector
5547
$selected-color: $room-highlight-color;
5648

@@ -214,9 +206,18 @@ $breadcrumb-placeholder-bg-color: #272c35;
214206

215207
$user-tile-hover-bg-color: $header-panel-bg-color;
216208

217-
$message-body-panel-bg-color: #21262c82;
218-
$message-body-panel-icon-bg-color: #8e99a4;
219-
$message-body-panel-fg-color: $primary-fg-color;
209+
$message-body-panel-fg-color: $secondary-fg-color;
210+
$message-body-panel-bg-color: #394049; // "Dark Tile"
211+
$message-body-panel-icon-fg-color: #21262C; // "Separator"
212+
$message-body-panel-icon-bg-color: $tertiary-fg-color;
213+
214+
$voice-record-stop-border-color: $quaternary-fg-color;
215+
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
216+
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
217+
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
218+
$voice-record-icon-color: $quaternary-fg-color;
219+
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
220+
$voice-playback-button-fg-color: $message-body-panel-icon-fg-color;
220221

221222
// Appearance tab colors
222223
$appearance-tab-border-color: $room-highlight-color;

‎res/themes/legacy-dark/css/_legacy-dark.scss‎

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -124,15 +124,6 @@ $roomsublist-skeleton-ui-bg: linear-gradient(180deg, #3e444c 0%, #3e444c00 100%)
124124

125125
$groupFilterPanel-divider-color: $roomlist-header-color;
126126

127-
// See non-legacy dark for variable information
128-
$voice-record-stop-border-color: #6F7882;
129-
$voice-record-waveform-bg-color: #394049;
130-
$voice-record-waveform-fg-color: $secondary-fg-color;
131-
$voice-record-waveform-incomplete-fg-color: #6F7882;
132-
$voice-record-icon-color: #6F7882;
133-
$voice-playback-button-bg-color: $tertiary-fg-color;
134-
$voice-playback-button-fg-color: #21262C;
135-
136127
$roomtile-preview-color: #9e9e9e;
137128
$roomtile-default-badge-bg-color: #61708b;
138129
$roomtile-selected-bg-color: #1A1D23;
@@ -209,9 +200,19 @@ $breadcrumb-placeholder-bg-color: #272c35;
209200

210201
$user-tile-hover-bg-color: $header-panel-bg-color;
211202

212-
$message-body-panel-bg-color: #21262c82;
213-
$message-body-panel-icon-bg-color: #8e99a4;
214-
$message-body-panel-fg-color: $primary-fg-color;
203+
$message-body-panel-fg-color: $secondary-fg-color;
204+
$message-body-panel-bg-color: #394049;
205+
$message-body-panel-icon-fg-color: $primary-bg-color;
206+
$message-body-panel-icon-bg-color: $secondary-fg-color;
207+
208+
// See non-legacy dark for variable information
209+
$voice-record-stop-border-color: #6F7882;
210+
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
211+
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
212+
$voice-record-waveform-incomplete-fg-color: #6F7882;
213+
$voice-record-icon-color: #6F7882;
214+
$voice-playback-button-bg-color: $tertiary-fg-color;
215+
$voice-playback-button-fg-color: #21262C;
215216

216217
// Appearance tab colors
217218
$appearance-tab-border-color: $room-highlight-color;

‎res/themes/legacy-light/css/_legacy-light.scss‎

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -191,17 +191,6 @@ $roomsublist-skeleton-ui-bg: linear-gradient(180deg, #ffffff 0%, #ffffff00 100%)
191191

192192
$groupFilterPanel-divider-color: $roomlist-header-color;
193193

194-
// See non-legacy _light for variable information
195-
$voice-record-stop-symbol-color: #ff4b55;
196-
$voice-record-live-circle-color: #ff4b55;
197-
$voice-record-stop-border-color: #E3E8F0;
198-
$voice-record-waveform-bg-color: #E3E8F0;
199-
$voice-record-waveform-fg-color: $secondary-fg-color;
200-
$voice-record-waveform-incomplete-fg-color: #C1C6CD;
201-
$voice-record-icon-color: $tertiary-fg-color;
202-
$voice-playback-button-bg-color: $primary-bg-color;
203-
$voice-playback-button-fg-color: $secondary-fg-color;
204-
205194
$roomtile-preview-color: #9e9e9e;
206195
$roomtile-default-badge-bg-color: #61708b;
207196
$roomtile-selected-bg-color: #fff;
@@ -334,9 +323,21 @@ $breadcrumb-placeholder-bg-color: #e8eef5;
334323

335324
$user-tile-hover-bg-color: $header-panel-bg-color;
336325

337-
$message-body-panel-bg-color: #e3e8f082;
338-
$message-body-panel-icon-bg-color: #ffffff;
339-
$message-body-panel-fg-color: $muted-fg-color;
326+
$message-body-panel-fg-color: $secondary-fg-color;
327+
$message-body-panel-bg-color: #E3E8F0;
328+
$message-body-panel-icon-fg-color: $secondary-fg-color;
329+
$message-body-panel-icon-bg-color: $primary-bg-color;
330+
331+
// See non-legacy _light for variable information
332+
$voice-record-stop-symbol-color: #ff4b55;
333+
$voice-record-live-circle-color: #ff4b55;
334+
$voice-record-stop-border-color: #E3E8F0;
335+
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
336+
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
337+
$voice-record-waveform-incomplete-fg-color: #C1C6CD;
338+
$voice-record-icon-color: $tertiary-fg-color;
339+
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
340+
$voice-playback-button-fg-color: $message-body-panel-icon-fg-color;
340341

341342
// FontSlider colors
342343
$appearance-tab-border-color: $input-darker-bg-color;

‎res/themes/light/css/_light.scss‎

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -183,19 +183,6 @@ $roomsublist-skeleton-ui-bg: linear-gradient(180deg, #ffffff 0%, #ffffff00 100%)
183183

184184
$groupFilterPanel-divider-color: $roomlist-header-color;
185185

186-
// These two don't change between themes. They are the $warning-color, but we don't
187-
// want custom themes to affect them by accident.
188-
$voice-record-stop-symbol-color: #ff4b55;
189-
$voice-record-live-circle-color: #ff4b55;
190-
191-
$voice-record-stop-border-color: #E3E8F0; // "Separator"
192-
$voice-record-waveform-bg-color: #E3E8F0; // "Separator"
193-
$voice-record-waveform-fg-color: $secondary-fg-color;
194-
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
195-
$voice-record-icon-color: $tertiary-fg-color;
196-
$voice-playback-button-bg-color: $primary-bg-color;
197-
$voice-playback-button-fg-color: $secondary-fg-color;
198-
199186
$roomtile-preview-color: $secondary-fg-color;
200187
$roomtile-default-badge-bg-color: #61708b;
201188
$roomtile-selected-bg-color: #FFF;
@@ -335,9 +322,23 @@ $breadcrumb-placeholder-bg-color: #e8eef5;
335322

336323
$user-tile-hover-bg-color: $header-panel-bg-color;
337324

338-
$message-body-panel-bg-color: #e3e8f082;
339-
$message-body-panel-icon-bg-color: #ffffff;
340-
$message-body-panel-fg-color: $muted-fg-color;
325+
$message-body-panel-fg-color: $secondary-fg-color;
326+
$message-body-panel-bg-color: #E3E8F0; // "Separator"
327+
$message-body-panel-icon-fg-color: $secondary-fg-color;
328+
$message-body-panel-icon-bg-color: $primary-bg-color;
329+
330+
// These two don't change between themes. They are the $warning-color, but we don't
331+
// want custom themes to affect them by accident.
332+
$voice-record-stop-symbol-color: #ff4b55;
333+
$voice-record-live-circle-color: #ff4b55;
334+
335+
$voice-record-stop-border-color: #E3E8F0; // "Separator"
336+
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
337+
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
338+
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
339+
$voice-record-icon-color: $tertiary-fg-color;
340+
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
341+
$voice-playback-button-fg-color: $message-body-panel-icon-fg-color;
341342

342343
// FontSlider colors
343344
$appearance-tab-border-color: $input-darker-bg-color;

‎src/@types/global.d.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,16 @@ declare global {
118118

119119
interface HTMLAudioElement {
120120
type?: string;
121+
// sinkId & setSinkId are experimental and typescript doesn't know about them
122+
sinkId: string;
123+
setSinkId(outputId: string);
124+
}
125+
126+
interface HTMLVideoElement {
127+
type?: string;
128+
// sinkId & setSinkId are experimental and typescript doesn't know about them
129+
sinkId: string;
130+
setSinkId(outputId: string);
121131
}
122132

123133
interface Element {

0 commit comments

Comments
 (0)