OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Replace Sass variable with CSS custom property: --selected-message-border-width (#10876)

pull/28788/head^2
Suguru Hirahara 2023-05-18 04:18:59 +00:00 committed by GitHub
parent 8779219727
commit 9f574cc764
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
res/css/_common.pcss
View File

@ -25,8 +25,6 @@ limitations under the License.
$hover-transition: 0.08s cubic-bezier(0.46, 0.03, 0.52, 0.96); /* quadratic */
$selected-message-border-width: 4px;
:root {
font-size: 10px;

10
res/css/views/rooms/_EventTile.pcss
View File

@ -170,8 +170,10 @@ $left-gutter: 64px;
&[data-layout="irc"],
&[data-layout="group"] {
--selected-message-border-width: 4px;
/* TODO: adjust the values for IRC layout */
--EventTile-box-shadow-offset-x: calc(50px + $selected-message-border-width);
--EventTile-box-shadow-offset-x: calc(50px + var(--selected-message-border-width));
--EventTile-box-shadow-spread-radius: -50px;
.mx_EventTile_e2eIcon {
position: absolute;
@ -447,7 +449,9 @@ $left-gutter: 64px;
&.mx_EventTile_isEditing > .mx_EventTile_line {
.mx_EditMessageComposer {
/* add space for the stroke on box-shadow */
padding-inline-start: calc($selected-message-border-width + var(--EditMessageComposer-padding-inline));
padding-inline-start: calc(
var(--selected-message-border-width) + var(--EditMessageComposer-padding-inline)
);
}
}
@ -592,7 +596,7 @@ $left-gutter: 64px;
&.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
&.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
&.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
padding-inline-start: calc($left-gutter + 18px + $selected-message-border-width);
padding-inline-start: calc($left-gutter + 18px + var(--selected-message-border-width));
}
}
}