[ticket/12648] More style fixes and also cleaned up CP left navigation

PHPBB3-12648

phpBB/styles/prosilver/theme/colours.css

@@ -50,7 +50,7 @@ hr {
 }
 
 .navbar {
-	background-color: #cadceb;
+	background-color: #CADCEB;
 }
 
 .forabg {
@@ -92,7 +92,7 @@ table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
 	background-color: #e1ebf2;
 }
 
-.bg3	{ background-color: #cadceb; }
+.bg3	{ background-color: #CADCEB; }
 
 .ucprowbg {
 	background-color: #DCDEE2;
@@ -826,6 +826,7 @@ ul.cplist {
 	background: -o-linear-gradient(top, #E2F2FF 0%, #CADCEB 100%);
 	background: -ms-linear-gradient(top, #E2F2FF 0%, #CADCEB 100%);
 	background: linear-gradient(to bottom, #E2F2FF 0%, #CADCEB 100%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2F2FF', endColorstr='#CADCEB', GradientType=0 );
 	border-color: #CADCEB;
 	box-shadow: 0 1px 1px #F2F9FF inset;
 	color: #333333;
@@ -863,35 +864,47 @@ ul.cplist {
 /* Link styles for the sub-section links */
 #navigation a {
 	color: #333;
-	background-color: #B2C2CF;
-	background-image: url("./images/bg_menu.gif");
+	background: #B4C4D1;
+	background: -moz-linear-gradient(left, #B4C4D1 50%, #CADCEB 100%);
+	background: -webkit-gradient(left top, right top, color-stop(50%, #B4C4D1), color-stop(100%, #CADCEB));
+	background: -webkit-linear-gradient(left, #B4C4D1 50%, #CADCEB 100%);
+	background: -o-linear-gradient(left, #B4C4D1 50%, #CADCEB 100%);
+	background: -ms-linear-gradient(left, #B4C4D1 50%, #CADCEB 100%);
+	background: linear-gradient(to right, #B4C4D1 50%, #CADCEB 100%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#B4C4D1', endColorstr='#CADCEB', GradientType=1 );
 }
 
 .rtl #navigation a {
-	background-image: url("./images/bg_menu_rtl.gif");
-	background-position: 0 100%;
+	background: #B4C4D1;
+	background: -moz-linear-gradient(left, #CADCEB 0%, #B4C4D1 50%);
+	background: -webkit-gradient(left top, right top, color-stop(0%, #CADCEB), color-stop(50%, #B4C4D1));
+	background: -webkit-linear-gradient(left, #CADCEB 0%, #B4C4D1 50%);
+	background: -o-linear-gradient(left, #CADCEB 0%, #B4C4D1 50%);
+	background: -ms-linear-gradient(left, #CADCEB 0%, #B4C4D1 50%);
+	background: linear-gradient(to right, #CADCEB 0%, #B4C4D1 50%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CADCEB', endColorstr='#B4C4D1', GradientType=1 );
 }
 
 #navigation a:hover {
-	background-image: none;
-	background-color: #aabac6;
+	background: #AABAC6;
 	color: #BC2A4D;
+	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 }
 
 #navigation #active-subsection a {
+	background: #F9F9F9;
 	color: #D31141;
-	background-color: #F9F9F9;
-	background-image: none;
+	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 }
 
 #navigation #active-subsection a:hover {
 	color: #D31141;
 }
 
-@media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
+@media only screen and (max-width: 900px), only screen and (max-device-width: 900px)
 {
 	#navigation a, .rtl #navigation a {
-		background-image: none;
+		background: #B2C2CF;
 	}
 }
 

phpBB/styles/prosilver/theme/cp.css

@@ -97,46 +97,40 @@ ul.cplist {
 }
 
 .tabs-container:after {
-	display: block;
 	clear: both;
 	content: '';
+	display: block;
 }
 
-/* CP tabbed menu
+/* CP tabs shared
 ----------------------------------------*/
-#tabs {
+#tabs, #minitabs {
 	line-height: normal;
-	margin: 20px 0 0 7px;
-	/**overflow: hidden;*/
 }
 
-#tabs > ul {
+#tabs > ul, #minitabs > ul {
 	list-style: none;
-	margin:0;
+	margin: 0;
 	padding: 0;
 	position: relative;
 }
 
-#tabs > ul:after {
+#tabs > ul:after, #minitabs > ul:after {
+	clear: both;
 	content: '';
 	display: block;
-	clear: both;
 }
 
-#tabs .tab {
-	display: inline;
+#tabs .tab, #minitabs .tab {
+	display: inline-block;
 	float: left;
 	font-size: 1em;
 	font-weight: bold;
 	line-height: 14px;
 }
 
-#tabs .tab > a {
-	background: none no-repeat 0% -35px;
-	border: 1px solid transparent;
-	border-radius: 4px 4px 0 0;
+#tabs .tab > a, #minitabs .tab > a {
 	display: block;
-	margin: 1px 1px 0 0;
 	padding: 5px 9px;
 	position: relative;
 	text-decoration: none;
@@ -144,6 +138,18 @@ ul.cplist {
 	cursor: pointer;
 }
 
+/* CP tabbed menu 
+----------------------------------------*/
+#tabs {
+	margin: 20px 0 0 7px;
+}
+
+#tabs .tab > a {
+	border: 1px solid transparent;
+	border-radius: 4px 4px 0 0;
+	margin: 1px 1px 0 0;
+}
+
 #tabs .activetab > a {
 	margin-top: 0;
 	padding-bottom: 7px;
@@ -152,7 +158,6 @@ ul.cplist {
 /* Mini tabbed menu used in MCP
 ----------------------------------------*/
 #minitabs {
-	line-height: normal;
 	margin: -20px 7px 0 0;
 }
 
@@ -162,27 +167,13 @@ ul.cplist {
 	max-width: 50%;
 }
 
-#minitabs > ul {
-	list-style: none;
-	margin:0;
-	padding: 0;
-	position: relative;
-}
-
 #minitabs .tab {
-	display: inline;
 	float: right;
-	font-size: 1em;
-	font-weight: bold;
-	line-height: 14px;
 }
 
 #minitabs .tab > a {
 	border-radius: 5px 5px 0 0;
-	display: block;
 	margin-left: 2px;
-	padding: 5px 9px;
-	position: relative;
 }
 
 #minitabs .tab > a:hover {
@@ -196,7 +187,7 @@ ul.cplist {
 }
 
 .responsive-tab > a.responsive-tab-link {
-	display: inline-block;
+	display: block;
 	font-size: 16px;
 	position: relative;
 	width: 16px;
@@ -256,15 +247,15 @@ ul.cplist {
 }
 
 #navigation ul {
-	list-style:none;
+	list-style: none;
 }
 
 /* Default list state */
 #navigation li {
+	display: inline;
+	font-weight: bold;
 	margin: 1px 0;
 	padding: 0;
-	font-weight: bold;
-	display: inline;
 }
 
 /* Link styles for the sub-section links */
@@ -273,18 +264,10 @@ ul.cplist {
 	padding: 5px;
 	margin: 1px 0;
 	text-decoration: none;
-	font-weight: bold;
-	background: transparent none repeat-y 100% 0;
 }
 
 #navigation a:hover {
 	text-decoration: none;
-	background-image: none;
-}
-
-#navigation #active-subsection a {
-	display: block;
-	background-image: none;
 }
 
 /* Preferences pane layout