Frontend fix issues and improvments (#154)

* fix the frontend issues and improvements

* black color

* remove

* resolve the css issues

* delete the uncessary files and use the variant

Author: AQIB-NAWAB

app/components/Output/Output.tsx

@@ -67,7 +67,7 @@ const SchemaError = ({ schemaPath }: { schemaPath: string }) => {
         <b>Details:</b> {errorDetails}
       </div>
       <div style={{ marginTop: "10px" }}>
-        <div>Possible Fixes:</div>
+        <b>Possible Fixes:</b>
         <UnorderedList>
           {possibleFixes.map((fix, index) => (
             <ListItem key={index}>{fix}</ListItem>

app/styles/globals.css

@@ -74,4 +74,4 @@ html {
 
 main {
   height: 100%;
-}
+}

app/styles/theme.ts

@@ -17,7 +17,6 @@ const Button = {
     },
     success: {
       color: "hsl(var(--success))",
-
       borderColor: "hsl(var(--success))",
       borderWidth: "1px",
       _disabled: {
@@ -26,6 +25,9 @@ const Button = {
       _hover: {
         bg: "hsl(var(--success))",
         color: "black",
+        "& svg path": {
+          fill: "black", 
+        },
         _disabled: {
           color: "hsl(var(--success) / 0.4)",
         },

content/02-Primitive-Types/09-Combining-Types/instructions.mdx

@@ -20,7 +20,7 @@ Let's add a new property `hasAgreedToTerms` to the JSON object. This property sh
 
 ### Boolean 
 
-A `boolean` type can have two values: `true` or `false`. you can define a boolean type as follows:
+A `boolean` type can have two values: `true` or `false`. You can define a boolean type as follows:
 
 ```json
 {