1
0
mirror of https://github.com/phpbb/phpbb.git synced 2025-05-31 19:49:20 +02:00

[ticket/11552] Responsive tables in MCP

PHPBB3-11552
This commit is contained in:
Vjacheslav Trushkin 2013-09-27 17:57:18 +03:00
parent 961a27091e
commit cab21f3a1e
4 changed files with 40 additions and 5 deletions

View File

@ -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);

View File

@ -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>

View File

@ -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>

View File

@ -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 {