Merge pull request #3282 from weaveworks/320-reduce-border-radius

Bump ui-components version
This commit is contained in:
Filip Barl
2018-07-27 14:09:05 +02:00
committed by GitHub
5 changed files with 89 additions and 16 deletions

View File

@@ -1,5 +1,6 @@
/* eslint react/jsx-no-bind: "off", no-multi-comp: "off" */
import React from 'react';
import styled from 'styled-components';
import { connect } from 'react-redux';
import { List as makeList, Map as makeMap } from 'immutable';
import capitalize from 'lodash/capitalize';
@@ -20,6 +21,15 @@ const IGNORED_COLUMNS = ['docker_container_ports', 'docker_container_id', 'docke
'docker_container_command', 'docker_container_networks'];
const Icon = styled.span`
border-radius: ${props => props.theme.borderRadius.soft};
background-color: ${props => props.color};
margin-top: 3px;
display: block;
height: 12px;
width: 12px;
`;
function topologyLabel(topologies, id) {
const topology = findTopologyById(topologies, id);
if (!topology) {
@@ -74,23 +84,18 @@ function renderIdCell({
}) {
const showSubLabel = Boolean(pseudo) && labelMinor;
const title = showSubLabel ? `${label} (${labelMinor})` : label;
const iconStyle = {
width: 16,
flex: 'none',
color: getNodeColor(rank, label)
};
return (
<div title={title} className="nodes-grid-id-column">
<div style={iconStyle}><i className="fa fa-square" /></div>
<div style={{ width: 16, flex: 'none' }}>
<Icon color={getNodeColor(rank, label)} />
</div>
<div className="truncate">
{label} {showSubLabel && <span className="nodes-grid-label-minor">{labelMinor}</span>}
</div>
</div>
);
}
class NodesGrid extends React.Component {
constructor(props, context) {
super(props, context);

View File

@@ -1,5 +1,6 @@
import React from 'react';
import { connect } from 'react-redux';
import theme from 'weaveworks-ui-components/lib/theme';
import NodeResourcesMetricBoxInfo from './node-resources-metric-box-info';
import { clickNode } from '../../actions/app-actions';
@@ -120,10 +121,22 @@ class NodeResourcesMetricBox extends React.Component {
className="node-resources-metric-box"
style={{ opacity }}
onClick={this.handleClick}
ref={this.saveNodeRef}>
ref={this.saveNodeRef}
>
<title>{label} - {type} usage at {resourceUsageTooltipInfo}</title>
{showCapacity && <rect className="frame" {...this.defaultRectProps()} />}
<rect className="bar" fill={color} {...this.defaultRectProps(relativeConsumption)} />
{showCapacity && <rect
className="frame"
rx={theme.borderRadius.soft}
ry={theme.borderRadius.soft}
{...this.defaultRectProps()}
/>}
<rect
className="bar"
fill={color}
rx={theme.borderRadius.soft}
ry={theme.borderRadius.soft}
{...this.defaultRectProps(relativeConsumption)}
/>
{showInfo && <NodeResourcesMetricBoxInfo
label={label}
metricSummary={metricSummary}

View File

@@ -692,6 +692,7 @@ a {
@extend .shadow-2;
// keep node-details above the terminal.
z-index: $layer-front;
overflow: hidden;
&:last-child {
margin-bottom: 0;
@@ -1137,6 +1138,7 @@ a {
&-layer-topology {
background-color: transparentize($color-gray-50, 0.05);
border-radius: $border-radius-soft;
border: 1px solid $color-gray-200;
color: $text-tertiary-color;
font-size: $font-size-normal;

View File

@@ -44,7 +44,7 @@
"reselect": "3.0.1",
"reselect-map": "1.0.3",
"styled-components": "2.2.4",
"weaveworks-ui-components": "0.7.0",
"weaveworks-ui-components": "0.11.8",
"whatwg-fetch": "2.0.3",
"xterm": "3.3.0"
},
@@ -80,6 +80,7 @@
"mockdate": "2.0.2",
"node-sass": "^4.6.0",
"postcss-loader": "1.3.3",
"react-router": "3.2.0",
"sass-lint": "^1.12.1",
"sass-loader": "6.0.6",
"sasslint-webpack-plugin": "^1.0.4",

View File

@@ -2060,6 +2060,14 @@ create-react-class@15.x:
loose-envify "^1.3.1"
object-assign "^4.1.1"
create-react-class@^15.5.1:
version "15.6.3"
resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
dependencies:
fbjs "^0.8.9"
loose-envify "^1.3.1"
object-assign "^4.1.1"
cross-spawn@^3.0.0:
version "3.0.1"
resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-3.0.1.tgz#1256037ecb9f0c5f79e3d6ef135e30770184b982"
@@ -3787,6 +3795,15 @@ he@1.1.x:
version "1.1.1"
resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
history@^3.0.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/history/-/history-3.3.0.tgz#fcedcce8f12975371545d735461033579a6dae9c"
dependencies:
invariant "^2.2.1"
loose-envify "^1.2.0"
query-string "^4.2.2"
warning "^3.0.0"
hmac-drbg@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"
@@ -4058,6 +4075,12 @@ invariant@^2.0.0, invariant@^2.2.0, invariant@^2.2.2:
dependencies:
loose-envify "^1.0.0"
invariant@^2.2.1:
version "2.2.4"
resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
dependencies:
loose-envify "^1.0.0"
invert-kv@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-1.0.0.tgz#104a8e4aaca6d3d8cd157a8ef8bfab2d7a3ffdb6"
@@ -4715,6 +4738,10 @@ js-tokens@^3.0.0, js-tokens@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
"js-tokens@^3.0.0 || ^4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
js-yaml@^3.4.3, js-yaml@^3.7.0, js-yaml@^3.9.1:
version "3.10.0"
resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.10.0.tgz#2e78441646bd4682e963f22b6e92823c309c62dc"
@@ -5083,6 +5110,12 @@ loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1:
dependencies:
js-tokens "^3.0.0"
loose-envify@^1.2.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
dependencies:
js-tokens "^3.0.0 || ^4.0.0"
loud-rejection@^1.0.0:
version "1.6.0"
resolved "https://registry.yarnpkg.com/loud-rejection/-/loud-rejection-1.6.0.tgz#5b46f80147edee578870f086d04821cf998e551f"
@@ -6429,6 +6462,13 @@ prop-types@15.6.0, prop-types@15.x, prop-types@^15.5.10, prop-types@^15.5.4, pro
loose-envify "^1.3.1"
object-assign "^4.1.1"
prop-types@^15.5.6:
version "15.6.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
dependencies:
loose-envify "^1.3.1"
object-assign "^4.1.1"
proxy-addr@~1.1.3:
version "1.1.5"
resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-1.1.5.tgz#71c0ee3b102de3f202f3b64f608d173fcba1a918"
@@ -6482,7 +6522,7 @@ qs@~6.5.1:
version "6.5.1"
resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.1.tgz#349cdf6eef89ec45c12d7d5eb3fc0c870343a6d8"
query-string@^4.1.0:
query-string@^4.1.0, query-string@^4.2.2:
version "4.3.4"
resolved "https://registry.yarnpkg.com/query-string/-/query-string-4.3.4.tgz#bbb693b9ca915c232515b228b1a02b609043dbeb"
dependencies:
@@ -6634,6 +6674,18 @@ react-resize-aware@2.7.0:
version "2.7.0"
resolved "https://registry.yarnpkg.com/react-resize-aware/-/react-resize-aware-2.7.0.tgz#1bb6d0b45a234d94d412b5c3f5e9d2ffbf973429"
react-router@3.2.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/react-router/-/react-router-3.2.0.tgz#62b6279d589b70b34e265113e4c0a9261a02ed36"
dependencies:
create-react-class "^15.5.1"
history "^3.0.0"
hoist-non-react-statics "^1.2.0"
invariant "^2.2.1"
loose-envify "^1.2.0"
prop-types "^15.5.6"
warning "^3.0.0"
react@16.1.0:
version "16.1.0"
resolved "https://registry.yarnpkg.com/react/-/react-16.1.0.tgz#1c2bdac3c17fe7ee9282fa35aca6cc36387903e1"
@@ -8345,9 +8397,9 @@ wd@^0.4.0:
underscore.string "~3.0.3"
vargs "~0.1.0"
weaveworks-ui-components@0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/weaveworks-ui-components/-/weaveworks-ui-components-0.7.0.tgz#721f886c2dd6e93250afc446873f77f33f130cb0"
weaveworks-ui-components@0.11.8:
version "0.11.8"
resolved "https://registry.yarnpkg.com/weaveworks-ui-components/-/weaveworks-ui-components-0.11.8.tgz#4e649e418f5fb1746b908cc4edaa77ebadaf75e8"
dependencies:
classnames "2.2.5"
d3-drag "1.2.1"