🎨 cleaning up old modal css declarations

improving classnames for transaction details items

src/pages/Pool/AddLiquidity.js

@@ -430,7 +430,6 @@ class AddLiquidity extends Component {
         key="context-info"
         contextualInfo={contextualInfo}
         isError={isError}
-        modalClass="pool__summary-modal"
         renderTransactionDetails={this.renderTransactionDetails}
       />
     );
@@ -457,10 +456,10 @@ class AddLiquidity extends Component {
     if (this.isNewExchange()) {
       return (
         <div>
-          <div className="pool__summary-modal__item">You are adding {b(`${inputValue} ETH`)} and {b(`${outputValue} ${label}`)} to the liquidity pool.</div>
-          <div className="pool__summary-modal__item">You are setting the initial exchange rate to {b(`1 ETH = ${BN(outputValue).dividedBy(inputValue).toFixed(4)} ${label}`)}.</div>
-          <div className="pool__summary-modal__item">You will mint {b(`${inputValue} liquidity tokens`)}.</div>
-          <div className="pool__summary-modal__item">Current total supply of liquidity tokens is 0.</div>
+          <div className="pool__summary-item">You are adding {b(`${inputValue} ETH`)} and {b(`${outputValue} ${label}`)} to the liquidity pool.</div>
+          <div className="pool__summary-item">You are setting the initial exchange rate to {b(`1 ETH = ${BN(outputValue).dividedBy(inputValue).toFixed(4)} ${label}`)}.</div>
+          <div className="pool__summary-item">You will mint {b(`${inputValue} liquidity tokens`)}.</div>
+          <div className="pool__summary-item">Current total supply of liquidity tokens is 0.</div>
         </div>
       );
     }
@@ -475,10 +474,10 @@ class AddLiquidity extends Component {
 
     return (
       <div>
-        <div className="pool__summary-modal__item">You are adding between {b(`${+BN(inputValue).toFixed(7)} ETH`)} and {b(`${+minOutput.toFixed(7)} - ${+maxOutput.toFixed(7)} ${label}`)} into the liquidity pool.</div>
-        <div className="pool__summary-modal__item">You will mint {b(+liquidityMinted.toFixed(7))} liquidity tokens.</div>
-        <div className="pool__summary-modal__item">Current total supply of liquidity tokens is {b(+adjTotalSupply.toFixed(7))}</div>
-        <div className="pool__summary-modal__item">At current exchange rate, each pool token is worth {b(+ethReserve.dividedBy(totalSupply).toFixed(7))} ETH and {b(+tokenReserve.dividedBy(totalSupply).toFixed(7))} {label}</div>
+        <div className="pool__summary-item">You are adding between {b(`${+BN(inputValue).toFixed(7)} ETH`)} and {b(`${+minOutput.toFixed(7)} - ${+maxOutput.toFixed(7)} ${label}`)} into the liquidity pool.</div>
+        <div className="pool__summary-item">You will mint {b(+liquidityMinted.toFixed(7))} liquidity tokens.</div>
+        <div className="pool__summary-item">Current total supply of liquidity tokens is {b(+adjTotalSupply.toFixed(7))}</div>
+        <div className="pool__summary-item">At current exchange rate, each pool token is worth {b(+ethReserve.dividedBy(totalSupply).toFixed(7))} ETH and {b(+tokenReserve.dividedBy(totalSupply).toFixed(7))} {label}</div>
       </div>
     );
   }

src/pages/Pool/RemoveLiquidity.js

@@ -185,7 +185,6 @@ class RemoveLiquidity extends Component {
         key="context-info"
         contextualInfo={contextualInfo}
         isError={isError}
-        modalClass="pool__summary-modal"
         renderTransactionDetails={this.renderTransactionDetails}
       />
     );
@@ -229,10 +228,10 @@ class RemoveLiquidity extends Component {
 
     return (
       <div>
-        <div className="pool__summary-modal__item">You are removing between {b(`${+BN(ethWithdrawn).toFixed(7)} ETH`)} and {b(`${+minTokenWithdrawn} - ${+maxTokenWithdrawn} ${label}`)} into the liquidity pool.</div>
-        <div className="pool__summary-modal__item">You will remove {b(+input)} liquidity tokens.</div>
-        <div className="pool__summary-modal__item">Current total supply of liquidity tokens is {b(+adjTotalSupply.toFixed(7))}</div>
-        <div className="pool__summary-modal__item">At current exchange rate, each pool token is worth {b(+ethReserve.dividedBy(totalSupply).toFixed(7))} ETH and {b(+tokenReserve.dividedBy(totalSupply).toFixed(7))} {label}</div>
+        <div className="pool__summary-item">You are removing between {b(`${+BN(ethWithdrawn).toFixed(7)} ETH`)} and {b(`${+minTokenWithdrawn} - ${+maxTokenWithdrawn} ${label}`)} into the liquidity pool.</div>
+        <div className="pool__summary-item">You will remove {b(+input)} liquidity tokens.</div>
+        <div className="pool__summary-item">Current total supply of liquidity tokens is {b(+adjTotalSupply.toFixed(7))}</div>
+        <div className="pool__summary-item">At current exchange rate, each pool token is worth {b(+ethReserve.dividedBy(totalSupply).toFixed(7))} ETH and {b(+tokenReserve.dividedBy(totalSupply).toFixed(7))} {label}</div>
       </div>
     );
   }

src/pages/Pool/pool.scss

@@ -80,44 +80,11 @@
     }
   }
 
-  &__summary-modal {
-    background-color: $white;
-    position: relative;
-    bottom: 20rem;
-    min-height: 20rem;
-    max-height: 20rem;
-    z-index: 2000;
-    padding: 1rem;
-    border-top-left-radius: 1rem;
-    border-top-right-radius: 1rem;
-    transition: 250ms ease-in-out;
-
-    @media only screen and (min-width : 768px) {
-      max-width: 560px;
-      position: absolute;
-      margin-left: auto;
-      margin-right: auto;
-      border-radius: 1rem;
-      padding-bottom: 1rem;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      top: 0;
-      margin-top: 4rem;
-    }
-
-    .swap__open-details-container {
-      padding: 0.5rem 0;
-      margin-bottom: 1rem;
-      cursor: pointer;
-    }
-
-    &__item {
+  &__summary-item {
     &:not(:last-child) {
       margin-bottom: .5rem;
     }
   }
-  }
 }
 
 .pool-modal {