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

Create a mixin of cancel button (#8526)

Browse source
This commit is contained in:
Suguru Hirahara 2022-05-07 19:08:00 +00:00 • committed by GitHub
parent 7e63202f9a
commit e980c146ff
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 16 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

13
res/css/_common.scss
View file

@ -385,15 +385,22 @@ legend {
color: $alert; color: $alert;
} }
.mx_Dialog_cancelButton { @define-mixin customisedCancelButton {
mask: url('$(res)/img/feather-customised/cancel.svg'); mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat; mask-repeat: no-repeat;
mask-position: center; mask-position: center;
mask-size: cover; mask-size: cover;
width: 14px;
height: 14px;
background-color: $dialog-close-fg-color; background-color: $dialog-close-fg-color;
cursor: pointer; cursor: pointer;
position: unset;
width: unset;
height: unset;
}
.mx_Dialog_cancelButton {
@mixin customisedCancelButton;
width: 14px;
height: 14px;
position: absolute; position: absolute;
top: 10px; top: 10px;
right: 0; right: 0;

7
res/css/structures/auth/_CompleteSecurity.scss
View file

@ -34,14 +34,9 @@ limitations under the License.
} }
.mx_CompleteSecurity_skip { .mx_CompleteSecurity_skip {
mask: url('$(res)/img/feather-customised/cancel.svg'); @mixin customisedCancelButton;
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 18px; width: 18px;
height: 18px; height: 18px;
background-color: $dialog-close-fg-color;
cursor: pointer;
position: absolute; position: absolute;
right: 24px; right: 24px;
} }

7
res/css/views/dialogs/_CompoundDialog.scss
View file

@ -38,14 +38,9 @@ limitations under the License.
} }
.mx_CompoundDialog_cancelButton { .mx_CompoundDialog_cancelButton {
mask: url('$(res)/img/feather-customised/cancel.svg'); @mixin customisedCancelButton;
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 20px; width: 20px;
height: 20px; height: 20px;
background-color: $dialog-close-fg-color;
cursor: pointer;
// Align with middle of title, 34px from right edge // Align with middle of title, 34px from right edge
position: absolute; position: absolute;

4
res/css/views/elements/_EditableItemList.scss
View file

@ -25,14 +25,12 @@ limitations under the License.
} }
.mx_EditableItem_delete { .mx_EditableItem_delete {
@mixin customisedCancelButton;
order: 3; order: 3;
margin-right: 5px; margin-right: 5px;
cursor: pointer;
vertical-align: middle; vertical-align: middle;
width: 14px; width: 14px;
height: 14px; height: 14px;
mask-image: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
background-color: $alert; background-color: $alert;
mask-size: 100%; mask-size: 100%;
} }

6
res/css/views/right_panel/_VerificationPanel.scss
View file

@ -25,14 +25,10 @@ limitations under the License.
.mx_UserInfo { .mx_UserInfo {
.mx_EncryptionPanel_cancel { .mx_EncryptionPanel_cancel {
mask: url('$(res)/img/feather-customised/cancel.svg'); @mixin customisedCancelButton;
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 14px; width: 14px;
height: 14px; height: 14px;
background-color: $settings-subsection-fg-color; background-color: $settings-subsection-fg-color;
cursor: pointer;
position: absolute; position: absolute;
z-index: 100; z-index: 100;
top: 14px; top: 14px;

7
res/css/views/voip/_DialPadContextMenu.scss
View file

@ -35,15 +35,10 @@ limitations under the License.
} }
.mx_DialPadContextMenu_cancel { .mx_DialPadContextMenu_cancel {
@mixin customisedCancelButton;
float: right; float: right;
mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 14px; width: 14px;
height: 14px; height: 14px;
background-color: $dialog-close-fg-color;
cursor: pointer;
} }
.mx_DialPadContextMenu_header:focus-within { .mx_DialPadContextMenu_header:focus-within {

7
res/css/views/voip/_DialPadModal.scss
View file

@ -45,15 +45,10 @@ limitations under the License.
} }
.mx_DialPadModal_cancel { .mx_DialPadModal_cancel {
@mixin customisedCancelButton;
float: right; float: right;
mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 14px; width: 14px;
height: 14px; height: 14px;
background-color: $dialog-close-fg-color;
cursor: pointer;
margin-right: 16px; margin-right: 16px;
} }