Update App.css to include styles for "Events" demo

zingchart · Dec 7, 2023 · 6bf4c7d · 6bf4c7d
1 parent 7ec6e88
commit 6bf4c7d
Showing 1 changed file with 44 additions and 23 deletions.
diff --git a/src/App.css b/src/App.css
@@ -9,18 +9,19 @@
   align-items: center;
   justify-content: center;
   font-size: 120%;
-  color: #fff;
+  color: white;
 }
 
 .App-buttonbar {
   display: flex;
   flex-direction: row;
+  padding-bottom: 2em;
 }
 
 [class*="App-button-"] {
-  background-color: #4caf50;
+  background-color: #4CAF50;
   border: none;
-  color: #fff;
+  color: white;
   padding: 15px 32px;
   text-align: center;
   display: inline-block;
@@ -30,33 +31,53 @@
   margin-right: 1em;
 }
 
-.App-button-plain:hover {
-  box-shadow: 0 12px 16px 0 rgba(0, 0, 0, 0.24),
-    0 17px 50px 0 rgba(0, 0, 0, 0.19);
+.App-button-plain {
+  color: white;
 }
 
 .App-button-active {
-  color: #000;
+  color: black;
 }
 
-.App-source-button {
-  background-color: #1a456d;
-  border: none;
-  color: white;
-  padding: 0.5rem 1.25rem;
-  text-align: center;
-  display: inline-block;
-  font-size: 16px;
-  border-radius: 5px;
-  text-decoration: none;
-  margin-right: 1rem;
+.App-button-plain:hover {
+  box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
 }
 
-.App-demo-titlebar {
-  background-color: #c3c3c5;
-  padding: 15px 32px;
+.App-link {
+  color: #61dafb;
+}
+
+.Events-wrapper {
+  display: flex;
+  flex-direction: row;
+}
+
+.Events-output {
+  border: 1px;
+  border-style: solid;
+  width: 30%;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  margin-right: 1em;
+}
+
+.Events-bound {
+  margin-left: 1em;
+  text-align: left;
+}
+
+.Events-bound ul {
+  margin-top: 0.5em;
+}
+
+.Events-renderState {
+  background-color:#c3c3c5;
+  color: white;
+  padding-top: 0.3em;
+  padding-bottom: 0.3em;
 }
 
-.App-demo-titlebar h3 {
-  color: #484848;
+.Events-nodeInfo {
+  margin-left: 1em;
+  text-align: left;
 }