break word on a and code tags in mdx, fix horizontal scroll in chrome

nemanjam · nemanjam · commit 818c59509ca6 · 2025-04-02T13:18:33.000+02:00
diff --git a/package.json b/package.json
@@ -25,6 +25,8 @@
     "docker:build:push:arm": "docker buildx build -f ./docker/Dockerfile -t nemanjamitic/nemanjam.github.io --build-arg ARG_SITE_URL_ARM64='https://nmc-docker.arm1.nemanjamitic.com' --build-arg ARG_PLAUSIBLE_SCRIPT_URL='https://plausible.arm1.nemanjamitic.com/js/script.js' --build-arg ARG_PLAUSIBLE_DOMAIN='nemanjamitic.com' --platform linux/arm64 --progress=plain --push .",
     "docker:build:push:x86": "docker buildx build -f ./docker/Dockerfile -t nemanjamitic/nemanjam.github.io --build-arg ARG_SITE_URL_AMD64='https://nmc-docker.local.nemanjamitic.com' --build-arg ARG_PLAUSIBLE_SCRIPT_URL='https://plausible.arm1.nemanjamitic.com/js/script.js' --build-arg ARG_PLAUSIBLE_DOMAIN='nemanjamitic.com' --platform linux/amd64 --push --progress=plain .",
     "docker:push": "docker push nemanjamitic/nemanjam.github.io",
+    "pi": "yarn build:nginx:pi && yarn deploy:nginx:pi",
+    "nginx": "yarn build:nginx && yarn deploy:nginx",
     "dc:up": "docker compose up --build --force-recreate -d"
   },
   "dependencies": {
diff --git a/src/content/post/2025/04-02-astro-react-gallery/index.mdx b/src/content/post/2025/04-02-astro-react-gallery/index.mdx
@@ -8,9 +8,9 @@ heroAlt: Finished gallery, desktop view.
 tags:
   - astro
   - react
-category: tutorial
+category: tutorials
 toc: true
-draft: true
+draft: false
 ---
 
 import { Image } from 'astro:assets';
diff --git a/src/styles/base/my-prose.css b/src/styles/base/my-prose.css
@@ -14,7 +14,12 @@
     @apply prose-h1:font-bold;
 
     /* a */
-    @apply prose-a:link;
+    @apply prose-a:link prose-a:break-words;
+
+    /* break-words in <a /> and <code /> prevents overflow and horizontal scroll on <body /> in mdx */
+
+    /* code */
+    @apply prose-code:break-words;
 
     /* image */
     @apply prose-img:rounded-button;
