@jant/core 0.4.4 → 0.5.0

package/src/styles/ui.css

@@ -2439,7 +2439,7 @@
   .link-preview {
     display: block;
     position: relative;
-    width: min(100%, calc(24rem * 16 / 9));
+    width: min(100%, calc(24rem * 16 / 9), var(--layout-content-width));
     max-width: 100%;
     margin-top: 0.55rem;
     border-radius: var(--radius-lg, 0.5rem);
@@ -5167,6 +5167,7 @@
     padding: 6px 10px;
     display: flex;
     align-items: center;
+    flex-shrink: 0;
     gap: 4px;
     background-color: var(--compose-paper-bg);
   }
@@ -6761,7 +6762,7 @@
   .compose-attachment-img {
     display: block;
     border-radius: var(--media-radius, 0.5rem);
-    max-height: min(320px, 28dvh);
+    max-height: min(160px, 18dvh);
     object-fit: contain;
   }
 
@@ -6798,7 +6799,7 @@
   /* Single image: constrain to container width */
   .compose-attachment:only-child .compose-attachment-img {
     max-width: 100%;
-    max-height: min(384px, 32dvh);
+    max-height: min(200px, 22dvh);
   }
 
   .compose-attachment:only-child .compose-attachment-preview-fallback {
@@ -7181,6 +7182,7 @@
     min-height: 0;
     display: flex;
     flex-direction: column;
+    align-self: stretch;
     overflow: hidden;
     position: relative;
   }
@@ -7191,6 +7193,10 @@
   }
 
   .compose-editor-row .compose-attachments-dock {
+    flex: 0 1 auto;
+    min-height: 0;
+    max-height: min(240px, 34dvh);
+    overflow-y: auto;
     padding-inline: 0;
     background: transparent;
   }
@@ -7234,7 +7240,7 @@
   }
 
   .compose-reply-context.expanded {
-    max-height: 400px;
+    max-height: min(400px, 35dvh);
     overflow-y: auto;
   }
 

package/src/ui/dash/settings/GitHubSyncContent.tsx

@@ -198,6 +198,31 @@ function GitHubSyncSetupForm({
               required
               autocomplete="off"
             />
+            <p class="text-sm text-muted-foreground mt-1">
+              {i18n._(
+                msg({
+                  message:
+                    "Create the repository on GitHub first — it can be empty.",
+                  comment:
+                    "@context: Help text for GitHub repository input on GitHub Sync settings, telling users they must create the repo themselves",
+                }),
+              )}{" "}
+              <a
+                href="https://github.com/new"
+                target="_blank"
+                rel="noopener noreferrer"
+                class="underline hover:no-underline"
+              >
+                {i18n._(
+                  msg({
+                    message: "Create a new repository",
+                    comment:
+                      "@context: Link text pointing to GitHub's new repository page",
+                  }),
+                )}
+              </a>
+              .
+            </p>
           </div>
 
           <div class="flex mt-2">

package/src/ui/feed/LinkCard.tsx

@@ -144,9 +144,24 @@ export const LinkCard: FC<TimelineCardProps> = ({
           {bodyEl}
         </>
       )}
-      {mediaEl}
-      {ratingEl}
-      <PostFooter post={post} detail={isDetail} display={display?.footer} />
+      {(() => {
+        const tail = (
+          <>
+            {mediaEl}
+            {ratingEl}
+            <PostFooter
+              post={post}
+              detail={isDetail}
+              display={display?.footer}
+            />
+          </>
+        );
+        return !isCompact && post.media.length > 1 ? (
+          <div class="post-attached-group">{tail}</div>
+        ) : (
+          tail
+        );
+      })()}
     </article>
   );
 };

package/src/ui/feed/NoteCard.tsx

@@ -91,27 +91,38 @@ export const NoteCard: FC<TimelineCardProps> = ({
           dangerouslySetInnerHTML={{ __html: displayHtml }}
         />
       )}
-      {!isCompact && post.media.length > 0 && (
-        <div class="mt-3" data-post-media>
-          <MediaGallery
-            attachments={post.media}
-            postPermalink={post.permalink}
-          />
-        </div>
-      )}
-      {!isDetail &&
-        !isCompact &&
-        !showFullBody &&
-        isArticle &&
-        post.summaryHasMore && (
-          <a href={getContinueHref(post)} class="feed-continue-link">
-            Continue →
-          </a>
-        )}
-      {!isCompact && !showHeaderRating && !display?.hideRating && (
-        <StarRating rating={post.rating} />
-      )}
-      <PostFooter post={post} detail={isDetail} display={footerDisplay} />
+      {(() => {
+        const tail = (
+          <>
+            {!isCompact && post.media.length > 0 && (
+              <div class="mt-3" data-post-media>
+                <MediaGallery
+                  attachments={post.media}
+                  postPermalink={post.permalink}
+                />
+              </div>
+            )}
+            {!isDetail &&
+              !isCompact &&
+              !showFullBody &&
+              isArticle &&
+              post.summaryHasMore && (
+                <a href={getContinueHref(post)} class="feed-continue-link">
+                  Continue →
+                </a>
+              )}
+            {!isCompact && !showHeaderRating && !display?.hideRating && (
+              <StarRating rating={post.rating} />
+            )}
+            <PostFooter post={post} detail={isDetail} display={footerDisplay} />
+          </>
+        );
+        return !isCompact && post.media.length > 1 ? (
+          <div class="post-attached-group">{tail}</div>
+        ) : (
+          tail
+        );
+      })()}
     </article>
   );
 };

package/src/ui/feed/QuoteCard.tsx

@@ -81,18 +81,33 @@ export const QuoteCard: FC<TimelineCardProps> = ({
           dangerouslySetInnerHTML={{ __html: commentaryHtml }}
         />
       )}
-      {!isCompact && post.media.length > 0 && (
-        <div class="mt-3" data-post-media>
-          <MediaGallery
-            attachments={post.media}
-            postPermalink={post.permalink}
-          />
-        </div>
-      )}
-      {!isCompact && !display?.hideRating && (
-        <StarRating rating={post.rating} />
-      )}
-      <PostFooter post={post} detail={isDetail} display={display?.footer} />
+      {(() => {
+        const tail = (
+          <>
+            {!isCompact && post.media.length > 0 && (
+              <div class="mt-3" data-post-media>
+                <MediaGallery
+                  attachments={post.media}
+                  postPermalink={post.permalink}
+                />
+              </div>
+            )}
+            {!isCompact && !display?.hideRating && (
+              <StarRating rating={post.rating} />
+            )}
+            <PostFooter
+              post={post}
+              detail={isDetail}
+              display={display?.footer}
+            />
+          </>
+        );
+        return !isCompact && post.media.length > 1 ? (
+          <div class="post-attached-group">{tail}</div>
+        ) : (
+          tail
+        );
+      })()}
     </article>
   );
 };