Css edits

Author: raulclassico7

app/src/components/StateManagement/CreateTab/components/TableParentProps.tsx

@@ -57,7 +57,7 @@ const TableParentProps = props => {
       renderCell: function renderCell(params: any) {
         return (
           <Button
-            style={{ width: `${3}px`, color: 'black'}}
+            style={{ width: `${3}px`, color: 'white'}}
             onClick={() => {
               addProps(params.row, params.id - 1);
             }}

app/src/components/bottom/BottomTabs.tsx

@@ -130,9 +130,9 @@ const BottomTabs = (props): JSX.Element => {
         {tab === 1 && <CustomizationPanel isThemeLight={props.isThemeLight} />}
         {tab === 2 && <StylesEditor theme={theme} setTheme={setTheme} />}
         {/* {tab === 3 && <CodePreview theme={theme} setTheme={setTheme} />} */}
-        {tab === 4 && <Tree data={components} />}
-        {tab === 5 && <ContextManager theme={theme} setTheme={setTheme} />}
-        {tab === 6 && (
+        {tab === 3 && <Tree data={components} />}
+        {tab === 4 && <ContextManager theme={theme} setTheme={setTheme} />}
+        {tab === 5 && (
           <StateManager
             theme={theme}
             setTheme={setTheme}

app/src/components/left/HTMLPanel.tsx

@@ -199,7 +199,7 @@ const HTMLPanel = (props): JSX.Element => {
               style={{ margin: '10px' }}
               InputProps={{
                 style: {
-                  color: !isDarkMode ? 'black' : 'white'
+                  color: !isDarkMode ? 'white' : 'white'
                 }
               }}
             />
@@ -247,7 +247,7 @@ const HTMLPanel = (props): JSX.Element => {
               style={{}}
               InputProps={{
                 style: {
-                  color: !isDarkMode ? 'black' : 'white'
+                  color: !isDarkMode ? 'white' : 'white'
                 }
               }}
             />

app/src/components/main/DirectChildComponent.tsx

@@ -70,7 +70,7 @@ function DirectChildComponent({
       ref={drag}
     >
         <span>
-          <strong>{name}</strong>
+          <strong style={{ color: 'white' }}>{name}</strong>
           <DeleteButton id={childId} name={name} />  
         </span>
 

app/src/components/main/DirectChildHTML.tsx

@@ -53,7 +53,7 @@ function DirectChildHTML({ childId, name, type, typeId, style }: ChildElement) {
     border:
       state.canvasFocus.childId === childId
         ? '4px solid #186BB4'
-        : '2px solid #4d8cc4'
+        : '1px solid grey'
   };
 
   const combinedStyle = combineStyles(

app/src/components/main/RouteLink.tsx

@@ -56,7 +56,7 @@ function RouteLink({ childId, type, typeId, style }: ChildElement) {
         ? '3px solid #a7cced'
         : '1px Solid grey',
     boxShadow:
-      state.canvasFocus.childId === childId ? '1px 1px 3px rgb(11,212,112)' : ''
+      state.canvasFocus.childId === childId ? '1px 5px 3px rgb(11,212,112)' : ''
   };
   const combinedStyle = combineStyles(
     combineStyles(combineStyles(globalDefaultStyle, routeStyle), style),

app/src/components/main/SeparatorChild.tsx

@@ -103,11 +103,11 @@ function DirectChildHTMLNestable({
   // priority order is 1) style directly set for this child (style), 2) style of the referenced HTML element, and 3) default styling
   const defaultNestableStyle = { ...globalDefaultStyle };
   const separatorStyle = {
-    padding: '5px 10px',
+    padding: '2px 10px',
     margin: '1px 10px',
   };
 
-  defaultNestableStyle['backgroundColor'] = isOver ? 'yellow' : 'rgba(0, 0, 255, 0.0)';
+  defaultNestableStyle['backgroundColor'] = isOver ? '#cee2f5' : 'rgba(0, 0, 255, 0.0)';
 
   const combinedStyle = combineStyles(
     combineStyles(combineStyles(defaultNestableStyle, HTMLType.style), style),

app/src/components/right/ComponentPanel.tsx

@@ -170,7 +170,7 @@ const ComponentPanel = ({ isThemeLight }): JSX.Element => {
                 style={{}}
                 InputProps={{
                   style: {
-                    color: isThemeLight ? 'black' : 'white'
+                    color: isThemeLight ? 'white' : 'white'
                   }
                 }}
               />