[ticket/11552] Responsive CP tabs

PHPBB3-11552

phpBB/styles/prosilver/theme/colours.css

@@ -857,6 +857,16 @@ ul.cplist {
 	color: #333333;
 }
 
+/* Responsive tabs
+----------------------------------------*/
+.responsive-tab .responsive-tab-link span:before {
+	border-color: #536482;
+}
+
+.responsive-tab .responsive-tab-link:hover span:before {
+	border-color: #BC2A4D;
+}
+
 /* UCP navigation menu
 ----------------------------------------*/
 
@@ -1143,3 +1153,9 @@ ul.responsive-popup {
 .navbar ul.responsive-popup {
 	background-color: #CADCEB;
 }
+
+#tabs ul.responsive-tabs {
+	background: #CADCEB;
+	border-color: #c0c9d5;
+	box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.4);
+}

phpBB/styles/prosilver/theme/common.css

@@ -600,7 +600,7 @@ dl.details dd {
 	text-overflow: ellipsis;
 }
 
-.clearfix, #tabs, #minitabs, fieldset dl, ul.topiclist dl, dl.polls {
+.clearfix, #minitabs, fieldset dl, ul.topiclist dl, dl.polls {
 	height: 1%;
 	overflow: hidden;
 }

phpBB/styles/prosilver/theme/cp.css

@@ -118,7 +118,7 @@ ul.cplist {
 #tabs {
 	line-height: normal;
 	margin: 20px 0 -1px 7px;
-	min-width: 570px;
+	*overflow: hidden;
 }
 
 #tabs ul {
@@ -127,6 +127,12 @@ ul.cplist {
 	list-style: none;
 }
 
+#tabs ul:after {
+	content: '';
+	display: block;
+	clear: both;
+}
+
 #tabs li {
 	display: inline;
 	margin: 0;
@@ -210,6 +216,57 @@ ul.cplist {
 	text-decoration: none;
 }
 
+/* Responsive tabs
+----------------------------------------*/
+.responsive-tab .responsive-tab-link span {
+	display: inline-block;
+	font-size: 16px;
+	position: relative;
+	width: 16px;
+	line-height: 14px;
+	text-decoration: none;
+}
+
+.responsive-tab .responsive-tab-link span:before {
+	content: '';
+	position: absolute;
+	left: 5px;
+	top: 8px;
+	height: .125em;
+	width: 14px;
+	border-bottom: 0.125em solid transparent;
+	border-top: 0.375em double transparent;
+}
+
+#tabs ul {
+	position: relative;
+}
+
+#tabs ul.responsive-tabs {
+	position: absolute;
+	right: 0;
+	top: 26px;
+	z-index: 2;
+	border: 1px solid transparent;
+	border-radius: 5px;
+}
+
+#tabs .responsive-tabs li {
+	display: block !important;
+}
+
+#tabs .responsive-tabs a, #tabs .responsive-tabs a span {
+	background: transparent;
+	float: none;
+	margin: 0;
+	padding: 0;
+	text-align: right;
+}
+
+#tabs .responsive-tabs a span {
+	padding: 5px;
+}
+
 /* UCP navigation menu
 ----------------------------------------*/
 /* Container for sub-navigation list */

phpBB/styles/prosilver/theme/responsive.css

@@ -169,4 +169,4 @@ ul.topiclist.forums dd.topics dfn, ul.topiclist.topics dd.posts dfn {
 ----------------------------------------*/
 .pagination {
 	margin: 5px 0;
-}
+}