diff options
Diffstat (limited to 'src/components')
5 files changed, 28 insertions, 62 deletions
diff --git a/src/components/experiments/ExperimentListComponent.js b/src/components/experiments/ExperimentListComponent.js index 473a7651..f315ebbf 100644 --- a/src/components/experiments/ExperimentListComponent.js +++ b/src/components/experiments/ExperimentListComponent.js @@ -10,13 +10,14 @@ const ExperimentListComponent = ({experimentIds}) => { <span className="info-icon fa fa-question-circle mr-2"/> <strong>No experiments here yet...</strong> Add some with the button below! </div> : - <table className="table"> + <table className="table table-striped"> <thead> <tr> <th>Name</th> <th>Path</th> <th>Trace</th> <th>Scheduler</th> + <th/> </tr> </thead> <tbody> diff --git a/src/components/experiments/ExperimentRowComponent.js b/src/components/experiments/ExperimentRowComponent.js index fbb0aac7..b7468ac7 100644 --- a/src/components/experiments/ExperimentRowComponent.js +++ b/src/components/experiments/ExperimentRowComponent.js @@ -1,17 +1,36 @@ +import PropTypes from "prop-types"; import React from "react"; +import {Link} from "react-router-dom"; import Shapes from "../../shapes/index"; -const ExperimentRowComponent = ({experiment}) => ( +const ExperimentRowComponent = ({experiment, simulationId, onDelete}) => ( <tr> <td>{experiment.name}</td> <td>{experiment.path.name ? experiment.path.name : "Path " + experiment.path.id}</td> <td>{experiment.trace.name}</td> <td>{experiment.scheduler.name}</td> + <td className="text-right"> + <Link + to={"/simulations/" + simulationId + "/experiments/" + experiment.id} + className="btn btn-outline-primary mr-1" + title="Open this experiment" + > + <span className="fa fa-play"/> + </Link> + <div + className="btn btn-outline-danger" + title="Delete this experiment" + onClick={() => onDelete(experiment.id)} + > + <span className="fa fa-trash"/> + </div> + </td> </tr> ); ExperimentRowComponent.propTypes = { - experiment: Shapes.Experiment + experiment: Shapes.Experiment.isRequired, + simulationId: PropTypes.number.isRequired, }; export default ExperimentRowComponent; diff --git a/src/components/simulations/SimulationActionButtons.js b/src/components/simulations/SimulationActionButtons.js index 1cb80c94..448944c8 100644 --- a/src/components/simulations/SimulationActionButtons.js +++ b/src/components/simulations/SimulationActionButtons.js @@ -3,15 +3,15 @@ import React from 'react'; import {Link} from "react-router-dom"; const SimulationActionButtons = ({simulationId, onViewUsers, onDelete}) => ( - <td className="simulation-icons"> - <Link to={"/simulations/" + simulationId} className="open" title="Open this simulation"> + <td className="text-right"> + <Link to={"/simulations/" + simulationId} className="btn btn-outline-primary mr-1" title="Open this simulation"> <span className="fa fa-play"/> </Link> - <div className="users" title="View and edit collaborators" + <div className="btn btn-outline-success mr-1" title="View and edit collaborators" onClick={() => onViewUsers(simulationId)}> <span className="fa fa-users"/> </div> - <div className="delete" title="Delete this simulation" onClick={() => onDelete(simulationId)}> + <div className="btn btn-outline-danger" title="Delete this simulation" onClick={() => onDelete(simulationId)}> <span className="fa fa-trash"/> </div> </td> diff --git a/src/components/simulations/SimulationAuthList.js b/src/components/simulations/SimulationAuthList.js index fd5173a8..27b141fe 100644 --- a/src/components/simulations/SimulationAuthList.js +++ b/src/components/simulations/SimulationAuthList.js @@ -1,7 +1,6 @@ import PropTypes from 'prop-types'; import React from 'react'; import Shapes from "../../shapes/index"; -import "./SimulationAuthList.css"; import SimulationAuthRow from "./SimulationAuthRow"; const SimulationAuthList = ({authorizations}) => { @@ -12,7 +11,7 @@ const SimulationAuthList = ({authorizations}) => { <span className="info-icon fa fa-question-circle mr-2"/> <strong>No simulations here yet...</strong> Add some with the 'New Simulation' button! </div> : - <table className="table"> + <table className="table table-striped"> <thead> <tr> <th>Simulation name</th> diff --git a/src/components/simulations/SimulationAuthList.sass b/src/components/simulations/SimulationAuthList.sass deleted file mode 100644 index b09c7869..00000000 --- a/src/components/simulations/SimulationAuthList.sass +++ /dev/null @@ -1,53 +0,0 @@ -@import ../../style-globals/_mixins.sass -@import ../../style-globals/_variables.sass - -.simulation-icons - text-align: right - -.simulation-icons div, .simulation-icons a - display: inline-block - width: 35px - height: 35px - margin-right: 5px - padding: 5px - font-size: 12pt - color: white - +border-radius(100%) - +clickable - +transition(background, $transition-length) - - span - position: relative - left: -6px - - background-color: $blue-dark - - &.open - $icon-color: #0a00bf - - &:hover - background: lighten($icon-color, 10%) - - &:active - background: darken($icon-color, 10%) - - &.users - $icon-color: #17bf55 - - span - left: -3px - - &:hover - background: $icon-color - - &:active - background: darken($icon-color, 10%) - - &.delete - $icon-color: #e3474d - - &:hover - background: $icon-color - - &:active - background: darken($icon-color, 10%) |