From: Marcel Werk <burntime@woltlab.com>
Date: Fri, 17 Jun 2016 14:43:50 +0000 (+0200)
Subject: slightly overhauled main menu / user panel
X-Git-Tag: 3.0.0_Beta_1~1405
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=c4dc4aaabe15ebfb5edefaf0a3d9b4449bfbaa76;p=GitHub%2FWoltLab%2FWCF.git

slightly overhauled main menu / user panel
---

diff --git a/wcfsetup/install/files/style/layout/pageHeader.scss b/wcfsetup/install/files/style/layout/pageHeader.scss
index 348566994b..dfebe73ca0 100644
--- a/wcfsetup/install/files/style/layout/pageHeader.scss
+++ b/wcfsetup/install/files/style/layout/pageHeader.scss
@@ -55,11 +55,12 @@
 			flex: 0 0 auto;
 			
 			> a {
+				background: $wcfHeaderMenuLinkBackground;
 				align-items: center;
 				color: $wcfHeaderMenuLink;
 				display: flex;
 				height: 50px;
-				padding: 0 10px;
+				padding: 0 15px;
 				
 				> span {
 					flex: 0 0 auto;
@@ -76,13 +77,9 @@
 				cursor: default;
 			}
 			
-			&.active > a {
-				background: linear-gradient(to top, $wcfHeaderMenuBackground 0%, $wcfHeaderMenuBackgroundActive 50%);
-				color: $wcfHeaderMenuLinkActive;
-			}
-			
+			&.active > a,
 			&:hover > a {
-				background: $wcfHeaderMenuBackgroundActive;
+				background: $wcfHeaderMenuLinkBackgroundActive;
 				color: $wcfHeaderMenuLinkActive;
 			}
 		}
@@ -93,6 +90,19 @@
 			&:hover .boxMenuDepth1 {
 				visibility: visible;
 			}
+			
+			> a {
+				&::after {
+					content: $fa-var-angle-down;
+					display: block;
+					font-family: 'FontAwesome';
+					font-size: 14px;
+					height: 24px;
+					line-height: 24px;
+					margin-left: 5px;
+					width: 10px;
+				}
+			}
 		}
 		
 		.boxMenuDepth1 {
@@ -194,11 +204,12 @@
 			
 			> a {
 				align-items: center;
+				background: $wcfHeaderMenuLinkBackground;
 				color: $wcfHeaderMenuLink;
 				display: flex;
 				flex: 0 0 auto;
 				height: 50px;
-				padding: 0 10px;
+				padding: 0 15px;
 				position: relative;
 				
 				/* set icon color */
@@ -223,13 +234,9 @@
 			}
 			
 			&.dropdownOpen > a,
-			&.open > a {
-				background: linear-gradient(to top, $wcfHeaderMenuBackground 0%, $wcfHeaderMenuBackgroundActive 50%);
-				color: $wcfHeaderMenuLinkActive;
-			}
-			
+			&.open > a,
 			&:hover > a {
-				background: $wcfHeaderMenuBackgroundActive;
+				background: $wcfHeaderMenuLinkBackgroundActive;
 				color: $wcfHeaderMenuLinkActive;
 			}
 			
@@ -386,7 +393,7 @@
 		}
 		
 		&:hover::before {
-			background-color: $wcfHeaderMenuBackgroundActive;
+			background-color: $wcfHeaderMenuLinkBackgroundActive;
 			color: $wcfHeaderMenuLinkActive;
 		}
 	}
diff --git a/wcfsetup/install/files/style/layout/pageHeaderSticky.scss b/wcfsetup/install/files/style/layout/pageHeaderSticky.scss
index 7020703ccb..a9bff6662b 100644
--- a/wcfsetup/install/files/style/layout/pageHeaderSticky.scss
+++ b/wcfsetup/install/files/style/layout/pageHeaderSticky.scss
@@ -83,24 +83,22 @@
 		}
 		
 		.pageHeaderSearch {
-			align-self: stretch;
-			flex: 0 0 50px;
+			flex: 0 0 62px;
 			margin-bottom: 0;
 			margin-left: 10px;
 			order: 3;
 			
 			.pageHeaderSearchLabel {
-				background-color: $wcfHeaderMenuBackground;
-				bottom: 0;
+				background: $wcfHeaderMenuLinkBackground;
 				color: $wcfHeaderMenuLink;
 				cursor: pointer;
 				display: block;
-				position: absolute;
-				top: 0;
-				width: 50px;
+				height: 50px;
+				position: relative;
+				width: 62px;
 				
 				&:hover {
-					background: $wcfHeaderMenuBackgroundActive;
+					background: $wcfHeaderMenuLinkBackgroundActive;
 					color: $wcfHeaderMenuLinkActive;
 				}
 				
@@ -112,7 +110,7 @@
 					font-size: 28px;
 					line-height: 32px;
 					position: absolute;
-					right: 11px;
+					right: 18px;
 					top: 50%;
 					transform: translateY(-50%);
 				}
@@ -135,7 +133,7 @@
 			}
 			
 			.pageHeaderSearchLabel {
-				background: $wcfHeaderMenuBackgroundActive;
+				background: $wcfHeaderMenuLinkBackgroundActive;
 				color: $wcfHeaderMenuLinkActive;
 			}
 		}
diff --git a/wcfsetup/install/files/style/layout/pageNavigation.scss b/wcfsetup/install/files/style/layout/pageNavigation.scss
index 0b06410fb2..a2f55c460c 100644
--- a/wcfsetup/install/files/style/layout/pageNavigation.scss
+++ b/wcfsetup/install/files/style/layout/pageNavigation.scss
@@ -23,10 +23,6 @@
 				color: $wcfNavigationLinkActive;
 			}
 		}
-		
-		.breadcrumbs {
-			margin-left: 10px;
-		}
 	}
 	
 	.boxesHeaderBoxes + .pageNavigation {
@@ -37,7 +33,6 @@
 		display: flex;
 		flex: 0 0 auto;
 		flex-direction: row-reverse;
-		margin-right: 10px;
 		
 		> li {
 			flex: 0 0 auto;
diff --git a/wcfsetup/install/files/style/ui/redactor.scss b/wcfsetup/install/files/style/ui/redactor.scss
index ba88eb5706..15b9fc38d4 100644
--- a/wcfsetup/install/files/style/ui/redactor.scss
+++ b/wcfsetup/install/files/style/ui/redactor.scss
@@ -230,7 +230,7 @@
 			&:hover,
 			&.redactor-act,
 			&.dropact {
-				background-color: $wcfHeaderMenuBackgroundActive;
+				background-color: $wcfHeaderMenuLinkBackgroundActive;
 				color: $wcfHeaderMenuLinkActive;
 			}
 			
diff --git a/wcfsetup/install/files/style/ui/userProfile.scss b/wcfsetup/install/files/style/ui/userProfile.scss
index f793b92e18..dfc4b4e86f 100644
--- a/wcfsetup/install/files/style/ui/userProfile.scss
+++ b/wcfsetup/install/files/style/ui/userProfile.scss
@@ -247,7 +247,7 @@
 			
 			&:hover {
 				> a {
-					background-color: $wcfHeaderMenuBackgroundActive;
+					background-color: $wcfHeaderMenuLinkBackgroundActive;
 					color: $wcfHeaderMenuLinkActive;
 				}
 				
diff --git a/wcfsetup/setup/db/install.sql b/wcfsetup/setup/db/install.sql
index ea73cea53f..8c39f85dd1 100644
--- a/wcfsetup/setup/db/install.sql
+++ b/wcfsetup/setup/db/install.sql
@@ -2045,10 +2045,11 @@ INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderT
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderLink', 'rgba(255, 255, 255, .8)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderLinkActive', 'rgba(255, 255, 255, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuBackground', 'rgba(44, 62, 80, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuBackgroundActive', 'rgba(34, 49, 63, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuLinkBackground', 'rgba(39, 54, 68, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuLinkBackgroundActive', 'rgb(19, 34, 48, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuLink', 'rgba(255, 255, 255, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuLinkActive', 'rgba(255, 255, 255, 1)');
-INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuDropdownBackground', 'rgba(34, 49, 63, 1)');
+INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuDropdownBackground', 'rgb(19, 34, 48, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuDropdownBackgroundActive', 'rgba(55, 73, 95, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuDropdownBorder', 'rgba(55, 73, 95, 1)');
 INSERT INTO wcf1_style_variable (variableName, defaultValue) VALUES ('wcfHeaderMenuDropdownLink', 'rgba(255, 255, 255, 1)');