CSS - Adds background color.
Removes unused CSS Fix scss linter errors Adds changelog entry Increase icons size. Adds transition animation Fix jumping icon. Reduce icon size Fix columns width Changes after review Fix transition
This commit is contained in:
parent
6fde0e094d
commit
e36b00e713
|
@ -4,10 +4,6 @@
|
|||
svg {
|
||||
fill: $gl-success;
|
||||
}
|
||||
|
||||
.builds-dropdown-caret {
|
||||
color: $gl-success;
|
||||
}
|
||||
}
|
||||
|
||||
.ci-status-icon-failed {
|
||||
|
@ -16,10 +12,6 @@
|
|||
svg {
|
||||
fill: $gl-danger;
|
||||
}
|
||||
|
||||
.builds-dropdown-caret {
|
||||
color: $gl-danger;
|
||||
}
|
||||
}
|
||||
|
||||
.ci-status-icon-pending,
|
||||
|
@ -29,10 +21,6 @@
|
|||
svg {
|
||||
fill: $gl-warning;
|
||||
}
|
||||
|
||||
.builds-dropdown-caret {
|
||||
color: $gl-warning;
|
||||
}
|
||||
}
|
||||
|
||||
.ci-status-icon-running {
|
||||
|
@ -41,10 +29,6 @@
|
|||
svg {
|
||||
fill: $blue-normal;
|
||||
}
|
||||
|
||||
.builds-dropdown-caret {
|
||||
color: $blue-normal;
|
||||
}
|
||||
}
|
||||
|
||||
.ci-status-icon-canceled,
|
||||
|
@ -55,10 +39,6 @@
|
|||
svg {
|
||||
fill: $gl-gray;
|
||||
}
|
||||
|
||||
.builds-dropdown-caret {
|
||||
color: $gl-gray;
|
||||
}
|
||||
}
|
||||
|
||||
.ci-status-icon-created,
|
||||
|
@ -68,8 +48,4 @@
|
|||
svg {
|
||||
fill: $gray-darkest;
|
||||
}
|
||||
|
||||
.builds-dropdown-caret {
|
||||
color: $gray-darkest;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -28,12 +28,16 @@
|
|||
color: $black;
|
||||
}
|
||||
|
||||
.branch-commit {
|
||||
width: 30%;
|
||||
.pipeline-date,
|
||||
.pipeline-status {
|
||||
width: 10%;
|
||||
}
|
||||
|
||||
.branch-name {
|
||||
max-width: 195px;
|
||||
}
|
||||
.pipeline-info,
|
||||
.pipeline-commit,
|
||||
.pipeline-actions,
|
||||
.pipeline-stages {
|
||||
width: 20%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -107,7 +111,7 @@
|
|||
|
||||
.branch-name {
|
||||
font-weight: bold;
|
||||
max-width: 150px;
|
||||
max-width: 120px;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
|
@ -133,7 +137,7 @@
|
|||
|
||||
.commit-title {
|
||||
margin-top: 4px;
|
||||
max-width: 300px;
|
||||
max-width: 225px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
@ -580,15 +584,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
<<<<<<< HEAD
|
||||
.dropdown-menu-toggle {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
padding: 0;
|
||||
color: $gl-text-color-light;
|
||||
white-space: normal;
|
||||
overflow: visible;
|
||||
=======
|
||||
.dropdown-counter-badge {
|
||||
float: right;
|
||||
color: $border-color;
|
||||
|
@ -596,7 +591,6 @@
|
|||
font-size: 15px;
|
||||
margin-right: 2px;
|
||||
}
|
||||
>>>>>>> 5ba6f0d... Dropdown with arrow
|
||||
|
||||
.grouped-pipeline-dropdown {
|
||||
padding: 0;
|
||||
|
@ -707,7 +701,9 @@
|
|||
padding: 0;
|
||||
font-size: 11px;
|
||||
float: right;
|
||||
margin-top: 5px;
|
||||
margin-top: 4px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
i {
|
||||
font-size: 11px;
|
||||
|
@ -726,7 +722,7 @@
|
|||
width: 25px;
|
||||
height: 25px;
|
||||
|
||||
&:before{
|
||||
&::before {
|
||||
top: 1px;
|
||||
left: 1px;
|
||||
}
|
||||
|
@ -782,11 +778,11 @@
|
|||
border-style: solid;
|
||||
top: -6px;
|
||||
left: 2px;
|
||||
border-width: 0 5px 6px 5px;
|
||||
border-width: 0 5px 6px;
|
||||
}
|
||||
|
||||
&::before {
|
||||
border-width: 0 5px 5px 5px;
|
||||
border-width: 0 5px 5px;
|
||||
border-bottom-color: $border-color;
|
||||
}
|
||||
|
||||
|
@ -797,53 +793,93 @@
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Icons in mini pipeline graph
|
||||
*/
|
||||
.mini-pipeline-graph-icon-container .ci-status-icon {
|
||||
display: inline-block;
|
||||
border: 1px solid;
|
||||
border-radius: 20px;
|
||||
margin-right: 1px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
border: 1px solid;
|
||||
border-radius: 20px;
|
||||
margin-right: 1px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
transition: all 0.2s cubic-bezier(0.25, 0, 1, 1);
|
||||
|
||||
svg {
|
||||
top: -1px;
|
||||
position: relative;
|
||||
}
|
||||
svg {
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.builds-dropdown {
|
||||
&:focus {
|
||||
margin-right: -6px;
|
||||
outline: none;
|
||||
margin-right: -8px;
|
||||
|
||||
.ci-status-icon {
|
||||
width: 27px;
|
||||
padding: 0px 6px 0px 0px;
|
||||
width: 28px;
|
||||
padding: 0 8px 0 0;
|
||||
transition: all 0.2s cubic-bezier(0.25, 0, 1, 1);
|
||||
|
||||
+ .dropdown-caret {
|
||||
display: inline-block;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:focus,
|
||||
&:active {
|
||||
.ci-status-icon-success {
|
||||
background-color: rgba($gl-success, .1);
|
||||
}
|
||||
|
||||
.ci-status-icon-failed {
|
||||
background-color: rgba($gl-danger, .1);
|
||||
}
|
||||
|
||||
.ci-status-icon-pending,
|
||||
.ci-status-icon-success_with_warnings {
|
||||
background-color: rgba($gl-warning, .1);
|
||||
}
|
||||
|
||||
.ci-status-icon-running {
|
||||
background-color: rgba($blue-normal, .1);
|
||||
}
|
||||
|
||||
.ci-status-icon-canceled,
|
||||
.ci-status-icon-disabled,
|
||||
.ci-status-icon-not-found {
|
||||
background-color: rgba($gl-gray, .1);
|
||||
}
|
||||
|
||||
.ci-status-icon-created,
|
||||
.ci-status-icon-skipped {
|
||||
background-color: rgba($gray-darkest, .1);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.mini-pipeline-graph-icon-container {
|
||||
.ci-status-icon:hover,
|
||||
.ci-status-icon:focus {
|
||||
width: 27px;
|
||||
padding: 0px 6px 0px 0px;
|
||||
width: 28px;
|
||||
padding: 0 8px 0 0;
|
||||
transition: all 0.2s cubic-bezier(0.25, 0, 1, 1);
|
||||
|
||||
+ .dropdown-caret {
|
||||
display: inline-block;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-caret {
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
position: relative;
|
||||
top: 3px;
|
||||
left: -11px;
|
||||
margin-right: -6px;
|
||||
display: none;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,11 +5,11 @@
|
|||
- else
|
||||
.table-holder
|
||||
%table.table.ci-table
|
||||
%tbody
|
||||
%th Status
|
||||
%th Pipeline
|
||||
%th Commit
|
||||
%th Stages
|
||||
%th
|
||||
%th
|
||||
%thead
|
||||
%th.pipeline-status Status
|
||||
%th.pipeline-info Pipeline
|
||||
%th.pipeline-commit Commit
|
||||
%th.pipeline-stages Stages
|
||||
%th.pipeline-date
|
||||
%th.pipeline-actions
|
||||
= render pipelines, commit_sha: true, stage: true, allow_retry: true, show_commit: false
|
||||
|
|
|
@ -44,12 +44,12 @@
|
|||
.table-holder
|
||||
%table.table.ci-table
|
||||
%thead
|
||||
%th Status
|
||||
%th Pipeline
|
||||
%th Commit
|
||||
%th Stages
|
||||
%th
|
||||
%th.hidden-xs
|
||||
%th.pipeline-status Status
|
||||
%th.pipeline-info Pipeline
|
||||
%th.pipeline-commit Commit
|
||||
%th.pipeline-stages Stages
|
||||
%th.pipeline-date
|
||||
%th.pipeline-actions.hidden-xs
|
||||
= render @pipelines, commit_sha: true, stage: true, allow_retry: true
|
||||
|
||||
= paginate @pipelines, theme: 'gitlab'
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
---
|
||||
title: Adds Direct link from pipeline list to builds
|
||||
merge_request: 8097
|
||||
author:
|
Loading…
Reference in New Issue