Commit 626c6ef7 authored by Enrique Alcántara's avatar Enrique Alcántara

Merge branch '239832-convert-stylesheets-pages-graph-scss-into-page-specific-bundle' into 'master'

Convert project graph page to use utility classes for styling

Closes #239832

See merge request gitlab-org/gitlab!44145
parents 48a41731 44289ae9
......@@ -18,7 +18,6 @@
@import './pages/events';
@import './pages/experience_level';
@import './pages/experimental_separate_sign_up';
@import './pages/graph';
@import './pages/groups';
@import './pages/help';
@import './pages/import';
......
......@@ -780,7 +780,6 @@ $login-brand-holder-color: #888;
* Projects
*/
$project-option-descr-color: #54565b;
$project-network-controls-color: #888;
/*
* Monitor Charts
......
.project-network {
border: 1px solid $border-color;
.controls {
color: $project-network-controls-color;
font-size: 14px;
padding: 5px;
border-bottom: 1px solid $border-color;
background: $gray-darker;
}
.network-graph {
background: $white;
height: 500px;
overflow-y: scroll;
overflow-x: hidden;
}
}
.svg-graph-container {
width: 100%;
.axis-tick {
opacity: 0.4;
}
.tick-text {
fill: $gl-text-color-secondary;
}
.x-axis-text {
fill: $gray-900;
}
.bar-rect {
fill: rgba($blue-500, 0.1);
stroke: $blue-500;
}
.bar-rect:hover {
fill: rgba($blue-700, 0.3);
}
.y-axis-label {
line {
stroke: $gray-300;
}
text {
font-weight: bold;
font-size: 12px;
fill: $gray-700;
}
}
}
.svg-graph-container-with-grab {
cursor: grab;
}
.svg-graph-container-grabbed {
cursor: grabbing;
}
@keyframes flickerAnimation {
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}
.animate-flicker {
animation: flickerAnimation 1.5s infinite;
fill: $gray-300;
}
......@@ -2,8 +2,8 @@
- page_title _("Graph"), @ref
= render "head"
%div{ class: container_class }
.project-network
.controls
.project-network.gl-border-1.gl-border-solid.gl-border-gray-300
.controls.gl-bg-gray-50.gl-p-2.gl-font-base.gl-text-gray-400.gl-border-b-1.gl-border-b-solid.gl-border-b-gray-300
= form_tag project_network_path(@project, @id), method: :get, class: 'form-inline network-form' do |f|
= text_field_tag :extended_sha1, @options[:extended_sha1], placeholder: _("Git revision"), class: 'search-input form-control input-mx-250 search-sha'
= button_tag class: 'btn btn-success' do
......@@ -15,6 +15,6 @@
%span= _("Begin with the selected commit")
- if @commit
.network-graph{ data: { url: @url, commit_url: @commit_url, ref: @ref, commit_id: @commit.id } }
.network-graph.gl-bg-white.gl-overflow-scroll.gl-overflow-x-hidden{ data: { url: @url, commit_url: @commit_url, ref: @ref, commit_id: @commit.id } }
.text-center.gl-mt-3
.spinner.spinner-md
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