mirror of
https://github.com/apache/superset.git
synced 2026-04-18 23:55:00 +00:00
refactor: Removes the CSS files from the Parallel Coordinates plugin (#19539)
* refactor: Removes the CSS files from the Parallel Coordinates plugin * Adds test * Fixes indentation
This commit is contained in:
committed by
GitHub
parent
97850a80c8
commit
38fbca10e3
@@ -23,7 +23,6 @@ import { getSequentialSchemeRegistry } from '@superset-ui/core';
|
||||
|
||||
import parcoords from './vendor/parcoords/d3.parcoords';
|
||||
import divgrid from './vendor/parcoords/divgrid';
|
||||
import './vendor/parcoords/d3.parcoords.css';
|
||||
|
||||
const propTypes = {
|
||||
// Standard tabular data [{ fieldName1: value1, fieldName2: value2 }]
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { styled, reactify } from '@superset-ui/core';
|
||||
import { styled, reactify, addAlpha } from '@superset-ui/core';
|
||||
import PropTypes from 'prop-types';
|
||||
import Component from './ParallelCoordinates';
|
||||
|
||||
@@ -34,14 +34,93 @@ ParallelCoordianes.propTypes = {
|
||||
};
|
||||
|
||||
export default styled(ParallelCoordianes)`
|
||||
.superset-legacy-chart-parallel-coordinates {
|
||||
div.grid {
|
||||
overflow: auto;
|
||||
div.row {
|
||||
&:hover {
|
||||
background-color: ${({ theme }) => theme.colors.grayscale.light2};
|
||||
${({ theme }) => `
|
||||
.superset-legacy-chart-parallel-coordinates {
|
||||
div.grid {
|
||||
overflow: auto;
|
||||
div.row {
|
||||
&:hover {
|
||||
background-color: ${theme.colors.grayscale.light2};
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.parcoords svg,
|
||||
.parcoords canvas {
|
||||
font-size: ${theme.typography.sizes.s}px;
|
||||
position: absolute;
|
||||
}
|
||||
.parcoords > canvas {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.parcoords text.label {
|
||||
font: 100%;
|
||||
font-size: ${theme.typography.sizes.s}px;
|
||||
cursor: drag;
|
||||
}
|
||||
.parcoords rect.background {
|
||||
fill: transparent;
|
||||
}
|
||||
.parcoords rect.background:hover {
|
||||
fill: ${addAlpha(theme.colors.grayscale.base, 0.2)};
|
||||
}
|
||||
.parcoords .resize rect {
|
||||
fill: ${addAlpha(theme.colors.grayscale.dark2, 0.1)};
|
||||
}
|
||||
.parcoords rect.extent {
|
||||
fill: ${addAlpha(theme.colors.grayscale.light5, 0.25)};
|
||||
stroke: ${addAlpha(theme.colors.grayscale.dark2, 0.6)};
|
||||
}
|
||||
.parcoords .axis line,
|
||||
.parcoords .axis path {
|
||||
fill: none;
|
||||
stroke: ${theme.colors.grayscale.dark1};
|
||||
shape-rendering: crispEdges;
|
||||
}
|
||||
.parcoords canvas {
|
||||
opacity: 1;
|
||||
-moz-transition: opacity 0.3s;
|
||||
-webkit-transition: opacity 0.3s;
|
||||
-o-transition: opacity 0.3s;
|
||||
}
|
||||
.parcoords canvas.faded {
|
||||
opacity: ${theme.opacity.mediumLight};
|
||||
}
|
||||
.parcoords {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
background-color: ${theme.colors.grayscale.light5};
|
||||
}
|
||||
|
||||
/* data table styles */
|
||||
.parcoords .row,
|
||||
.parcoords .header {
|
||||
clear: left;
|
||||
font-size: ${theme.typography.sizes.s}px;
|
||||
line-height: 18px;
|
||||
height: 18px;
|
||||
margin: 0px;
|
||||
}
|
||||
.parcoords .row:nth-child(odd) {
|
||||
background: ${addAlpha(theme.colors.grayscale.dark2, 0.05)};
|
||||
}
|
||||
.parcoords .header {
|
||||
font-weight: ${theme.typography.weights.bold};
|
||||
}
|
||||
.parcoords .cell {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
width: 100px;
|
||||
height: 18px;
|
||||
}
|
||||
.parcoords .col-0 {
|
||||
width: 180px;
|
||||
}
|
||||
`}
|
||||
`;
|
||||
|
||||
@@ -1,79 +0,0 @@
|
||||
/* [LICENSE TBD] */
|
||||
.parcoords svg,
|
||||
.parcoords canvas {
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
}
|
||||
.parcoords > canvas {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.parcoords text.label {
|
||||
font: 100%;
|
||||
font-size: 12px;
|
||||
cursor: drag;
|
||||
}
|
||||
|
||||
.parcoords rect.background {
|
||||
fill: transparent;
|
||||
}
|
||||
.parcoords rect.background:hover {
|
||||
fill: rgba(120, 120, 120, 0.2);
|
||||
}
|
||||
.parcoords .resize rect {
|
||||
fill: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.parcoords rect.extent {
|
||||
fill: rgba(255, 255, 255, 0.25);
|
||||
stroke: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
.parcoords .axis line,
|
||||
.parcoords .axis path {
|
||||
fill: none;
|
||||
stroke: #222;
|
||||
shape-rendering: crispEdges;
|
||||
}
|
||||
.parcoords canvas {
|
||||
opacity: 1;
|
||||
-moz-transition: opacity 0.3s;
|
||||
-webkit-transition: opacity 0.3s;
|
||||
-o-transition: opacity 0.3s;
|
||||
}
|
||||
.parcoords canvas.faded {
|
||||
opacity: 0.25;
|
||||
}
|
||||
.parcoords {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/* data table styles */
|
||||
.parcoords .row,
|
||||
.parcoords .header {
|
||||
clear: left;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
height: 18px;
|
||||
margin: 0px;
|
||||
}
|
||||
.parcoords .row:nth-child(odd) {
|
||||
background: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
.parcoords .header {
|
||||
font-weight: bold;
|
||||
}
|
||||
.parcoords .cell {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
width: 100px;
|
||||
height: 18px;
|
||||
}
|
||||
.parcoords .col-0 {
|
||||
width: 180px;
|
||||
}
|
||||
Reference in New Issue
Block a user