Removed @tailwindcss/typography package

Update markdown render card (removed tailwind typography)
7 changed files with 66 additions and 114 deletions
--- a/components/card/MarkdownRenderer.client.vue
+++ b/components/card/MarkdownRenderer.client.vue
@ -1,22 +0,0 @@
-<script setup lang="ts">
-	interface Props {
-		content: string
-		state: string
-	}
-
-	const props = defineProps<Props>()
-
-	const description = useDescription()
-	const parsedMarkdown = computed(() => {
-		return stringToMarkdown(description.value)
-	})
-</script>
-
-<template>
-	<div class="bg-secondary h-full min-h-screen w-full overflow-y-scroll p-4">
-		<div
-			class="prose prose-invert h-full max-h-full"
-			v-html="parsedMarkdown">
-		</div>
-	</div>
-</template>
--- a/components/card/MarkdownRenderer.vue
+++ b/components/card/MarkdownRenderer.vue
@ -0,0 +1,60 @@
+<script setup lang="ts">
+const note = useNote()
+const parsedMarkdown = computed(() => {
+    return stringToMarkdown(note.value.description)
+})
+</script>
+
+<template>
+    <div class="bg-secondary flex h-full min-h-screen w-full flex-col items-center overflow-y-scroll p-4">
+        <div class="h-full max-h-full w-full" v-html="parsedMarkdown">
+        </div>
+    </div>
+</template>
+
+<style scoped>
+:deep(*) {
+    @apply text-[#E6EDF3];
+}
+
+:deep(h1),
+:deep(h2),
+:deep(h3),
+:deep(h4),
+:deep(h5),
+:deep(h6) {
+    @apply border-lightgray border-b pb-2;
+}
+
+:deep(h1) {
+    @apply text-4xl;
+}
+
+:deep(h2) {
+    @apply text-2xl;
+}
+
+:deep(h3) {
+    @apply text-lg;
+}
+
+:deep(h4) {
+    @apply text-base;
+}
+
+:deep(h5) {
+    @apply text-sm;
+}
+
+:deep(h6) {
+    @apply text-xs;
+}
+
+:deep(li input) {
+    @apply my-0;
+}
+
+:deep(pre) {
+    @apply bg-lightgray;
+}
+</style>
--- a/composables/markdown.ts
+++ b/composables/markdown.ts
@ -2,11 +2,11 @@ import { micromark } from 'micromark'
 import { gfm, gfmHtml } from 'micromark-extension-gfm'

 const stringToMarkdown = (string: string) => {
-	const parsedMarkdown = micromark(string, {
-		extensions: [gfm()],
-		htmlExtensions: [gfmHtml()],
-	})
-	return parsedMarkdown
+    const parsedMarkdown = micromark(string, {
+        extensions: [gfm()],
+        htmlExtensions: [gfmHtml()],
+    })
+    return parsedMarkdown
 }

 export { stringToMarkdown }
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@ -29,23 +29,7 @@ export default defineNuxtConfig({
                        lightgray: '#27272a',
                    },
                },
-                // uncomment when syntax highlight
-                // is enable for markdown (highlight.js)
-                // typography: {
-                // 	default: {
-                // 		css: {
-                // 			'pre': null,
-                // 			'code': null,
-                // 			'code::before': null,
-                // 			'code::after': null,
-                // 			'pre code': null,
-                // 			'pre code::before': null,
-                // 			'pre code::after': null,
-                // 		},
-                // 	},
-                // },
            },
-            plugins: [require('@tailwindcss/typography')],
        },
    },
    typescript: {
--- a/package-lock.json
+++ b/package-lock.json
@ -15,7 +15,6 @@
 				"@nuxt/devtools": "^0.1.4",
 				"@nuxtjs/supabase": "^0.3.0",
 				"@nuxtjs/tailwindcss": "^6.2.0",
-				"@tailwindcss/typography": "^0.5.9",
 				"@vueuse/core": "^9.12.0",
 				"@vueuse/nuxt": "^9.12.0",
 				"nuxt": "^3.2.0",
@ -2133,34 +2132,6 @@
 				"cross-fetch": "^3.1.5"
 			}
 		},
-		"node_modules/@tailwindcss/typography": {
-			"version": "0.5.9",
-			"resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.9.tgz",
-			"integrity": "sha512-t8Sg3DyynFysV9f4JDOVISGsjazNb48AeIYQwcL+Bsq5uf4RYL75C1giZ43KISjeDGBaTN3Kxh7Xj/vRSMJUUg==",
-			"dev": true,
-			"dependencies": {
-				"lodash.castarray": "^4.4.0",
-				"lodash.isplainobject": "^4.0.6",
-				"lodash.merge": "^4.6.2",
-				"postcss-selector-parser": "6.0.10"
-			},
-			"peerDependencies": {
-				"tailwindcss": ">=3.0.0 || insiders"
-			}
-		},
-		"node_modules/@tailwindcss/typography/node_modules/postcss-selector-parser": {
-			"version": "6.0.10",
-			"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz",
-			"integrity": "sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==",
-			"dev": true,
-			"dependencies": {
-				"cssesc": "^3.0.0",
-				"util-deprecate": "^1.0.2"
-			},
-			"engines": {
-				"node": ">=4"
-			}
-		},
 		"node_modules/@tootallnate/once": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz",
@ -6815,12 +6786,6 @@
 			"integrity": "sha512-xYHt68QRoYGjeeM/XOE1uJtvXQAgvszfBhjV4yvsQH0u2i9I6cI6c6/eG4Hh3UAOVn0y/xAXwmTzEay49Q//HA==",
 			"dev": true
 		},
-		"node_modules/lodash.castarray": {
-			"version": "4.4.0",
-			"resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
-			"integrity": "sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==",
-			"dev": true
-		},
 		"node_modules/lodash.debounce": {
 			"version": "4.0.8",
 			"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@ -6863,12 +6828,6 @@
 			"integrity": "sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==",
 			"dev": true
 		},
-		"node_modules/lodash.merge": {
-			"version": "4.6.2",
-			"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-			"integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
-			"dev": true
-		},
 		"node_modules/lodash.pick": {
 			"version": "4.4.0",
 			"resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
--- a/package.json
+++ b/package.json
@ -11,7 +11,6 @@
 		"@nuxt/devtools": "^0.1.4",
 		"@nuxtjs/supabase": "^0.3.0",
 		"@nuxtjs/tailwindcss": "^6.2.0",
-		"@tailwindcss/typography": "^0.5.9",
 		"@vueuse/core": "^9.12.0",
 		"@vueuse/nuxt": "^9.12.0",
 		"nuxt": "^3.2.0",
--- a/yarn.lock
+++ b/yarn.lock
@ -893,16 +893,6 @@
    "@supabase/storage-js" "^2.1.0"
    cross-fetch "^3.1.5"

-"@tailwindcss/typography@^0.5.9":
-  version "0.5.9"
-  resolved "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.9.tgz"
-  integrity sha512-t8Sg3DyynFysV9f4JDOVISGsjazNb48AeIYQwcL+Bsq5uf4RYL75C1giZ43KISjeDGBaTN3Kxh7Xj/vRSMJUUg==
-  dependencies:
-    lodash.castarray "^4.4.0"
-    lodash.isplainobject "^4.0.6"
-    lodash.merge "^4.6.2"
-    postcss-selector-parser "6.0.10"
-
 "@tootallnate/once@2":
  version "2.0.0"
  resolved "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz"
@ -3813,11 +3803,6 @@ lodash._reinterpolate@^3.0.0:
  resolved "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz"
  integrity sha512-xYHt68QRoYGjeeM/XOE1uJtvXQAgvszfBhjV4yvsQH0u2i9I6cI6c6/eG4Hh3UAOVn0y/xAXwmTzEay49Q//HA==

-lodash.castarray@^4.4.0:
-  version "4.4.0"
-  resolved "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz"
-  integrity sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==
-
 lodash.debounce@^4.0.8:
  version "4.0.8"
  resolved "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz"
@ -3853,11 +3838,6 @@ lodash.memoize@^4.1.2:
  resolved "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz"
  integrity sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==

-lodash.merge@^4.6.2:
-  version "4.6.2"
-  resolved "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz"
-  integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
-
 lodash.pick@^4.4.0:
  version "4.4.0"
  resolved "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz"
@ -5491,14 +5471,6 @@ postcss-selector-parser@^6.0.10, postcss-selector-parser@^6.0.11, postcss-select
    cssesc "^3.0.0"
    util-deprecate "^1.0.2"

-postcss-selector-parser@6.0.10:
-  version "6.0.10"
-  resolved "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz"
-  integrity sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==
-  dependencies:
-    cssesc "^3.0.0"
-    util-deprecate "^1.0.2"
-
 postcss-svgo@^5.1.0:
  version "5.1.0"
  resolved "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-5.1.0.tgz"
@ -6265,7 +6237,7 @@ tailwind-config-viewer@^1.7.2:
    portfinder "^1.0.26"
    replace-in-file "^6.1.0"

-tailwindcss@^3.2.7, "tailwindcss@>=3.0.0 || insiders", "tailwindcss@1 || 2 || 2.0.1-compat || 3":
+tailwindcss@^3.2.7, "tailwindcss@1 || 2 || 2.0.1-compat || 3":
  version "3.2.7"
  resolved "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.2.7.tgz"
  integrity sha512-B6DLqJzc21x7wntlH/GsZwEXTBttVSl1FtCzC8WP4oBc/NKef7kaax5jeihkkCEWc831/5NDJ9gRNDK6NEioQQ==
Author	SHA1	Message	Date
TZGyn	43fc4c50bb	Removed @tailwindcss/typography package	2 years ago
TZGyn	96155b53bc	Update markdown render card (removed tailwind typography)	2 years ago