Took the information button out of the line of text

Relates #19
astroash · Oct 12, 2017 · 9f9d9db · 9f9d9db
1 parent 55cc783
commit 9f9d9db
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/src/components/ModalInfograph.js b/src/components/ModalInfograph.js
@@ -22,7 +22,7 @@ class ModalInfograph extends React.Component {
   render() {
     return (
       <div className="infograph-container">
-        <button className="modal-button pointer ba b--white bg-white b h2 pink" onClick={this.handleOpenModal}>i</button>
+        <button className="modal-button bn modal-info pointer" onClick={this.handleOpenModal}>i</button>
         <ReactModal
           isOpen={this.state.showModal}
           contentLabel="onRequestClose Example"

diff --git a/src/css/Modal.css b/src/css/Modal.css
@@ -6,6 +6,16 @@
   height: 0;
   width: 0;
 }
+.modal-info {
+  position: absolute;
+  right: 6rem;
+  bottom: 3rem;
+  background-color: hotpink;
+  color: white;
+  border-radius: 5px;
+  padding: 0rem 0.5rem;
+  font-size: 2rem;
+}
 
 .modal-button:focus {
   outline: none;