diff --git a/app/assets/stylesheets/svg-dimensions.css b/app/assets/stylesheets/svg-dimensions.css
index a81438545..efd0d9292 100644
--- a/app/assets/stylesheets/svg-dimensions.css
+++ b/app/assets/stylesheets/svg-dimensions.css
@@ -32,7 +32,7 @@
.icon-lock-open { width: 16px; height: 16px; }
.icon-lock { width: 16px; height: 16px; }
.icon-logo { width: 42px; height: 36px; }
-.icon-logotype { width: 84px; height: 16px; }
+.icon-logotype { width: 91px; height: 15px; }
.icon-long-arrow-right { width: 11px; height: 11px; }
.icon-magnifier { width: 15px; height: 15px; }
.icon-marker { width: 17px; height: 19px; }
diff --git a/app/assets/stylesheets/zammad.scss b/app/assets/stylesheets/zammad.scss
index dde28c149..2f65be11d 100644
--- a/app/assets/stylesheets/zammad.scss
+++ b/app/assets/stylesheets/zammad.scss
@@ -1833,8 +1833,8 @@ kbd {
}
.logotype {
- margin-left: 8px;
- margin-top: -5px;
+ margin-left: 7px;
+ margin-top: -3px;
fill: hsl(225,9%,27%);
}
}
@@ -2272,79 +2272,81 @@ footer {
display: none !important;
}
-.main-navigation {
+.menu {
padding: 0;
margin: 0;
list-style: none;
flex-shrink: 0;
}
- .main-navigation .badge {
+ .menu .badge {
background: $ok-color;
color: hsl(233,10%,16%);
margin-right: 8px;
}
- .main-navigation .zammad-switch {
+ .menu .zammad-switch {
height: 22px;
}
- .main-navigation > li.active .zammad-switch label:after {
- background: white;
- }
-
- .main-navigation > li > a {
+ .menu-item {
padding: 0 15px;
height: 48px;
color: rgba(240, 250, 255, .25);
border-bottom: 1px solid rgba(240, 250, 255, .05);
text-decoration: none;
+ display: flex;
+ align-items: center;
+
+ &:hover {
+ background: hsl(230,10%,13%);
+ border-bottom-color: rgba(240, 250, 255, .08);
+ }
+
+ &.is-active,
+ &.is-hovered {
+ background: none;
+ color: white;
+ }
+
+ &.is-active .menu-item-icon,
+ &.is-active .dropdown-icon,
+ &.is-hovered .menu-item-icon {
+ fill: currentColor;
+ }
+
+ &.is-active,
+ &.is-hovered {
+ background: #389ed9;
+ }
+
+ &.is-active .zammad-switch label:after {
+ background: white;
+ }
+
+ .dropdown-icon {
+ fill: hsl(206,7%,37%);
+ }
+
+ .dropdown-menu {
+ left: 10px;
+ right: 15px;
+ min-width: 0;
+ }
}
- .main-navigation > li > a:hover {
- background: hsl(230,10%,13%);
- border-bottom-color: rgba(240, 250, 255, .08);
- }
-
- .main-navigation > li.active > a,
- .main-navigation > li.is-hovered > a {
- background: none;
- color: white;
- }
-
- .main-navigation > li.active .nav-icon,
- .main-navigation > li.active .dropdown-icon,
- .main-navigation > li.is-hovered .nav-icon {
- fill: currentColor;
- }
-
- .main-navigation li.active > a,
- .main-navigation li.is-hovered > a {
- background: #389ed9;
- }
-
- .main-navigation .dropdown-menu {
- left: 10px;
- right: 15px;
- min-width: 0;
- }
-
- .main-navigation .nav-icon {
+ .menu-item-icon {
margin-right: 15px;
width: 24px;
height: 24px;
fill: hsl(206,7%,37%);
}
- .main-navigation .nav-item-name {
+ .menu-item-name {
flex: 1;
margin-top: 2px;
}
- .main-navigation .dropdown-icon {
- fill: hsl(206,7%,37%);
- }
-
.tasks {
background: #2c2d36;
flex: 1;
diff --git a/contrib/icon-sprite.sketch b/contrib/icon-sprite.sketch
index 606966415..c65e0cfbd 100644
Binary files a/contrib/icon-sprite.sketch and b/contrib/icon-sprite.sketch differ
diff --git a/public/assets/images/icons.svg b/public/assets/images/icons.svg
index 0c72838de..aedcac761 100644
--- a/public/assets/images/icons.svg
+++ b/public/assets/images/icons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/public/assets/images/icons/logotype.svg b/public/assets/images/icons/logotype.svg
index 8e0218b6c..256108d85 100644
--- a/public/assets/images/icons/logotype.svg
+++ b/public/assets/images/icons/logotype.svg
@@ -1,12 +1,12 @@
-