UI Fixes on Job list page. Refactored form row component. BOD-155

client/src/App/App.js

@@ -1,3 +1,4 @@
+import "antd/dist/antd.css";
 import React, { lazy, Suspense, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -9,8 +10,8 @@ import LoadingSpinner from "../components/loading-spinner/loading-spinner.compon
 import { checkUserSession } from "../redux/user/user.actions";
 import { selectCurrentUser } from "../redux/user/user.selectors";
 import PrivateRoute from "../utils/private-route";
-import "antd/dist/antd.css";
 import "./App.styles.scss";
+import { Grid } from "antd";
 
 const LandingPage = lazy(() => import("../pages/landing/landing.page"));
 const ManagePage = lazy(() => import("../pages/manage/manage.page.container"));
@@ -32,6 +33,9 @@ export function App({ checkUserSession, currentUser }) {
     checkUserSession();
   }, [checkUserSession]);
 
+  const b = Grid.useBreakpoint();
+  console.log("Breakpoints:", b);
+  
   const { t } = useTranslation();
 
   if (currentUser.authorized === null) {

client/src/App/App.styles.scss

@@ -4,6 +4,7 @@
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
+
   &__search {
     flex: 1;
   }
@@ -21,4 +22,7 @@
   &__margin {
     margin: 0.2rem 0.2rem;
   }
+  &__margin-large {
+    margin: 0.5rem 0.5rem;
+  }
 }