Add icon to hide/show sidebar

This commit is contained in:
Frederic Guillot 2015-07-18 18:21:48 -04:00
parent e7ff62f5e3
commit 1bce737243
12 changed files with 162 additions and 72 deletions

View File

@ -20,4 +20,6 @@
<?= $this->url->link(t('Lead and cycle time'), 'analytic', 'leadAndCycleTime', array('project_id' => $project['id'])) ?>
</li>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -20,4 +20,6 @@
<?= $this->url->link(t('My activity stream'), 'app', 'activity', array('user_id' => $user['id'])) ?>
</li>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -11,4 +11,6 @@
<?= $this->url->link(t('Cost breakdown'), 'budget', 'breakdown', array('project_id' => $project['id'])) ?>
</li>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -32,4 +32,6 @@
<?= $this->url->link(t('API'), 'config', 'api') ?>
</li>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -14,4 +14,6 @@
<?= $this->url->link(t('Daily project summary'), 'export', 'summary', array('project_id' => $project['id'])) ?>
</li>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -6,47 +6,49 @@
</li>
<?php if ($this->user->isManager($project['id'])): ?>
<li>
<?= $this->url->link(t('Public access'), 'project', 'share', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Integrations'), 'project', 'integration', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Edit project'), 'project', 'edit', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Columns'), 'column', 'index', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Swimlanes'), 'swimlane', 'index', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Categories'), 'category', 'index', array('project_id' => $project['id'])) ?>
</li>
<?php if ($this->user->isAdmin() || $project['is_private'] == 0): ?>
<li>
<?= $this->url->link(t('Users'), 'project', 'users', array('project_id' => $project['id'])) ?>
</li>
<?php endif ?>
<li>
<?= $this->url->link(t('Automatic actions'), 'action', 'index', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Duplicate'), 'project', 'duplicate', array('project_id' => $project['id'])) ?>
</li>
<li>
<?php if ($project['is_active']): ?>
<?= $this->url->link(t('Disable'), 'project', 'disable', array('project_id' => $project['id']), true) ?>
<?php else: ?>
<?= $this->url->link(t('Enable'), 'project', 'enable', array('project_id' => $project['id']), true) ?>
<?php endif ?>
</li>
<?php if ($this->user->isAdmin()): ?>
<li>
<?= $this->url->link(t('Remove'), 'project', 'remove', array('project_id' => $project['id'])) ?>
<?= $this->url->link(t('Public access'), 'project', 'share', array('project_id' => $project['id'])) ?>
</li>
<?php endif ?>
<li>
<?= $this->url->link(t('Integrations'), 'project', 'integration', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Edit project'), 'project', 'edit', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Columns'), 'column', 'index', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Swimlanes'), 'swimlane', 'index', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Categories'), 'category', 'index', array('project_id' => $project['id'])) ?>
</li>
<?php if ($this->user->isAdmin() || $project['is_private'] == 0): ?>
<li>
<?= $this->url->link(t('Users'), 'project', 'users', array('project_id' => $project['id'])) ?>
</li>
<?php endif ?>
<li>
<?= $this->url->link(t('Automatic actions'), 'action', 'index', array('project_id' => $project['id'])) ?>
</li>
<li>
<?= $this->url->link(t('Duplicate'), 'project', 'duplicate', array('project_id' => $project['id'])) ?>
</li>
<li>
<?php if ($project['is_active']): ?>
<?= $this->url->link(t('Disable'), 'project', 'disable', array('project_id' => $project['id']), true) ?>
<?php else: ?>
<?= $this->url->link(t('Enable'), 'project', 'enable', array('project_id' => $project['id']), true) ?>
<?php endif ?>
</li>
<?php if ($this->user->isAdmin()): ?>
<li>
<?= $this->url->link(t('Remove'), 'project', 'remove', array('project_id' => $project['id'])) ?>
</li>
<?php endif ?>
<?php endif ?>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -67,4 +67,6 @@
</li>
<?php endif ?>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -74,4 +74,6 @@
</li>
<?php endif ?>
</ul>
<div class="sidebar-collapse"><a href="#" title="<?= t('Hide sidebar') ?>"><i class="fa fa-chevron-left"></i></a></div>
<div class="sidebar-expand" style="display: none"><a href="#" title="<?= t('Expand sidebar') ?>"><i class="fa fa-chevron-right"></i></a></div>
</div>

View File

@ -1436,6 +1436,33 @@ span.task-board-date-overdue {
line-height: 1.8em;
}
.sidebar-collapsed .sidebar {
width: 10px;
padding-bottom: 0;
float: none;
}
.sidebar-collapsed .sidebar-content {
margin: 0;
margin-top: 15px;
width: 100%;
}
.sidebar-collapse {
text-align: right;
}
.sidebar-collapse a,
.sidebar-expand a {
color: #333;
text-decoration: none;
}
.sidebar-collapse a:hover,
.sidebar-expand a:hover {
color: #DF5353;
}
@media only screen and (max-width: 1024px) {
.sidebar {
width: 25%;
@ -1455,7 +1482,7 @@ span.task-board-date-overdue {
.sidebar-content {
margin: 0;
margin-top: 20px;
margin-top: 15px;
width: 100%;
}
}

View File

@ -27,6 +27,33 @@
line-height: 1.8em;
}
.sidebar-collapsed .sidebar {
width: 10px;
padding-bottom: 0;
float: none;
}
.sidebar-collapsed .sidebar-content {
margin: 0;
margin-top: 15px;
width: 100%;
}
.sidebar-collapse {
text-align: right;
}
.sidebar-collapse a,
.sidebar-expand a {
color: #333;
text-decoration: none;
}
.sidebar-collapse a:hover,
.sidebar-expand a:hover {
color: #DF5353;
}
@media only screen and (max-width: 1024px) {
.sidebar {
width: 25%;
@ -46,7 +73,7 @@
.sidebar-content {
margin: 0;
margin-top: 20px;
margin-top: 15px;
width: 100%;
}
}

File diff suppressed because one or more lines are too long

View File

@ -253,6 +253,26 @@ var Kanboard = (function() {
$("form.search").submit();
});
// Collapse sidebar
$(document).on("click", ".sidebar-collapse", function (e) {
e.preventDefault();
$(".sidebar-container").addClass("sidebar-collapsed");
$(".sidebar-expand").show();
$(".sidebar h2").hide();
$(".sidebar ul").hide();
$(".sidebar-collapse").hide();
});
// Expand sidebar
$(document).on("click", ".sidebar-expand", function (e) {
e.preventDefault();
$(".sidebar-container").removeClass("sidebar-collapsed");
$(".sidebar-collapse").show();
$(".sidebar h2").show();
$(".sidebar ul").show();
$(".sidebar-expand").hide();
});
// Datepicker translation
$.datepicker.setDefaults($.datepicker.regional[$("body").data("js-lang")]);