taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'search'

stable
Juanfran 2014-06-11 10:23:50 +02:00
parent 8f1a2f75f4 7cec5f2141
commit 85576409a3
24 changed files with 316 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
README.md
View File

@ -8,12 +8,12 @@ Setup initial environment
Install requirements:
.. code-block:: console
sudo npm install -g gulp
npm install
sudo npm install -g bower
bower install
gulp
```bash
sudo npm install -g gulp
npm install
sudo npm install -g bower
bower install
gulp
```
And go in your browser to: http://localhost:8080/

BIN
app/fonts/taiga.eot
View File

Binary file not shown.

2
app/fonts/taiga.svg
View File

@ -25,4 +25,6 @@
<glyph unicode="&#112;" d="M455 362l-93 93c-5 5-14 5-20 0l-253-254 1 0-1 0-35-130 0 0c-2-4 0-10 3-14 5-4 11-5 16-2l0 0 128 34 0 0 0 0 254 254c5 5 5 14 0 19z m-359-265l21 76 56-56z"/>
<glyph unicode="&#113;" d="M434 160l-96 96 96 96c4 4 4 10 0 14l-68 68c-4 4-10 4-14 0l-96-96-96 96c-4 4-11 4-14 0l-68-68c-2-1-3-4-3-7 0-2 1-5 3-7l96-96-96-96c-2-2-3-5-3-7 0-3 1-6 3-7l68-68c1-2 4-3 7-3 2 0 5 1 7 3l96 96 96-96c2-2 5-3 7-3 3 0 5 1 7 3l68 68c4 4 4 10 0 14z"/>
<glyph unicode="&#114;" d="M364 364c-17 6-31 20-35 38l-36 0c5-34 28-61 59-71 21-7 36-27 36-50l0-18-226 0 0-88-36 0 0 106c0 23 15 43 36 50 31 10 54 37 59 71l-36 0c-5-18-18-32-35-38-34-12-59-45-59-83l0-246c0-20 16-37 36-37l259 0 0 1c21 0 37 16 37 36l0 246c0 38-25 71-59 83z m-101-133c28 0 51-22 51-50 0-15-6-28-16-37-1-2-2-3-2-5l0-2c0-2-1-4-2-4-9-6-18-9-28-9l-5 0c-10 0-20 3-28 9-1 0-2 2-2 4l0 2c0 2-1 3-2 5-10 9-16 22-16 37 0 28 22 50 50 50z m64-136c-3 0-6 2-8 4l-31-11 25-9c2 3 6 5 9 5 6 0 11-4 11-10 0-3-2-6-4-7 1-2 1-3 1-5 0-6-5-12-11-12-7 0-12 6-12 12 0 0 0 1 0 1l-43 16-45-16c0 0 0-1 0-1 0-6-6-12-12-12-7 0-12 6-12 12 0 2 1 3 1 5-2 1-3 4-3 7 0 6 5 10 10 10 4 0 7-2 9-5l27 9-27 10c-2-2-4-4-7-4-6 0-10 4-10 10 0 4 3 7 6 8 0 0 0 0 0 0 0 5 4 9 8 9 5 0 8-4 9-8l45-16 51 17c0 5 4 8 8 8 5 0 8-4 8-8l0 0c4-2 6-5 6-9 0-5-4-10-9-10z m-154 327l168 0c2 0 4 1 4 4l0 48c0 2-2 4-4 4l-12 0 0 23c0 3-2 6-6 6l-132 0c-4 0-6-3-6-6l0-23-12 0c-2 0-4-2-4-4l0-48c0-3 2-4 4-4z m82-255c0-7-6-13-13-13-8 0-14 6-14 13 0 7 6 13 14 13 7 0 13-6 13-13z m43 0c0-7-6-13-13-13-7 0-13 6-13 13 0 7 6 13 13 13 7 0 13-6 13-13z"/>
<glyph unicode="&#115;" d="M165 302l0-55c0-8-3-14-8-20-6-5-12-8-20-8l-55 0c-7 0-14 3-19 8-5 6-8 12-8 20l0 55c0 7 3 14 8 19 5 5 12 8 19 8l55 0c8 0 14-3 20-8 5-5 8-12 8-19z m146 0l0-55c0-8-3-14-8-20-5-5-12-8-20-8l-54 0c-8 0-15 3-20 8-5 6-8 12-8 20l0 55c0 7 3 14 8 19 5 5 12 8 20 8l54 0c8 0 15-3 20-8 5-5 8-12 8-19z m146 0l0-55c0-8-3-14-8-20-5-5-12-8-19-8l-55 0c-8 0-14 3-20 8-5 6-8 12-8 20l0 55c0 7 3 14 8 19 6 5 12 8 20 8l55 0c7 0 14-3 19-8 5-5 8-12 8-19z"/>
<glyph unicode="&#116;" d="M311 155l0-54c0-8-3-15-8-20-5-5-12-8-20-8l-54 0c-8 0-15 3-20 8-5 5-8 12-8 20l0 54c0 8 3 15 8 20 5 5 12 8 20 8l54 0c8 0 15-3 20-8 5-5 8-12 8-20z m0 147l0-55c0-8-3-14-8-20-5-5-12-8-20-8l-54 0c-8 0-15 3-20 8-5 6-8 12-8 20l0 55c0 7 3 14 8 19 5 5 12 8 20 8l54 0c8 0 15-3 20-8 5-5 8-12 8-19z m0 146l0-55c0-7-3-14-8-19-5-6-12-8-20-8l-54 0c-8 0-15 2-20 8-5 5-8 12-8 19l0 55c0 8 3 14 8 19 5 6 12 8 20 8l54 0c8 0 15-2 20-8 5-5 8-11 8-19z"/>
</font></defs></svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.5 KiB

After

Width:  |  Height:  |  Size: 7.4 KiB

BIN
app/fonts/taiga.ttf
View File

Binary file not shown.

BIN
app/fonts/taiga.woff
View File

Binary file not shown.

13
app/search.jade Normal file
View File

@ -0,0 +1,13 @@
extends layout
block head
title Taiga Project management web application with scrum in mind!
block content
sidebar.menu-secondary.sidebar
include views/modules/search-in
section.main.search-result
include views/components/mainTitle
include views/modules/search-filter
include views/modules/search-result-table

72
app/styles/components/taskboard-task.scss Normal file
View File

@ -0,0 +1,72 @@
.taskboard-task {
background: $postit;
margin-bottom: 1rem;
position: relative;
.taskboard-tagline {
@include table-flex();
}
.taskboard-tag {
@include table-flex-child(1, 0, 0, 0);
background: $postit-hover; //Fallback
height: .3rem;
}
.taskboard-task-inner {
@include table-flex();
padding: 1rem .5rem;
}
.avatar {
@include table-flex-child($flex-basis: 50px);
a {
@extend %small;
text-align: center;
}
img {
margin: 0 auto;
}
figcaption {
display: block;
overflow: hidden;
position: relative;
text-overflow: ellipsis;
top: 4px;
white-space: nowrap;
width: 50px;
}
}
.task-num {
color: $postit-hover;
margin-right: .5em;
}
.taskboard-text {
@include table-flex-child($flex-grow: 10, $flex-basis: 50px, $width: 100px);
}
.icon-edit,
.icon-drag-h {
@extend %large;
bottom: .2rem;
color: $postit-hover;
display: none;
position: absolute;
&:hover {
@include transition(color, .3s, linear);
color: darken($postit-hover, 15%);
}
}
.icon-edit {
right: .5rem;
}
.icon-drag-h {
@extend %xlarge;
right: 45%;
}
&:hover {
.icon-edit,
.icon-drag-h {
display: block;
}
}
}
.task-drag {
@include box-shadow();
}

3
app/styles/dependencies/colors.scss
View File

@ -21,3 +21,6 @@ $button-green: #699b05;
$button-green-hover: #9dce0a;
$button-gray: #585858;
$button-gray-hover: #879b89;
$postit: #fff0c5;
$postit-hover: #e3d6b0;

17
app/styles/dependencies/helpers.scss
View File

@ -3,6 +3,23 @@
box-sizing: border-box;
}
//Flexbox FTW
%table-flex {
align-content: stretch;
align-items: stretch;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
}
%table-flex-child {
flex-basis: 300px;
flex-grow: 1;
flex-shrink: 0;
width: 300px;
}
// #Reset & Basics (Inspired by E. Meyers)
//==================================================
a,

24
app/styles/dependencies/mixins.scss
View File

@ -8,3 +8,27 @@
@mixin background-opacity($color: $white, $opacity: .3) {
background: rgba($color, $opacity);
}
// Table Flex - http://devbryce.com/site/flexbox/
@mixin table-flex() {
align-content: stretch;
align-items: stretch;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
}
@mixin table-flex-child($flex-grow: 1, $flex-basis: 300px, $flex-shrink: 0, $width:'') {
flex-basis: $flex-basis;
flex-grow: $flex-grow;
flex-shrink: $flex-shrink;
width: $flex-basis;
@if #{$width} != null {
width: #{$width};
}
}
@mixin box-shadow($h-shadow: 1px, $v-shadow: 1px, $blur: 15px, $spread: 6px, $color: rgba(0, 0, 0, .1)) {
box-shadow: $h-shadow $v-shadow $blur $spread $color;
}

6
app/styles/dependencies/typography.scss
View File

@ -168,3 +168,9 @@ a:visited {
.icon-iocaine:before {
content: 'r';
}
.icon-drag-h:before {
content: 's';
}
.icon-drag-v:before {
content: 't';
}

3
app/styles/main.scss
View File

@ -23,6 +23,7 @@ $prefix-for-spec: true;
@import 'components/popover';
@import 'components/tag';
@import 'components/filter';
@import 'components/taskboard-task';
//Layout
@import 'layout/base';
@ -38,6 +39,8 @@ $prefix-for-spec: true;
@import 'modules/filters';
@import 'modules/lightbox';
@import 'modules/taskboard-table';
@import 'modules/search-filter';
@import 'modules/search-result-table';
// Responsive
@import 'responsive/mobile';

2
app/styles/modules/backlog-table.scss
View File

@ -13,7 +13,7 @@
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
padding: .5em 0;
padding: 1rem 0 1rem 1rem;
text-align: left;
width: 100%;
@for $i from 1 through 8 {

24
app/styles/modules/search-filter.scss Normal file
View File

@ -0,0 +1,24 @@
.search-filter {
ul {
border-bottom: 3px solid $gray-light;
display: flex;
padding-bottom: .5rem;
}
li {
margin-right: 1rem;
}
a {
@extend %large;
font-family: 'ostrichSans';
opacity: .2;
&.active,
&:hover {
@include transition (opacity .3s linear);
color: $blackish;
opacity: 1;
}
}
.icon {
margin-right: .4rem;
}
}

72
app/styles/modules/search-result-table.scss Normal file
View File

@ -0,0 +1,72 @@
.search-result-table {
align-content: stretch;
align-items: center;
display: flex;
flex-direction: column;
flex-wrap: wrap;
justify-content: flex-start;
width: 100%;
.row {
align-content: stretch;
align-items: stretch;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
padding: 1rem 0 1rem 1rem;
text-align: left;
width: 100%;
@for $i from 1 through 8 {
.width-#{$i} {
flex-basis: 50px;
flex-grow: $i;
flex-shrink: 0;
}
}
&:hover {
background: lighten($green-taiga, 60%);
@include transition (background .2s ease-in);
}
}
.row-selected {
background: lighten($green-taiga, 60%);
@include transition (background .2s ease-in);
}
.user-story-name {
flex-basis: 500px;
input {
vertical-align: top;
}
span {
display: inline-block;
max-width: 70%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon {
@extend %medium;
color: $gray-light;
&:hover {
color: $grayer;
@include transition (color .3s linear);
}
}
}
.title {
@extend %medium;
border-bottom: 1px solid $gray-light;
font-family: 'DroidSans-Bold';
&:hover {
background: transparent;
}
}
.table-main {
@extend %small;
border-bottom: 1px solid $gray-light;
}
.status,
.points {
position: relative;
}
}

16
app/styles/modules/taskboard-table.scss
View File

@ -1,19 +1,3 @@
%table-flex {
align-content: stretch;
align-items: stretch;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
}
%table-flex-child {
flex-basis: 300px;
flex-grow: 1;
flex-shrink: 0;
width: 300px;
}
.taskboard-table {
overflow: hidden;
width: 100%;

14
app/views/components/taskboard-task.jade Normal file
View File

@ -0,0 +1,14 @@
div.taskboard-task
div.taskboard-tagline
- for(var y = 0; y < 3; y++)
a.taskboard-tag(href="", title="tasboard-tag")
div.taskboard-task-inner
figure.avatar
a(href="", title="UserName")
img.avatar(src="http://thecodeplayer.com/u/uifaces/12.jpg", alt="username")
figcaption Username
p.taskboard-text
span.task-num 125
span.task-name Crear usuarios que no sepan que tienen que darse de alta para darse de baja y crear contenido bloqueado o no en la plataforma
a.icon.icon-edit(href="", title="Edit")
a.icon.icon-drag-h(href="", title="Drag&Drop")

31
app/views/modules/search-filter.jade Normal file
View File

@ -0,0 +1,31 @@
section.search-filter
ul
li
a.active(href="#")
span.icon.icon-bulk
| 20 User Stories
li
a(href="#")
span.icon.icon-issues
| 3 Issues
li
a(href="#")
span.icon.icon-bulk
| 23 Task
li
a(href="#")
span.icon.icon-wiki
| 2 Wiki pages
li
a(href="#")
span.icon.icon-edit
| 12 Documents
li
a(href="#")
span.icon.icon-edit
| 3 Users

6
app/views/modules/search-in.jade Normal file
View File

@ -0,0 +1,6 @@
section.search
header
form
fieldset
input(type="text", placeholder="Search in...")
a.icon.icon-search(href="", title="search")

14
app/views/modules/search-result-table.jade Normal file
View File

@ -0,0 +1,14 @@
section.search-result-table
div.row.title
div.user-stories.width-4 User Stories
div.status.width-2 Status
div.points.width-1 Points
div.points.width-1 Sprints
- for (var x = 0; x < 50; x++)
div.row.table-main
div.user-stories.width-4
div.user-story-name
a(href="") Crear el perfil de usuario Senior en el admin
div.status.width-2 Status
div.points.width-1 12
div.points.width-1 54

2
app/views/modules/taskboard-table.jade
View File

@ -29,4 +29,4 @@ div.taskboard-table
div.taskboard_task-playground.task-column
- for(var x = 0; x < 3; x++)
div.task-row
//- Include tasks
include ../components/taskboard-task

3
csslintrc.json
View File

@ -18,5 +18,6 @@
"unqualified-attributes": false,
"regex-selectors": false,
"floats": false,
"fallback-colors": false
"fallback-colors": false,
"adjoining-classes": false
}

7
gulpfile.js
View File

@ -11,7 +11,8 @@ var gulp = require('gulp'),
notify = require("gulp-notify"),
connect = require('gulp-connect'),
scsslint = require('gulp-scss-lint'),
newer = require('gulp-newer')
newer = require('gulp-newer'),
plumber = require('gulp-plumber'),
cache = require('gulp-cached');
var paths = {
@ -28,9 +29,7 @@ var paths = {
gulp.task('jade', function() {
return gulp.src(paths.jade)
.on('error', function(err) {
console.log(err);
})
.pipe(plumber())
.pipe(jade({
pretty: true
}))

1
package.json
View File

@ -26,6 +26,7 @@
"gulp-minify-html": "^0.1.3",
"gulp-newer": "^0.3.0",
"gulp-notify": "^1.2.5",
"gulp-plumber": "^0.6.2",
"gulp-ruby-sass": "^0.4.3",
"gulp-scss-lint": "0.0.6",
"gulp-styledocco": "0.0.1",