imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Revert "Refine menu, toast, and popover colors (#12247)" (#12263)

Browse source 
This reverts commit 0856c7617d.

Co-authored-by: David Langley <langley.dave@gmail.com>
This commit is contained in:
Florian Duros 2024-02-20 14:54:33 +01:00 • committed by GitHub
parent 371405782d
commit ac435c8d4e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
23 changed files with 118 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

29
res/css/views/context_menus/_IconizedContextMenu.pcss
View file

@ -36,7 +36,26 @@ limitations under the License.
/* the notFirst class is for cases where the optionList might be under a header of sorts. */
&:nth-child(n + 2),
.mx_IconizedContextMenu_optionList_notFirst {
border-top: var(--cpd-border-width-1) solid var(--cpd-color-gray-400);
/* This is a bit of a hack when we could just use a simple border-top property, */
/* however we have a (kinda) good reason for doing it this way: we need opacity. */
/* To get the right color, we need an opacity modifier which means we have to work */
/* around the problem. PostCSS doesn't support the opacity() function, and if we */
/* use something like postcss-functions we quickly run into an issue where the */
/* function we would define gets passed a CSS variable for custom themes, which */
/* can't be converted easily even when considering https://stackoverflow.com/a/41265350/7037379 */
//
/* Therefore, we just hack in a line and border the thing ourselves */
&::before {
border-top: 1px solid $primary-content;
opacity: 0.1;
content: "";
/* Counteract the padding problems (width: 100% ignores the 40px padding, */
/* unless we position it absolutely then it does the right thing). */
width: 100%;
position: absolute;
left: 0;
}
}
/* round the top corners of the top button for the hover effect to be bounded */
@ -68,7 +87,7 @@ limitations under the License.
&:hover,
&:focus-visible {
background-color: var(--cpd-color-bg-action-secondary-hovered);
background-color: $menu-selected-color;
}
&.mx_AccessibleButton_disabled {
@ -118,7 +137,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background-color: var(--cpd-color-icon-primary);
background-color: $icon-button-color;
}
}
@ -128,7 +147,7 @@ limitations under the License.
}
.mx_IconizedContextMenu_icon::before {
background-color: var(--cpd-color-icon-critical-primary);
background-color: $alert;
}
}
@ -153,7 +172,7 @@ limitations under the License.
&.mx_IconizedContextMenu_compact {
.mx_IconizedContextMenu_optionList > * {
padding: 8px 16px 8px 12px;
padding: 8px 16px 8px 11px;
}
}

1
res/css/views/context_menus/_MessageContextMenu.pcss
View file

@ -29,6 +29,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background: $icon-button-color;
}
}