fork/cellxgene
1
0
Fork 0
mirror of https://github.com/chanzuckerberg/cellxgene.git synced 2026-09-26 06:48:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

Begin integrating blueprint (#359)

Browse Source 
* toast test

* modify webpack build to allow for global CSS; use CSS modules to scope component styling

* remove heatmap

* add label to index resets

* swapping out buttons for blueprint

* adding constants to globals

* swapping out blueprint buttons

* title position, sidebar improvements

* sidebar styles

* adding toasts for validation errors

* zebra section trial

* integrating blueprint, switching buttons over, breaking out scatter

* clean up console
This commit is contained in:
Colin Megill
2018-10-22 15:46:37 -04:00
committed by GitHub
parent 0c271bc815
commit df671192be
34 changed files with 717 additions and 737 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/graph/graph.js
+18 -63
View File
@@ -5,10 +5,8 @@ import * as d3 from "d3";
import { connect } from "react-redux";
import mat4 from "gl-mat4";
import _regl from "regl";
import { Button } from "@blueprintjs/core";
import { FaCrosshairs, FaSearchPlus } from "react-icons/fa";
import * as globals from "../../globals";
import setupSVGandBrushElements from "./setupSVGandBrush";
import actions from "../../actions";
import _camera from "../../util/camera";
@@ -340,91 +338,48 @@ class Graph extends React.Component {
alignItems: "baseline"
}}
>
<button
<Button
type="button"
style={{ marginRight: 10 }}
onClick={() => {
dispatch(actions.resetGraph());
}}
style={{
fontSize: 14,
fontWeight: 400,
color: "white",
padding: "0px 10px",
height: 30,
marginRight: 10,
borderRadius: 2,
backgroundColor: globals.brightBlue,
border: "none",
cursor: "pointer"
}}
>
reset graph
</button>
<button
</Button>
<Button
type="button"
style={{ marginRight: 10 }}
onClick={() => {
dispatch(actions.regraph());
}}
style={{
fontSize: 14,
fontWeight: 400,
color: "white",
padding: "0px 10px",
height: 30,
marginRight: 10,
borderRadius: 2,
backgroundColor: globals.brightBlue,
border: "none",
cursor: "pointer"
}}
>
regraph selection
</button>
</Button>
<div>
<span>
<button
<div className="bp3-button-group">
<Button
className="bp3-button bp3-icon-locate"
type="button"
active={mode === "brush"}
onClick={() => {
this.setState({ mode: "brush" });
}}
style={{
cursor: "pointer",
border:
mode === "brush" ? "1px solid black" : "1px solid white",
backgroundColor: "white",
padding: "5px 5px 2px 5px",
position: "relative",
top: 2,
marginRight: 10,
borderRadius: 3
}}
>
{" "}
<FaCrosshairs />{" "}
</button>
<button
/>
<Button
type="button"
className="bp3-button bp3-icon-zoom-in"
active={mode === "zoom"}
onClick={() => {
this.handleBrushDeselectAction();
this.restartReglLoop();
this.setState({ mode: "zoom" });
}}
style={{
cursor: "pointer",
border:
mode === "zoom" ? "1px solid black" : "1px solid white",
backgroundColor: "white",
padding: "5px 5px 2px 5px",
position: "relative",
top: 2,
marginRight: 10,
borderRadius: 3
cursor: "pointer"
}}
>
{" "}
<FaSearchPlus />{" "}
</button>
</span>
/>
</div>
</div>
</div>
</div>