border radius buttons

client/assets/styles/account.less

@@ -36,10 +36,9 @@
     }
 }
 
-.stripe-btn {
+.yellow-btn {
     background: @yellow;
     color: black;
-    border-radius: 2px;
     border-width: 0;
 
     &:active, &:focus, &:hover {

client/assets/styles/styles.less

@@ -105,11 +105,11 @@ button, input {
     height: auto;
     border-width: 2px;
     border-color: @gray-exists;
-    border-radius: 0;
     letter-spacing: 0.25em;
     box-sizing: border-box;
     font-size: 100%;
     flex: 1;
+    border-radius: 0.5em;
 
     /*the transitions */
     transition-property: border-color, color, background;
@@ -241,6 +241,8 @@ header {
 
     button {
         height: 2em;
+        // border-radius: 0.1em;
+        border-radius: 0;
     }
 }
 

client/src/components/account.top.jsx

@@ -120,7 +120,7 @@ class AccountStatus extends Component {
 
                 // resub button
                 if (subscription.cancel_at_period_end) {
-                    return <button class='stripe-btn' onClick={() => sendSubscriptionEnding(false)}>Resubscribe</button>
+                    return <button class='yellow-btn' onClick={() => sendSubscriptionEnding(false)}>Resubscribe</button>
                 }
 
                 const classes = `unsub ${unsubState ? 'confirming' : ''}`;

client/src/components/play.jsx

@@ -76,13 +76,13 @@ function Play(args) {
 
     const subscription = account.subscribed
         ? <button
-            class="stripe-btn"
+            class="yellow-btn"
             disabled>
             Subscribed
         </button>
         : <button
             onClick={() => setNav('shop')}
-            class="stripe-btn"
+            class="yellow-btn"
             role="link">
             Subscribe
         </button>;
@@ -109,7 +109,7 @@ function Play(args) {
                     {subscription}
                     <button
                         onClick={() => setNav('shop')}
-                        class="stripe-btn"
+                        class="yellow-btn"
                         role="link">
                         Get Credits
                     </button>

client/src/components/stripe.buttons.jsx

@@ -45,13 +45,13 @@ function BitsBtn(args) {
 
     const subscription = account.subscribed
         ? <button
-            class="stripe-btn"
+            class="yellow-btn"
             disabled>
             Subscribed
         </button>
         : <button
             onClick={subscribeClick}
-            class="stripe-btn"
+            class="yellow-btn"
             role="link">
             Subscribe
         </button>;
@@ -64,19 +64,19 @@ function BitsBtn(args) {
             <div class='list'>
                 <figure onClick={() => bitsClick(5)} >
                     <figcaption>$5 AUD</figcaption>
-                    <button class="stripe-btn">¤50</button>
+                    <button class="yellow-btn">¤50</button>
                 </figure>
                 <figure onClick={() => bitsClick(10)} >
                     <figcaption>$10 AUD</figcaption>
-                    <button class="stripe-btn">¤110</button>
+                    <button class="yellow-btn">¤110</button>
                 </figure>
                 <figure onClick={() => bitsClick(20)} >
                     <figcaption>$20 AUD</figcaption>
-                    <button class="stripe-btn">¤250</button>
+                    <button class="yellow-btn">¤250</button>
                 </figure>
                 <figure onClick={() => bitsClick(50)} >
                     <figcaption>$50 AUD</figcaption>
-                    <button class="stripe-btn">¤660</button>
+                    <button class="yellow-btn">¤660</button>
                 </figure>
                 <div id="error-message"></div>
             </div>