CSS: no more shadows (requires too much CPU)

src/App/AST.css

@@ -97,21 +97,7 @@ ul {
   /* list-style-position: ; */
 }
 
-.insetParent {
-  position: relative;
-}
-
-.insetChild {
-  position: absolute;
-  box-shadow: inset 0 10px 10px -10px rgba(0, 0, 0, 0.75);
-  height: 20px;
-  z-index: 10;
-  pointer-events: none;
-  inset: 0;
-}
-
-
 .onTop {
-  box-shadow: 0 -10px 10px 10px rgba(0, 0, 0, 0.75);
+  box-shadow: 0 -10px 20px 10px rgba(0, 0, 0, 0.75);
   z-index: 1;
 }

src/App/App.css

@@ -77,19 +77,3 @@ button.active {
   max-height: 100vh;
   overflow: auto;
 }
-
-
-
-.line {
-    border-bottom: solid 1px #000;
-    height: 10px;
-    line-height: 20px;
-    text-align: left;
-    margin-bottom: 14px;
-}
-.line .content {
-    background-color: #FFF;
-    display: inline;
-    padding: 0 10px;
-    margin-left: 10px;
-}

src/VisualEditor/VisualEditor.css

@@ -39,9 +39,10 @@
   stroke: var(--error-color);
 }
 .rountangle.active {
-  stroke: rgb(192, 125, 0);
+  stroke: rgb(205, 133, 0);
-  fill:rgb(255, 251, 244);
+  /* stroke: none; */
-  filter: drop-shadow( 0px 0px 3px rgba(192, 125, 0, 0.85));
+  fill:rgb(255, 240, 214);
+  /* filter: drop-shadow( 2px 2px 2px rgba(124, 37, 10, 0.729)); */
 }
 
 .selected:hover:not(:active) {
@@ -159,12 +160,22 @@ text.helper:hover {
   stroke: var(--error-color);
 }
 .arrow.fired {
-  stroke: rgb(231, 111, 0);
+  stroke: rgb(160, 0, 168);
-  stroke-width: 3px;
+  stroke-width: 4px;
-
+  /* animation: blinkTransition 1s infinite; */
-  filter: drop-shadow( 0px 0px 5px rgb(186, 5, 195));
 }
 
+@keyframes blinkTransition {
+  100%,
+  0% {
+    stroke: rgb(231, 111, 0);
+  }
+  100% {
+    stroke: rgb(160, 0, 168);
+  }
+}
+
+
 text.error, tspan.error {
   fill: var(--error-color);
   font-weight: 600;