From 81e0e24c3c5a542d58621d1e2204cc86b9eb4a01 Mon Sep 17 00:00:00 2001
From: howard <twpride@gmail.com>
Date: Thu, 1 Apr 2021 03:10:00 -0700
Subject: [PATCH] tailwind progress

---
 dist/index.html | 11 +----------
 src/app.css     | 27 +++++++++++++++------------
 src/app.jsx     | 14 ++++++++++----
 3 files changed, 26 insertions(+), 26 deletions(-)

diff --git a/dist/index.html b/dist/index.html
index 4910097..06b8cd5 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -15,20 +15,11 @@
 
   <link rel="apple-touch-icon" href="icon-192.png" />
   <link rel="manifest" href="manifest.json" />
+  <link href="app.css" rel="stylesheet">
   <title>CAD Tool</title>
 
   <style>
-    html,
-    body {
-      margin: 0;
-      height: 100%;
-    }
 
-    #c {
-      width: 100%;
-      height: 100%;
-      display: block;
-    }
 
 
   </style>
diff --git a/src/app.css b/src/app.css
index b831ab4..8bbcc7b 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,19 +1,22 @@
-
-
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
 
-.buttons-group {
-  position: absolute;
-  left:0;
-  display: flex;
-  flex-direction: column;
+html,
+body {
+  margin: 0;
+  height: 100%;
+}
+
+#c {
+  width: 100%;
+  height: 100%;
+  display: block;
 }
 
 
-/* .feature-tree {
-  color: red;
-  position: absolute;
-  right:0;
-} */
+@layer components {
+  .btn-blue {
+    @apply bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded cursor-pointer
+  }
+}
diff --git a/src/app.jsx b/src/app.jsx
index 93aa588..2a2b7bc 100644
--- a/src/app.jsx
+++ b/src/app.jsx
@@ -38,17 +38,23 @@ const App = () => {
 
   return <>
 
-    <div className='buttons-group'>
+    <div className='absolute left-0 flex flex-col'>
+    {/* <div className='buttons-group'> */}
       {activeSketchNid ?
-        <button onClick={() => treeEntries.byNid[activeSketchNid].deactivate()}>
+        <div
+        className='btn-blue'
+         onClick={() => treeEntries.byNid[activeSketchNid].deactivate()}>
           Exit sketch
-        </button> :
-        <button onClick={sc.addSketch}> addsketch </button>
+        </div> :
+        <div 
+        className='btn-blue'
+        onClick={sc.addSketch}> addsketch </div>
       }
       <button onClick={() => sc.extrude(treeEntries.byNid[activeSketchNid])}> extrude </button>
       {/* <button onClick={() => setState('')}> test </button> */}
     </div>
 
+
     <div className='absolute right-0'>
       {treeEntries.allNids.map((entId, idx) => (
         <div className='text-red-700 text-4xl' key={idx}