svrjs/svrjs-nextjs-website
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

final touches for prismjs code highlighter

Browse source
This commit is contained in:
Cypro Freelance 2024-08-26 21:51:44 +05:30
parent d5b1df3250
commit 9ccc3d8bc4
2 changed files with 9 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/(root)/blog/[slug]/page.tsx
View file

@ -108,7 +108,7 @@ const customPortableTextComponents: PortableTextComponents = {
if (!grammar) { if (!grammar) {
console.error(`No grammar found for language: "${language}"`); console.error(`No grammar found for language: "${language}"`);
return ( return (
<pre className="p-4 rounded-md overflow-x-auto text-sm md:text-base"> <pre className="p-4 rounded-md overflow-x-auto text-sm">
<code>{value.code}</code> <code>{value.code}</code>
</pre> </pre>
); );
@ -117,7 +117,7 @@ const customPortableTextComponents: PortableTextComponents = {
return ( return (
<div className="relative my-8"> <div className="relative my-8">
<pre <pre
className={`language-${language} p-4 rounded-md overflow-x-auto text-sm md:text-base`} className={`language-${language} p-4 rounded-md overflow-x-auto text-sm`}
> >
<code className={`language-${language}`}>{value.code}</code> <code className={`language-${language}`}>{value.code}</code>
</pre> </pre>

7
components/loader/prismLoader.tsx
View file

@ -5,7 +5,14 @@ import "prismjs/themes/prism-okaidia.css";
import "prismjs/components/prism-javascript"; import "prismjs/components/prism-javascript";
import "prismjs/components/prism-python"; import "prismjs/components/prism-python";
import "prismjs/components/prism-php"; import "prismjs/components/prism-php";
// Import the languages and their dependencies
import "prismjs/components/prism-javascript";
import "prismjs/components/prism-python";
import "prismjs/components/prism-php";
// Import additional dependencies for Handlebars if needed
import "prismjs/components/prism-markup";
import "prismjs/components/prism-markup-templating"; import "prismjs/components/prism-markup-templating";
import "prismjs/components/prism-handlebars";
export default function PrismLoader() { export default function PrismLoader() {
useEffect(() => { useEffect(() => {