Fix sidebar and colorize header

This commit is contained in:
Julius Haertl
2016-07-31 00:49:30 +02:00
parent 9abd92c4e4
commit 0e7a71787f
5 changed files with 27 additions and 11 deletions

View File

@@ -29,6 +29,16 @@
cursor: pointer; cursor: pointer;
} }
#app-view {
position: relative;
height: 100%;
white-space: nowrap;
overflow: none;
padding: 0;
z-index: 100;
width: 100%;
}
#board-status { #board-status {
position:absolute; position:absolute;
z-index:999; z-index:999;
@@ -54,13 +64,15 @@
width: inherit; width: inherit;
color: #333333; color: #333333;
position:relative; position:relative;
z-index:200; z-index:120;
background-color:#f7f7f7; height: 44px;
background-color: #eee;
} }
#board-header h1 { #board-header h1 {
font-size:14pt; font-size:14pt;
margin: 0; margin: 0;
padding:10px; padding:12px;
padding-left:50px;
} }
#board-actions { #board-actions {
@@ -661,4 +673,4 @@ margin-bottom:2px; width:100%;
.shareOption { .shareOption {
margin-top:4px; margin-top:4px;
} }

View File

@@ -1,4 +1,4 @@
app.filter('lightenColorFilter', function() { app.filter('textColorFilter', function() {
return function (hex) { return function (hex) {
// RGB2HLS by Garry Tan // RGB2HLS by Garry Tan
// http://axonflux.com/handy-rgb-to-hsl-and-rgb-to-hsv-color-model-c // http://axonflux.com/handy-rgb-to-hsl-and-rgb-to-hsv-color-model-c
@@ -40,4 +40,4 @@ app.filter('lightenColorFilter', function() {
} }
} }
}); });

View File

@@ -622,7 +622,7 @@ app.filter('orderObjectBy', function(){
return array; return array;
} }
}); });
app.filter('lightenColorFilter', function() { app.filter('textColorFilter', function() {
return function (hex) { return function (hex) {
// RGB2HLS by Garry Tan // RGB2HLS by Garry Tan
// http://axonflux.com/handy-rgb-to-hsl-and-rgb-to-hsv-color-model-c // http://axonflux.com/handy-rgb-to-hsl-and-rgb-to-hsv-color-model-c
@@ -665,6 +665,7 @@ app.filter('lightenColorFilter', function() {
} }
}); });
// OwnCloud Click Handling // OwnCloud Click Handling
// https://doc.owncloud.org/server/8.0/developer_manual/app/css.html // https://doc.owncloud.org/server/8.0/developer_manual/app/css.html
app.directive('appNavigationEntryUtils', function () { app.directive('appNavigationEntryUtils', function () {

View File

@@ -25,9 +25,10 @@ Util::addScript('deck', 'public/app');
<?php print_unescaped($this->inc('part.navigation')); ?> <?php print_unescaped($this->inc('part.navigation')); ?>
<?php print_unescaped($this->inc('part.settings')); ?> <?php print_unescaped($this->inc('part.settings')); ?>
</div> </div>
<route-loading-indicator /> <div id="app-content" ng-class="{ 'details-visible': sidebar.show }">
<div id="app-content" ui-view ng-class="{ 'details-visible': sidebar.show }" ng-if='!isRouteLoading' > <div id="app-view" ui-view></div>
</div> </div>
<route-loading-indicator />
<script type="text/ng-template" id="/boardlist.mainView.html"> <script type="text/ng-template" id="/boardlist.mainView.html">

View File

@@ -4,10 +4,11 @@
<h2>{{ statusservice.title }}</h2> <h2>{{ statusservice.title }}</h2>
<p>{{ statusservice.text }}</p></div> <p>{{ statusservice.text }}</p></div>
</div> </div>
<div id="board-header"> <div id="board-header" style="background-color: {{boardservice.getCurrent().color | lightenColorFilter}}; color: {{boardservice.getCurrent().color | textColorFilter }};">
<h1> <h1>
{{ boardservice.data[id].title }} {{ boardservice.data[id].title }}
<div id="board-actions"> <div id="board-actions">
<!--
<div><i class="fa fa-filter"> </i> Filter</div> <div><i class="fa fa-filter"> </i> Filter</div>
<div><i class="icon icon-search"> </i> {{ searchText }}</div> <div><i class="icon icon-search"> </i> {{ searchText }}</div>
<div class="filter"><span class="filter-button" ng-click="status.filter.label=!status.filter.label">by label <i class="fa fa-caret-down"> </i></span></div> <div class="filter"><span class="filter-button" ng-click="status.filter.label=!status.filter.label">by label <i class="fa fa-caret-down"> </i></span></div>
@@ -18,9 +19,10 @@
<ul class="filter-select bubble" ng-if="status.filter.assignee"> <ul class="filter-select bubble" ng-if="status.filter.assignee">
<li ng-repeat="label in boardservice.data[id].labels"><span style="background-color:#{{ label.color }};"> </span> {{ label.title }}</li> <li ng-repeat="label in boardservice.data[id].labels"><span style="background-color:#{{ label.color }};"> </span> {{ label.title }}</li>
</ul> </ul>
//-->
<div class="board-action-button"><a class="fa fa-archive" ui-sref="board.archive({ id: id })"> </a></div> <div class="board-action-button"><a class="fa fa-archive" ui-sref="board.archive({ id: id })"> </a></div>
<div class="board-action-button"><a class="fa fa-ellipsis-h" ui-sref="board.detail({ id: id })"> </a></div> <div class="board-action-button"><a class="fa fa-info" ui-sref="board.detail({ id: id })"> </a></div>
</div> </div>
</h1> </h1>