Commit c3c9122d authored by Filipa Lacerda's avatar Filipa Lacerda

Adds new hover state

Fixes the line that connects the dots

Adds style for the badge

Add new style for status text

Fix badge style

Adjust font weight
parent e7b045ea
...@@ -571,3 +571,10 @@ $body-text-shadow: rgba(255,255,255,0.01); ...@@ -571,3 +571,10 @@ $body-text-shadow: rgba(255,255,255,0.01);
*/ */
$ui-dev-kit-example-color: #bbb; $ui-dev-kit-example-color: #bbb;
$ui-dev-kit-example-border: #ddd; $ui-dev-kit-example-border: #ddd;
/*
Pipeline Graph
*/
$stage-hover-bg: #eaf3fc;
$stage-hover-border: #d1e7fc;
$stage-bagde-text: #d4d4d4;
...@@ -363,15 +363,22 @@ ...@@ -363,15 +363,22 @@
.build { .build {
border: 1px solid $border-color; border: 1px solid $border-color;
border-radius: 30px;
background-color: $white-light; background-color: $white-light;
color: $gl-text-color;
position: relative; position: relative;
padding: 7px 10px 8px; padding: 7px 10px 8px;
border-radius: 30px;
width: 186px; width: 186px;
margin-bottom: 10px; margin-bottom: 10px;
&:hover { &:hover {
background-color: $gray-lighter; background-color: $stage-hover-bg;
border: 1px solid $stage-hover-border;
.ci-status-text,
.dropdown-counter-bagde {
color: $gl-text-color;
}
} }
&.playable { &.playable {
...@@ -411,14 +418,14 @@ ...@@ -411,14 +418,14 @@
} }
.ci-status-text { .ci-status-text {
width: 135px; max-width: 110px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
vertical-align: middle; vertical-align: bottom;
display: inline-block; display: inline-block;
position: relative; position: relative;
top: -1px; font-weight: 100;
} }
a { a {
...@@ -435,7 +442,7 @@ ...@@ -435,7 +442,7 @@
flex-grow: 1; flex-grow: 1;
.ci-status-text { .ci-status-text {
max-width: 112px; max-width: 110px;
width: auto; width: auto;
} }
} }
...@@ -480,7 +487,7 @@ ...@@ -480,7 +487,7 @@
} }
.ci-status-text { .ci-status-text {
width: 112px; width: 110px;
} }
.arrow { .arrow {
...@@ -520,9 +527,18 @@ ...@@ -520,9 +527,18 @@
} }
} }
.dropdown-counter-bagde {
float: right;
color: $stage-bagde-text;
font-weight: 100;
font-size: 13px;
margin-top: 1px;
margin-right: 2px;
}
svg { svg {
vertical-align: middle; vertical-align: middle;
margin-right: 5px; margin-right: 3px;
} }
// Connect first build in each stage with right horizontal line // Connect first build in each stage with right horizontal line
...@@ -531,7 +547,7 @@ ...@@ -531,7 +547,7 @@
content: ''; content: '';
position: absolute; position: absolute;
top: 48%; top: 48%;
right: -48px; right: -49px;
border-top: 2px solid $border-color; border-top: 2px solid $border-color;
width: 48px; width: 48px;
height: 1px; height: 1px;
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
= ci_icon_for_status(group_status) = ci_icon_for_status(group_status)
%span.ci-status-text %span.ci-status-text
= name = name
%span.badge= subject.size %span.dropdown-counter-bagde= subject.size
.dropdown-menu.grouped-pipeline-dropdown .dropdown-menu.grouped-pipeline-dropdown
.arrow .arrow
%ul %ul
......
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