diff --git a/client/cryps.css b/client/cryps.css index 7e635e30..6490fa65 100644 --- a/client/cryps.css +++ b/client/cryps.css @@ -166,6 +166,11 @@ img { stroke: #6AD1BF; } +.gray { + color: #333; + stroke: #333; +} + /* LOGIN */ @@ -464,9 +469,9 @@ button[disabled] { .vbox-btn { flex: 1 0 100%; margin: 0; - padding: 0 0.5em; background-color: whitesmoke; color: black; + border-width: 0; } .vbox-btn:hover { @@ -710,7 +715,7 @@ table td svg { border-top-width: 1px; } -.instance-cryp:first-child { +.instance-cryp button:first-child { border-top-width: 0; } diff --git a/client/src/components/instance.cryps.jsx b/client/src/components/instance.cryps.jsx index 6ae4013e..eda591bb 100644 --- a/client/src/components/instance.cryps.jsx +++ b/client/src/components/instance.cryps.jsx @@ -107,19 +107,19 @@ function Cryp(props) { ); }); - const cTotal = cryp.colours.red + cryp.colours.blue + cryp.colours.green; - const colours = mapValues(cryp.colours, c => { - if (cTotal === 0) return 245; - return Math.floor(c / cTotal * 255); - }); - const alpha = cTotal === 0 ? 1 : 0.75; - const thickness = total => { - if (total < 3) return 1; - if (total < 6) return 2; - if (total < 9) return 3; - return 4; - }; - const border = { border: `${thickness(cTotal)}px solid rgba(${colours.red}, ${colours.green}, ${colours.blue}, ${alpha})` }; + // const cTotal = cryp.colours.red + cryp.colours.blue + cryp.colours.green; + // const colours = mapValues(cryp.colours, c => { + // if (cTotal === 0) return 245; + // return Math.floor(c / cTotal * 255); + // }); + // const alpha = cTotal === 0 ? 1 : 0.75; + // const thickness = total => { + // if (total < 3) return 1; + // if (total < 6) return 2; + // if (total < 9) return 3; + // return 4; + // }; + // const border = { border: `${thickness(cTotal)}px solid rgba(${colours.red}, ${colours.green}, ${colours.blue}, ${alpha})` }; return (
| combinerRmv(0)}>{convertVar(vbox.bound[combiner[0]])} | -combinerRmv(1)}>{convertVar(vbox.bound[combiner[1]])} | -combinerRmv(2)}>{convertVar(vbox.bound[combiner[2]])} | +combinerRmv(0)}> + {combiner[0] !== null ? convertVar(vbox.bound[combiner[0]]) : shapes.vboxColour('gray')} + | +combinerRmv(1)}> + {combiner[1] !== null ? convertVar(vbox.bound[combiner[1]]) : shapes.vboxColour('gray')} + | +combinerRmv(2)}> + {convertVar(vbox.bound[combiner[2]])} + |