..F....... [ZBX-20049] updated maintenance icon for compact view and for HC themes; fixed code style

3 files changed, 26 insertions, 17 deletions

diff --git a/sass/stylesheets/sass/hc-dark.scss b/sass/stylesheets/sass/hc-dark.scss
index f498ff4b536..3267bd4efdc 100644
--- a/sass/stylesheets/sass/hc-dark.scss
+++ b/sass/stylesheets/sass/hc-dark.scss
@@ -450,10 +450,10 @@ $arrow-fill-up-down: #FFFFFF;
 }
 
 $var-icons: (
-	maintenance: url($sprite-path) no-repeat -357px -802px,
-	depend-up: url($sprite-path) no-repeat -361px -729px,
-	depend-down: url($sprite-path) no-repeat -361px -765px,
-	ackn: url($sprite-path) no-repeat -357px -693px
+	maintenance: -359px -803px,
+	depend-up: -361px -729px,
+	depend-down: -361px -765px,
+	ackn: -357px -693px
 );
 
 // Dynamically generated classes:
@@ -463,10 +463,8 @@ $var-icons: (
 //  .icon-ackn
 @each $var-icons, $bgimage in $var-icons {
 	.icon-#{$var-icons} {
-		margin: 0 18px 0 0;
 		&::before {
-			background: $bgimage;
-			@extend %var-icons;
+			background-position: $bgimage;
 		}
 	}
 }
@@ -935,7 +933,7 @@ a.link-action {
 			}
 
 			.icon-maintenance::before {
-				background-position: -360px -804px;
+				background-position: -361px -805px;
 			}
 
 			.icon-wzrd-action {
diff --git a/sass/stylesheets/sass/hc-light.scss b/sass/stylesheets/sass/hc-light.scss
index d7351f0d14a..5adf90625bc 100644
--- a/sass/stylesheets/sass/hc-light.scss
+++ b/sass/stylesheets/sass/hc-light.scss
@@ -374,10 +374,10 @@ $arrow-fill-up-down: #000000;
 }
 
 $var-icons: (
-	maintenance: url($sprite-path) no-repeat -203px -802px,
-	depend-up: url($sprite-path) no-repeat -208px -729px,
-	depend-down: url($sprite-path) no-repeat -208px -765px,
-	ackn: url($sprite-path) no-repeat -203px -693px
+	maintenance: -205px -803px,
+	depend-up: -208px -729px,
+	depend-down: -208px -765px,
+	ackn: -203px -693px
 );
 
 // Dynamically generated classes:
@@ -387,10 +387,8 @@ $var-icons: (
 //  .icon-ackn
 @each $var-icons, $bgimage in $var-icons {
 	.icon-#{$var-icons} {
-		margin: 0 18px 0 0;
 		&::before {
-			background: $bgimage;
-			@extend %var-icons;
+			background-position: $bgimage;
 		}
 	}
 }
@@ -820,7 +818,7 @@ a.link-action {
 			box-shadow: inset 0 -1px 0 0 $table-border-color;
 
 			.icon-maintenance::before {
-				background-position: -206px -804px;
+				background-position: -208px -805px;
 			}
 
 			.icon-wzrd-action {
diff --git a/sass/stylesheets/sass/screen.scss b/sass/stylesheets/sass/screen.scss
index fa5c6810bce..dd3f02c7699 100644
--- a/sass/stylesheets/sass/screen.scss
+++ b/sass/stylesheets/sass/screen.scss
@@ -496,7 +496,7 @@ form {
 				&::before {
 					height: 12px;
 					width: 12px;
-					background-position: -48px -804px;
+					background-position: -49px -805px;
 				}
 			}
 
@@ -5362,6 +5362,19 @@ svg {
 	}
 }
 
+.icon-invisible {
+	&:link,
+	&:hover,
+	&:focus {
+		border-bottom: none;
+	}
+
+	&:focus {
+		box-shadow: 0 0 0 2px $btn-border-focus-color;
+		border-radius: 2px;
+	}
+}
+
 button {
 	&.icon-action-command,
 	&.icon-action-close,