cda18a3dfb
* Use flex to stop redundant margin-top from appearing Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Remove ButtonResetDefault which resets nothing It should be avoided to use ButtonResetDefault where there is nothing to be reset, in order to prevent resources from being wasted. Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Ensure that unexpected regressions will never happen on the buttons and their icons Rules can be extracted when needed. Until then there is no point of exposing elements to possible regressions, which could easily happen on the current architecture. Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com> * Use SASS variables and remove a redundant declaration Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
45 lines
1.3 KiB
SCSS
45 lines
1.3 KiB
SCSS
/*
|
|
Copyright 2022 The Matrix.org Foundation C.I.C.
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
you may not use this file except in compliance with the License.
|
|
You may obtain a copy of the License at
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
See the License for the specific language governing permissions and
|
|
limitations under the License.
|
|
*/
|
|
|
|
.mx_ZoomButtons {
|
|
position: absolute;
|
|
bottom: $spacing-32;
|
|
right: $spacing-24;
|
|
display: flex;
|
|
flex-direction: column;
|
|
row-gap: $spacing-8;
|
|
|
|
.mx_ZoomButtons_button {
|
|
$ZoomButtons_button-size: 24px;
|
|
|
|
border-radius: 4px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: $ZoomButtons_button-size;
|
|
width: $ZoomButtons_button-size;
|
|
background: $background;
|
|
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);
|
|
|
|
.mx_ZoomButtons_icon {
|
|
$ZoomButtons_icon-size: 10px;
|
|
|
|
height: $ZoomButtons_icon-size;
|
|
width: $ZoomButtons_icon-size;
|
|
color: $primary-content;
|
|
}
|
|
}
|
|
}
|