[Header] Refactoring style for share button

This commit is contained in:
Julia Radzhabova 2022-02-04 17:09:03 +03:00
parent 34e0c295e1
commit 86a6b68d61
2 changed files with 19 additions and 13 deletions

View file

@ -285,18 +285,18 @@
}
}
&:active, &.active {
.inner-box-icon, .caption {
opacity: @header-component-active-icon-opacity;
}
}
&:hover:not(:disabled) {
.inner-box-icon, .caption {
opacity: @header-component-hover-icon-opacity;
}
}
&:active:not(:disabled), &.active:not(:disabled) {
.inner-box-icon, .caption {
opacity: @header-component-active-icon-opacity;
}
}
&.disabled {
opacity: @component-disabled-opacity;
pointer-events: none;

View file

@ -462,9 +462,19 @@
// TODO: move to appropriate module
.btn-header, .btn-users, .btn-header-share {
&:not(:active) .icon--inverse {
background-position-x: 0;
background-position-x: @button-small-normal-icon-offset-x;
.icon {
&.icon--inverse {
background-position-x: 0 !important;
background-position-x: @button-small-normal-icon-offset-x !important;
}
}
&:active, &.active {
&:not(.disabled) .icon.toolbar__icon {
&.icon--inverse {
background-position-x: @button-small-active-icon-offset-x !important;
}
}
}
svg.icon {
@ -494,10 +504,6 @@
background-color: @highlight-button-pressed-ie;
background-color: @highlight-button-pressed;
.icon--inverse {
background-position-x: @button-small-active-icon-offset-x;
}
svg.icon {
fill: @icon-toolbar-header-ie;
fill: @icon-toolbar-header;