fix: Regular clipping of metadata on pinned documents #critfeedback

app/components/DocumentCard.tsx

@@ -2,7 +2,7 @@ import { useSortable } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
 import { m } from "framer-motion";
 import { observer } from "mobx-react";
-import { CloseIcon, DocumentIcon } from "outline-icons";
+import { CloseIcon, DocumentIcon, ClockIcon } from "outline-icons";
 import { getLuminance, transparentize } from "polished";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
@@ -10,11 +10,12 @@ import { Link } from "react-router-dom";
 import styled, { css } from "styled-components";
 import Document from "~/models/Document";
 import Pin from "~/models/Pin";
-import DocumentMeta from "~/components/DocumentMeta";
 import Flex from "~/components/Flex";
 import NudeButton from "~/components/NudeButton";
+import Time from "~/components/Time";
 import useStores from "~/hooks/useStores";
 import CollectionIcon from "./CollectionIcon";
+import Text from "./Text";
 import Tooltip from "./Tooltip";
 
 type Props = {
@@ -96,8 +97,10 @@ function DocumentCard(props: Props) {
             )}
             <div>
               <Heading dir={document.dir}>{document.titleWithDefault}</Heading>
-
-              <StyledDocumentMeta document={document} />
+              <DocumentMeta size="xsmall">
+                <ClockIcon color="currentColor" size={18} />{" "}
+                <Time dateTime={document.updatedAt} addSuffix shorten />
+              </DocumentMeta>
             </div>
           </Content>
         </DocumentLink>
@@ -183,8 +186,12 @@ const Content = styled(Flex)`
   z-index: 1;
 `;
 
-const StyledDocumentMeta = styled(DocumentMeta)`
-  color: ${(props) => transparentize(0.25, props.theme.white)} !important;
+const DocumentMeta = styled(Text)`
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  color: ${(props) => transparentize(0.25, props.theme.white)};
+  margin: 0;
 `;
 
 const DocumentLink = styled(Link)<{

package.json

@@ -122,7 +122,7 @@
     "mobx-react": "^6.3.1",
     "natural-sort": "^1.0.0",
     "nodemailer": "^6.6.1",
-    "outline-icons": "^1.39.0",
+    "outline-icons": "^1.41.0",
     "oy-vey": "^0.10.0",
     "passport": "^0.4.1",
     "passport-google-oauth2": "^0.2.0",

shared/i18n/locales/en_US/translation.json

@@ -567,6 +567,8 @@
   "Coming soon": "Coming soon",
   "Import documents from Notion": "Import documents from Notion",
   "Recent imports": "Recent imports",
+  "Everyone that has signed into Outline appears here. It’s possible that there are other users who have access through {team.signinMethods} but haven’t signed in yet.": "Everyone that has signed into Outline appears here. It’s possible that there are other users who have access through {team.signinMethods} but haven’t signed in yet.",
+  "Filter": "Filter",
   "Receive a notification whenever a new document is published": "Receive a notification whenever a new document is published",
   "Receive a notification when a document you created is edited": "Receive a notification when a document you created is edited",
   "Collection created": "Collection created",
@@ -580,8 +582,6 @@
   "Manage when and where you receive email notifications from Outline. Your email address can be updated in your SSO provider.": "Manage when and where you receive email notifications from Outline. Your email address can be updated in your SSO provider.",
   "Email address": "Email address",
   "The email integration is currently disabled. Please set the associated environment variables and restart the server to enable notifications.": "The email integration is currently disabled. Please set the associated environment variables and restart the server to enable notifications.",
-  "Everyone that has signed into Outline appears here. It’s possible that there are other users who have access through {team.signinMethods} but haven’t signed in yet.": "Everyone that has signed into Outline appears here. It’s possible that there are other users who have access through {team.signinMethods} but haven’t signed in yet.",
-  "Filter": "Filter",
   "Profile saved": "Profile saved",
   "Profile picture updated": "Profile picture updated",
   "Unable to upload new profile picture": "Unable to upload new profile picture",

yarn.lock

@@ -11082,10 +11082,10 @@ os-browserify@^0.3.0:
   resolved "https://registry.yarnpkg.com/os-browserify/-/os-browserify-0.3.0.tgz#854373c7f5c2315914fc9bfc6bd8238fdda1ec27"
   integrity sha1-hUNzx/XCMVkU/Jv8a9gjj92h7Cc=
 
-outline-icons@^1.39.0:
-  version "1.39.0"
-  resolved "https://registry.yarnpkg.com/outline-icons/-/outline-icons-1.39.0.tgz#d7b1ecf5d3d2803b4e0defa86300e397f7c4ac2e"
-  integrity sha512-5TpVKHhGYzqeLJvY+FEP+Atn7pEMPM3Rkv6iezb2yZkPoQx5Tbnla1jUdE2aCSzeFZws+mLm17hzANcoRW2sYQ==
+outline-icons@^1.41.0:
+  version "1.41.0"
+  resolved "https://registry.yarnpkg.com/outline-icons/-/outline-icons-1.41.0.tgz#6c31cf5b6ee307cf610e652c704f3dabf1fdae40"
+  integrity sha512-9H80wPZuoGCULVe8qNXV9VFnIvt16YTG3kkPB1LVlKpqv89w7CfgF/h1UfQgoFzVnzqLTp3gizpmX0L0cV4o0Q==
 
 oy-vey@^0.10.0:
   version "0.10.0"