From 0187fcfc2c2ec50799b545c52e39cac2ac2262c0 Mon Sep 17 00:00:00 2001
From: tannerlinsley <tannerlinsley@gmail.com>
Date: Tue, 30 Jul 2019 10:33:06 -0600
Subject: [PATCH] fix(example): fixed css issues in codesandbox (no css prop)

---
 examples/filtering-client-side/src/App.js | 22 +++++++-------
 examples/grouping-client-side/src/App.js  | 36 +++++++++++------------
 2 files changed, 29 insertions(+), 29 deletions(-)

diff --git a/examples/filtering-client-side/src/App.js b/examples/filtering-client-side/src/App.js
index 4cf2ca5..d510680 100644
--- a/examples/filtering-client-side/src/App.js
+++ b/examples/filtering-client-side/src/App.js
@@ -123,9 +123,9 @@ function SliderColumnFilter({ filterValue, setFilter, preFilteredRows, id }) {
 function NumberRangeColumnFilter({ filterValue = [], setFilter }) {
   return (
     <div
-      css={`
-        display: flex;
-      `}
+      style={{
+        display: 'flex',
+      }}
     >
       <input
         value={filterValue[0] || ''}
@@ -135,10 +135,10 @@ function NumberRangeColumnFilter({ filterValue = [], setFilter }) {
           setFilter((old = []) => [val ? parseInt(val, 10) : undefined, old[1]])
         }}
         placeholder="Min"
-        css={`
-          width: 70px;
-          margin-right: 0.5rem;
-        `}
+        style={{
+          width: '70px',
+          marginRight: '0.5rem',
+        }}
       />
       to
       <input
@@ -149,10 +149,10 @@ function NumberRangeColumnFilter({ filterValue = [], setFilter }) {
           setFilter((old = []) => [old[0], val ? parseInt(val, 10) : undefined])
         }}
         placeholder="Max"
-        css={`
-          width: 70px;
-          margin-left: 0.5rem;
-        `}
+        style={{
+          width: '70px',
+          marginLeft: '0.5rem',
+        }}
       />
     </div>
   )
diff --git a/examples/grouping-client-side/src/App.js b/examples/grouping-client-side/src/App.js
index 41d5806..277ac5e 100644
--- a/examples/grouping-client-side/src/App.js
+++ b/examples/grouping-client-side/src/App.js
@@ -139,34 +139,34 @@ function Table({ columns, data }) {
 function Legend() {
   return (
     <div
-      css={`
-        padding: 0.5rem 0;
-      `}
+      style={{
+        padding: '0.5rem 0',
+      }}
     >
       <span
-        css={`
-          display: inline-block;
-          background: #0aff0082;
-          padding: 0.5rem;
-        `}
+        style={{
+          display: 'inline-block',
+          background: '#0aff0082',
+          padding: '0.5rem',
+        }}
       >
         Grouped
       </span>{' '}
       <span
-        css={`
-          display: inline-block;
-          background: #ffa50078;
-          padding: 0.5rem;
-        `}
+        style={{
+          display: 'inline-block',
+          background: '#ffa50078',
+          padding: '0.5rem',
+        }}
       >
         Aggregated
       </span>{' '}
       <span
-        css={`
-          display: inline-block;
-          background: #ff000042;
-          padding: 0.5rem;
-        `}
+        style={{
+          display: 'inline-block',
+          background: '#ff000042',
+          padding: '0.5rem',
+        }}
       >
         Repeated Value
       </span>