AS1024
/
Kanboard-Prod
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Change sidebar style

This commit is contained in:
Frederic Guillot 2016-02-03 18:27:45 -05:00
parent fc0bed2b74
commit 91200ddcde
18 changed files with 53 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ChangeLog
View File

@ -22,6 +22,7 @@ New features:
Improvements:
* Change sidebar style
* Change task summary layout
* Use inline popup for subtasks modification
* Move homepage menus to the user dropdown

2
Makefile
View File

@ -4,7 +4,7 @@ CSS_APP = $(addprefix assets/css/src/, $(addsuffix .css, base links title table
CSS_PRINT = $(addprefix assets/css/src/, $(addsuffix .css, print links table board task comment subtask markdown))
CSS_VENDOR = $(addprefix assets/css/vendor/, $(addsuffix .css, jquery-ui.min jquery-ui-timepicker-addon.min chosen.min fullcalendar.min font-awesome.min c3.min))
JS_APP = $(addprefix assets/js/src/, $(addsuffix .js, Popover Dropdown Tooltip Markdown Sidebar Search App Screenshot Calendar Board Swimlane Gantt Task Project TaskRepartitionChart UserRepartitionChart CumulativeFlowDiagram BurndownChart AvgTimeColumnChart TaskTimeColumnChart LeadCycleTimeChart CompareHoursColumnChart Router))
JS_APP = $(addprefix assets/js/src/, $(addsuffix .js, Popover Dropdown Tooltip Markdown Search App Screenshot Calendar Board Swimlane Gantt Task Project TaskRepartitionChart UserRepartitionChart CumulativeFlowDiagram BurndownChart AvgTimeColumnChart TaskTimeColumnChart LeadCycleTimeChart CompareHoursColumnChart Router))
JS_VENDOR = $(addprefix assets/js/vendor/, $(addsuffix .js, jquery-1.11.3.min jquery-ui.min jquery-ui-timepicker-addon.min jquery.ui.touch-punch.min chosen.jquery.min moment.min fullcalendar.min mousetrap.min mousetrap-global-bind.min jquery.textcomplete))
JS_LANG = $(addprefix assets/js/vendor/lang/, $(addsuffix .js, cs da de es el fi fr hu id it ja nl nb pl pt pt-br ru sv sr th tr zh-cn))

3
app/Template/analytic/layout.php
View File

@ -31,8 +31,7 @@
</li>
</ul>
</div>
<section class="sidebar-container" id="analytic-section">
<section class="sidebar-container">
<?= $this->render($sidebar_template, array('project' => $project)) ?>
<div class="sidebar-content">

2
app/Template/analytic/sidebar.php
View File

@ -23,6 +23,4 @@
<?= $this->url->link(t('Estimated vs actual time'), 'analytic', 'compareHours', 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>

2
app/Template/app/sidebar.php
View File

@ -24,6 +24,4 @@
</li>
<?= $this->hook->render('template:dashboard:sidebar') ?>
</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>

2
app/Template/config/sidebar.php
View File

@ -36,6 +36,4 @@
</li>
<?= $this->hook->render('template:config:sidebar') ?>
</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>

2
app/Template/export/sidebar.php
View File

@ -15,6 +15,4 @@
</li>
<?= $this->hook->render('template:export:sidebar') ?>
</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>

2
app/Template/project/sidebar.php
View File

@ -63,6 +63,4 @@
<?= $this->hook->render('template:project:sidebar', array('project' => $project)) ?>
</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>

2
app/Template/task/layout.php
View File

@ -17,7 +17,7 @@
<?php endif ?>
</ul>
</div>
<section class="sidebar-container" id="task-section">
<section class="sidebar-container">
<?= $this->render($sidebar_template, array('task' => $task)) ?>

2
app/Template/task/sidebar.php
View File

@ -98,6 +98,4 @@
<?= $this->hook->render('template:task:sidebar:actions') ?>
</ul>
<?php endif ?>
<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>

2
app/Template/user/sidebar.php
View File

@ -78,6 +78,4 @@
</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>

2
assets/css/app.css
View File

File diff suppressed because one or more lines are too long

2
assets/css/print.css
View File

File diff suppressed because one or more lines are too long

2
assets/css/src/listing.css
View File

@ -5,7 +5,7 @@
margin-bottom: 20px;
border: 1px solid #ddd;
color: #333;
background-color: #fefefe;
background-color: #fcfcfc;
overflow: auto;
}

115
assets/css/src/sidebar.css
View File

@ -1,90 +1,65 @@
/* sidebar */
.sidebar-container {
margin-top: 10px;
position: relative;
clear: both;
height: 100%;
display: -ms-flexbox;
display: -webkit-box;
display: -moz-box;
display: -ms-box;
display: box;
-ms-flex-direction: row;
-webkit-box-orient: horizontal;
-moz-box-orient: horizontal;
-ms-box-orient: horizontal;
box-orient: horizontal;
}
.sidebar-content {
margin-left: 23%;
width: 76%;
position: absolute;
padding-left: 10px;
-ms-flex: 1;
-webkit-box-flex: 1;
-moz-box-flex: 1;
-ms-box-flex: 1;
box-flex: 1;
}
.sidebar {
width: 20%;
float: left;
padding: 10px;
padding-top: 0;
border: 1px solid #ddd;
background: #fdfdfd;
border-radius: 5px;
padding-right: 10px;
border-right: 1px dotted #eee;
font-size: 0.95em;
width: 240px;
-ms-flex: 0 100px;
-webkit-box-flex: 0;
-moz-box-flex: 0;
-ms-box-flex: 0;
box-flex: 0;
}
.sidebar a {
text-decoration: none;
}
.sidebar li {
list-style-type: square;
margin-left: 30px;
line-height: 1.8em;
list-style-type: none;
line-height: 35px;
border-bottom: 1px dotted #efefef;
}
.sidebar li:hover {
border-left: 5px solid #555;
padding-left: 8px;
}
.sidebar li.active {
border-left: 5px solid #333;
padding-left: 8px;
}
.sidebar li.active a {
color: #000;
color: #333;
font-weight: bold;
text-decoration: none;
}
.sidebar li.active a:focus,
.sidebar li.active a:hover {
text-decoration: underline;
}
.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%;
}
.sidebar-content {
margin-left: 30%;
width: 70%;
}
}
@media only screen and (max-width: 767px) {
.sidebar {
width: 95%;
float: none;
}
.sidebar-content {
margin: 0;
margin-top: 15px;
width: 100%;
}
color: #555;
}

2
assets/js/app.js
View File

File diff suppressed because one or more lines are too long

2
assets/js/src/App.js
View File

@ -1,7 +1,6 @@
function App() {
this.board = new Board(this);
this.markdown = new Markdown();
this.sidebar = new Sidebar();
this.search = new Search(this);
this.swimlane = new Swimlane();
this.dropdown = new Dropdown();
@ -33,7 +32,6 @@ App.prototype.listen = function() {
this.project.listen();
this.popover.listen();
this.markdown.listen();
this.sidebar.listen();
this.tooltip.listen();
this.dropdown.listen();
this.search.listen();

25
assets/js/src/Sidebar.js
View File

@ -1,25 +0,0 @@
function Sidebar() {
}
Sidebar.prototype.expand = function(e) {
e.preventDefault();
$(".sidebar-container").removeClass("sidebar-collapsed");
$(".sidebar-collapse").show();
$(".sidebar h2").show();
$(".sidebar ul").show();
$(".sidebar-expand").hide();
};
Sidebar.prototype.collapse = function(e) {
e.preventDefault();
$(".sidebar-container").addClass("sidebar-collapsed");
$(".sidebar-expand").show();
$(".sidebar h2").hide();
$(".sidebar ul").hide();
$(".sidebar-collapse").hide();
};
Sidebar.prototype.listen = function() {
$(document).on("click", ".sidebar-collapse", this.collapse);
$(document).on("click", ".sidebar-expand", this.expand);
};