summaryrefslogtreecommitdiff
path: root/src/components/simulations
diff options
context:
space:
mode:
authorGeorgios Andreadis <g.andreadis@student.tudelft.nl>2017-09-15 13:39:36 +0200
committerGeorgios Andreadis <g.andreadis@student.tudelft.nl>2017-09-23 10:06:03 +0200
commit653290da64e3d85f422d1f00407b74011999a5fa (patch)
tree756218498f26fc17963a94c4e8f84177dea05f15 /src/components/simulations
parent2c8b84b393caaec7da5a89fb15908a2c1f262c50 (diff)
Rebrand simulation and experiment row buttons
Diffstat (limited to 'src/components/simulations')
-rw-r--r--src/components/simulations/SimulationActionButtons.js8
-rw-r--r--src/components/simulations/SimulationAuthList.js3
-rw-r--r--src/components/simulations/SimulationAuthList.sass53
3 files changed, 5 insertions, 59 deletions
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%)