more

src/Components/Document/ReqEditPage.js

@@ -434,11 +434,37 @@ const RequestEditPage = () => {
             ))}
           </div>
           <div
-            className="docedit-report-container"
+            className="reqedit-report-container"
             onClick={() => handleConfirmReport()}
           >
             <div className="docedit-report-link">Report an issue</div>
           </div>
+          <div className="req-editing-button-container">
+            <div className="generate-button-box">
+              {/*  TODO: add tooltip: "This will save the document and create a .docx file that will (be downloaded?  saved somewhere?" */}
+              <Button
+                className="primary-button create-gen-button"
+                onClick={createAndReturnDocx}
+                labelText={"Create .docx File"}
+              />
+            </div>
+            <div className="details-button-box">
+              <div>
+                <Button
+                  className="pt-2 pb-2 mr-4 secondary-button edit-back-button"
+                  onClick={handleBack}
+                  labelText="Back To Documents Page"
+                />
+              </div>
+              <div>
+                <Button
+                  className="pt-2 pb-2 mr-2 primary-button"
+                  onClick={handleConfirmSave}
+                  labelText="Save Changes"
+                />
+              </div>
+            </div>
+          </div>
         </div>
       </>
     );

src/styles/docedit-page.scss

@@ -79,6 +79,14 @@
   margin-top: 0.6rem;
 }
 
+.req-editing-button-container {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  margin-top: 0.6rem;
+}
+
 .edit-back-button {
   height: 50px;
   width: 215px;
@@ -413,6 +421,10 @@
   margin-top: 50px;
 }
 
+.reqedit-report-container {
+  width: 90%;
+  margin-top: -20px;
+}
 .docedit-report-link {
   font-size: 0.95rem;
   color: #fa6400;