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

Merge pull request #987 from taigaio/refactor/remove-extend 

Remove extend && update gulp-sass
stable
Juanfran 2016-04-29 10:57:54 +02:00
parent a2025dcef0 cb045c6e07
commit 0fd334398f
121 changed files with 791 additions and 866 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/modules/attachments/attachment-gallery.scss
View File

@ -14,7 +14,7 @@
}
}
.attachment-name {
@extend %light;
@include font-type(light);
@include ellipsis(175px);
display: inline-block;
}

18
app/modules/attachments/attachments.scss
View File

@ -25,8 +25,8 @@
justify-content: space-between;
min-height: 36px;
.attachments-title {
@extend %medium;
@extend %bold;
@include font-type(bold);
@include font-size(medium);
color: $grayer;
line-height: 36px;
padding: 0 1rem;
@ -70,8 +70,8 @@
}
}
.size-info {
@extend %light;
@extend %small;
@include font-size(small);
@include font-type(light);
color: $gray;
padding-left: 1rem;
}
@ -81,8 +81,8 @@
}
.attachments-empty {
@extend %large;
@extend %bold;
@include font-size(large);
@include font-type(bold);
border: 3px dashed $whitish;
color: $gray-light;
margin-top: .5rem;
@ -91,10 +91,10 @@
}
.single-attachment {
@extend %small;
@include font-size(small);
background: rgba($white, .9);
.attachment-name {
@extend %bold;
@include font-type(bold);
padding-right: 1rem;
svg {
fill: $gray;
@ -109,7 +109,7 @@
}
.more-attachments {
@extend %small;
@include font-size(small);
border-bottom: 1px solid $gray-light;
display: block;
padding: 1rem 0 1rem 1rem;

6
app/modules/components/live-announcement/live-announcement.scss
View File

@ -43,15 +43,15 @@
width: 100%;
}
.title {
@extend %bold;
@extend %larger;
@include font-type(bold);
@include font-size(larger);
color: $tribe-secondary;
margin-bottom: .5rem;
}
.warning {
color: $tribe-secondary;
a {
@extend %bold;
@include font-type(bold);
color: $tribe-secondary;
}
}

6
app/modules/discover/components/discover-search-bar/discover-search-bar.scss
View File

@ -8,12 +8,12 @@
margin: 0 auto;
}
.title {
@extend %xxlarge;
@include font-size(xxlarge);
margin-bottom: 0;
}
.project-number {
@extend %light;
@extend %large;
@include font-type(light);
@include font-size(large);
color: $primary;
}
form {

6
app/modules/discover/components/discover-search-list-header/discover-search-list-header.scss
View File

@ -10,8 +10,8 @@
margin-right: .25rem;
}
.title {
@extend %bold;
@extend %larger;
@include font-type(bold);
@include font-size(larger);
text-transform: uppercase;
}
h2 {
@ -57,7 +57,7 @@
animation: dropdownFade .2s;
}
.results {
@extend %small;
@include font-size(small);
color: $red-light;
display: block;
padding: .5rem 1rem;

4
app/modules/discover/components/featured-projects/featured-projects.scss
View File

@ -3,8 +3,8 @@
.featured-projects {
@include centered;
.title {
@extend %bold;
@extend %larger;
@include font-type(bold);
@include font-size(larger);
color: $grayer;
text-align: center;
}

16
app/modules/discover/components/highlighted/highlighted.scss
View File

@ -49,8 +49,8 @@
}
}
.title {
@extend %bold;
@extend %larger;
@include font-type(bold);
@include font-size(larger);
color: $grayer;
display: inline-block;
margin: 0;
@ -85,7 +85,7 @@
margin: 1rem auto;
}
span {
@extend %light;
@include font-type(light);
color: $gray;
display: block;
}
@ -122,7 +122,7 @@
}
}
li {
@extend %small;
@include font-size(small);
color: $white;
cursor: pointer;
min-width: 8rem;
@ -161,8 +161,8 @@
justify-content: space-between;
}
.project-title {
@extend %large;
@extend %text;
@include font-size(large);
@include font-type(text);
display: inline-block;
margin-bottom: .5rem;
a {
@ -173,7 +173,7 @@
}
}
.project-description {
@extend %small;
@include font-size(small);
color: $gray;
margin-bottom: 0;
}
@ -188,7 +188,7 @@
}
}
.statistic {
@extend %small;
@include font-size(small);
color: $gray-light;
display: inline-block;
margin-right: .5rem;

6
app/modules/discover/discover-search/discover-search.scss
View File

@ -82,7 +82,7 @@
}
}
.statistic {
@extend %small;
@include font-size(small);
color: $gray-light;
display: inline-block;
margin-right: .5rem;
@ -114,8 +114,8 @@
margin-bottom: 1rem;
}
.title {
@extend %large;
@extend %light;
@include font-size(large);
@include font-type(light);
margin: 0;
text-transform: uppercase;
}

8
app/modules/external-apps/external-app.scss
View File

@ -26,10 +26,10 @@
margin: 0;
}
h3 {
@extend %large;
@include font-size(large);
}
a {
@extend %xsmall;
@include font-size(x-small);
display: block;
}
}
@ -47,7 +47,7 @@
}
p {
@extend %xsmall;
@include font-size(x-small);
}
}
.user-card {
@ -67,7 +67,7 @@
display: block;
}
.cancel {
@extend %small;
@include font-size(small);
display: block;
margin-top: .5rem;
text-align: left;

4
app/modules/home/home.scss
View File

@ -11,8 +11,8 @@
display: block;
}
.title-bar {
@extend %light;
@extend %larger;
@include font-type(light);
@include font-size(larger);
align-content: center;
background: $whitish;
display: flex;

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

@ -35,8 +35,8 @@
width: 100%;
}
p {
@extend %small;
@extend %light;
@include font-size(small);
@include font-type(light);
}
.create-project-button {
display: block;

2
app/modules/home/working-on/empty.scss
View File

@ -2,7 +2,7 @@
.watching-empty {
margin-bottom: 4rem;
p {
@extend %light;
@include font-type(light);
margin: 2rem 9rem 1rem;
text-align: center;
}

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

@ -136,7 +136,7 @@ $dropdown-width: 350px;
}
}
.new {
@extend %small;
@include font-size(small);
background: $red-light;
float: right;
margin-left: auto;

2
app/modules/profile/profile.scss
View File

@ -27,7 +27,7 @@
margin: 10% auto;
width: 3rem;
img {
@extend %loading-spinner;
@include loading-spinner;
max-height: 3rem;
max-width: 3rem;
}

28
app/modules/profile/styles/profile-bar.scss
View File

@ -22,8 +22,8 @@
width: 100%;
}
.profile-edition {
@extend %large;
@extend %light;
@include font-size(large);
@include font-type(light);
background: rgba($black, .4);
bottom: 0;
color: $white;
@ -64,8 +64,8 @@
}
}
h1 {
@extend %bold;
@extend %xlarge;
@include font-type(bold);
@include font-size(xlarge);
line-height: 1.2;
margin-bottom: .25rem;
text-transform: none;
@ -75,15 +75,15 @@
word-wrap: break-word;
}
h2 {
@extend %light;
@extend %larger;
@include font-type(light);
@include font-size(larger);
color: $gray;
line-height: 1.2;
margin-bottom: 1rem;
}
.username {
@extend %light;
@extend %large;
@include font-type(light);
@include font-size(large);
color: $gray-light;
margin-bottom: 1rem;
}
@ -112,20 +112,20 @@
text-align: center;
}
.stat-number {
@extend %xlarge;
@extend %bold;
@include font-size(xlarge);
@include font-type(bold);
display: block;
line-height: 1;
}
.stat-name {
@extend %title;
@extend %small;
@include font-type(text);
@include font-size(small);
display: block;
}
}
.profile-quote {
@extend %light;
@extend %large;
@include font-type(light);
@include font-size(large);
background: url('../images/quote.png') no-repeat top left;
line-height: 1.4;
padding: .5rem;

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

@ -1,6 +1,6 @@
.profile-sidebar {
h4 {
@extend %bold;
@include font-type(bold);
background: $whitish;
color: $gray;
margin-bottom: .5rem;
@ -13,7 +13,7 @@
}
}
p {
@extend %small;
@include font-size(small);
color: $gray-light;
}
a {

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

@ -8,8 +8,8 @@
margin: 2rem 0 1rem;
padding: .9rem 1rem;
h1 {
@extend %larger;
@extend %light;
@include font-size(larger);
@include font-type(light);
margin: 0;
}
}
@ -45,7 +45,7 @@
margin-right: 2rem;
}
.help-area {
@extend %small;
@include font-size(small);
color: $gray-light;
width: 200px;
}

4
app/modules/projects/project/blocked-project.scss
View File

@ -32,7 +32,7 @@
top: -.5rem;
}
.project-title {
@extend %larger;
@include font-size(larger);
}
}
@ -40,6 +40,6 @@
margin-top: 4rem;
text-align: center;
.project-block-title {
@extend %xlarge;
@include font-size(xlarge);
}
}

8
app/modules/projects/transfer/transfer-project.scss
View File

@ -13,7 +13,7 @@
justify-content: center;
min-height: calc(100vh - 40px);
.transfer-title {
@extend %light;
@include font-type(light);
}
&-detail {
align-items: center;
@ -30,8 +30,8 @@
width: 4rem;
}
&-title {
@extend %light;
@extend %larger;
@include font-type(light);
@include font-size(larger);
margin-bottom: .25rem;
}
&-statistics {
@ -84,7 +84,7 @@
&-options {
display: flex;
a {
@extend %large;
@include font-size(large);
display: block;
flex: 1;
padding: .75rem;

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

@ -11,7 +11,7 @@
.username {
color: $primary;
&:first-child {
@extend %bold;
@include font-type(bold);
color: $gray;
}
}
@ -70,7 +70,7 @@
flex: 1;
}
a {
@extend %bold;
@include font-type(bold);
}
p {
color: $gray-light;
@ -80,8 +80,8 @@
border: 0;
padding: 0;
span {
@extend %text;
@extend %medium;
@include font-type(text);
@include font-size(medium);
display: inline-block;
max-width: 95%;
overflow: hidden;
@ -98,7 +98,7 @@
margin: 10% auto;
width: 3rem;
img {
@extend %loading-spinner;
@include loading-spinner;
max-height: 3rem;
max-width: 3rem;
}

6
app/partials/project/wizard-create-project.jade
View File

@ -9,12 +9,6 @@ form
section.template-option
.template-selector-title
legend(translate="WIZARD.CHOOSE_TEMPLATE")
// UX issue
//- a.more-info(
//- href=""
//- title="{{ 'WIZARD.CHOOSE_TEMPLATE_TITLE' | translate }}"
//- translate="WIZARD.CHOOSE_TEMPLATE_INFO"
//- )
.template-selector
fieldset(ng-repeat="template in templates")
input(

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

@ -1,7 +1,7 @@
.button,
%button {
@extend %light;
@extend %small;
@include font-type(light);
@include font-size(small);
background: transparent;
border: 0;
border-radius: 3px;
@ -44,9 +44,8 @@
}
}
}
.trans-button {
@extend %medium;
@extend %title;
@extend %button;
span,
.icon {
@ -123,7 +122,7 @@ a.button-gray {
background: $grayer;
.icon,
img {
@extend %large;
@include font-size(large);
color: $white;
margin-right: .5rem;
}

2
app/styles/components/card-placeholder.scss
View File

@ -29,7 +29,7 @@
text-transform: uppercase;
}
p {
@extend %light;
@include font-type(light);
color: $gray;
margin: 0;
}

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

@ -22,8 +22,8 @@
width: 50%;
}
~ .check-text {
@extend %small;
@extend %text;
@include font-size(small);
@include font-type(text);
color: $white;
position: absolute;
top: .2rem;

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

@ -24,8 +24,8 @@
}
.created-title,
.created-date {
@extend %light;
@extend %small;
@include font-type(light);
@include font-size(small);
color: $gray;
display: block;
text-align: right;

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

@ -10,7 +10,7 @@
}
.drag-drop-help {
@extend %xsmall;
@include font-size(x-small);
color: $gray;
}

6
app/styles/components/estimation.scss
View File

@ -33,7 +33,7 @@
.points,
.role,
.icon-arrow-bottom {
@extend %text;
@include font-type(text);
color: currentColor;
fill: currentColor;
}
@ -45,11 +45,11 @@
width: .6rem;
}
.points {
@extend %light;
@include font-type(light);
color: $grayer;
}
.role {
@extend %light;
@include font-type(light);
}
}
.popover {

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

@ -1,6 +1,6 @@
.single-filter {
@extend %large;
@extend %title;
@include font-size(large);
@include font-type(text);
@include clearfix;
align-items: center;
background: darken($whitish, 10%); // Fallback

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

@ -62,7 +62,7 @@
}
.avatar {
a {
@extend %small;
@include font-size(small);
text-align: center;
}
img {
@ -74,7 +74,7 @@
}
}
.task-text {
@extend %small;
@include font-size(small);
flex-grow: 1;
padding: 0 .5rem 0 .8rem;
}
@ -87,7 +87,7 @@
margin-right: .3rem;
}
.task-name {
@extend %bold;
@include font-type(bold);
}
.loading {
bottom: .5rem;
@ -129,7 +129,7 @@
color: $gray-light;
}
p {
@extend %small;
@include font-size(small);
color: $gray-light;
margin: 0;
&:last-child {
@ -148,7 +148,7 @@
right: .5rem;
}
.task-points {
@extend %small;
@include font-size(small);
color: darken($card-hover, 15%);
margin: 0;
span {
@ -171,7 +171,7 @@
padding: 0 .3rem;
}
.task-archived {
@extend %small;
@include font-size(small);
background: darken($whitish, 5%);
padding: .3rem;
text-align: left;

15
app/styles/components/list-items.scss
View File

@ -8,14 +8,13 @@
padding: .5rem;
padding-right: 0;
h2 {
@extend %normal;
@extend %text;
@include font-type(text);
line-height: 1.4;
margin-bottom: 0;
text-transform: none;
}
p {
@extend %light;
@include font-type(light);
margin-bottom: 0;
}
.list-itemtype-avatar {
@ -41,7 +40,7 @@
}
}
h2 {
@extend %large;
@include font-size(large);
}
.icon-blocked-project {
@include svg-size(.75rem);
@ -96,7 +95,7 @@
}
}
h2 {
@extend %medium;
@include font-size(medium);
}
.ticket-type,
.ticket-project {
@ -123,11 +122,11 @@
.list-itemtype-user {
@include list-itemtype-common;
h2 {
@extend %large;
@include font-size(large);
}
.extra-info {
@extend %small;
@extend %light;
@include font-size(small);
@include font-type(light);
margin-top: .25rem;
}
}

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

@ -18,7 +18,7 @@
width: 100%;
}
p {
@extend %large;
@include font-size(large);
color: $gray;
text-align: center;
}

2
app/styles/components/loading-spinner.scss
View File

@ -1,3 +1,3 @@
.loading-spinner {
@extend %loading-spinner;
@include loading-spinner;
}

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

@ -21,8 +21,8 @@
margin: 0;
}
.warning {
@extend %large;
@extend %bold;
@include font-size(large);
@include font-type(bold);
color: $white;
line-height: 1.2;
}
@ -77,8 +77,8 @@
margin-right: .5rem;
}
.warning {
@extend %xlarge;
@extend %bold;
@include font-size(xlarge);
@include font-type(bold);
color: $white;
line-height: 2.4rem;
}
@ -135,8 +135,8 @@
transition: all .6s;
}
p {
@extend %light;
@extend %small;
@include font-type(light);
@include font-size(small);
margin: 0;
}
.warning {

4
app/styles/components/select-color.scss
View File

@ -24,8 +24,8 @@
margin-bottom: 1rem;
}
input {
@extend %medium;
@extend %text;
@include font-size(medium);
@include font-type(text);
background-color: $whitish;
width: 243px;
@include placeholder {

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

@ -19,15 +19,15 @@ $summary-background: $grayer;
}
}
.number {
@extend %xlarge;
@extend %bold;
@include font-size(xlarge);
@include font-type(bold);
line-height: .9;
margin-right: .3rem;
}
.description {
@extend %small;
@extend %light;
@include font-size(small);
@include font-type(light);
line-height: 1;
}
.stats {
@ -149,7 +149,7 @@ $summary-background: $grayer;
}
.empty-burndown {
@extend %light;
@include font-type(light);
align-content: center;
align-items: center;
background: rgba($primary-dark, .15);
@ -172,14 +172,14 @@ $summary-background: $grayer;
flex: 1;
}
.title {
@extend %light;
@extend %large;
@include font-type(light);
@include font-size(large);
color: $primary-dark;
margin: 0;
text-transform: uppercase;
}
a {
@extend %bold;
@include font-type(bold);
animation: blink 2s infinite;
}
}

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

@ -1,6 +1,6 @@
.tag {
@extend %light;
@extend %small;
@include font-type(light);
@include font-size(small);
background: $whitish; // Fallback
border-radius: 0 5px 5px 0;
color: $grayer;
@ -56,7 +56,7 @@
}
}
.tag {
@extend %small;
@include font-size(small);
margin: 0 .5rem .5rem 0;
padding: .5rem;
}
@ -80,7 +80,7 @@
@include svg-size(.9rem);
}
.add-tag-text {
@extend %small;
@include font-size(small);
}
.remove-tag {
display: inline-block;

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

@ -58,7 +58,7 @@
flex-grow: 1;
max-width: 55px;
a {
@extend %small;
@include font-size(small);
display: block;
text-align: center;
}
@ -87,7 +87,7 @@
width: 1.75rem;
}
.task-assigned {
@extend %small;
@include font-size(small);
color: $card-dark;
display: block;
&:hover {
@ -99,10 +99,10 @@
margin-right: .5em;
}
.task-name {
@extend %bold;
@include font-type(bold);
}
.taskboard-text {
@extend %small;
@include font-size(small);
flex-basis: 50px;
flex-grow: 10;
padding: 0 .5rem 0 1rem;

4
app/styles/components/track-btn.scss
View File

@ -3,7 +3,7 @@
//////////////////////
.track-buttons-container {
@extend %small;
@include font-size(small);
position: relative;
}
@ -102,7 +102,7 @@
}
}
a {
@extend %light;
@include font-type(light);
border-bottom: 1px solid rgba($gray-light, .3);
color: $white;
display: flex;

2
app/styles/components/user-list.scss
View File

@ -21,7 +21,7 @@
}
}
.user-list-name {
@extend %light;
@include font-type(light);
color: $grayer;
margin-left: .5rem;
}

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

@ -4,19 +4,19 @@
overflow: auto;
padding: 1rem;
h1 {
@extend %xlarge;
@extend %text;
@include font-size(xlarge);
@include font-type(text);
line-height: 2.5rem;
text-transform: uppercase;
}
h2 {
@extend %large;
@extend %bold;
@include font-size(large);
@include font-type(bold);
margin-bottom: .5rem;
text-transform: uppercase;
}
h3 {
@extend %bold;
@include font-type(bold);
text-transform: uppercase;
}
ul,
@ -55,7 +55,7 @@
}
pre,
code {
@extend %small;
@include font-size(small);
background: lighten($grayer, 10%);
color: $whitish;
direction: ltr;

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

@ -1,10 +1,16 @@
// Basic layout styles
@include meyer-reset;
* {
box-sizing: border-box;
}
html {
min-height: 100%;
width: 100%;
}
body {
@extend %text;
@include font-type(text);
line-height: 1.3;
min-height: 100%;
width: 100%;

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

@ -9,7 +9,7 @@ blockquote {
margin: 0 0 20px;
padding: .5rem 1.25rem;
cite {
@extend %small;
@include font-size(small);
display: block;
&::before {
content: '\2014 \0020';
@ -27,7 +27,7 @@ ul { list-style: none outside; }
ol { list-style: decimal; }
sup {
@extend %small;
@include font-size(small);
vertical-align: super;
}
@ -83,7 +83,7 @@ svg {
.spin {
img {
@extend %loading-spinner;
@include loading-spinner;
max-height: 2rem;
max-width: 2rem;
}

135
app/styles/core/reset.scss
View File

@ -1,135 +0,0 @@
// FTW
* {
box-sizing: border-box;
}
// #Reset & Basics (Inspired by E. Meyers)
//==================================================
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
border: 0;
font: inherit;
font-size: 100%;
margin: 0;
padding: 0;
vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote::before,
blockquote::after,
q::before,
q::after {
content: '';
}
table {
border-collapse: collapse;
border-spacing: 0;
}

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

@ -36,14 +36,14 @@ h6 {
}
h1 {
@extend %xlarge;
@extend %light;
@include font-size(xlarge);
@include font-type(light);
line-height: 1.5;
margin-bottom: 1rem;
text-transform: uppercase;
span {
@extend %larger;
@include font-size(larger);
margin-right: .5rem;
overflow: hidden;
text-overflow: ellipsis;
@ -77,8 +77,8 @@ h1 {
}
h2 {
@extend %larger;
@extend %text;
@include font-size(larger);
@include font-type(text);
line-height: 1.2;
margin-bottom: 1rem;
}
@ -97,7 +97,7 @@ em {
}
small {
@extend %xsmall;
@include font-size(x-small);
}
strong {

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

@ -1,94 +1,2 @@
// __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;}
%gigantic {font-size: 4rem;}
// __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; }
%mono {font-family: 'courier new', 'monospace';}
%lightbox {
bottom: 0;
display: none;
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
z-index: 99910;
.close {
@include svg-size(2rem);
cursor: pointer;
display: block;
fill: $gray;
position: absolute;
right: 3rem;
top: 3rem;
transition: fill .2s;
display: block;
&:hover {
fill: $red-light;
}
svg {
@include svg-size(2rem);
pointer-events: none;
}
}
&.open {
align-content: center;
align-items: center;
display: flex;
justify-content: center;
opacity: 1;
transition: opacity .3s ease;
}
&.close {
opacity: 0;
transition: opacity .3s ease;
}
.lb-icon {
margin: 1rem auto;
display: flex;
justify-content: center;
svg {
@include svg-size(6rem);
display: block;
fill: $whitish;
}
}
.title {
text-align: center;
}
fieldset {
margin-bottom: 1rem;
}
textarea {
resize: vertical;
}
.button-green,
.button-gray {
display: block;
padding: 12px;
text-align: center;
}
}
%loading-spinner {
animation-timing-function: ease-in-out;
animation: rotate 1.5s cubic-bezier(.00, .05, .87, 1.04) infinite alternate;
margin: 0 auto;
max-height: 1rem;
max-width: 1rem;
transform-origin: 32 32;
}
$navbar: 40px;
$main-height: calc(100vh - 40px);

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

@ -1,159 +0,0 @@
@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;
}
@mixin clearfix {
&:after {
clear: both;
content: '';
display: table;
}
}
@mixin placeholder {
$placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input";
@each $placeholder in $placeholders {
&:#{$placeholder}-placeholder {
@content;
}
}
}
@mixin slide($max, $overflow, $min: 0) {
max-height: $min;
transition: max-height .5s ease-in;
overflow: #{$overflow};
&.open {
transition: max-height .5s ease-in;
max-height: $max;
}
}
@mixin popover($width, $top: '', $left: '', $bottom: '', $right: '', $arrow-width: 0, $arrow-top: '', $arrow-left: '', $arrow-bottom: '', $arrow-height: 15px) {
@extend %light;
@extend %small;
background: $blackish;
bottom: #{$bottom};
color: $white;
display: none;
left: #{$left};
list-style-type: none;
margin: 0;
padding: 10px;
position: absolute;
right: #{$right};
top: #{$top};
width: $width;
z-index: 99;
a {
@extend %small;
border-bottom: 1px solid $grayer;
color: $white;
display: block;
padding: 10px 2px;
&:last-child {
border: 0;
}
&:hover {
color: $primary-light;
transition: color .3s linear;
&.point {
color: $white;
}
}
}
&:after {
background: $blackish;
bottom: #{$arrow-bottom};
content: '';
height: #{$arrow-height};
left: #{$arrow-left};
position: absolute;
top: #{$arrow-top};
transform: rotate(45deg);
width: #{$arrow-width};
}
}
@mixin arrow($arrow-direction, $border-color, $background-color, $border-width, $border-size) {
&:after,
&:before {
#{$arrow-direction}: 100%;
left: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
&:after {
border-color: rgba($background-color, 0);
border-#{$arrow-direction}-color: $background-color;
border-width: #{$border-size}px;
margin-left: -#{$border-size}px;
}
&:before {
border-color: rgba($border-color, 0);
border-#{$arrow-direction}-color: $border-color;
border-width: calc(#{$border-size}px + #{$border-width}px);
margin-left: calc(-#{$border-size}px + #{$border-width}px);
}
}
// Mixin for track buttons
@mixin list-itemtype-track {
.list-itemtype-track {
@extend %small;
color: $gray-light;
display: flex;
flex-shrink: 0;
justify-content: flex-end;
.list-itemtype-track-likers {
margin-right: .5rem;
}
}
.list-itemtype-track-likers,
.list-itemtype-track-watchers {
display: flex;
.icon {
display: block;
margin-right: .25rem;
}
&.active {
color: $primary;
.icon {
fill: currentcolor;
}
}
}
.icon {
fill: $gray-light;
}
}
@mixin cursor-progress {
.in-progress {
cursor: progress;
}
}
@mixin centered {
margin: 1rem auto;
max-width: 1200px;
min-width: 768px;
@include breakpoint(tablet) {
width: 90%;
min-width: 0;
}
}
@mixin svg-size($width: 1rem, $height: null) {
@if $height == null {
width: $width;
height: $width;
} @else {
width: $width;
height: $height;
}
}

9
app/styles/dependencies/mixins/background.scss Normal file
View File

@ -0,0 +1,9 @@
@mixin triangled-bg {
background: url('../images/bg.png') no-repeat center center;
background-size: cover;
}
@mixin background-taiga {
background: url('../images/invitation_bg.jpg') no-repeat center center;
background-size: cover;
}

25
app/styles/dependencies/mixins/box-arrow.scss Normal file
View File

@ -0,0 +1,25 @@
@mixin arrow($arrow-direction, $border-color, $background-color, $border-width, $border-size) {
&:after,
&:before {
#{$arrow-direction}: 100%;
left: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
&:after {
border-color: rgba($background-color, 0);
border-#{$arrow-direction}-color: $background-color;
border-width: #{$border-size}px;
margin-left: -#{$border-size}px;
}
&:before {
border-color: rgba($border-color, 0);
border-#{$arrow-direction}-color: $border-color;
border-width: calc(#{$border-size}px + #{$border-width}px);
margin-left: calc(-#{$border-size}px + #{$border-width}px);
}
}

3
app/styles/dependencies/mixins/box-shadow.scss Normal file
View File

@ -0,0 +1,3 @@
@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;
}

9
app/styles/dependencies/mixins/centered.scss Normal file
View File

@ -0,0 +1,9 @@
@mixin centered {
margin: 1rem auto;
max-width: 1200px;
min-width: 768px;
@include breakpoint(tablet) {
width: 90%;
min-width: 0;
}
}

66
app/styles/dependencies/mixins/lightbox.scss Normal file
View File

@ -0,0 +1,66 @@
@mixin lightbox {
background: rgba($white, .95);
bottom: 0;
display: none;
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
z-index: 99910;
.close {
@include svg-size(2rem);
cursor: pointer;
display: block;
fill: $gray;
position: absolute;
right: 3rem;
top: 3rem;
transition: fill .2s;
display: block;
&:hover {
fill: $red-light;
}
svg {
@include svg-size(2rem);
pointer-events: none;
}
}
&.open {
align-content: center;
align-items: center;
display: flex;
justify-content: center;
opacity: 1;
transition: opacity .3s ease;
}
&.close {
opacity: 0;
transition: opacity .3s ease;
}
.lb-icon {
margin: 1rem auto;
display: flex;
justify-content: center;
svg {
@include svg-size(6rem);
display: block;
fill: $whitish;
}
}
.title {
text-align: center;
}
fieldset {
margin-bottom: 1rem;
}
textarea {
resize: vertical;
}
.button-green,
.button-gray {
display: block;
padding: 12px;
text-align: center;
}
}

8
app/styles/dependencies/mixins/loading-spinner.scss Normal file
View File

@ -0,0 +1,8 @@
@mixin loading-spinner {
animation-timing-function: ease-in-out;
animation: rotate 1.5s cubic-bezier(.00, .05, .87, 1.04) infinite alternate;
margin: 0 auto;
max-height: 1rem;
max-width: 1rem;
transform-origin: 32 32;
}

45
app/styles/dependencies/mixins/popover.scss Normal file
View File

@ -0,0 +1,45 @@
@mixin popover($width, $top: '', $left: '', $bottom: '', $right: '', $arrow-width: 0, $arrow-top: '', $arrow-left: '', $arrow-bottom: '', $arrow-height: 15px) {
@include font-type(light);
@include font-size(small);
background: $blackish;
bottom: #{$bottom};
color: $white;
display: none;
left: #{$left};
list-style-type: none;
margin: 0;
padding: 10px;
position: absolute;
right: #{$right};
top: #{$top};
width: $width;
z-index: 99;
a {
@include font-size(small);
border-bottom: 1px solid $grayer;
color: $white;
display: block;
padding: 10px 2px;
&:last-child {
border: 0;
}
&:hover {
color: $primary-light;
transition: color .3s linear;
&.point {
color: $white;
}
}
}
&:after {
background: $blackish;
bottom: #{$arrow-bottom};
content: '';
height: #{$arrow-height};
left: #{$arrow-left};
position: absolute;
top: #{$arrow-top};
transform: rotate(45deg);
width: #{$arrow-width};
}
}

7
app/styles/dependencies/mixins/profile-form.scss
View File

@ -6,7 +6,7 @@
margin-bottom: 1rem;
}
label {
@extend %light;
@include font-type(light);
display: block;
margin-bottom: .2rem;
}
@ -41,12 +41,12 @@
}
}
.loading-spinner {
@extend %loading-spinner;
@include loading-spinner;
border: 0;
transform-origin: center center;
}
.use-default-image {
@extend %xsmall;
@include font-size(x-small);
display: block;
margin-top: .25rem;
text-align: center;
@ -59,7 +59,6 @@
flex: 1;
max-width: 500px;
}
@include breakpoint(tablet) {
form {
display: block;

5
app/styles/dependencies/mixins/progress.scss Normal file
View File

@ -0,0 +1,5 @@
@mixin cursor-progress {
.in-progress {
cursor: progress;
}
}

10
app/styles/dependencies/mixins/project-card.scss
View File

@ -17,8 +17,8 @@
width: 100%;
}
.project-card-description {
@extend %small;
@extend %light;
@include font-size(small);
@include font-type(light);
color: $gray;
}
.project-card-statistics {
@ -31,7 +31,7 @@
}
}
.statistic {
@extend %small;
@include font-size(small);
color: $gray-light;
display: inline-block;
margin-right: .5rem;
@ -60,8 +60,8 @@
.project-card-name {
line-height: 1.25;
a {
@extend %large;
@extend %large;
@include font-size(large);
@include font-size(large);
color: $primary;
&:hover {
color: $primary-light;

9
app/styles/dependencies/mixins/slide.scss Normal file
View File

@ -0,0 +1,9 @@
@mixin slide($max, $overflow, $min: 0) {
max-height: $min;
transition: max-height .5s ease-in;
overflow: #{$overflow};
&.open {
transition: max-height .5s ease-in;
max-height: $max;
}
}

9
app/styles/dependencies/mixins/svg.scss Normal file
View File

@ -0,0 +1,9 @@
@mixin svg-size($width: 1rem, $height: null) {
@if $height == null {
width: $width;
height: $width;
} @else {
width: $width;
height: $height;
}
}

31
app/styles/dependencies/mixins/track-buttons.scss Normal file
View File

@ -0,0 +1,31 @@
// Mixin for track buttons
@mixin list-itemtype-track {
.list-itemtype-track {
@include font-size(small);
color: $gray-light;
display: flex;
flex-shrink: 0;
justify-content: flex-end;
.list-itemtype-track-likers {
margin-right: .5rem;
}
}
.list-itemtype-track-likers,
.list-itemtype-track-watchers {
display: flex;
.icon {
display: block;
margin-right: .25rem;
}
&.active {
color: $primary;
.icon {
fill: currentcolor;
}
}
}
.icon {
fill: $gray-light;
}
}

39
app/styles/dependencies/mixins/typography.scss Normal file
View File

@ -0,0 +1,39 @@
// __Font Sizes__ //
@mixin font-size($size) {
@if $size == xsmall {
font-size: .75rem;
} @else if $size == small {
font-size: .9rem;
} @else if $size == medium {
font-size: 1rem;
} @else if $size == large {
font-size: 1.2rem;
} @else if $size == larger {
font-size: 1.6rem;
} @else if $size == xlarge {
font-size: 2rem;
} @else if $size == xxlarge {
font-size: 3rem;
} @else if $size == gigantic {
font-size: 4rem;
} @else {
font-size: 1rem;
}
}
@mixin font-type($type) {
@if $type == title {
font-family: 'OpenSans-CondLight', Arial, Helvetica, sans-serif;
} @else if $type == light {
font-family: 'OpenSans-Light', Arial, Helvetica, sans-serif;
} @else if $type == text {
font-family: 'OpenSans-Regular', Arial, Helvetica, sans-serif;
} @else if $type == bold {
font-family: 'OpenSans-Semibold', Arial, Helvetica, sans-serif;
} @else if $type == mono {
font-family: 'courier new', 'monospace';
} @else {
font-family: 'OpenSans-Regular', Arial, Helvetica, sans-serif;
}
}

136
app/styles/dependencies/reset.scss Normal file
View File

@ -0,0 +1,136 @@
// http://meyerweb.com/eric/tools/css/reset/
// v2.0 | 20110126
// License: none (public domain)
@mixin meyer-reset {
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
// HTML5 display-role reset for older browsers
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote {
&:after,
&:before {
content: "";
content: none;
}
}
q {
&:after,
&:before {
content: "";
content: none;
}
}
table {
border-collapse: collapse;
border-spacing: 0;
}
}

4
app/styles/dependencies/responsive.scss
View File

@ -1,7 +1,3 @@
// - Hey, there is a mixin here instead of in mixins.scss!!! Are you drunk or what?
// - I know, I know, but look it closer, it makes sense
// - Oh, I see. It's ok for this time...
@mixin breakpoint($point) {
@if $point == desktop {
@media (min-width: 1200px) { @content ; }

19
app/styles/extras/dependencies.scss
View File

@ -1,9 +1,4 @@
// Bourbon
$prefix-for-webkit: true;
$prefix-for-mozilla: true;
$prefix-for-microsoft: true;
$prefix-for-opera: true;
$prefix-for-spec: true;
@import '../../../vendor/bourbon/app/assets/stylesheets/bourbon';
//#################################################
@ -11,6 +6,18 @@ $prefix-for-spec: true;
//#################################################
@import "variables";
@import '../dependencies/mixins';
@import '../dependencies/reset';
@import '../dependencies/helpers';
@import '../dependencies/responsive';
@import '../dependencies/mixins/typography';
@import '../dependencies/mixins/background';
@import '../dependencies/mixins/box-arrow';
@import '../dependencies/mixins/box-shadow';
@import '../dependencies/mixins/centered';
@import '../dependencies/mixins/lightbox';
@import '../dependencies/mixins/loading-spinner';
@import '../dependencies/mixins/popover';
@import '../dependencies/mixins/progress';
@import '../dependencies/mixins/slide';
@import '../dependencies/mixins/svg';
@import '../dependencies/mixins/track-buttons';

2
app/styles/layout/admin-memberships.scss
View File

@ -1,6 +1,6 @@
.admin-membership {
.limit-users-warning {
@extend %small;
@include font-size(small);
color: $primary;
margin-right: 1rem;
}

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

@ -5,7 +5,7 @@
height: 0;
position: relative;
li {
@extend %light;
@include font-type(light);
background: rgba($red, .7);
position: absolute;
width: 100%;
@ -22,8 +22,8 @@
margin-bottom: 0;
}
p {
@extend %title;
@extend %large;
@include font-type(text);
@include font-size(large);
color: $gray-light;
}
}
@ -37,6 +37,8 @@
padding: .8em 1rem;
text-transform: uppercase;
h2 {
@include font-type(light);
@include font-size(large);
margin: 0;
span {
margin-left: .5rem;

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

@ -1,5 +1,5 @@
.auth {
@extend %triangled-bg;
@include triangled-bg;
align-items: center;
bottom: 0;
display: flex;
@ -22,15 +22,15 @@
}
}
.logo {
@extend %xxlarge;
@extend %title;
@include font-size(xxlarge);
@include font-type(text);
color: $white;
margin-bottom: 1rem;
text-align: center;
}
.tagline {
@extend %xlarge;
@include font-size(xlarge);
color: $white;
line-height: 2rem;
margin-bottom: 1rem;

5
app/styles/layout/backlog.scss
View File

@ -5,14 +5,13 @@
justify-content: space-between;
margin-bottom: 1rem;
.trans-button {
@extend %trans-button;
color: $blackish;
display: inline-block;
padding: .4rem 1.5rem;
&.active,
&:hover {
background: $gray-light;
color: $gray;
background: darken($whitish, 10%);
color: $grayer;
}
&.active {
&:hover {

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

@ -1,5 +1,5 @@
.invitation-main {
@extend %background-taiga;
@include background-taiga;
align-content: center;
align-items: center;
background-size: cover;
@ -19,8 +19,8 @@
display: flex;
flex-direction: column;
.person-name {
@extend %large;
@extend %light;
@include font-size(large);
@include font-type(light);
color: $white;
}
img {
@ -29,12 +29,12 @@
}
}
.invitation-text {
@extend %large;
@extend %light;
@include font-size(large);
@include font-type(light);
color: $white;
text-align: center;
.project-name {
@extend %xlarge;
@include font-size(xlarge);
display: block;
text-transform: uppercase;
}
@ -53,7 +53,7 @@
}
}
.forgot-pass {
@extend %small;
@include font-size(small);
color: $gray-light;
opacity: 1;
position: absolute;
@ -72,8 +72,8 @@
padding: 1rem 3rem;
text-align: center;
.form-header {
@extend %large;
@extend %light;
@include font-size(large);
@include font-type(light);
color: $white;
}
}

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

@ -1,5 +1,5 @@
.error-main {
@extend %background-taiga;
@include background-taiga;
align-items: center;
bottom: 0;
display: flex;

28
app/styles/layout/ticket-detail.scss
View File

@ -8,8 +8,8 @@
margin-bottom: .5rem;
}
.us-title {
@extend %large;
@extend %text;
@include font-size(large);
@include font-type(text);
align-items: flex-start;
background: $whitish;
display: flex;
@ -39,7 +39,7 @@
color: $red-light;
}
.unblock {
@extend %bold;
@include font-type(bold);
color: $white;
float: right;
}
@ -71,8 +71,8 @@
}
}
.us-title-text {
@extend %larger;
@extend %text;
@include font-size(larger);
@include font-type(text);
align-content: center;
align-items: center;
display: flex;
@ -88,7 +88,7 @@
}
}
.us-number {
@extend %text;
@include font-type(text);
color: $gray-light;
flex-shrink: 0;
line-height: 2.2rem;
@ -114,7 +114,7 @@
opacity: 0;
}
.us-related-task {
@extend %small;
@include font-size(small);
color: $gray-light;
margin-top: .5rem;
a {
@ -129,10 +129,10 @@
}
}
.block-desc-container {
@extend %small;
@include font-size(small);
}
.block-description-title {
@extend %bold;
@include font-type(bold);
color: $white;
margin-right: .5rem;
}
@ -143,7 +143,7 @@
}
}
.loading-spinner {
@extend %loading-spinner;
@include loading-spinner;
max-height: 1.5rem;
max-width: 1.5rem;
}
@ -152,14 +152,14 @@
.blocked-warning {
margin-bottom: 1rem;
.blocked {
@extend %title;
@extend %xlarge;
@include font-type(text);
@include font-size(xlarge);
color: $red;
line-height: 2.5rem;
margin-bottom: .5rem;
}
.icon {
@extend %xlarge;
@include font-size(xlarge);
vertical-align: middle;
}
.block-description {
@ -244,7 +244,7 @@
transition: opacity .2s linear;
}
.loading-spinner {
@extend %loading-spinner;
@include loading-spinner;
max-height: 1.5rem;
max-width: 1.5rem;
}

6
app/styles/layout/wiki.scss
View File

@ -1,10 +1,10 @@
.wiki {
.wiki-title {
@extend %light;
@extend %larger;
@include font-type(light);
@include font-size(larger);
}
.remove {
@extend %small;
@include font-size(small);
color: $gray-light;
&:hover {
color: $red-light;

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

@ -9,7 +9,7 @@
margin-bottom: 2rem;
}
.total {
@extend %large;
@include font-size(large);
align-items: center;
background-color: $whitish;
color: $grayer;

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

@ -10,7 +10,7 @@
padding: .5rem 0;
}
.table-header {
@extend %bold;
@include font-type(bold);
border-bottom: 3px solid $whitish;
.custom-name,
.custom-description {

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

@ -27,15 +27,15 @@
}
}
.module-name {
@extend %bold;
@extend %large;
@include font-type(bold);
@include font-size(large);
color: $gray-light;
flex-basis: 100px;
flex-shrink: 0;
margin: 0 .5rem;
}
.module-desc {
@extend %small;
@include font-size(small);
color: $gray-light;
flex: 1;
margin: 0 2rem 0 0;

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

@ -1,6 +1,6 @@
.admin-membership-table {
.title {
@extend %bold;
@include font-type(bold);
}
.avatar {
align-items: center;
@ -27,7 +27,7 @@
width: 100%;
}
.name {
@extend %bold;
@include font-type(bold);
}
.email {
color: $gray-light;
@ -76,7 +76,7 @@
vertical-align: middle;
}
label {
@extend %small;
@include font-size(small);
}
}
.row-member,

3
app/styles/modules/admin/admin-menu.scss
View File

@ -1,7 +1,6 @@
.admin-menu {
li {
@extend %large;
@extend %title;
@include font-type(text);
border-bottom: 1px solid darken($whitish, 10%);
text-transform: uppercase;
&:last-child {

6
app/styles/modules/admin/admin-project-export.scss
View File

@ -8,13 +8,13 @@
margin: 0 auto;
width: 2.5rem;
img {
@extend %loading-spinner;
@include loading-spinner;
width: 100%;
}
}
h3 {
@extend %bold;
@extend %large;
@include font-type(bold);
@include font-size(large);
background: $whitish;
color: $gray;
margin: .5rem;

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

@ -2,7 +2,7 @@
.project-details {
@include profile-form;
.looking-for-people {
@extend %light;
@include font-type(light);
border-bottom: 1px solid $whitish;
border-top: 1px solid $whitish;
padding: 1rem 0;
@ -31,7 +31,7 @@
}
}
.delete-project {
@extend %xsmall;
@include font-size(x-small);
display: block;
margin-top: 1rem;
text-align: right;
@ -40,7 +40,7 @@
}
}
.private-or-public {
@extend %xsmall;
@include font-size(x-small);
color: $gray-light;
margin-bottom: 2rem;
svg {
@ -115,7 +115,7 @@
}
tg-admin-project-restrictions {
p {
@extend %xsmall;
@include font-size(x-small);
text-align: center;
}
a {
@ -163,7 +163,7 @@ tg-admin-project-restrictions {
color: $gray-light;
}
.owner-name {
@extend %bold;
@include font-type(bold);
}
.owner-avatar {
width: 2.5rem;

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

@ -3,8 +3,8 @@
display: inline-block;
}
.role-name {
@extend %xlarge;
@extend %light;
@include font-size(xlarge);
@include font-type(light);
color: $grayer;
}
.icon {
@ -42,8 +42,8 @@
padding: .5rem;
}
.general-category {
@extend %light;
@extend %small;
@include font-type(light);
@include font-size(small);
align-items: center;
display: flex;
justify-content: flex-end;

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

@ -1,7 +1,6 @@
.admin-submenu {
li {
@extend %large;
@extend %title;
@include font-type(text);
border-bottom: 1px solid $gray-light;
text-transform: uppercase;
&:last-child {

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

@ -14,7 +14,7 @@
}
.table-header {
@extend %bold;
@include font-type(bold);
border-bottom: 1px solid $gray-light;
}
.table-body {
@ -137,11 +137,11 @@
justify-content: space-between;
padding: 1.5rem 0 .5rem;
span:first-child {
@extend %bold;
@include font-type(bold);
color: $gray-light;
}
a {
@extend %small;
@include font-size(small);
color: $gray-light;
&:hover {
color: $primary-light;
@ -156,7 +156,7 @@
.history-single-request-body,
.history-single-response-body {
.response-container {
@extend %mono;
@include font-type(mono);
align-content: center;
align-items: center;
background: $whitish;
@ -166,7 +166,7 @@
margin-bottom: .5rem;
}
span {
@extend %small;
@include font-size(small);
color: $gray-light;
flex-basis: 20%;
flex-grow: 1;
@ -174,7 +174,7 @@
text-align: center;
}
textarea {
@extend %mono;
@include font-type(mono);
border: 0;
flex-grow: 2;
min-height: 7.5rem;

6
app/styles/modules/admin/contrib.scss
View File

@ -5,8 +5,8 @@
width: 100%;
}
h2 {
@extend %text;
@extend %large;
@include font-type(text);
@include font-size(large);
margin-bottom: 0;
}
fieldset {
@ -17,7 +17,7 @@
margin-bottom: 1rem;
}
label {
@extend %text;
@include font-type(text);
display: block;
margin-bottom: .25rem;
}

2
app/styles/modules/admin/project-csv.scss
View File

@ -10,7 +10,7 @@
justify-content: space-between;
margin-bottom: 1rem;
a {
@extend %small;
@include font-size(small);
min-width: 110px;
}
.icon:not(.icon-clipboard) {

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

@ -20,7 +20,7 @@
}
.project-values-header {
@extend %bold;
@include font-type(bold);
border-bottom: 3px solid $whitish;
}
.project-values-body {

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

@ -6,13 +6,13 @@
}
input,
textarea {
@extend %text;
@include font-type(text);
}
fieldset {
margin-bottom: 1rem;
}
label {
@extend %text;
@include font-type(text);
display: block;
margin-bottom: .2rem;
}
@ -38,7 +38,7 @@
padding: 0 1rem;
}
.help-copy {
@extend %small;
@include font-size(small);
opacity: 0;
&.visible {
opacity: 1;

2
app/styles/modules/auth/login-form.scss
View File

@ -11,7 +11,7 @@
}
}
.forgot-pass {
@extend %small;
@include font-size(small);
color: $gray;
opacity: 1;
position: absolute;

2
app/styles/modules/auth/register-form.scss
View File

@ -6,6 +6,6 @@
text-align: center;
}
.register-text {
@extend %small;
@include font-size(small);
}
}

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

@ -9,7 +9,7 @@
}
}
.row {
@extend %small;
@include font-size(small);
align-items: center;
border-bottom: 1px solid $gray-light;
display: flex;
@ -128,8 +128,8 @@
.backlog-table-header {
.backlog-table-title {
@extend %text;
@extend %medium;
@include font-type(text);
@include font-size(medium);
border-bottom: 2px solid $gray-light;
flex-wrap: nowrap;
padding-right: 1rem;
@ -204,7 +204,7 @@
display: flex;
flex-wrap: nowrap;
a {
@extend %light;
@include font-type(light);
display: inline-block;
flex: 1;
}
@ -216,7 +216,7 @@
display: none;
margin-bottom: .3rem;
.tag {
@extend %small;
@include font-size(small);
margin-right: .5rem;
padding: .2rem .5rem;
}
@ -250,8 +250,8 @@
position: relative;
width: 100%;
span {
@extend %small;
@extend %title;
@include font-size(small);
@include font-type(text);
color: $white;
position: absolute;
right: .5rem;
@ -290,7 +290,7 @@
margin: 2% auto;
width: 3rem;
img {
@extend %loading-spinner;
@include loading-spinner;
max-height: 3rem;
max-width: 3rem;
}
@ -298,7 +298,7 @@
}
.empty-backlog {
@extend %light;
@include font-type(light);
padding: 2rem;
text-align: center;
.row {
@ -308,7 +308,7 @@
margin-bottom: 1rem;
}
.title {
@extend %large;
@include font-size(large);
margin-bottom: .5rem;
text-transform: uppercase;
}

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

@ -22,7 +22,7 @@
}
}
.filter-closed-sprints {
@extend %small;
@include font-size(small);
align-content: center;
display: flex;
justify-content: center;
@ -45,8 +45,8 @@
}
.sprint-name {
a {
@extend %large;
@extend %title;
@include font-size(normal);
@include font-type(text);
@include ellipsis($width: 90%);
display: inline-block;
margin-right: .5rem;
@ -80,10 +80,10 @@
}
}
.number {
@extend %large;
@include font-size(small);
}
.description {
@extend %xsmall;
@include font-size(x-small);
line-height: .6rem;
margin-top: 5px;
}
@ -92,13 +92,14 @@
justify-content: space-between;
}
.sprint-date {
@extend %large;
@extend %title;
@include font-size(small);
@include font-type(text);
color: $gray-light;
flex-flow: 1;
}
ul {
margin: 0;
text-align: right;
}
li {
display: inline-block;
@ -141,7 +142,7 @@
}
.sprint-table {
.sprint-empty {
@extend %light;
@include font-type(light);
background: darken($whitish, 5%);
border: 2px dashed lighten($gray-light, 10%);
color: $gray;
@ -181,7 +182,7 @@
}
}
.column-us {
@extend %small;
@include font-size(small);
flex-flow: 3;
padding: 0 4px;
}
@ -226,7 +227,7 @@
display: none;
}
.user-story-name {
@extend %small;
@include font-size(small);
line-height: 1rem;
margin-top: 5px;
}
@ -253,14 +254,14 @@
}
.sprints-empty {
@extend %light;
@include font-type(light);
text-align: center;
img {
margin: 1rem 0;
width: 50%;
}
.title {
@extend %large;
@include font-size(large);
margin-bottom: .5rem;
text-transform: uppercase;
}

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

@ -5,7 +5,7 @@ $column-flex: 1;
$column-shrink: 0;
$column-margin: 0 10px 0 0;
%fold {
@mixin fold {
.taskboard-task {
background: none;
border: 0;
@ -71,7 +71,7 @@ $column-margin: 0 10px 0 0;
position: absolute;
}
.task-colum-name {
@extend %medium;
@include font-size(medium);
align-items: center;
background: $whitish;
border-top: 3px solid $gray-light;
@ -107,7 +107,7 @@ $column-margin: 0 10px 0 0;
display: block;
margin-right: .3rem;
svg {
@extend %medium;
@include font-size(medium);
fill: $gray-light;
transition: fill .2s linear;
}
@ -143,10 +143,10 @@ $column-margin: 0 10px 0 0;
}
}
.row-fold {
@extend %fold;
@include fold;
}
.column-fold {
@extend %fold;
@include fold;
.taskboard-task {
max-width: 40px;
width: 40px;
@ -223,13 +223,13 @@ $column-margin: 0 10px 0 0;
.taskboard-userstory-box {
position: relative;
.us-title {
@extend %large;
@extend %title;
@include font-size(normal);
@include font-type(text);
margin-bottom: 0;
margin-right: 3rem;
}
.points-value {
@extend %small;
@include font-size(small);
color: $gray-light;
span {
margin-right: .1rem;

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

@ -13,7 +13,7 @@
}
}
.loading-spinner {
@extend %loading-spinner;
@include loading-spinner;
margin: 1rem auto;
max-height: 2rem;
max-width: 2rem;
@ -49,8 +49,8 @@
flex-grow: 1;
margin-left: .5rem;
.assigned-title {
@extend %small;
@extend %light;
@include font-size(small);
@include font-type(light);
color: $gray;
display: block;
margin: .2rem 0 .25rem;

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

@ -1,7 +1,7 @@
.colors-table {
.table-header {
@extend %medium;
@extend %bold;
@include font-size(medium);
@include font-type(bold);
border-bottom: 3px solid $whitish;
&:hover {
background: transparent;

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

@ -1,7 +1,7 @@
.duty-custom-fields {
margin-bottom: 2rem;
.custom-fields-header {
@extend %bold;
@include font-type(bold);
align-content: space-between;
align-items: center;
background: $whitish;
@ -55,15 +55,15 @@
display: block;
}
.custom-field-description {
@extend %small;
@extend %light;
@include font-size(small);
@include font-type(light);
color: lighten($gray, 20%);
display: block;
line-height: .9rem;
}
}
.custom-field-value {
@extend %light;
@include font-type(light);
align-items: flex-start;
flex: 1;
padding: 0 1rem 0 2rem;

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

@ -12,7 +12,7 @@
}
.external-reference {
@extend %small;
@include font-size(small);
color: $gray-light;
margin-top: .5rem;
a {

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

@ -31,15 +31,15 @@
flex-grow: 1;
}
.activity-changed {
@extend %bold;
@include font-type(bold);
}
.activity-fromto {
@extend %small;
@include font-size(small);
word-wrap: break-word;
}
}
.history-tabs {
@extend %light;
@include font-type(light);
border-bottom: 1px solid $whitish;
border-top: 1px solid $whitish;
margin-bottom: 0;
@ -127,7 +127,7 @@
}
}
.show-more-comments {
@extend %small;
@include font-size(small);
border-bottom: 1px solid $gray-light;
border-top: 1px solid $gray-light;
color: $gray-light;
@ -177,7 +177,7 @@
}
&.deleted-comment,
.deleted-comment {
@extend %small;
@include font-size(small);
color: $gray-light;
padding: .5rem;
a {
@ -196,12 +196,12 @@
display: none;
margin: .2rem 0 .5rem;
p {
@extend %medium;
@include font-size(medium);
}
}
}
.comment-restore {
@extend %small;
@include font-size(small);
color: $gray-light;
display: block;
position: absolute;
@ -245,7 +245,7 @@
}
}
.date {
@extend %small;
@include font-size(small);
color: $gray-light;
margin-left: 1rem;
}

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

@ -1,8 +1,8 @@
.lightbox {
@extend %lightbox;
@include lightbox;
h2 {
@extend %xlarge;
@extend %light;
@include font-size(xlarge);
@include font-type(light);
}
}
@ -22,7 +22,7 @@
resize: vertical;
}
label {
@extend %xsmall;
@include font-size(xsmall);
background: $whitish;
border: 1px solid $gray-light;
color: $grayer;
@ -191,7 +191,7 @@
}
}
.member-limit-warning {
@extend %small;
@include font-size(small);
background: $red-light;
color: $white;
margin: 1rem 0;
@ -199,8 +199,8 @@
text-align: center;
}
.help-text {
@extend %small;
@extend %light;
@include font-size(small);
@include font-type(light);
margin-top: 1rem;
}
.checksley-error-list {
@ -221,7 +221,7 @@
max-width: 600px;
}
.last-sprint-name {
@extend %small;
@include font-size(small);
color: $gray;
opacity: 1;
position: absolute;
@ -247,7 +247,7 @@
}
}
.delete-sprint {
@extend %small;
@include font-size(small);
color: $gray;
float: right;
margin: 1rem .25rem 0 0;
@ -278,8 +278,8 @@
text-align: center;
}
.subtitle {
@extend %large;
@extend %title;
@include font-size(large);
@include font-type(text);
white-space: pre-line;
}
.options {
@ -308,8 +308,8 @@
text-align: center;
}
.subtitle {
@extend %large;
@extend %title;
@include font-size(large);
@include font-type(text);
}
.replacement {
display: block;
@ -332,7 +332,7 @@
}
}
.warning {
@extend %bold;
@include font-type(bold);
}
}
@ -357,8 +357,8 @@
input {
margin-right: .5rem;
+label {
@extend %small;
@extend %text;
@include font-size(small);
@include font-type(text);
}
}
}
@ -388,8 +388,8 @@
text-align: center;
}
.subtitle {
@extend %large;
@extend %title;
@include font-size(large);
@include font-type(text);
}
.options {
display: flex;
@ -427,7 +427,7 @@
margin: 1rem auto;
width: 5rem;
img {
@extend %loading-spinner;
@include loading-spinner;
max-height: 100%;
max-width: 100%;
width: 100%;
@ -446,9 +446,9 @@
transition: width .1s linear;
}
.progress {
@extend %title;
@extend %bold;
@extend %large;
@include font-type(text);
@include font-type(bold);
@include font-size(large);
background: darken($whitish, 5%);
bottom: 35px;
color: $gray;
@ -517,8 +517,8 @@
}
}
.more-watchers {
@extend %title;
@extend %medium;
@include font-type(text);
@include font-size(medium);
padding: .5rem;
text-align: center;
}

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

@ -35,7 +35,7 @@ tg-project-menu {
transition: fill .3s linear;
}
.helper {
@extend %small;
@include font-size(small);
animation: slideLeft 200ms ease-in-out both;
background: linear-gradient(to right, rgba($black, 1) 0%, rgba($black, .8) 100%);
color: $white;
@ -80,7 +80,7 @@ tg-project-menu {
line-height: 2.2rem;
}
.item {
@extend %large;
@include font-size(large);
}
.active {
background: rgba($black, .2);

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

@ -11,8 +11,8 @@
justify-content: space-between;
min-height: 36px;
.related-tasks-title {
@extend %medium;
@extend %bold;
@include font-size(medium);
@include font-type(bold);
margin-left: 1rem;
}
.add-button {
@ -37,7 +37,7 @@
.related-tasks-body {
width: 100%;
.row {
@extend %small;
@include font-size(small);
align-items: center;
border-bottom: 1px solid $whitish;
display: flex;
@ -83,7 +83,7 @@
margin-right: .25rem;
}
input {
@extend %medium;
@include font-size(medium);
margin-right: 1rem;
padding: 3px;
width: 85%;

18
app/styles/modules/common/ticket-data.scss
View File

@ -4,13 +4,13 @@
margin: 1.5rem 0 2rem;
position: relative;
.ticket-title {
@extend %larger;
@extend %light;
@include font-size(larger);
@include font-type(light);
text-transform: uppercase;
vertical-align: sub;
}
.detail-status {
@extend %small;
@include font-size(small);
display: flex;
margin-left: .25rem;
position: relative;
@ -33,7 +33,7 @@
padding: 0;
text-transform: none;
a {
@extend %text;
@include font-type(text);
padding: .5rem 1rem;
}
a:hover {
@ -43,8 +43,8 @@
}
.ticket-data-container {
@extend %small;
@extend %normal;
@include font-size(small);
@include font-type(text);
margin-bottom: 1rem;
.icon {
@include svg-size(.7rem);
@ -114,7 +114,7 @@
.ticket-watch {
.ticket-watch-title {
@extend %bold;
@include font-type(bold);
margin-bottom: .5rem;
}
.ticket-watch-inner {
@ -127,8 +127,8 @@
}
.ticket-watch-button,
.add-watcher {
@extend %light;
@extend %small;
@include font-type(light);
@include font-size(small);
background: $gray-light;
color: $white;
flex: 1;

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

@ -1,5 +1,5 @@
.wizard-create-project {
@extend %lightbox;
@include lightbox;
.close {
@include svg-size(2rem);
}
@ -12,7 +12,7 @@
margin-bottom: 0;
}
.subtitle {
@extend %small;
@include font-size(small);
color: $gray-light;
text-align: center;
}
@ -61,7 +61,7 @@
vertical-align: text-top;
}
.template-name {
@extend %large;
@include font-size(large);
text-transform: uppercase;
}
}
@ -121,7 +121,7 @@
}
}
.create-warning {
@extend %small;
@include font-size(small);
padding: 1rem;
text-align: center;
.icon-exclamation {

Some files were not shown because too many files have changed in this diff Show More