diff --git a/client/src/components/header/header.component.jsx b/client/src/components/header/header.component.jsx
index a16ae9a58..b62c022c5 100644
--- a/client/src/components/header/header.component.jsx
+++ b/client/src/components/header/header.component.jsx
@@ -70,7 +70,7 @@ function Header({
     <div style={{ display: "flex", alignItems: "center" }}>
       <Menu
         mode="horizontal"
-        // theme="dark"
+        theme="dark"
         style={{ flex: 5 }}
         selectedKeys={[selectedHeader]}
         onClick={handleMenuClick}
@@ -301,8 +301,7 @@ function Header({
       <GlobalSearch />
       <Menu
         mode="horizontal"
-        // theme="dark"
-
+        theme="dark"
         selectedKeys={[selectedHeader]}
         onClick={handleMenuClick}
       >
diff --git a/client/src/components/job-checklist/components/job-checklist-template-item/job-checklist-template-item.component.jsx b/client/src/components/job-checklist/components/job-checklist-template-item/job-checklist-template-item.component.jsx
deleted file mode 100644
index bf6d9470a..000000000
--- a/client/src/components/job-checklist/components/job-checklist-template-item/job-checklist-template-item.component.jsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from "react";
-import { PrinterFilled } from "@ant-design/icons";
-import { useTranslation } from "react-i18next";
-
-export default function JobChecklistTemplateItem({
-  templateKey,
-  renderTemplate,
-}) {
-  const { t } = useTranslation();
-  return (
-    <div>
-      {t(`printcenter.jobs.${templateKey}`)}
-      <PrinterFilled onClick={() => renderTemplate(templateKey)} />
-    </div>
-  );
-}
diff --git a/client/src/components/job-checklist/components/job-checklist-template-list/job-checklist-template-list.component.jsx b/client/src/components/job-checklist/components/job-checklist-template-list/job-checklist-template-list.component.jsx
index 382a2781d..2d0cb3064 100644
--- a/client/src/components/job-checklist/components/job-checklist-template-list/job-checklist-template-list.component.jsx
+++ b/client/src/components/job-checklist/components/job-checklist-template-list/job-checklist-template-list.component.jsx
@@ -1,18 +1,26 @@
-import { Button } from "antd";
-import React from "react";
+import { PrinterFilled } from "@ant-design/icons";
+import { Button, List } from "antd";
+import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useParams } from "react-router-dom";
 import { logImEXEvent } from "../../../../firebase/firebase.utils";
-import { GenerateDocument } from "../../../../utils/RenderTemplate";
-import JobIntakeTemplateItem from "../job-checklist-template-item/job-checklist-template-item.component";
+import {
+  GenerateDocument,
+  GenerateDocuments,
+} from "../../../../utils/RenderTemplate";
+import { TemplateList } from "../../../../utils/TemplateConstants";
+const TemplateListGenerated = TemplateList();
 
 export default function JobIntakeTemplateList({ templates }) {
   const { jobId } = useParams();
   const { t } = useTranslation();
+  const [loading, setLoading] = useState(false);
+
   const renderTemplate = async (templateKey) => {
+    setLoading(true);
     logImEXEvent("job_checklist_template_render");
 
-    GenerateDocument(
+    await GenerateDocument(
       {
         name: templateKey,
         variables: { id: jobId },
@@ -20,27 +28,50 @@ export default function JobIntakeTemplateList({ templates }) {
       {},
       "p"
     );
+    setLoading(false);
   };
 
-  const renderAllTemplates = () => {
-    logImEXEvent("job_checklist_render_all_templates");
-
-    templates.forEach((template) => renderTemplate(template));
+  const renderAllTemplates = async () => {
+    logImEXEvent("checklist_render_all_templates");
+    setLoading(true);
+    console.log("templates :>> ", templates);
+    await GenerateDocuments(
+      templates.map((key) => {
+        return { name: key, variables: { id: jobId } };
+      })
+    );
+    setLoading(false);
   };
 
   return (
     <div>
-      {t("intake.labels.printpack")}
-      <Button onClick={renderAllTemplates}>
+      <Button onClick={renderAllTemplates} loading={loading}>
         {t("checklist.actions.printall")}
       </Button>
-      {templates.map((template) => (
-        <JobIntakeTemplateItem
-          key={template}
-          templateKey={template}
-          renderTemplate={renderTemplate}
-        />
-      ))}
+      <List
+        itemLayout="horizontal"
+        dataSource={templates}
+        renderItem={(template) => (
+          <List.Item
+            actions={[
+              <Button
+                loading={loading}
+                onClick={() => renderTemplate(template)}
+              >
+                <PrinterFilled />
+              </Button>,
+            ]}
+          >
+            <List.Item.Meta
+              title={
+                TemplateListGenerated[template] &&
+                TemplateListGenerated[template].title
+              }
+              // description={renderTemplateList(template.templates)}
+            />
+          </List.Item>
+        )}
+      />
     </div>
   );
 }
diff --git a/client/src/components/job-checklist/job-checklist.component.jsx b/client/src/components/job-checklist/job-checklist.component.jsx
index 40845b3b4..0d4f48ff7 100644
--- a/client/src/components/job-checklist/job-checklist.component.jsx
+++ b/client/src/components/job-checklist/job-checklist.component.jsx
@@ -6,11 +6,11 @@ export default function JobIntakeComponent({ checklistConfig, type, job }) {
   const { form, templates } = checklistConfig;
 
   return (
-    <Row>
-      <Col span={12}>
+    <Row gutter={[48, 48]}>
+      <Col span={6}>
         <JobChecklistTemplateList templates={templates} type={type} />
       </Col>
-      <Col span={12}>
+      <Col span={18}>
         <JobChecklistForm formItems={form} type={type} job={job} />
       </Col>
     </Row>
diff --git a/client/src/components/jobs-detail-rates-change-button/jobs-detail-rates-change-button.component.jsx b/client/src/components/jobs-detail-rates-change-button/jobs-detail-rates-change-button.component.jsx
index 49845e439..d0332480c 100644
--- a/client/src/components/jobs-detail-rates-change-button/jobs-detail-rates-change-button.component.jsx
+++ b/client/src/components/jobs-detail-rates-change-button/jobs-detail-rates-change-button.component.jsx
@@ -1,10 +1,10 @@
+import { DownOutlined } from "@ant-design/icons";
+import { Dropdown, Menu } from "antd";
 import React from "react";
+import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import { DownOutlined } from "@ant-design/icons";
-import { Dropdown, Menu } from "antd";
-import { useTranslation } from "react-i18next";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -19,14 +19,20 @@ export function JobsDetailRatesChangeButton({ disabled, form, bodyshop }) {
     form.setFieldsValue(rate);
   };
 
+  console.log(
+    "🚀  ~ file: jobs-detail-rates-change-button.component.jsx  ~ line 26  ~ bodyshop.md_labor_rates",
+    bodyshop.md_labor_rates
+  );
   const menu = (
-    <Menu onClick={handleClick}>
-      {bodyshop.md_labor_rates.map((rate, idx) => (
-        <Menu.Item value={rate} key={idx}>
-          {rate.label}
-        </Menu.Item>
-      ))}
-    </Menu>
+    <div>
+      <Menu onClick={handleClick}>
+        {bodyshop.md_labor_rates.map((rate, idx) => (
+          <Menu.Item value={rate} key={idx}>
+            {rate.rate_label}
+          </Menu.Item>
+        ))}
+      </Menu>
+    </div>
   );
 
   return (
diff --git a/client/src/components/shop-info/shop-info.intake.component.jsx b/client/src/components/shop-info/shop-info.intake.component.jsx
index 189c5735e..0c6151185 100644
--- a/client/src/components/shop-info/shop-info.intake.component.jsx
+++ b/client/src/components/shop-info/shop-info.intake.component.jsx
@@ -95,34 +95,53 @@ export default function ShopInfoIntakeChecklistComponent({ form }) {
                     >
                       <Switch />
                     </Form.Item>
-                    <Form.Item
-                      className="imex-flex-row__margin"
-                      label={t("jobs.fields.intake.min")}
-                      key={`${index}min`}
-                      name={[field.name, "min"]}
-                      rules={[
-                        {
-                          required: true,
-                          message: t("general.validation.required"),
-                        },
-                      ]}
-                    >
-                      <InputNumber />
-                    </Form.Item>
-                    <Form.Item
-                      className="imex-flex-row__margin"
-                      label={t("jobs.fields.intake.max")}
-                      key={`${index}max`}
-                      name={[field.name, "max"]}
-                      rules={[
-                        {
-                          required: true,
-                          message: t("general.validation.required"),
-                        },
-                      ]}
-                    >
-                      <InputNumber />
+                    <Form.Item shouldUpdate>
+                      {() => {
+                        if (
+                          form.getFieldValue([
+                            "intakechecklist",
+                            "form",
+                            index,
+                            "type",
+                          ]) !== "slider"
+                        )
+                          return null;
+                        return (
+                          <>
+                            <Form.Item
+                              className="imex-flex-row__margin"
+                              label={t("jobs.fields.intake.min")}
+                              key={`${index}min`}
+                              name={[field.name, "min"]}
+                              dependencies={[[field.name, "type"]]}
+                              rules={[
+                                {
+                                  required: true,
+                                  message: t("general.validation.required"),
+                                },
+                              ]}
+                            >
+                              <InputNumber />
+                            </Form.Item>
+                            <Form.Item
+                              className="imex-flex-row__margin"
+                              label={t("jobs.fields.intake.max")}
+                              key={`${index}max`}
+                              name={[field.name, "max"]}
+                              rules={[
+                                {
+                                  required: true,
+                                  message: t("general.validation.required"),
+                                },
+                              ]}
+                            >
+                              <InputNumber />
+                            </Form.Item>
+                          </>
+                        );
+                      }}
                     </Form.Item>
+
                     <DeleteFilled
                       onClick={() => {
                         remove(field.name);
@@ -246,33 +265,57 @@ export default function ShopInfoIntakeChecklistComponent({ form }) {
                     >
                       <Switch />
                     </Form.Item>
-                    <Form.Item
-                      className="imex-flex-row__margin"
-                      label={t("jobs.fields.intake.min")}
-                      key={`${index}mind`}
-                      name={[field.name, "min"]}
-                      rules={[
-                        {
-                          required: true,
-                          message: t("general.validation.required"),
-                        },
-                      ]}
-                    >
-                      <InputNumber />
-                    </Form.Item>
-                    <Form.Item
-                      className="imex-flex-row__margin"
-                      label={t("jobs.fields.intake.max")}
-                      key={`${index}maxd`}
-                      name={[field.name, "max"]}
-                      rules={[
-                        {
-                          required: true,
-                          message: t("general.validation.required"),
-                        },
-                      ]}
-                    >
-                      <InputNumber />
+
+                    <Form.Item shouldUpdate>
+                      {() => {
+                        if (
+                          form.getFieldValue([
+                            "deliverchecklist",
+                            "form",
+                            index,
+                            "type",
+                          ]) !== "slider"
+                        )
+                          return null;
+                        return (
+                          <>
+                            <Form.Item
+                              className="imex-flex-row__margin"
+                              label={t("jobs.fields.intake.min")}
+                              key={`${index}mind`}
+                              name={[field.name, "min"]}
+                              dependencies={[[field.name, "type"]]}
+                              rules={[
+                                {
+                                  required:
+                                    form.getFieldValue([field.name, "type"]) ===
+                                    "slider",
+                                  message: t("general.validation.required"),
+                                },
+                              ]}
+                            >
+                              <InputNumber />
+                            </Form.Item>
+                            <Form.Item
+                              className="imex-flex-row__margin"
+                              label={t("jobs.fields.intake.max")}
+                              key={`${index}maxd`}
+                              name={[field.name, "max"]}
+                              dependencies={[[field.name, "type"]]}
+                              rules={[
+                                {
+                                  required:
+                                    form.getFieldValue([field.name, "type"]) ===
+                                    "slider",
+                                  message: t("general.validation.required"),
+                                },
+                              ]}
+                            >
+                              <InputNumber />
+                            </Form.Item>
+                          </>
+                        );
+                      }}
                     </Form.Item>
                     <DeleteFilled
                       onClick={() => {
diff --git a/client/src/pages/manage/manage.page.component.jsx b/client/src/pages/manage/manage.page.component.jsx
index 1ae5145df..8ee35d749 100644
--- a/client/src/pages/manage/manage.page.component.jsx
+++ b/client/src/pages/manage/manage.page.component.jsx
@@ -177,7 +177,7 @@ export function Manage({ match, conflict }) {
 
   return (
     <Layout className="layout-container">
-      <Header style={{ backgroundColor: "#fff" }}>
+      <Header>
         <HeaderContainer />
       </Header>
       <Content className="content-container">
diff --git a/client/src/pages/manage/manage.page.styles.scss b/client/src/pages/manage/manage.page.styles.scss
index b1c4118d8..3584339fe 100644
--- a/client/src/pages/manage/manage.page.styles.scss
+++ b/client/src/pages/manage/manage.page.styles.scss
@@ -1,7 +1,7 @@
 .content-container {
   overflow-y: auto;
-  // margin: 0.5rem 0.5rem 0rem 0.5rem;
-  padding: 0.25rem 1rem 0rem 1rem;
+  margin: 1rem 1rem 0rem 1rem;
+  padding: 0.25rem 2.5rem 1rem 2.5rem;
   border-radius: 4px;
   background: #fff;
   padding-bottom: 3rem;
diff --git a/hasura/migrations/1614210624328_alter_table_public_employees_drop_column_cost_center/down.yaml b/hasura/migrations/1614210624328_alter_table_public_employees_drop_column_cost_center/down.yaml
new file mode 100644
index 000000000..a31bf8b01
--- /dev/null
+++ b/hasura/migrations/1614210624328_alter_table_public_employees_drop_column_cost_center/down.yaml
@@ -0,0 +1,10 @@
+- args:
+    cascade: false
+    read_only: false
+    sql: ALTER TABLE "public"."employees" ADD COLUMN "cost_center" text;
+  type: run_sql
+- args:
+    cascade: false
+    read_only: false
+    sql: ALTER TABLE "public"."employees" ALTER COLUMN "cost_center" DROP NOT NULL;
+  type: run_sql
diff --git a/hasura/migrations/1614210624328_alter_table_public_employees_drop_column_cost_center/up.yaml b/hasura/migrations/1614210624328_alter_table_public_employees_drop_column_cost_center/up.yaml
new file mode 100644
index 000000000..f130d21e1
--- /dev/null
+++ b/hasura/migrations/1614210624328_alter_table_public_employees_drop_column_cost_center/up.yaml
@@ -0,0 +1,5 @@
+- args:
+    cascade: false
+    read_only: false
+    sql: ALTER TABLE "public"."employees" DROP COLUMN "cost_center" CASCADE;
+  type: run_sql