Skip to content
Snippets Groups Projects
Commit e36b00e7 authored by Filipa Lacerda's avatar Filipa Lacerda
Browse files

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
parent 6fde0e09
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
app/assets/stylesheets/framework/icons.scss
+ 0
− 24
View file @ e36b00e7
@@ -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;
}
}
app/assets/stylesheets/pages/pipelines.scss
+ 76
− 40
View file @ e36b00e7
@@ -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;
}
}
}
app/views/projects/commit/_pipelines_list.haml
+ 7
− 7
View file @ e36b00e7
@@ -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
app/views/projects/pipelines/index.html.haml
+ 6
− 6
View file @ e36b00e7
@@ -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'
changelogs/unreleased/19703-direct-link-pipelines.yml 0 → 100644
+ 4
− 0
View file @ e36b00e7
---
title: Adds Direct link from pipeline list to builds
merge_request: 8097
author:
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