Move background-blur to fully css version

This commit is contained in:
Dariusz Niemczyk 2021-08-23 19:26:57 +02:00
parent 01eda5158b
commit e54191f6b0
No known key found for this signature in database
GPG key ID: 3E8DC619E3C59A05
11 changed files with 48 additions and 142 deletions

View file

@ -21,9 +21,10 @@ limitations under the License.
height: 100vh;
width: 100%;
overflow: hidden;
filter: blur(var(--lp-background-blur));
}
.mx_BackdropPanel--canvas {
.mx_BackdropPanel--image {
position: absolute;
top: 0;
left: 0;
@ -32,10 +33,4 @@ limitations under the License.
pointer-events: none;
overflow: hidden;
&:nth-of-type(2n-1) {
opacity: 0.2;
}
&:nth-of-type(2n) {
opacity: 0.1;
}
}

View file

@ -14,12 +14,6 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MatrixChat--with-avatar {
.mx_GroupFilterPanel {
background-color: transparent;
}
}
$groupFilterPanelWidth: 56px; // only applies in this file, used for calculations
.mx_GroupFilterPanelContainer {
@ -36,6 +30,7 @@ $groupFilterPanelWidth: 56px; // only applies in this file, used for calculation
}
.mx_GroupFilterPanel {
z-index: 1;
background-color: $groupFilterPanel-bg-color;
flex: 1;
cursor: pointer;

View file

@ -27,28 +27,8 @@ $roomListCollapsedWidth: 68px;
display: flex;
max-width: 50%;
.mx_LeftPanel_background {
&::before {
content: " ";
position: absolute;
left: 0;
top: 0;
height: 100vh;
width: 100%;
background-color: var(--lp-background-overlay);
}
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: $roomlist-bg-color;
opacity: 0.5;
}
.mx_LeftPanel_wrapper--user {
background-color: $roomlist-bg-color;
display: flex;
overflow: hidden;
position: relative;

View file

@ -22,18 +22,14 @@ $activeBorderTransparentGap: 1px;
$activeBackgroundColor: $roomtile-selected-bg-color;
$activeBorderColor: $secondary-fg-color;
.mx_MatrixChat--with-avatar {
.mx_SpacePanel {
background-color: transparent;
}
}
.mx_SpacePanel {
background-color: $groupFilterPanel-bg-color;
flex: 0 0 auto;
padding: 0;
margin: 0;
position: relative;
// Fix for the blurred avatar-background
z-index: 1;
// Create another flexbox so the Panel fills the container
display: flex;