diff options
| author | Vjacheslav Trushkin <cyberalien@gmail.com> | 2013-09-27 17:57:18 +0300 |
|---|---|---|
| committer | Vjacheslav Trushkin <cyberalien@gmail.com> | 2013-10-17 21:13:06 +0300 |
| commit | cab21f3a1ef17b81bfaef2231df6fc4c8326939e (patch) | |
| tree | 6ca01ca12ae80c7ee494d8df92873f9331ebef80 | |
| parent | 961a27091e4bd1e35966a9b2b3791cb4803c5592 (diff) | |
| download | forums-cab21f3a1ef17b81bfaef2231df6fc4c8326939e.tar forums-cab21f3a1ef17b81bfaef2231df6fc4c8326939e.tar.gz forums-cab21f3a1ef17b81bfaef2231df6fc4c8326939e.tar.bz2 forums-cab21f3a1ef17b81bfaef2231df6fc4c8326939e.tar.xz forums-cab21f3a1ef17b81bfaef2231df6fc4c8326939e.zip | |
[ticket/11552] Responsive tables in MCP
PHPBB3-11552
| -rw-r--r-- | phpBB/styles/prosilver/template/forum_fn.js | 10 | ||||
| -rw-r--r-- | phpBB/styles/prosilver/template/mcp_warn_front.html | 4 | ||||
| -rw-r--r-- | phpBB/styles/prosilver/template/mcp_warn_list.html | 2 | ||||
| -rw-r--r-- | phpBB/styles/prosilver/theme/responsive.css | 29 |
4 files changed, 40 insertions, 5 deletions
diff --git a/phpBB/styles/prosilver/template/forum_fn.js b/phpBB/styles/prosilver/template/forum_fn.js index 3a871b6461..b10cbff031 100644 --- a/phpBB/styles/prosilver/template/forum_fn.js +++ b/phpBB/styles/prosilver/template/forum_fn.js @@ -587,6 +587,7 @@ function insert_single_user(formId, user) } menu.append(links.clone(true)); menu.find('li.leftside, li.rightside').removeClass('leftside rightside'); + menu.find('.inputbox').parents('li:first').css('white-space', 'normal'); copied = true; } @@ -693,5 +694,14 @@ function insert_single_user(formId, user) $(this).addClass('responsive-hide'); } }); + + // Hide empty responsive tables + $('table.responsive > tbody').each(function() { + var items = $(this).children('tr'); + if (items.length == 0) + { + $(this).parent('table:first').addClass('responsive-hide'); + } + }); }); })(jQuery); diff --git a/phpBB/styles/prosilver/template/mcp_warn_front.html b/phpBB/styles/prosilver/template/mcp_warn_front.html index 5a332cf202..1ede323720 100644 --- a/phpBB/styles/prosilver/template/mcp_warn_front.html +++ b/phpBB/styles/prosilver/template/mcp_warn_front.html @@ -33,7 +33,7 @@ <h3>{L_MOST_WARNINGS}</h3> <!-- IF .highest --> - <table class="table1" cellspacing="0"> + <table class="table1 responsive mcp-warnings" cellspacing="0"> <thead> <tr> <th class="name">{L_USERNAME}</th> @@ -67,7 +67,7 @@ <h3>{L_LATEST_WARNINGS}</h3> <!-- IF .latest --> - <table class="table1" cellspacing="0"> + <table class="table1 responsive mcp-warnings" cellspacing="0"> <thead> <tr> <th class="name">{L_USERNAME}</th> diff --git a/phpBB/styles/prosilver/template/mcp_warn_list.html b/phpBB/styles/prosilver/template/mcp_warn_list.html index cdf2aecc0e..61e449b5b5 100644 --- a/phpBB/styles/prosilver/template/mcp_warn_list.html +++ b/phpBB/styles/prosilver/template/mcp_warn_list.html @@ -21,7 +21,7 @@ </li> </ul> - <table class="table1" cellspacing="0"> + <table class="table1 responsive mcp-warnings" cellspacing="0"> <thead> <tr> <th class="name">{L_USERNAME}</th> diff --git a/phpBB/styles/prosilver/theme/responsive.css b/phpBB/styles/prosilver/theme/responsive.css index aa0da9af91..1e2cb15555 100644 --- a/phpBB/styles/prosilver/theme/responsive.css +++ b/phpBB/styles/prosilver/theme/responsive.css @@ -240,17 +240,37 @@ table.responsive thead { display: none; } +table.responsive th { + display: none; + border-bottom-width: 0 !important; +} + +table.mcp-warnings thead { + display: block; +} + +table.mcp-warnings th:nth-child(1), +table.mcp-warnings th:nth-child(3) { + display: inline; +} + +table.mcp-warnings th:nth-child(1):after { + content: ','; +} + table.responsive tr { overflow: hidden; margin: 5px 0; } -table.mcp-logs td:nth-child(2) { +table.mcp-logs td:nth-child(2), +table.mcp-warnings td:nth-child(2n + 1) { width: 50%; float: left; } -table.mcp-logs td:nth-child(3) { +table.mcp-logs td:nth-child(3), +table.mcp-warnings td:nth-child(2n) { margin-left: 50%; text-align: right; } @@ -292,6 +312,11 @@ p.rightside { margin-bottom: 0; } +.column1, .column2 { + width: auto; + float: none; +} + @media only screen and (max-width: 500px), only screen and (max-device-width: 500px) { p.responsive-center { |