made some small ui changes

Author: Sethuram52001

.eslintcache

@@ -1,4 +1,5 @@
 import React, { useState } from 'react';
+import "./AppNavbar.scss";
 import {
   Collapse,
   Navbar,
@@ -41,7 +42,6 @@ const AppNavbar = (props) => {
               <DropdownMenu right>
                 <DropdownItem>
                   <Button onClick={() => { props.handleDijkstra(); props.handleVisualization() }}>Dijkstra</Button>
-                  {/* <Button onClick={ props.handleDijkstra}>Dijkstra</Button> */}
                 </DropdownItem>
                 <DropdownItem>
                   <Button onClick={() => { props.handleDFS(); props.handleVisualization() }}>DFS</Button>              
@@ -72,7 +72,7 @@ const AppNavbar = (props) => {
         <NavbarText>
           <ProgressBar visitedNodes={props.visitedNodes} shortestNodes={props.shortestNodes} />
         </NavbarText>
-        <NavbarText>
+        <NavbarText className="clear-functions">
           <ButtonGroup>
             <Button id={"Tooltip-" + 0} onClick={props.handleClearPath}>Clear Path</Button>
             <Button id={"Tooltip-" + 1} onClick={props.handleClearGrid}>Clear Grid</Button>

src/components/AppNavbar/AppNavbar.js

@@ -0,0 +1,3 @@
+.clear-functions {
+    margin-right: 10px;
+}

src/components/AppNavbar/AppNavbar.scss

@@ -18,15 +18,4 @@ const ProgressBar = (props) => {
      );
 }
 
-export default ProgressBar;
-
-/*
-       <NavbarText>
-          visited nodes: {props.visitedNodes}
-          <Progress value={props.visitedNodes/800} color="danger" />
-        </NavbarText>
-        <NavbarText>
-          shortes path: {props.shortestNodes}
-          <Progress value={props.shortestNodes/800} color="success" />
-        </NavbarText>
- */
+export default ProgressBar;

src/components/ProgressBar/ProgressBar.js

@@ -1,9 +1,9 @@
 .visited-nodes-bar {
     display: inline-block;
-    margin-right: 5px;
+    margin-right: 10px;
 }
 
 .shortest-nodes-bar {
     display: inline-block;
-    margin-right: 5px;
+    margin-right: 15px;
 }