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

Commit 9128a99

Browse files
justjannejustjanne
authored
Merge branch 'develop' into justjanne/feat/use-case-selection
2 parents 980426c + 7afc8c5 commit 9128a99

File tree

21 files changed

+218
-80
lines changed

21 files changed

+218
-80
lines changed

‎res/css/_components.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@
2626
@import "./components/views/location/_ShareType.scss";
2727
@import "./components/views/location/_ZoomButtons.scss";
2828
@import "./components/views/messages/_MBeaconBody.scss";
29+
@import "./components/views/messages/shared/_MediaProcessingError.scss";
2930
@import "./components/views/spaces/_QuickThemeSwitcher.scss";
3031
@import "./structures/_AutoHideScrollbar.scss";
3132
@import "./structures/_BackdropPanel.scss";

‎res/css/components/views/messages/shared/_MediaProcessingError.scss‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
/*
2+
Copyright 2022 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_MediaProcessingError_Icon {
18+
margin-right: $spacing-4;
19+
vertical-align: text-top;
20+
}

‎res/css/structures/_FilePanel.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ limitations under the License.
9696

9797
.mx_MessageTimestamp {
9898
flex: 1 0 0;
99-
text-align: right; // FIXME: .mx_EventTile:not([data-layout=bubble]) .mx_MessageTimestamp
99+
text-align: right;
100100
visibility: visible;
101101
position: initial;
102102
font-size: $font-14px;

‎res/css/views/dialogs/_MessageEditHistoryDialog.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,11 +51,14 @@ limitations under the License.
5151
text-decoration: underline;
5252
}
5353

54+
// Emulate mx_EventTile[data-layout=group]
5455
.mx_EventTile {
5556
padding-top: 0 !important; // Override mx_EventTile:not([data-layout=bubble])
5657

5758
.mx_MessageTimestamp {
5859
position: absolute;
60+
left: 0;
61+
text-align: center;
5962
}
6063

6164
.mx_EventTile_line {

‎res/css/views/right_panel/_TimelineCard.scss‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -149,11 +149,14 @@ limitations under the License.
149149
}
150150
}
151151

152-
.mx_GenericEventListSummary:not([data-layout=bubble]) {
153-
.mx_EventTile_line,
154-
> .mx_GenericEventListSummary_unstyledList > .mx_EventTile_info .mx_EventTile_avatar ~ .mx_EventTile_line {
155-
padding-inline-start: var(--BaseCard_EventTile-spacing-inline);
156-
padding-inline-end: var(--BaseCard_EventTile-spacing-inline);
152+
.mx_GenericEventListSummary {
153+
&[data-layout=irc],
154+
&[data-layout=group] {
155+
.mx_EventTile_line,
156+
.mx_GenericEventListSummary_unstyledList > .mx_EventTile_info .mx_EventTile_avatar ~ .mx_EventTile_line {
157+
padding-inline-start: var(--BaseCard_EventTile-spacing-inline);
158+
padding-inline-end: var(--BaseCard_EventTile-spacing-inline);
159+
}
157160
}
158161
}
159162

‎res/css/views/rooms/_EventTile.scss‎

Lines changed: 58 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -195,16 +195,18 @@ $left-gutter: 64px;
195195
}
196196
}
197197

198+
&[data-layout=irc] {
199+
.mx_MessageTimestamp {
200+
text-align: right;
201+
}
202+
}
203+
198204
&[data-layout=group] {
199205
.mx_EventTile_avatar {
200206
top: 14px;
201207
left: $spacing-8;
202208
}
203209

204-
.mx_MessageTimestamp {
205-
position: absolute; // for modern layout
206-
}
207-
208210
.mx_EventTile_line,
209211
.mx_EventTile_reply {
210212
padding-top: var(--EventTile_group_line-spacing-block-start);
@@ -221,6 +223,12 @@ $left-gutter: 64px;
221223
margin-right: 10px;
222224
}
223225

226+
.mx_MessageTimestamp {
227+
position: absolute;
228+
left: 0;
229+
text-align: center;
230+
}
231+
224232
.mx_ThreadSummary,
225233
.mx_ThreadSummary_icon {
226234
margin-left: $left-gutter;
@@ -261,6 +269,10 @@ $left-gutter: 64px;
261269
&.mx_EventTile_continuation {
262270
padding-top: 0px !important;
263271
}
272+
273+
&.mx_EventTile_info .mx_EventTile_line {
274+
padding-left: calc($left-gutter + 20px); // override padding-left $left-gutter
275+
}
264276
}
265277

266278
&[data-layout=bubble] {
@@ -304,11 +316,6 @@ $left-gutter: 64px;
304316
}
305317
}
306318

307-
.mx_MessageTimestamp {
308-
left: 0px;
309-
text-align: center;
310-
}
311-
312319
/* this is used for the tile for the event which is selected via the URL.
313320
* TODO: ultimately we probably want some transition on here.
314321
*/
@@ -366,17 +373,42 @@ $left-gutter: 64px;
366373
}
367374
}
368375

369-
.mx_GenericEventListSummary:not([data-layout=bubble]) .mx_EventTile_line {
370-
padding-left: $left-gutter;
376+
.mx_GenericEventListSummary {
377+
&[data-layout=irc],
378+
&[data-layout=group] {
379+
.mx_EventTile_line .mx_RedactedBody {
380+
line-height: 1; // remove spacing between lines
381+
}
382+
}
383+
384+
&[data-layout=irc] {
385+
.mx_EventTile_info .mx_EventTile_line {
386+
padding-left: 0; // Override .mx_EventTile:not([data-layout="bubble"]).mx_EventTile_info .mx_EventTile_line
387+
}
388+
389+
.mx_EventTile_line .mx_RedactedBody {
390+
padding-left: 24px; // 25px - 1px
371391

372-
.mx_RedactedBody {
373-
line-height: 1; // remove spacing between lines
392+
&::before {
393+
left: var(--right-padding);
394+
}
395+
}
396+
397+
// Apply only collapsed events block
398+
> .mx_EventTile_line {
399+
padding-left: calc(var(--name-width) + var(--icon-width) + $MessageTimestamp_width + 3 * var(--right-padding)); // 15 px of padding
400+
}
374401
}
375-
}
376402

377-
.mx_EventTile:not([data-layout=bubble]).mx_EventTile_info .mx_EventTile_line,
378-
.mx_GenericEventListSummary:not([data-layout=bubble]) > .mx_GenericEventListSummary_unstyledList > .mx_EventTile_info .mx_EventTile_avatar ~ .mx_EventTile_line {
379-
padding-left: calc($left-gutter + 20px); // override padding-left $left-gutter
403+
&[data-layout=group] {
404+
.mx_EventTile_line {
405+
padding-left: $left-gutter;
406+
}
407+
408+
.mx_GenericEventListSummary_unstyledList > .mx_EventTile_info .mx_EventTile_avatar ~ .mx_EventTile_line {
409+
padding-left: calc($left-gutter + 20px); // override padding-left $left-gutter
410+
}
411+
}
380412
}
381413

382414
.mx_EventTile_content {
@@ -928,11 +960,14 @@ $left-gutter: 64px;
928960
}
929961
}
930962

931-
&:not([data-layout=bubble]) {
963+
&[data-layout=irc],
964+
&[data-layout=group] {
932965
.mx_MessageTimestamp {
933966
top: 2px; // Align with avatar
934967
}
968+
}
935969

970+
&:not([data-layout=bubble]) {
936971
.mx_EventTile_avatar {
937972
left: calc($MessageTimestamp_width + 14px - 4px); // 14px: avatar width, 4px: align with text
938973
z-index: 9; // position above the hover styling
@@ -1038,11 +1073,6 @@ $left-gutter: 64px;
10381073
}
10391074
}
10401075

1041-
.mx_MessageTimestamp {
1042-
top: 2px; // Align with mx_EventTile_content
1043-
position: absolute; // for IRC layout
1044-
}
1045-
10461076
.mx_EventTile_senderDetails {
10471077
display: flex;
10481078
align-items: center;
@@ -1062,6 +1092,11 @@ $left-gutter: 64px;
10621092
}
10631093
}
10641094
}
1095+
1096+
.mx_MessageTimestamp {
1097+
position: absolute; // for IRC layout
1098+
top: 2px; // Align with mx_EventTile_content
1099+
}
10651100
}
10661101
}
10671102

‎res/css/views/rooms/_IRCLayout.scss‎

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

17-
$icon-width: 14px;
18-
$right-padding: 5px;
1917
$irc-line-height: $font-18px;
2018

2119
.mx_IRCLayout {
2220
--name-width: 70px;
21+
--icon-width: 14px;
22+
--right-padding: 5px;
2323

2424
line-height: $irc-line-height !important;
2525

@@ -36,7 +36,7 @@ $irc-line-height: $font-18px;
3636
padding-top: 0;
3737

3838
> * {
39-
margin-right: $right-padding;
39+
margin-right: var(--right-padding);
4040
}
4141

4242
.mx_EventTile_msgOption {
@@ -115,10 +115,6 @@ $irc-line-height: $font-18px;
115115
}
116116
}
117117

118-
.mx_MessageTimestamp {
119-
text-align: right;
120-
}
121-
122118
.mx_EventTile_e2eIcon {
123119
padding: 0;
124120

@@ -157,26 +153,23 @@ $irc-line-height: $font-18px;
157153

158154
.mx_EventTile_emote {
159155
.mx_EventTile_avatar {
160-
margin-left: calc(var(--name-width) + $icon-width + $right-padding);
156+
margin-left: calc(var(--name-width) + var(--icon-width) + var(--right-padding));
161157
}
162158
}
163159

164160
blockquote {
165161
margin: 0;
166162
}
167163

168-
.mx_GenericEventListSummary > .mx_EventTile_line {
169-
padding-left: calc(var(--name-width) + $icon-width + $MessageTimestamp_width + 3 * $right-padding); // 15 px of padding
170-
}
171-
172164
.mx_EventTile.mx_EventTile_info {
173165
.mx_EventTile_avatar {
174-
left: calc(var(--name-width) + 10px + $icon-width);
166+
left: calc(var(--name-width) + 10px + var(--icon-width));
175167
top: 0;
168+
margin-right: var(--right-padding);
176169
}
177170

178171
.mx_EventTile_line {
179-
left: calc(var(--name-width) + 10px + $icon-width);
172+
left: calc(var(--name-width) + 10px + var(--icon-width));
180173
}
181174

182175
.mx_TextualEvent {

‎res/css/views/settings/tabs/_SettingsTab.scss‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -92,12 +92,6 @@ limitations under the License.
9292
}
9393
}
9494

95-
.mx_SettingsTab_linkBtn {
96-
cursor: pointer;
97-
color: $accent;
98-
word-break: break-all;
99-
}
100-
10195
.mx_SettingsTab_toggleWithDescription {
10296
margin-top: $spacing-24;
10397
}

‎res/css/views/settings/tabs/user/_SecurityUserSettingsTab.scss‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,6 @@ limitations under the License.
2727
}
2828

2929
.mx_SecurityUserSettingsTab {
30-
.mx_SettingsTab_heading {
31-
margin-bottom: 22px;
32-
}
3330
.mx_SettingsTab_section {
3431
.mx_AccessibleButton_kind_link {
3532
font-size: inherit;

‎src/components/structures/BackdropPanel.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@ export const BackdropPanel: React.FC<IProps> = ({ backgroundImage, blurMultiplie
3636
}
3737
return <div className="mx_BackdropPanel">
3838
<img
39+
role="presentation"
40+
alt=""
3941
style={styles}
4042
className="mx_BackdropPanel--image"
4143
src={backgroundImage} />

0 commit comments

Comments
 (0)