diff --git a/app/coffee/modules/common.coffee b/app/coffee/modules/common.coffee index 11d3fa79..594469a8 100644 --- a/app/coffee/modules/common.coffee +++ b/app/coffee/modules/common.coffee @@ -29,10 +29,10 @@ module = angular.module("taigaCommon", []) CheckPermissionDirective = -> render = ($el, project, permission) -> - $el.show() if project.my_permissions.indexOf(permission) > -1 + $el.removeClass('hidden') if project.my_permissions.indexOf(permission) > -1 link = ($scope, $el, $attrs) -> - $el.hide() + $el.addClass('hidden') permission = $attrs.tgCheckPermission $scope.$watch "project", (project) -> diff --git a/app/fonts/taiga.eot b/app/fonts/taiga.eot index 4d7ef8bb..3993e361 100644 Binary files a/app/fonts/taiga.eot and b/app/fonts/taiga.eot differ diff --git a/app/fonts/taiga.svg b/app/fonts/taiga.svg index ff41af91..f347cfdc 100644 --- a/app/fonts/taiga.svg +++ b/app/fonts/taiga.svg @@ -11,39 +11,41 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/app/fonts/taiga.ttf b/app/fonts/taiga.ttf index 8fb9b030..a41437dd 100644 Binary files a/app/fonts/taiga.ttf and b/app/fonts/taiga.ttf differ diff --git a/app/fonts/taiga.woff b/app/fonts/taiga.woff index 14d2f8f5..383aba43 100644 Binary files a/app/fonts/taiga.woff and b/app/fonts/taiga.woff differ diff --git a/app/partials/views/modules/kanban-table.jade b/app/partials/views/modules/kanban-table.jade index 6f29b442..9e1b74c2 100644 --- a/app/partials/views/modules/kanban-table.jade +++ b/app/partials/views/modules/kanban-table.jade @@ -1,24 +1,26 @@ -div.kanban-table +div.kanban-table //-.fold div.kanban-table-header div.kanban-table-inner(tg-kanban-row-width-fixer) h2.task-colum-name(ng-repeat="s in usStatusList track by s.id", ng-style="{'border-top-color':s.color}") span(tg-bo-bind="s.name") + div.options + a.icon.icon-vfold.hfold(href="", title="Fold") + a.icon.icon-vunfold.hunfold(href="", title="Unfold") //-.hidden + a.icon.icon-vfold(href="", title="Minimize", + ng-if="statusViewModes[s.id] == 'maximized'", + ng-click="ctrl.updateStatusViewMode(s.id, 'minimized')") + a.icon.icon-vunfold(href="", title="Maximize", + ng-if="statusViewModes[s.id] == 'minimized'", + ng-click="ctrl.updateStatusViewMode(s.id, 'maximized')") - a.icon.icon-minimize(href="", title="Minimize", - ng-if="statusViewModes[s.id] == 'maximized'", - ng-click="ctrl.updateStatusViewMode(s.id, 'minimized')") - a.icon.icon-maximize(href="", title="Maximize", - ng-if="statusViewModes[s.id] == 'minimized'", - ng-click="ctrl.updateStatusViewMode(s.id, 'maximized')") + a.icon.icon-plus(href="", title="Add New task", + ng-click="ctrl.addNewUs('standard', s.id)", + tg-check-permission="add_us") - a.icon.icon-plus(href="", title="Add New task", - ng-click="ctrl.addNewUs('standard', s.id)", - tg-check-permission="add_us") - - a.icon.icon-bulk(href="", title="Add New bulk", - ng-click="ctrl.addNewUs('bulk', s.id)", - tg-check-permission="add_us") + a.icon.icon-bulk(href="", title="Add New bulk", + ng-click="ctrl.addNewUs('bulk', s.id)", + tg-check-permission="add_us") div.kanban-table-body div.kanban-table-inner(tg-kanban-row-width-fixer) diff --git a/app/styles/layout/typography.scss b/app/styles/layout/typography.scss index 6ff57c9e..df7f1103 100755 --- a/app/styles/layout/typography.scss +++ b/app/styles/layout/typography.scss @@ -138,108 +138,115 @@ a:visited { .icon-search:before { content: 'd'; } -.icon-video:before { +.icon-wiki:before { content: 'e'; } -.icon-wiki:before { +.icon-settings:before { content: 'f'; } -.icon-settings:before { +.icon-move:before { content: 'g'; } -.icon-move:before { +.icon-filter:before { content: 'h'; } -.icon-filter:before { +.icon-arrow-up:before { content: 'i'; } -.icon-arrow-up:before { +.icon-arrow-right:before { content: 'j'; } -.icon-arrow-right:before { +.icon-arrow-left:before { content: 'k'; } -.icon-arrow-left:before { +.icon-arrow-bottom:before { content: 'l'; } -.icon-arrow-bottom:before { +.icon-edit:before { content: 'm'; } -.icon-edit:before { +.icon-delete:before { content: 'n'; } -.icon-delete:before { +.icon-iocaine:before { content: 'o'; } -.icon-iocaine:before { +.icon-drag-h:before { content: 'p'; } -.icon-drag-h:before { +.icon-drag-v:before { content: 'q'; } -.icon-drag-v:before { +.icon-document:before { content: 'r'; } -.icon-document:before { +.icon-plus:before { content: 's'; } -.icon-plus:before { +.icon-reload:before { content: 't'; } -.icon-reload:before { +.icon-warning:before { content: 'u'; } -.icon-warning:before { +.icon-notification-error:before { content: 'v'; } -.icon-notification-error:before { +.icon-github:before { content: 'w'; } -.icon-github:before { +.icon-check-square:before { content: 'x'; } -.icon-check-square:before { +.icon-warning-alt:before { content: 'y'; } -.icon-warning-alt:before { +.icon-floppy:before { content: 'z'; } -.icon-floppy:before { +.icon-comment:before { content: 'A'; } -.icon-comment:before { +.icon-documents:before { content: 'B'; } -.icon-documents:before { +.icon-attachments:before { content: 'C'; } -.icon-attachments:before { +.icon-caret-up:before { content: 'D'; } -.icon-caret-up:before { +.icon-caret-down:before { content: 'E'; } -.icon-caret-down:before { +.icon-bulk:before { content: 'F'; } -.icon-bulk:before { +.icon-idea:before { content: 'G'; } -.icon-idea:before { +.icon-spinner:before { content: 'H'; } -.icon-spinner:before { +.icon-minimize:before { content: 'I'; } -.icon-minimize:before { +.icon-maximize:before { content: 'J'; } -.icon-maximize:before { +.icon-stats:before { content: 'K'; } -.icon-stats:before { +.icon-copy:before { content: 'L'; } -.icon-copy:before { +.icon-team:before { content: 'M'; } +.icon-vfold:before { + content: 'N'; +} +.icon-vunfold:before { + content: 'O'; +} + diff --git a/app/styles/modules/kanban/kanban-table.scss b/app/styles/modules/kanban/kanban-table.scss index 18792a43..6bf0cc2c 100644 --- a/app/styles/modules/kanban/kanban-table.scss +++ b/app/styles/modules/kanban/kanban-table.scss @@ -8,6 +8,37 @@ $column-margin: 0 10px 0 0; .kanban-table { overflow: hidden; width: 100%; + &.fold { + @include table-flex(); + .task-colum-name { + @include transition(opacity .3s linear); + cursor: pointer; + opacity: .8; + &:hover { + @include transition(opacity .3s linear); + opacity: 1; + } + } + .task-colum-name, + .task-column { + @include table-flex-child(1, 0, 0); + border: 0; + max-width: 30px; + min-height: 2.5rem; + width: 30px; + } + .kanban-table-header { + .task-colum-name { + div, + span { + display: none; + } + } + } + .kanban-task { + display: none; + } + } } .kanban-table-header { @@ -21,33 +52,30 @@ $column-margin: 0 10px 0 0; } .task-colum-name { @include table-flex-child(); + @include table-flex(); + @include justify-content(space-between); @extend %large; background: $whitish; border-top: 3px solid $gray-light; margin: $column-margin; - padding: .5rem 0; + padding: .5rem .5rem .5rem 1rem; position: relative; - text-align: center; text-transform: uppercase; &:last-child { margin-right: 0; } .icon { + @extend %medium; @include transition(color .2s linear); color: $gray-light; - position: absolute; - right: .5rem; - top: .5rem; + margin-right: .3rem; &:hover { color: $green-taiga; } - &.icon-plus { - right: 2rem; - } - &.icon-maximize, - &.icon-minimize { - left: .5rem; - right: inherit; + &.hfold, + &.hunfold { + @include transform(rotate(90deg)); + display: inline-block; } } }