Improve responsive design

This commit is contained in:
Frédéric Guillot 2014-05-23 13:41:57 -04:00
parent 14c2998c4a
commit 86bc091f21
3 changed files with 55 additions and 7 deletions

View File

@ -18,11 +18,11 @@
<div class="project-menu">
<ul>
<li>
<?= t('Filter by user') ?>
<span class="hide-tablet"><?= t('Filter by user') ?></span>
<?= Helper\form_select('user_id', $users, $filters) ?>
</li>
<li>
<?= t('Filter by category') ?>
<span class="hide-tablet"><?= t('Filter by category') ?></span>
<?= Helper\form_select('category_id', $categories, $filters) ?>
</li>
<li><a href="#" id="filter-due-date"><?= t('Filter by due date') ?></a></li>

View File

@ -31,21 +31,23 @@
<?= $project['is_active'] ? t('Active') : t('Inactive') ?>
</td>
<td>
<ul>
<?php if ($project['nb_tasks'] > 0): ?>
<?php if ($project['nb_active_tasks'] > 0): ?>
<a href="?controller=board&amp;action=show&amp;project_id=<?= $project['id'] ?>"><?= t('%d tasks on the board', $project['nb_active_tasks']) ?></a>,
<li><a href="?controller=board&amp;action=show&amp;project_id=<?= $project['id'] ?>"><?= t('%d tasks on the board', $project['nb_active_tasks']) ?></a></li>
<?php endif ?>
<?php if ($project['nb_inactive_tasks'] > 0): ?>
<a href="?controller=project&amp;action=tasks&amp;project_id=<?= $project['id'] ?>"><?= t('%d closed tasks', $project['nb_inactive_tasks']) ?></a>,
<li><a href="?controller=project&amp;action=tasks&amp;project_id=<?= $project['id'] ?>"><?= t('%d closed tasks', $project['nb_inactive_tasks']) ?></a></li>
<?php endif ?>
<?= t('%d tasks in total', $project['nb_tasks']) ?>
<li><?= t('%d tasks in total', $project['nb_tasks']) ?></li>
<?php else: ?>
<?= t('no task for this project') ?>
<li><?= t('no task for this project') ?></li>
<?php endif ?>
</ul>
</td>
<td>
<ul>

View File

@ -83,6 +83,7 @@ td {
padding-bottom: 0.5em;
padding-left: 3px;
padding-right: 3px;
vertical-align: top;
}
th {
@ -420,7 +421,7 @@ header {
header ul {
text-align: right;
font-size: 90%;
font-size: 0.9em;
}
header li {
@ -932,3 +933,48 @@ tr td.task-orange,
padding: 15px;
background: #fff;
}
/* responsive design */
@media only screen and (min-width : 600px) and (max-width : 1024px) {
.hide-tablet {
display: none;
}
.form-column {
float: none;
margin: 0;
padding: 0;
}
#board {
font-size: 0.85em;
}
.project-menu {
font-size: 0.7em;
}
table input[type="text"] {
width: 200px;
}
}
@media only screen and (max-width : 600px) {
header {
font-size: 0.8em;
}
.project-menu {
display: none;
}
#board {
margin-top: 10px;
}
.task-board .task-score {
display: none;
}
}