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

Create sample themes: meterial-design, high-contrast

stable
Xavier Julián 2015-06-19 15:35:32 +02:00 committed by David Barragán Merino
parent 6d202e923e
commit ac8894e62d
72 changed files with 984 additions and 380 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app-loader/app-loader.coffee
View File

@ -4,7 +4,7 @@ window.taigaConfig = {
"eventsUrl": null, "eventsUrl": null,
"debug": true, "debug": true,
"defaultLanguage": "en", "defaultLanguage": "en",
"themes": ["taiga"], "themes": ["taiga", "material-design", "high-contrast"],
"defaultTheme": "taiga", "defaultTheme": "taiga",
"publicRegisterEnabled": true, "publicRegisterEnabled": true,
"feedbackEnabled": true, "feedbackEnabled": true,

2
app/modules/home/projects/home-project-list.scss
View File

@ -7,7 +7,7 @@
padding: 1rem; padding: 1rem;
text-overflow: ellipsis; text-overflow: ellipsis;
&:hover { &:hover {
border-color: $fresh-taiga; border-color: $primary-light;
transition: all .3s linear; transition: all .3s linear;
p { p {
color: $gray; color: $gray;

16
app/modules/navigation-bar/navigation-bar.scss
View File

@ -1,11 +1,11 @@
$dropdown-width: 350px;
.navbar { .navbar {
background: rgba($black, .5);
display: flex; display: flex;
height: $navbar; height: $navbar;
justify-content: space-between; justify-content: space-between;
position: relative; position: relative;
&:after { &:after {
background: url('../images/menu-vert.png') repeat top left;
background-size: 200%; background-size: 200%;
bottom: 0; bottom: 0;
content: ''; content: '';
@ -24,6 +24,7 @@
} }
.nav-left { .nav-left {
>a { >a {
color: $white;
padding: .5rem 1.5rem; padding: .5rem 1.5rem;
&.logo { &.logo {
background: rgba($black, .2); background: rgba($black, .2);
@ -41,6 +42,7 @@
.nav-right { .nav-right {
margin-left: auto; margin-left: auto;
a { a {
color: $white;
padding: .5rem 2rem; padding: .5rem 2rem;
} }
} }
@ -48,10 +50,12 @@
color: $white; color: $white;
display: inline-block; display: inline-block;
transition: all .2s linear; transition: all .2s linear;
&.active, svg path {
fill: darken($primary-dark, 8%);
}
&:hover { &:hover {
background: rgba($black, .2); background: rgba($black, .2);
color: $fresh-taiga; color: $primary-light;
svg path { svg path {
fill: $white; fill: $white;
} }
@ -77,7 +81,7 @@
height: 1.2rem; height: 1.2rem;
max-width: 1.2rem; max-width: 1.2rem;
path { path {
fill: $dark-taiga; fill: $top-icon-color;
transition: all .2s; transition: all .2s;
} }
} }
@ -130,7 +134,7 @@
padding: .8rem .5rem; padding: .8rem .5rem;
&:hover { &:hover {
background: rgba($white, .1); background: rgba($white, .1);
color: $fresh-taiga; color: $primary-light;
} }
&.see-more-projects-btn, &.see-more-projects-btn,
&.create-organization-btn, &.create-organization-btn,

2
app/modules/profile/styles/profile-contacts.scss
View File

@ -16,7 +16,7 @@
&:hover, &:hover,
&.active { &.active {
border-bottom: 2px solid $gray-light; border-bottom: 2px solid $gray-light;
color: $green-taiga; color: $primary;
} }
} }
} }

2
app/modules/profile/styles/profile-content-tabs.scss
View File

@ -18,7 +18,7 @@
top: 1px; top: 1px;
transition: color .2s linear; transition: color .2s linear;
.icon { .icon {
color: $green-taiga; color: $primary;
transition: color .2s linear; transition: color .2s linear;
} }
} }

2
app/modules/profile/styles/profile-favorites.scss
View File

@ -14,7 +14,7 @@
&:hover, &:hover,
&.active { &.active {
border-bottom: 2px solid $gray-light; border-bottom: 2px solid $gray-light;
color: $green-taiga; color: $primary;
} }
} }
} }

2
app/modules/profile/styles/profile-sidebar.scss
View File

@ -16,7 +16,7 @@
color: $gray-light; color: $gray-light;
} }
a { a {
color: $green-taiga; color: $primary;
} }
.trans-button { .trans-button {
margin-bottom: 1rem; margin-bottom: 1rem;

2
app/modules/projects/listing/projects-listing.scss
View File

@ -58,7 +58,7 @@
} }
.active { .active {
.icon { .icon {
color: $star-fill; color: $primary-light;
} }
} }
} }

2
app/modules/projects/listing/styles/project-list.scss
View File

@ -47,7 +47,7 @@
.project-list-single { .project-list-single {
background: $white; background: $white;
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
cursor: move; cursor: move;
transition: background .3s; transition: background .3s;
.drag { .drag {

4
app/modules/user-timeline/user-timeline/user-timeline.scss
View File

@ -7,13 +7,13 @@
margin-bottom: 0; margin-bottom: 0;
} }
a { a {
color: $green-taiga; color: $primary;
&:first-child { &:first-child {
@extend %bold; @extend %bold;
color: $gray; color: $gray;
} }
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
} }
} }
blockquote { blockquote {

12
app/styles/components/buttons.scss
View File

@ -46,7 +46,7 @@
&.active { &.active {
span, span,
.icon { .icon {
color: $green-taiga; color: $primary;
} }
} }
} }
@ -59,10 +59,10 @@
.button-green, .button-green,
a.button-green { a.button-green {
@extend %button; @extend %button;
background: $green-taiga; background: $primary;
&:hover, &:hover,
&.active { &.active {
background: $fresh-taiga; background: $primary-light;
color: $white; color: $white;
} }
} }
@ -73,7 +73,7 @@ a.button-gray {
background: $gray; background: $gray;
&:hover, &:hover,
&.active { &.active {
background: $fresh-taiga; background: $primary-light;
color: $white; color: $white;
} }
} }
@ -111,13 +111,13 @@ a.button-gray {
.button-bulk { .button-bulk {
@extend %button; @extend %button;
background: $green-taiga; background: $primary;
padding: .35rem .5rem; padding: .35rem .5rem;
.icon { .icon {
margin-right: 0; margin-right: 0;
} }
&:hover { &:hover {
background: $fresh-taiga; background: $primary-light;
} }
} }

2
app/styles/components/check.scss
View File

@ -39,7 +39,7 @@
} }
input:checked { input:checked {
+ div { + div {
background-color: $fresh-taiga; background-color: $primary-light;
margin-left: 50%; margin-left: 50%;
transition: all .2s linear; transition: all .2s linear;
} }

2
app/styles/components/created-by.scss
View File

@ -23,7 +23,7 @@
} }
.created-user { .created-user {
@extend %large; @extend %large;
color: $green-taiga; color: $primary;
cursor: default; cursor: default;
&.editable { &.editable {
cursor: pointer; cursor: pointer;

20
app/styles/components/kanban-task.scss
View File

@ -1,6 +1,6 @@
.kanban-task { .kanban-task {
background: $postit; background: $card;
border: 1px solid $postit-hover; border: 1px solid $card-hover;
box-shadow: none; box-shadow: none;
cursor: move; cursor: move;
margin: .2rem; margin: .2rem;
@ -11,7 +11,7 @@
&:hover { &:hover {
.icon-edit, .icon-edit,
.icon-drag-h { .icon-drag-h {
color: $postit-dark-hover; color: $card-dark;
display: block; display: block;
opacity: 1; opacity: 1;
transition: color .3s linear, opacity .3s linear; transition: color .3s linear, opacity .3s linear;
@ -34,12 +34,12 @@
} }
} }
.kanban-tagline { .kanban-tagline {
border-color: $postit-hover; border-color: $card-hover;
display: flex; display: flex;
height: .6rem; height: .6rem;
} }
.kanban-tag { .kanban-tag {
border-top: .3rem solid $postit-hover; border-top: .3rem solid $card-hover;
flex-basis: 0; flex-basis: 0;
flex-grow: 1; flex-grow: 1;
height: .6rem; height: .6rem;
@ -66,7 +66,7 @@
img { img {
margin: 0 auto; margin: 0 auto;
&:hover { &:hover {
border: 2px solid $green-taiga; border: 2px solid $primary;
transition: border .3s linear; transition: border .3s linear;
} }
} }
@ -77,7 +77,7 @@
padding: 0 .5rem 0 .8rem; padding: 0 .5rem 0 .8rem;
} }
.task-assigned { .task-assigned {
color: $postit-dark-hover; color: $card-dark;
display: block; display: block;
} }
.task-num { .task-num {
@ -90,12 +90,12 @@
.icon-edit, .icon-edit,
.icon-drag-h { .icon-drag-h {
@extend %large; @extend %large;
color: $postit-hover; color: $card-hover;
opacity: 0; opacity: 0;
position: absolute; position: absolute;
transition: opacity .2s linear; transition: opacity .2s linear;
&:hover { &:hover {
color: darken($postit-hover, 15%); color: darken($card-hover, 15%);
transition: color .3s linear; transition: color .3s linear;
} }
} }
@ -144,7 +144,7 @@
} }
.task-points { .task-points {
@extend %small; @extend %small;
color: darken($postit-hover, 15%); color: darken($card-hover, 15%);
margin: 0; margin: 0;
span { span {
display: inline-block; display: inline-block;

2
app/styles/components/markdown-help.scss
View File

@ -8,7 +8,7 @@ a.help-button {
transition: color .2s linear; transition: color .2s linear;
} }
.icon { .icon {
color: $fresh-taiga; color: $primary-light;
transition: color .2s linear; transition: color .2s linear;
} }
} }

2
app/styles/components/notification-message.scss
View File

@ -1,5 +1,5 @@
.notification-message-success { .notification-message-success {
background: rgba($fresh-taiga, .95); background: rgba($primary-light, .95);
box-shadow: 0 25px 10px -15px rgba(0, 0, 0, .05); box-shadow: 0 25px 10px -15px rgba(0, 0, 0, .05);
opacity: 1; opacity: 1;
right: -370px; right: -370px;

2
app/styles/components/paginator.scss
View File

@ -24,7 +24,7 @@
} }
.active { .active {
span { span {
background: $fresh-taiga; background: $primary-light;
} }
} }
.dots { .dots {

10
app/styles/components/summary.scss
View File

@ -15,7 +15,7 @@ $summary-background: $grayer;
} }
.data { .data {
.number { .number {
color: $fresh-taiga; color: $primary-light;
} }
} }
.number { .number {
@ -82,7 +82,7 @@ $summary-background: $grayer;
position: relative; position: relative;
width: 15%; width: 15%;
.current-progress { .current-progress {
background: $fresh-taiga; background: $primary-light;
height: 24px; height: 24px;
} }
.defined-points { .defined-points {
@ -97,7 +97,7 @@ $summary-background: $grayer;
position: absolute; position: absolute;
} }
.closed-points-progress { .closed-points-progress {
background: $fresh-taiga; background: $primary-light;
height: 24px; height: 24px;
position: absolute; position: absolute;
} }
@ -136,11 +136,11 @@ $summary-background: $grayer;
float: right; float: right;
transition: color .3s linear; transition: color .3s linear;
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
transition: color .3s linear; transition: color .3s linear;
} }
&.active { &.active {
color: $fresh-taiga; color: $primary-light;
} }
&.active:hover { &.active:hover {
color: $green-taiga; color: $green-taiga;

4
app/styles/components/tag.scss
View File

@ -22,7 +22,7 @@
border: 1px solid $gray-light; border: 1px solid $gray-light;
z-index: 99910; z-index: 99910;
.ui-state-focus { .ui-state-focus {
background: $fresh-taiga; background: $primary-light;
} }
li { li {
cursor: pointer; cursor: pointer;
@ -49,7 +49,7 @@
.add-tag { .add-tag {
color: $gray-light; color: $gray-light;
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
} }
} }
.icon-plus { .icon-plus {

20
app/styles/components/taskboard-task.scss
View File

@ -1,6 +1,6 @@
.taskboard-task { .taskboard-task {
background: $postit; background: $card;
border: 1px solid $postit-hover; border: 1px solid $card-hover;
box-shadow: none; box-shadow: none;
cursor: move; cursor: move;
margin: .2rem; margin: .2rem;
@ -8,7 +8,7 @@
&:hover { &:hover {
.icon-edit, .icon-edit,
.icon-drag-h { .icon-drag-h {
color: $postit-dark-hover; color: $card-dark;
display: block; display: block;
opacity: 1; opacity: 1;
transition: color .3s linear, opacity .3s linear; transition: color .3s linear, opacity .3s linear;
@ -37,12 +37,12 @@
} }
} }
.taskboard-tagline { .taskboard-tagline {
border-color: $postit-hover; border-color: $card-hover;
display: flex; display: flex;
height: .6rem; height: .6rem;
} }
.taskboard-tag { .taskboard-tag {
border-top: .3rem solid $postit-hover; border-top: .3rem solid $card-hover;
flex-basis: 0; flex-basis: 0;
flex-grow: 1; flex-grow: 1;
height: .6rem; height: .6rem;
@ -64,7 +64,7 @@
img { img {
margin: 0 auto; margin: 0 auto;
&:hover { &:hover {
border: 2px solid $green-taiga; border: 2px solid $primary;
transition: border .3s linear; transition: border .3s linear;
} }
} }
@ -86,10 +86,10 @@
} }
.task-assigned { .task-assigned {
@extend %small; @extend %small;
color: $postit-dark-hover; color: $card-dark;
display: block; display: block;
&:hover { &:hover {
color: $green-taiga; color: $primary;
} }
} }
.task-num { .task-num {
@ -113,11 +113,11 @@
.icon-drag-h { .icon-drag-h {
@extend %large; @extend %large;
bottom: .5rem; bottom: .5rem;
color: $postit-hover; color: $card-hover;
opacity: 0; opacity: 0;
position: absolute; position: absolute;
&:hover { &:hover {
color: $postit-dark-hover; color: $card-dark;
} }
} }
.icon-edit { .icon-edit {

4
app/styles/components/wysiwyg.scss
View File

@ -40,9 +40,9 @@
} }
} }
a { a {
color: $green-taiga; color: $primary;
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
} }
} }
p { p {

19
app/styles/core/base.scss
View File

@ -5,8 +5,6 @@ html {
} }
body { body {
@extend %text; @extend %text;
background: $white; // fallback
color: $grayer;
line-height: 1.3; line-height: 1.3;
min-height: 100%; min-height: 100%;
width: 100%; width: 100%;
@ -17,15 +15,6 @@ body {
} }
&.loading-project { &.loading-project {
overflow: hidden; overflow: hidden;
.projects-nav-overlay {
opacity: 1;
overflow: hidden;
transition: opacity 1s ease;
div {
opacity: 1;
transition: opacity 1s ease;
}
}
} }
} }
@ -38,7 +27,6 @@ body {
} }
.master { .master {
background: $white;
height: 100%; height: 100%;
min-height: 100%; min-height: 100%;
position: relative; position: relative;
@ -57,7 +45,6 @@ body {
} }
.menu-secondary { .menu-secondary {
background: $whitish;
flex: 0 0 auto; flex: 0 0 auto;
min-height: $main-height; min-height: $main-height;
min-width: 0; min-width: 0;
@ -84,17 +71,11 @@ body {
} }
.menu-tertiary { .menu-tertiary {
background-color: $dark-taiga;
flex: 0 0 auto; flex: 0 0 auto;
min-height: $main-height; min-height: $main-height;
width: 250px; width: 250px;
} }
.extrabar {
background: $whitish;
}
%main,
.main { .main {
flex: 4; flex: 4;
flex-basis: 600px; flex-basis: 600px;

13
app/styles/core/elements.scss
View File

@ -3,16 +3,13 @@
// Blockquotes // Blockquotes
blockquote, blockquote,
blockquote p { blockquote p {
color: $gray;
line-height: 1.25rem; line-height: 1.25rem;
} }
blockquote { blockquote {
border-left: 5px solid $whitish;
margin: 0 0 20px; margin: 0 0 20px;
padding: .5rem 1.25rem; padding: .5rem 1.25rem;
cite { cite {
@extend %small; @extend %small;
color: $gray;
display: block; display: block;
&:before { &:before {
content: '\2014 \0020'; content: '\2014 \0020';
@ -59,14 +56,14 @@ sup {
} }
.is-selected { .is-selected {
.pika-button { .pika-button {
background: $green-taiga; background: $primary;
border-radius: 0 !important; border-radius: 0 !important;
box-shadow: inset 0 1px 3px $green-taiga; box-shadow: inset 0 1px 3px $primary;
} }
} }
.is-today { .is-today {
.pika-button { .pika-button {
color: $green-taiga; color: $primary;
} }
&.is-selected { &.is-selected {
button { button {
@ -76,9 +73,9 @@ sup {
} }
.pika-button { .pika-button {
&:hover { &:hover {
background: $fresh-taiga !important; //Important added because plugin has it :S background: $primary-light !important; //Important added because plugin has it :S
border-radius: 0 !important; //Important added because plugin has it :S border-radius: 0 !important; //Important added because plugin has it :S
box-shadow: inset 0 1px 3px $fresh-taiga !important; //Important added because plugin has it :S box-shadow: inset 0 1px 3px $primary-light !important; //Important added because plugin has it :S
} }
} }
} }

10
app/styles/core/forms.scss
View File

@ -19,17 +19,11 @@ input[type="date"],
input[type="password"], input[type="password"],
select, select,
textarea { textarea {
background: $whitish; border: 1px solid;
border: 1px solid $gray-light;
color: $grayer;
margin: 0; margin: 0;
padding: 8px; padding: 8px;
width: 100%; width: 100%;
@include placeholder {
color: darken($gray-light, 10%);
}
&.checksley-error { &.checksley-error {
border: 1px solid $red;
transition: border .3s linear; transition: border .3s linear;
} }
} }
@ -42,14 +36,12 @@ textarea {
.checksley-error-list { .checksley-error-list {
@extend %small; @extend %small;
background: rgba($whitish, .8);
margin-bottom: 0; margin-bottom: 0;
padding: 0 .5rem; padding: 0 .5rem;
position: absolute; position: absolute;
right: 2rem; right: 2rem;
top: 10px; top: 10px;
li { li {
color: $red;
padding: .2rem; padding: .2rem;
} }
} }

4
app/styles/core/typography.scss
View File

@ -53,7 +53,7 @@ h1 {
max-width: 40%; max-width: 40%;
} }
.green { .green {
color: $green-taiga; color: $primary;
} }
.date { .date {
@include ellipsis(500px); @include ellipsis(500px);
@ -92,10 +92,8 @@ hr {
// __Links__ // __Links__
a, a,
a:visited { a:visited {
color: $grayer;
text-decoration: none; text-decoration: none;
&:hover { &:hover {
color: $green-taiga;
transition: color .3s linear; transition: color .3s linear;
} }
} }

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

@ -16,7 +16,6 @@
%mono {font-family: 'courier new', 'monospace';} %mono {font-family: 'courier new', 'monospace';}
%lightbox { %lightbox {
background: rgba($white, .95);
bottom: 0; bottom: 0;
display: none; display: none;
left: 0; left: 0;
@ -62,17 +61,6 @@
} }
} }
// Background
%triangled-bg {
background: url('/images/bg.png') no-repeat center center;
background-size: cover;
}
%background-taiga {
background: url('/images/invitation_bg.jpg') no-repeat center center;
background-size: cover;
}
%loading-spinner { %loading-spinner {
animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
animation: rotate 1.5s cubic-bezier(.00, .05, .87, 1.04) infinite alternate; animation: rotate 1.5s cubic-bezier(.00, .05, .87, 1.04) infinite alternate;

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

@ -57,7 +57,7 @@
border: 0; border: 0;
} }
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
transition: color .3s linear; transition: color .3s linear;
&.point { &.point {
color: $white; color: $white;

5
app/styles/layout/admin-project-values.scss
View File

@ -37,8 +37,3 @@
display: inline-block; display: inline-block;
} }
} }
//.project-values-options {
// margin-bottom: 1rem;
// text-align: right;
//}

2
app/styles/layout/invitation.scss
View File

@ -84,7 +84,7 @@
} }
.button-blackish { .button-blackish {
&:hover { &:hover {
background: $green-taiga; background: $primary;
} }
} }
.login-form { .login-form {

8
app/styles/layout/login.scss
View File

@ -41,17 +41,11 @@
form { form {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
input {
background: $white;
@include placeholder {
color: $gray-light;
}
}
.login-text, .login-text,
.register-text { .register-text {
text-align: center; text-align: center;
a:hover { a:hover {
color: $fresh-taiga; color: $primary-light;
} }
} }
.button { .button {

4
app/styles/layout/not-found.scss
View File

@ -25,9 +25,9 @@
margin-bottom: 3rem; margin-bottom: 3rem;
} }
a { a {
color: $green-taiga; color: $primary;
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
} }
} }
} }

2
app/styles/layout/team.scss
View File

@ -3,7 +3,7 @@
margin: 1rem 0; margin: 1rem 0;
span { span {
&:last-child { &:last-child {
color: $green-taiga; color: $primary;
} }
} }
} }

12
app/styles/layout/us-detail.scss
View File

@ -103,7 +103,7 @@
padding: 0 .2rem; padding: 0 .2rem;
} }
a:hover { a:hover {
color: $green-taiga; color: $primary;
} }
a:first-child { a:first-child {
border: 0; border: 0;
@ -237,7 +237,7 @@
.us-detail-status { .us-detail-status {
@extend %large; @extend %large;
color: $green-taiga; color: $primary;
vertical-align: middle; vertical-align: middle;
} }
@ -247,7 +247,7 @@
margin-bottom: 1rem; margin-bottom: 1rem;
position: relative; position: relative;
.current-progress { .current-progress {
background: $fresh-taiga; background: $primary-light;
height: 26px; height: 26px;
left: 0; left: 0;
position: absolute; position: absolute;
@ -281,7 +281,7 @@
text-align: center; text-align: center;
transition: color .3s linear; transition: color .3s linear;
&.active { &.active {
background: rgba($fresh-taiga, .9); background: rgba($primary-light, .9);
color: $whitish; color: $whitish;
} }
&:first-child { &:first-child {
@ -316,7 +316,7 @@
text-align: center; text-align: center;
&:hover, &:hover,
&.active { &.active {
background: $fresh-taiga; background: $primary-light;
color: $white; color: $white;
} }
} }
@ -381,7 +381,7 @@
} }
} }
&.active { &.active {
background: $green-taiga; background: $primary;
} }
} }
.item-block { .item-block {

4
app/styles/modules/admin/admin-custom-attributes.scss
View File

@ -24,7 +24,7 @@
} }
} }
.row:hover { .row:hover {
background: rgba($fresh-taiga, .05); background: rgba($primary-light, .05);
cursor: move; cursor: move;
transition: background .2s linear; transition: background .2s linear;
.icon-drag-v, .icon-drag-v,
@ -89,7 +89,7 @@
transition: color .2s linear; transition: color .2s linear;
vertical-align: middle; vertical-align: middle;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s linear; transition: color .2s linear;
} }
} }

2
app/styles/modules/admin/admin-functionalities.scss
View File

@ -19,7 +19,7 @@
vertical-align: top; vertical-align: top;
width: 32%; width: 32%;
&.active { &.active {
background-color: rgba($green-taiga, .3); background-color: rgba($primary, .3);
opacity: 1; opacity: 1;
} }
.icon { .icon {

3
app/styles/modules/admin/admin-membership-table.scss
View File

@ -55,9 +55,6 @@
.pending { .pending {
background-color: $red-light; background-color: $red-light;
color: $white; color: $white;
.icon {
float: rsdsdfdvsdvight;
}
&:hover { &:hover {
background-color: $red; background-color: $red;
color: $white; color: $white;

4
app/styles/modules/admin/admin-project-profile.scss
View File

@ -54,8 +54,8 @@
} }
.privacy-project:checked { .privacy-project:checked {
+ label { + label {
background: $fresh-taiga; background: $primary-light;
border: 1px solid $fresh-taiga; border: 1px solid $primary-light;
span { span {
color: $white; color: $white;
} }

2
app/styles/modules/admin/admin-roles.scss
View File

@ -27,7 +27,7 @@
margin-left: .5rem; margin-left: .5rem;
transition: color.3s linear; transition: color.3s linear;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color.3s linear; transition: color.3s linear;
} }
} }

4
app/styles/modules/admin/admin-submenu.scss
View File

@ -15,12 +15,12 @@
justify-content: space-between; justify-content: space-between;
padding: 1rem 0 1rem 1rem; padding: 1rem 0 1rem 1rem;
&:hover { &:hover {
background: lighten($dark-taiga, 3%); background: lighten($primary-dark, 3%);
color: $white; color: $white;
transition: all .2s; transition: all .2s;
} }
&.active { &.active {
background: lighten($dark-taiga, 10%); background: lighten($primary-dark, 10%);
color: $white; color: $white;
transition: all .2s; transition: all .2s;
} }

12
app/styles/modules/admin/admin-third-parties-webhooks.scss
View File

@ -47,10 +47,10 @@
vertical-align: middle; vertical-align: middle;
} }
a { a {
color: $green-taiga; color: $primary;
margin-left: .5rem; margin-left: .5rem;
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
} }
} }
} }
@ -65,7 +65,7 @@
transition: color .2s linear; transition: color .2s linear;
vertical-align: middle; vertical-align: middle;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s linear; transition: color .2s linear;
} }
@ -102,7 +102,7 @@
padding: .5rem; padding: .5rem;
transition: background .2s linear; transition: background .2s linear;
&:hover { &:hover {
background: rgba($fresh-taiga, .1); background: rgba($primary-light, .1);
transition: background .2s linear; transition: background .2s linear;
} }
&.history-single-open { &.history-single-open {
@ -127,7 +127,7 @@
margin-right: .5rem; margin-right: .5rem;
width: .8rem; width: .8rem;
&.history-success { &.history-success {
background: $fresh-taiga; background: $primary-light;
} }
&.history-error { &.history-error {
background: $red; background: $red;
@ -149,7 +149,7 @@
@extend %small; @extend %small;
color: $gray-light; color: $gray-light;
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
transition: color .2s linear; transition: color .2s linear;
} }
} }

4
app/styles/modules/admin/project-values.scss
View File

@ -33,7 +33,7 @@
} }
.project-values-row { .project-values-row {
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
cursor: move; cursor: move;
transition: background .2s ease-in; transition: background .2s ease-in;
.icon { .icon {
@ -72,7 +72,7 @@
color: $gray; color: $gray;
margin-right: .5rem; margin-right: .5rem;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .3s linear; transition: color .3s linear;
.icon-delete { .icon-delete {
color: $red; color: $red;

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

@ -67,7 +67,7 @@
@include popover(200px, 0, 65%, '', ''); @include popover(200px, 0, 65%, '', '');
a { a {
&.active { &.active {
background: $fresh-taiga; background: $primary-light;
color: $white; color: $white;
} }
} }
@ -90,7 +90,7 @@
text-align: center; text-align: center;
&:hover, &:hover,
&.active { &.active {
background: $fresh-taiga; background: $primary-light;
color: $white; color: $white;
} }
} }
@ -122,7 +122,7 @@
flex-wrap: nowrap; flex-wrap: nowrap;
position: relative; position: relative;
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
.us-settings, .us-settings,
.icon-drag-v { .icon-drag-v {
@ -134,7 +134,7 @@
border-bottom: 0; border-bottom: 0;
} }
&.ui-sortable-helper { &.ui-sortable-helper {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
box-shadow: 1px 1px 10px rgba($black, .1); box-shadow: 1px 1px 10px rgba($black, .1);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
@ -151,7 +151,7 @@
width: 100%; width: 100%;
} }
.row-selected { .row-selected {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
.user-story-name { .user-story-name {
@ -163,7 +163,7 @@
margin-right: 1rem; margin-right: 1rem;
vertical-align: super; vertical-align: super;
&:checked+a { &:checked+a {
color: $fresh-taiga; color: $primary-light;
transition: color .2s ease-in; transition: color .2s ease-in;
} }
} }

8
app/styles/modules/backlog/sprints.scss
View File

@ -69,7 +69,7 @@
transition: all .2s linear; transition: all .2s linear;
} }
&:hover { &:hover {
color: $fresh-taiga; color: $primary-light;
transition: color .2s linear; transition: color .2s linear;
} }
} }
@ -82,7 +82,7 @@
transition: opacity .2s ease-in; transition: opacity .2s ease-in;
vertical-align: baseline; vertical-align: baseline;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s ease-in; transition: color .2s ease-in;
} }
} }
@ -126,7 +126,7 @@
position: relative; position: relative;
width: 100%; width: 100%;
.current-progress { .current-progress {
background: $green-taiga; background: $primary;
border-radius: 2px; border-radius: 2px;
height: 8px; height: 8px;
left: 0; left: 0;
@ -158,7 +158,7 @@
height: 40px; height: 40px;
} }
&.ui-sortable-helper { &.ui-sortable-helper {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
box-shadow: 1px 1px 10px rgba($black, .1); box-shadow: 1px 1px 10px rgba($black, .1);
transition: background .2s ease-in; transition: background .2s ease-in;
} }

9
app/styles/modules/backlog/taskboard-table.scss
View File

@ -91,7 +91,7 @@ $column-margin: 0 10px 0 0;
margin-right: .3rem; margin-right: .3rem;
transition: color .2s linear; transition: color .2s linear;
&:hover { &:hover {
color: $green-taiga; color: $primary;
} }
&.hfold, &.hfold,
&.hunfold { &.hunfold {
@ -178,9 +178,6 @@ $column-margin: 0 10px 0 0;
} }
} }
} }
.taskboard-tasks-box {
background: $whitish;
}
.taskboard-userstory-box { .taskboard-userstory-box {
padding: .5rem .5rem .5rem 1.5rem; padding: .5rem .5rem .5rem 1.5rem;
@ -191,7 +188,7 @@ $column-margin: 0 10px 0 0;
top: .7rem; top: .7rem;
transition: color .2s linear; transition: color .2s linear;
&:hover { &:hover {
color: $green-taiga; color: $primary;
} }
&.icon-plus { &.icon-plus {
right: 2rem; right: 2rem;
@ -234,7 +231,7 @@ $column-margin: 0 10px 0 0;
.points-list { .points-list {
a { a {
color: $green-taiga; color: $primary;
margin-left: .5rem; margin-left: .5rem;
&:hover { &:hover {
span { span {

2
app/styles/modules/common/assigned-to.scss
View File

@ -33,7 +33,7 @@
} }
.user-assigned { .user-assigned {
@extend %large; @extend %large;
color: $green-taiga; color: $primary;
cursor: default; cursor: default;
line-height: 1.5rem; line-height: 1.5rem;
&.editable { &.editable {

12
app/styles/modules/common/attachments.scss
View File

@ -23,7 +23,7 @@
color: $grayer; color: $grayer;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s ease-in; transition: color .2s ease-in;
} }
} }
@ -45,7 +45,7 @@
} }
} }
&.ui-sortable-helper { &.ui-sortable-helper {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
box-shadow: 1px 1px 10px rgba($black, .1); box-shadow: 1px 1px 10px rgba($black, .1);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
@ -96,7 +96,7 @@
display: block; display: block;
position: absolute; position: absolute;
&:hover { &:hover {
color: $green-taiga; color: $primary;
} }
} }
.settings { .settings {
@ -143,7 +143,7 @@
} }
} }
.percentage { .percentage {
background: rgba($green-taiga, .1); background: rgba($primary, .1);
bottom: 0; bottom: 0;
height: 40px; height: 40px;
left: 0; left: 0;
@ -162,11 +162,11 @@
color: $gray-light; color: $gray-light;
} }
.more-attachments-num { .more-attachments-num {
color: $green-taiga; color: $primary;
margin-left: .5rem; margin-left: .5rem;
} }
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
} }

2
app/styles/modules/common/category-config.scss
View File

@ -28,7 +28,7 @@
margin-right: .1rem; margin-right: .1rem;
width: 15px; width: 15px;
&.active { &.active {
background: $green-taiga; background: $primary;
} }
&.inactive { &.inactive {
background: $gray; background: $gray;

6
app/styles/modules/common/colors-table.scss
View File

@ -24,7 +24,7 @@
justify-content: center; justify-content: center;
padding: 1rem; padding: 1rem;
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
cursor: move; cursor: move;
transition: background .2s ease-in; transition: background .2s ease-in;
.icon { .icon {
@ -117,7 +117,7 @@
margin-right: 1rem; margin-right: 1rem;
opacity: 0; opacity: 0;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: all .2s ease-in; transition: all .2s ease-in;
} }
&.icon-check-square { &.icon-check-square {
@ -131,7 +131,7 @@
} }
.icon-check-square { .icon-check-square {
@extend %large; @extend %large;
color: $green-taiga; color: $primary;
} }
} }

2
app/styles/modules/common/custom-fields.scss
View File

@ -43,7 +43,7 @@
color: $gray-light; color: $gray-light;
} }
a:hover { a:hover {
color: $green-taiga; color: $primary;
} }
} }
} }

2
app/styles/modules/common/external-reference.scss
View File

@ -20,7 +20,7 @@
padding: 0 .2rem; padding: 0 .2rem;
transition: color .3s linear; transition: color .3s linear;
&:hover { &:hover {
color: $green-taiga; color: $primary;
} }
&:first-child { &:first-child {
border: 0; border: 0;

18
app/styles/modules/common/history.scss
View File

@ -6,7 +6,7 @@
padding: .5rem; padding: .5rem;
&:hover { &:hover {
.icon { .icon {
color: $green-taiga; color: $primary;
transform: rotate(180deg); transform: rotate(180deg);
transition: all .2s linear; transition: all .2s linear;
} }
@ -58,7 +58,7 @@
color: $grayer; color: $grayer;
} }
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s ease-in; transition: color .2s ease-in;
} }
} }
@ -119,7 +119,7 @@
display: block; display: block;
padding: 1rem 0 1rem 1rem; padding: 1rem 0 1rem 1rem;
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
} }
@ -130,7 +130,7 @@
display: block; display: block;
padding: 1rem; padding: 1rem;
.prev-comments-num { .prev-comments-num {
color: $green-taiga; color: $primary;
margin-left: .5rem; margin-left: .5rem;
} }
} }
@ -180,7 +180,7 @@
color: $gray-light; color: $gray-light;
margin-left: .3rem; margin-left: .3rem;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s linear; transition: color .2s linear;
} }
} }
@ -206,12 +206,12 @@
vertical-align: baseline; vertical-align: baseline;
} }
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s linear; transition: color .2s linear;
} }
} }
.username { .username {
color: $green-taiga; color: $primary;
margin-bottom: .5rem; margin-bottom: .5rem;
} }
.activity-user { .activity-user {
@ -223,7 +223,7 @@
} }
} }
.activity-username { .activity-username {
color: $green-taiga; color: $primary;
margin-bottom: .5rem; margin-bottom: .5rem;
} }
.activity-content { .activity-content {
@ -272,7 +272,7 @@
display: block; display: block;
padding: 1rem; padding: 1rem;
.prev-activity-num { .prev-activity-num {
color: $green-taiga; color: $primary;
margin-left: .5rem; margin-left: .5rem;
} }
} }

12
app/styles/modules/common/lightbox.scss
View File

@ -57,8 +57,8 @@
.requirement, .requirement,
.iocaine { .iocaine {
&:hover { &:hover {
background: $fresh-taiga; background: $primary-light;
border: 1px solid $green-taiga; border: 1px solid $primary;
color: $white; color: $white;
transition: all .2s ease-in; transition: all .2s ease-in;
} }
@ -79,8 +79,8 @@
.team-requirement, .team-requirement,
.iocaine-flag { .iocaine-flag {
input:checked+label { input:checked+label {
background: $green-taiga; background: $primary;
border: 1px solid $green-taiga; border: 1px solid $primary;
color: $white; color: $white;
} }
@ -400,7 +400,7 @@
padding: 3px; padding: 3px;
position: relative; position: relative;
.bar { .bar {
background: $fresh-taiga; background: $primary-light;
height: 24px; height: 24px;
position: absolute; position: absolute;
transition: width .1s linear; transition: width .1s linear;
@ -477,7 +477,7 @@
position: relative; position: relative;
&:hover, &:hover,
&.active { &.active {
background: lighten($green-taiga, 55%); background: lighten($primary, 55%);
cursor: pointer; cursor: pointer;
} }
&:hover { &:hover {

9
app/styles/modules/common/nav.scss
View File

@ -1,8 +1,6 @@
$label-arrow-wh: 12px; $label-arrow-wh: 12px;
tg-project-menu { tg-project-menu {
background-color: $dark-taiga;
background-image: url('../images/menu.png');
background-position: 0 -300px; background-position: 0 -300px;
min-height: $main-height; min-height: $main-height;
padding: 1rem 0; padding: 1rem 0;
@ -22,7 +20,7 @@ tg-project-menu {
} }
a:hover { a:hover {
background: rgba($black, .2); background: rgba($black, .2);
color: $fresh-taiga; color: $primary-light;
transition: color .3s linear; transition: color .3s linear;
.helper { .helper {
@extend %small; @extend %small;
@ -52,7 +50,6 @@ tg-project-menu {
} }
} }
svg path { svg path {
fill: $white;
opacity: 1; opacity: 1;
} }
span { span {
@ -70,9 +67,9 @@ tg-project-menu {
} }
.active { .active {
background: rgba($black, .2); background: rgba($black, .2);
color: $fresh-taiga; color: $primary-light;
svg path { svg path {
fill: $fresh-taiga; fill: $primary-light;
opacity: 1; opacity: 1;
} }
} }

141
app/styles/modules/common/projects-nav.scss
View File

@ -1,141 +0,0 @@
.projects-nav {
background-color: $menu;
display: flex;
flex-direction: column;
height: 100%;
left: 0;
overflow: hidden;
padding: 2rem 1rem;
position: fixed;
top: 0;
transform: translate3d(-300px, 0, 0);
width: 300px;
z-index: 99;
form {
flex-shrink: 0;
}
h1 {
color: $white;
flex-shrink: 0;
margin-bottom: 2rem;
text-align: center;
}
input {
background-color: $gray;
color: $whitish;
}
.icon-search {
position: absolute;
right: .7rem;
top: .7rem;
}
ul {
left: 0;
margin-bottom: 0;
margin-top: 1rem;
position: relative;
top: 0;
width: 100%;
}
.projects-pagination {
display: flex;
flex-direction: column;
margin-top: 1rem;
min-height: 1px; //firefox bug #2057
}
.create-project-button-wrapper {
display: flex;
flex-shrink: 0;
margin-top: 1rem;
.create-project-button {
flex-grow: 8;
margin-right: .2rem;
text-align: center;
}
.import-project-button {
flex-grow: 1;
padding-left: .5rem;
padding-right: .5rem;
text-align: center;
.icon {
color: $grayer;
margin: 0;
}
}
}
.v-pagination-previous,
.v-pagination-next {
flex-shrink: 0;
}
}
.projects-list {
a {
@extend %large;
@extend %title;
color: $whitish;
display: block;
padding: 1rem;
position: relative;
text-transform: uppercase;
width: 100%;
&.active,
&:hover {
background-color: $gray;
color: $green-taiga;
transition: background-color .3s linear;
.icon {
opacity: 1;
transition: opacity .3s linear;
}
}
.project-name {
display: block;
max-width: 90%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.icon {
color: $whitish;
opacity: 0;
position: absolute;
right: 1rem;
top: 1rem;
}
li {
border-bottom: 2px solid $gray;
}
}
.projects-nav-overlay {
// @include transition (all 1s ease);
@extend %background-taiga;
// background-blend-mode: multiply;
// background-color: $green-taiga;
bottom: 0;
display: none;
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
width: 100%;
z-index: 99900;
.container {
left: -200px;
margin: 0 auto;
margin-top: 15%;
opacity: 0;
position: relative;
transform: translateY(-50%);
width: 150px;
}
p {
@extend %medium;
color: $fresh-taiga;
padding-top: 20px;
text-align: center;
}
}

4
app/styles/modules/common/related-tasks.scss
View File

@ -19,7 +19,7 @@
color: $grayer; color: $grayer;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s ease-in; transition: color .2s ease-in;
} }
} }
@ -153,7 +153,7 @@
} }
.iocaine, .iocaine,
.iocaine:hover { .iocaine:hover {
background: rgba($fresh-taiga, .3); background: rgba($primary-light, .3);
.icon-iocaine { .icon-iocaine {
@extend %large; @extend %large;
display: inline-block; display: inline-block;

12
app/styles/modules/common/wizard.scss
View File

@ -1,6 +1,6 @@
.wizard-create-project { .wizard-create-project {
@extend %lightbox; @extend %lightbox;
background: url('/images/invitation_bg.jpg') no-repeat center center; @extend %background-taiga;
background-size: cover; background-size: cover;
color: $white; color: $white;
text-align: center; text-align: center;
@ -77,7 +77,7 @@
} }
input:checked { input:checked {
+label { +label {
background: rgba($fresh-taiga, .7); background: rgba($primary-light, .7);
transition: background .3s ease-in; transition: background .3s ease-in;
} }
} }
@ -90,7 +90,7 @@
text-align: center; text-align: center;
transition: background .3s ease-in; transition: background .3s ease-in;
&:hover { &:hover {
background: rgba($green-taiga, .7); background: rgba($primary, .7);
transition: background .3s ease-in; transition: background .3s ease-in;
} }
.icon { .icon {
@ -160,12 +160,8 @@
left: 25%; left: 25%;
} }
&:nth-child(2) { &:nth-child(2) {
// left: 50%;
left: 75%; left: 75%;
} }
// &:nth-child(3) {
// left: 75%;
// }
} }
} }
.progress-bar-wrapper { .progress-bar-wrapper {
@ -173,7 +169,7 @@
height: .5rem; height: .5rem;
} }
.bar { .bar {
background: rgba($fresh-taiga, .9); background: rgba($primary-light, .9);
height: .5rem; height: .5rem;
left: 0; left: 0;
position: absolute; position: absolute;

2
app/styles/modules/create-project.scss
View File

@ -47,7 +47,7 @@
margin-bottom: .5rem; margin-bottom: .5rem;
text-align: center; text-align: center;
&:hover { &:hover {
background: $fresh-taiga; background: $primary-light;
} }
} }
a { a {

4
app/styles/modules/filters/filters.scss
View File

@ -75,7 +75,7 @@
} }
.custom-filters { .custom-filters {
.title { .title {
color: $green-taiga; color: $primary;
} }
} }
a { a {
@ -84,7 +84,7 @@
padding: .5rem 0 .5rem .5rem; padding: .5rem 0 .5rem .5rem;
transition: color .2s ease-in; transition: color .2s ease-in;
&:hover { &:hover {
color: $green-taiga; color: $primary;
transition: color .2s ease-in; transition: color .2s ease-in;
.icon { .icon {
opacity: 1; opacity: 1;

6
app/styles/modules/home-project.scss
View File

@ -49,9 +49,6 @@
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
margin-bottom: 1rem; margin-bottom: 1rem;
a {
display: block;
}
li { li {
margin-right: .14rem; margin-right: .14rem;
width: 24%; width: 24%;
@ -59,6 +56,9 @@
margin-right: 0; margin-right: 0;
} }
} }
a {
display: block;
}
img { img {
border-radius: .2rem; border-radius: .2rem;
width: 100%; width: 100%;

4
app/styles/modules/issues/issues-table.scss
View File

@ -6,7 +6,7 @@
} }
.row { .row {
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
.icon { .icon {
@ -14,7 +14,7 @@
} }
} }
.row-selected { .row-selected {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
.title { .title {

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

@ -87,7 +87,7 @@ $column-margin: 0 10px 0 0;
margin-right: .3rem; margin-right: .3rem;
transition: color .2s linear; transition: color .2s linear;
&:hover { &:hover {
color: $green-taiga; color: $primary;
} }
&.hfold, &.hfold,
&.hunfold { &.hunfold {

5
app/styles/modules/search/search-result-table.scss
View File

@ -1,5 +1,4 @@
.search-result-table { .search-result-table {
.empty { .empty {
.title { .title {
border: 0; border: 0;
@ -13,7 +12,7 @@
justify-content: space-between; justify-content: space-between;
padding: .5rem; padding: .5rem;
&:hover { &:hover {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
} }
.ref { .ref {
@ -40,7 +39,7 @@
} }
} }
.row-selected { .row-selected {
background: lighten($green-taiga, 60%); background: lighten($primary, 60%);
transition: background .2s ease-in; transition: background .2s ease-in;
} }

2
app/styles/modules/team/team-filters.scss
View File

@ -18,7 +18,7 @@
padding: 1rem 0 1rem 1rem; padding: 1rem 0 1rem 1rem;
&:hover, &:hover,
&.active { &.active {
color: $green-taiga; color: $primary;
transition: color .3s linear; transition: color .3s linear;
} }
&.active.icon { &.active.icon {

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

@ -28,7 +28,7 @@
color: $grayer; color: $grayer;
} }
.top { .top {
color: $fresh-taiga; color: $primary-light;
opacity: 1; opacity: 1;
} }
&:hover { &:hover {

4
app/styles/modules/user-settings/mail-notifications-table.scss
View File

@ -33,7 +33,7 @@
display: none; display: none;
&:checked { &:checked {
+label { +label {
background: $green-taiga; background: $primary;
transition: background .3s linear; transition: background .3s linear;
} }
} }
@ -45,7 +45,7 @@
display: block; display: block;
padding: .5rem; padding: .5rem;
&:hover { &:hover {
background: $fresh-taiga; background: $primary-light;
cursor: pointer; cursor: pointer;
transition: background .3s linear; transition: background .3s linear;
} }

2
app/styles/modules/wiki/wiki-summary.scss
View File

@ -22,7 +22,7 @@
} }
.username { .username {
@extend %large; @extend %large;
color: $fresh-taiga; color: $primary-light;
white-space: nowrap; white-space: nowrap;
} }
} }

117
app/themes/high-contrast/custom.scss Normal file
View File

@ -0,0 +1,117 @@
// Any styles in this stylesheet will override any previous defined style in Taiga.
// Max: Beat it or I'll call the Brute Squad!
// Fezzik: I'm on the Brute Squad.
// Max: [sees Fezzik's size] You are the Brute Squad!
.working-on .duty-id,
.watching .duty-id,
.activity-item p,
.table-team .avatar .position,
.points-per-role > li,
.private path {
color: $black;
}
.navbar a:hover {
color: $white;
}
.points-per-role > li:first-child {
background: $black;
}
.login-main {
color: $white;
a {
color: $white;
}
}
.home-project-list {
li {
border: 1px solid $black;
}
p {
color: $black;
}
}
.main-nav .active {
background: $white;
svg path {
fill: $black;
}
}
// Titles
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: Arial, Helvetica, sans-serif;
.date {
color: $black;
}
}
.tag {
background: $white;
border: 1px solid $black;
}
.master,
.menu-secondary,
.menu-tertiary,
.extrabar {
background: $white;
border-left: 1px solid $black;
border-right: 1px solid $black;
}
.button-gray {
background: $black;
}
.settings-nav {
.active {
background: $black;
color: $white;
}
}
.admin-submenu ul a {
color: $black;
}
.policy-table {
input:checked {
+label {
color: $white;
}
}
label {
color: $black;
&:hover {
color: $white;
}
}
}
.admin-common .admin-subtitle {
color: $black;
}
.admin-functionalities .functionality.active {
background: $white;
border: 1px solid $black;
}
.admin-membership-table {
.avatar .email,
.delete {
color: $black;
}
}

237
app/themes/high-contrast/variables.scss Executable file
View File

@ -0,0 +1,237 @@
//*************************
//** COLORS
//************************
// Colors
$black: #000;
$blackish: #212121;
$grayer: #212121;
$gray: #757575;
$gray-light: #f5f5f5;
$whitish: #f5f5f5;
$white: #fff;
// Primary colors
$primary-light: #212121;
$primary: #000;
$primary-dark: #000;
//Warning colors
$red-light: #ff0062;
$red: #ff2400;
//Card color
$card: #F0EFD1;
$card-hover: $black;
$card-dark: $black;
$green-japanese-laurel: #009688;
$green-olive: #cddc39;
$red-amaranth: #e91e63;
$purple-eggplant: #9c27b0;
$yellow-pear: #ffc107;
//*************************
//** LAYOUT
//*************************
// Default body color and background
body {
background: $white; // fallback
color: $grayer;
}
// Main
.master {
background: $white;
}
// Secondary panel
.menu-secondary {
background: $white;
}
// Tertiary panel
.menu-tertiary {
background-color: $white;
}
// Extra bar panel
.extrabar {
background: $white;
}
//**************************
//** TYPOGRAPHY
//**************************
// Font Sizes
%xsmall {font-size: .75rem;}
%small {font-size: .9rem;}
%medium {font-size: 1rem;}
%large {font-size: 1.2rem;}
%larger {font-size: 1.6rem;}
%xlarge {font-size: 2rem;}
%xxlarge {font-size: 3rem;}
// Font Types
%title {font-family: Arial, Helvetica, sans-serif; }
%light {font-family: Arial, Helvetica, sans-serif; font-weight: 100; }
%text {font-family: Arial, Helvetica, sans-serif; font-weight: 400; }
%bold {font-family: Arial, Helvetica, sans-serif; font-weight:800; }
%taiga {font-family: 'taiga';}
%mono {font-family: 'courier new', 'monospace';}
// Titles
h1,
h2,
h3,
h4,
h5,
h6 {
color: $blackish;
}
a {
color: $grayer;
&:hover {
color: $primary;
}
}
//**************************
//** SCAFFOLDING
//**************************
//Forms
input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"],
input[type="date"],
input[type="password"],
select,
textarea {
background: $white;
border-color: $black;
color: $black;
@include placeholder {
color:$black;
}
&.checksley-error {
border: 1px solid $red;
}
}
// Input errors
.checksley-error-list {
background: rgba($whitish, .8);
color: $red;
}
// Blockquote
blockquote {
border-left: 5px solid $gray;
}
blockquote,
blockquote p {
color: $black;
}
cite {
color: $black;
}
// lightbox
%lightbox {
background: rgba($white, .95);
}
// Background images
%triangled-bg {
background: url('https://farm9.staticflickr.com/8449/7893171238_a201af22bc_k_d.jpg') no-repeat center center;
background-size: cover;
}
%background-taiga {
background: url('https://farm9.staticflickr.com/8449/7893171238_a201af22bc_k_d.jpg') no-repeat center center;
background-size: cover;
}
.summary {
background: $grayer;
color: $white;
}
//************************
//** NAVIGATION
//***********************
// Top navigation bar
.navbar {
background: $black;
&:after {
background: url('../images/menu-vert.png') repeat top left;
}
}
$top-icon-color: $white;
$dropdown-color: rgba(darken($primary-dark, 20%), 1);
//In project left navigation bar
tg-project-menu {
background-color: rgba(darken($primary-dark, 15%), 1);
background-image: none;
}
.main-nav {
svg path {
fill: $white;
}
}
//*****************************
//** TASKBOARD
//******************************
//Taskboard table
.taskboard-table-header {
.task-colum-name {
background: lighten($white, 20%);
border-top: 3px solid $black;
.icon {
color: $black;
}
}
}
.taskboard-table-body {
.taskboard-tasks-box {
background: $white;
border: 1px solid $black;
}
}
//*****************************
//** KANBAN
//******************************
//Kanban table
.kanban-table-header {
.task-colum-name {
background: lighten($white, 20%);
border-top: 3px solid $black;
.icon {
color: $black;
}
}
}
.kanban-table-body {
.kanban-uses-box {
background: $whitish;
}
}

5
app/themes/material-design/custom.scss Normal file
View File

@ -0,0 +1,5 @@
// Any styles in this stylesheet will override any previous defined style in Taiga.
// Max: Beat it or I'll call the Brute Squad!
// Fezzik: I'm on the Brute Squad.
// Max: [sees Fezzik's size] You are the Brute Squad!

246
app/themes/material-design/variables.scss Executable file
View File

@ -0,0 +1,246 @@
//*************************
//** COLORS
//************************
// Colors
$black: #000;
$blackish: #212121;
$grayer: #424242;
$gray: #757575;
$gray-light: #bdbdbd;
$whitish: #f5f5f5;
$white: #fff;
// Primary colors
$primary-light: #8c9eff;
$primary: #3f51b5;
$primary-dark: #1a237e;
//Warning colors
$red-light: #ff5252;
$red: #f44336;
//Card color
$card: #fff8e4;
$card-hover: #f1e8cd;
$card-dark: #cfc29b;
$green-japanese-laurel: #009688;
$green-olive: #cddc39;
$red-amaranth: #e91e63;
$purple-eggplant: #9c27b0;
$yellow-pear: #ffc107;
//*************************
//** LAYOUT
//*************************
// Default body color and background
body {
background: $white; // fallback
color: $grayer;
}
// Main
.master {
background: $white;
}
// Secondary panel
.menu-secondary {
background: lighten($primary-light, 22%);
}
// Tertiary panel
.menu-tertiary {
background-color: $primary-dark;
}
// Extra bar panel
.extrabar {
background: lighten($primary-light, 22%);
}
//**************************
//** TYPOGRAPHY
//**************************
@each $font-face in OpenSans-CondLight, OpenSans-Light, opensans-regular, opensans-semibold, taiga {
@font-face {
font-family: '#{$font-face}';
src: url('../fonts/#{$font-face}.eot?#iefix') format('embedded-opentype'),
url('../fonts/#{$font-face}.woff') format('woff'),
url('../fonts/#{$font-face}.ttf') format('truetype'),
url('../fonts/#{$font-face}.svg#{$font-face}') format('svg');
}
}
// Font Sizes
%xsmall {font-size: .75rem;}
%small {font-size: .9rem;}
%medium {font-size: 1rem;}
%large {font-size: 1.2rem;}
%larger {font-size: 1.6rem;}
%xlarge {font-size: 2rem;}
%xxlarge {font-size: 3rem;}
// Font Types
%title {font-family: 'OpenSans-CondLight', Arial, Helvetica, sans-serif; }
%light {font-family: 'OpenSans-Light', Arial, Helvetica, sans-serif; }
%text {font-family: 'opensans-regular', Arial, Helvetica, sans-serif; }
%bold {font-family: 'opensans-semibold', Arial, Helvetica, sans-serif; }
%taiga {font-family: 'taiga';}
%mono {font-family: 'courier new', 'monospace';}
// Titles
h1,
h2,
h3,
h4,
h5,
h6 {
color: $blackish;
}
a {
color: $grayer;
&:hover {
color: $primary;
}
}
//**************************
//** SCAFFOLDING
//**************************
//Forms
input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"],
input[type="date"],
input[type="password"],
select,
textarea {
background: $whitish;
border-color: $primary;
color: $grayer;
@include placeholder {
color: darken($gray-light, 10%);
}
&.checksley-error {
border: 1px solid $red;
}
}
// Input errors
.checksley-error-list {
background: rgba($whitish, .8);
color: $red;
}
// Blockquote
blockquote {
border-left: 5px solid $primary-light;
}
blockquote,
blockquote p {
color: $gray;
}
cite {
color: $gray;
}
// lightbox
%lightbox {
background: rgba($white, .95);
}
// Background images
%triangled-bg {
background: url('https://lh4.googleusercontent.com/-k7YewfrSQ_Q/VGdNZND0NBI/AAAAAAAAD1A/UDZBeSGR7iM/w1465-h824-no/Ultimate%2BMaterial%2BLollipop%2BCollection%2B-%2B480') no-repeat center center;
background-size: cover;
}
%background-taiga {
background: url('https://lh6.googleusercontent.com/-2l_mJ5g6j4k/VGdNZCpaERI/AAAAAAAAD2o/zCx5Z3cYv6Y/w1465-h824-no/Ultimate%2BMaterial%2BLollipop%2BCollection%2B-%2B497') no-repeat center center;
background-size: cover;
}
.summary {
background: $grayer;
color: $white;
}
//************************
//** NAVIGATION
//***********************
// Top navigation bar
.navbar {
background: rgba($red-amaranth, .6);
&:after {
background: url('../images/menu-vert.png') repeat top left;
}
}
$top-icon-color: $white;
$dropdown-color: rgba(darken($primary-dark, 20%), 1);
//In project left navigation bar
tg-project-menu {
background-color: rgba(darken($primary-dark, 15%), 1);
background-image: none;
}
.main-nav {
svg path {
fill: $white;
}
}
//*****************************
//** TASKBOARD
//******************************
//Taskboard table
.taskboard-table-header {
.task-colum-name {
background: lighten($primary-light, 20%);
border-top: 3px solid $primary;
.icon {
color: $primary;
}
}
}
.taskboard-table-body {
.taskboard-tasks-box {
background: $whitish;
}
}
//*****************************
//** KANBAN
//******************************
//Kanban table
.kanban-table-header {
.task-colum-name {
background: lighten($primary-light, 20%);
border-top: 3px solid $primary;
.icon {
color: $primary;
}
}
}
.kanban-table-body {
.kanban-uses-box {
background: $whitish;
}
}

5
app/themes/taiga/custom.scss
View File

@ -0,0 +1,5 @@
// Any styles in this stylesheet will override any previous defined style in Taiga.
// Max: Beat it or I'll call the Brute Squad!
// Fezzik: I'm on the Brute Squad.
// Max: [sees Fezzik's size] You are the Brute Squad!

226
app/themes/taiga/variables.scss
View File

@ -1,5 +1,8 @@
// Colors //*************************
//** COLORS
//************************
// Colors
$black: #000; $black: #000;
$blackish: #050505; $blackish: #050505;
$grayer: #444; $grayer: #444;
@ -8,29 +11,226 @@ $gray-light: #b8b8b8;
$whitish: #f5f5f5; $whitish: #f5f5f5;
$white: #fff; $white: #fff;
$green-taiga: #72a114; // Primary colors
$fresh-taiga: #9dce0a; $primary-light: #9dce0a;
$dark-taiga: #879b89; $primary: #72a114;
$primary-dark: #879b89;
//Warning colors
$red-light: #ff8282; $red-light: #ff8282;
$red: #f00; $red: #f00;
$postit: #fff8e4; //Card color
$postit-hover: #f1e8cd; $card: #fff8e4;
$postit-dark-hover: #cfc29b; $card-hover: #f1e8cd;
$card-dark: #cfc29b;
//Loading bar
$green-japanese-laurel: #237400; $green-japanese-laurel: #237400;
$green-olive: #618000; $green-olive: #618000;
$red-amaranth: #e43050; $red-amaranth: #e43050;
$purple-eggplant: #810061; $purple-eggplant: #810061;
$yellow-pear: #bbe831; $yellow-pear: #bbe831;
$menu: #232323; //*************************
$star-fill: #edd400; //** LAYOUT
//*************************
// Default body color and background
body {
background: $white; // fallback
color: $grayer;
}
// Main
.master {
background: $white;
}
// Secondary panel
.menu-secondary {
background: $whitish;
}
// Tertiary panel
.menu-tertiary {
background-color: $primary-dark;
}
// Extra bar panel
.extrabar {
background: $whitish;
}
//**************************
//** TYPOGRAPHY
//**************************
// Font Sizes
%xsmall {font-size: .75rem;}
%small {font-size: .9rem;}
%medium {font-size: 1rem;}
%large {font-size: 1.2rem;}
%larger {font-size: 1.6rem;}
%xlarge {font-size: 2rem;}
%xxlarge {font-size: 3rem;}
// Font Types
%title {font-family: 'OpenSans-CondLight', Arial, Helvetica, sans-serif; }
%light {font-family: 'OpenSans-Light', Arial, Helvetica, sans-serif; }
%text {font-family: 'opensans-regular', Arial, Helvetica, sans-serif; }
%bold {font-family: 'opensans-semibold', Arial, Helvetica, sans-serif; }
%taiga {font-family: 'taiga';}
%mono {font-family: 'courier new', 'monospace';}
// Titles
h1,
h2,
h3,
h4,
h5,
h6 {
color: $blackish;
}
a {
color: $grayer;
&:hover {
color: $primary;
}
}
//**************************
//** SCAFFOLDING
//**************************
//Forms
input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"],
input[type="date"],
input[type="password"],
select,
textarea {
background: $whitish;
border-color: $gray-light;
color: $grayer;
@include placeholder {
color: darken($gray-light, 10%);
}
&.checksley-error {
border: 1px solid $red;
}
}
// Input errors
.checksley-error-list {
background: rgba($whitish, .8);
color: $red;
}
// Blockquote
blockquote {
border-left: 5px solid $whitish;
}
blockquote,
blockquote p {
color: $gray;
}
cite {
color: $gray;
}
// lightbox
%lightbox {
background: rgba($white, .95);
}
// Background images
%triangled-bg {
background: url('/images/bg.png') no-repeat center center;
background-size: cover;
}
%background-taiga {
background: url('/images/invitation_bg.jpg') no-repeat center center;
background-size: cover;
}
.summary {
background: $grayer;
color: $white;
}
//************************
//** NAVIGATION
//***********************
// Top navigation bar
.navbar {
background: rgba($black, .5);
&:after {
background: url('../images/menu-vert.png') repeat top left;
}
}
// Top menu values
$top-icon-color: #11241f; $top-icon-color: #11241f;
$dropdown-width: 350px;
$dropdown-color: rgba(darken($grayer, 20%), 1); $dropdown-color: rgba(darken($grayer, 20%), 1);
//In project left navigation bar
tg-project-menu {
background-color: $primary-dark;
background-image: url('../images/menu.png');
}
.main-nav {
svg path {
fill: $white;
}
}
//*****************************
//** TASKBOARD
//******************************
//Taskboard table
.taskboard-table-header {
.task-colum-name {
background: $whitish;
border-top: 3px solid $gray-light;
.icon {
color: $gray-light;
}
}
}
.taskboard-table-body {
.taskboard-tasks-box {
background: $whitish;
}
}
//*****************************
//** KANBAN
//******************************
//Kanban table
.kanban-table-header {
.task-colum-name {
background: $whitish;
border-top: 3px solid $gray-light;
.icon {
color: $gray-light;
}
}
}
.kanban-table-body {
.kanban-uses-box {
background: $whitish;
}
}