impoved styling

blackmann · Feb 10, 2024 · 72a453b · 72a453b
1 parent 88b9c5d
commit 72a453b
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 6 deletions.
diff --git a/client/app/components/post-input.tsx b/client/app/components/post-input.tsx
@@ -156,7 +156,7 @@ function PostInput({ level = 0, parent }: Props) {
 					))}
 				</div>
 
-				<div className="flex justify-between">
+				<div className="flex justify-between flex-wrap gap-y-2">
 					<div className="flex gap-2">
 						<label className="flex items-center gap-2 rounded-lg px-2 py-1 font-medium bg-zinc-200 px-2 py-1 dark:bg-neutral-800 cursor-pointer w-[7.2rem]">
 							<div className="i-lucide-file-symlink opacity-50 shrink-0" />

diff --git a/client/app/lib/render-summary.server.ts b/client/app/lib/render-summary.server.ts
@@ -38,8 +38,7 @@ function removeLinks(): ReturnType<Plugin> {
 		visit(tree, "element", (child, index, parent) => {
 			if (child.tagName === "a") {
 				child.tagName = "span";
-				console.log(child.properties.className);
-				child.properties.className = "underline"
+				child.properties.className = "underline hyphens-auto";
 			}
 		});
 	};
@@ -83,7 +82,12 @@ function reduce(): ReturnType<Plugin> {
 						properties: { className: "tag" },
 						children: [{ type: "text", value: tagName }],
 					},
-					...child.children,
+					{
+						type: "element",
+						tagName: "div",
+						properties: {},
+						children: child.children,
+					},
 				];
 			}
 		});

diff --git a/client/app/style.css b/client/app/style.css
@@ -56,7 +56,7 @@ input {
 }
 
 .post-content .reduce-heading :nth-child(2) {
-  @apply flex-1;
+  @apply flex-1 w-0 hyphens-auto;
 }
 
 .article :is(p, pre, h1, h2, h3, h4, h5, h6, blockquote):not(:last-child) {
@@ -96,7 +96,7 @@ input {
 }
 
 .article a {
-  @apply text-blue-600 dark:text-blue-500 underline;
+  @apply text-blue-600 dark:text-blue-500 underline hyphens-auto;
 }
 
 .article:first-child {