Commit 6787c38f authored by Coung Ngo's avatar Coung Ngo Committed by Miguel Rincon

Clean up labels css

This commit cleans up labels css used in project labels, group
labels, and admin labels. This is to remove unnecessary css
and move some to HTML utility classes.
parent 2c22cf0e
......@@ -134,11 +134,6 @@
}
}
.label-description-wrapper {
margin-right: 8px;
margin-left: 8px;
}
.prioritized-labels {
margin-bottom: 30px;
......@@ -201,10 +196,6 @@
}
}
.label-options-toggle {
width: 100%;
}
.label-subscription {
vertical-align: middle;
......@@ -276,35 +267,6 @@
font-size: $label-font-size;
}
.label-badge-blue {
background-color: $theme-blue-100;
}
.label-badge-gray {
background-color: $gray-50;
}
.label-links {
list-style: none;
margin: 0;
padding: 0;
white-space: nowrap;
}
.label-link-item {
padding: 0;
}
.label-description {
.description-text {
margin-bottom: 10px;
.admin-labels & {
margin-bottom: 0;
}
}
}
.label-list-item {
.content-list &::before,
.content-list &::after {
......@@ -313,21 +275,12 @@
.label-name {
width: 200px;
flex-shrink: 0;
.gl-label {
line-height: $gl-line-height;
}
}
.label-description {
flex-grow: 1;
a {
color: $blue-600;
}
}
.label {
padding: 4px $grid-size;
font-size: $label-font-size;
......@@ -382,31 +335,8 @@
text-align: left;
}
.label-links {
white-space: normal;
}
.label-description {
order: 3;
width: 100%;
> .label-description-wrapper {
margin-left: 0;
margin-right: 0;
}
}
}
}
@media (max-width: 910px) {
.priority-badge {
display: block;
width: 100%;
margin-left: 0;
margin-top: $gl-padding;
.label-badge {
display: inline-block;
}
}
}
......
......@@ -36,11 +36,11 @@ module LabelsHelper
# link_to_label(label) { "My Custom Label Text" }
#
# Returns a String
def link_to_label(label, type: :issue, tooltip: true, small: false, &block)
def link_to_label(label, type: :issue, tooltip: true, small: false, css_class: nil, &block)
link = label.filter_path(type: type)
if block_given?
link_to link, &block
link_to link, class: css_class, &block
else
render_label(label, link: link, tooltip: tooltip, small: small)
end
......
......@@ -27,5 +27,5 @@
= render 'shared/empty_states/labels'
%template#js-badge-item-template
%li.label-link-item.js-priority-badge.inline.gl-ml-3
.label-badge.label-badge-blue= _('Prioritized label')
%li.js-priority-badge.inline.gl-ml-3
.label-badge.gl-bg-blue-50= _('Prioritized label')
......@@ -52,5 +52,5 @@
= render 'shared/empty_states/labels'
%template#js-badge-item-template
%li.label-link-item.js-priority-badge.inline.gl-ml-3
.label-badge.label-badge-blue= _('Prioritized label')
%li.js-priority-badge.inline.gl-ml-3
.label-badge.gl-bg-blue-50= _('Prioritized label')
......@@ -11,7 +11,7 @@
%ul.label-actions-list
- if @project
%li.inline
.label-badge.label-badge-gray= label.model_name.human.capitalize
.label-badge.gl-bg-gray-50= label.model_name.human.capitalize
- if can?(current_user, :admin_label, @project)
%li.inline.js-toggle-priority{ data: { url: remove_priority_project_label_path(@project, label),
dom_id: dom_id(label), type: label.type } }
......
......@@ -3,23 +3,22 @@
- show_label_issues_link = subject_or_group_defined && show_label_issuables_link?(label, :issues)
- show_label_merge_requests_link = subject_or_group_defined && show_label_issuables_link?(label, :merge_requests)
.label-name
.label-name.gl-flex-shrink-0.gl-mr-3
= render_label(label, tooltip: false)
.label-description
.label-description-wrapper
- if label.description.present?
.description-text
= markdown_field(label, :description)
%ul.label-links
- if show_label_issues_link
%li.label-link-item.inline
= link_to_label(label) { _('Issues') }
- if show_label_merge_requests_link
·
%li.label-link-item.inline
= link_to_label(label, type: :merge_request) { _('Merge requests') }
- if force_priority
·
%li.label-link-item.priority-badge.js-priority-badge.inline.gl-ml-3
.label-badge.label-badge-blue= _('Prioritized label')
= render_if_exists 'shared/label_row_epics_link', label: label
.label-description.gl-flex-grow-1.gl-mr-3.gl-w-full
- if label.description.present?
.description-text.gl-mb-3
= markdown_field(label, :description)
%ul.label-links.gl-m-0.gl-p-0.gl-white-space-nowrap
- if show_label_issues_link
%li.inline.gl-text-blue-600
= link_to_label(label, css_class: 'gl-text-blue-600!') { _('Issues') }
- if show_label_merge_requests_link
·
%li.inline.gl-text-blue-600
= link_to_label(label, type: :merge_request, css_class: 'gl-text-blue-600!') { _('Merge requests') }
= render_if_exists 'shared/label_row_epics_link', label: label
- if force_priority
·
%li.js-priority-badge.inline.gl-ml-3
.label-badge.gl-bg-blue-50= _('Prioritized label')
......@@ -29,10 +29,10 @@
%div
= render('shared/milestone_expired', milestone: milestone)
- if milestone.group_milestone?
.label-badge.label-badge-blue.d-inline-block
.label-badge.gl-bg-blue-50.d-inline-block
= milestone.group.full_name
- if milestone.project_milestone?
.label-badge.label-badge-gray.d-inline-block
.label-badge.gl-bg-gray-50.d-inline-block
= milestone.project.full_name
.col-sm-4.milestone-progress
......
......@@ -2,5 +2,5 @@
- if show_label_epics_link
·
%li.label-link-item.inline
= link_to 'Epics', group_epics_path(@group, label_name:[label.name])
%li.inline
= link_to 'Epics', group_epics_path(@group, label_name:[label.name]), class: 'gl-text-blue-600!'
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment