diff options
Diffstat (limited to 'app/assets/stylesheets/pages/environments.scss')
-rw-r--r-- | app/assets/stylesheets/pages/environments.scss | 180 |
1 files changed, 132 insertions, 48 deletions
diff --git a/app/assets/stylesheets/pages/environments.scss b/app/assets/stylesheets/pages/environments.scss index 0e2b8dba780..00ebf4e26ac 100644 --- a/app/assets/stylesheets/pages/environments.scss +++ b/app/assets/stylesheets/pages/environments.scss @@ -5,42 +5,13 @@ } } -.environments-list-loading { - width: 100%; - font-size: 34px; -} - .environments-folder-name { font-weight: normal; padding-top: 20px; } .environments-container { - .table-holder { - width: 100%; - overflow: auto; - } - - .table.ci-table { - .environments-actions { - min-width: 200px; - } - - .environments-commit, - .environments-actions { - width: 20%; - } - - .environments-date { - width: 10%; - } - - .environments-name, - .environments-deploy, - .environments-build { - width: 15%; - } - + .ci-table { .deployment-column { > span { word-break: break-all; @@ -66,12 +37,12 @@ } } - .commit-title { - margin: 0; + .btn .text-center { + display: inline; } - .avatar-image-container { - text-decoration: none; + .commit-title { + margin: 0; } .icon-play { @@ -92,7 +63,7 @@ } .build-link, - .branch-name { + .ref-name { color: $gl-text-color; } @@ -112,6 +83,7 @@ .avatar { float: none; + margin-right: 0; } } @@ -137,16 +109,34 @@ } .branch-commit { - .commit-id { + .commit-sha { margin-right: 0; } } + + .no-btn { + border: none; + background: none; + outline: none; + width: 100%; + text-align: left; + } } } -.prometheus-graph { - text { - fill: $stat-graph-axis-fill; +.gl-responsive-table-row { + .branch-commit { + max-width: 100%; + } +} + +.folder-row { + padding: 15px 0; + border-bottom: 1px solid $white-normal; + + @media (max-width: $screen-sm-max) { + border-top: 1px solid $white-normal; + margin-top: 10px; } } @@ -189,25 +179,119 @@ .rect-text-metric { fill: $white-light; stroke-width: 1; - stroke: $black; + stroke: $gray-darkest; } .rect-axis-text { fill: $white-light; } -.text-metric, -.text-median-metric, -.text-metric-usage, -.text-metric-date { - fill: $black; +.text-metric { + font-size: 12px; } -.text-metric-date { - font-weight: 200; +.selected-metric-line { + stroke: $gl-gray-dark; + stroke-width: 1; } -.selected-metric-line { +.deployment-line { stroke: $black; stroke-width: 1; } + +.deploy-info-text { + dominant-baseline: text-before-edge; +} + +.prometheus-state { + margin-top: 10px; + + .state-button-section { + margin-top: 10px; + } +} + +.environments-actions { + .external-url, + .monitoring-url, + .terminal-button, + .stop-env-link { + width: 38px; + } +} + +.prometheus-panel { + margin-top: 20px; +} + +.prometheus-svg-container { + position: relative; + height: 0; + width: 100%; + padding: 0; + padding-bottom: 100%; +} + +.prometheus-svg-container > svg { + position: absolute; + height: 100%; + width: 100%; + left: 0; + top: 0; + + text { + fill: $gl-text-color; + stroke-width: 0; + } + + .text-metric-bold { + font-weight: 600; + } + + .label-axis-text, + .text-metric-usage { + fill: $black; + font-weight: 500; + font-size: 12px; + } + + .legend-axis-text { + fill: $black; + } + + .tick > text { + font-size: 12px; + } + + .text-metric-title { + font-size: 12px; + } + + .y-label-text, + .x-label-text { + fill: $gray-darkest; + } + + .axis-tick { + stroke: $gray-darker; + } + + @media (max-width: $screen-sm-max) { + .label-axis-text, + .text-metric-usage, + .legend-axis-text { + font-size: 8px; + } + + .tick > text { + font-size: 8px; + } + } +} + +.prometheus-row { + h5 { + font-size: 16px; + } +} |