From 522d5cc3f46c3617af939c58e78101dd9887dd2c Mon Sep 17 00:00:00 2001
From: Vjacheslav Trushkin <cyberalien@gmail.com>
Date: Sat, 26 Oct 2013 22:45:55 +0300
Subject: [ticket/11957] Responsive ACP permissions

PHPBB3-11957
---
 phpBB/adm/style/acp_permission_roles.html |  2 +-
 phpBB/adm/style/acp_permissions.html      | 14 +++----
 phpBB/adm/style/admin.css                 | 70 +++++++++++++++++++++++++++++++
 phpBB/adm/style/permission_mask.html      |  2 +-
 4 files changed, 79 insertions(+), 9 deletions(-)

(limited to 'phpBB/adm/style')

diff --git a/phpBB/adm/style/acp_permission_roles.html b/phpBB/adm/style/acp_permission_roles.html
index 22272d806c..d4f7bbdf36 100644
--- a/phpBB/adm/style/acp_permission_roles.html
+++ b/phpBB/adm/style/acp_permission_roles.html
@@ -91,7 +91,7 @@
 			<!-- BEGIN auth -->
 			<div class="permissions-panel" id="options00{auth.S_ROW_COUNT}"<!-- IF auth.S_FIRST_ROW --><!-- ELSE --> style="display: none;"<!-- ENDIF -->>
 				<div class="tablewrap">
-					<table id="table00{auth.S_ROW_COUNT}" cellspacing="1">
+					<table id="table00{auth.S_ROW_COUNT}" cellspacing="1" class="not-responsive">
 					<colgroup>
 						<col class="permissions-name" />
 						<col class="permissions-yes" />
diff --git a/phpBB/adm/style/acp_permissions.html b/phpBB/adm/style/acp_permissions.html
index 88a82532a1..6dc9dca2e7 100644
--- a/phpBB/adm/style/acp_permissions.html
+++ b/phpBB/adm/style/acp_permissions.html
@@ -110,7 +110,7 @@
 
 		<!-- ELSEIF S_SELECT_USERGROUP -->
 
-		<div style="float: {S_CONTENT_FLOW_BEGIN}; width: 48%;">
+		<div class="column1">
 
 		<!-- IF S_CAN_SELECT_USER -->
 
@@ -155,7 +155,7 @@
 
 		</div>
 
-		<div style="float: {S_CONTENT_FLOW_END}; width: 48%">
+		<div class="column2">
 
 		<!-- IF S_CAN_SELECT_GROUP -->
 
@@ -200,7 +200,7 @@
 
 	<!-- ELSEIF S_SELECT_USERGROUP_VIEW -->
 
-		<div style="float: {S_CONTENT_FLOW_BEGIN}; width: 48%;">
+		<div class="column1">
 
 			<h1>{L_USERS}</h1>
 
@@ -241,7 +241,7 @@
 
 		</div>
 
-		<div style="float: {S_CONTENT_FLOW_END}; width: 48%">
+		<div class="column2">
 
 			<h1>{L_USERGROUPS}</h1>
 
@@ -324,7 +324,7 @@
 		</form>
 	<!-- ENDIF -->
 
-	<br /><br />
+	<br class="responsive-hide" /><br class="responsive-hide" />
 
 	<!-- include tooltip file -->
 	<script type="text/javascript" src="style/tooltip.js"></script>
@@ -340,7 +340,7 @@
 
 	<!-- INCLUDE permission_mask.html -->
 
-	<br /><br />
+	<br class="responsive-hide" /><br class="responsive-hide" />
 
 	<fieldset class="quick" style="float: {S_CONTENT_FLOW_END};">
 		<input class="button1" type="submit" name="action[apply_all_permissions]" value="{L_APPLY_ALL_PERMISSIONS}" />
@@ -348,7 +348,7 @@
 		{S_FORM_TOKEN}
 	</fieldset>
 
-	<br /><br />
+	<br class="responsive-hide" /><br class="responsive-hide" />
 
 	</form>
 
diff --git a/phpBB/adm/style/admin.css b/phpBB/adm/style/admin.css
index bdcda9f299..fc565f8713 100644
--- a/phpBB/adm/style/admin.css
+++ b/phpBB/adm/style/admin.css
@@ -1224,6 +1224,7 @@ select#full_folder_action {
 	}
 
 	fieldset.quick, p.quick {
+		float: none !important;
 		text-align: center;
 	}
 
@@ -1861,6 +1862,15 @@ li.pagination ul {
 /* Permission interface
 ---------------------------------------- */
 
+.column1, .column2 {
+	width: 48%;
+	float: left;
+}
+
+.ltr .column2, .rtl .column1 {
+	float: right;
+}
+
 fieldset.permissions legend {
 	text-transform: none;
 }
@@ -2149,6 +2159,66 @@ fieldset.permissions .padding {
 	padding: 0;
 }
 
+@media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
+{
+	.column1, .column2 {
+		float: none !important;
+		width: auto;
+	}
+
+	.permissions-simple {
+		clear: both;
+	}
+
+	.permissions-simple td, .permissions-simple dd {
+		width: auto !important;
+		margin-left: 0 !important;
+		margin-right: 0 !important;
+	}
+
+	.permissions-simple dd {
+		margin-top: 5px;
+	}
+
+	.permissions-panel .tablewrap {
+		margin: 0 5px;
+	}
+
+	.permissions-category {
+		min-width: 0;
+		margin: 0 !important;
+	}
+
+	.permissions-category a, .permissions-category a span.tabbg {
+		display: block;
+		float: none !important;
+		background: transparent none;
+	}
+
+	.permissions-category a {
+		background: #d9e5ee;
+		margin: 5px 0;
+		padding: 0 !important;
+		border-radius: 3px;
+		text-decoration: underline;
+	}
+
+	.permissions-category .activetab a {
+		background-color: #dd6900;
+		color: #fff;
+	}
+
+	.permissions-category a span.tabbg {
+		color: inherit !important;
+		padding-top: 6px !important;
+		padding-bottom: 6px !important;
+	}
+
+	.permissions-category .activetab span.colour {
+		border-color: #fff;
+	}
+}
+
 /* Avatars gallery
 ---------------------------------------- */
 #gallery {
diff --git a/phpBB/adm/style/permission_mask.html b/phpBB/adm/style/permission_mask.html
index ac65754a14..003e8369ca 100644
--- a/phpBB/adm/style/permission_mask.html
+++ b/phpBB/adm/style/permission_mask.html
@@ -76,7 +76,7 @@
 	<!-- BEGIN category -->
 		<div class="permissions-panel" id="options{p_mask.S_ROW_COUNT}{p_mask.f_mask.S_ROW_COUNT}{p_mask.f_mask.category.S_ROW_COUNT}" <!-- IF p_mask.S_FIRST_ROW and p_mask.f_mask.S_FIRST_ROW and p_mask.f_mask.category.S_FIRST_ROW --><!-- ELSE --> style="display: none;"<!-- ENDIF -->>
 			<div class="tablewrap">
-				<table id="table{p_mask.S_ROW_COUNT}{p_mask.f_mask.S_ROW_COUNT}{p_mask.f_mask.category.S_ROW_COUNT}" cellspacing="1">
+				<table id="table{p_mask.S_ROW_COUNT}{p_mask.f_mask.S_ROW_COUNT}{p_mask.f_mask.category.S_ROW_COUNT}" cellspacing="1" class="not-responsive">
 				<colgroup>
 					<col class="permissions-name" />
 					<col class="permissions-yes" />
-- 
cgit v1.2.1