')
- .addClass('icon')
- .addClass('icon-capslock')
- .attr('title', $translate.instant('COMMON.CAPSLOCK_WARNING'))
+
+ warningIcon = "
";
hideIcon = () ->
- warningIcon.fadeOut () ->
+ $('.icon-capslock').fadeOut () ->
open = false
$(this).remove()
diff --git a/app/coffee/modules/common/components.coffee b/app/coffee/modules/common/components.coffee
index dece6008..325c2524 100644
--- a/app/coffee/modules/common/components.coffee
+++ b/app/coffee/modules/common/components.coffee
@@ -321,7 +321,7 @@ AssignedToDirective = ($rootscope, $confirm, $repo, $loading, $qqueue, $template
$model.$modelValue.assigned_to = $currentUserService.getUser().get('id')
save($currentUserService.getUser().get('id'))
- $el.on "click", ".icon-delete", (event) ->
+ $el.on "click", ".remove-user", (event) ->
event.preventDefault()
return if not isEditable()
title = $translate.instant("COMMON.ASSIGNED_TO.CONFIRM_UNASSIGNED")
@@ -498,11 +498,10 @@ EditableSubjectDirective = ($rootscope, $repo, $confirm, $loading, $qqueue, $tem
else if event.keyCode == 27
$scope.$apply () => $model.$modelValue.revert()
- $el.find('div.edit-subject').hide()
- $el.find('div.view-subject').show()
+ $el.find('.edit-subject').hide()
+ $el.find('.view-subject').show()
- $el.find('div.edit-subject').hide()
- $el.find('div.view-subject span.edit').hide()
+ $el.find('.edit-subject').hide()
$scope.$watch $attrs.ngModel, (value) ->
return if not value
diff --git a/app/coffee/modules/common/confirm.coffee b/app/coffee/modules/common/confirm.coffee
index be7452cc..c7c93e20 100644
--- a/app/coffee/modules/common/confirm.coffee
+++ b/app/coffee/modules/common/confirm.coffee
@@ -59,12 +59,12 @@ class ConfirmService extends taiga.Service
el = angular.element(lightboxSelector)
# Render content
- el.find("h2.title").text(title)
- el.find("span.subtitle").text(subtitle)
- el.find("span.message").text(message)
+ el.find(".title").text(title)
+ el.find(".subtitle").text(subtitle)
+ el.find(".message").text(message)
# Assign event handlers
- el.on "click.confirm-dialog", "a.button-green", debounce 2000, (event) =>
+ el.on "click.confirm-dialog", ".button-green", debounce 2000, (event) =>
event.preventDefault()
target = angular.element(event.currentTarget)
currentLoading = @loading()
@@ -77,7 +77,7 @@ class ConfirmService extends taiga.Service
@.hide(el)
}
- el.on "click.confirm-dialog", "a.button-red", (event) =>
+ el.on "click.confirm-dialog", ".button-red", (event) =>
event.preventDefault()
defered.reject()
@.hide(el)
@@ -129,7 +129,7 @@ class ConfirmService extends taiga.Service
@.hide(el)
}
- el.on "click.confirm-dialog", "a.button-red", (event) =>
+ el.on "click.confirm-dialog", ".button-red", (event) =>
event.preventDefault()
defered.reject()
@.hide(el)
@@ -144,15 +144,15 @@ class ConfirmService extends taiga.Service
el = angular.element(".lightbox-generic-error")
# Render content
- el.find("h2.title").html(message)
+ el.find(".title").html(message)
# Assign event handlers
- el.on "click.confirm-dialog", "a.button-green", (event) =>
+ el.on "click.confirm-dialog", ".button-green", (event) =>
event.preventDefault()
defered.resolve()
@.hide(el)
- el.on "click.confirm-dialog", "a.close", (event) =>
+ el.on "click.confirm-dialog", ".close", (event) =>
event.preventDefault()
defered.resolve()
@.hide(el)
@@ -167,16 +167,16 @@ class ConfirmService extends taiga.Service
el = angular.element(".lightbox-generic-success")
# Render content
- el.find("h2.title").html(title) if title
- el.find("p.message").html(message) if message
+ el.find(".title").html(title) if title
+ el.find(".message").html(message) if message
# Assign event handlers
- el.on "click.confirm-dialog", "a.button-green", (event) =>
+ el.on "click.confirm-dialog", ".button-green", (event) =>
event.preventDefault()
defered.resolve()
@.hide(el)
- el.on "click.confirm-dialog", "a.close", (event) =>
+ el.on "click.confirm-dialog", ".close", (event) =>
event.preventDefault()
defered.resolve()
@.hide(el)
@@ -189,15 +189,15 @@ class ConfirmService extends taiga.Service
el = angular.element(".lightbox-generic-loading")
# Render content
- el.find("h2.title").html(title) if title
- el.find("p.message").html(message) if message
+ el.find(".title").html(title) if title
+ el.find(".message").html(message) if message
return {
start: => @lightboxService.open(el)
stop: => @lightboxService.close(el)
update: (status, title, message, percent) =>
- el.find("h2.title").html(title) if title
- el.find("p.message").html(message) if message
+ el.find(".title").html(title) if title
+ el.find(".message").html(message) if message
if percent
el.find(".spin").addClass("hidden")
@@ -251,7 +251,7 @@ class ConfirmService extends taiga.Service
delete @.tsem
- el.on "click", ".icon-delete, .close", (event) =>
+ el.on "click", ".icon-close, .close", (event) =>
body.find(selector)
.removeClass('active')
.addClass('inactive')
diff --git a/app/coffee/modules/common/custom-field-values.coffee b/app/coffee/modules/common/custom-field-values.coffee
index 8568cae5..897cfe24 100644
--- a/app/coffee/modules/common/custom-field-values.coffee
+++ b/app/coffee/modules/common/custom-field-values.coffee
@@ -117,15 +117,15 @@ CustomAttributesValuesDirective = ($templates, $storage) ->
$ctrl.initialize($attrs.type, value.id)
$ctrl.loadCustomAttributesValues()
- $el.on "click", ".custom-fields-header a", ->
+ $el.on "click", ".custom-fields-header .icon", ->
hash = collapsedHash($attrs.type)
collapsed = not($storage.get(hash) or false)
$storage.set(hash, collapsed)
if collapsed
- $el.find(".custom-fields-header a").removeClass("open")
+ $el.find(".custom-fields-header .icon").removeClass("open")
$el.find(".custom-fields-body").removeClass("open")
else
- $el.find(".custom-fields-header a").addClass("open")
+ $el.find(".custom-fields-header .icon").addClass("open")
$el.find(".custom-fields-body").addClass("open")
$scope.$on "$destroy", ->
@@ -235,7 +235,7 @@ CustomAttributeValueDirective = ($template, $selectedText, $compile, $translate,
render(attributeValue, true)
setFocusAndSelectOnInputField()
- $el.on "click", "a.icon-edit", (event) ->
+ $el.on "click", ".js-edit-description", (event) ->
event.preventDefault()
render(attributeValue, true)
setFocusAndSelectOnInputField()
@@ -249,7 +249,7 @@ CustomAttributeValueDirective = ($template, $selectedText, $compile, $translate,
$el.on "submit", "form", submit
- $el.on "click", "a.icon-floppy", submit
+ $el.on "click", ".js-save-description", submit
$scope.$on "$destroy", ->
$el.off()
diff --git a/app/coffee/modules/common/tags.coffee b/app/coffee/modules/common/tags.coffee
index c5ea64e4..271d1e54 100644
--- a/app/coffee/modules/common/tags.coffee
+++ b/app/coffee/modules/common/tags.coffee
@@ -120,10 +120,13 @@ LbTagLineDirective = ($rs, $template, $compile) ->
tag.style = "border-left: 5px solid #{tag.color}"
html = $compile(templateTags(ctx))($scope)
- $el.find("div.tags-container").html(html)
+ $el.find(".tags-container").html(html)
- showSaveButton = -> $el.find(".save").removeClass("hidden")
- hideSaveButton = -> $el.find(".save").addClass("hidden")
+ showSaveButton = ->
+ $el.find(".save").removeClass("hidden")
+
+ hideSaveButton = ->
+ $el.find(".save").addClass("hidden")
resetInput = ->
$el.find("input").val("")
@@ -179,7 +182,7 @@ LbTagLineDirective = ($rs, $template, $compile) ->
event.preventDefault()
saveInputTag()
- $el.on "click", ".icon-delete", (event) ->
+ $el.on "click", ".remove-tag", (event) ->
event.preventDefault()
target = angular.element(event.currentTarget)
@@ -348,7 +351,7 @@ TagLineDirective = ($rootScope, $repo, $rs, $confirm, $qqueue, $template, $compi
hideAddTagButton()
showInput()
- $el.on "click", ".icon-delete", (event) ->
+ $el.on "click", ".remove-tag", (event) ->
event.preventDefault()
target = angular.element(event.currentTarget)
diff --git a/app/coffee/modules/issues/list.coffee b/app/coffee/modules/issues/list.coffee
index c811b2e7..132e5ab1 100644
--- a/app/coffee/modules/issues/list.coffee
+++ b/app/coffee/modules/issues/list.coffee
@@ -461,14 +461,14 @@ IssuesFiltersDirective = ($q, $log, $location, $rs, $confirm, $loading, $templat
showFilters = (title, type) ->
$el.find(".filters-cats").hide()
$el.find(".filter-list").removeClass("hidden")
- $el.find("h2.breadcrumb").removeClass("hidden")
- $el.find("h2 a.subfilter span.title").html(title)
- $el.find("h2 a.subfilter span.title").prop("data-type", type)
+ $el.find(".breadcrumb").removeClass("hidden")
+ $el.find("h2 .subfilter .title").html(title)
+ $el.find("h2 .subfilter .title").prop("data-type", type)
showCategories = ->
$el.find(".filters-cats").show()
$el.find(".filter-list").addClass("hidden")
- $el.find("h2.breadcrumb").addClass("hidden")
+ $el.find(".breadcrumb").addClass("hidden")
initializeSelectedFilters = (filters) ->
selectedFilters = []
@@ -502,7 +502,7 @@ IssuesFiltersDirective = ($q, $log, $location, $rs, $confirm, $loading, $templat
$el.find(".filter-list").html(html)
getFiltersType = () ->
- return $el.find("h2 a.subfilter span.title").prop('data-type')
+ return $el.find(".subfilter .title").prop('data-type')
reloadIssues = () ->
currentFiltersType = getFiltersType()
@@ -617,7 +617,7 @@ IssuesFiltersDirective = ($q, $log, $location, $rs, $confirm, $loading, $templat
toggleFilterSelection(type, id)
- $el.on "click", ".filter-list .single-filter .icon-delete", (event) ->
+ $el.on "click", ".filter-list .single-filter .remove-filter", (event) ->
event.preventDefault()
event.stopPropagation()
@@ -665,7 +665,7 @@ IssuesFiltersDirective = ($q, $log, $location, $rs, $confirm, $loading, $templat
currentLoading.finish()
$scope.filters.myFilters = filters
- currentfilterstype = $el.find("h2 a.subfilter span.title").prop('data-type')
+ currentfilterstype = $el.find("h2 .subfilter .title").prop('data-type')
if currentfilterstype == "myFilters"
renderFilters($scope.filters.myFilters)
diff --git a/app/coffee/modules/related-tasks.coffee b/app/coffee/modules/related-tasks.coffee
index dcb17811..700d0873 100644
--- a/app/coffee/modules/related-tasks.coffee
+++ b/app/coffee/modules/related-tasks.coffee
@@ -62,7 +62,7 @@ RelatedTaskRowDirective = ($repo, $compile, $confirm, $rootscope, $loading, $tem
else if event.keyCode == 27
renderView($model.$modelValue)
- $el.on "click", ".icon-floppy", (event) ->
+ $el.on "click", ".save-task", (event) ->
saveTask($model.$modelValue).then ->
renderView($model.$modelValue)
@@ -79,7 +79,7 @@ RelatedTaskRowDirective = ($repo, $compile, $confirm, $rootscope, $loading, $tem
$el.html($compile(templateView({task: task, perms: perms}))($scope))
- $el.on "click", ".icon-edit", ->
+ $el.on "click", ".edit-task", ->
renderEdit($model.$modelValue)
$el.find('input').focus().select()
diff --git a/app/index.jade b/app/index.jade
index 71ac29b6..66d7d234 100644
--- a/app/index.jade
+++ b/app/index.jade
@@ -45,3 +45,4 @@ html(lang="en")
script(src="/#{v}/js/libs.js")
script(src="/#{v}/js/templates.js")
script(src="/#{v}/js/app-loader.js")
+ include svg/sprite.svg
diff --git a/app/locales/taiga/locale-en.json b/app/locales/taiga/locale-en.json
index 86fee941..f3d15c67 100644
--- a/app/locales/taiga/locale-en.json
+++ b/app/locales/taiga/locale-en.json
@@ -41,7 +41,7 @@
"IOCAINE_TEXT": "Feeling a bit overwhelmed by a task? Make sure others know about it by clicking on Iocaine when editing a task. It's possible to become immune to this (fictional) deadly poison by consuming small amounts over time just as it's possible to get better at what you do by occasionally taking on extra challenges!",
"CLIENT_REQUIREMENT": "Client requirement is new requirement that was not previously expected and it is required to be part of the project",
"TEAM_REQUIREMENT": "Team requirement is a requirement that must exist in the project but should have no cost for the client",
- "CAPSLOCK_WARNING": "Be careful! You're writing with capital letters and this input is case sensitive.",
+ "CAPSLOCK_WARNING": "Be careful! You are writing with capital letters and this input is case sensitive.",
"FORM_ERRORS": {
"DEFAULT_MESSAGE": "This value seems to be invalid.",
"TYPE_EMAIL": "This value should be a valid email.",
@@ -458,9 +458,7 @@
"RECRUITING_MESSAGE": "Who are you looking for?",
"RECRUITING_PLACEHOLDER": "Define the profiles you are looking for",
"PUBLIC_PROJECT": "Public project",
- "PUBLIC_PROJECT_DESC": "Users will be able to find and view your project",
"PRIVATE_PROJECT": "Private project",
- "PRIVATE_PROJECT_DESC": "By default, this project will be hidden to the public",
"PRIVATE_OR_PUBLIC": "What's the difference between public and private projects?",
"DELETE": "Delete this project",
"LOGO_HELP": "The image will be scaled to 80x80px.",
diff --git a/app/modules/attachments/attachment-gallery.scss b/app/modules/attachments/attachment-gallery.scss
index 029b29a9..adeb7276 100644
--- a/app/modules/attachments/attachment-gallery.scss
+++ b/app/modules/attachments/attachment-gallery.scss
@@ -13,58 +13,63 @@
opacity: 1;
}
}
- .attachment-image {
- display: inline-block;
- }
- img {
- height: 150px;
- margin-bottom: .2rem;
- width: 200px;
- &:hover {
- filter: saturate(150%) hue-rotate(60deg);
- transition: all .3s cubic-bezier(.01, .7, 1, 1);
- }
- }
- &.deprecated {
- img {
- opacity: .5;
- }
- .attachment-name {
- color: $gray-light;
- }
- }
- .attachment-data {
- align-content: center;
- display: flex;
- justify-content: space-between;
- }
.attachment-name {
@extend %light;
@include ellipsis(175px);
display: inline-block;
}
- .icon-delete {
- color: $red-light;
- margin-left: auto;
- opacity: 0;
- transition: opacity .3s ease-in;
- transition-delay: .2s;
- &:hover {
- color: $red;
- }
- }
- .loading-container {
- align-items: center;
- display: flex;
- height: 150px;
- justify-content: center;
- margin: 0 .5rem .5rem 0;
- width: 200px;
- }
- .loading-spinner {
- margin: 0 auto;
- max-height: 3rem;
- max-width: 3rem;
+ }
+ .attachment-image {
+ display: inline-block;
+ }
+ img {
+ height: 150px;
+ margin-bottom: .2rem;
+ width: 200px;
+ &:hover {
+ filter: saturate(150%) hue-rotate(60deg);
+ transition: all .3s cubic-bezier(.01, .7, 1, 1);
}
}
+ &.deprecated {
+ img {
+ opacity: .5;
+ }
+ .attachment-name {
+ color: $gray-light;
+ }
+ }
+ .attachment-data {
+ align-content: center;
+ display: flex;
+ justify-content: space-between;
+ }
+ .icon-delete {
+ margin-left: auto;
+ opacity: 0;
+ transition: opacity .2s ease-in;
+ transition-delay: .1s;
+ svg {
+ fill: $red-light;
+ }
+ &:hover {
+ svg {
+ color: $red;
+ }
+
+ }
+ }
+ .loading-container {
+ align-items: center;
+ display: flex;
+ height: 150px;
+ justify-content: center;
+ margin: 0 .5rem .5rem 0;
+ width: 200px;
+ }
+ .loading-spinner {
+ margin: 0 auto;
+ max-height: 3rem;
+ max-width: 3rem;
+ }
}
diff --git a/app/modules/attachments/attachment-list.scss b/app/modules/attachments/attachment-list.scss
index dc2e21db..df533f2b 100644
--- a/app/modules/attachments/attachment-list.scss
+++ b/app/modules/attachments/attachment-list.scss
@@ -47,34 +47,29 @@
flex-shrink: 0;
justify-content: space-around;
margin-left: auto;
- .settings,
- .editable-settings {
- @extend %large;
- color: $gray-light;
- &:hover {
- color: $primary;
- }
- }
.settings {
opacity: 0;
}
.editable-settings {
opacity: 1;
}
- .icon-delete {
+ svg {
+ fill: $gray-light;
+ }
+ .icon-edit,
+ .icon-save {
&:hover {
- color: $red;
+ fill: $primary;
}
}
- .icon-drag-v {
- cursor: move;
+ .icon-trash,
+ .icon-close {
+ &:hover {
+ fill: $red;
+ }
}
- }
- .icon-delete {
- @extend %large;
- color: $gray-light;
- &:hover {
- color: $red;
+ .icon-drag {
+ cursor: move;
}
}
.editable-attachment-deprecated {
diff --git a/app/modules/attachments/attachments.scss b/app/modules/attachments/attachments.scss
index 59e2336d..61b9e15f 100644
--- a/app/modules/attachments/attachments.scss
+++ b/app/modules/attachments/attachments.scss
@@ -4,6 +4,7 @@
.attachments-header {
align-content: center;
+ align-items: center;
background: $whitish;
display: flex;
justify-content: space-between;
@@ -33,9 +34,9 @@
}
svg {
fill: $white;
- height: 1.25rem;
+ height: 1.2rem;
margin-bottom: -.2rem;
- width: 1.25rem;
+ width: 1.2rem;
}
}
button {
@@ -50,7 +51,6 @@
svg {
fill: $gray-light;
height: 1.6rem;
- margin-bottom: -.2rem;
width: 1.6rem;
}
}
@@ -77,6 +77,7 @@
.single-attachment {
@extend %small;
+ background: rgba($white, .9);
&.ui-sortable-helper {
background: lighten($primary, 60%);
box-shadow: 1px 1px 10px rgba($black, .1);
@@ -89,12 +90,11 @@
.attachment-name {
@extend %bold;
padding-right: 1rem;
- .icon {
- margin-right: .25rem;
- }
svg {
- height: 1.2rem;
- width: 1.2rem;
+ fill: $gray;
+ height: .9rem;
+ margin-right: .25rem;
+ width: .9rem;
}
}
.attachment-size {
diff --git a/app/modules/components/attachment/attachment-gallery.jade b/app/modules/components/attachment/attachment-gallery.jade
index dbb353b1..b6c560a1 100644
--- a/app/modules/components/attachment/attachment-gallery.jade
+++ b/app/modules/components/attachment/attachment-gallery.jade
@@ -30,8 +30,9 @@
span {{::vm.attachment.getIn(['file', 'name'])}}
a.icon-delete(
- ng-if="vm.attachment.get('editable')"
href=""
title="{{'COMMON.DELETE' | translate}}"
ng-click="vm.delete()"
)
+ svg.icon.icon-trash
+ use(xlink:href="#icon-trash")
diff --git a/app/modules/components/attachment/attachment.jade b/app/modules/components/attachment/attachment.jade
index 32df1083..b0207960 100644
--- a/app/modules/components/attachment/attachment.jade
+++ b/app/modules/components/attachment/attachment.jade
@@ -12,8 +12,8 @@ form.single-attachment(
target="_blank"
download="{{::vm.attachment.getIn(['file', 'name'])}}"
)
- span.icon
- include ../../../svg/attachment.svg
+ svg.icon.icon-attachment
+ use(xlink:href="#icon-attachment")
span {{::vm.attachment.getIn(['file', 'name'])}}
.attachment-comments(ng-if="!vm.attachment.get('editable') && vm.attachment.getIn(['file', 'description'])")
@@ -47,34 +47,44 @@ form.single-attachment(
.attachment-settings(ng-if="vm.attachment.get('editable')")
div(tg-loading="vm.attachment.get('loading')")
- a.editable-settings.icon.icon-floppy(
+ a.editable-settings(
href=""
title="{{'COMMON.SAVE' | translate}}"
ng-click="vm.save()"
)
+ svg.drag.icon.icon-save
+ use(xlink:href="#icon-save")
div
- a.editable-settings.icon.icon-delete(
+ a.editable-settings(
href=""
title="{{'COMMON.CANCEL' | translate}}"
ng-click="vm.editMode(false)"
)
+ svg.drag.icon.icon-close
+ use(xlink:href="#icon-close")
.attachment-settings(
ng-if="!vm.attachment.get('editable')"
tg-check-permission="modify_{{vm.type}}"
)
- a.settings.icon.icon-edit(
+ a.settings(
href=""
title="{{'COMMON.EDIT' | translate}}"
ng-click="vm.editMode(true)"
)
- a.settings.icon.icon-delete(
+ svg.drag.icon.icon-edit
+ use(xlink:href="#icon-edit")
+ a.settings(
href=""
title="{{'COMMON.DELETE' | translate}}"
ng-click="vm.delete()"
)
- a.settings.icon.icon-drag-v(
+ svg.drag.icon.icon-trash
+ use(xlink:href="#icon-trash")
+ a.settings(
href=""
title="{{'COMMON.DRAG' | translate}}"
)
+ svg.drag.icon.icon-drag
+ use(xlink:href="#icon-drag")
diff --git a/app/modules/components/attachments-full/attachments-full.jade b/app/modules/components/attachments-full/attachments-full.jade
index 9968d9fa..98a9710d 100644
--- a/app/modules/components/attachments-full/attachments-full.jade
+++ b/app/modules/components/attachments-full/attachments-full.jade
@@ -8,21 +8,24 @@ section.attachments(tg-attachments-drop="vm.addAttachments(files, false)")
ng-click="vm.setMode('gallery')"
title="{{ 'ATTACHMENT.GALLERY_VIEW_MODE' | translate }}"
)
- include ../../../svg/gallery.svg
+ svg.icon.icon-gallery
+ use(xlink:href="#icon-gallery")
button.view-list(
ng-class="{'is-active': vm.mode == 'list'}"
ng-if="vm.attachments.size"
ng-click="vm.setMode('list')"
title="{{ 'ATTACHMENT.LIST_VIEW_MODE' | translate }}"
)
- include ../../../svg/list.svg
+ svg.icon.icon-list
+ use(xlink:href="#icon-list")
.add-attach(
tg-check-permission="modify_{{vm.type}}"
title!="{{'ATTACHMENT.ADD' | translate}}"
)
label.add-attachment-button(for="add-attach")
- include ../../../svg/add.svg
+ svg.icon.icon-add
+ use(xlink:href="#icon-add")
input(
id="add-attach",
@@ -49,12 +52,11 @@ section.attachments(tg-attachments-drop="vm.addAttachments(files, false)")
.single-attachment(ng-repeat="file in vm.uploadingAttachments()")
.attachment-name
- span.icon
- include ../../../svg/attachment.svg
+ svg.icon.icon-attachment
+ use(xlink:href="#icon-attachment")
span {{file.name}}
.attachment-size
span {{file.size | sizeFormat}}
-
.attachment-comments
span {{file.progressMessage}}
.percentage(ng-style="{'width': file.progressPercent}")
diff --git a/app/modules/components/attachments-simple/attachments-simple.jade b/app/modules/components/attachments-simple/attachments-simple.jade
index 461f5ba8..9b4cdcc7 100644
--- a/app/modules/components/attachments-simple/attachments-simple.jade
+++ b/app/modules/components/attachments-simple/attachments-simple.jade
@@ -5,7 +5,8 @@ section.attachments(tg-attachments-drop="vm.addAttachments(files)")
h3.attachments-title #[span.attachments-num {{vm.attachments.size}}] #[span.attachments-text(translate="ATTACHMENT.SECTION_NAME")]
.add-attach(title!="{{'ATTACHMENT.ADD' | translate}}")
label.add-attachment-button(for="add-attach")
- include ../../../svg/add.svg
+ svg.icon.icon-add
+ use(xlink:href="#icon-add")
input(
id="add-attach"
type="file"
@@ -18,8 +19,8 @@ section.attachments(tg-attachments-drop="vm.addAttachments(files)")
.attachment-body.attachment-list
.single-attachment(tg-repeat="attachment in vm.attachments track by $index")
.attachment-name
- span.icon
- include ../../../svg/attachment.svg
+ svg.icon.icon-attachment
+ use(xlink:href="#icon-attachment")
span {{attachment.get('name')}}
.attachment-size
span {{attachment.get('size') | sizeFormat}}
@@ -30,4 +31,5 @@ section.attachments(tg-attachments-drop="vm.addAttachments(files)")
title="{{'COMMON.DELETE' | translate}}"
ng-click="vm.deleteAttachment(attachment)"
)
- include ../../../svg/remove.svg
+ svg.icon.icon-trash
+ use(xlink:href="#icon-trash")
diff --git a/app/modules/components/attachments-sortable/attachments-sortable.directive.coffee b/app/modules/components/attachments-sortable/attachments-sortable.directive.coffee
index c220e9b2..17f62ae6 100644
--- a/app/modules/components/attachments-sortable/attachments-sortable.directive.coffee
+++ b/app/modules/components/attachments-sortable/attachments-sortable.directive.coffee
@@ -23,7 +23,7 @@ AttachmentSortableDirective = ($parse) ->
el.sortable({
items: "div[tg-bind-scope]"
- handle: "a.settings.icon.icon-drag-v"
+ handle: ".settings .icon"
containment: ".attachments"
dropOnEmpty: true
helper: 'clone'
diff --git a/app/modules/components/live-announcement/live-announcement.jade b/app/modules/components/live-announcement/live-announcement.jade
index 25df0db7..1c2a4225 100644
--- a/app/modules/components/live-announcement/live-announcement.jade
+++ b/app/modules/components/live-announcement/live-announcement.jade
@@ -9,4 +9,5 @@
href=""
title="{{ COMMON.CLOSE | translate }}"
)
- include ../../../svg/remove.svg
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
diff --git a/app/modules/components/project-menu/project-menu.jade b/app/modules/components/project-menu/project-menu.jade
index e411f98a..acde56ac 100644
--- a/app/modules/components/project-menu/project-menu.jade
+++ b/app/modules/components/project-menu/project-menu.jade
@@ -12,7 +12,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.SEARCH' | translate}}"
tabindex="1"
)
- span.icon.icon-search
+ svg.icon.icon-search
+ use(xlink:href="#icon-search")
span.helper(translate="PROJECT.SECTION.SEARCH")
li(id="nav-timeline")
@@ -22,7 +23,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.TIMELINE' | translate}}"
tabindex="2"
)
- include ../../../svg/timeline.svg
+ svg.icon.icon-timeline
+ use(xlink:href="#icon-timeline")
span.helper(translate="PROJECT.SECTION.TIMELINE")
li(id="nav-backlog", ng-if="vm.menu.get('backlog')")
@@ -32,7 +34,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.BACKLOG' | translate}}"
tabindex="2"
)
- span.icon.icon-scrum
+ svg.icon.icon-scrum
+ use(xlink:href="#icon-scrum")
span.helper(translate="PROJECT.SECTION.BACKLOG")
li(id="nav-kanban", ng-if="vm.menu.get('kanban')")
@@ -42,7 +45,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.KANBAN' | translate}}"
tabindex="3"
)
- span.icon.icon-kanban
+ svg.icon.icon-kanban
+ use(xlink:href="#icon-kanban")
span.helper(translate="PROJECT.SECTION.KANBAN")
li(id="nav-issues", ng-if="vm.menu.get('issues')")
@@ -52,7 +56,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.ISSUES' | translate}}"
tabindex="4"
)
- span.icon.icon-issues
+ svg.icon.icon-issues
+ use(xlink:href="#icon-issues")
span.helper(translate="PROJECT.SECTION.ISSUES")
li(id="nav-wiki", ng-if="vm.menu.get('wiki')")
@@ -62,7 +67,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.WIKI' | translate}}"
tabindex="5"
)
- span.icon.icon-wiki
+ svg.icon.icon-wiki
+ use(xlink:href="#icon-wiki")
span.helper(translate="PROJECT.SECTION.WIKI")
li(id="nav-team")
@@ -72,7 +78,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.TEAM' | translate}}"
tabindex="6"
)
- span(class="icon icon-team")
+ svg.icon.icon-team
+ use(xlink:href="#icon-team")
span.helper(translate="PROJECT.SECTION.TEAM")
li(id="nav-video", ng-if="vm.project.get('videoconferenceUrl')")
@@ -82,7 +89,8 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.MEETUP' | translate}}"
tabindex="7"
)
- span.icon.icon-video
+ svg.icon.icon-bubble
+ use(xlink:href="#icon-bubble")
span.helper(translate="PROJECT.SECTION.MEETUP")
li(id="nav-admin", ng-if="vm.project.get('i_am_owner')")
@@ -92,5 +100,6 @@ nav.menu(
aria-label="{{'PROJECT.SECTION.ADMIN' | translate}}"
tabindex="8"
)
- span.icon.icon-settings
+ svg.icon.icon-settings
+ use(xlink:href="#icon-settings")
span.helper(translate="PROJECT.SECTION.ADMIN")
diff --git a/app/modules/components/vote-button/vote-button.jade b/app/modules/components/vote-button/vote-button.jade
index 24d63b04..f0b07a4c 100644
--- a/app/modules/components/vote-button/vote-button.jade
+++ b/app/modules/components/vote-button/vote-button.jade
@@ -9,7 +9,8 @@ a.vote-inner(
ng-mouseleave="vm.showTextWhenMouseIsLeave()"
)
span.track-icon
- include ../../../svg/upvote.svg
+ svg.icon.icon-upvote
+ use(xlink:href="#icon-upvote")
span.track-button-counter(
title="{{ 'COMMON.VOTE_BUTTON.COUNTER_TITLE'|translate:{total:vm.item.total_voters||0}:'messageformat' }}",
tg-loading="vm.loading"
@@ -18,7 +19,8 @@ a.vote-inner(
//- Anonymous user button
span.vote-inner(ng-if="::!vm.user")
span.track-icon
- include ../../../svg/upvote.svg
+ svg.icon.icon-upvote
+ use(xlink:href="#icon-upvote")
span.track-button-counter(
title="{{ 'COMMON.VOTE_BUTTON.COUNTER_TITLE'|translate:{total:vm.item.total_voters||0}:'messageformat' }}"
) {{ ::vm.item.total_voters }}
diff --git a/app/modules/components/watch-button/watch-button-ticket.jade b/app/modules/components/watch-button/watch-button-ticket.jade
index e54d36fd..661be69b 100644
--- a/app/modules/components/watch-button/watch-button-ticket.jade
+++ b/app/modules/components/watch-button/watch-button-ticket.jade
@@ -13,20 +13,18 @@ div.ticket-watch-inner
ng-mouseover="vm.showTextWhenMouseIsOver()"
ng-mouseleave="vm.showTextWhenMouseIsLeave()"
)
- span.track-icon
- include ../../../svg/watch.svg
- span(
- ng-if="!vm.item.is_watcher",
- translate="COMMON.WATCH_BUTTON.WATCH"
- )
- span(
- ng-if="vm.item.is_watcher && !vm.isMouseOver",
- translate="COMMON.WATCH_BUTTON.WATCHING"
- )
- span(
- ng-if="vm.item.is_watcher && vm.isMouseOver",
- translate="COMMON.WATCH_BUTTON.UNWATCH"
- )
+ span(ng-if="!vm.item.is_watcher")
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
+ | {{'COMMON.WATCH_BUTTON.WATCH' | translate}}
+ span(ng-if="vm.item.is_watcher && !vm.isMouseOver",)
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
+ | {{'COMMON.WATCH_BUTTON.WATCHING' | translate}}
+ span(ng-if="vm.item.is_watcher && vm.isMouseOver")
+ svg.icon.icon-unwatch
+ use(xlink:href="#icon-unwatch")
+ | {{'COMMON.WATCH_BUTTON.UNWATCH' | translate}}
a.add-watcher(
href=""
diff --git a/app/modules/components/watch-button/watch-button.jade b/app/modules/components/watch-button/watch-button.jade
index 2d25bbde..842f0d60 100644
--- a/app/modules/components/watch-button/watch-button.jade
+++ b/app/modules/components/watch-button/watch-button.jade
@@ -2,8 +2,7 @@ mixin counter
span.track-button-counter(
title="{{ 'COMMON.WATCH_BUTTON.COUNTER_TITLE'|translate:{total:vm.item.watchers.length||0}:'messageformat' }}",
tg-loading="vm.loading"
- )
- | {{ vm.item.watchers.length }}
+ ) {{ vm.item.watchers.length }}
//- Registered user button
@@ -17,8 +16,8 @@ a.track-button.watch-button.watch-container(
ng-mouseleave="vm.showTextWhenMouseIsLeave()"
)
span.track-inner
- span.track-icon
- include ../../../svg/watch.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span(
ng-if="!vm.item.is_watcher",
translate="COMMON.WATCH_BUTTON.WATCH"
@@ -39,6 +38,7 @@ span.track-button.watch-button.watch-container(
)
span.track-inner
span.track-icon
- include ../../../svg/watch.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span(translate="COMMON.WATCH_BUTTON.WATCHERS")
+counter
diff --git a/app/modules/discover/components/discover-home-order-by/discover-home-order-by.jade b/app/modules/discover/components/discover-home-order-by/discover-home-order-by.jade
index fbaaa04c..9379c7d0 100644
--- a/app/modules/discover/components/discover-home-order-by/discover-home-order-by.jade
+++ b/app/modules/discover/components/discover-home-order-by/discover-home-order-by.jade
@@ -3,7 +3,8 @@
href="#"
ng-click="vm.open()"
) {{vm.currentText()}}
- span.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
ul.filter-list(ng-if="vm.is_open")
li(ng-click="vm.orderBy('week')") {{ 'DISCOVER.FILTERS.WEEK' | translate }}
diff --git a/app/modules/discover/components/discover-search-bar/discover-search-bar.jade b/app/modules/discover/components/discover-search-bar/discover-search-bar.jade
index 201c6bca..436c92af 100644
--- a/app/modules/discover/components/discover-search-bar/discover-search-bar.jade
+++ b/app/modules/discover/components/discover-search-bar/discover-search-bar.jade
@@ -18,12 +18,12 @@ div.discover-header
placeholder="{{ 'DISCOVER.SEARCH.INPUT_PLACEHOLDER' | translate }}"
ng-model="vm.q"
)
- a.search-button(
+ svg.search-button.icon.icon-search(
ng-click="vm.submitFilter()"
href="#"
title="{{ 'DISCOVER.SEARCH.ACTION_TITLE' | translate }}"
)
- include ../../../../svg/search.svg
+ use(xlink:href="#icon-search")
fieldset.searchbox-filters(ng-if="vm.filter")
input(
diff --git a/app/modules/discover/components/discover-search-bar/discover-search-bar.scss b/app/modules/discover/components/discover-search-bar/discover-search-bar.scss
index a45705b2..888a06b8 100644
--- a/app/modules/discover/components/discover-search-bar/discover-search-bar.scss
+++ b/app/modules/discover/components/discover-search-bar/discover-search-bar.scss
@@ -36,19 +36,15 @@
}
}
.search-button {
+ @include svg-size(1.5rem);
+ fill: $gray-light;
position: absolute;
right: 1rem;
top: 1rem;
+ transition: fill .2s;
&:hover {
- svg {
- fill: $primary;
- }
+ cursor: pointer;
+ fill: $primary;
}
}
- svg {
- fill: $gray-light;
- height: 1.5rem;
- transition: all .2;
- width: 1.5rem;
- }
}
diff --git a/app/modules/discover/components/discover-search-list-header/discover-search-list-header.jade b/app/modules/discover/components/discover-search-list-header/discover-search-list-header.jade
index b480a619..42c854fb 100644
--- a/app/modules/discover/components/discover-search-list-header/discover-search-list-header.jade
+++ b/app/modules/discover/components/discover-search-list-header/discover-search-list-header.jade
@@ -1,7 +1,8 @@
.discover-results-header
.discover-results-header-inner
.title
- include ../../../../svg/search.svg
+ svg.icon.icon-search
+ use(xlink:href="#icon-search")
h2 {{ 'DISCOVER.SEARCH.RESULTS' | translate }}
.filter-discover-search(ng-mouseleave="vm.toggleClose()")
@@ -10,14 +11,16 @@
ng-click="vm.openLike()"
ng-class="{active: vm.like_is_open}"
)
- include ../../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{ 'DISCOVER.MOST_LIKED' | translate }}
a.discover-search-filter(
href="#"
ng-click="vm.openActivity()"
ng-class="{active: vm.activity_is_open}"
)
- include ../../../../svg/activity.svg
+ svg.icon.icon-activity
+ use(xlink:href="#icon-activity")
span {{ 'DISCOVER.MOST_ACTIVE' | translate }}
.discover-search-subfilter.most-liked-subfilter(ng-if="vm.like_is_open")
diff --git a/app/modules/discover/components/discover-search-list-header/discover-search-list-header.scss b/app/modules/discover/components/discover-search-list-header/discover-search-list-header.scss
index d3112c54..6f265a9a 100644
--- a/app/modules/discover/components/discover-search-list-header/discover-search-list-header.scss
+++ b/app/modules/discover/components/discover-search-list-header/discover-search-list-header.scss
@@ -5,8 +5,9 @@
justify-content: space-between;
}
svg {
- @include svg-size(1.1rem);
+ @include svg-size(1.2rem);
fill: $gray-light;
+ margin-right: .25rem;
}
.title {
@extend %bold;
@@ -23,8 +24,14 @@
margin-right: 1rem;
&.active {
color: $primary;
+ svg {
+ fill: $primary;
+ }
}
}
+ svg {
+ @include svg-size(.8rem);
+ }
}
.discover-search-subfilter {
diff --git a/app/modules/discover/components/featured-projects/featured-projects.jade b/app/modules/discover/components/featured-projects/featured-projects.jade
index 53c3514b..783c71e3 100644
--- a/app/modules/discover/components/featured-projects/featured-projects.jade
+++ b/app/modules/discover/components/featured-projects/featured-projects.jade
@@ -26,28 +26,31 @@
tg-nav="project:project=project.get('slug')"
title="{{::project.get('name')}}"
) {{::project.get('name')}}
- span.look-for-people(
+ svg.look-for-people.icon.icon-recruit(
ng-if="project.get('is_looking_for_people')"
- title="{{ ::project.get('looking_for_people_note') }}"
)
- include ../../../../svg/recruit.svg
+ use(xlink:href="#icon-recruit")
+ title="{{ ::project.get('looking_for_people_note') }}"
p.project-card-description {{ ::project.get('description') | limitTo:100 }}{{ ::project.get('description').length < 100 ? '' : '...'}}
.project-card-statistics
span.statistic(
ng-class="{'active': project.get('is_fan')}"
title="{{ 'PROJECT.FANS_COUNTER_TITLE'|translate:{total:project.get('total_fans')||0}:'messageformat' }}"
)
- include ../../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{::project.get('total_fans')}}
span.statistic(
ng-class="{'active': project.get('is_watcher')}"
title="{{ 'PROJECT.WATCHERS_COUNTER_TITLE'|translate:{total:project.get('total_watchers')||0}:'messageformat' }}"
)
- include ../../../../svg/eye.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span {{::project.get('total_watchers')}}
span.statistic(
ng-class="{'active': project.get('i_am_member')}"
title="{{ 'PROJECT.MEMBERS_COUNTER_TITLE'|translate:{total:project.get('members').size||0}:'messageformat' }}"
)
- include ../../../../svg/team.svg
+ svg.icon.icon-team
+ use(xlink:href="#icon-team")
span.statistics-num {{ ::project.get('members').size }}
diff --git a/app/modules/discover/components/highlighted/highlighted.jade b/app/modules/discover/components/highlighted/highlighted.jade
index 96031ebf..f001c6a6 100644
--- a/app/modules/discover/components/highlighted/highlighted.jade
+++ b/app/modules/discover/components/highlighted/highlighted.jade
@@ -24,29 +24,30 @@
tg-nav="project:project=project.get('slug')"
title="{{::project.get('name')}}"
) {{::project.get('name')}}
- span.look-for-people(
- ng-if="project.get('is_looking_for_people')"
- title="{{ ::project.get('looking_for_people_note') }}"
- )
- include ../../../../svg/recruit.svg
+ svg.look-for-people.icon.icon-recruit(ng-if="project.get('is_looking_for_people')")
+ use(xlink:href="#icon-recruit")
+ title="{{ ::project.get('looking_for_people_note') }}"
.project-statistics
span.statistic(
ng-class="{'active': project.get('is_fan')}"
title="{{ 'PROJECT.FANS_COUNTER_TITLE'|translate:{total:project.get('total_fans')||0}:'messageformat' }}"
)
- include ../../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{::project.get('total_fans')}}
span.statistic(
ng-class="{'active': project.get('is_watcher')}"
title="{{ 'PROJECT.WATCHERS_COUNTER_TITLE'|translate:{total:project.get('total_watchers')||0}:'messageformat' }}"
)
- include ../../../../svg/eye.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span {{::project.get('total_watchers')}}
span.statistic(
ng-class="{'active': project.get('i_am_member')}"
title="{{ 'PROJECT.MEMBERS_COUNTER_TITLE'|translate:{total:project.get('members').size||0}:'messageformat' }}"
)
- include ../../../../svg/team.svg
+ svg.icon.icon-team
+ use(xlink:href="#icon-team")
span.statistics-num {{ ::project.get('members').size }}
p.project-description {{ ::project.get('description') | limitTo:150 }}{{ ::project.get('description').length < 150 ? '' : '...'}}
diff --git a/app/modules/discover/components/highlighted/highlighted.scss b/app/modules/discover/components/highlighted/highlighted.scss
index fb2091b9..8dced746 100644
--- a/app/modules/discover/components/highlighted/highlighted.scss
+++ b/app/modules/discover/components/highlighted/highlighted.scss
@@ -34,14 +34,19 @@
justify-content: space-between;
margin-bottom: 1rem;
svg {
- @include svg-size(1.5rem);
+ @include svg-size(.8rem);
fill: $gray-light;
- margin: .5rem;
+ margin-left: .5rem;
}
}
.title-wrapper {
align-items: center;
display: flex;
+ svg {
+ @include svg-size(1.25rem);
+ fill: $gray-light;
+ margin-right: .5rem;
+ }
}
.title {
@extend %bold;
@@ -97,6 +102,11 @@
position: relative;
top: .2rem;
}
+ &:hover {
+ svg {
+ fill: currentColor;
+ }
+ }
}
.filter-list {
background: $black;
@@ -163,11 +173,9 @@
}
}
.look-for-people {
- svg {
- @include svg-size();
- fill: $gray-light;
- margin-left: .5rem;
- }
+ @include svg-size();
+ fill: $gray-light;
+ margin-left: .5rem;
}
.project-description {
@extend %small;
@@ -179,8 +187,9 @@
flex-basis: 140px;
justify-content: flex-end;
svg {
- @include svg-size(.8rem);
+ @include svg-size(.75rem);
fill: $gray-light;
+ margin-right: .25rem;
}
.svg-eye-closed {
display: none;
diff --git a/app/modules/discover/components/most-active/most-active.jade b/app/modules/discover/components/most-active/most-active.jade
index 37e58cdf..e90666af 100644
--- a/app/modules/discover/components/most-active/most-active.jade
+++ b/app/modules/discover/components/most-active/most-active.jade
@@ -1,7 +1,8 @@
.most-active(ng-if="vm.highlighted.size")
.header
.title-wrapper
- include ../../../../svg/activity.svg
+ svg.icon.icon-activity
+ use(xlink:href="#icon-activity")
h1.title {{ 'DISCOVER.MOST_ACTIVE' | translate }}
tg-discover-home-order-by(on-change="vm.orderBy(orderBy)", order-by="vm.currentOrderBy")
@@ -14,5 +15,6 @@
.empty-highlighted-project(
ng-if="!vm.highlighted.size"
)
- include ../../../../svg/activity.svg
+ svg.icon.icon-activity
+ use(xlink:href="#icon-activity")
span {{ 'DISCOVER.MOST_ACTIVE_EMPTY' | translate }}
diff --git a/app/modules/discover/components/most-liked/most-liked.jade b/app/modules/discover/components/most-liked/most-liked.jade
index e3967aa0..031f35c3 100644
--- a/app/modules/discover/components/most-liked/most-liked.jade
+++ b/app/modules/discover/components/most-liked/most-liked.jade
@@ -1,7 +1,8 @@
.most-liked(ng-if="vm.highlighted.size")
.header
.title-wrapper
- include ../../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
h1.title {{ 'DISCOVER.MOST_LIKED' | translate }}
tg-discover-home-order-by(on-change="vm.orderBy(orderBy)", order-by="vm.currentOrderBy")
tg-highlighted(
@@ -13,5 +14,6 @@
.empty-highlighted-project(
ng-if="!vm.highlighted.size"
)
- include ../../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{ 'DISCOVER.MOST_LIKED_EMPTY' | translate }}
diff --git a/app/modules/discover/discover-search/discover-search.jade b/app/modules/discover/discover-search/discover-search.jade
index 937e45fa..1fecc64f 100644
--- a/app/modules/discover/discover-search/discover-search.jade
+++ b/app/modules/discover/discover-search/discover-search.jade
@@ -43,11 +43,9 @@ div(tg-discover-search)
tg-nav="project:project=project.get('slug')"
title="{{ ::project.get('name') }}"
) {{project.get('name')}}
- span.look-for-people(
- ng-if="project.get('is_looking_for_people')"
- title="{{ ::project.get('looking_for_people_note') }}"
- )
- include ../../../svg/recruit.svg
+ svg.look-for-people.icon.icon-recruit(ng-if="project.get('is_looking_for_people')")
+ use(xlink:href="#icon-recruit")
+ title="{{ ::project.get('looking_for_people_note') }}"
p {{ ::project.get('description') | limitTo:300 }}
span(ng-if="::project.get('description').length > 300") ...
.list-itemtype-project-right.project-statistics
@@ -55,19 +53,22 @@ div(tg-discover-search)
ng-class="{'active': project.get('is_fan')}"
title="{{ 'PROJECT.FANS_COUNTER_TITLE'|translate:{total:project.get('total_fans')||0}:'messageformat' }}"
)
- include ../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{::project.get('total_fans')}}
span.statistic(
ng-class="{'active': project.get('is_watcher')}"
title="{{ 'PROJECT.WATCHERS_COUNTER_TITLE'|translate:{total:project.get('total_watchers')||0}:'messageformat' }}"
)
- include ../../../svg/eye.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span {{::project.get('total_watchers')}}
span.statistic(
ng-class="{'active': project.get('i_am_member')}"
title="{{ 'PROJECT.MEMBERS_COUNTER_TITLE'|translate:{total:project.get('members').size||0}:'messageformat' }}"
)
- include ../../../svg/team.svg
+ svg.icon.icon-team
+ use(xlink:href="#icon-team")
span.statistics-num {{ ::project.get('members').size }}
a.button-green.more-results(
diff --git a/app/modules/discover/discover-search/discover-search.scss b/app/modules/discover/discover-search/discover-search.scss
index 9cc13527..b97b58e8 100644
--- a/app/modules/discover/discover-search/discover-search.scss
+++ b/app/modules/discover/discover-search/discover-search.scss
@@ -4,7 +4,6 @@
margin: 0 8rem;
position: relative;
}
-
.search-button {
left: 1rem;
right: auto;
@@ -73,19 +72,17 @@
vertical-align: middle;
}
.look-for-people {
+ fill: $gray-light;
margin-left: .5rem;
- svg {
- @include svg-size(1rem);
- fill: $gray-light;
- }
}
.project-statistics {
display: flex;
flex-basis: 300px;
justify-content: flex-end;
svg {
- @include svg-size(.8rem);
+ @include svg-size(.7rem);
fill: $gray-light;
+ margin-right: .2rem;
}
.svg-eye-closed {
display: none;
diff --git a/app/modules/home/projects/home-project-list.jade b/app/modules/home/projects/home-project-list.jade
index a66a41c2..3b367f1e 100644
--- a/app/modules/home/projects/home-project-list.jade
+++ b/app/modules/home/projects/home-project-list.jade
@@ -24,11 +24,9 @@ section.home-project-list(ng-if="vm.projects.size")
tg-nav="project:project=project.get('slug')"
title="{{::project.get('name')}}"
) {{::project.get('name')}}
- span.look-for-people(
- ng-if="project.get('is_looking_for_people')"
- title="{{ ::project.get('looking_for_people_note') }}"
- )
- include ../../../svg/recruit.svg
+ svg.look-for-people.icon.icon-recruit(ng-if="project.get('is_looking_for_people')")
+ use(xlink:href="#icon-recruit")
+ title="{{ ::project.get('looking_for_people_note') }}"
p.project-card-description {{::project.get('description')| limitTo:100 }}
span(ng-if="::project.get('description').length > 100") ...
.project-card-statistics
@@ -36,25 +34,29 @@ section.home-project-list(ng-if="vm.projects.size")
ng-class="{'active': project.get('is_fan')}"
title="{{ 'PROJECT.FANS_COUNTER_TITLE'|translate:{total:project.get('total_fans')||0}:'messageformat' }}"
)
- include ../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{::project.get('total_fans')}}
span.statistic(
ng-class="{'active': project.get('is_watcher')}"
title="{{ 'PROJECT.WATCHERS_COUNTER_TITLE'|translate:{total:project.get('total_watchers')||0}:'messageformat' }}"
)
- include ../../../svg/eye.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span {{::project.get('total_watchers')}}
span.statistic(
ng-class="{'active': project.get('i_am_member')}"
title="{{ 'PROJECT.MEMBERS_COUNTER_TITLE'|translate:{total:project.get('members').size||0}:'messageformat' }}"
)
- include ../../../svg/team.svg
+ svg.icon.icon-team
+ use(xlink:href="#icon-team")
span.statistics-num {{ ::project.get('members').size }}
span.statistic(
ng-if="::project.get('is_private')"
title="{{ 'PROJECT.PRIVATE' | translate }}"
)
- include ../../../svg/lock.svg
+ svg.icon.icon-lock
+ use(xlink:href="#icon-lock")
a.see-more-projects-btn.button-gray(
href="#",
@@ -65,7 +67,8 @@ section.home-project-list(ng-if="vm.projects.size")
)
section.projects-empty(ng-if="vm.projects != undefined && vm.projects.size === 0")
- include ../../../svg/empty-project.svg
+ svg.icon.icon-project
+ use(xlink:href="#icon-project")
p(translate="HOME.EMPTY_PROJECT_LIST")
a.create-project-button.button-green(href="#", ng-click="vm.newProject()",
title="{{'PROJECT.NAVIGATION.TITLE_CREATE_PROJECT' | translate}}",
diff --git a/app/modules/home/projects/home-project-list.scss b/app/modules/home/projects/home-project-list.scss
index c73826b0..503b1155 100644
--- a/app/modules/home/projects/home-project-list.scss
+++ b/app/modules/home/projects/home-project-list.scss
@@ -14,13 +14,11 @@
.projects-empty {
text-align: center;
svg {
+ fill: $whitish;
height: 100px;
margin: 1rem auto;
text-align: center;
width: 100%;
- path {
- fill: $whitish;
- }
}
p {
@extend %small;
diff --git a/app/modules/navigation-bar/dropdown-organization-list/dropdown-organization-list.jade b/app/modules/navigation-bar/dropdown-organization-list/dropdown-organization-list.jade
deleted file mode 100644
index e0b23904..00000000
--- a/app/modules/navigation-bar/dropdown-organization-list/dropdown-organization-list.jade
+++ /dev/null
@@ -1,10 +0,0 @@
-#TODO: fill correctly when implemented
-a(href="#", title="Organizations")
- include ../../../svg/organizations.svg
-
-div.navbar-dropdown.dropdown-organization-list
- ul
- - for (var x = 0; x < 4; x++)
- li
- a(href="#", title="{{ project.title }}") Organization 1
- a.create-organization-btn.button-green(href="#", title="Create Organization") Create Organization
diff --git a/app/modules/navigation-bar/dropdown-project-list/dropdown-project-list.jade b/app/modules/navigation-bar/dropdown-project-list/dropdown-project-list.jade
index 13b7097a..50bc0a4d 100644
--- a/app/modules/navigation-bar/dropdown-project-list/dropdown-project-list.jade
+++ b/app/modules/navigation-bar/dropdown-project-list/dropdown-project-list.jade
@@ -1,5 +1,6 @@
a(href="", title="Projects", tg-nav="projects")
- include ../../../svg/projects.svg
+ svg.icon.icon-project
+ use(xlink:href="#icon-project")
div.navbar-dropdown.dropdown-project-list
ul
@@ -19,7 +20,11 @@ div.navbar-dropdown.dropdown-project-list
title="{{'PROJECT.NAVIGATION.ACTION_CREATE_PROJECT' | translate}}",
translate="PROJECT.NAVIGATION.ACTION_CREATE_PROJECT")
- span(tg-import-project-button)
- a.button-blackish.import-project-button(href="", title="{{'PROJECT.NAVIGATION.TITLE_IMPORT_PROJECT' | translate}}")
- span.icon.icon-upload
+ a.button-blackish.import-project-button(
+ href=""
+ title="{{'PROJECT.NAVIGATION.TITLE_IMPORT_PROJECT' | translate}}"
+ tg-import-project-button
+ )
+ svg.icon.icon-upload
+ use(xlink:href="#icon-upload")
input.import-file.hidden(type="file")
diff --git a/app/modules/navigation-bar/navigation-bar.jade b/app/modules/navigation-bar/navigation-bar.jade
index 83f49a36..2c6a4a81 100644
--- a/app/modules/navigation-bar/navigation-bar.jade
+++ b/app/modules/navigation-bar/navigation-bar.jade
@@ -30,14 +30,16 @@ nav.navbar(ng-if="vm.isEnabledHeader")
ng-class="{active: vm.active}",
title="{{'PROJECT.NAVIGATION.DASHBOARD_TITLE' | translate}}")
- include ../../svg/dashboard.svg
+ svg.icon.icon-dashboard
+ use(xlink:href="#icon-dashboard")
a(
href="#",
tg-nav="discover",
title="{{'PROJECT.NAVIGATION.DISCOVER_TITLE' | translate}}",
)
- include ../../svg/discover.svg
+ svg.icon.icon-discover
+ use(xlink:href="#icon-discover")
div.topnav-dropdown-wrapper(ng-show="vm.projects.size", tg-dropdown-project-list)
//- div.topnav-dropdown-wrapper(tg-dropdown-organization-list)
diff --git a/app/modules/navigation-bar/navigation-bar.scss b/app/modules/navigation-bar/navigation-bar.scss
index 440784c0..8106882f 100644
--- a/app/modules/navigation-bar/navigation-bar.scss
+++ b/app/modules/navigation-bar/navigation-bar.scss
@@ -52,13 +52,14 @@ $dropdown-width: 350px;
color: $white;
display: inline-block;
transition: all .2s linear;
- svg path {
+ svg {
fill: darken($primary-dark, 8%);
+ transition: all .2s linear;
}
&:hover {
background: rgba($black, .2);
color: $primary-light;
- svg path {
+ svg {
fill: $white;
}
@@ -152,14 +153,22 @@ $dropdown-width: 350px;
&.see-more-projects-btn {
margin-bottom: .3rem;
}
+ &.import-project-button {
+ padding: .8rem 1rem;
+ }
&.create-project-btn {
flex: 1;
}
- &.import-project-button {
- padding-left: .75rem;
- padding-right: .75rem;
+ }
+ .import-project-button {
+ &:hover {
+ svg {
+ fill: $primary-light;
+ }
+ }
+ svg {
+ fill: $white;
}
-
}
.create-options {
display: flex;
diff --git a/app/modules/profile/profile-bar/profile-bar.jade b/app/modules/profile/profile-bar/profile-bar.jade
index 3c16c794..8a53a4ad 100644
--- a/app/modules/profile/profile-bar/profile-bar.jade
+++ b/app/modules/profile/profile-bar/profile-bar.jade
@@ -2,19 +2,10 @@ section.profile-bar
div.profile-image-wrapper(ng-class="::{'is-current-user': vm.isCurrentUser}")
img.profile-img(ng-src="{{::vm.user.get('big_photo')}}", alt="{{::vm.user.get('full_name')}}")
a.profile-edition(title="{{ 'USER.PROFILE.EDIT' | translate }}", tg-nav="user-settings-user-profile", translate="USER.PROFILE.EDIT")
- // a.button-green
- // span(translate="USER.PROFILE.FOLLOW")
div.profile-data
h1(ng-class="{'not-full-name': !vm.user.get('full_name')}") {{::vm.user.get("full_name_display")}}
.username @{{::vm.user.get("username")}}
h2 {{::vm.stats.get('roles').join(", ")}}
- // div.location
- // include ../../../svg/location.svg
- // span Madrid
- // Remove Abuse Flag when a user is seeing itself
- // a.flag(href="", title="{{ 'USER.PROFILE.REPORT' | translate }}")
- // include ../../../svg/flag.svg
- // These values in profile stats are not defined yet in UX. Please ask
div.profile-stats
div.stat
span.stat-number {{::vm.stats.get('total_num_projects')}}
@@ -25,14 +16,6 @@ section.profile-bar
div.stat
span.stat-number {{::vm.stats.get('total_num_contacts')}}
span.stat-name(translate="USER.PROFILE.CONTACTS")
- // TODO Hide until organizations come
- // div.profile-organizations
- // h3 Organizations
- // div.profile-organizations-wrapper
- // div.organization
- // div.organization
- // div.organization
- // div.organization
div.profile-quote(ng-if="::vm.user.get('bio')")
span {{::vm.user.get("bio") | limitTo:210 }}{{vm.user.get("bio").length < 210 ? '' : '...'}}
diff --git a/app/modules/profile/profile-contacts/profile-contacts.jade b/app/modules/profile/profile-contacts/profile-contacts.jade
index 08ffe638..b752325e 100644
--- a/app/modules/profile/profile-contacts/profile-contacts.jade
+++ b/app/modules/profile/profile-contacts/profile-contacts.jade
@@ -4,7 +4,8 @@ section.profile-contacts
img(src="/#{v}/svg/spinner-circle.svg", alt="Loading...")
div.empty-tab(ng-if="vm.contacts && !vm.contacts.size")
- include ../../../svg/hide.svg
+ svg.icon.icon-unwatch
+ use(xlink:href="#icon-unwatch")
div(ng-if="!vm.isCurrentUser")
p(translate="USER.PROFILE.CONTACTS_EMPTY", translate-values="{username: vm.user.get('full_name_display')}")
diff --git a/app/modules/profile/profile-favs/items/project.jade b/app/modules/profile/profile-favs/items/project.jade
index 827eff4f..4b1b7e56 100644
--- a/app/modules/profile/profile-favs/items/project.jade
+++ b/app/modules/profile/profile-favs/items/project.jade
@@ -34,14 +34,14 @@
ng-class="{'active': vm.item.get('is_fan')}"
title="{{ 'PROJECT.LIKE_BUTTON.COUNTER_TITLE'|translate:{total:vm.item.get(\"total_fans\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{ ::vm.item.get('total_fans') }}
span.list-itemtype-track-watchers(
ng-class="{'active': vm.item.get('is_watcher')}"
title="{{ 'PROJECT.WATCH_BUTTON.COUNTER_TITLE'|translate:{total:vm.item.get(\"total_watchers\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../../svg/watch.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span {{ ::vm.item.get('total_watchers') }}
diff --git a/app/modules/profile/profile-favs/items/ticket.jade b/app/modules/profile/profile-favs/items/ticket.jade
index a55ec8d0..d938466a 100644
--- a/app/modules/profile/profile-favs/items/ticket.jade
+++ b/app/modules/profile/profile-favs/items/ticket.jade
@@ -67,14 +67,14 @@ div.list-itemtype-ticket
ng-class="{'active': vm.item.get('is_voter')}",
title="{{ 'COMMON.VOTE_BUTTON.COUNTER_TITLE'|translate:{total:vm.item.get(\"total_voters\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../../svg/upvote.svg
+ svg.icon.icon-upvote
+ use(xlink:href="#icon-upvote")
span {{ ::vm.item.get('total_voters') }}
span.list-itemtype-track-watchers(
ng-class="{'active': vm.item.get('is_watcher')}"
title="{{ 'COMMON.WATCH_BUTTON.COUNTER_TITLE'|translate:{total:vm.item.get(\"total_watchers\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../../svg/watch.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span {{ ::vm.item.get('total_watchers') }}
diff --git a/app/modules/profile/profile-favs/profile-favs.jade b/app/modules/profile/profile-favs/profile-favs.jade
index 3b1ece60..24120ccb 100644
--- a/app/modules/profile/profile-favs/profile-favs.jade
+++ b/app/modules/profile/profile-favs/profile-favs.jade
@@ -1,7 +1,8 @@
section.profile-favs
div.profile-filter
div.searchbox(ng-if="::vm.enableFilterByTextQuery")
- span.icon-search
+ svg.icon.icon-search
+ use(xlink:href="#icon-search")
input(
type="text"
ng-model="vm.q"
diff --git a/app/modules/profile/profile-favs/profile-favs.scss b/app/modules/profile/profile-favs/profile-favs.scss
index e37d4542..dce9d08c 100644
--- a/app/modules/profile/profile-favs/profile-favs.scss
+++ b/app/modules/profile/profile-favs/profile-favs.scss
@@ -14,7 +14,7 @@
display: flex;
flex: 1;
.icon-search {
- color: grayer;
+ fill: $gray;
margin-right: .5rem;
}
input {
diff --git a/app/modules/profile/profile-hints/profile-hints.jade b/app/modules/profile/profile-hints/profile-hints.jade
index fceb5fd9..364a9066 100644
--- a/app/modules/profile/profile-hints/profile-hints.jade
+++ b/app/modules/profile/profile-hints/profile-hints.jade
@@ -1,5 +1,6 @@
h4
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="HINTS.SECTION_NAME")
p {{::vm.hint.title}}
diff --git a/app/modules/profile/profile-projects/profile-projects.jade b/app/modules/profile/profile-projects/profile-projects.jade
index 28c2ef45..3f76179d 100644
--- a/app/modules/profile/profile-projects/profile-projects.jade
+++ b/app/modules/profile/profile-projects/profile-projects.jade
@@ -4,7 +4,8 @@ section.profile-projects
img(src="/#{v}/svg/spinner-circle.svg", alt="Loading...")
.empty-tab(ng-if="vm.projects && !vm.projects.size")
- include ../../../svg/hide.svg
+ svg.icon.icon-unwatch
+ use(xlink:href="#icon-unwatch")
p(
translate="USER.PROFILE.PROJECTS_EMPTY"
@@ -46,16 +47,16 @@ section.profile-projects
ng-class="{'active': project.get('is_fan')}"
title="{{ 'PROJECT.LIKE_BUTTON.COUNTER_TITLE'|translate:{total:project.get(\"total_fans\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{ ::project.get('total_fans') }}
span.list-itemtype-track-watchers(
ng-class="{'active': project.get('is_watcher')}"
title="{{ 'PROJECT.WATCH_BUTTON.COUNTER_TITLE'|translate:{total:project.get(\"total_watchers\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../svg/watch.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span {{ ::project.get('total_watchers') }}
.list-itemtype-project-members
diff --git a/app/modules/profile/profile-tab/profile-tab.directive.coffee b/app/modules/profile/profile-tab/profile-tab.directive.coffee
index 308a97ba..252e7282 100644
--- a/app/modules/profile/profile-tab/profile-tab.directive.coffee
+++ b/app/modules/profile/profile-tab/profile-tab.directive.coffee
@@ -28,6 +28,7 @@ ProfileTabDirective = () ->
scope.tab.title = title
scope.tab.icon = attrs.tabIcon
+ scope.tab.iconName = '#' + attrs.tabIcon
scope.tab.active = !!attrs.tabActive
if scope.$eval(attrs.tabDisabled) != true
diff --git a/app/modules/profile/profile-tabs/profile-tabs.jade b/app/modules/profile/profile-tabs/profile-tabs.jade
index ba10af3a..c7965c2f 100644
--- a/app/modules/profile/profile-tabs/profile-tabs.jade
+++ b/app/modules/profile/profile-tabs/profile-tabs.jade
@@ -7,7 +7,8 @@ div
ng-click="vm.toggleTab(tab)"
ng-class="{active: tab.active}"
)
- span.icon(ng-class="::tab.icon")
+ svg.icon(ng-class="::tab.icon")
+ use(xlink:href="{{::tab.iconName}}")
span {{::tab.name}}
ng-transclude
diff --git a/app/modules/profile/profile.jade b/app/modules/profile/profile.jade
index dc5ce3f7..3b6caf8e 100644
--- a/app/modules/profile/profile.jade
+++ b/app/modules/profile/profile.jade
@@ -21,21 +21,21 @@ div.profile.centered(ng-if="vm.user")
div(
tg-profile-tab="{{'USER.PROFILE.TABS.LIKES_TAB' | translate}}"
tab-title="{{'USER.PROFILE.TABS.LIKES_TAB_TITLE' | translate}}"
- tab-icon="icon-heart"
+ tab-icon="icon-like"
)
div(tg-profile-liked, user="vm.user")
div(
tg-profile-tab="{{'USER.PROFILE.TABS.VOTES_TAB' | translate}}"
tab-title="{{'USER.PROFILE.TABS.VOTES_TAB_TITLE' | translate}}"
- tab-icon="icon-caret-up"
+ tab-icon="icon-upvote"
)
div(tg-profile-voted, user="vm.user")
div(
tg-profile-tab="{{'USER.PROFILE.TABS.WATCHED_TAB' | translate}}"
tab-title="{{'USER.PROFILE.TABS.WATCHED_TAB_TITLE' | translate}}"
- tab-icon="icon-eye"
+ tab-icon="icon-watch"
)
div(tg-profile-watched, user="vm.user")
diff --git a/app/modules/profile/profile.scss b/app/modules/profile/profile.scss
index 0dcec0dc..d11826f6 100644
--- a/app/modules/profile/profile.scss
+++ b/app/modules/profile/profile.scss
@@ -50,12 +50,16 @@
padding: 5vh;
text-align: center;
svg {
+ fill: $whitish;
+ height: 10rem;
margin: 2rem auto;
- max-width: 160px;
text-align: center;
+ width: 10rem;
}
p {
+ color: $gray-light;
font-size: .9rem;
+ margin: 0;
}
}
}
diff --git a/app/modules/profile/styles/profile-content-tabs.scss b/app/modules/profile/styles/profile-content-tabs.scss
index 6b5340be..b63ec85e 100644
--- a/app/modules/profile/styles/profile-content-tabs.scss
+++ b/app/modules/profile/styles/profile-content-tabs.scss
@@ -7,8 +7,11 @@
padding: 1rem;
&:hover,
&.active {
- color: $grayer;
+ color: $gray;
transition: color .2s linear;
+ .icon {
+ fill: $primary-light;
+ }
}
&.active {
background: $white;
@@ -19,11 +22,13 @@
transition: color .2s linear;
.icon {
color: $primary;
- transition: color .2s linear;
}
}
}
.icon {
- margin-right: .4rem;
+ fill: $gray-light;
+ height: .8rem;
+ margin-right: .5rem;
+ transition: fill .2s linear;
}
}
diff --git a/app/modules/profile/styles/profile-sidebar.scss b/app/modules/profile/styles/profile-sidebar.scss
index 944c813c..964b3322 100644
--- a/app/modules/profile/styles/profile-sidebar.scss
+++ b/app/modules/profile/styles/profile-sidebar.scss
@@ -6,9 +6,10 @@
margin-bottom: .5rem;
padding: .5rem;
.icon {
- color: $gray-light;
+ fill: $gray-light;
margin-right: .3rem;
- vertical-align: text-bottom;
+ margin-top: -3px;
+ vertical-align: middle;
}
}
p {
diff --git a/app/modules/projects/components/like-project-button/like-project-button.jade b/app/modules/projects/components/like-project-button/like-project-button.jade
index 7faad550..176c25fd 100644
--- a/app/modules/projects/components/like-project-button/like-project-button.jade
+++ b/app/modules/projects/components/like-project-button/like-project-button.jade
@@ -8,7 +8,8 @@ a.track-button.like-button.like-container(
)
span.track-inner
span.track-icon
- include ../../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span(
ng-if="!vm.project.get('is_fan')"
translate="PROJECT.LIKE_BUTTON.LIKE"
diff --git a/app/modules/projects/components/watch-project-button/watch-project-button.jade b/app/modules/projects/components/watch-project-button/watch-project-button.jade
index 508922fd..1c2671a5 100644
--- a/app/modules/projects/components/watch-project-button/watch-project-button.jade
+++ b/app/modules/projects/components/watch-project-button/watch-project-button.jade
@@ -6,10 +6,12 @@ a.track-button.watch-button.watch-container(
)
span.track-inner
span.track-icon
- include ../../../../svg/watch.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
span(ng-if="!vm.project.get('is_watcher')", translate="PROJECT.WATCH_BUTTON.WATCH")
span(ng-if="vm.project.get('is_watcher')", translate="PROJECT.WATCH_BUTTON.WATCHING")
- span.icon.icon-arrow-up
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
span.track-button-counter(
title="{{ 'PROJECT.WATCH_BUTTON.COUNTER_TITLE'|translate:{total:vm.project.get(\"total_watchers\")||0}:'messageformat' }}",
@@ -35,7 +37,8 @@ ul.watch-options(
)
span(translate="PROJECT.WATCH_BUTTON.OPTIONS.NOTIFY_ALL")
span.watch-check(ng-if="vm.project.get('is_watcher') && vm.project.get('notify_level') == 2")
- include ../../../../svg/check.svg
+ svg.icon.icon-check-empty
+ use(xlink:href="#icon-check-empty")
li
a(
href="",
@@ -45,7 +48,8 @@ ul.watch-options(
)
span(translate="PROJECT.WATCH_BUTTON.OPTIONS.NOTIFY_INVOLVED")
span.watch-check(ng-if="vm.project.get('is_watcher') && vm.project.get('notify_level') == 1")
- include ../../../../svg/check.svg
+ svg.icon.icon-check-empty
+ use(xlink:href="#icon-check-empty")
li(ng-if="vm.project.get('is_watcher')")
a(
diff --git a/app/modules/projects/listing/projects-listing.jade b/app/modules/projects/listing/projects-listing.jade
index 3e1e0de9..59676e12 100644
--- a/app/modules/projects/listing/projects-listing.jade
+++ b/app/modules/projects/listing/projects-listing.jade
@@ -13,7 +13,8 @@
href=""
title="{{'PROJECT.NAVIGATION.TITLE_IMPORT_PROJECT' | translate}}"
)
- span.icon.icon-upload
+ svg.icon.icon-upload
+ use(xlink:href="#icon-upload")
input.import-file.hidden(type="file")
section.project-list-section
@@ -46,7 +47,8 @@
ng-if="project.get('is_private')"
title="{{'PROJECT.PRIVATE' | translate}}"
)
- include ../../../svg/lock.svg
+ svg.icon.icon-lock
+ use(xlink:href="#icon-lock")
p {{ ::project.get('description') | limitTo:300 }}
span(ng-if="::project.get('description').length > 300") ...
@@ -57,7 +59,8 @@
)
span.tag-name {{::tag.get('name')}}
- span.drag.icon.icon-drag-v
+ svg.drag.icon.icon-drag
+ use(xlink:href="#icon-drag")
aside.help-area
p(translate="PROJECT.HELP")
diff --git a/app/modules/projects/listing/styles/project-list.scss b/app/modules/projects/listing/styles/project-list.scss
index b9f68b93..522358f2 100644
--- a/app/modules/projects/listing/styles/project-list.scss
+++ b/app/modules/projects/listing/styles/project-list.scss
@@ -13,20 +13,21 @@
margin: 0;
}
}
- .create-options a {
- &.create-project-btn {
- margin-right: .25rem;
- padding: .6rem 2.5rem;
- }
- &.import-project-button {
- padding: .53rem .8rem;
- &:hover {
- background: $grayer;
- }
+ .create-project-btn {
+ margin-right: .25rem;
+ padding: .6rem 2.5rem;
+ }
+ .import-project-button {
+ padding: .53rem .8rem;
+ &:hover {
.icon-upload {
- margin: 0;
+ fill: $primary-light;
}
}
+ .icon-upload {
+ fill: $white;
+ }
+
}
.project-list-section {
display: flex;
@@ -63,10 +64,12 @@
}
}
.drag {
- @extend %large;
align-self: center;
- color: $gray-light;
+ fill: $gray-light;
+ height: 1.1rem;
+ margin-right: .5rem;
opacity: 0;
transition: opacity .2s;
+ width: 1.1rem;
}
}
diff --git a/app/modules/projects/project/project.jade b/app/modules/projects/project/project.jade
index b646fbff..285e0dbf 100644
--- a/app/modules/projects/project/project.jade
+++ b/app/modules/projects/project/project.jade
@@ -20,7 +20,8 @@ div.wrapper
ng-if="::vm.project.get('is_private')"
title="{{'PROJECT.PRIVATE' | translate}}"
)
- include ../../../svg/lock.svg
+ svg.icon.icon-lock
+ use(xlink:href="#icon-lock")
div.track-buttons-container(ng-if="vm.user")
tg-like-project-button(project="vm.project")
@@ -31,15 +32,15 @@ div.wrapper
span.list-itemtype-track-likers(
title="{{ 'PROJECT.LIKE_BUTTON.COUNTER_TITLE'|translate:{total:vm.project.get(\"total_fans\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../svg/like.svg
+ svg.icon.icon-like
+ use(xlink:href="#icon-like")
span {{ ::vm.project.get('total_fans') }}
span.list-itemtype-track-watchers(
title="{{ 'PROJECT.WATCH_BUTTON.COUNTER_TITLE'|translate:{total:vm.project.get(\"total_watchers\")||0}:'messageformat' }}"
)
- span.icon
- include ../../../svg/watch.svg
+ svg.icon.icon-watche
+ use(xlink:href="#icon-watch")
span {{ ::vm.project.get('total_watchers') }}
p.description {{vm.project.get('description')}}
diff --git a/app/modules/user-timeline/user-timeline-attachment/user-timeline-attachment.jade b/app/modules/user-timeline/user-timeline-attachment/user-timeline-attachment.jade
index a2f83b04..8c086e97 100644
--- a/app/modules/user-timeline/user-timeline-attachment/user-timeline-attachment.jade
+++ b/app/modules/user-timeline/user-timeline-attachment/user-timeline-attachment.jade
@@ -1,5 +1,6 @@
div.single-attachment
blockquote
a(ng-href="{{ attachment.get('url') }}", title="Click to download {{ attachment.get('filename') }}", target="_blank")
- span.icon.icon-document
+ svg.icon.icon-attachment
+ use(xlink:href="#icon-attachment")
span {{attachment.get('filename')}}
diff --git a/app/modules/user-timeline/user-timeline/user-timeline.scss b/app/modules/user-timeline/user-timeline/user-timeline.scss
index fc41472a..181109b4 100644
--- a/app/modules/user-timeline/user-timeline/user-timeline.scss
+++ b/app/modules/user-timeline/user-timeline/user-timeline.scss
@@ -86,11 +86,12 @@
max-width: 95%;
overflow: hidden;
text-overflow: ellipsis;
- vertical-align: middle;
+ vertical-align: sub;
white-space: nowrap;
}
.icon {
- margin-right: .3rem;
+ fill: $grayer;
+ margin-right: .5rem;
}
}
.spin {
diff --git a/app/partials/admin/admin-project-export.jade b/app/partials/admin/admin-project-export.jade
index 04fd1af4..024e49da 100644
--- a/app/partials/admin/admin-project-export.jade
+++ b/app/partials/admin/admin-project-export.jade
@@ -26,5 +26,6 @@ div.wrapper(ng-controller="ProjectProfileController as ctrl",
p.result-message
a.help-button(href="https://taiga.io/support/import-export-projects/", target="_blank")
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="ADMIN.HELP")
diff --git a/app/partials/admin/admin-project-modules.jade b/app/partials/admin/admin-project-modules.jade
index ab4ade35..fac254da 100644
--- a/app/partials/admin/admin-project-modules.jade
+++ b/app/partials/admin/admin-project-modules.jade
@@ -15,7 +15,8 @@ div.wrapper(tg-project-modules, ng-controller="ProjectProfileController as ctrl"
form
div.functionality(ng-class="{true:'active', false:''}[project.is_backlog_activated]")
- div.icon.icon-scrum
+ svg.icon.icon-scrum
+ use(xlink:href="#icon-scrum")
div.desc
p
span.title(translate="ADMIN.MODULES.BACKLOG")
@@ -29,7 +30,8 @@ div.wrapper(tg-project-modules, ng-controller="ProjectProfileController as ctrl"
span(ng-switch-when="false", translate="ADMIN.MODULES.ENABLE")
div.functionality(ng-class="{true:'active', false:''}[project.is_kanban_activated]")
- div.icon.icon-kanban
+ svg.icon.icon-kanban
+ use(xlink:href="#icon-kanban")
div.desc
p
span.title(translate="ADMIN.MODULES.KANBAN")
@@ -43,7 +45,8 @@ div.wrapper(tg-project-modules, ng-controller="ProjectProfileController as ctrl"
span(ng-switch-when="false", translate="ADMIN.MODULES.ENABLE")
div.functionality(ng-class="{true:'active', false:''}[project.is_issues_activated]")
- div.icon.icon-issues
+ svg.icon.icon-issues
+ use(xlink:href="#icon-issues")
div.desc
p
span.title(translate="ADMIN.MODULES.ISSUES")
@@ -57,7 +60,8 @@ div.wrapper(tg-project-modules, ng-controller="ProjectProfileController as ctrl"
span(ng-switch-when="false", translate="ADMIN.MODULES.ENABLE")
div.functionality(ng-class="{true:'active', false:''}[project.is_wiki_activated]")
- div.icon.icon-wiki
+ svg.icon.icon-wiki
+ use(xlink:href="#icon-wiki")
div.desc
p
span.title(translate="ADMIN.MODULES.WIKI")
@@ -71,7 +75,8 @@ div.wrapper(tg-project-modules, ng-controller="ProjectProfileController as ctrl"
span(ng-switch-when="false", translate="ADMIN.MODULES.ENABLE")
div.functionality(ng-class="{true:'active', false:''}[isVideoconferenceActivated]")
- div.icon.icon-video
+ svg.icon.icon-bubble-empty
+ use(xlink:href="#icon-bubble-empty")
div.desc
p
span.title(translate="ADMIN.MODULES.MEETUP")
diff --git a/app/partials/admin/admin-project-profile.jade b/app/partials/admin/admin-project-profile.jade
index c786f932..1aedd6cb 100644
--- a/app/partials/admin/admin-project-profile.jade
+++ b/app/partials/admin/admin-project-profile.jade
@@ -105,10 +105,9 @@ div.wrapper(
fieldset.looking-for-people
.looking-for-people-selector
span {{ 'ADMIN.PROJECT_PROFILE.RECRUITING' | translate }}
- span(
- title="{{ 'ADMIN.PROJECT_PROFILE.RECRUITING_MESSAGE' | translate }}"
- )
- include ../../svg/recruit.svg
+ svg.icon.icon-recruit
+ use(xlink:href="#icon-recruit")
+ title {{ 'ADMIN.PROJECT_PROFILE.RECRUITING_MESSAGE' | translate }}"
div.check
input(
type="checkbox",
@@ -138,8 +137,6 @@ div.wrapper(
ng-value="false"
)
label.trans-button(for="private-project") {{ 'ADMIN.PROJECT_PROFILE.PUBLIC_PROJECT' | translate }}
- span(title="{{ 'ADMIN.PROJECT_PROFILE.PUBLIC_PROJECT_DESC' | translate }}")
- include ../../svg/help.svg
div.privacy-option
input.privacy-project(
@@ -150,15 +147,14 @@ div.wrapper(
ng-value="true"
)
label.trans-button(for="public-project") {{'ADMIN.PROJECT_PROFILE.PRIVATE_PROJECT' | translate }}
- span(title="{{ 'ADMIN.PROJECT_PROFILE.PRIVATE_PROJECT_DESC' | translate }}")
- include ../../svg/help.svg
a.private-or-public(
href="https://taiga.io/support/whats-the-difference-between-public-and-private-projects/"
target="_blank"
)
- span(title="{{ 'ADMIN.PROJECT_PROFILE.PRIVATE_OR_PUBLIC' | translate }}")
- include ../../svg/help.svg
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
+ title {{ 'ADMIN.PROJECT_PROFILE.PRIVATE_OR_PUBLIC' | translate }}
span {{'ADMIN.PROJECT_PROFILE.PRIVATE_OR_PUBLIC' | translate }}
button.button-green.submit-button(
type="submit"
diff --git a/app/partials/admin/admin-project-reports.jade b/app/partials/admin/admin-project-reports.jade
index ffbb8ca5..bde79213 100644
--- a/app/partials/admin/admin-project-reports.jade
+++ b/app/partials/admin/admin-project-reports.jade
@@ -22,5 +22,6 @@ div.wrapper(ng-controller="ProjectProfileController as ctrl",
div
a.help-button(href="https://taiga.io/support/csv-reports/", target="_blank")
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="ADMIN.REPORTS.HELP")
diff --git a/app/partials/admin/admin-roles.jade b/app/partials/admin/admin-roles.jade
index 2af066c0..1afdcc9b 100644
--- a/app/partials/admin/admin-roles.jade
+++ b/app/partials/admin/admin-roles.jade
@@ -18,25 +18,27 @@ div.wrapper.roles(ng-controller="RolesController as ctrl",
span(translate="COMMON.DELETE")
- div(ng-if="!role.external_user")
- div(tg-edit-role)
- .edit-role
- input(type="text", value="{{ role.name }}")
- a.save.icon-floppy(href="", title="{{'COMMON.SAVE' | translate}}")
+ tg-edit-role(ng-if="!role.external_user")
+ .edit-role
+ input(type="text", value="{{ role.name }}")
+ a.save(href="", title="{{'COMMON.SAVE' | translate}}")
+ svg.icon.icon-save
+ use(xlink:href="#icon-save")
+ p.total
+ span.role-name(title="{{'ADMIN.ROLES.COUNT_MEMBERS' | translate}}") {{ role.name }}
+ a.edit-value
+ svg.icon.icon-edit
+ use(xlink:href="#icon-edit")
- p.total
- span.role-name(title="{{'ADMIN.ROLES.COUNT_MEMBERS' | translate}}") {{ role.name }}
- a.edit-value.icon.icon-edit
+ div.any-computable-role(ng-hide="anyComputableRole", translate="ADMIN.ROLES.WARNING_NO_ROLE")
- div.any-computable-role(ng-hide="anyComputableRole", translate="ADMIN.ROLES.WARNING_NO_ROLE")
-
- div.general-category
- span(translate="ADMIN.ROLES.HELP_ROLE_ENABLED")
- div.check
- input(type="checkbox", ng-model="role.computable", ng-change="ctrl.toggleComputable()")
- div
- span.check-text.check-yes(translate="COMMON.YES")
- span.check-text.check-no(translate="COMMON.NO")
+ div.general-category
+ span(translate="ADMIN.ROLES.HELP_ROLE_ENABLED")
+ div.check
+ input(type="checkbox", ng-model="role.computable", ng-change="ctrl.toggleComputable()")
+ div
+ span.check-text.check-yes(translate="COMMON.YES")
+ span.check-text.check-no(translate="COMMON.NO")
div(ng-if="role.external_user")
p.total
diff --git a/app/partials/admin/admin-third-parties-bitbucket.jade b/app/partials/admin/admin-third-parties-bitbucket.jade
index 6aa26207..b56beb19 100644
--- a/app/partials/admin/admin-third-parties-bitbucket.jade
+++ b/app/partials/admin/admin-third-parties-bitbucket.jade
@@ -24,7 +24,8 @@ div.wrapper.roles(tg-bitbucket-webhooks, ng-controller="BitbucketController as c
.field-with-option
input(type="text", ng-model="bitbucket.webhooks_url", name="payload-url", readonly="readonly", placeholder="{{'ADMIN.THIRD_PARTIES.PAYLOAD_URL' | translate}}", id="payload-url")
.option-wrapper.select-input-content
- .icon.icon-copy
+ svg.icon.icon-clipboard
+ use(xlink:href="#icon-clipboard")
.help-copy(translate="COMMON.COPY_TO_CLIPBOARD")
fieldset
@@ -34,5 +35,6 @@ div.wrapper.roles(tg-bitbucket-webhooks, ng-controller="BitbucketController as c
button.button-green.submit-button(type="submit", title="{{'COMMON.SAVE' | translate}}", translate="COMMON.SAVE")
a.help-button(href="https://taiga.io/support/bitbucket-integration/", target="_blank")
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="ADMIN.HELP")
diff --git a/app/partials/admin/admin-third-parties-github.jade b/app/partials/admin/admin-third-parties-github.jade
index 9154d42b..3500c73a 100644
--- a/app/partials/admin/admin-third-parties-github.jade
+++ b/app/partials/admin/admin-third-parties-github.jade
@@ -23,11 +23,13 @@ div.wrapper.roles(tg-github-webhooks, ng-controller="GithubController as ctrl",
.field-with-option
input(type="text", ng-model="github.webhooks_url", name="payload-url", readonly="readonly", placeholder="{{'ADMIN.THIRD_PARTIES.PAYLOAD_URL' | translate}}", id="payload-url")
.option-wrapper.select-input-content
- .icon.icon-copy
+ svg.icon.icon-clipboard
+ use(xlink:href="#icon-clipboard")
.help-copy(translate="COMMON.COPY_TO_CLIPBOARD")
button.button-green.submit-button(type="submit", title="{{'COMMON.SAVE' | translate}}", translate="COMMON.SAVE")
a.help-button(href="https://taiga.io/support/github-integration/", target="_blank")
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="ADMIN.HELP")
diff --git a/app/partials/admin/admin-third-parties-gitlab.jade b/app/partials/admin/admin-third-parties-gitlab.jade
index 6bc1fcbe..8867eee3 100644
--- a/app/partials/admin/admin-third-parties-gitlab.jade
+++ b/app/partials/admin/admin-third-parties-gitlab.jade
@@ -23,7 +23,8 @@ div.wrapper.roles(tg-gitlab-webhooks, ng-controller="GitlabController as ctrl",
.field-with-option
input(type="text", ng-model="gitlab.webhooks_url", name="payload-url", readonly="readonly", placeholder="{{'ADMIN.THIRD_PARTIES.PAYLOAD_URL' | translate}}", id="payload-url")
.option-wrapper.select-input-content
- .icon.icon-copy
+ svg.icon.icon-clipboard
+ use(xlink:href="#icon-clipboard")
.help-copy(translate="COMMON.COPY_TO_CLIPBOARD")
fieldset
@@ -33,5 +34,6 @@ div.wrapper.roles(tg-gitlab-webhooks, ng-controller="GitlabController as ctrl",
button.button-green.submit-button(type="submit", title="{{'COMMON.SAVE' | translate}}", translate="COMMON.SAVE")
a.help-button(href="https://taiga.io/support/gitlab-integration/", target="_blank")
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="ADMIN.HELP")
diff --git a/app/partials/admin/admin-third-parties-webhooks.jade b/app/partials/admin/admin-third-parties-webhooks.jade
index b890b2a0..0b9349e6 100644
--- a/app/partials/admin/admin-third-parties-webhooks.jade
+++ b/app/partials/admin/admin-third-parties-webhooks.jade
@@ -31,12 +31,29 @@ div.wrapper.roles(ng-controller="WebhooksController as ctrl",
div.webhook-url
div.webhook-url-inputs
fieldset
- input(type="text", name="url", data-type="url", placeholder="{{'ADMIN.WEBHOOKS.TYPE_PAYLOAD_URL' | translate}}", data-required="true", ng-model="webhook.url")
+ input(
+ type="text"
+ name="url"
+ data-type="url"
+ placeholder="{{'ADMIN.WEBHOOKS.TYPE_PAYLOAD_URL' | translate}}"
+ data-required="true"
+ ng-model="webhook.url"
+ )
fieldset
- input(type="text", name="key", placeholder="{{'ADMIN.WEBHOOKS.TYPE_SERVICE_SECRET' | translate}}", data-required="true", ng-model="webhook.key")
+ input(
+ type="text"
+ name="key"
+ placeholder="{{'ADMIN.WEBHOOKS.TYPE_SERVICE_SECRET' | translate}}"
+ data-required="true"
+ ng-model="webhook.key"
+ )
div.webhook-options
- a.edit-existing.icon.icon-floppy(href="", title="{{'ADMIN.WEBHOOKS.SAVE' | translate}}")
- a.cancel-existing.icon.icon-delete(href="", title="{{'ADMIN.WEBHOOKS.CANCEL' | translate}}")
+ a.edit-existing(href="", title="{{'ADMIN.WEBHOOKS.SAVE' | translate}}")
+ svg.icon.icon-save
+ use(xlink:href="#icon-save")
+ a.cancel-existing(href="", title="{{'ADMIN.WEBHOOKS.CANCEL' | translate}}")
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
div.visualization-mode
div.row
@@ -48,9 +65,15 @@ div.wrapper.roles(ng-controller="WebhooksController as ctrl",
div.webhook-options
div.webhook-options-wrapper
- a.test-webhook.icon.icon-check-square(href="", title="{{'ADMIN.WEBHOOKS.TEST' | translate}}")
- a.edit-webhook.icon.icon-edit(href="", title="{{'ADMIN.WEBHOOKS.EDIT' | translate}}")
- a.delete-webhook.icon.icon-delete(href="", title="{{'ADMIN.WEBHOOKS.DELETE' | translate}}")
+ a.test-webhook(href="", title="{{'ADMIN.WEBHOOKS.TEST' | translate}}")
+ svg.icon.icon-check-empty
+ use(xlink:href="#icon-check-empty")
+ a.edit-webhook(href="", title="{{'ADMIN.WEBHOOKS.EDIT' | translate}}")
+ svg.icon.icon-edit
+ use(xlink:href="#icon-edit")
+ a.delete-webhook(href="", title="{{'ADMIN.WEBHOOKS.DELETE' | translate}}")
+ svg.icon.icon-trash
+ use(xlink:href="#icon-trash")
div.webhooks-history(ng-show="webhook.logs")
div.history-single-wrapper(ng-repeat="log in webhook.logs")
@@ -58,13 +81,15 @@ div.wrapper.roles(ng-controller="WebhooksController as ctrl",
div
span.history-response-icon(ng-class="log.validStatus ? 'history-success' : 'history-error'", title="{{log.status}}")
span.history-date(ng-bind="log.prettyDate")
- span.toggle-log.icon.icon-arrow-bottom
+ svg.toggle-log.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
div.history-single-response
div.history-single-request-header
span(translate="ADMIN.WEBHOOKS.REQUEST")
a.resend-request(href="", title="{{'ADMIN.WEBHOOKS.RESEND_REQUEST' | translate}}", data-log="{{log.id}}")
- span.icon.icon-reload
+ svg.icon.icon-reload
+ use(xlink:href="#icon-reload")
span(translate="ADMIN.WEBHOOKS.RESEND_REQUEST")
div.history-single-request-body
div.response-container
@@ -91,9 +116,14 @@ div.wrapper.roles(ng-controller="WebhooksController as ctrl",
fieldset
input(type="text", name="key", placeholder="{{'ADMIN.WEBHOOKS.TYPE_SERVICE_SECRET' | translate}}", data-required="true", ng-model="newValue.key")
div.webhook-options
- a.add-new.icon.icon-floppy(href="", title="{{'ADMIN.WEBHOOKS.SAVE' | translate}}")
- a.cancel-new.icon.icon-delete(href="", title="{{'ADMIN.WEBHOOKS.CANCEL' | translate}}")
+ a.add-new(href="", title="{{'ADMIN.WEBHOOKS.SAVE' | translate}}")
+ svg.icon.icon-save
+ use(xlink:href="#icon-save")
+ a.cancel-new(href="", title="{{'ADMIN.WEBHOOKS.CANCEL' | translate}}")
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
a.help-button(href="https://taiga.io/support/webhooks/", target="_blank")
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="ADMIN.HELP")
diff --git a/app/partials/admin/project-csv.jade b/app/partials/admin/project-csv.jade
index 8e709dd9..559b1fd0 100644
--- a/app/partials/admin/project-csv.jade
+++ b/app/partials/admin/project-csv.jade
@@ -10,11 +10,14 @@ section.project-csv(tg-select-input-text)
input(type="text", placeholder="{{'ADMIN.CSV.URL_FIELD_PLACEHOLDER' | translate}}",
readonly, ng-model="csvUrl")
div.option-wrapper.select-input-content
- div.icon.icon-copy
+ svg.icon.icon-clipboard
+ use(xlink:href="#icon-clipboard")
a(href="", title="{{'ADMIN.CSV.TITLE_REGENERATE_URL' | translate}}", ng-click="ctrl.regenerateUuid()")
- span.icon.icon-plus(ng-hide="csvUrl")
+ svg.icon.icon-add(ng-hide="csvUrl")
+ use(xlink:href="#icon-add")
span(ng-hide="csvUrl", translate="ADMIN.CSV.ACTION_GENERATE_URL")
- span.icon.icon-reload(ng-Show="csvUrl")
+ svg.icon.icon-reload(ng-Show="csvUrl")
+ use(xlink:href="#icon-reload")
span(ng-Show="csvUrl", translate="ADMIN.CSV.ACTION_REGENERATE")
diff --git a/app/partials/backlog/backlog.jade b/app/partials/backlog/backlog.jade
index 0752b02f..f87992bc 100644
--- a/app/partials/backlog/backlog.jade
+++ b/app/partials/backlog/backlog.jade
@@ -12,8 +12,8 @@ div.wrapper(tg-backlog, ng-controller="BacklogController as ctrl",
include ../includes/components/summary
div.empty-burndown(ng-if="showGraphPlaceholder")
- div.graph-icon
- include ../../svg/graph.svg
+ svg.icon.icon-graph
+ use(xlink:href="#icon-graph")
div.empty-text
p.title(translate="BACKLOG.CUSTOMIZE_GRAPH")
p {{'BACKLOG.CUSTOMIZE_GRAPH_TEXT' | translate}} #[a(href="", tg-nav="project-admin-project-profile-details:project=project.slug", title="{{'BACKLOG.CUSTOMIZE_GRAPH_TITLE' | translate}}") {{'BACKLOG.CUSTOMIZE_GRAPH_ADMIN' | translate}}]
@@ -30,7 +30,8 @@ div.wrapper(tg-backlog, ng-controller="BacklogController as ctrl",
title="{{'BACKLOG.MOVE_US_TO_CURRENT_SPRINT' | translate}}"
id="move-to-current-sprint"
)
- span.icon.icon-move
+ svg.icon.icon-move
+ use(xlink:href="#icon-move")
span.text(translate="BACKLOG.MOVE_US_TO_CURRENT_SPRINT")
a.trans-button.move-to-latest-sprint.move-to-sprint(
ng-if="!currentSprint"
@@ -38,7 +39,8 @@ div.wrapper(tg-backlog, ng-controller="BacklogController as ctrl",
title="{{'BACKLOG.MOVE_US_TO_LATEST_SPRINT' | translate}}"
id="move-to-latest-sprint"
)
- span.icon.icon-move
+ svg.icon.icon-move
+ use(xlink:href="#icon-move")
span.text(translate="BACKLOG.MOVE_US_TO_LATEST_SPRINT")
a.trans-button(
ng-if="userstories.length"
diff --git a/app/partials/backlog/filter-selected.jade b/app/partials/backlog/filter-selected.jade
index d9550028..860c8423 100644
--- a/app/partials/backlog/filter-selected.jade
+++ b/app/partials/backlog/filter-selected.jade
@@ -2,5 +2,6 @@
a.single-filter.selected(data-type!="<%- f.type %>", data-id!="<%- f.id %>")
span.name(style!="<%- f.style %>")
| <%- f.name %>
- span.icon.icon-delete
+ svg.icon.icon-close.remove-filter
+ use(xlink:href="#icon-close")
<% }) %>
diff --git a/app/partials/backlog/sprint-header.jade b/app/partials/backlog/sprint-header.jade
index c1e636fb..2024e3ea 100644
--- a/app/partials/backlog/sprint-header.jade
+++ b/app/partials/backlog/sprint-header.jade
@@ -1,9 +1,12 @@
.sprint-name
- a.icon.icon-arrow-up(href="", title="{{'BACKLOG.COMPACT_SPRINT' | translate}}")
+ a.compact-sprint(href="", title="{{'BACKLOG.COMPACT_SPRINT' | translate}}")
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
a(ng-if="::isVisible", href="{{::taskboardUrl}}", title="{{'BACKLOG.GO_TO_TASKBOARD' | translate}}")
span {{::name}}
- a.icon.icon-edit(ng-if="::isEditable", href="", title="{{'BACKLOG.EDIT_SPRINT' | translate}}")
+ svg.icon.icon-edit.edit-sprint(ng-if="::isEditable", href="", title="{{'BACKLOG.EDIT_SPRINT' | translate}}")
+ use(xlink:href="#icon-edit")
.sprint-summary
.sprint-date {{::estimatedDateRange}}
diff --git a/app/partials/common/components/add-button.jade b/app/partials/common/components/add-button.jade
index a510e0a1..22606398 100644
--- a/app/partials/common/components/add-button.jade
+++ b/app/partials/common/components/add-button.jade
@@ -1,4 +1,5 @@
a.add-button(
href=""
)
- include ../../../svg/add.svg
+ svg.icon.icon-add
+ use(xlink:href="#icon-add")
diff --git a/app/partials/common/components/assigned-to.jade b/app/partials/common/components/assigned-to.jade
index 25b4b52b..2588a8b5 100644
--- a/app/partials/common/components/assigned-to.jade
+++ b/app/partials/common/components/assigned-to.jade
@@ -2,7 +2,8 @@
img(src!="<%- photo %>", alt!="<%- fullName %>")
<% if (isIocaine) { %>
.iocaine-symbol(title="{{ 'TASK.TITLE_ACTION_IOCAINE' | translate }}")
- include ../../../svg/iocaine.svg
+ svg.icon.icon-iocaine
+ use(xlink:href="#icon-iocaine")
<% }; %>
.assigned-to
@@ -23,7 +24,8 @@
<%- fullName %>
<% }; %>
<% if (isEditable && !isUnassigned) { %>
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% }; %>
<% if (isEditable && isUnassigned) { %>
@@ -37,8 +39,9 @@
<% }; %>
<% if (isEditable && !isUnassigned) { %>
- a.icon.icon-delete(
+ svg.icon.icon-close.remove-user(
href=""
title="{{'COMMON.ASSIGNED_TO.DELETE_ASSIGNMENT' | translate}}"
)
+ use(xlink:href="#icon-close")
<% } %>
diff --git a/app/partials/common/components/block-button.jade b/app/partials/common/components/block-button.jade
index 2f474602..0a499ff2 100644
--- a/app/partials/common/components/block-button.jade
+++ b/app/partials/common/components/block-button.jade
@@ -2,9 +2,11 @@ a.button-gray.item-block(
href=""
title="{{ 'COMMON.BLOCK_TITLE' | translate }}"
)
- include ../../../svg/lock.svg
+ svg.icon.icon-lock
+ use(xlink:href="#icon-lock")
a.button-red.item-unblock(
href=""
title="{{ 'COMMON.UNBLOCK_TITLE' | translate }}"
)
- include ../../../svg/unlock.svg
+ svg.icon.icon-lock
+ use(xlink:href="#icon-unlock")
diff --git a/app/partials/common/components/delete-button.jade b/app/partials/common/components/delete-button.jade
index 22f6ee5b..3f1d987c 100644
--- a/app/partials/common/components/delete-button.jade
+++ b/app/partials/common/components/delete-button.jade
@@ -2,4 +2,5 @@ a.button-red.button-delete(
href=""
title="{{ 'COMMON.DELETE' | translate }}"
)
- include ../../../svg/trash.svg
+ svg.icon.icon-trash
+ use(xlink:href="#icon-trash")
diff --git a/app/partials/common/components/editable-description.jade b/app/partials/common/components/editable-description.jade
index 6cfdeda1..348ef613 100644
--- a/app/partials/common/components/editable-description.jade
+++ b/app/partials/common/components/editable-description.jade
@@ -2,10 +2,12 @@ include wysiwyg.jade
.view-description
section.us-content.wysiwyg(tg-bind-html="item.description_html || noDescriptionMsg")
- span.edit.icon.icon-edit
+ svg.icon.icon-edit.edit
+ use(xlink:href="#icon-edit")
.edit-description
textarea(ng-attr-placeholder="{{'COMMON.DESCRIPTION.EMPTY' | translate}}", ng-model="item.description", tg-markitup="tg-markitup")
+wysihelp
span.save-container
- a.save.icon.icon-floppy(href="", title="{{'COMMON.SAVE' | translate}}")
+ svg.save.icon.icon-save(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
diff --git a/app/partials/common/components/editable-subject.jade b/app/partials/common/components/editable-subject.jade
index f5d728bb..e4cc7bb2 100644
--- a/app/partials/common/components/editable-subject.jade
+++ b/app/partials/common/components/editable-subject.jade
@@ -1,7 +1,9 @@
.view-subject
| {{ item.subject }}
- a.edit.icon.icon-edit(href="" title="{{'COMMON.EDIT' | translate}}")
+ svg.edit.icon.icon-edit(href="" title="{{'COMMON.EDIT' | translate}}")
+ use(xlink:href="#icon-edit")
.edit-subject
input(type="text", ng-model="item.subject", data-required="true", data-maxlength="500", ng-model-options="{ debounce: 200 }")
span.save-container
- a.save.icon.icon-floppy(href="", title="{{'COMMON.SAVE' | translate}}")
+ svg.save.icon.icon-save(href="", title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
diff --git a/app/partials/common/components/watchers.jade b/app/partials/common/components/watchers.jade
index fcbe398d..fb5d9771 100644
--- a/app/partials/common/components/watchers.jade
+++ b/app/partials/common/components/watchers.jade
@@ -10,11 +10,11 @@
span <%- watcher.full_name_display %>
<% if(isEditable){ %>
- a.icon.icon-delete.js-delete-watcher(
- href=""
+ svg.icon.icon-trash.js-delete-watcher.delete-watcher(
data-watcher-id!="<%- watcher.id %>"
title="{{'COMMON.WATCHERS.DELETE' | translate}}"
)
+ use(xlink:href="#icon-trash")
<% }; %>
<% } %>
<% }); %>
diff --git a/app/partials/common/components/wysiwyg.jade b/app/partials/common/components/wysiwyg.jade
index 3d90e44a..4c10f363 100644
--- a/app/partials/common/components/wysiwyg.jade
+++ b/app/partials/common/components/wysiwyg.jade
@@ -2,5 +2,6 @@ mixin wysihelp
div.wysiwyg-help
span.drag-drop-help Attach files by dragging & dropping on the textarea above.
a.help-markdown(href="https://taiga.io/support/taiga-markdown-syntax/", target="_blank", title="{{'COMMON.WYSIWYG.MARKDOWN_HELP' | translate}}")
- span.icon.icon-help
+ svg.icon.icon-question
+ use(xlink:href="#icon-question")
span(translate="COMMON.WYSIWYG.MARKDOWN_HELP")
diff --git a/app/partials/common/estimation/us-estimation-points-per-role.jade b/app/partials/common/estimation/us-estimation-points-per-role.jade
index 86bf489c..298960c0 100644
--- a/app/partials/common/estimation/us-estimation-points-per-role.jade
+++ b/app/partials/common/estimation/us-estimation-points-per-role.jade
@@ -3,7 +3,8 @@ ul.points-per-role
li.ticket-role-points.total(class!="<% if(editable){ %>clickable<% } %>", data-role-id!="<%- role.id %>", title!="<%- role.name %>")
span.points
<%- role.points %>
- span.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
span.role
<%- role.name %>
<% }); %>
diff --git a/app/partials/common/estimation/us-estimation-total.jade b/app/partials/common/estimation/us-estimation-total.jade
index 235494bb..013bd495 100644
--- a/app/partials/common/estimation/us-estimation-total.jade
+++ b/app/partials/common/estimation/us-estimation-total.jade
@@ -1,5 +1,6 @@
a.us-points(href="", title!="<%= title %>", class!="<% if (!editable) { %>not-clickable<% } %>")
span.points-value <%= text %>
<% if (editable) { %>
- span.icon.icon-arrow-bottom(tg-check-permission="modify_us")
+ svg.icon.icon-arrow-down(tg-check-permission="modify_us")
+ use(xlink:href="#icon-arrow-down")
<% } %>
diff --git a/app/partials/common/history/history-activity.jade b/app/partials/common/history/history-activity.jade
index a49c3fb6..7a7ce6ff 100644
--- a/app/partials/common/history/history-activity.jade
+++ b/app/partials/common/history/history-activity.jade
@@ -1,4 +1,4 @@
-div(class!="activity-single <%- mode %>")
+.activity-single(class!="<%- mode %>")
.activity-user
a.avatar(href!="<%- userProfileUrl %>", title!="<%- userFullName %>")
img(src!="<%- avatar %>", alt!="<%- userFullName %>")
@@ -18,11 +18,11 @@ div(class!="activity-single <%- mode %>")
.comment.wysiwyg(ng-non-bindable)
| <%= comment %>
<% if (!deleteCommentDate && mode !== "activity" && canDeleteComment) { %>
- a.icon.icon-delete.comment-delete(
- href=""
+ svg.icon.icon-trash.comment-delete(
data-activity-id!="<%- activityId %>"
title!="<%- deleteCommentActionTitle %>"
)
+ use(xlink:href="#icon-trash")
<% } %>
<% } %>
@@ -31,7 +31,8 @@ div(class!="activity-single <%- mode %>")
<% if (mode != "activity") { %>
a.changes-title(href="", title="{{'ACTIVITY.SHOW_ACTIVITY' | translate}}")
span <%- changesText %>
- span.icon.icon-arrow-up
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
<% } %>
<% _.each(changes, function(change) { %>
| <%= change %>
diff --git a/app/partials/common/history/history-base.jade b/app/partials/common/history/history-base.jade
index ceef5a7c..3d8f1874 100644
--- a/app/partials/common/history/history-base.jade
+++ b/app/partials/common/history/history-base.jade
@@ -6,13 +6,15 @@ section.history
<% if (commentsVisible) { %>
li
a(href="#", class="active", data-section-class="history-comments")
- span.icon.icon-comment
+ svg.icon.icon-writer
+ use(xlink:href="#icon-writer")
span.tab-title(translate="COMMENTS.TITLE")
<% } %>
<% if (historyVisible) { %>
li
a(href="#", data-section-class="history-activity")
- span.icon.icon-issues
+ svg.icon.icon-timeline
+ use(xlink:href="#icon-timeline")
span.tab-title(translate="ACTIVITY.TITLE")
<% } %>
<% } %>
diff --git a/app/partials/common/history/history-deleted-comment.jade b/app/partials/common/history/history-deleted-comment.jade
index fbbcd29d..51510e55 100644
--- a/app/partials/common/history/history-deleted-comment.jade
+++ b/app/partials/common/history/history-deleted-comment.jade
@@ -13,6 +13,7 @@
data-activity-id!="<%- activityId %>"
title="{{ 'COMMENTS.RESTORE' | translate }}"
)
- span.icon.icon-reload
+ svg.icon.icon-reload
+ use(xlink:href="#icon-reload")
span(translate="COMMENTS.RESTORE")
<% } %>
diff --git a/app/partials/common/lightbox-feedback.jade b/app/partials/common/lightbox-feedback.jade
index d985a8a6..f46019c6 100644
--- a/app/partials/common/lightbox-feedback.jade
+++ b/app/partials/common/lightbox-feedback.jade
@@ -1,5 +1,5 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+svg.close.icon.icon-close(href="", title="{{'COMMON.CLOSE' | translate}}")
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.FEEDBACK.TITLE")
fieldset
diff --git a/app/partials/common/lightbox/lightbox-assigned-to-users.jade b/app/partials/common/lightbox/lightbox-assigned-to-users.jade
index 49c44b9a..78916665 100644
--- a/app/partials/common/lightbox/lightbox-assigned-to-users.jade
+++ b/app/partials/common/lightbox/lightbox-assigned-to-users.jade
@@ -11,10 +11,11 @@
title!="<%- selected.full_name_display %>"
)
| <%-selected.full_name_display %>
- a.icon-delete.remove-assigned-to(
+ svg.icon.icon-close.remove-assigned-to(
href=""
title="{{'COMMON.ASSIGNED_TO.REMOVE_ASSIGNED' | translate}}"
)
+ use(xlink:href="#icon-close")
<% } %>
<% _.each(users, function(user) { %>
diff --git a/app/partials/common/lightbox/lightbox-assigned-to.jade b/app/partials/common/lightbox/lightbox-assigned-to.jade
index 7f00751d..b3947857 100644
--- a/app/partials/common/lightbox/lightbox-assigned-to.jade
+++ b/app/partials/common/lightbox/lightbox-assigned-to.jade
@@ -1,5 +1,6 @@
-a.close(href="", title="close")
- span.icon.icon-delete
+svg.close.icon.icon-close(href="", title="{{'COMMON.CLOSE' | translate}}")
+ use(xlink:href="#icon-close")
+
div.form
h2.title(translate="LIGHTBOX.ASSIGNED_TO.SELECT")
fieldset
diff --git a/app/partials/common/lightbox/lightbox-attachment-preview.jade b/app/partials/common/lightbox/lightbox-attachment-preview.jade
index b1b1ebb5..bf401bbf 100644
--- a/app/partials/common/lightbox/lightbox-attachment-preview.jade
+++ b/app/partials/common/lightbox/lightbox-attachment-preview.jade
@@ -1,6 +1,6 @@
.attachment-preview
- a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+ svg.close.icon.icon-close(href="", title="{{'COMMON.CLOSE' | translate}}")
+ use(xlink:href="#icon-close")
a(href="{{::file.get('url')}}", title="{{::file.get('description')}}", target="_blank", download="{{::file.get('name')}}")
- img(src="{{::file.get('url')}}")
\ No newline at end of file
+ img(src="{{::file.get('url')}}")
diff --git a/app/partials/common/lightbox/lightbox-block.jade b/app/partials/common/lightbox/lightbox-block.jade
index b74ee6d4..d7bd60da 100644
--- a/app/partials/common/lightbox/lightbox-block.jade
+++ b/app/partials/common/lightbox/lightbox-block.jade
@@ -1,5 +1,5 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+svg.close.icon.icon-close(href="", title="{{'COMMON.CLOSE' | translate}}")
+ use(xlink:href="#icon-close")
div.form
h2.title
fieldset
diff --git a/app/partials/common/lightbox/lightbox-users.jade b/app/partials/common/lightbox/lightbox-users.jade
index 2c43e246..d6693258 100644
--- a/app/partials/common/lightbox/lightbox-users.jade
+++ b/app/partials/common/lightbox/lightbox-users.jade
@@ -1,5 +1,5 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+svg.close.icon.icon-close(href="", title="{{'COMMON.CLOSE' | translate}}")
+ use(xlink:href="#icon-close")
div.form
h2.title(translate="COMMON.WATCHERS.ADD")
fieldset
diff --git a/app/partials/common/tag/lb-tag-line-tags.jade b/app/partials/common/tag/lb-tag-line-tags.jade
index fb6be1eb..7f95583e 100644
--- a/app/partials/common/tag/lb-tag-line-tags.jade
+++ b/app/partials/common/tag/lb-tag-line-tags.jade
@@ -1,5 +1,6 @@
<% _.each(tags, function(tag) { %>
span(class="tag", style!="<%- tag.style %>")
span.tag-name <%- tag.name %>
- a(href="", title="{{ 'COMMON.TAGS.DELETE' | translate }}", class="icon icon-delete")
+ svg.icon.icon-close.remove-tag(title="{{ 'COMMON.TAGS.DELETE' | translate }}")
+ use(xlink:href="#icon-close")
<% }); %>
diff --git a/app/partials/common/tag/lb-tag-line.jade b/app/partials/common/tag/lb-tag-line.jade
index 1c06a23e..5fe8414b 100644
--- a/app/partials/common/tag/lb-tag-line.jade
+++ b/app/partials/common/tag/lb-tag-line.jade
@@ -1,3 +1,8 @@
.tags-container
-input(type="text", placeholder="{{'COMMON.TAGS.PLACEHOLDER' | translate}}", class="tag-input")
-a(href="", title="{{'COMMON.SAVE' | translate}}", class="save icon icon-floppy hidden")
+input.tag-input(
+ type="text"
+ placeholder="{{'COMMON.TAGS.PLACEHOLDER' | translate}}"
+)
+span.save.hidden(title="{{'COMMON.SAVE' | translate}}")
+ svg.icon.icon-save
+ use(xlink:href="#icon-save")
diff --git a/app/partials/common/tag/tag-line.jade b/app/partials/common/tag/tag-line.jade
index 06040a9e..2d205441 100644
--- a/app/partials/common/tag/tag-line.jade
+++ b/app/partials/common/tag/tag-line.jade
@@ -1,8 +1,11 @@
.tags-container
a(href="#", class="add-tag hidden", title="{{'COMMON.TAGS.ADD' | translate}}")
- span.icon.icon-plus
+ svg.icon.icon-add
+ use(xlink:href="#icon-add")
span.add-tag-text(translate="COMMON.TAGS.ADD")
span.add-tag-input
input(type="text", placeholder="{{'COMMON.TAGS.PLACEHOLDER' | translate}}", class="tag-input hidden")
- a(href="", title="{{'COMMON.SAVE' | translate}}", class="save icon icon-floppy hidden")
+ span.save.hidden(title="{{'COMMON.SAVE' | translate}}")
+ svg.icon.icon-save
+ use(xlink:href="#icon-save")
diff --git a/app/partials/common/tag/tags-line-tags.jade b/app/partials/common/tag/tags-line-tags.jade
index c9b0dbd9..9ea57c69 100644
--- a/app/partials/common/tag/tags-line-tags.jade
+++ b/app/partials/common/tag/tags-line-tags.jade
@@ -2,6 +2,7 @@
span(class="tag", style!="border-left: 5px solid <%- tag.color %>;")
span.tag-name <%- tag.name %>
<% if (isEditable) { %>
- a(href="", title="{{ 'COMMON.TAGS.DELETE' | translate }}", class="icon icon-delete")
+ svg.icon.icon-close.remove-tag(title="{{ 'COMMON.TAGS.DELETE' | translate }}")
+ use(xlink:href="#icon-close")
<% } %>
<% }); %>
diff --git a/app/partials/common/wysiwyg/wysiwyg-markitup-preview.jade b/app/partials/common/wysiwyg/wysiwyg-markitup-preview.jade
index a674385d..791c2d2b 100644
--- a/app/partials/common/wysiwyg/wysiwyg-markitup-preview.jade
+++ b/app/partials/common/wysiwyg/wysiwyg-markitup-preview.jade
@@ -1,5 +1,6 @@
.preview
.actions
- a(href="#" title="{{'COMMON.WYSIWYG.EDIT_BUTTON' | translate}}" class="icon icon-edit edit")
+ svg.edit.icon.icon-edit(title="{{'COMMON.WYSIWYG.EDIT_BUTTON' | translate}}")
+ use(xlink:href="#icon-edit")
.content.wysiwyg
| <%= data %>
diff --git a/app/partials/custom-attributes/custom-attribute-value-edit.jade b/app/partials/custom-attributes/custom-attribute-value-edit.jade
index 1f90518e..a62c4f53 100644
--- a/app/partials/custom-attributes/custom-attribute-value-edit.jade
+++ b/app/partials/custom-attributes/custom-attribute-value-edit.jade
@@ -22,4 +22,5 @@ form.custom-field-single.editable
<% } %>
div.custom-field-options
- a.icon.icon-floppy(href="", title="{{'COMMON.CUSTOM_ATTRIBUTES.SAVE' | translate}}")
+ svg.icon.icon-save.js-save-description(title="{{'COMMON.CUSTOM_ATTRIBUTES.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
diff --git a/app/partials/custom-attributes/custom-attribute-value.jade b/app/partials/custom-attributes/custom-attribute-value.jade
index c89dbd06..51e7bfeb 100644
--- a/app/partials/custom-attributes/custom-attribute-value.jade
+++ b/app/partials/custom-attributes/custom-attribute-value.jade
@@ -1,5 +1,5 @@
-div.custom-field-single
- div.custom-field-data
+.custom-field-single
+ .custom-field-data
span.custom-field-name
<%- name %>
<% if (description){ %>
@@ -7,7 +7,7 @@ div.custom-field-single
<%- description %>
<% } %>
- div.custom-field-value.js-value-view-mode
+ .custom-field-value.js-value-view-mode
span
<% if (type=="url") { %>
a(href!="<%- value %>")
@@ -17,6 +17,7 @@ div.custom-field-single
<% } %>
<% if (isEditable) { %>
- div.custom-field-options
- a.icon.icon-edit(href="", title="{{'COMMON.CUSTOM_ATTRIBUTES.EDIT' | translate}}")
+ .custom-field-options
+ svg.icon.icon-edit.js-edit-description(title="{{'COMMON.CUSTOM_ATTRIBUTES.EDIT' | translate}}")
+ use(xlink:href="#icon-edit")
<% } %>
diff --git a/app/partials/custom-attributes/custom-attributes-values.jade b/app/partials/custom-attributes/custom-attributes-values.jade
index 3c34c6e1..09d7ecf9 100644
--- a/app/partials/custom-attributes/custom-attributes-values.jade
+++ b/app/partials/custom-attributes/custom-attributes-values.jade
@@ -2,6 +2,7 @@ section.duty-custom-fields(ng-show="ctrl.customAttributes.length")
div.custom-fields-header
span(translate="COMMON.CUSTOM_ATTRIBUTES.CUSTOM_FIELDS")
// Remove .open class on click on this button in both .icon and .custom-fields-body to close
- a.icon.icon-arrow-bottom(class!="<% if (!collapsed) { %>open<% } %>")
+ svg.icon.icon-arrow-down(class!="<% if (!collapsed) { %>open<% } %>")
+ use(xlink:href="#icon-arrow-down")
div.custom-fields-body(class!="<% if (!collapsed) { %>open<% } %>")
div(ng-repeat="att in ctrl.customAttributes", tg-custom-attribute-value="ctrl.getAttributeValue(att)", required-edition-perm!="<%- requiredEditionPerm %>")
diff --git a/app/partials/includes/components/addnewtask.jade b/app/partials/includes/components/addnewtask.jade
index fd25ed2d..6de3e427 100644
--- a/app/partials/includes/components/addnewtask.jade
+++ b/app/partials/includes/components/addnewtask.jade
@@ -1,6 +1,14 @@
-a.icon.icon-plus(tg-check-permission="add_task",
- href="", title="{{'TASKBOARD.TITLE_ACTION_ADD' | translate}}",
- ng-click="ctrl.addNewTask('standard', us)")
-a.icon.icon-bulk(tg-check-permission="add_task",
- href="", title="{{'TASKBOARD.TITLE_ACTION_ADD_BULK' | translate}}",
- ng-click="ctrl.addNewTask('bulk', us)")
+svg.icon.icon-add(
+ tg-check-permission="add_task"
+ href=""
+ title="{{'TASKBOARD.TITLE_ACTION_ADD' | translate}}"
+ ng-click="ctrl.addNewTask('standard', us)"
+)
+ use(xlink:href="#icon-add")
+svg.icon.icon-bulk(
+ tg-check-permission="add_task"
+ href=""
+ title="{{'TASKBOARD.TITLE_ACTION_ADD_BULK' | translate}}"
+ ng-click="ctrl.addNewTask('bulk', us)"
+)
+ use(xlink:href="#icon-bulk")
diff --git a/app/partials/includes/components/addnewus.jade b/app/partials/includes/components/addnewus.jade
index 52f59b9a..27a9d870 100644
--- a/app/partials/includes/components/addnewus.jade
+++ b/app/partials/includes/components/addnewus.jade
@@ -6,4 +6,5 @@ div.new-us
a.button-bulk(href="", title="{{'US.ADD_BULK' | translate}}",
ng-click="ctrl.addNewUs('bulk')",
tg-check-permission="add_us")
- span.icon.icon-bulk
+ svg.icon.icon-bulk
+ use(xlink:href="#icon-bulk")
diff --git a/app/partials/includes/components/backlog-row.jade b/app/partials/includes/components/backlog-row.jade
index 99684c1b..e564a31b 100644
--- a/app/partials/includes/components/backlog-row.jade
+++ b/app/partials/includes/components/backlog-row.jade
@@ -13,7 +13,8 @@ div.row.us-item-row(
ng-class="{'inactive': !us.total_voters, 'is-voted': us.is_voter}"
title="{{ 'COMMON.VOTE_BUTTON.COUNTER_TITLE'|translate:{total:us.total_voters||0}:'messageformat' }}"
)
- span.icon.icon-caret-up
+ svg.icon.icon-upvote
+ use(xlink:href="#icon-upvote")
span {{ ::us.total_voters }}
div.user-stories
div.tags-block(tg-colorize-tags="us.tags", tg-colorize-tags-type="backlog")
@@ -27,25 +28,33 @@ div.row.us-item-row(
span(tg-bo-ref="us.ref")
span(ng-bind="us.subject")
div.us-settings
- a.icon.icon-edit(
+ a.edit-story(
href=""
tg-check-permission="modify_us"
ng-click="ctrl.editUserStory(us.project, us.ref, $event)"
title="{{'COMMON.EDIT' | translate}}"
)
- a.icon.icon-delete(
+ svg.icon.icon-edit
+ use(xlink:href="#icon-edit")
+
+ a.icon-delete(
href=""
tg-check-permission="delete_us"
ng-click="ctrl.deleteUserStory(us)"
title="{{'COMMON.DELETE' | translate}}"
)
+ svg.icon.icon-trash
+ use(xlink:href="#icon-trash")
div.status(tg-us-status="us" on-update="ctrl.updateUserStoryStatus()")
a.us-status(href="", title="{{'BACKLOG.STATUS_NAME' | translate}}")
span.us-status-bind
- span.icon.icon-arrow-bottom(tg-check-permission="modify_us")
+ svg.icon.icon-arrow-down(tg-check-permission="modify_us")
+ use(xlink:href="#icon-arrow-down")
div.points(tg-backlog-us-points="us")
a.us-points(href="", title="{{'COMMON.FIELDS.POINTS' | translate}}")
- a.icon.icon-drag-v(tg-check-permission="modify_us", href="", title="{{'COMMON.DRAG' | translate}}")
+ a(tg-check-permission="modify_us", href="", title="{{'COMMON.DRAG' | translate}}")
+ svg.icon.icon-drag
+ use(xlink:href="#icon-drag")
diff --git a/app/partials/includes/components/notification-message.jade b/app/partials/includes/components/notification-message.jade
index 82b3ab05..4597bd30 100644
--- a/app/partials/includes/components/notification-message.jade
+++ b/app/partials/includes/components/notification-message.jade
@@ -15,15 +15,18 @@ div.notification-message.notification-message-success
p(translate="NOTIFICATION.SAVED")
div.notification-message.notification-message-error
- div.icon.icon-notification-error
+ svg.icon.icon-error
+ use(xlink:href="#icon-error")
div.text
h4.warning(translate="NOTIFICATION.WARNING")
p(translate="NOTIFICATION.WARNING_TEXT")
- a.icon.icon-delete(href="", title="{{'NOTIFICATION.CLOSE' | translate}}")
+ svg.icon.icon-close(href="", title="{{'NOTIFICATION.CLOSE' | translate}}")
+ use(xlink:href="#icon-close")
div.notification-light.notification-message-light-error
div.text
h4.warning(translate="NOTIFICATION.WARNING")
p(translate="NOTIFICATION.WARNING_TEXT")
a.close(href="", title="{{'NOTIFICATION.CLOSE' | translate}}")
- include ../../../svg/remove.svg
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
diff --git a/app/partials/includes/components/sprint-summary.jade b/app/partials/includes/components/sprint-summary.jade
index 5fbe8e4e..87244b25 100644
--- a/app/partials/includes/components/sprint-summary.jade
+++ b/app/partials/includes/components/sprint-summary.jade
@@ -13,7 +13,8 @@ div.summary.large-summary
span.description(translate="BACKLOG.SPRINT_SUMMARY.COMPLETED_POINTS")
div.summary-stats
- span.icon.icon-bulk
+ svg.icon.icon-bulk
+ use(xlink:href="#icon-bulk")
span.number(ng-bind="stats.openTasks|default:'--'")
span.description(translate="BACKLOG.SPRINT_SUMMARY.OPEN_TASKS")
div.summary-stats
@@ -21,9 +22,11 @@ div.summary.large-summary
span.description(translate="BACKLOG.SPRINT_SUMMARY.CLOSED_TASKS")
div.summary-stats(title="{{'COMMON.IOCAINE_TEXT' | translate}}")
- span.icon.icon-iocaine
+ svg.icon.icon-iocaine
+ use(xlink:href="#icon-iocaine")
span.number(ng-bind="stats.iocaine_doses|default:'--'")
span.description(translate="BACKLOG.SPRINT_SUMMARY.IOCAINE_DOSES")
div.stats.toggle-analytics-visibility(title="{{'BACKLOG.SPRINT_SUMMARY.SHOW_STATISTICS_TITLE' | translate}}")
- include ../../../svg/graph.svg
+ svg.icon.icon-graph
+ use(xlink:href="#icon-graph")
diff --git a/app/partials/includes/components/summary.jade b/app/partials/includes/components/summary.jade
index 81ba9d4b..b6698321 100644
--- a/app/partials/includes/components/summary.jade
+++ b/app/partials/includes/components/summary.jade
@@ -22,4 +22,5 @@ div.summary
title="{{'BACKLOG.SPRINT_SUMMARY.TOGGLE_BAKLOG_GRAPH' | translate}}",
ng-if="!showGraphPlaceholder"
)
- include ../../../svg/graph.svg
+ svg.icon.icon-graph
+ use(xlink:href="#icon-graph")
diff --git a/app/partials/includes/components/taskboard-task.jade b/app/partials/includes/components/taskboard-task.jade
index dd34369e..4716a763 100644
--- a/app/partials/includes/components/taskboard-task.jade
+++ b/app/partials/includes/components/taskboard-task.jade
@@ -1,11 +1,18 @@
div.taskboard-tagline(tg-colorize-tags="task.tags", tg-colorize-tags-type="taskboard")
div.taskboard-task-inner
div.taskboard-user-avatar(tg-taskboard-user-avatar, users="usersById", task="task", project="project", ng-class="{iocaine: task.is_iocaine}")
- span.icon.icon-iocaine(ng-if="task.is_iocaine", title="{{'COMMON.IOCAINE_TEXT' | translate}}")
+ svg.icon.icon-iocaine(
+ ng-if="task.is_iocaine"
+ title="{{'COMMON.IOCAINE_TEXT' | translate}}"
+ )
+ use(xlink:href="#icon-iocaine")
p.taskboard-text
a.task-assigned(href="", title="{{'TASKBOARD.TITLE_ACTION_ASSIGN' | translate}}")
span.task-num(tg-bo-ref="task.ref")
a.task-name(href="", title="#{{ ::task.ref }} {{ ::task.subject }}", ng-bind="task.subject",
tg-nav="project-tasks-detail:project=project.slug,ref=task.ref")
- a.icon.icon-edit(tg-check-permission="modify_task",
- href="", title="{{'TASKBOARD.TITLE_ACTION_EDIT' | translate}}")
+ svg.icon.icon-edit(
+ tg-check-permission="modify_task"
+ title="{{'TASKBOARD.TITLE_ACTION_EDIT' | translate}}"
+ )
+ use(xlink:href="#icon-edit")
diff --git a/app/partials/includes/modules/admin/admin-custom-attributes.jade b/app/partials/includes/modules/admin/admin-custom-attributes.jade
index bb03c36c..073dcbe5 100644
--- a/app/partials/includes/modules/admin/admin-custom-attributes.jade
+++ b/app/partials/includes/modules/admin/admin-custom-attributes.jade
@@ -22,7 +22,8 @@ section.custom-fields-table.basic-table
div(ng-repeat="attr in customAttributes track by attr.id", tg-bind-scope)
form.js-form(tg-bind-scope)
div.row.single-custom-field.js-view-custom-field
- span.icon.icon-drag-v
+ svg.icon.icon-drag
+ use(xlink:href="#icon-drag")
div.custom-name
span {{ attr.name }}
div.custom-description
@@ -35,14 +36,16 @@ section.custom-fields-table.basic-table
span(ng-switch-when="url", translate="ADMIN.CUSTOM_FIELDS.FIELD_TYPE_URL")
div.custom-options
div.custom-options-wrapper
- a.js-edit-custom-field-button.icon.icon-edit(
+ svg.js-edit-custom-field-button.icon.icon-edit(
href=""
title="{{'ADMIN.CUSTOM_ATTRIBUTES.EDIT' | translate}}"
)
- a.js-delete-custom-field-button.icon.icon-delete(
+ use(xlink:href="#icon-edit")
+ svg.js-delete-custom-field-button.icon.icon-trash(
href=""
title="{{'ADMIN.CUSTOM_ATTRIBUTES.DELETE' | translate}}"
)
+ use(xlink:href="#icon-trash")
div.row.single-custom-field.js-edit-custom-field.hidden
fieldset.custom-name
@@ -68,14 +71,16 @@ section.custom-fields-table.basic-table
)
fieldset.custom-options
div.custom-options-wrapper
- a.js-update-custom-field-button.icon.icon-floppy(
+ svg.js-update-custom-field-button.icon.icon-save(
href=""
title="{{'ADMIN.CUSTOM_ATTRIBUTES.ACTION_UPDATE' | translate}}"
)
- a.js-cancel-edit-custom-field-button.icon.icon-delete(
+ use(xlink:href="#icon-save")
+ svg.js-cancel-edit-custom-field-button.icon.icon-close(
href=""
title="{{'ADMIN.CUSTOM_ATTRIBUTES.ACTION_CANCEL_EDITION' | translate}}"
)
+ use(xlink:href="#icon-close")
form.row.single-custom-field.js-new-custom-field.hidden
fieldset.custom-name
@@ -103,11 +108,13 @@ section.custom-fields-table.basic-table
fieldset.custom-options
div.custom-options-wrapper
- a.js-create-custom-field-button.icon.icon-floppy(
+ svg.js-create-custom-field-button.icon.icon-save(
href=""
title="{{'ADMIN.CUSTOM_ATTRIBUTES.SAVE_TITLE' | translate}}"
)
- a.js-cancel-new-custom-field-button.icon.icon-delete(
+ use(xlink:href="#icon-save")
+ svg.js-cancel-new-custom-field-button.icon.icon-trash(
href=""
title="{{'ADMIN.CUSTOM_ATTRIBUTES.CANCEL_TITLE' | translate}}"
)
+ use(xlink:href="#icon-trash")
diff --git a/app/partials/includes/modules/admin/project-points.jade b/app/partials/includes/modules/admin/project-points.jade
index bb991265..6189a3d7 100644
--- a/app/partials/includes/modules/admin/project-points.jade
+++ b/app/partials/includes/modules/admin/project-points.jade
@@ -18,7 +18,8 @@ section.project-values-table
div(ng-repeat="value in values track by value.id", tg-bind-scope)
form(tg-bind-scope)
div.project-values-row.row.table-main.visualization
- span.icon.icon-drag-v
+ svg.icon.icon-drag
+ use(xlink:href="#icon-drag")
div.project-values-name
span {{ value.name }}
@@ -27,8 +28,10 @@ section.project-values-table
span {{ value.value }}
div.project-values-settings
- a.edit-value.icon.icon-edit(href="", title="{{'ADMIN.POINTS.TITLE_ACTION_EDIT_VALUE' | translate}}")
- a.delete-value.icon.icon-delete(href="", title="{{'ADMIN.POINTS.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ svg.edit-value.icon.icon-edit(title="{{'ADMIN.POINTS.TITLE_ACTION_EDIT_VALUE' | translate}}")
+ use(xlink:href="#icon-edit")
+ svg.delete-value.icon.icon-trash(title="{{'ADMIN.POINTS.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ use(xlink:href="#icon-trash")
div.project-values-row.row.table-main.edition.hidden
div.project-values-name
@@ -38,19 +41,33 @@ section.project-values-table
input(name="value", type="text", placeholder="{{'COMMON.FIELDS.VALUE' | translate}}", ng-model="value.value", data-type="number")
div.project-values-settings
- a.save.icon.icon-floppy(href="", title="{{'COMMON.SAVE' | translate}}")
- a.cancel.icon.icon-delete(href="", title="{{'COMON.CANCEL' | translate}}")
+ svg.save.icon.icon-save(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.cancel.icon.icon-close(href="", title="{{'COMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-close")
form
div.project-values-row.new-value.hidden
div.project-values-name
- input(name="name", type="text", placeholder="{{'COMMON.FIELDS.NAME' | translate}}", ng-model="newValue.name",
- data-required="true")
+ input(
+ name="name"
+ type="text"
+ placeholder="{{'COMMON.FIELDS.NAME' | translate}}"
+ ng-model="newValue.name"
+ data-required="true"
+ )
div.project-values-value
- input("name=value", type="text", placeholder="{{'COMMON.FIELDS.VALUE' | translate}}", ng-model="newValue.value",
- data-type="number")
+ input(
+ name="value"
+ type="text"
+ placeholder="{{'COMMON.FIELDS.VALUE' | translate}}"
+ ng-model="newValue.value"
+ data-type="number"
+ )
div.project-values-settings
- a.add-new.icon.icon-floppy(href="", title="{{'COMMON.ADD' | translate}}")
- a.delete-new.icon.icon-delete(href="", title="{{'COMMON.CANCEL' | translate}}")
+ svg.add-new.icon.icon-save(title="{{'COMMON.ADD' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.delete-new.icon.icon-trash(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-trash")
diff --git a/app/partials/includes/modules/admin/project-status.jade b/app/partials/includes/modules/admin/project-status.jade
index 40c5c799..1540413d 100644
--- a/app/partials/includes/modules/admin/project-status.jade
+++ b/app/partials/includes/modules/admin/project-status.jade
@@ -17,7 +17,8 @@ section.colors-table.admin-status-table
div(ng-repeat="value in values", tg-bind-scope)
form(tg-bind-scope)
div.row.table-main.visualization
- span.icon.icon-drag-v
+ svg.icon.icon-drag
+ use(xlink:href="#icon-drag")
div.color-column
div.current-color(ng-style="{background: value.color}")
@@ -28,43 +29,75 @@ section.colors-table.admin-status-table
span {{ value.slug }}
div.is-closed-column
- div.icon.icon-check-square(ng-show="value.is_closed")
+ svg.icon.icon-check(ng-show="value.is_closed")
+ use(xlink:href="#icon-check")
div.options-column
- a.edit-value.icon.icon-edit(href="", title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}")
- a.delete-value.icon.icon-delete(href="", title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ svg.edit-value.icon.icon-edit(title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}")
+ use(xlink:href="#icon-edit")
+ svg.delete-value.icon.icon-trash(title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ use(xlink:href="#icon-trash")
div.row.table-main.edition.hidden
- div.color-column(tg-color-selection, ng-model="value")
+ div.color-column(
+ tg-color-selection
+ ng-model="value"
+ )
div.current-color(ng-style="{background: value.color}")
include ../../components/select-color
div.status-name
- input(name="name", type="text", placeholder="{{'ADMIN.STATUS.PLACEHOLDER_WRITE_STATUS_NAME' | translate}}",
- ng-model="value.name", data-required="true", data-maxlength="255")
+ input(
+ name="name"
+ type="text"
+ placeholder="{{'ADMIN.STATUS.PLACEHOLDER_WRITE_STATUS_NAME' | translate}}"
+ ng-model="value.name"
+ data-required="true"
+ data-maxlength="255"
+ )
div.is-closed-column
- select(name="is_closed", ng-model="value.is_closed", data-required="true",
- ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]")
+ select(
+ name="is_closed"
+ ng-model="value.is_closed"
+ data-required="true"
+ ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]")
div.options-column
- a.save.icon.icon-floppy(href="", title="{{'COMMON.SAVE' | translate}}")
- a.cancel.icon.icon-delete(href="", title="{{'COMMON.CANCEL' | translate}}")
+ svg.save.icon.icon-save(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.cancel.icon.icon-close(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-close")
form
div.row.table-main.new-value.hidden
- div.color-column(tg-color-selection, ng-model="newValue")
+ div.color-column(
+ tg-color-selection
+ ng-model="newValue"
+ )
div.current-color(ng-style="{background: newValue.color}")
include ../../components/select-color
div.status-name
- input(name="name", type="text", placeholder="{{'ADMIN.STATUS.PLACEHOLDER_WRITE_STATUS_NAME' | translate}}",
- ng-model="newValue.name", data-required="true", data-maxlength="255")
+ input(
+ name="name"
+ type="text"
+ placeholder="{{'ADMIN.STATUS.PLACEHOLDER_WRITE_STATUS_NAME' | translate}}"
+ ng-model="newValue.name"
+ data-required="true"
+ data-maxlength="255"
+ )
div.is-closed-column
- select(name="is_closed", ng-model="newValue.is_closed", data-required="true",
- ng-options="e.id as e.name | translate for e in [{'id':true, 'name': 'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]")
+ select(
+ name="is_closed"
+ ng-model="newValue.is_closed"
+ data-required="true"
+ ng-options="e.id as e.name | translate for e in [{'id':true, 'name': 'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]"
+ )
div.options-column
- a.add-new.icon.icon-floppy(href="", title="{{'COMMON.ADD' | translate}}")
- a.delete-new.icon.icon-delete(href="", title="{{'COMMON.CANCEL' | translate}}")
+ svg.add-new.icon.icon-save(title="{{'COMMON.ADD' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.delete-new.icon.icon-close(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-close")
diff --git a/app/partials/includes/modules/admin/project-types.jade b/app/partials/includes/modules/admin/project-types.jade
index cd69b129..12a53bce 100644
--- a/app/partials/includes/modules/admin/project-types.jade
+++ b/app/partials/includes/modules/admin/project-types.jade
@@ -16,7 +16,8 @@ section.colors-table
div(ng-repeat="value in values", tg-bind-scope)
form(tg-bind-scope)
div.row.table-main.visualization
- span.icon.icon-drag-v
+ svg.icon.icon-drag
+ use(xlink:href="#icon-drag")
div.color-column
div.current-color(ng-style="{background: value.color}")
@@ -25,32 +26,56 @@ section.colors-table
span {{ value.name }}
div.options-column
- a.edit-value.icon.icon-edit(href="", title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}")
- a.delete-value.icon.icon-delete(href="", title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ svg.edit-value.icon.icon-edit(title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}")
+ use(xlink:href="#icon-edit")
+ svg.delete-value.icon.icon-trash(title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ use(xlink:href="#icon-trash")
div.row.table-main.edition.hidden
- div.color-column(tg-color-selection, ng-model="value")
+ div.color-column(
+ tg-color-selection
+ ng-model="value"
+ )
div.current-color(ng-style="{background: value.color}")
include ../../components/select-color
div.status-name
- input(name="name", type="text", placeholder="{{'ADMIN.TYPES.PLACEHOLDER_WRITE_NAME' | translate}}",
- ng-model="value.name", data-required="true", data-maxlength="255")
+ input(
+ name="name"
+ type="text"
+ placeholder="{{'ADMIN.TYPES.PLACEHOLDER_WRITE_NAME' | translate}}",
+ ng-model="value.name"
+ data-required="true"
+ data-maxlength="255"
+ )
div.options-column
- a.save.icon.icon-floppy(href="", title="{{'COMMON.SAVE' | translate}}")
- a.cancel.icon.icon-delete(href="", title="{{'COMMON.CANCEL' | translate}}")
+ svg.save.icon.icon-save(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.cancel.icon.icon-trash(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-trash")
form
div.row.table-main.new-value.hidden
- div.color-column(tg-color-selection, ng-model="newValue")
+ div.color-column(
+ tg-color-selection
+ ng-model="newValue"
+ )
div.current-color(ng-style="{background: newValue.color}")
include ../../components/select-color
div.status-name
- input(name="name", type="text", placeholder="{{'ADMIN.TYPES.PLACEHOLDER_WRITE_NAME' | translate}}",
- ng-model="newValue.name", data-required="true", data-maxlength="255")
+ input(
+ name="name"
+ type="text"
+ placeholder="{{'ADMIN.TYPES.PLACEHOLDER_WRITE_NAME' | translate}}",
+ ng-model="newValue.name"
+ data-required="true"
+ data-maxlength="255"
+ )
div.options-column
- a.add-new.icon.icon-floppy(href="", title="{{'COMMON.ADD' | translate}}")
- a.delete-new.icon.icon-delete(href="", title="{{'COMMON.CANCEL' | translate}}")
+ svg.add-new.icon.icon-save(title="{{'COMMON.ADD' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.delete-new.icon.icon-trash(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-trash")
diff --git a/app/partials/includes/modules/admin/project-us-status.jade b/app/partials/includes/modules/admin/project-us-status.jade
index cf583523..892990d8 100644
--- a/app/partials/includes/modules/admin/project-us-status.jade
+++ b/app/partials/includes/modules/admin/project-us-status.jade
@@ -21,7 +21,8 @@ section.project-us-status
div(ng-repeat="value in values", tg-bind-scope)
form(tg-bind-scope)
div.row.table-main.visualization
- span.icon.icon-drag-v
+ svg.icon.icon-drag
+ use(xlink:href="#icon-drag")
div.color-column
div.current-color(ng-style="{background: value.color}")
@@ -33,44 +34,69 @@ section.project-us-status
span {{ value.slug }}
div.is-closed-column
- div.icon.icon-check-square(ng-show="value.is_closed")
+ svg.icon.icon-check(ng-show="value.is_closed")
+ use(xlink:href="#icon-check")
div.is-archived-column
- div.icon.icon-check-square(ng-show="value.is_archived")
+ svg.icon.icon-check(ng-show="value.is_archived")
+ use(xlink:href="#icon-check")
div.status-wip-limit
span(ng-hide="value.is_archived") {{ value.wip_limit }}
div.options-column
- a.edit-value.icon.icon-edit(href="", title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}")
- a.delete-value.icon.icon-delete(href="", title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ svg.edit-value.icon.icon-edit(title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}")
+ use(xlink:href="#icon-edit")
+ svg.delete-value.icon.icon-trash(title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}")
+ use(xlink:href="#icon-trash")
div.row.table-main.edition.hidden
- div.color-column(tg-color-selection, ng-model="value")
- div.current-color(ng-style="{background: value.color}")
+ .color-column(tg-color-selection, ng-model="value")
+ .current-color(ng-style="{background: value.color}")
include ../../components/select-color
- div.status-name
- input(name="name", type="text", placeholder="{{'ADMIN.US_STATUS.PLACEHOLDER_WRITE_NAME' | translate}}",
- ng-model="value.name", data-required="true", data-maxlength="255")
+ .status-name
+ input(
+ name="name"
+ type="text"
+ placeholder="{{'ADMIN.US_STATUS.PLACEHOLDER_WRITE_NAME' | translate}}",
+ ng-model="value.name"
+ data-required="true"
+ data-maxlength="255"
+ )
- div.is-closed-column
- select(name="is_closed", ng-model="value.is_closed", data-required="true",
- ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]")
+ .is-closed-column
+ select(
+ name="is_closed"
+ ng-model="value.is_closed"
+ data-required="true"
+ ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]"
+ )
- div.is-archived-column
- select(name="is_archived", ng-model="value.is_archived", data-required="true",
- ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]")
+ .is-archived-column
+ select(
+ name="is_archived"
+ ng-model="value.is_archived"
+ data-required="true"
+ ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]"
+ )
- div.status-wip-limit
- input(name="wip_limit", type="number", ng-hide="value.is_archived",
- ng-model="value.wip_limit", data-type="digits",
- placeholder="{{'ADMIN.US_STATUS.WIP_LIMIT_COLUMN' | translate}}")
+ .status-wip-limit
+ input(
+ name="wip_limit"
+ type="number"
+ ng-hide="value.is_archived"
+ ng-model="value.wip_limit"
+ data-type="digits"
+ placeholder="{{'ADMIN.US_STATUS.WIP_LIMIT_COLUMN' | translate}}"
+ )
- div.options-column
- a.save.icon.icon-floppy(href="", title="{{'COMMON.SAVE' | translate}}")
- a.cancel.icon.icon-delete(href="", title="{{'COMMON.CANCEL' | translate}}")
+ .options-column
+ svg.save.icon.icon-save(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.cancel.icon.icon-close(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-close")
form
div.row.table-main.new-value.hidden
@@ -79,23 +105,43 @@ section.project-us-status
include ../../components/select-color
div.status-name
- input(name="name", type="text",
- ng-model="newValue.name", data-required="true", data-maxlength="255",
- placeholder="{{'ADMIN.US_STATUS.PLACEHOLDER_WRITE_NAME' | translate}}")
+ input(
+ name="name"
+ type="text"
+ ng-model="newValue.name"
+ data-required="true"
+ data-maxlength="255"
+ placeholder="{{'ADMIN.US_STATUS.PLACEHOLDER_WRITE_NAME' | translate}}"
+ )
div.is-closed-column
- select(name="is_closed", ng-model="newValue.is_closed", data-required="true",
- ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]")
+ select(
+ name="is_closed"
+ ng-model="newValue.is_closed"
+ data-required="true"
+ ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]"
+ )
div.is-archived-column
- select(name="is_archived", ng-model="newValue.is_archived", data-required="true",
- ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]")
+ select(
+ name="is_archived"
+ ng-model="newValue.is_archived"
+ data-required="true"
+ ng-options="e.id as e.name | translate for e in [{'id':true, 'name':'COMMON.YES'},{'id':false, 'name': 'COMMON.NO'}]"
+ )
div.status-wip-limit
- input(name="wip_limit", type="number", ng-hide="newValue.is_archived",
- ng-model="newValue.wip_limit", data-type="digits",
- placeholder="{{'ADMIN.US_STATUS.WIP_LIMIT_COLUMN' | translate}}")
+ input(
+ name="wip_limit"
+ type="number"
+ ng-hide="newValue.is_archived"
+ ng-model="newValue.wip_limit"
+ data-type="digits"
+ placeholder="{{'ADMIN.US_STATUS.WIP_LIMIT_COLUMN' | translate}}"
+ )
div.options-column
- a.add-new.icon.icon-floppy(href="", title="{{'COMMON.ADD' | translate}}")
- a.delete-new.icon.icon-delete(href="", title="{{'COMMON.CANCEL' | translate}}")
+ svg.add-new.icon.icon-save(title="{{'COMMON.ADD' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.delete-new.icon.icon-trash(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-trash")
diff --git a/app/partials/includes/modules/backlog-filters.jade b/app/partials/includes/modules/backlog-filters.jade
index 056f65a0..01b04ad7 100644
--- a/app/partials/includes/modules/backlog-filters.jade
+++ b/app/partials/includes/modules/backlog-filters.jade
@@ -6,13 +6,19 @@ section.filters
form
fieldset
input(type="text", placeholder="{{'COMMON.FILTERS.INPUT_PLACEHOLDER' | translate}}", ng-model="filtersQ")
- a.icon.icon-search(href="", title="{{'COMMON.FILTERS.TITLE_ACTION_FILTER_BUTTON' | translate}}")
+ svg.icon.icon-search(href="", title="{{'COMMON.FILTERS.TITLE_ACTION_FILTER_BUTTON' | translate}}")
+ use(xlink:href="#icon-search")
div.filters-step-cat
div.filters-applied
h2.hidden.breadcrumb
- a.back(href="", title="{{'COMMON.FILTERS.BREADCRUMB_TITLE' | translate}}", translate="BACKLOG.FILTERS.TITLE")
- span.icon-arrow-right
+ a.back(
+ href=""
+ title="{{'COMMON.FILTERS.BREADCRUMB_TITLE' | translate}}"
+ translate="BACKLOG.FILTERS.TITLE"
+ )
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
a.subfilter(href="")
span.title(translate="COMMON.FILTERS.BREADCRUMB_STATUS")
div.filters-cats
@@ -20,10 +26,12 @@ section.filters
li
a(href="", title="{{'BACKLOG.FILTERS.FILTER_CATEGORY_STATUS' | translate}}", data-type="status")
span.title(translate="BACKLOG.FILTERS.FILTER_CATEGORY_STATUS")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li
a(href="", title="{{'BACKLOG.FILTERS.FILTER_CATEGORY_TAGS' | translate}}", data-type="tags")
span.title(translate="BACKLOG.FILTERS.FILTER_CATEGORY_TAGS")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
div.filter-list.hidden
diff --git a/app/partials/includes/modules/backlog-table.jade b/app/partials/includes/modules/backlog-table.jade
index 9c3eab4c..b666dbe2 100644
--- a/app/partials/includes/modules/backlog-table.jade
+++ b/app/partials/includes/modules/backlog-table.jade
@@ -6,7 +6,8 @@ div.backlog-table-header
div.status(translate="COMMON.FIELDS.STATUS")
div.points(tg-us-role-points-selector, title="{{'BACKLOG.TABLE.TITLE_COLUMN_POINTS' | translate}}")
span.header-points(translate="COMMON.FIELDS.POINTS")
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
div.backlog-table-body(tg-backlog-sortable, ng-class="{'show-tags': ctrl.showTags, 'active-filters': ctrl.activeFilters}" )
include ../components/backlog-row
diff --git a/app/partials/includes/modules/colors-table.jade b/app/partials/includes/modules/colors-table.jade
deleted file mode 100644
index b989422c..00000000
--- a/app/partials/includes/modules/colors-table.jade
+++ /dev/null
@@ -1,21 +0,0 @@
-section.colors-table
- div.table-header
- div.row
- div.color-column(translate="COMMON.FIELDS.COLOR")
- div.status-name(translate="COMMON.FIELDS.NAME")
- div.is-closed-column(translate="COMMON.IS_CLOSED")
- div.options-column
-
- div.table-main
- div.row.row-edit
- div.color-column
- div.current-color
- include ../components/select-color
-
- div.status-name
- input(type="text")
- div.is-closed-column
- input(type="checkbox")
- div.options-column
- a.icon.icon-floppy(href="#")
- a.icon.icon-delete(href="#")
diff --git a/app/partials/includes/modules/comment-activity.jade b/app/partials/includes/modules/comment-activity.jade
deleted file mode 100644
index 86eb047d..00000000
--- a/app/partials/includes/modules/comment-activity.jade
+++ /dev/null
@@ -1,17 +0,0 @@
-div.us-activity
- a.activity-title(ng-show="ctrl.countChanges(comment)", href="", title="{{'ACTIVITY.SHOW_ACTIVITY' | translate}}")
- span(tg-bo-bind="ctrl.buildChangesText(comment)")
- span.icon.icon-arrow-up
-
- div.activity-inner(ng-repeat="(key, change) in comment.values_diff")
- div.activity-changed
- span(tg-bo-bind="key")
- div.activity-fromto
- p
- strong(translate="COMMON.FROM")
- br
- span(tg-bo-bind="ctrl.getChangeText(change[0])")
- p
- strong(translate="COMMON.TO")
- br
- span(tg-bo-bind="ctrl.getChangeText(change[1])")
diff --git a/app/partials/includes/modules/issues-filters.jade b/app/partials/includes/modules/issues-filters.jade
index ab735773..b879fd56 100644
--- a/app/partials/includes/modules/issues-filters.jade
+++ b/app/partials/includes/modules/issues-filters.jade
@@ -6,13 +6,15 @@ section.filters
fieldset
input(type="text", placeholder="{{'ISSUES.FILTERS.INPUT_SEARCH_PLACEHOLDER' | translate}}",
ng-model="filtersQ")
- a.icon.icon-search(href="", title="{{'ISSUES.FILTERS.TITLE_ACTION_SEARCH' | translate}}")
+ svg.icon.icon-search(title="{{'ISSUES.FILTERS.TITLE_ACTION_SEARCH' | translate}}")
+ use(xlink:href="#icon-search")
div.filters-step-cat
div.filters-applied
a.hide.button.button-gray.save-filters(href="", title="{{'COMMON.SAVE' | translate}}", ng-class="{hide: filters.length}", translate="ISSUES.FILTERS.ACTION_SAVE_CUSTOM_FILTER")
h2.hidden.breadcrumb
a.back(href="", title="{{'ISSUES.FILTERS.TITLE_BREADCRUMB' | translate}}", translate="ISSUES.FILTERS.BREADCRUMB")
- span.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
a.subfilter(href="", title="cat-name")
span.title(translate="COMMON.FILTERS.BREADCRUMB_STATUS")
div.filters-cats
@@ -20,35 +22,43 @@ section.filters
li
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.TYPE' | translate}}", data-type="types")
span.title(translate="ISSUES.FILTERS.CATEGORIES.TYPE")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.STATUS' | translate}}", data-type="status")
span.title(translate="ISSUES.FILTERS.CATEGORIES.STATUS")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.SEVERITY' | translate}}", data-type="severities")
span.title(translate="ISSUES.FILTERS.CATEGORIES.SEVERITY")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.PRIORITIES' | translate}}", data-type="priorities")
span.title(translate="ISSUES.FILTERS.CATEGORIES.PRIORITIES")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.TAGS' | translate}}", data-type="tags")
span.title(translate="ISSUES.FILTERS.CATEGORIES.TAGS")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.ASSIGNED_TO' | translate}}", data-type="assignedTo")
span.title(translate="ISSUES.FILTERS.CATEGORIES.ASSIGNED_TO")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.CREATED_BY' | translate}}", data-type="createdBy")
span.title(translate="ISSUES.FILTERS.CATEGORIES.CREATED_BY")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li.custom-filters(ng-if="filters.myFilters.length")
a(href="", title="{{ 'ISSUES.FILTERS.CATEGORIES.CUSTOM_FILTERS' | translate}}",
data-type="myFilters")
span.title(translate="ISSUES.FILTERS.CATEGORIES.CUSTOM_FILTERS")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
div.filter-list.hidden
diff --git a/app/partials/includes/modules/issues-options.jade b/app/partials/includes/modules/issues-options.jade
index 4cbce556..2a9692eb 100644
--- a/app/partials/includes/modules/issues-options.jade
+++ b/app/partials/includes/modules/issues-options.jade
@@ -3,4 +3,5 @@ section.issues-options(tg-check-permission="add_issue")
a.button-green(href="", ng-click="ctrl.addNewIssue()")
span.text(translate="ISSUES.ACTION_NEW_ISSUE")
a.button-bulk(href="", ng-click="ctrl.addIssuesInBulk()")
- span.icon.icon-bulk
+ svg.icon.icon-bulk
+ use(xlink:href="#icon-bulk")
diff --git a/app/partials/includes/modules/issues-table.jade b/app/partials/includes/modules/issues-table.jade
index ddf6ada0..e23a3025 100644
--- a/app/partials/includes/modules/issues-table.jade
+++ b/app/partials/includes/modules/issues-table.jade
@@ -20,7 +20,8 @@ section.issues-table.basic-table(ng-class="{empty: !issues.length}")
ng-class="{'inactive': !issue.total_voters, 'is-voted': issue.is_voter}"
title="{{ 'COMMON.VOTE_BUTTON.COUNTER_TITLE'|translate:{total:issue.total_voters||0}:'messageformat' }}"
)
- span.icon.icon-caret-up
+ svg.icon.icon-upvote
+ use(xlink:href="#icon-upvote")
span {{ ::issue.total_voters }}
div.subject
a(
@@ -42,14 +43,16 @@ section.issues-table.basic-table(ng-class="{empty: !issues.length}")
title="{{'ISSUES.TABLE.TITLE_ACTION_CHANGE_STATUS' | translate}}"
)
span.issue-status-bind
- span.icon.icon-arrow-bottom(tg-check-permission="modify_issue")
+ svg.icon.icon-arrow-down(tg-check-permission="modify_issue")
+ use(xlink:href="#icon-arrow-down")
div.created-field(tg-bo-bind="issue.created_date|momentFormat:'DD MMM YYYY HH:mm'")
div.assigned-field(tg-issue-assigned-to-inline-edition="issue")
div.issue-assignedto(title="{{'ISSUES.TABLE.TITLE_ACTION_ASSIGNED_TO' | translate}}")
figure.avatar
- span.icon.icon-arrow-bottom(tg-check-permission="modify_issue")
+ svg.icon.icon-arrow-down(tg-check-permission="modify_issue")
+ use(xlink:href="#icon-arrow-down")
section.empty-issues(ng-if="issues != undefined && issues.length == 0")
img(
diff --git a/app/partials/includes/modules/kanban-table.jade b/app/partials/includes/modules/kanban-table.jade
index 5770b403..502fef51 100644
--- a/app/partials/includes/modules/kanban-table.jade
+++ b/app/partials/includes/modules/kanban-table.jade
@@ -7,37 +7,67 @@ div.kanban-table(tg-kanban-squish-column)
tg-class-permission="{'readonly': '!modify_task'}")
span(tg-bo-bind="s.name")
div.options
- a.icon.icon-vfold.hfold(href="", ng-click='foldStatus(s)',
- title="{{'KANBAN.TITLE_ACTION_FOLD' | translate}}",
- ng-class='{hidden:folds[s.id]}')
- a.icon.icon-vunfold.hunfold(href="", ng-click='foldStatus(s)',
- title="{{'KANBAN.TITLE_ACTION_UNFOLD' | translate}}",
- ng-class='{hidden:!folds[s.id]}')
+ a.option(
+ href=""
+ ng-click='foldStatus(s)'
+ title="{{'KANBAN.TITLE_ACTION_FOLD' | translate}}"
+ ng-class='{hidden:folds[s.id]}'
+ )
+ svg.icon.icon-fold-column
+ use(xlink:href="#icon-fold-column")
+ a.option.hunfold(
+ href=""
+ ng-click='foldStatus(s)'
+ title="{{'KANBAN.TITLE_ACTION_UNFOLD' | translate}}"
+ ng-class='{hidden:!folds[s.id]}'
+ )
+ svg.icon.icon-unfold-column
+ use(xlink:href="#icon-unfold-column")
+ a.option(
+ href=""
+ title="{{'KANBAN.TITLE_ACTION_FOLD_CARDS' | translate}}"
+ ng-class="{hidden:statusViewModes[s.id] == 'minimized'}"
+ ng-click="ctrl.updateStatusViewMode(s.id, 'minimized')"
+ )
+ svg.icon.icon-fold-row
+ use(xlink:href="#icon-fold-row")
+ a.option(
+ href=""
+ title="{{'KANBAN.TITLE_ACTION_UNFOLD_CARDS' | translate}}"
+ ng-class="{hidden:statusViewModes[s.id] == 'maximized'}"
+ ng-click="ctrl.updateStatusViewMode(s.id, 'maximized')"
+ )
+ svg.icon.icon-unfold-row
+ use(xlink:href="#icon-unfold-row")
- a.icon.icon-vfold(href="", title="{{'KANBAN.TITLE_ACTION_FOLD_CARDS' | translate}}",
- ng-class="{hidden:statusViewModes[s.id] == 'minimized'}",
- ng-click="ctrl.updateStatusViewMode(s.id, 'minimized')")
- a.icon.icon-vunfold(href="", title="{{'KANBAN.TITLE_ACTION_UNFOLD_CARDS' | translate}}",
- ng-class="{hidden:statusViewModes[s.id] == 'maximized'}",
- ng-click="ctrl.updateStatusViewMode(s.id, 'maximized')")
+ a.option(
+ href=""
+ title="{{'KANBAN.TITLE_ACTION_ADD_US' | translate}}"
+ ng-click="ctrl.addNewUs('standard', s.id)"
+ tg-check-permission="add_us"
+ ng-hide="s.is_archived"
+ )
+ svg.icon.icon-add
+ use(xlink:href="#icon-add")
- a.icon.icon-plus(href="", title="{{'KANBAN.TITLE_ACTION_ADD_US' | translate}}",
- ng-click="ctrl.addNewUs('standard', s.id)",
- tg-check-permission="add_us",
- ng-hide="s.is_archived")
+ a.option(
+ href=""
+ title="{{'KANBAN.TITLE_ACTION_ADD_BULK' | translate}}"
+ ng-click="ctrl.addNewUs('bulk', s.id)"
+ tg-check-permission="add_us"
+ ng-hide="s.is_archived"
+ )
+ svg.icon.icon-bulk
+ use(xlink:href="#icon-bulk")
- a.icon.icon-bulk(href="", title="{{'KANBAN.TITLE_ACTION_ADD_BULK' | translate}}",
- ng-click="ctrl.addNewUs('bulk', s.id)",
- tg-check-permission="add_us",
- ng-hide="s.is_archived")
-
- a(
+ a.option(
href=""
ng-attr-title="{{title}}"
ng-class="class"
ng-if="s.is_archived"
tg-kanban-archived-status-header="s")
- include ../../../svg/eye.svg
+ svg.icon.icon-watch
+ use(xlink:href="#icon-watch")
div.kanban-table-body
div.kanban-table-inner
diff --git a/app/partials/includes/modules/lightbox-add-member.jade b/app/partials/includes/modules/lightbox-add-member.jade
index 624af87f..31aa886b 100644
--- a/app/partials/includes/modules/lightbox-add-member.jade
+++ b/app/partials/includes/modules/lightbox-add-member.jade
@@ -1,5 +1,6 @@
a.close(href="", title="close")
- span.icon.icon-delete
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.ADD_MEMBER.TITLE")
diff --git a/app/partials/includes/modules/lightbox-ask-choice.jade b/app/partials/includes/modules/lightbox-ask-choice.jade
index cc7336a0..c1f5a0fb 100644
--- a/app/partials/includes/modules/lightbox-ask-choice.jade
+++ b/app/partials/includes/modules/lightbox-ask-choice.jade
@@ -1,5 +1,6 @@
a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title
p.question
@@ -8,7 +9,7 @@ form
select.choices
p.warning
- div.options
+ .options
a.button-green(href="", title="{{'COMMON.ACCEPT' | translate}}")
span(translate="COMMON.ACCEPT")
a.button-red(href="", title="{{'COMMON.CANCEL' | translate}}")
diff --git a/app/partials/includes/modules/lightbox-create-issue.jade b/app/partials/includes/modules/lightbox-create-issue.jade
index bfcd53dd..829d660f 100644
--- a/app/partials/includes/modules/lightbox-create-issue.jade
+++ b/app/partials/includes/modules/lightbox-create-issue.jade
@@ -1,19 +1,42 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.CREATE_ISSUE.TITLE")
fieldset
- input(type="text", ng-model="issue.subject", ng-attr-placeholder="{{'COMMON.FIELDS.SUBJECT' | translate}}", ng-model-options="{ debounce: 200 }", data-required="true", data-maxlength="500")
- div.fieldset-row
+ input(
+ type="text"
+ ng-model="issue.subject"
+ ng-attr-placeholder="{{'COMMON.FIELDS.SUBJECT' | translate}}"
+ ng-model-options="{ debounce: 200 }"
+ data-required="true"
+ data-maxlength="500"
+ )
+ .fieldset-row
fieldset
- select.type(ng-model="issue.type", ng-options="t.id as t.name for t in issueTypes")
+ select.type(
+ ng-model="issue.type"
+ ng-options="t.id as t.name for t in issueTypes"
+ )
fieldset
- select.priority(ng-model="issue.priority", ng-options="p.id as p.name for p in priorityList")
+ select.priority(
+ ng-model="issue.priority"
+ ng-options="p.id as p.name for p in priorityList"
+ )
fieldset
- select.severity(ng-model="issue.severity", ng-options="s.id as s.name for s in severityList")
+ select.severity(
+ ng-model="issue.severity"
+ ng-options="s.id as s.name for s in severityList"
+ )
fieldset
- div.tags-block(tg-lb-tag-line, ng-model="issue.tags")
+ .tags-block(
+ tg-lb-tag-line
+ ng-model="issue.tags"
+ )
fieldset
section
@@ -24,7 +47,14 @@ form
)
fieldset
- textarea.description(ng-attr-placeholder="{{'COMMON.FIELDS.DESCRIPTION' | translate}}", ng-model="issue.description")
+ textarea.description(
+ ng-attr-placeholder="{{'COMMON.FIELDS.DESCRIPTION' | translate}}"
+ ng-model="issue.description"
+ )
// include lightbox-attachments
- button.button-green.submit-button(type="submit", title="{{'COMMON.CREATE' | translate}}", translate="COMMON.CREATE")
+ button.button-green.submit-button(
+ type="submit"
+ title="{{'COMMON.CREATE' | translate}}"
+ translate="COMMON.CREATE"
+ )
diff --git a/app/partials/includes/modules/lightbox-delete-project.jade b/app/partials/includes/modules/lightbox-delete-project.jade
index 0ae8f2ad..c360d23d 100644
--- a/app/partials/includes/modules/lightbox-delete-project.jade
+++ b/app/partials/includes/modules/lightbox-delete-project.jade
@@ -1,11 +1,12 @@
a.close(href="", title="{{'close' | translate}}")
- span.icon.icon-delete
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.DELETE_PROJECT.TITLE")
p
span.question(translate="LIGHTBOX.DELETE_PROJECT.QUESTION")
span.subtitle(translate="LIGHTBOX.DELETE_PROJECT.SUBTITLE")
- div.options
+ .options
a.button-green(href="", title="{{'LIGHTBOX.DELETE_PROJECT.CONFIRM' | translate}}")
span(translate="LIGHTBOX.DELETE_PROJECT.CONFIRM")
a.button-red(href="", title="{{'COMMON.CANCEL' | translate}}")
diff --git a/app/partials/includes/modules/lightbox-generic-ask.jade b/app/partials/includes/modules/lightbox-generic-ask.jade
index c51ba250..6ddcaf0a 100644
--- a/app/partials/includes/modules/lightbox-generic-ask.jade
+++ b/app/partials/includes/modules/lightbox-generic-ask.jade
@@ -1,12 +1,16 @@
a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title
p
span.subtitle
span.message
div.options
- a.button-green(href="", title="{{'COMMON.ACCEPT' | translate}}")
+ a.button-green(
+ href=""
+ title="{{'COMMON.ACCEPT' | translate}}"
+ )
span(translate="COMMON.ACCEPT")
a.button-red(href="", title="{{'COMMON.CANCEL' | translate}}")
span(translate="COMMON.CANCEL")
diff --git a/app/partials/includes/modules/lightbox-generic-error.jade b/app/partials/includes/modules/lightbox-generic-error.jade
index ca06f309..343dbaa6 100644
--- a/app/partials/includes/modules/lightbox-generic-error.jade
+++ b/app/partials/includes/modules/lightbox-generic-error.jade
@@ -1,7 +1,14 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
section
h2.title
- div.options
- a.button-green(href="", title="{{'COMMON.ACCEPT' | translate}}")
+ .options
+ a.button-green(
+ href=""
+ title="{{'COMMON.ACCEPT' | translate}}"
+ )
span(translate="COMMON.ACCEPT")
diff --git a/app/partials/includes/modules/lightbox-generic-success.jade b/app/partials/includes/modules/lightbox-generic-success.jade
index 35828685..02bf8c0a 100644
--- a/app/partials/includes/modules/lightbox-generic-success.jade
+++ b/app/partials/includes/modules/lightbox-generic-success.jade
@@ -1,8 +1,15 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
section
h2.title
p.message
- div.options
- a.button-green(href="", title="{{'COMMON.ACCEPT' | translate}}")
+ .options
+ a.button-green(
+ href=""
+ title="{{'COMMON.ACCEPT' | translate}}"
+ )
span(translate="COMMON.ACCEPT")
diff --git a/app/partials/includes/modules/lightbox-issue-bulk.jade b/app/partials/includes/modules/lightbox-issue-bulk.jade
index 917fb5ee..b418e7d5 100644
--- a/app/partials/includes/modules/lightbox-issue-bulk.jade
+++ b/app/partials/includes/modules/lightbox-issue-bulk.jade
@@ -1,5 +1,9 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="COMMON.NEW_BULK")
fieldset
@@ -10,6 +14,7 @@ form
data-required="true"
data-linewidth="200"
ng-attr-placeholder="{{'COMMON.ONE_ITEM_LINE' | translate}}"
+
)
button.button-green.submit-button(
diff --git a/app/partials/includes/modules/lightbox-sprint-add-edit.jade b/app/partials/includes/modules/lightbox-sprint-add-edit.jade
index d44ad710..148084eb 100644
--- a/app/partials/includes/modules/lightbox-sprint-add-edit.jade
+++ b/app/partials/includes/modules/lightbox-sprint-add-edit.jade
@@ -1,30 +1,57 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.ADD_EDIT_SPRINT.TITLE")
fieldset
- input.sprint-name(type="text", name="name", ng-model="sprint.name",
- ng-model-options="{ debounce: 200 }",
- data-required="true", data-maxlength="500",
- placeholder="{{'LIGHTBOX.ADD_EDIT_SPRINT.PLACEHOLDER_SPRINT_NAME' | translate}}")
+ input.sprint-name(
+ type="text"
+ name="name"
+ ng-model="sprint.name"
+ ng-model-options="{ debounce: 200 }"
+ data-required="true"
+ data-maxlength="500"
+ placeholder="{{'LIGHTBOX.ADD_EDIT_SPRINT.PLACEHOLDER_SPRINT_NAME' | translate}}"
+ )
label.last-sprint-name
fieldset.dates
div
- input.date-start(type="text", name="estimated_start",
- ng-model="sprint.estimated_start", data-required="true", tg-date-selector,
- placeholder="{{'LIGHTBOX.ADD_EDIT_SPRINT.PLACEHOLDER_SPRINT_START' | translate}}")
+ input.date-start(
+ type="text"
+ name="estimated_start"
+ ng-model="sprint.estimated_start"
+ data-required="true"
+ tg-date-selector
+ placeholder="{{'LIGHTBOX.ADD_EDIT_SPRINT.PLACEHOLDER_SPRINT_START' | translate}}"
+ )
div
- input.date-end(type="text", name="estimated_finish",
- ng-model="sprint.estimated_finish", data-required="true", tg-date-selector,
- placeholder="{{'LIGHTBOX.ADD_EDIT_SPRINT.PLACEHOLDER_SPRINT_END' | translate}}")
+ input.date-end(
+ type="text"
+ name="estimated_finish"
+ ng-model="sprint.estimated_finish"
+ data-required="true"
+ tg-date-selector
+ placeholder="{{'LIGHTBOX.ADD_EDIT_SPRINT.PLACEHOLDER_SPRINT_END' | translate}}"
+ )
- button.button-green.submit-button(type="submit", title="{{'COMMON.CREATE' | translate}}",
- translate="COMMON.CREATE")
+ button.button-green.submit-button(
+ type="submit"
+ title="{{'COMMON.CREATE' | translate}}"
+ translate="COMMON.CREATE"
+ )
- div(tg-check-permission="delete_milestone")
- span.delete-sprint.hidden(translate)
- span(translate="LIGHTBOX.ADD_EDIT_SPRINT.ACTION_DELETE_SPRINT")
- a.icon.icon-delete(href="",
- title="{{'LIGHTBOX.ADD_EDIT_SPRINT.TITLE_ACTION_DELETE_SPRINT' | translate}}")
+ a.delete-sprint(
+ tg-check-permission="delete_milestone"
+ href=""
+ title="{{'LIGHTBOX.ADD_EDIT_SPRINT.TITLE_ACTION_DELETE_SPRINT' | translate}}"
+ )
+ span {{'LIGHTBOX.ADD_EDIT_SPRINT.ACTION_DELETE_SPRINT' | translate }}
+ svg.icon.icon-trash(
+ href=""
+ )
+ use(xlink:href="#icon-trash")
diff --git a/app/partials/includes/modules/lightbox-task-bulk.jade b/app/partials/includes/modules/lightbox-task-bulk.jade
index 5a1d4b1a..7fac9d2e 100644
--- a/app/partials/includes/modules/lightbox-task-bulk.jade
+++ b/app/partials/includes/modules/lightbox-task-bulk.jade
@@ -1,5 +1,9 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="COMMON.NEW_BULK")
fieldset
@@ -10,6 +14,7 @@ form
data-required="true"
data-linewidth="200"
ng-attr-placeholder="{{'COMMON.ONE_ITEM_LINE' | translate}}"
+
)
button.button-green.submit-button(
diff --git a/app/partials/includes/modules/lightbox-task-create-edit.jade b/app/partials/includes/modules/lightbox-task-create-edit.jade
index a878e7ad..68fef13c 100644
--- a/app/partials/includes/modules/lightbox-task-create-edit.jade
+++ b/app/partials/includes/modules/lightbox-task-create-edit.jade
@@ -1,22 +1,44 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.CREATE_EDIT_TASK.TITLE")
fieldset
- input(type="text", ng-model="task.subject", ng-attr-placeholder="{{'LIGHTBOX.CREATE_EDIT_TASK.PLACEHOLDER_SUBJECT' | translate}}", ng-model-options="{ debounce: 200 }",
- data-required="true", data-maxlength="500")
+ input(
+ type="text"
+ ng-model="task.subject"
+ ng-attr-placeholder="{{'LIGHTBOX.CREATE_EDIT_TASK.PLACEHOLDER_SUBJECT' | translate}}"
+ ng-model-options="{ debounce: 200 }"
+ data-required="true"
+ data-maxlength="500"
+ )
fieldset
- select(ng-model="task.status", ng-options="s.id as s.name for s in taskStatusList",
- placeholder="{{'LIGHTBOX.CREATE_EDIT_TASK.PLACEHOLDER_STATUS' | translate}}")
+ select(
+ ng-model="task.status"
+ ng-options="s.id as s.name for s in taskStatusList"
+ placeholder="{{'LIGHTBOX.CREATE_EDIT_TASK.PLACEHOLDER_STATUS' | translate}}"
+ )
fieldset
- select(ng-model="task.assigned_to", ng-options="s.id as s.full_name_display for s in users",
- placeholder="{{'Assigned to'}}")
- option(value="", translate="LIGHTBOX.CREATE_EDIT_TASK.OPTION_UNASSIGNED")
+ select(
+ ng-model="task.assigned_to"
+ ng-options="s.id as s.full_name_display for s in users"
+ placeholder="{{'Assigned to'}}"
+ )
+ option(
+ value=""
+ translate="LIGHTBOX.CREATE_EDIT_TASK.OPTION_UNASSIGNED"
+ )
fieldset
- div.tags-block(tg-lb-tag-line, ng-model="task.tags")
+ div.tags-block(
+ tg-lb-tag-line
+ ng-model="task.tags"
+ )
fieldset
section
@@ -27,19 +49,46 @@ form
)
fieldset
- textarea.description(ng-attr-placeholder="{{'LIGHTBOX.CREATE_EDIT_TASK.PLACEHOLDER_SHORT_DESCRIPTION' | translate}}", ng-model="task.description", ng-model-options="{ debounce: 200 }")
+ textarea.description(
+ ng-attr-placeholder="{{'LIGHTBOX.CREATE_EDIT_TASK.PLACEHOLDER_SHORT_DESCRIPTION' | translate}}"
+ ng-model="task.description"
+ ng-model-options="{ debounce: 200 }"
+ )
div.settings
fieldset.iocaine-flag(title="{{'COMMON.IOCAINE_TEXT' | translate}}")
- input(type="checkbox", ng-model="task.is_iocaine", name="iocaine-task", id="iocaine-task", ng-value="true")
+ input(
+ type="checkbox"
+ ng-model="task.is_iocaine"
+ name="iocaine-task"
+ id="iocaine-task"
+ ng-value="true"
+ )
label.iocaine.trans-button(for="iocaine-task")
- span.icon.icon-iocaine(for="iocaine-task icon-iocaine")
+ svg.icon.icon-iocaine(for="iocaine-task icon-iocaine")
+ use(xlink:href="#icon-iocaine")
span Iocaine
fieldset.blocking-flag
- input(type="checkbox", ng-model="task.is_blocked", name="blocked-task", id="blocked-task", ng-value="true")
- label.blocked.trans-button(for="blocked-task", translate="COMMON.BLOCKED")
+ input(
+ type="checkbox"
+ ng-model="task.is_blocked"
+ name="blocked-task"
+ id="blocked-task"
+ ng-value="true"
+ )
+ label.blocked.trans-button(
+ for="blocked-task"
+ translate="COMMON.BLOCKED"
+ )
- tg-blocking-message-input(watch="task.is_blocked", ng-model="task.blocked_note")
+ tg-blocking-message-input(
+ watch="task.is_blocked"
+ ng-model="task.blocked_note"
+ )
- button.button-green.submit-button(type="submit", title="{{'COMMON.CREATE' | translate}}", translate="COMMON.CREATE")
+ button.button-green.submit-button(
+ type="submit"
+ title="{{'COMMON.CREATE' | translate}}"
+ translate="COMMON.CREATE"
+ )
diff --git a/app/partials/includes/modules/lightbox-us-bulk.jade b/app/partials/includes/modules/lightbox-us-bulk.jade
index 4da92990..b522a0ed 100644
--- a/app/partials/includes/modules/lightbox-us-bulk.jade
+++ b/app/partials/includes/modules/lightbox-us-bulk.jade
@@ -1,5 +1,9 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="COMMON.NEW_BULK")
fieldset
diff --git a/app/partials/includes/modules/lightbox-us-create-edit.jade b/app/partials/includes/modules/lightbox-us-create-edit.jade
index bb3d5045..c03c8010 100644
--- a/app/partials/includes/modules/lightbox-us-create-edit.jade
+++ b/app/partials/includes/modules/lightbox-us-create-edit.jade
@@ -1,23 +1,45 @@
-a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+a.close(
+ href=""
+ title="{{'COMMON.CLOSE' | translate}}"
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.CREATE_EDIT_US.TITLE")
fieldset
- input(type="text", name="subject", ng-model-options="{ debounce: 200 }", ng-model="us.subject", placeholder="{{'COMMON.FIELDS.SUBJECT' | translate}}",
- data-required="true", data-maxlength="500")
+ input(
+ type="text"
+ name="subject"
+ ng-model-options="{ debounce: 200 }"
+ ng-model="us.subject"
+ placeholder="{{'COMMON.FIELDS.SUBJECT' | translate}}"
+ data-required="true"
+ data-maxlength="500"
+ )
fieldset.ticket-estimation
tg-lb-us-estimation(ng-model="us")
fieldset
- select(name="status", ng-model="us.status", ng-options="s.id as s.name for s in usStatusList")
+ select(
+ name="status"
+ ng-model="us.status"
+ ng-options="s.id as s.name for s in usStatusList"
+ )
fieldset
- div.tags-block(tg-lb-tag-line, ng-model="us.tags")
+ div.tags-block(
+ tg-lb-tag-line
+ ng-model="us.tags"
+ )
fieldset
- textarea.description(name="description", ng-model="us.description", ng-model-options="{ debounce: 200 }",
- ng-attr-placeholder="{{'LIGHTBOX.CREATE_EDIT_US.PLACEHOLDER_DESCRIPTION' | translate}}")
+ textarea.description(
+ name="description"
+ ng-model="us.description"
+ ng-model-options="{ debounce: 200 }"
+ ng-attr-placeholder="{{'LIGHTBOX.CREATE_EDIT_US.PLACEHOLDER_DESCRIPTION' | translate}}"
+ )
fieldset
section
tg-attachments-simple(
@@ -28,19 +50,51 @@ form
div.settings
fieldset.team-requirement
- input(type="checkbox", name="team_requirement", ng-model="us.team_requirement",
- id="team-requirement", ng-value="true")
- label.requirement.trans-button(for="team-requirement", translate="US.FIELDS.TEAM_REQUIREMENT")
+ input(
+ type="checkbox"
+ name="team_requirement"
+ ng-model="us.team_requirement"
+ id="team-requirement"
+ ng-value="true"
+ )
+ label.requirement.trans-button(
+ for="team-requirement"
+ translate="US.FIELDS.TEAM_REQUIREMENT"
+ )
fieldset.client-requirement
- input(type="checkbox", name="client_requirement", ng-model="us.client_requirement",
- id="client-requirement", ng-value="true")
- label.requirement.trans-button(for="client-requirement", translate="US.FIELDS.CLIENT_REQUIREMENT")
+ input(
+ type="checkbox"
+ name="client_requirement"
+ ng-model="us.client_requirement",
+ id="client-requirement"
+ ng-value="true"
+ )
+ label.requirement.trans-button(
+ for="client-requirement"
+ translate="US.FIELDS.CLIENT_REQUIREMENT"
+ )
fieldset.blocking-flag
- input(type="checkbox", name="is_blocked", ng-model="us.is_blocked", id="blocked-us" ng-value="true")
- label.blocked.trans-button(for="blocked-us", translate="COMMON.BLOCKED")
+ input(
+ type="checkbox"
+ name="is_blocked"
+ ng-model="us.is_blocked"
+ id="blocked-us"
+ ng-value="true"
+ )
+ label.blocked.trans-button(
+ for="blocked-us"
+ translate="COMMON.BLOCKED"
+ )
- tg-blocking-message-input(watch="us.is_blocked", ng-model="us.blocked_note")
+ tg-blocking-message-input(
+ watch="us.is_blocked"
+ ng-model="us.blocked_note"
+ )
- button.button-green.submit-button(type="submit", title="{{'COMMON.CREATE' | translate}}", translate="COMMON.CREATE")
+ button.button-green.submit-button(
+ type="submit"
+ title="{{'COMMON.CREATE' | translate}}"
+ translate="COMMON.CREATE"
+ )
diff --git a/app/partials/includes/modules/search-filter.jade b/app/partials/includes/modules/search-filter.jade
index 5c8c93ae..3304a5cc 100644
--- a/app/partials/includes/modules/search-filter.jade
+++ b/app/partials/includes/modules/search-filter.jade
@@ -4,7 +4,8 @@ ul.search-filter
href="#"
title="{{ 'SEARCH.FILTER_USER_STORIES' | translate }}"
)
- span.icon.icon-bulk
+ svg.icon.icon-bulk
+ use(xlink:href="#icon-bulk")
span.num
span.name(translate="SEARCH.FILTER_USER_STORIES")
@@ -13,7 +14,8 @@ ul.search-filter
href="#"
title="{{ 'SEARCH.FILTER_ISSUES' | translate }}"
)
- span.icon.icon-issues
+ svg.icon.icon-issues
+ use(xlink:href="#icon-issues")
span.num
span.name(translate="SEARCH.FILTER_ISSUES")
@@ -22,7 +24,8 @@ ul.search-filter
href="#"
title="{{ 'SEARCH.FILTER_TASKS' | translate }}"
)
- span.icon.icon-bulk
+ svg.icon.icon-bulk
+ use(xlink:href="#icon-bulk")
span.num
span.name(translate="SEARCH.FILTER_TASKS")
@@ -31,6 +34,7 @@ ul.search-filter
href="#"
title="{{ 'SEARCH.FILTER_WIKI' | translate }}"
)
- span.icon.icon-wiki
+ svg.icon.icon-wiki
+ use(xlink:href="#icon-wiki")
span.num
span.name(translate="SEARCH.FILTER_WIKI")
diff --git a/app/partials/includes/modules/search-in.jade b/app/partials/includes/modules/search-in.jade
index e13718a3..e16d70ee 100644
--- a/app/partials/includes/modules/search-in.jade
+++ b/app/partials/includes/modules/search-in.jade
@@ -1,6 +1,11 @@
section.search-in
header
fieldset
- input(type="text", placeholder="{{'SEARCH.PLACEHOLDER_SEARCH' | translate}}", ng-model="searchTerm")
+ input(
+ type="text"
+ placeholder="{{'SEARCH.PLACEHOLDER_SEARCH' | translate}}"
+ ng-model="searchTerm"
+ )
.icon-search-wrapper(tg-loading="loading")
- a.icon.icon-search(href="", title="{{'SEARCH.TITLE_ACTION_SEARCH' | translate}}")
+ svg.icon.icon-search(title="{{'SEARCH.TITLE_ACTION_SEARCH' | translate}}")
+ use(xlink:href="#icon-search")
diff --git a/app/partials/includes/modules/sprints.jade b/app/partials/includes/modules/sprints.jade
index 2e1b163f..82066a18 100644
--- a/app/partials/includes/modules/sprints.jade
+++ b/app/partials/includes/modules/sprints.jade
@@ -13,7 +13,8 @@ section.sprints
ng-if="totalMilestones"
tg-check-permission="add_milestone"
)
- include ../../../svg/add.svg
+ svg.icon.icon-add
+ use(xlink:href="#icon-add")
div.sprints-empty(ng-if="totalMilestones === 0")
img(
@@ -36,7 +37,8 @@ section.sprints
a.filter-closed-sprints(href="", tg-backlog-toggle-closed-sprints-visualization,
ng-if="totalClosedMilestones")
- span.icon.icon-archive
+ svg.icon.icon-archive
+ use(xlink:href="#icon-archive")
span.text(translate="BACKLOG.SPRINTS.ACTION_SHOW_CLOSED_SPRINTS")
div.sprint.sprint-closed(ng-repeat="sprint in closedSprints track by sprint.id",
diff --git a/app/partials/includes/modules/taskboard-table.jade b/app/partials/includes/modules/taskboard-table.jade
index 5559f648..a87acc12 100644
--- a/app/partials/includes/modules/taskboard-table.jade
+++ b/app/partials/includes/modules/taskboard-table.jade
@@ -4,15 +4,39 @@ div.taskboard-table(tg-taskboard-squish-column)
h2.task-colum-name(translate="TASKBOARD.TABLE.COLUMN")
h2.task-colum-name(ng-repeat="s in taskStatusList track by s.id", ng-style="{'border-top-color':s.color}", ng-class="{'column-fold':statusesFolded[s.id]}", class="squish-status-{{s.id}}", tg-bo-title="s.name")
span(tg-bo-bind="s.name")
- a.icon.icon-vfold.hfold(href="", ng-click='foldStatus(s)', title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD' | translate}}", ng-class='{hidden:statusesFolded[s.id]}')
- a.icon.icon-vunfold.hunfold(href="", title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD' | translate}}", ng-click='foldStatus(s)', ng-class='{hidden:!statusesFolded[s.id]}')
+ svg.icon.icon-fold-row.hfold(
+ ng-click='foldStatus(s)'
+ title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD' | translate}}"
+ ng-class='{hidden:statusesFolded[s.id]}'
+ )
+ use(xlink:href="#icon-fold-row")
+
+ svg.icon.icon-fold-row.hunfold(
+ title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD' | translate}}"
+ ng-click='foldStatus(s)'
+ ng-class='{hidden:!statusesFolded[s.id]}'
+ )
+ use(xlink:href="#icon-unfold-row")
div.taskboard-table-body(tg-taskboard-table-height-fixer)
div.taskboard-table-inner
div.task-row(ng-repeat="us in userstories track by us.id", ng-class="{blocked: us.is_blocked, 'row-fold':usFolded[us.id]}")
div.taskboard-userstory-box.task-column(tg-bo-title="us.blocked_note")
- a.icon.icon-vfold.vfold(href="", title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD_ROW' | translate}}", ng-click='foldUs(us)', ng-class='{hidden:usFolded[us.id]}')
- a.icon.icon-vunfold.vunfold(href="", title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD_ROW' | translate}}", ng-click='foldUs(us)', ng-class='{hidden:!usFolded[us.id]}')
+
+ svg.icon.icon-fold-row.vfold(
+ title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD_ROW' | translate}}"
+ ng-click='foldUs(us)'
+ ng-class='{hidden:usFolded[us.id]}'
+ )
+ use(xlink:href="#icon-fold-row")
+
+ svg.icon.icon-unfold-row.vunfold(
+ title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD_ROW' | translate}}"
+ ng-click='foldUs(us)'
+ ng-class='{hidden:!usFolded[us.id]}'
+ )
+ use(xlink:href="#icon-fold-row")
+
h3.us-title
a(href="",
tg-nav="project-userstories-detail:project=project.slug,ref=us.ref",
@@ -41,8 +65,22 @@ div.taskboard-table(tg-taskboard-squish-column)
div.task-row(ng-init="us = null", ng-class="{'row-fold':usFolded[null]}")
div.taskboard-userstory-box.task-column
- a.icon.icon-vfold.vfold(href="", title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD_ROW' | translate}}", ng-click='foldUs()', ng-class="{hidden:usFolded[null]}")
- a.icon.icon-vunfold.vunfold(href="", title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD_ROW' | translate}}", ng-click='foldUs()', ng-class="{hidden:!usFolded[null]}")
+ a.vfold(
+ href=""
+ title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD_ROW' | translate}}"
+ ng-click='foldUs()'
+ ng-class="{hidden:usFolded[null]}"
+ )
+ svg.icon.icon-fold-row
+ use(xlink:href="#icon-fold-row")
+ a.vunfold(
+ href=""
+ title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD_ROW' | translate}}"
+ ng-click='foldUs()'
+ ng-class="{hidden:!usFolded[null]}"
+ )
+ svg.icon.icon-unfold-row
+ use(xlink:href="#icon-unfold-row")
h3.us-title
span(translate="TASKBOARD.TABLE.ROW_UNASSIGED_TASKS_TITLE")
include ../components/addnewtask.jade
diff --git a/app/partials/includes/modules/team/team-filters.jade b/app/partials/includes/modules/team/team-filters.jade
index d2d68cb9..72b104a0 100644
--- a/app/partials/includes/modules/team/team-filters.jade
+++ b/app/partials/includes/modules/team/team-filters.jade
@@ -7,6 +7,7 @@ section.team-filters
fieldset
input(type="text", placeholder="{{'TEAM.PLACEHOLDER_INPUT_SEARCH' | translate}}", ng-model="filtersQ")
.icon-search-wrapper
- a.icon.icon-search(href="", title="{{'COMMON.FILTERS.TITLE_ACTION_FILTER_BUTTON' | translate}}")
+ svg.icon.icon-search(title="{{'COMMON.FILTERS.TITLE_ACTION_FILTER_BUTTON' | translate}}")
+ use(xlink:href="#icon-search")
- nav(tg-team-filters)
\ No newline at end of file
+ nav(tg-team-filters)
diff --git a/app/partials/includes/modules/team/team-table.jade b/app/partials/includes/modules/team/team-table.jade
index f2a2e3a2..27dc7e42 100644
--- a/app/partials/includes/modules/team/team-table.jade
+++ b/app/partials/includes/modules/team/team-table.jade
@@ -27,7 +27,16 @@ section.table-team.basic-table
div.popover.attribute-explanation
span(translate="TEAM.EXPLANATION_COLUMN_TOTAL_POWER")
- div.hero(tg-team-current-user, stats="stats", currentuser="currentUser", projectid="projectId", issuesEnabled="issuesEnabled", tasksenabled="tasksEnabled", wikienabled="wikiEnabled", ng-if="::currentUser")
+ div.hero(
+ tg-team-current-user
+ stats="stats"
+ currentuser="currentUser"
+ projectid="projectId"
+ issuesEnabled="issuesEnabled"
+ tasksenabled="tasksEnabled"
+ wikienabled="wikiEnabled"
+ ng-if="::currentUser"
+ )
h2(ng-show="memberships.length")
span(translate="TEAM.SECTION_TITLE_TEAM")
diff --git a/app/partials/issue/iocaine-button.jade b/app/partials/issue/iocaine-button.jade
index fecc54d9..25406e92 100644
--- a/app/partials/issue/iocaine-button.jade
+++ b/app/partials/issue/iocaine-button.jade
@@ -3,7 +3,8 @@ fieldset(title="{{ 'TASK.TITLE_ACTION_IOCAINE' | translate }}")
for="is-iocaine"
class!="<% if(isEditable){ %>is-editable<% }; %> <% if(isIocaine){ %>active<% }; %>"
)
- include ../../svg/iocaine.svg
+ svg.icon.icon-iocaine
+ use(xlink:href="#icon-iocaine")
input(
type="checkbox"
id="is-iocaine"
diff --git a/app/partials/issue/issue-priority-button.jade b/app/partials/issue/issue-priority-button.jade
index 62055e0b..0e82506b 100644
--- a/app/partials/issue/issue-priority-button.jade
+++ b/app/partials/issue/issue-priority-button.jade
@@ -2,7 +2,8 @@ div(class!="priority-data <% if(editable){ %>clickable<% }%>")
span(class="level", style!="background-color:<%- priority.color %>")
span(class="priority-priority") <%- priority.name %>
<% if(editable){ %>
- span(class="icon icon-arrow-bottom")
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% }%>
span(class="level-name", translate="COMMON.FIELDS.PRIORITY")
diff --git a/app/partials/issue/issue-severity-button.jade b/app/partials/issue/issue-severity-button.jade
index 6ffe35dd..377e7346 100644
--- a/app/partials/issue/issue-severity-button.jade
+++ b/app/partials/issue/issue-severity-button.jade
@@ -2,7 +2,8 @@ div(class!="severity-data <% if(editable){ %>clickable<% }%>")
span(class="level", style!="background-color:<%- severity.color %>")
span(class="severity-severity") <%- severity.name %>
<% if(editable){ %>
- span(class="icon icon-arrow-bottom")
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% }%>
span(class="level-name", translate="COMMON.FIELDS.SEVERITY")
diff --git a/app/partials/issue/issue-type-button.jade b/app/partials/issue/issue-type-button.jade
index 675e7d92..9a050bb2 100644
--- a/app/partials/issue/issue-type-button.jade
+++ b/app/partials/issue/issue-type-button.jade
@@ -2,7 +2,8 @@ div(class!="type-data <% if(editable){ %>clickable<% }%>")
span(class="level", style!="background-color:<%- type.color %>")
span(class="type-type") <%- type.name %>
<% if(editable){ %>
- span(class="icon icon-arrow-bottom")
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% }%>
span(class="level-name", translate="COMMON.FIELDS.TYPE")
diff --git a/app/partials/issue/issues-detail.jade b/app/partials/issue/issues-detail.jade
index da3a33e5..30b2d69d 100644
--- a/app/partials/issue/issues-detail.jade
+++ b/app/partials/issue/issues-detail.jade
@@ -46,17 +46,19 @@ div.wrapper(
span.block-description-title(translate="COMMON.BLOCKED")
span.block-description(ng-bind="issue.blocked_note || ('ISSUES.BLOCKED' | translate)")
- div.issue-nav
- a.icon.icon-arrow-left(
+ .issue-nav
+ svg.icon.icon-arrow-left(
ng-show="previousUrl"
tg-bo-href="previousUrl"
title="{{'ISSUES.TITLE_PREVIOUS_ISSUE' | translate}}"
)
- a.icon.icon-arrow-right(
+ use(xlink:href="#icon-arrow-left")
+ svg.icon.icon-arrow-right(
ng-show="nextUrl"
tg-bo-href="nextUrl"
title="{{'ISSUES.TITLE_NEXT_ISSUE' | translate}}"
)
+ use(xlink:href="#icon-arrow-right")
.subheader
div.tags-block(tg-tag-line, ng-model="issue", required-perm="modify_issue")
tg-created-by-display.ticket-created-by(ng-model="issue")
diff --git a/app/partials/issue/issues-filters-selected.jade b/app/partials/issue/issues-filters-selected.jade
index 90daaacc..187ba9f6 100644
--- a/app/partials/issue/issues-filters-selected.jade
+++ b/app/partials/issue/issues-filters-selected.jade
@@ -1,8 +1,9 @@
<% _.each(filters, function(f) { %>
-a(class="single-filter selected",
- data-type!="<%- f.type %>",
- data-id!="<%- f.id %>")
- span(class="name", style!="<%- f.style %>")
- | <%- f.name %>
- span(class="icon icon-delete")
-<% }) %>
\ No newline at end of file
+a.single-filter.selected(
+ data-type!="<%- f.type %>"
+ data-id!="<%- f.id %>"
+)
+ span.name(style!="<%- f.style %>") <%- f.name %>
+ svg.icon.icon-close.remove-filter
+ use(xlink:href="#icon-close")
+<% }) %>
diff --git a/app/partials/issue/issues-filters.jade b/app/partials/issue/issues-filters.jade
index 8738bc6a..3dfa76ef 100644
--- a/app/partials/issue/issues-filters.jade
+++ b/app/partials/issue/issues-filters.jade
@@ -7,7 +7,8 @@ a(class="single-filter", data-type!="<%- f.type %>", data-id!="<%- f.id %>")
span(class="number") <%- f.count %>
<% } %>
<% if (f.type == "myFilters"){ %>
- span(class="icon icon-delete")
+ svg.icon.icon-close.remove-filter
+ use(xlink:href="#icon-close")
<% } %>
<% } %>
<% }) %>
diff --git a/app/partials/issue/issues-status-button.jade b/app/partials/issue/issues-status-button.jade
index 957831a8..39f67881 100644
--- a/app/partials/issue/issues-status-button.jade
+++ b/app/partials/issue/issues-status-button.jade
@@ -5,7 +5,8 @@ span.detail-status-inner.js-edit-status(
)
span <%- status.name %>
<% if(editable){ %>
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% }%>
ul.popover.pop-status
diff --git a/app/partials/issue/promote-issue-to-us-button.jade b/app/partials/issue/promote-issue-to-us-button.jade
index d9a4ad31..2a241ca1 100644
--- a/app/partials/issue/promote-issue-to-us-button.jade
+++ b/app/partials/issue/promote-issue-to-us-button.jade
@@ -1,5 +1,6 @@
-a.promote-button.editable(
+a.promote-button.is-editable(
tg-check-permission="add_us"
title="{{ 'ISSUES.ACTION_PROMOTE_TO_US' | translate }}"
)
- include ../../svg/promote.svg
+ svg.icon.icon-promote
+ use(xlink:href="#icon-promote")
diff --git a/app/partials/kanban/kanban-task.jade b/app/partials/kanban/kanban-task.jade
index a63842bc..a863a07b 100644
--- a/app/partials/kanban/kanban-task.jade
+++ b/app/partials/kanban/kanban-task.jade
@@ -24,4 +24,9 @@ div.kanban-task-inner(ng-class="{'task-archived': us.isArchived}")
span.task-name(ng-bind="us.subject")
p(translate="KANBAN.UNDO_ARCHIVED")
- a.icon.icon-edit(tg-check-permission="modify_us", href="", title="{{'COMMON.EDIT' | translate}}", ng-hide="us.isArchived")
+ svg.icon.icon-edit(
+ tg-check-permission="modify_us"
+ title="{{'COMMON.EDIT' | translate}}"
+ ng-hide="us.isArchived"
+ )
+ use(xlink:href="#icon-edit")
diff --git a/app/partials/project/wizard-create-project.jade b/app/partials/project/wizard-create-project.jade
index 1d52dc48..f32cc8c0 100644
--- a/app/partials/project/wizard-create-project.jade
+++ b/app/partials/project/wizard-create-project.jade
@@ -6,16 +6,26 @@ form
div.template-wrapper
div.template-inner
fieldset(ng-repeat="template in templates")
- input(type="radio", name="template", id="template-{{ template.id }}",
- ng-value='template.id', ng-model="data.creation_template",
- data-required="true")
+ input(
+ type="radio"
+ name="template"
+ id="template-{{ template.id }}"
+ ng-value='template.id'
+ ng-model="data.creation_template"
+ data-required="true"
+ )
label.backlog(for="template-{{ template.id }}")
- span.icon( ng-class="'icon-'+template.slug")
+ svg.icon(ng-class="'icon-'+template.slug")
+ use(xlink:href="{{'#icon-' + template.slug }}")
h2 {{ template.name }}
p {{ template.description }}
fieldset
- a.button-next.button-green(href="#", title="{{'PAGINATION.NEXT' | translate}}", translate="PAGINATION.NEXT")
+ a.button-next.button-green(
+ href="#"
+ title="{{'PAGINATION.NEXT' | translate}}"
+ translate="PAGINATION.NEXT"
+ )
section.wizard-step.create-step2.active(data-step="step2")
div.title
@@ -24,15 +34,35 @@ form
div.template-wrapper
div.template-inner
fieldset
- input(type="text", name="name", ng-model="data.name", data-required="true", placeholder="{{'COMMON.FIELDS.NAME' | translate}}", maxlength="45")
+ input(
+ type="text"
+ name="name"
+ ng-model="data.name"
+ data-required="true"
+ placeholder="{{'COMMON.FIELDS.NAME' | translate}}"
+ maxlength="45"
+ )
fieldset
- textarea(name="description", ng-model="data.description", data-required="true", ng-attr-placeholder="{{'COMMON.FIELDS.DESCRIPTION' | translate}}")
+ textarea(
+ name="description"
+ ng-model="data.description"
+ data-required="true"
+ ng-attr-placeholder="{{'COMMON.FIELDS.DESCRIPTION' | translate}}"
+ )
fieldset.wizard-action
div
- a.button-prev.button.button-gray(href="#", title="{{'PAGINATION.PREVIOUS' | translate}}", translate="PAGINATION.PREVIOUS")
- button.button-green.submit-button(type="submit", title="{{'COMMON.CREATE' | translate}}", translate="COMMON.CREATE")
+ a.button-prev.button.button-gray(
+ href="#"
+ title="{{'PAGINATION.PREVIOUS' | translate}}"
+ translate="PAGINATION.PREVIOUS"
+ )
+ button.button-green.submit-button(
+ type="submit"
+ title="{{'COMMON.CREATE' | translate}}"
+ translate="COMMON.CREATE"
+ )
- button(type="submit", class="hidden")
+ button.hidden(type="submit")
div.progress-bar
div.progress-state
@@ -43,4 +73,5 @@ div.progress-bar
div.bar
a.close(href="#" title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+ svg.icon.icon-delete
+ use(xlink:href="#icon-delete")
diff --git a/app/partials/search/lightbox-search.jade b/app/partials/search/lightbox-search.jade
index 189c4890..328deb21 100644
--- a/app/partials/search/lightbox-search.jade
+++ b/app/partials/search/lightbox-search.jade
@@ -1,8 +1,9 @@
a.close(href="", title="{{'COMMON.CLOSE' | translate}}")
- span.icon.icon-delete
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.SEARCH.TITLE")
fieldset
input(type="text", name="text", id="search-text", placeholder="{{'LIGHTBOX.SEARCH.PLACEHOLDER_SEARCH' | translate}}", data-required="true")
fieldset
- button.button-green.submit-button(type="submit", title="{{' LIGHTBOX.SEARCH.TITLE' | translate}}", translate="LIGHTBOX.SEARCH.TITLE")
\ No newline at end of file
+ button.button-green.submit-button(type="submit", title="{{' LIGHTBOX.SEARCH.TITLE' | translate}}", translate="LIGHTBOX.SEARCH.TITLE")
diff --git a/app/partials/task/related-task-create-form.jade b/app/partials/task/related-task-create-form.jade
index 35f0f4f9..997b8a60 100644
--- a/app/partials/task/related-task-create-form.jade
+++ b/app/partials/task/related-task-create-form.jade
@@ -2,15 +2,19 @@
.task-name
input(type='text', placeholder="{{'TASK.PLACEHOLDER_SUBJECT' | translate}}")
.task-settings
- a.icon.icon-floppy(href='', title="{{'COMMON.SAVE' | translate}}")
- a.icon.icon-delete.cancel-edit(href='', title="{{'COMMON.CANCEL' | translate}}")
+ svg.icon.icon-save(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.icon.icon-close.cancel-edit(href='', title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-close")
.status(tg-related-task-status='newTask', ng-model='newTask', not-auto-save='true')
a.task-status(href='', title="{{'TASK.TITLE_SELECT_STATUS' | translate}}")
span.task-status-bind
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
.assigned-to(tg-related-task-assigned-to-inline-edition='newTask', not-auto-save='true')
.task-assignedto(title="{{'COMMON.FIELDS.ASSIGNED_TO' | translate}}")
figure.avatar
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
diff --git a/app/partials/task/related-task-row-edit.jade b/app/partials/task/related-task-row-edit.jade
index 6023b2ae..93f32d63 100644
--- a/app/partials/task/related-task-row-edit.jade
+++ b/app/partials/task/related-task-row-edit.jade
@@ -2,15 +2,19 @@
.task-name
input(type='text', value!='<%- task.subject %>', placeholder="{{'TASK.PLACEHOLDER_SUBJECT' | translate}}")
.task-settings
- a.icon.icon-floppy(href='', title="{{'COMMON.SAVE' | translate}}")
- a.icon.icon-delete.cancel-edit(href='', title="{{'COMMON.CANCEL' | translate}}")
+ svg.icon.icon-save.save-task(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.icon.icon-close.cancel-edit(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-close")
.status(tg-related-task-status='task', ng-model='task')
a.task-status(href='', title="{{'TASK.TITLE_SELECT_STATUS' | translate}}")
span.task-status-bind
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
.assigned-to(tg-related-task-assigned-to-inline-edition='task')
.task-assignedto(title="{{'COMMON.FIELDS.ASSIGNED_TO' | translate}}")
figure.avatar
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
diff --git a/app/partials/task/related-task-row.jade b/app/partials/task/related-task-row.jade
index 0a51af0d..7b99c113 100644
--- a/app/partials/task/related-task-row.jade
+++ b/app/partials/task/related-task-row.jade
@@ -1,23 +1,25 @@
.tasks
.task-name
- .icon.icon-iocaine
a.clickable(
tg-nav="project-tasks-detail:project=project.slug,ref=task.ref"
title!="#<%- task.ref %> <%- task.subject %>")
+ svg.icon.icon-iocaine
+ use(xlink:href="#icon-iocaine")
span #<%- task.ref %>
span <%- task.subject %>
.task-settings
<% if(perms.modify_task) { %>
- a.icon.icon-edit(
+ svg.icon.icon-edit.edit-task(
href=""
title="{{'COMMON.EDIT' | translate}}"
)
+ use(xlink:href="#icon-edit")
<% } %>
<% if(perms.delete_task) { %>
- a.icon.icon-delete.delete-task(
- href=""
+ svg.icon.icon-trash.delete-task(
title="{{'COMMON.DELETE' | translate}}"
)
+ use(xlink:href="#icon-trash")
<% } %>
.status(
@@ -30,7 +32,8 @@
)
span.task-status-bind
<% if(perms.modify_task) { %>
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% } %>
.assigned-to(
@@ -42,5 +45,6 @@
)
figure.avatar
<% if(perms.modify_task) { %>
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% } %>
diff --git a/app/partials/task/task-detail.jade b/app/partials/task/task-detail.jade
index f9570518..962f1bfe 100644
--- a/app/partials/task/task-detail.jade
+++ b/app/partials/task/task-detail.jade
@@ -62,16 +62,20 @@ div.wrapper(
)
div.issue-nav
- a.icon.icon-arrow-left(
+ a(
ng-show="previousUrl"
tg-bo-href="previousUrl"
title="{{'TASK.PREVIOUS' | translate}}"
)
- a.icon.icon-arrow-right(
+ svg.icon.icon-arrow-left
+ use(xlink:href='#icon-arrow-left')
+ a(
ng-show="nextUrl"
tg-bo-href="nextUrl"
title="{{'TASK.NEXT' | translate}}"
)
+ svg.icon.icon-arrow-right
+ use(xlink:href='#icon-arrow-right')
.subheader
div.tags-block(tg-tag-line, ng-model="task", required-perm="modify_task")
tg-created-by-display.ticket-created-by(ng-model="task")
diff --git a/app/partials/team/leave-project.jade b/app/partials/team/leave-project.jade
index b9d52ae0..04fa75c4 100644
--- a/app/partials/team/leave-project.jade
+++ b/app/partials/team/leave-project.jade
@@ -1,3 +1,7 @@
-a.leave-project(ng-click="leave()", href="")
- span.icon.icon-delete
- | {{ 'TEAM.ACTION_LEAVE_PROJECT' | translate }}
+a.leave-project(
+ ng-click="leave()"
+ href=""
+)
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
+ span {{ 'TEAM.ACTION_LEAVE_PROJECT' | translate }}
diff --git a/app/partials/team/team-filter.jade b/app/partials/team/team-filter.jade
index d23c8644..67ccfcd0 100644
--- a/app/partials/team/team-filter.jade
+++ b/app/partials/team/team-filter.jade
@@ -1,10 +1,20 @@
ul
li
- a(ng-class="{active: !filtersRole.id}", ng-click="ctrl.setRole()", href="")
+ a(
+ ng-class="{active: !filtersRole.id}"
+ ng-click="ctrl.setRole()"
+ href=""
+ )
span.title(translate="TEAM.SECTION_FILTER_ALL")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
li(ng-repeat="role in roles")
- a(ng-class="{active: role.id == filtersRole.id}", ng-click="ctrl.setRole(role)", href="")
+ a(
+ ng-class="{active: role.id == filtersRole.id}"
+ ng-click="ctrl.setRole(role)"
+ href=""
+ )
span.title(tg-bo-bind="role.name")
- span.icon.icon-arrow-right
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
diff --git a/app/partials/team/team-member-current-user.jade b/app/partials/team/team-member-current-user.jade
index b5d81ce1..f8fa273e 100644
--- a/app/partials/team/team-member-current-user.jade
+++ b/app/partials/team/team-member-current-user.jade
@@ -1,17 +1,20 @@
.row
.username
- figure.avatar
+ .avatar
img(tg-bo-src="currentUser.photo", tg-bo-alt="currentUser.full_name_display")
- figcaption
+ .avatar-data
span.name(tg-bo-bind="currentUser.full_name_display")
span.position(tg-bo-bind="currentUser.role_name")
div(tg-leave-project="", projectid="{{projectId}}")
- .member-stats(tg-team-member-stats, stats="stats",
- user="currentUser.user",
- issuesEnabled="issuesEnabled",
- tasksenabled="tasksEnabled",
- wikienabled="wikiEnabled")
+ .member-stats(
+ tg-team-member-stats
+ stats="stats"
+ ser="currentUser.user"
+ issuesEnabled="issuesEnabled"
+ tasksenabled="tasksEnabled"
+ wikienabled="wikiEnabled"
+ )
diff --git a/app/partials/team/team-member-stats.jade b/app/partials/team/team-member-stats.jade
index c271ffe0..161683b0 100644
--- a/app/partials/team/team-member-stats.jade
+++ b/app/partials/team/team-member-stats.jade
@@ -1,22 +1,37 @@
.attribute(ng-if="issuesEnabled")
- span.icon.icon-briefcase(ng-style="{'opacity': stats.closed_bugs[userId]}",
- ng-class="{'top': stats.closed_bugs[userId] == 1}")
+ svg.icon.icon-briefcase(
+ ng-style="{'opacity': stats.closed_bugs[userId]}"
+ ng-class="{'top': stats.closed_bugs[userId] == 1}"
+ )
+ use(xlink:href="#icon-briefcase")
.attribute(ng-if="tasksEnabled")
- span.icon.icon-iocaine(ng-style="{'opacity': stats.iocaine_tasks[userId]}",
- ng-class="{'top': stats.iocaine_tasks[userId] == 1}")
+ svg.icon.icon-iocaine(
+ ng-style="{'opacity': stats.iocaine_tasks[userId]}"
+ ng-class="{'top': stats.iocaine_tasks[userId] == 1}"
+ )
+ use(xlink:href="#icon-iocaine")
.attribute(ng-if="wikiEnabled")
- span.icon.icon-writer(ng-style="{'opacity': stats.wiki_changes[userId]}",
- ng-class="{'top': stats.wiki_changes[userId] == 1}")
+ svg.icon.icon-edit(
+ ng-style="{'opacity': stats.wiki_changes[userId]}"
+ ng-class="{'top': stats.wiki_changes[userId] == 1}"
+ )
+ use(xlink:href="#icon-edit")
.attribute(ng-if="issuesEnabled")
- span.icon.icon-bug(ng-style="{'opacity': stats.created_bugs[userId]}",
- ng-class="{'top': stats.created_bugs[userId] == 1}")
+ svg.icon.icon-bug(
+ ng-style="{'opacity': stats.created_bugs[userId]}"
+ ng-class="{'top': stats.created_bugs[userId] == 1}"
+ )
+ use(xlink:href="#icon-bug")
.attribute(ng-if="tasksEnabled")
- span.icon.icon-tasks(ng-style="{'opacity': stats.closed_tasks[userId]}",
- ng-class="{'top': stats.closed_tasks[userId] == 1}")
+ svg.icon.icon-task(
+ ng-style="{'opacity': stats.closed_tasks[userId]}"
+ ng-class="{'top': stats.closed_tasks[userId] == 1}"
+ )
+ use(xlink:href="#icon-task")
.attribute
span.points(ng-bind="stats.totals[userId]")
diff --git a/app/partials/team/team-members.jade b/app/partials/team/team-members.jade
index 55df4055..342d0bf6 100644
--- a/app/partials/team/team-members.jade
+++ b/app/partials/team/team-members.jade
@@ -1,9 +1,9 @@
.row.member(ng-repeat="user in memberships | membersFilter:filtersQ:filtersRole")
.username
- figure.avatar
+ .avatar
img(tg-bo-src="user.photo", tg-bo-alt="user.full_name_display")
- figcaption
+ .avatar-data
a.name(tg-nav="user-profile:username=user.username",
title="{{::user.full_name_display}}") {{::user.full_name_display}}
span.position {{::user.role_name}}
diff --git a/app/partials/us/us-client-requirement-button.jade b/app/partials/us/us-client-requirement-button.jade
index b8d7a506..d9cb54a1 100644
--- a/app/partials/us/us-client-requirement-button.jade
+++ b/app/partials/us/us-client-requirement-button.jade
@@ -3,7 +3,8 @@ label.button-gray.client-requirement(
class!="<% if(canEdit){ %>is-editable<% }; %> <% if(isRequired){ %>active<% }; %>"
title="{{ 'COMMON.CLIENT_REQUIREMENT' | translate }}"
)
- include ../../svg/client-requirement.svg
+ svg.icon.icon-client-requirement
+ use(xlink:href="#icon-client-requirement")
input(
type="checkbox"
id="client-requirement"
diff --git a/app/partials/us/us-detail.jade b/app/partials/us/us-detail.jade
index 65b6f893..58b89303 100644
--- a/app/partials/us/us-detail.jade
+++ b/app/partials/us/us-detail.jade
@@ -55,16 +55,20 @@ div.wrapper(
span.block-description-title(translate="COMMON.BLOCKED")
span.block-description(ng-bind="us.blocked_note || ('US.BLOCKED' | translate)")
div.issue-nav
- a.icon.icon-arrow-left(
+ a(
ng-show="previousUrl"
tg-bo-href="previousUrl"
title="{{'US.PREVIOUS' | translate}}"
)
- a.icon.icon-arrow-right(
+ svg.icon.icon-arrow-left
+ use(xlink:href="#icon-arrow-left")
+ a(
ng-show="nextUrl"
tg-bo-href="nextUrl"
title="{{'US.NEXT' | translate}}"
)
+ svg.icon.icon-arrow-right
+ use(xlink:href="#icon-arrow-right")
.subheader
.tags-block(tg-tag-line, ng-model="us", required-perm="modify_us")
tg-created-by-display.ticket-created-by(ng-model="us")
diff --git a/app/partials/us/us-status-button.jade b/app/partials/us/us-status-button.jade
index 64f9caaf..5066a9ab 100644
--- a/app/partials/us/us-status-button.jade
+++ b/app/partials/us/us-status-button.jade
@@ -4,7 +4,8 @@ span.detail-status-inner.js-edit-status(
)
span <%- status.name %>
<% if(editable){ %>
- span.icon.icon-arrow-bottom
+ svg.icon.icon-arrow-down
+ use(xlink:href="#icon-arrow-down")
<% }%>
ul.pop-status.popover
diff --git a/app/partials/us/us-team-requirement-button.jade b/app/partials/us/us-team-requirement-button.jade
index e34338b1..9a4d186d 100644
--- a/app/partials/us/us-team-requirement-button.jade
+++ b/app/partials/us/us-team-requirement-button.jade
@@ -3,7 +3,8 @@ label.button-gray.team-requirement(
class!=" <% if(canEdit){ %>is-editable<% }; %> <% if(isRequired){ %>active<% }; %>"
title="{{ 'COMMON.TEAM_REQUIREMENT' | translate }}"
)
- include ../../svg/team-requirement.svg
+ svg.icon.icon-team-requirement
+ use(xlink:href="#icon-team-requirement")
input(
type="checkbox"
diff --git a/app/partials/user/lightbox/lightbox-delete-account.jade b/app/partials/user/lightbox/lightbox-delete-account.jade
index 5befed76..f7915fdd 100644
--- a/app/partials/user/lightbox/lightbox-delete-account.jade
+++ b/app/partials/user/lightbox/lightbox-delete-account.jade
@@ -1,5 +1,6 @@
a.close(href="", title="{{'close' | translate}}")
- span.icon.icon-delete
+ svg.icon.icon-close
+ use(xlink:href="#icon-close")
form
h2.title(translate="LIGHTBOX.DELETE_ACCOUNT.SECTION_NAME")
p
diff --git a/app/partials/wiki/editable-wiki-content.jade b/app/partials/wiki/editable-wiki-content.jade
index 2faf3b51..e5729ed0 100644
--- a/app/partials/wiki/editable-wiki-content.jade
+++ b/app/partials/wiki/editable-wiki-content.jade
@@ -2,7 +2,11 @@ include ../common/components/wysiwyg.jade
.view-wiki-content
section.wysiwyg(tg-bind-html='wiki.html')
- span.edit.icon.icon-edit(title="{{'COMMON.EDIT' | translate}}", ng-if="wiki")
+ svg.edit.icon.icon-edit(
+ title="{{'COMMON.EDIT' | translate}}"
+ ng-if="wiki"
+ )
+ use(xlink:href="#icon-edit")
.edit-wiki-content(style='display: none;')
textarea(ng-attr-placeholder="{{'WIKI.PLACEHOLDER_PAGE' | translate}}",
@@ -10,5 +14,7 @@ include ../common/components/wysiwyg.jade
+wysihelp
span.action-container
- a.save.icon.icon-floppy(href='', title="{{'COMMON.SAVE' | translate}}")
- a.cancel.icon.icon-delete(href='', title="{{'COMMON.CANCEL' | translate}}")
+ svg.save.icon.icon-save(title="{{'COMMON.SAVE' | translate}}")
+ use(xlink:href="#icon-save")
+ svg.cancel.icon.icon-close(title="{{'COMMON.CANCEL' | translate}}")
+ use(xlink:href="#icon-close")
diff --git a/app/partials/wiki/wiki-nav.jade b/app/partials/wiki/wiki-nav.jade
index 8e2c97bc..4d3fa0da 100644
--- a/app/partials/wiki/wiki-nav.jade
+++ b/app/partials/wiki/wiki-nav.jade
@@ -8,7 +8,8 @@ nav
a(title!="<%- link.title %>")
span.link-title <%- link.title %>
<% if (deleteWikiLinkPermission) { %>
- span.icon.icon-delete
+ svg.icon.icon-trash
+ use(xlink:href="#icon-trash")
<% } %>
input(type="text" placeholder="{{'COMMON.FIELDS.NAME' | translate}}" class="hidden" value!="<%- link.title %>")
<% }) %>
diff --git a/app/partials/wiki/wiki.jade b/app/partials/wiki/wiki.jade
index 40f525d4..f7f04cb0 100644
--- a/app/partials/wiki/wiki.jade
+++ b/app/partials/wiki/wiki.jade
@@ -24,5 +24,6 @@ div.wrapper(ng-controller="WikiDetailController as ctrl",
)
a.remove(href="", ng-click="ctrl.delete()", ng-if="wiki.id", title="{{'WIKI.REMOVE' | translate}}", tg-check-permission="delete_wiki_page")
- span.icon.icon-delete
+ svg.icon.icon-trash
+ use(xlink:href="#icon-trash")
span(translate="WIKI.REMOVE")
diff --git a/app/styles/components/buttons.scss b/app/styles/components/buttons.scss
index e4f13781..7c57383b 100755
--- a/app/styles/components/buttons.scss
+++ b/app/styles/components/buttons.scss
@@ -30,7 +30,6 @@
}
.icon {
color: $white;
- margin-right: .3rem;
}
}
@@ -43,12 +42,8 @@
color: $blackish;
transition: color .2s linear;
}
- &:hover,
- &.active {
- span,
- .icon {
- color: $primary;
- }
+ .icon {
+ margin-right: .5rem;
}
&:visited {
color: $blackish;
@@ -118,7 +113,10 @@ a.button-gray {
background: $primary;
padding: .35rem .5rem;
.icon {
+ fill: currentColor;
margin-right: 0;
+ position: relative;
+ top: 1px;
}
&:hover {
background: $primary-light;
diff --git a/app/styles/components/editor-help.scss b/app/styles/components/editor-help.scss
index 64880b9a..5e77956a 100644
--- a/app/styles/components/editor-help.scss
+++ b/app/styles/components/editor-help.scss
@@ -13,17 +13,20 @@
.help-markdown,
.help-button {
- @extend %xsmall;
&:hover {
span {
transition: color .2s linear;
}
.icon {
- color: $primary-light;
- transition: color .2s linear;
+ fill: $primary-light;
+ transition: fill .2s linear;
}
}
+ span {
+ vertical-align: text-top;
+ }
.icon {
+ fill: $gray-light;
margin-right: .2rem;
}
}
diff --git a/app/styles/components/estimation.scss b/app/styles/components/estimation.scss
index 39a0f6e3..f9d47a2b 100644
--- a/app/styles/components/estimation.scss
+++ b/app/styles/components/estimation.scss
@@ -13,7 +13,6 @@
min-height: 2rem;
padding: .5rem 1rem;
position: relative;
- transition: color .3s linear;
&.clickable {
&:hover,
&.active {
@@ -22,7 +21,8 @@
.points,
.role,
.icon-arrow-bottom {
- color: $whitish;
+ color: currentColor;
+ fill: currentColor;
}
}
}
@@ -34,13 +34,15 @@
.role,
.icon-arrow-bottom {
@extend %text;
- color: $whitish;
+ color: currentColor;
+ fill: currentColor;
}
}
- .icon-arrow-bottom {
- color: $gray-light;
+ .icon-arrow-down {
+ fill: currentColor;
+ height: .6rem;
margin-left: .25rem;
- vertical-align: middle;
+ width: .6rem;
}
.points {
@extend %light;
diff --git a/app/styles/components/filter.scss b/app/styles/components/filter.scss
index 5aa0a398..86994832 100644
--- a/app/styles/components/filter.scss
+++ b/app/styles/components/filter.scss
@@ -23,8 +23,10 @@
padding: 8px 10px;
}
.name {
+ @include ellipsis(100%);
background: darken($whitish, 10%); // Fallback
display: block;
+ padding-right: 2rem;
width: 100%;
}
.number {
@@ -33,15 +35,14 @@
right: 0;
top: 0;
}
- .icon-delete {
- color: $grayer;
+ .remove-filter {
+ fill: $gray;
position: absolute;
right: .5rem;
- top: .5rem;
- transition: color .3s linear;
+ top: .75rem;
+ transition: fill .2s linear;
&:hover {
- color: $red;
- transition: color .3s linear;
+ fill: $red;
}
}
}
diff --git a/app/styles/components/kanban-task.scss b/app/styles/components/kanban-task.scss
index 70a6480e..37406516 100644
--- a/app/styles/components/kanban-task.scss
+++ b/app/styles/components/kanban-task.scss
@@ -9,10 +9,9 @@
margin-bottom: 0;
}
&:hover {
- .icon-edit,
- .icon-drag-h {
- color: $card-dark;
+ .icon-edit {
display: block;
+ fill: $card-dark;
opacity: 1;
transition: color .3s linear, opacity .3s linear;
}
@@ -96,15 +95,14 @@
bottom: .5rem;
position: absolute;
}
- .icon-edit,
- .icon-drag-h {
- @extend %large;
- color: $card-hover;
+ .icon-edit {
+ @include svg-size(1.1rem);
+ fill: $card-hover;
opacity: 0;
position: absolute;
- transition: opacity .2s linear;
&:hover {
- color: darken($card-hover, 15%);
+ cursor: pointer;
+ fill: darken($card-hover, 15%);
transition: color .3s linear;
}
}
diff --git a/app/styles/components/markitup.scss b/app/styles/components/markitup.scss
index ebb6e881..dd121e40 100644
--- a/app/styles/components/markitup.scss
+++ b/app/styles/components/markitup.scss
@@ -35,4 +35,8 @@
min-height: 2rem;
padding: .3rem;
}
+ .content {
+ background: $white;
+ margin-bottom: 0;
+ }
}
diff --git a/app/styles/components/notification-message.scss b/app/styles/components/notification-message.scss
index a0c93c13..4a79a15d 100644
--- a/app/styles/components/notification-message.scss
+++ b/app/styles/components/notification-message.scss
@@ -49,6 +49,7 @@
.notification-message-error {
background: rgba($red, .9);
+ opacity: 1;
top: 0;
transform: translateY(-100%);
width: 100%;
@@ -60,10 +61,10 @@
&.inactive {
transition: all .6s ease-in-out;
}
- .icon-notification-error {
- @extend %xxlarge;
- display: inline;
- vertical-align: sub;
+ .icon-error {
+ @include svg-size(3rem);
+ fill: $white;
+ margin-right: .5rem;
}
.warning {
@extend %xlarge;
@@ -79,8 +80,9 @@
margin: 0;
}
}
- .icon-delete {
- color: $white;
+ .icon-close {
+ cursor: pointer;
+ fill: $white;
position: absolute;
right: 1rem;
top: 1rem;
@@ -131,7 +133,7 @@
.close {
margin-right: 1rem;
width: 2rem;
- path {
+ svg {
fill: $white;
}
}
diff --git a/app/styles/components/private.scss b/app/styles/components/private.scss
index 943986c3..9758e999 100644
--- a/app/styles/components/private.scss
+++ b/app/styles/components/private.scss
@@ -3,9 +3,7 @@
margin-left: .5rem;
width: .5rem;
svg {
- @include svg-size();
- }
- path {
+ @include svg-size(.5rem);
fill: $gray-light;
transition: fill .3s linear;
}
diff --git a/app/styles/components/summary.scss b/app/styles/components/summary.scss
index 7e789061..ee01cf4b 100644
--- a/app/styles/components/summary.scss
+++ b/app/styles/components/summary.scss
@@ -139,8 +139,11 @@ $summary-background: $grayer;
margin-right: 2rem;
}
.icon {
- font-size: 1.4rem;
+ fill: currentColor;
+ height: 1.5rem;
margin-right: .4rem;
+ vertical-align: middle;
+ width: 1.5rem;
&.icon-stats {
color: $primary;
float: right;
@@ -171,10 +174,11 @@ $summary-background: $grayer;
margin-bottom: 1rem;
padding: 2rem 6rem;
svg {
- @include svg-size(5rem);
- flex-basis: 5rem;
+ @include svg-size(4rem);
+ flex-basis: 4rem;
flex-shrink: 0;
- margin-right: 1rem;
+ fill: $primary-dark;
+ margin-right: 2rem;
}
p {
margin: 0;
@@ -189,9 +193,6 @@ $summary-background: $grayer;
margin: 0;
text-transform: uppercase;
}
- path {
- fill: $primary-dark;
- }
a {
@extend %bold;
animation: blink 2s infinite;
diff --git a/app/styles/components/tag.scss b/app/styles/components/tag.scss
index 235c061f..2e0254ac 100644
--- a/app/styles/components/tag.scss
+++ b/app/styles/components/tag.scss
@@ -41,8 +41,15 @@
margin-right: .25rem;
padding: .4rem;
width: 14rem;
- +.icon-floppy {
- margin-left: .5rem;
+ }
+ .icon-save {
+ @include svg-size();
+ cursor: pointer;
+ fill: $grayer;
+ margin-left: .5rem;
+ &:hover {
+ fill: $primary;
+ transition: .2s linear;
}
}
.tag {
@@ -50,14 +57,23 @@
margin: 0 .5rem .5rem 0;
padding: .5rem;
}
+ .icon-close {
+ @include svg-size(.7rem);
+ fill: $gray-light;
+ margin-left: .25rem;
+ &:hover {
+ cursor: pointer;
+ fill: $red;
+ }
+ }
.add-tag {
color: $gray-light;
&:hover {
color: $primary-light;
}
}
- .icon-plus {
- @extend %large;
+ .icon-add {
+ @include svg-size(.9rem);
}
.add-tag-text {
@extend %small;
diff --git a/app/styles/components/taskboard-task.scss b/app/styles/components/taskboard-task.scss
index 65788966..7fa2daa4 100644
--- a/app/styles/components/taskboard-task.scss
+++ b/app/styles/components/taskboard-task.scss
@@ -8,8 +8,8 @@
&:hover {
.icon-edit,
.icon-drag-h {
- color: $card-dark;
display: block;
+ fill: $card-dark;
opacity: 1;
transition: color .3s linear, opacity .3s linear;
}
@@ -25,14 +25,14 @@
background: $red;
border: 1px solid darken($red, 10%);
color: $white;
- a,
+ svg,
span {
color: $white;
+ fill: $white;
}
&:hover {
- .icon-edit,
- .icon-drag-h {
- color: $white;
+ .icon-edit {
+ fill: currentColor;
}
}
}
@@ -80,14 +80,15 @@
}
}
.icon-iocaine {
- @extend %large;
background: $black;
border-radius: 5px;
- color: $white;
+ fill: $white;
+ height: 1.75rem;
left: .2rem;
- padding: .1rem;
+ padding: .25rem;
position: absolute;
top: 1rem;
+ width: 1.75rem;
}
.task-assigned {
@extend %small;
@@ -118,26 +119,21 @@
bottom: .5rem;
position: absolute;
}
- .icon-edit,
- .icon-drag-h {
- @extend %large;
+ .icon-edit {
+ @include svg-size(1.1rem);
bottom: .5rem;
- color: $card-hover;
+ cursor: pointer;
+ fill: $card-hover;
opacity: 0;
position: absolute;
&:hover {
- color: $card-dark;
+ fill: $card-dark;
}
}
.icon-edit,
.loading {
right: 1rem;
}
- .icon-drag-h {
- @extend %xlarge;
- cursor: move;
- right: 45%;
- }
}
.task-drag {
diff --git a/app/styles/components/track-btn.scss b/app/styles/components/track-btn.scss
index ba944611..b4c108e9 100644
--- a/app/styles/components/track-btn.scss
+++ b/app/styles/components/track-btn.scss
@@ -12,25 +12,23 @@
display: inline-flex;
position: relative;
.track-inner {
- align-items: stretch;
+ align-items: center;
background: $whitish;
border-radius: 4px 0 0 4px;
display: flex;
flex: 1;
flex-basis: 140px;
+ justify-content: flex-start;
margin-right: .1rem;
min-width: 140px;
&:hover {
background: darken($whitish, 5%);
transition: background .3s;
}
- span {
- align-self: center;
- }
- .icon-arrow-up {
- margin-left: auto;
- padding: 0 .5rem;
- transform: rotate(180deg);
+ .icon-arrow-down {
+ height: .6rem;
+ margin: 0 .5rem 0 auto;
+ width: .6rem;
}
}
&:hover {
@@ -41,7 +39,7 @@
background: rgba($primary-light, .2);
}
.track-icon {
- path {
+ svg {
fill: $primary;
}
}
@@ -53,13 +51,9 @@
.track-icon {
padding: .3rem .6rem .3rem .75rem;
svg {
- height: 1.1rem;
+ fill: $grayer;
position: relative;
top: 2px;
- width: 1.1rem;
- }
- path {
- fill: $grayer;
}
}
.track-button-counter {
@@ -79,7 +73,7 @@
color: $whitish;
transition: background .3s;
}
- path {
+ svg {
fill: $red-light;
}
}
@@ -121,7 +115,7 @@
.watch-check {
height: 1.25rem;
width: 1.25rem;
- path {
+ svg {
fill: $primary-light;
}
}
@@ -155,7 +149,7 @@
background: rgba($primary-light, .2);
color: $primary;
transition: all .3s;
- path {
+ svg {
fill: $primary;
}
}
@@ -163,22 +157,18 @@
background: $red;
color: $whitish;
svg {
+ fill: $red-light;
transform: rotate(180deg);
transition: all .3s;
}
- path {
- fill: $red-light;
- }
}
}
svg {
+ fill: $gray-light;
height: 1rem;
width: 1rem;
}
span {
display: block;
}
- path {
- fill: $gray-light;
- }
}
diff --git a/app/styles/components/user-list.scss b/app/styles/components/user-list.scss
index 299014ae..01771bc1 100644
--- a/app/styles/components/user-list.scss
+++ b/app/styles/components/user-list.scss
@@ -47,12 +47,16 @@
position: relative;
transition: background .3s linear;
transition-delay: .1s;
- .icon-delete {
- opacity: 1;
- position: absolute;
- right: 1rem;
- top: 1.5rem;
- transition: opacity .2s ease-in;
+ }
+ .remove-assigned-to {
+ fill: $grayer;
+ opacity: 1;
+ position: absolute;
+ right: 1rem;
+ top: 1.5rem;
+ transition: all .2s ease-in;
+ &:hover {
+ fill: $red;
}
}
}
@@ -63,7 +67,7 @@
margin-top: 1rem;
.user-list-single {
&:hover {
- .icon-delete {
+ .delete-watcher {
opacity: 1;
transition: opacity .2s ease-in;
}
@@ -73,14 +77,16 @@
flex: 1;
position: relative;
}
- .icon-delete {
+ .delete-watcher {
+ cursor: pointer;
+ fill: currentColor;
opacity: 0;
position: absolute;
right: .5rem;
top: 0;
transition: all .2s ease-in;
&:hover {
- color: $red;
+ fill: $red;
transition: color .3s ease-in;
}
}
diff --git a/app/styles/core/base.scss b/app/styles/core/base.scss
index c2eba8f0..fdec382a 100644
--- a/app/styles/core/base.scss
+++ b/app/styles/core/base.scss
@@ -82,10 +82,6 @@ body {
padding: 1rem 2rem;
}
-.icon {
- @extend %taiga;
-}
-
.hidden {
// scss-lint:disable ImportantRule
display: none !important;
diff --git a/app/styles/core/elements.scss b/app/styles/core/elements.scss
index cfd2bbf5..3dc9f83e 100644
--- a/app/styles/core/elements.scss
+++ b/app/styles/core/elements.scss
@@ -31,10 +31,6 @@ sup {
vertical-align: super;
}
-.icon {
- vertical-align: middle;
-}
-
.clickable {
cursor: pointer;
}
diff --git a/app/styles/core/forms.scss b/app/styles/core/forms.scss
index 238bdbd8..ebd15ecd 100644
--- a/app/styles/core/forms.scss
+++ b/app/styles/core/forms.scss
@@ -41,9 +41,11 @@ textarea {
}
}
.icon-capslock {
- bottom: .6rem;
- color: $gray;
+ bottom: .8rem;
display: none;
+ fill: $gray;
+ height: .9rem;
position: absolute;
right: 1rem;
+ width: .9rem;
}
diff --git a/app/styles/core/typography.scss b/app/styles/core/typography.scss
index f353c83c..18b984e4 100755
--- a/app/styles/core/typography.scss
+++ b/app/styles/core/typography.scss
@@ -117,188 +117,3 @@ a:visited {
transition: color .3s linear;
}
}
-
-// Taiga Icons
-[data-icon]::before {
-
- // scss-lint:disable ImportantRule
- content: attr(data-icon);
- font-family: 'taiga' !important;
- -moz-osx-font-smoothing: grayscale;
- -webkit-font-smoothing: antialiased;
- font-style: normal !important;
- font-variant: normal !important;
- font-weight: normal !important;
- line-height: 1;
- speak: none;
- text-transform: none !important;
-}
-
-[class^='icon-']::before,
-[class*=' icon-']::before {
-
- // scss-lint:disable ImportantRule
- font-family: 'taiga' !important;
- -moz-osx-font-smoothing: grayscale;
- -webkit-font-smoothing: antialiased;
- font-style: normal !important;
- font-variant: normal !important;
- font-weight: normal !important;
- line-height: 1;
- speak: none;
- text-transform: none !important;
-}
-
-.icon-bug::before {
- content: 'a';
-}
-.icon-copy::before {
- content: 'b';
-}
-.icon-minimize::before {
- content: 'c';
-}
-.icon-maximize::before {
- content: 'd';
-}
-.icon-comment::before {
- content: 'e';
-}
-.icon-plus::before {
- content: 'f';
-}
-.icon-attachments::before {
- content: 'g';
-}
-.icon-edit::before {
- content: 'h';
-}
-.icon-documents::before {
- content: 'i';
-}
-.icon-delete::before {
- content: 'j';
-}
-.icon-arrow-bottom::before {
- content: 'k';
-}
-.icon-arrow-left::before {
- content: 'l';
-}
-.icon-arrow-right::before {
- content: 'm';
-}
-.icon-arrow-up::before {
- content: 'n';
-}
-.icon-briefcase::before {
- content: 'o';
-}
-.icon-caret-down::before {
- content: 'p';
-}
-.icon-caret-up::before {
- content: 'q';
-}
-.icon-check-square::before {
- content: 'r';
-}
-.icon-notification-error::before {
- content: 's';
-}
-.icon-settings::before {
- content: 't';
-}
-.icon-document::before {
- content: 'u';
-}
-.icon-warning::before {
- content: 'v';
-}
-.icon-move::before {
- content: 'w';
-}
-.icon-drag-v::before {
- content: 'x';
-}
-.icon-filter::before {
- content: 'y';
-}
-.icon-help::before {
- content: 'z';
-}
-.icon-reload::before {
- content: 'A';
-}
-.icon-writer::before {
- content: 'B';
-}
-.icon-stats::before {
- content: 'C';
-}
-.icon-floppy::before {
- content: 'D';
-}
-.icon-warning-alt::before {
- content: 'E';
-}
-.icon-video::before {
- content: 'F';
-}
-.icon-bulk::before {
- content: 'G';
-}
-.icon-vunfold::before {
- content: 'H';
-}
-.icon-tasks::before {
- content: 'I';
-}
-.icon-kanban::before {
- content: 'J';
-}
-.icon-search::before {
- content: 'K';
-}
-.icon-wiki::before {
- content: 'L';
-}
-.icon-team::before {
- content: 'M';
-}
-.icon-vfold::before {
- content: 'N';
-}
-.icon-issues::before {
- content: 'O';
-}
-.icon-iocaine::before {
- content: 'P';
-}
-.icon-archive::before {
- content: 'Q';
-}
-.icon-capslock::before {
- content: 'R';
-}
-.icon-upload::before {
- content: 'S';
-}
-.icon-github::before {
- content: 'T';
-}
-.icon-timeline::before {
- content: 'U';
-}
-.icon-scrum::before {
- content: 'V';
-}
-.icon-project::before {
- content: 'W';
-}
-.icon-heart::before {
- content: 'X';
-}
-.icon-eye::before {
- content: 'Y';
-}
diff --git a/app/styles/dependencies/helpers.scss b/app/styles/dependencies/helpers.scss
index 15e473ee..df38b422 100644
--- a/app/styles/dependencies/helpers.scss
+++ b/app/styles/dependencies/helpers.scss
@@ -12,7 +12,6 @@
%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';}
%lightbox {
@@ -25,14 +24,17 @@
top: 0;
z-index: 99910;
.close {
- @extend %xlarge;
- color: $gray;
+ cursor: pointer;
+ fill: $gray;
position: absolute;
- right: 2rem;
- top: 1rem;
- transition: color .2s;
+ right: 3rem;
+ top: 3rem;
+ transition: fill .2s;
&:hover {
- color: $primary;
+ fill: $red-light;
+ }
+ svg {
+ @include svg-size(2rem);
}
}
&.open {
diff --git a/app/styles/dependencies/mixins.scss b/app/styles/dependencies/mixins.scss
index b9101fad..58fa132d 100644
--- a/app/styles/dependencies/mixins.scss
+++ b/app/styles/dependencies/mixins.scss
@@ -120,24 +120,18 @@
display: flex;
.icon {
display: block;
- margin-right: .2rem;
- width: 16px;
+ margin-right: .25rem;
}
&.active {
color: $primary;
- path {
+ .icon {
fill: currentcolor;
}
}
}
.icon {
- svg {
- height: 1rem;
- width: 1rem;
- }
- path {
- fill: currentcolor;
- }
+ @include svg-size(.75rem);
+ fill: $gray-light;
}
}
diff --git a/app/styles/dependencies/mixins/project-card.scss b/app/styles/dependencies/mixins/project-card.scss
index 2d1102e8..1c6e6365 100644
--- a/app/styles/dependencies/mixins/project-card.scss
+++ b/app/styles/dependencies/mixins/project-card.scss
@@ -26,7 +26,8 @@
margin-top: auto;
svg {
@include svg-size(.8rem);
- fill: $gray-light;
+ fill: currentColor;
+ margin-right: .25rem;
}
.svg-eye-closed {
display: none;
@@ -40,7 +41,7 @@
&.active {
color: $primary;
svg {
- fill: $primary;
+ fill: currentColor;
}
}
}
@@ -71,10 +72,8 @@
}
}
.look-for-people {
- svg {
- @include svg-size(1rem);
- fill: $gray-light;
- margin: 0 .5rem;
- }
+ @include svg-size(1rem);
+ fill: $gray-light;
+ margin: 0 .5rem;
}
}
diff --git a/app/styles/layout/backlog.scss b/app/styles/layout/backlog.scss
index 77b905f8..044a93b4 100644
--- a/app/styles/layout/backlog.scss
+++ b/app/styles/layout/backlog.scss
@@ -11,8 +11,8 @@
padding: .4rem 1.5rem;
&.active,
&:hover {
- background: $gray;
- color: $whitish;
+ background: $gray-light;
+ color: $gray;
}
&.active {
&:hover {
diff --git a/app/styles/layout/ticket-detail.scss b/app/styles/layout/ticket-detail.scss
index b71fbed5..c2289163 100644
--- a/app/styles/layout/ticket-detail.scss
+++ b/app/styles/layout/ticket-detail.scss
@@ -79,7 +79,7 @@
width: 100%;
}
.us-title-text:hover {
- .icon-edit {
+ .edit {
opacity: 1;
transition: opacity .3s linear;
}
@@ -99,13 +99,13 @@
padding-right: 1rem;
width: 100%;
}
- .icon-edit,
- .icon-floppy {
- @extend %large;
- color: $gray-light;
+ .edit,
+ .save {
+ cursor: pointer;
+ fill: $gray-light;
margin-left: .5rem;
}
- .icon-edit {
+ .edit {
opacity: 0;
}
.us-related-task {
@@ -167,8 +167,9 @@
position: absolute;
right: 1rem;
top: 1rem;
- a {
- @extend %xlarge;
+ svg {
+ @include svg-size(1.2rem);
+ fill: currentColor;
}
}
@@ -202,6 +203,7 @@
&:hover {
.view-description {
.edit {
+
opacity: 1;
top: -1.5rem;
transition: all .2s linear;
@@ -240,23 +242,28 @@
}
}
.edit {
- color: $grayer;
+ cursor: pointer;
+ fill: $gray;
}
.view-description {
.edit {
background: $whitish;
+ height: 2rem;
left: 0;
opacity: 0;
padding: .2rem .5rem;
position: absolute;
top: 0;
transition: all .2s linear;
+ width: 2rem;
}
}
.edit-description {
margin-bottom: 2rem;
.save {
- top: .4rem;
+ cursor: pointer;
+ position: relative;
+ top: .3rem;
}
.edit {
position: absolute;
diff --git a/app/styles/layout/wiki.scss b/app/styles/layout/wiki.scss
index 50134ab9..dbec51e2 100644
--- a/app/styles/layout/wiki.scss
+++ b/app/styles/layout/wiki.scss
@@ -7,13 +7,11 @@
@extend %small;
color: $gray-light;
&:hover {
- span {
- color: $grayer;
- transition: color .2s linear;
- }
+ color: $red-light;
+ transition: color .1s linear;
.icon {
- color: $red;
- transition: color .2s linear;
+ fill: $red-light;
+ transition: fill .1s linear;
}
}
.icon {
@@ -43,20 +41,25 @@
transition: all .2s linear;
}
}
- .edit {
- background: $whitish;
- left: 0;
- opacity: 0;
- padding: .2rem .5rem;
- position: absolute;
- top: 0;
- transition: all .2s linear;
+ }
+ .edit {
+ @include svg-size(2rem);
+ background: $whitish;
+ left: 0;
+ opacity: 0;
+ padding: .2rem .5rem;
+ position: absolute;
+ top: 0;
+ transition: all .2s linear;
+ &:hover {
+ cursor: pointer;
}
}
.edit-wiki-content {
.icon {
&:hover {
- color: $grayer;
+ cursor: pointer;
+ fill: $primary-dark;
opacity: .3;
transition: all .2s linear;
}
diff --git a/app/styles/modules/admin/admin-common.scss b/app/styles/modules/admin/admin-common.scss
index b247f1e2..fe3fe486 100644
--- a/app/styles/modules/admin/admin-common.scss
+++ b/app/styles/modules/admin/admin-common.scss
@@ -10,11 +10,13 @@
}
.total {
@extend %large;
+ align-items: center;
background-color: $whitish;
color: $grayer;
+ display: flex;
padding: .3rem 1rem;
&:hover {
- .edit-value {
+ .icon-edit {
opacity: 1;
transition: opacity .3s linear;
}
diff --git a/app/styles/modules/admin/admin-custom-attributes.scss b/app/styles/modules/admin/admin-custom-attributes.scss
index ee7a21d5..ef5a1767 100644
--- a/app/styles/modules/admin/admin-custom-attributes.scss
+++ b/app/styles/modules/admin/admin-custom-attributes.scss
@@ -27,7 +27,7 @@
background: rgba($primary-light, .05);
cursor: move;
transition: background .2s linear;
- .icon-drag-v,
+ .icon-drag,
.custom-options {
opacity: 1;
transition: opacity .2s linear;
@@ -47,15 +47,15 @@
border-bottom: 1px solid $whitish;
color: $gray;
}
- .icon-drag-v {
- color: $gray-light;
+ .icon-drag {
+ fill: $gray-light;
opacity: 0;
padding: 0 .1rem;
transition: color .2s linear;
vertical-align: middle;
&:hover {
- color: $gray;
cursor: move;
+ fill: $gray;
transition: color .2s linear;
}
}
@@ -83,15 +83,20 @@
flex-shrink: 0;
opacity: 0;
text-align: center;
- a {
- color: $gray-light;
+ svg {
+ cursor: pointer;
+ fill: $gray-light;
margin-right: .5rem;
transition: color .2s linear;
vertical-align: middle;
&:hover {
- color: $primary;
+ fill: $primary;
transition: color .2s linear;
}
+ &.icon-trash,
+ &.icon-close {
+ fill: $red-light;
+ }
}
}
.custom-options-wrapper {
diff --git a/app/styles/modules/admin/admin-functionalities.scss b/app/styles/modules/admin/admin-functionalities.scss
index 1a02ff99..e928d937 100644
--- a/app/styles/modules/admin/admin-functionalities.scss
+++ b/app/styles/modules/admin/admin-functionalities.scss
@@ -23,10 +23,10 @@
opacity: 1;
}
.icon {
- @extend %xxlarge;
- flex-basis: 60px;
- margin: 0 auto;
- min-width: 60px;
+ fill: $gray;
+ height: 3rem;
+ margin: 1rem auto;
+ width: 3rem;
}
.desc {
text-align: center;
diff --git a/app/styles/modules/admin/admin-membership-table.scss b/app/styles/modules/admin/admin-membership-table.scss
index 93b42f1d..5780eaf9 100644
--- a/app/styles/modules/admin/admin-membership-table.scss
+++ b/app/styles/modules/admin/admin-membership-table.scss
@@ -62,10 +62,10 @@
}
}
.delete {
- @extend %large;
- color: $gray-light;
+ fill: $gray-light;
+ transition: fill .2s;
&:hover {
- color: $red;
+ fill: $red;
}
}
.pending {
diff --git a/app/styles/modules/admin/admin-roles.scss b/app/styles/modules/admin/admin-roles.scss
index b11656d4..cd817290 100644
--- a/app/styles/modules/admin/admin-roles.scss
+++ b/app/styles/modules/admin/admin-roles.scss
@@ -4,13 +4,23 @@
@extend %light;
color: $grayer;
}
- .edit-value {
- @extend %medium;
- color: $gray-light;
+ .icon {
+ &:hover {
+ fill: $primary;
+ transition: fill .2s linear;
+ }
+ }
+ .icon-edit {
cursor: pointer;
+ fill: $gray-light;
margin-left: .5rem;
opacity: 0;
- transition: opacity .3s linear;
+ transition: opacity .2s linear;
+ }
+ .icon-save {
+ fill: $gray-light;
+ margin-left: .5rem;
+ transition: fill .2s linear;
}
.edit-role {
background-color: $whitish;
@@ -21,15 +31,6 @@
background-color: $white;
width: 50%;
}
- .icon-floppy {
- color: $gray-light;
- margin-left: .5rem;
- transition: color.3s linear;
- &:hover {
- color: $primary;
- transition: color.3s linear;
- }
- }
}
.any-computable-role {
background: $red;
diff --git a/app/styles/modules/admin/admin-third-parties-webhooks.scss b/app/styles/modules/admin/admin-third-parties-webhooks.scss
index 8ef4fa0c..825314eb 100644
--- a/app/styles/modules/admin/admin-third-parties-webhooks.scss
+++ b/app/styles/modules/admin/admin-third-parties-webhooks.scss
@@ -1,5 +1,6 @@
.admin-webhooks {
.webhooks-table {
+ margin-bottom: 1rem;
.row {
border-bottom: 0;
padding: .5rem 0;
@@ -60,14 +61,13 @@
min-width: 100px;
text-align: center;
a {
- color: $gray-light;
margin-right: .5rem;
- transition: color .2s linear;
- vertical-align: middle;
+ }
+ svg {
+ fill: $gray-light;
&:hover {
- color: $primary;
- transition: color .2s linear;
-
+ fill: $primary;
+ transition: fill .2s linear;
}
}
}
diff --git a/app/styles/modules/admin/project-csv.scss b/app/styles/modules/admin/project-csv.scss
index e6f16a08..4c370888 100644
--- a/app/styles/modules/admin/project-csv.scss
+++ b/app/styles/modules/admin/project-csv.scss
@@ -13,8 +13,12 @@
@extend %small;
min-width: 110px;
}
- .icon {
+ .icon:not(.icon-clipboard) {
+ fill: currentColor;
+ height: .9rem;
margin-right: .3rem;
+ vertical-align: middle;
+ width: .9rem;
}
}
.field-with-options {
diff --git a/app/styles/modules/admin/project-values.scss b/app/styles/modules/admin/project-values.scss
index 7ef3ae5b..d55a0516 100644
--- a/app/styles/modules/admin/project-values.scss
+++ b/app/styles/modules/admin/project-values.scss
@@ -9,11 +9,11 @@
position: relative;
}
.icon {
- @extend %large;
- color: $gray-light;
+ cursor: pointer;
+ fill: $gray-light;
opacity: 0;
&:hover {
- color: $grayer;
+ fill: $grayer;
transition: all .2s ease-in;
}
}
@@ -61,16 +61,10 @@
}
.project-values-settings {
- a {
- @extend %large;
- color: $gray;
+ svg {
margin-right: .5rem;
- &:hover {
- color: $primary;
- transition: color .3s linear;
- .icon-delete {
- color: $red;
- }
+ &.icon-trash {
+ fill: $red-light;
}
}
}
diff --git a/app/styles/modules/backlog/backlog-table.scss b/app/styles/modules/backlog/backlog-table.scss
index 9b84249f..934d5b64 100644
--- a/app/styles/modules/backlog/backlog-table.scss
+++ b/app/styles/modules/backlog/backlog-table.scss
@@ -28,25 +28,12 @@
flex-grow: 0;
flex-shrink: 0;
}
- .votes {
- color: $gray;
- flex-basis: 65px;
- flex-grow: 0;
- flex-shrink: 0;
- text-align: center;
- &.inactive {
- color: $gray-light;
- }
- &.is-voted {
- color: $primary-light;
- }
- }
.user-stories {
overflow: hidden;
width: 100%;
}
.status {
- flex-basis: 100px;
+ flex-basis: 120px;
flex-grow: 0;
flex-shrink: 0;
}
@@ -56,6 +43,30 @@
}
}
+ .votes {
+ color: $gray;
+ flex-basis: 65px;
+ flex-grow: 0;
+ flex-shrink: 0;
+ text-align: center;
+ &.inactive {
+ color: $gray-light;
+ svg {
+ fill: $gray-light;
+ }
+ }
+ &.is-voted {
+ color: $primary-light;
+ fill: $primary-light;
+ }
+ svg {
+ fill: $gray;
+ height: .75rem;
+ margin-right: .25rem;
+ vertical-align: middle;
+ width: .75rem;
+ }
+ }
.status,
.points {
position: relative;
@@ -70,7 +81,8 @@
}
}
.icon {
- color: $gray-light;
+ @include svg-size(.75rem);
+ fill: currentColor;
margin-left: .2rem;
}
}
@@ -122,7 +134,7 @@
@extend %medium;
border-bottom: 2px solid $gray-light;
flex-wrap: nowrap;
- padding-right: 30px;
+ padding-right: 1rem;
}
.points {
cursor: pointer;
@@ -145,7 +157,7 @@
transition: background .2s ease-in;
transition-delay: .2s;
.us-settings,
- .icon-drag-v {
+ .icon-drag {
opacity: 1;
transition: all .2s ease-in;
}
@@ -165,6 +177,11 @@
cursor: text;
}
}
+ .icon-arrow-down {
+ fill: $gray-light;
+ height: .7rem;
+ width: .7rem;
+ }
}
.sortable-placeholder {
background: $whitish;
@@ -241,26 +258,24 @@
top: -3px;
}
}
- .us-settings a,
- .icon-drag-v {
- @extend %large;
- color: $gray-light;
- transition: all .2s ease-in;
- width: 30px;
- &:hover {
- color: $grayer;
- transition: all .2s ease-in;
- }
- }
.us-settings {
flex-shrink: 0;
- margin: 0 0 0 2rem;
+ margin-left: 2rem;
opacity: 0;
+ svg {
+ fill: $gray-light;
+ margin-right: .5rem;
+ transition: fill .2s ease-in;
+ &:hover {
+ fill: $primary-light;
+ }
+ }
}
- .icon-drag-v {
+ .icon-drag {
cursor: move;
+ fill: $gray-light;
opacity: 0;
- padding: .1rem .5rem 0 0;
+ padding: .1rem;
}
.readonly {
cursor: auto;
diff --git a/app/styles/modules/backlog/sprints.scss b/app/styles/modules/backlog/sprints.scss
index 7ba4d2cb..7029229d 100644
--- a/app/styles/modules/backlog/sprints.scss
+++ b/app/styles/modules/backlog/sprints.scss
@@ -16,13 +16,9 @@
background: $primary-light;
}
svg {
- height: 1.4rem;
- max-height: 1.4rem;
- max-width: 1.5rem;
- width: 1.5rem;
- }
- path {
fill: $whitish;
+ height: 1.4rem;
+ width: 1.5rem;
}
}
.filter-closed-sprints {
@@ -53,7 +49,7 @@
@extend %title;
@include ellipsis($width: 90%);
display: inline-block;
- margin-right: 3px;
+ margin-right: .5rem;
}
}
.sprint {
@@ -69,24 +65,8 @@
transition: opacity .2s ease-in;
}
}
- .icon {
- display: inline-block;
- }
- .icon-arrow-up {
- transform: rotate(90deg);
- transition: all .2s linear;
- vertical-align: baseline;
- &.active {
- transform: rotate(180deg);
- transition: all .2s linear;
- }
- &:hover {
- color: $primary-light;
- transition: color .2s linear;
- }
- }
- .icon-edit {
- color: $gray-light;
+ .edit-sprint {
+ fill: $gray-light;
opacity: 0;
position: absolute;
right: 0;
@@ -94,8 +74,9 @@
transition: opacity .2s ease-in;
vertical-align: baseline;
&:hover {
- color: $primary;
- transition: color .2s ease-in;
+ cursor: pointer;
+ fill: $primary;
+ transition: fill .2s ease-in;
}
}
.number {
@@ -129,6 +110,20 @@
}
}
}
+ .compact-sprint {
+ transform: rotate(0);
+ transition: all .2s;
+ &.active {
+ transform: rotate(90deg);
+ transition: all .2s;
+ }
+ &:hover {
+ .icon {
+ fill: $primary-light;
+ transition: color .2s;
+ }
+ }
+ }
.sprint-progress-bar {
background: $gray-light;
border-radius: 2px;
diff --git a/app/styles/modules/backlog/taskboard-table.scss b/app/styles/modules/backlog/taskboard-table.scss
index dae0c4fb..67ed9612 100644
--- a/app/styles/modules/backlog/taskboard-table.scss
+++ b/app/styles/modules/backlog/taskboard-table.scss
@@ -89,11 +89,12 @@ $column-margin: 0 10px 0 0;
}
.icon {
@extend %medium;
- color: $gray-light;
+ fill: $gray-light;
margin-right: .3rem;
- transition: color .2s linear;
+ transition: fill .2s linear;
&:hover {
- color: $primary;
+ cursor: pointer;
+ fill: $primary;
}
&.hfold,
&.hunfold {
@@ -157,8 +158,8 @@ $column-margin: 0 10px 0 0;
background: rgba($red, .6);
}
- .taskboard-userstory-box a,
- .taskboard-userstory-box a:hover,
+ .taskboard-userstory-box svg,
+ .taskboard-userstory-box svg:hover,
.points-value,
.points-value:hover {
color: $white;
@@ -174,7 +175,7 @@ $column-margin: 0 10px 0 0;
@include ellipsis(100%);
}
.points-value,
- .icon-plus,
+ .icon-add,
.icon-bulk {
display: none;
}
@@ -184,21 +185,23 @@ $column-margin: 0 10px 0 0;
.taskboard-userstory-box {
padding: .5rem .5rem .5rem 1.5rem;
.icon {
- color: $gray-light;
+ cursor: pointer;
+ fill: $gray-light;
position: absolute;
right: .5rem;
top: .7rem;
- transition: color .2s linear;
+ transition: fill .2s linear;
&:hover {
- color: $primary;
+ fill: $primary;
}
- &.icon-plus {
+ &.icon-add {
right: 2rem;
}
- &.icon-vfold,
- &.icon-vunfold {
+ &.icon-fold-row,
+ &.icon-unfold-row {
left: 0;
right: inherit;
+ top: 1rem;
}
}
}
diff --git a/app/styles/modules/common/assigned-to.scss b/app/styles/modules/common/assigned-to.scss
index 71a41c07..907c3255 100644
--- a/app/styles/modules/common/assigned-to.scss
+++ b/app/styles/modules/common/assigned-to.scss
@@ -7,11 +7,9 @@
padding: 1rem 0;
position: relative;
&:hover {
- .assigned-to {
- .icon-delete {
- opacity: 1;
- transition: opacity .3s linear;
- }
+ .remove-user {
+ opacity: 1;
+ transition: opacity .3s linear;
}
}
.loading-spinner {
@@ -60,15 +58,33 @@
.assigned-to-options {
display: inline-block;
}
- .icon-delete {
- color: $gray-light;
- opacity: 0;
- position: absolute;
- right: 0;
- top: 2rem;
+ .user-assigned,
+ .assign-to-me {
+ color: $primary;
+ cursor: default;
&:hover {
- color: $red;
+ cursor: pointer;
}
+ .icon {
+ fill: currentColor;
+ height: .75rem;
+ width: .75rem;
+ }
+ span {
+ @include ellipsis(80%);
+ }
+ }
+ }
+ .remove-user {
+ fill: $gray;
+ opacity: 0;
+ position: absolute;
+ right: .5rem;
+ top: 2rem;
+ &:hover {
+ cursor: pointer;
+ fill: $red;
+ transition: fill .2s;
}
}
.user-assigned,
diff --git a/app/styles/modules/common/category-config.scss b/app/styles/modules/common/category-config.scss
index d0a29f25..43a5479d 100644
--- a/app/styles/modules/common/category-config.scss
+++ b/app/styles/modules/common/category-config.scss
@@ -9,6 +9,15 @@
display: flex;
padding: 1rem;
position: relative;
+ &.open-drawer {
+ .icon {
+ transform: rotate(90deg);
+ }
+ }
+ }
+ .icon {
+ transform: rotate(0);
+ transition: all .4s;
}
.resume-title {
width: 280px;
@@ -35,11 +44,6 @@
}
}
}
- .icon {
- @extend %xlarge;
- flex: 1;
- text-align: right;
- }
.category-items {
@include slide(400px, hidden);
background-color: $whitish;
diff --git a/app/styles/modules/common/colors-table.scss b/app/styles/modules/common/colors-table.scss
index 314c87de..fa1f15bb 100644
--- a/app/styles/modules/common/colors-table.scss
+++ b/app/styles/modules/common/colors-table.scss
@@ -10,6 +10,21 @@
padding-left: 50px;
}
}
+ .table-main {
+ .row:hover {
+ background: lighten($primary, 60%);
+ cursor: move;
+ transition: background .2s ease-in;
+ .icon {
+ opacity: 1;
+ transition: opacity .2s ease-in;
+ }
+ .options-column {
+ opacity: 1;
+ transition: opacity .3s linear;
+ }
+ }
+ }
form {
&:last-child {
.row {
@@ -23,19 +38,6 @@
display: flex;
justify-content: center;
padding: 1rem;
- &:hover {
- background: lighten($primary, 60%);
- cursor: move;
- transition: background .2s ease-in;
- .icon {
- opacity: 1;
- transition: opacity .2s ease-in;
- }
- .options-column {
- opacity: 1;
- transition: opacity .3s linear;
- }
- }
&:last-child {
border: 0;
}
@@ -112,26 +114,27 @@
width: 40px;
}
.icon {
- @extend %large;
- color: $gray-light;
+ cursor: pointer;
+ fill: $gray-light;
margin-right: 1rem;
opacity: 0;
&:hover {
- color: $primary;
+ fill: $primary;
transition: all .2s ease-in;
}
- &.icon-check-square {
+ &.icon-check {
+ cursor: default;
+ fill: $primary;
opacity: 1;
}
- }
- .icon-delete {
- &:hover {
- color: $red;
+ &.icon-drag {
+ cursor: move;
+ }
+ &.icon-trash {
+ &:hover {
+ fill: $red-light;
+ }
}
- }
- .icon-check-square {
- @extend %large;
- color: $primary;
}
}
diff --git a/app/styles/modules/common/custom-fields.scss b/app/styles/modules/common/custom-fields.scss
index ed9816b2..4adab4e5 100644
--- a/app/styles/modules/common/custom-fields.scss
+++ b/app/styles/modules/common/custom-fields.scss
@@ -8,15 +8,8 @@
display: flex;
justify-content: space-between;
padding: .5rem 1rem;
- .icon-arrow-bottom {
- @extend %large;
+ .icon {
cursor: pointer;
- transform: rotate(-90deg);
- transition: transform .2s linear;
- &.open {
- transform: rotate(0);
- transition: transform .2s linear;
- }
}
}
.custom-fields-body {
@@ -37,14 +30,16 @@
margin-top: .5rem;
}
}
- .custom-field-options {
- opacity: 0;
- transition: opacity .2s linear;
- a {
- color: $gray-light;
- }
- a:hover {
- color: $primary;
+ }
+ .custom-field-options {
+ margin: 0;
+ opacity: 0;
+ transition: opacity .2s linear;
+ svg {
+ cursor: pointer;
+ fill: $gray-light;
+ &:hover {
+ fill: $primary;
}
}
}
@@ -62,9 +57,6 @@
line-height: .9rem;
}
}
- .custom-field-options {
- margin: 0;
- }
.custom-field-value {
@extend %light;
align-items: flex-start;
diff --git a/app/styles/modules/common/history.scss b/app/styles/modules/common/history.scss
index 96e4fdf4..f39e2247 100644
--- a/app/styles/modules/common/history.scss
+++ b/app/styles/modules/common/history.scss
@@ -7,7 +7,7 @@
&:hover {
.icon {
color: $primary;
- transform: rotate(180deg);
+ transform: rotate(90deg);
transition: all .2s linear;
}
}
@@ -40,33 +40,40 @@
}
.history-tabs {
@extend %title;
- border-bottom: 3px solid $gray-light;
+ border-bottom: 1px solid $whitish;
+ border-top: 1px solid $whitish;
margin-bottom: 0;
- padding: .5rem 0;
li {
@extend %large;
display: inline-block;
&:first-child {
- border-right: 1px solid $gray-light;
+ border-right: 1px solid $whitish;
}
&:last-child {
border-right: 0;
}
}
a {
+ background: $white;
color: $gray-light;
- padding: 0 2rem;
+ display: inline-block;
+ padding: .5rem 2rem;
+ position: relative;
transition: color .2s ease-in;
&.active {
- color: $grayer;
+ color: $primary;
+ top: 1px;
}
&:hover {
- color: $primary;
+ color: $grayer;
transition: color .2s ease-in;
}
}
.icon {
+ fill: currentColor;
+ height: .75rem;
margin-right: .5rem;
+ width: .75rem;
}
}
.add-comment {
@@ -110,6 +117,14 @@
.preview-icon {
position: absolute;
right: 1rem;
+ top: .5rem;
+ }
+ .edit {
+ fill: $gray-light;
+ &:hover {
+ cursor: pointer;
+ fill: $primary;
+ }
}
.preview-icon {
opacity: 0;
@@ -252,14 +267,15 @@
margin-bottom: 0;
}
.comment-delete {
- color: $red;
+ cursor: pointer;
+ fill: $red-light;
opacity: 0;
position: absolute;
- right: 0;
+ right: .5rem;
top: 2rem;
transition: all .2s linear;
&:hover {
- color: $red-light;
+ fill: $red;
transition: color .2s linear;
}
}
diff --git a/app/styles/modules/common/lightbox.scss b/app/styles/modules/common/lightbox.scss
index 7f57453c..01347548 100644
--- a/app/styles/modules/common/lightbox.scss
+++ b/app/styles/modules/common/lightbox.scss
@@ -159,9 +159,6 @@
margin-left: .5rem;
}
}
- .icon-delete {
- @extend %large;
- }
}
.extra-text {
margin-top: 1rem;
@@ -173,13 +170,18 @@
width: 80%;
}
.icon {
- @extend %large;
+ fill: $gray;
margin-left: .5rem;
+ transition: fill .2s;
}
- .icon-delete {
- @extend %xlarge;
+ .icon-add {
&:hover {
- color: $red;
+ fill: $primary-light;
+ }
+ }
+ .icon-trash {
+ &:hover {
+ fill: $red;
}
}
.button {
@@ -234,17 +236,18 @@
}
.delete-sprint {
@extend %small;
- color: $grayer;
- display: block;
- margin-top: 1rem;
- text-align: right;
- a {
- color: $gray-light;
- margin-left: .5rem;
+ color: $gray;
+ float: right;
+ margin: 1rem .25rem 0 0;
+ transition: color .3s linear;
+ .icon {
+ fill: currentColor;
+ }
+ &:hover {
+ color: $red;
transition: color .3s linear;
- &:hover {
- color: $red;
- transition: color .3s linear;
+ .icon {
+ fill: currentColor;
}
}
}
diff --git a/app/styles/modules/common/nav.scss b/app/styles/modules/common/nav.scss
index 5f49450c..15f9db96 100644
--- a/app/styles/modules/common/nav.scss
+++ b/app/styles/modules/common/nav.scss
@@ -23,15 +23,17 @@ tg-project-menu {
position: relative;
text-align: center;
a {
- color: $white;
display: block;
- padding: .75rem .8rem;
+ padding: 1.1rem .8rem;
position: relative;
}
a:hover {
background: rgba($black, .2);
- color: $primary-light;
transition: color .3s linear;
+ svg {
+ fill: $primary-light;
+ transition: fill .3s linear;
+ }
.helper {
@extend %small;
animation: slideLeft 200ms ease-in-out both;
@@ -60,6 +62,7 @@ tg-project-menu {
}
}
svg {
+ fill: $white;
height: 1.5rem;
width: 1.5rem;
path {
diff --git a/app/styles/modules/common/related-tasks.scss b/app/styles/modules/common/related-tasks.scss
index e3aa2231..241cb037 100644
--- a/app/styles/modules/common/related-tasks.scss
+++ b/app/styles/modules/common/related-tasks.scss
@@ -101,7 +101,8 @@
}
}
.icon {
- color: $gray-light;
+ @include svg-size(.8rem);
+ fill: $gray-light;
margin-left: .2rem;
opacity: 0;
}
@@ -116,6 +117,7 @@
}
.task-name {
display: flex;
+ justify-content: space-between;
position: relative;
a {
display: inline-block;
@@ -123,6 +125,10 @@
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
+ svg,
+ span {
+ margin-right: .25rem;
+ }
}
svg,
span {
@@ -144,26 +150,6 @@
}
}
}
- .blocked,
- .blocked:hover {
- background: $red-light;
- color: $white;
- a {
- color: $white;
- &:hover {
- color: $white;
- }
- }
- .icon {
- color: $white;
- &:hover {
- color: $white;
- }
- }
- }
- .icon-iocaine {
- display: none;
- }
.iocaine,
.iocaine:hover {
background: rgba($primary-light, .3);
@@ -173,21 +159,48 @@
margin-right: .5rem;
vertical-align: top;
}
+ a,
+ svg {
+ color: $primary-dark;
+ fill: $primary-dark;
+ &:hover {
+ color: currentColor;
+ fill: currentColor;
+ }
+ }
+ }
+ .blocked,
+ .blocked:hover {
+ background: $red-light;
+ color: $white;
+ a,
+ svg {
+ color: $white;
+ fill: $white;
+ &:hover {
+ color: currentColor;
+ fill: currentColor;
+ }
+ }
+ }
+ .icon-iocaine {
+ display: none;
}
.task-settings {
- margin: 0 0 0 2rem;
+ align-items: center;
+ display: flex;
opacity: 0;
- position: absolute;
- right: 0;
- top: 0;
- width: 10%;
- a {
- @extend %large;
- color: $gray-light;
- transition: all .2s ease-in;
+ svg {
+ @include svg-size(1.1rem);
+ fill: $gray-light;
+ margin-right: 2rem;
+ transition: fill .2s ease-in;
&:hover {
- color: $grayer;
- transition: all .2s ease-in;
+ cursor: pointer;
+ fill: $grayer;
+ }
+ &.icon-close:hover {
+ fill: $red-light;
}
}
}
@@ -213,6 +226,8 @@
white-space: nowrap;
}
.icon {
+ @include svg-size(.8rem);
+ fill: $gray-light;
opacity: 0;
position: absolute;
right: .5rem;
diff --git a/app/styles/modules/common/ticket-data.scss b/app/styles/modules/common/ticket-data.scss
index c97d7e36..b5723c38 100644
--- a/app/styles/modules/common/ticket-data.scss
+++ b/app/styles/modules/common/ticket-data.scss
@@ -11,17 +11,20 @@
}
.detail-status {
@extend %small;
- display: inline-block;
+ display: flex;
margin-left: .25rem;
position: relative;
- .icon-arrow-bottom {
+ .icon-arrow-down {
+ @include svg-size(.75rem);
+ fill: currentColor;
margin-left: .25rem;
}
}
.detail-status-inner {
+ align-items: center;
color: $white;
display: flex;
- justify-content: center;
+ justify-content: flex-start;
padding: .15rem .25rem;
text-transform: uppercase;
}
@@ -44,6 +47,8 @@
@extend %normal;
margin-bottom: 1rem;
.icon {
+ @include svg-size(.7rem);
+ color: currentColor;
margin-left: .25rem;
}
}
@@ -115,7 +120,8 @@
.ticket-watch-inner {
display: flex;
}
- .track-icon {
+ svg {
+ margin-right: .25rem;
position: relative;
top: 2px;
}
@@ -130,7 +136,7 @@
text-align: center;
text-transform: uppercase;
transition: background .25s;
- path {
+ svg {
fill: $white;
}
&:hover {
diff --git a/app/styles/modules/common/wizard.scss b/app/styles/modules/common/wizard.scss
index 75c60ac7..494c9048 100644
--- a/app/styles/modules/common/wizard.scss
+++ b/app/styles/modules/common/wizard.scss
@@ -94,8 +94,8 @@
transition: background .3s ease-in;
}
.icon {
- @extend %xxlarge;
- color: $white;
+ @include svg-size(3rem);
+ fill: currentColor;
}
}
h2 {
diff --git a/app/styles/modules/filters/filters.scss b/app/styles/modules/filters/filters.scss
index 527f44cc..e1309796 100644
--- a/app/styles/modules/filters/filters.scss
+++ b/app/styles/modules/filters/filters.scss
@@ -8,13 +8,17 @@
vertical-align: baseline;
}
}
- h2 {
+ .breadcrumb {
@extend %large;
margin-top: 1rem;
.icon-arrow-right {
- @extend %medium;
+ @include svg-size(.7rem);
+ margin: 0 .25rem;
vertical-align: middle;
}
+ .back {
+ color: $gray-light;
+ }
}
input {
background: $grayer;
@@ -79,8 +83,10 @@
}
}
a {
+ align-items: center;
color: $grayer;
- display: block;
+ display: flex;
+ justify-content: space-between;
padding: .5rem 0 .5rem .5rem;
transition: color .2s ease-in;
&:hover {
@@ -93,9 +99,11 @@
}
}
.icon {
- color: $grayer;
+ fill: currentColor;
float: right;
+ height: .9rem;
opacity: 0;
transition: opacity .2s ease-in;
+ width: .9rem;
}
}
diff --git a/app/styles/modules/issues/issues-table.scss b/app/styles/modules/issues/issues-table.scss
index d9468859..9b03dc47 100644
--- a/app/styles/modules/issues/issues-table.scss
+++ b/app/styles/modules/issues/issues-table.scss
@@ -73,6 +73,12 @@
&.is-voted {
color: $primary-light;
}
+ svg {
+ @include svg-size(.75rem);
+ fill: $gray;
+ margin-right: .25rem;
+ vertical-align: middle;
+ }
}
.subject {
overflow: hidden;
@@ -99,6 +105,12 @@
padding: 0 1rem;
position: relative;
text-align: left;
+ .icon {
+ @include svg-size(.75rem);
+ fill: currentColor;
+ margin-left: .25rem;
+ vertical-align: middle;
+ }
}
.assigned-field {
flex: 0 0 160px;
@@ -120,10 +132,11 @@
white-space: nowrap;
}
.icon {
+ @include svg-size(.75rem);
opacity: 0;
position: absolute;
right: 0;
- top: .5rem;
+ top: .75rem;
transition: opacity .3s linear;
}
}
diff --git a/app/styles/modules/kanban/kanban-table.scss b/app/styles/modules/kanban/kanban-table.scss
index 817c8a58..5de4736d 100644
--- a/app/styles/modules/kanban/kanban-table.scss
+++ b/app/styles/modules/kanban/kanban-table.scss
@@ -21,12 +21,7 @@ $column-margin: 0 10px 0 0;
opacity: .8;
padding: .5rem 0;
transition: opacity .3s linear;
- .icon-plus,
- .icon-bulk,
- .icon-vfold,
- .icon-vunfold,
- .icon-open-eye,
- .icon-closed-eye,
+ .option:not(.hunfold),
span {
display: none;
}
@@ -86,51 +81,19 @@ $column-margin: 0 10px 0 0;
span {
@include ellipsis(65%);
}
- .icon {
- @extend %medium;
- color: $gray-light;
+ .option {
margin-right: .3rem;
- transition: color .2s linear;
- &.hfold,
- &.hunfold {
- display: inline-block;
- transform: rotate(90deg);
- }
}
- }
- .icon-open-eye,
- .icon-closed-eye {
- display: inline-block;
- svg {
+ .icon {
fill: $gray-light;
- height: 1.1rem;
- margin-top: .25rem;
- width: 1.1rem;
-
- }
- &:hover {
- svg {
+ height: 1rem;
+ transition: color .2s linear;
+ width: 1rem;
+ &:hover {
fill: $primary;
-
}
}
}
- .icon-open-eye {
- .svg-eye-closed {
- display: none;
- }
- .svg-eye-open {
- display: block;
- }
- }
- .icon-closed-eye {
- .svg-eye-closed {
- display: block;
- }
- .svg-eye-open {
- display: none;
- }
- }
}
.kanban-table-body {
diff --git a/app/styles/modules/search/search-filter.scss b/app/styles/modules/search/search-filter.scss
index 742bd0b7..b25c5fc0 100644
--- a/app/styles/modules/search/search-filter.scss
+++ b/app/styles/modules/search/search-filter.scss
@@ -11,12 +11,12 @@
padding: 1rem 1.25rem;
&:hover {
transition: color .3s linear;
- .icon {
- margin-right: .4rem;
- }
.name {
padding-left: 5px;
}
+ .icon {
+ fill: currentColor;
+ }
}
&.active {
border-left: 1px solid $whitish;
@@ -25,11 +25,12 @@
position: relative;
top: 1px;
.icon {
- color: $primary-light;
+ fill: $primary-light;
}
}
}
.icon {
+ fill: currentColor;
margin-right: .4rem;
}
.name {
diff --git a/app/styles/modules/search/search-in.scss b/app/styles/modules/search/search-in.scss
index 19eecf56..8b30b855 100644
--- a/app/styles/modules/search/search-in.scss
+++ b/app/styles/modules/search/search-in.scss
@@ -12,7 +12,7 @@
top: .7rem;
}
.icon-search {
- color: $gray-light;
+ fill: $gray-light;
}
.loading-spinner {
margin-top: .1rem;
diff --git a/app/styles/modules/team/team-filters.scss b/app/styles/modules/team/team-filters.scss
index e638fe0d..e32092b1 100644
--- a/app/styles/modules/team/team-filters.scss
+++ b/app/styles/modules/team/team-filters.scss
@@ -3,37 +3,38 @@
margin-bottom: 1rem;
position: relative;
}
- nav {
- li {
- @extend %larger;
- @extend %title;
- border-bottom: 1px solid $gray-light;
- text-transform: uppercase;
- &:last-child {
- border-bottom: 0;
- }
- }
- a {
- display: block;
- padding: 1rem 0 1rem 1rem;
- &:hover,
- &.active {
- color: $primary;
- transition: color .3s linear;
- }
- &.active.icon {
- opacity: 1;
- transition: opacity .3s linear;
- }
- }
- .active {
- opacity: 1;
- transition: opacity .3s linear;
+ li {
+ @extend %large;
+ @extend %text;
+ border-bottom: 1px solid $gray-light;
+ text-transform: uppercase;
+ &:last-child {
+ border-bottom: 0;
}
.icon {
- color: $blackish;
- float: right;
+ fill: $blackish;
opacity: 0;
+ transition: opacity .3s linear;
}
}
+ a {
+ align-content: center;
+ align-items: center;
+ display: flex;
+ justify-content: space-between;
+ padding: 1rem 0 1rem 1rem;
+ &:hover,
+ &.active {
+ color: $primary;
+ transition: color .3s linear;
+ .icon {
+ fill: currentColor;
+ opacity: 1;
+ }
+ }
+ }
+ .active {
+ opacity: 1;
+ transition: opacity .3s linear;
+ }
}
diff --git a/app/styles/modules/team/team-table.scss b/app/styles/modules/team/team-table.scss
index a75332d4..a84e4660 100644
--- a/app/styles/modules/team/team-table.scss
+++ b/app/styles/modules/team/team-table.scss
@@ -19,8 +19,8 @@
position: relative;
text-align: center;
.icon {
- color: $blackish;
- font-size: 1.8rem;
+ @include svg-size(1.75rem);
+ fill: $gray;
}
.points {
@extend %larger;
@@ -28,7 +28,7 @@
color: $grayer;
}
.top {
- color: $primary-light;
+ fill: $primary-light;
opacity: 1;
}
&:hover {
@@ -39,15 +39,17 @@
}
.leave-project {
@extend %small;
- color: $gray-light;
- display: block;
+ color: $red-light;
.icon {
+ @include svg-size(.8rem);
+ fill: currentColor;
margin-right: .2rem;
}
&:hover {
+ color: $red;
.icon {
- color: $red;
- transition: color .3s linear;
+ color: currentColor;
+ transition: fill .3s linear;
}
}
}
@@ -69,12 +71,12 @@
display: flex;
img {
flex-basis: 66px;
- flex-grow: 1;
- max-width: 66px;
+ flex-grow: 0;
+ flex-shrink: 0;
+ width: 66px;
}
- figcaption {
+ .avatar-data {
margin-left: 1rem;
- width: 65%;
span {
overflow: hidden;
text-overflow: ellipsis;
diff --git a/app/styles/modules/wiki/wiki-nav.scss b/app/styles/modules/wiki/wiki-nav.scss
index 39c20db9..f1f72c76 100644
--- a/app/styles/modules/wiki/wiki-nav.scss
+++ b/app/styles/modules/wiki/wiki-nav.scss
@@ -7,21 +7,26 @@
&:hover {
.icon {
opacity: 1;
- transition: opacity 1s linear;
+ transition: opacity .2s linear;
+ transition-delay: .2s;
}
}
a {
- display: block;
+ align-items: center;
+ display: flex;
+ justify-content: space-between;
padding: 1rem 0 1rem 1rem;
span {
cursor: pointer;
}
}
.icon {
- color: $blackish;
- float: right;
+ fill: $gray-light;
opacity: 0;
- transition: opacity 1s linear;
+ &:hover {
+ cursor: pointer;
+ fill: $red;
+ }
}
input {
@extend %text;
diff --git a/app/svg/activity.svg b/app/svg/activity.svg
deleted file mode 100644
index 66e8684f..00000000
--- a/app/svg/activity.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
diff --git a/app/svg/add.svg b/app/svg/add.svg
deleted file mode 100644
index 77a2901a..00000000
--- a/app/svg/add.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/attachment.svg b/app/svg/attachment.svg
deleted file mode 100644
index 784be839..00000000
--- a/app/svg/attachment.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/check.svg b/app/svg/check.svg
deleted file mode 100644
index d97a17c3..00000000
--- a/app/svg/check.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
diff --git a/app/svg/client-requirement.svg b/app/svg/client-requirement.svg
deleted file mode 100644
index fd20989a..00000000
--- a/app/svg/client-requirement.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/app/svg/dashboard.svg b/app/svg/dashboard.svg
deleted file mode 100644
index 1b2061a2..00000000
--- a/app/svg/dashboard.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
diff --git a/app/svg/discover.svg b/app/svg/discover.svg
deleted file mode 100644
index 5334c1bb..00000000
--- a/app/svg/discover.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/empty-project.svg b/app/svg/empty-project.svg
deleted file mode 100644
index fdc92148..00000000
--- a/app/svg/empty-project.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
-
diff --git a/app/svg/eye.svg b/app/svg/eye.svg
deleted file mode 100644
index 98489d10..00000000
--- a/app/svg/eye.svg
+++ /dev/null
@@ -1,8 +0,0 @@
-
diff --git a/app/svg/flag.svg b/app/svg/flag.svg
deleted file mode 100644
index 2612a5cf..00000000
--- a/app/svg/flag.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/app/svg/gallery.svg b/app/svg/gallery.svg
deleted file mode 100644
index d9f205bc..00000000
--- a/app/svg/gallery.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/graph.svg b/app/svg/graph.svg
deleted file mode 100644
index b4a28d94..00000000
--- a/app/svg/graph.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-
-
diff --git a/app/svg/help.svg b/app/svg/help.svg
deleted file mode 100644
index b822b8fd..00000000
--- a/app/svg/help.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
\ No newline at end of file
diff --git a/app/svg/hide.svg b/app/svg/hide.svg
deleted file mode 100644
index 0abadf8e..00000000
--- a/app/svg/hide.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-
-
diff --git a/app/svg/iocaine.svg b/app/svg/iocaine.svg
deleted file mode 100644
index 868c76d0..00000000
--- a/app/svg/iocaine.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/app/svg/like.svg b/app/svg/like.svg
deleted file mode 100644
index dd7c202d..00000000
--- a/app/svg/like.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-
-
diff --git a/app/svg/list.svg b/app/svg/list.svg
deleted file mode 100644
index f2ef5c24..00000000
--- a/app/svg/list.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/location.svg b/app/svg/location.svg
deleted file mode 100644
index 2e4b6957..00000000
--- a/app/svg/location.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
diff --git a/app/svg/lock.svg b/app/svg/lock.svg
deleted file mode 100644
index d39b2ba0..00000000
--- a/app/svg/lock.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/organizations.svg b/app/svg/organizations.svg
deleted file mode 100644
index 4dca4867..00000000
--- a/app/svg/organizations.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
diff --git a/app/svg/project.svg b/app/svg/project.svg
deleted file mode 100644
index 6e3ce332..00000000
--- a/app/svg/project.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/projects.svg b/app/svg/projects.svg
deleted file mode 100644
index e8c66014..00000000
--- a/app/svg/projects.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-
diff --git a/app/svg/promote.svg b/app/svg/promote.svg
deleted file mode 100644
index 329e718f..00000000
--- a/app/svg/promote.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/recruit.svg b/app/svg/recruit.svg
deleted file mode 100644
index fa8dcf32..00000000
--- a/app/svg/recruit.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/app/svg/remove.svg b/app/svg/remove.svg
deleted file mode 100644
index 6097c7df..00000000
--- a/app/svg/remove.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/search.svg b/app/svg/search.svg
deleted file mode 100644
index 8c58b6ec..00000000
--- a/app/svg/search.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
diff --git a/app/svg/sprite.svg b/app/svg/sprite.svg
new file mode 100644
index 00000000..cd74aed7
--- /dev/null
+++ b/app/svg/sprite.svg
@@ -0,0 +1,369 @@
+
diff --git a/app/svg/team-requirement.svg b/app/svg/team-requirement.svg
deleted file mode 100644
index 154ea48c..00000000
--- a/app/svg/team-requirement.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/app/svg/team.svg b/app/svg/team.svg
deleted file mode 100644
index fc0fc652..00000000
--- a/app/svg/team.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/app/svg/timeline.svg b/app/svg/timeline.svg
deleted file mode 100644
index 56c0347a..00000000
--- a/app/svg/timeline.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/trash.svg b/app/svg/trash.svg
deleted file mode 100644
index 281f1d29..00000000
--- a/app/svg/trash.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/unlock.svg b/app/svg/unlock.svg
deleted file mode 100644
index fe3188a5..00000000
--- a/app/svg/unlock.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/app/svg/unwatch.svg b/app/svg/unwatch.svg
deleted file mode 100644
index 9a305958..00000000
--- a/app/svg/unwatch.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
-
diff --git a/app/svg/upvote.svg b/app/svg/upvote.svg
deleted file mode 100644
index 187d6159..00000000
--- a/app/svg/upvote.svg
+++ /dev/null
@@ -1,14 +0,0 @@
-
-
diff --git a/app/svg/watch.svg b/app/svg/watch.svg
deleted file mode 100644
index cfce30c5..00000000
--- a/app/svg/watch.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
-
diff --git a/app/themes/high-contrast/custom.scss b/app/themes/high-contrast/custom.scss
index c566bacc..758a94ce 100644
--- a/app/themes/high-contrast/custom.scss
+++ b/app/themes/high-contrast/custom.scss
@@ -180,7 +180,7 @@ tg-project-menu {
background: lighten($white, 20%);
border-top: 3px solid $black;
.icon {
- color: $black;
+ fill: $black;
}
}
}
diff --git a/app/themes/material-design/custom.scss b/app/themes/material-design/custom.scss
index 7ada1f31..f17d0a73 100644
--- a/app/themes/material-design/custom.scss
+++ b/app/themes/material-design/custom.scss
@@ -155,7 +155,7 @@ tg-project-menu {
background: lighten($primary-light, 20%);
border-top: 3px solid $primary;
.icon {
- color: $primary;
+ fill: $primary;
}
}
}
diff --git a/app/themes/taiga/custom.scss b/app/themes/taiga/custom.scss
index 7a5ad4d7..8c64cb2b 100644
--- a/app/themes/taiga/custom.scss
+++ b/app/themes/taiga/custom.scss
@@ -135,7 +135,7 @@ tg-project-menu {
background: $whitish;
border-top: 3px solid $gray-light;
.icon {
- color: $gray-light;
+ fill: $gray-light;
}
}
}