github/weave-scope
1
0
Fork 0
mirror of https://github.com/weaveworks/scope.git synced 2026-03-03 10:11:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #3294 from weaveworks/3285-increase-header-opacity

Browse Source 
Make header semitransparent
This commit is contained in:
Filip Barl
2018-08-03 11:20:42 +02:00
committed by GitHub
parent d624337dc1 e1b1837fd6
commit c33c91c265
3 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
client/app/scripts/charts/nodes-chart-elements.js
View File

@@ -2,6 +2,7 @@ import React from 'react';
import classNames from 'classnames';
import { connect } from 'react-redux';
import { fromJS, Map as makeMap, List as makeList } from 'immutable';
import theme from 'weaveworks-ui-components/lib/theme';
import NodeContainer from './node-container';
import EdgeContainer from './edge-container';
@@ -199,7 +200,7 @@ class NodesChartElements extends React.Component {
className={className}
key="nodes-chart-overlay"
transform={`scale(${scale})`}
fill="#fff"
fill={theme.colors.purple25}
x={-1}
y={-1}
width={2}

7
client/app/styles/_base.scss
View File

@@ -208,9 +208,9 @@ a {
}
.header {
background-color: transparentize($color-purple-25, 0.2);
z-index: $layer-front;
padding: 15px 10px 0;
pointer-events: none;
position: relative;
width: 100%;
@@ -334,7 +334,6 @@ a {
.topologies-item-main,
.topologies-sub-item {
pointer-events: all;
color: $text-secondary-color;
@extend .btn-opacity;
cursor: pointer;
@@ -671,7 +670,7 @@ a {
&-wrapper {
position: fixed;
display: flex;
z-index: $layer-front;
z-index: $layer-toolbar;
right: $details-window-padding-left;
top: 100px;
bottom: 48px;
@@ -1371,9 +1370,11 @@ a {
.status {
padding: 2px 12px;
background-color: $body-background-color;
border-radius: $border-radius-soft;
color: $text-secondary-color;
display: inline-block;
opacity: 0.9;
&-icon {
font-size: $font-size-normal;

4
client/app/styles/_variables.scss
View File

@@ -4,7 +4,7 @@ $base-ease: ease-in-out;
$background-color: $color-gray-50;
$background-lighter-color: $color-white;
$background-darker-color: transparentize($color-gray-200, 0.5);
$background-darker-color: $color-purple-100;
$background-darker-secondary-color: $color-gray-50;
$background-dark-color: $color-purple-900;
$text-color: $color-purple-800;
@@ -32,7 +32,7 @@ $edge-opacity-blurred: 0.2;
$edge-opacity: 0.5;
$edge-color: $color-purple-500;
$btn-opacity-default: 0.7;
$btn-opacity-default: 0.9;
$btn-opacity-hover: 1;
$btn-opacity-selected: 0.9;
$btn-opacity-disabled: 0.25;