Merge pull request #156 from kjannette/what

more

src/pageElements/Cards.js

@@ -278,10 +278,18 @@ export const DocCard = (props) => {
   const createdAtTime = createdAt?.seconds
     ? createdAt?.seconds
     : new Date().getTime();
+
   const now = new Date().getTime();
   const uploadedAt = new Date(createdAtTime * 1000);
   const isReportable = Math.round((now - uploadedAt) / 60 / 1000) > 15;
 
+  function convertDate(dateVar) {
+    const date = new Date(parseInt(dateVar?.seconds) * 1000);
+    const date2 = date.toLocaleString("en-US", { month: "long" });
+    const temp = String(date).split(" ");
+    return `${date2} ${temp[2]}, ${temp[3]}`;
+  }
+
   const disabled = docType ? false : true;
   const tooltipText =
     "Parsing is taking a bit longer than usual. This usually resolves within 15 minutes. If it does not, click “report” and support will address the issue within 24 hours.";
@@ -293,8 +301,8 @@ export const DocCard = (props) => {
 
   const documentTitle =
     docType === "interrogatories-out"
-      ? "Outbound requests"
-      : "Discovery responses";
+      ? "Outbound request"
+      : "Discovery response";
 
   const isOutbound = docType === "interrogatories-out";
   const buttonText =
@@ -315,14 +323,16 @@ export const DocCard = (props) => {
             <></>
           )}
         </div>
-        {dateServed ? (
-          <div className="doc-col3">Served: {dateServed}</div>
-        ) : (
-          <></>
-        )}
         <div className="doc-col4">
           <div className="jurisdiction-box">{parentCaseName}</div>
         </div>
+        {createdAt ? (
+          <div className="doc-col2 responsive-none">
+            Created: {convertDate(createdAt)}
+          </div>
+        ) : (
+          <></>
+        )}
         {disabled && isReportable ? (
           <div className="doc-col5">
             <Button
@@ -374,4 +384,4 @@ export const DocCard = (props) => {
             <></>
           )}
 
-          */
+*/

src/styles/cards.scss

@@ -173,7 +173,7 @@
   width: 200px;
   height: 100%;
   padding-top: 1px;
-  margin-right: 20px;
+  margin-right: 15px;
 }
 
 .doc-col3 {
@@ -182,17 +182,17 @@
   min-width: 190px;
   height: 100%;
   padding-top: 1px;
-  margin-right: 20px;
+  margin-right: 15px;
 }
 
 .doc-col4 {
   display: flex;
   flex: 1;
   align-items: center;
-  min-width: 280px;
+  min-width: 220px;
   height: 100%;
   padding-top: 1px;
-  margin-right: 20px;
+  margin-right: 15px;
 }
 
 .doc-col5 {
@@ -202,7 +202,7 @@
   width: 120px;
   height: 100%;
   padding-right: 10px;
-  margin-right: 20px;
+  margin-right: 15px;
 }
 
 .doc-col6 {
@@ -320,3 +320,9 @@
 .gen-button {
   width: 158px !important;
 }
+
+@media only screen and (max-width: 1080px) {
+  .responsive-none {
+    display: none;
+  }
+}