diff options
Diffstat (limited to 'app/assets/stylesheets/page_bundles/prometheus.scss')
-rw-r--r-- | app/assets/stylesheets/page_bundles/prometheus.scss | 116 |
1 files changed, 116 insertions, 0 deletions
diff --git a/app/assets/stylesheets/page_bundles/prometheus.scss b/app/assets/stylesheets/page_bundles/prometheus.scss new file mode 100644 index 00000000000..055036d757d --- /dev/null +++ b/app/assets/stylesheets/page_bundles/prometheus.scss @@ -0,0 +1,116 @@ +@import 'mixins_and_variables_and_functions'; + +.prometheus-graphs { + .dropdown-buttons { + > div { + margin-left: auto; + } + } + + .col-form-label { + line-height: 1; + padding-top: 0; + } + + .form-group { + margin-bottom: map-get($spacing-scale, 3); + } + + .variables-section { + input { + @include media-breakpoint-up(sm) { + width: 160px; + } + } + } + + .links-section { + .gl-hover-text-blue-600-children:hover { + * { + @include gl-text-blue-600; + } + } + } +} + +.draggable { + &.draggable-enabled { + .draggable-panel { + border: $gray-100 1px solid; + border-radius: $border-radius-default; + margin: -1px; + cursor: grab; + } + + .prometheus-graph { + // Make dragging easier by disabling use of chart + pointer-events: none; + } + } + + &.sortable-chosen .draggable-panel { + background: $white; + box-shadow: 0 0 4px $gray-300; + } + + .draggable-remove { + z-index: 1; + + .draggable-remove-link { + cursor: pointer; + color: $gray-400; + background-color: $white; + } + } +} + +.prometheus-graphs-header { + .monitor-environment-dropdown-menu, + .monitor-dashboard-dropdown-menu { + &.show { + display: flex; + flex-direction: column; + overflow: hidden; + } + + .no-matches-message { + padding: $gl-padding-8 $gl-padding-12; + } + } + + .show-last-dropdown { + // same as in .dropdown-menu-toggle + // see app/assets/stylesheets/framework/dropdowns.scss + width: 160px; + } +} + +.prometheus-panel { + margin-top: 20px; +} + +.prometheus-graph-group { + display: flex; + flex-wrap: wrap; +} + +.prometheus-graph { + padding: $gl-padding-8; +} + +.alert-current-setting { + max-width: 240px; + + .badge.badge-danger { + color: $red-500; + background-color: $red-100; + } +} + +.prometheus-panel-builder { + .preview-date-time-picker { + // same as in .dropdown-menu-toggle + // see app/assets/stylesheets/framework/dropdowns.scss + width: 160px; + } +} |