Code polish

frontend/editable-ui/src/components/shared/card-list-viewer.jsx

@@ -10,7 +10,6 @@ import {
 } from 'reactstrap';
 import { Link } from 'react-router-dom';
 import ModalComponent from './modal-component';
-import MediaUpload from './media-upload.jsx'
 
 function CardListViewer(props) {
 

frontend/editable-ui/src/components/shared/category-bar.jsx

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import EditableDataService from '../../services/editable-data-service';
 import { Link } from 'react-router-dom';
-import { Container, Row, Col, Button, Spinner, ListGroup, ListGroupItem, ButtonGroup } from 'reactstrap';
+import { Container, Row, Col, Button, Spinner, ButtonGroup } from 'reactstrap';
 
 function CategoryBar(props) {
 

frontend/editable-ui/src/components/shared/publish.jsx

@@ -1,9 +1,10 @@
 import React, { useState, useEffect } from 'react';
-import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
+import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Spinner } from 'reactstrap';
 import EditableDataService from '../../services/editable-data-service';
 
 function Publish(props) {
     const [publishMethods, setPublishMethods] = useState(null)
+    const [publishSpinner, setPublishSpinner] = useState(false)
     
     useEffect(() => {
         fetchPublishMethods()
@@ -19,7 +20,6 @@ function Publish(props) {
                     "name": value["name"]
                 })
             ))
-            console.log(publishMethods)
             setPublishMethods(publishMethods)
         } catch (error) {
             props.notificationToggler('Error fetching methods', 'danger')
@@ -28,10 +28,13 @@ function Publish(props) {
     
     const publishData = async (deploy_method) => {
         try {
+            setPublishSpinner(true)
             const response = await EditableDataService.getData(`/data/publish/${deploy_method}/`);
             props.notificationToggler('Deployment Sucess')
+            setPublishSpinner(false)
         } catch (error) {
             props.notificationToggler('Deployment Failed', 'danger')
+            setPublishSpinner(false)
         }
     };
     
@@ -57,6 +60,11 @@ function Publish(props) {
                                 </div>
                             ):""
                     }
+                    { publishSpinner ?
+                        <h5>
+                            Publishing <Spinner />
+                        </h5> : ""
+                    }
                 </ModalBody>
                 <ModalFooter>
                     <Button color="secondary" onClick={props.toggle}>

frontend/viewable-ui/src/components/home.jsx

@@ -44,7 +44,7 @@ function HomePage(props) {
         </Row>
         <Row className={`mb-5 mt-2 ${ThemeConfig[GlobalTheme].textColor}`}>
           <Col xs="3" className="d-none d-md-block"></Col>
-          <Col className="blogContent">
+          <Col className="p-4 blogContent">
             <div className={`blogContent ${ThemeConfig[GlobalTheme].textColor}`}>{introContent}</div>
           </Col>
           <Col xs="3" className="d-none d-md-block"></Col>

frontend/viewable-ui/src/index.css

@@ -18,14 +18,7 @@ a {
   border-radius: 5px;
   padding-left: 5px;
   padding-right: 5px;
-  transition-duration: 0.1s;
-}
-
-.blogContent a:hover{
-  border-radius: 5px;
-  padding-left: 15px;
-  padding-right: 15px;
-  transition-duration: 0.1s;
+  transition: transform 0.3s ease-in-out;
 }
 
 .blogContent img {