This commit is contained in:
MuslemRahimi 2024-06-14 20:54:21 +02:00
parent d8f2e61a9c
commit 7f55db6ea1
2 changed files with 52 additions and 48 deletions

View File

@ -21,52 +21,56 @@ export const config = {
} }
function addClassesToHtml(htmlString) { function addClassesToHtml(htmlString) {
// Helper function to add a class to a specific tag // Helper function to add a class to a specific tag
function addClassToTag(tag, className) { function addClassToTag(tag, className) {
// Add class if the tag doesn't already have a class attribute // Add class if the tag doesn't already have a class attribute
const regex = new RegExp(`<${tag}(?![^>]*\\bclass=)([^>]*)>`, 'g'); const regex = new RegExp(`<${tag}(?![^>]*\\bclass=)([^>]*)>`, 'g');
htmlString = htmlString.replace(regex, `<${tag} class="${className}"$1>`); htmlString = htmlString.replace(regex, `<${tag} class="${className}"$1>`);
// Append the new class to tags that already have a class attribute, ensuring no duplicates // Append the new class to tags that already have a class attribute, ensuring no duplicates
const regexWithClass = new RegExp(`(<${tag}[^>]*\\bclass=["'][^"']*)(?!.*\\b${className}\\b)([^"']*)["']`, 'g'); const regexWithClass = new RegExp(`(<${tag}[^>]*\\bclass=["'][^"']*)(?!.*\\b${className}\\b)([^"']*)["']`, 'g');
htmlString = removeDuplicateClasses(htmlString.replace(regexWithClass, `$1 ${className}$2"`)); htmlString = htmlString.replace(regexWithClass, `$1 ${className}$2"`);
} }
// Add classes to headings
addClassToTag('h1', 'text-2xl');
addClassToTag('h2', 'text-xl');
addClassToTag('h3', 'text-xl');
addClassToTag('h4', 'text-md');
addClassToTag('h5', 'text-sm');
addClassToTag('h6', 'text-xs');
// Add classes to anchor tags // Add classes to headings
addClassToTag('a', 'text-blue-400 hover:text-white underline'); addClassToTag('h1', 'text-lg');
addClassToTag('h2', 'text-lg');
addClassToTag('h3', 'text-lg');
addClassToTag('h4', 'text-lg');
addClassToTag('h5', 'text-lg');
addClassToTag('h6', 'text-lg');
// Add classes to ordered lists // Add classes to anchor tags
addClassToTag('ol', 'list-decimal ml-5 text-sm'); addClassToTag('a', 'text-blue-400 hover:text-white underline');
// Add classes to unordered lists // Add classes to ordered lists
addClassToTag('ul', 'list-disc ml-5 text-sm -mt-5'); addClassToTag('ol', 'list-decimal ml-10 text-sm');
// Add classes to blockquotes and their paragraphs // Add classes to unordered lists
function addClassToBlockquote() { addClassToTag('ul', 'list-disc ml-10 text-sm -mt-5');
// Add class to blockquote
htmlString = htmlString.replace(
'<blockquote',
'<blockquote class="p-4 my-4 border-s-4 border-gray-400 bg-[#313131]"'
);
// Add class to p inside blockquote // Add classes to blockquotes and their paragraphs
htmlString = htmlString.replace( function addClassToBlockquote() {
/<blockquote([^>]*)>\s*<p/g, // Add class to blockquote
`<blockquote$1>\n<p class="text-sm italic font-medium leading-relaxed text-white"` htmlString = htmlString.replace(
); /<blockquote/g,
} '<blockquote class="pl-4 pr-4 rounded-lg bg-[#323232]"'
);
addClassToBlockquote(); // Add class to p inside blockquote
htmlString = htmlString.replace(
/<blockquote([^>]*)>\s*<p/g,
`<blockquote$1>\n<p class="text-sm font-medium leading-relaxed text-white"`
);
}
return htmlString; addClassToBlockquote();
}
// Remove duplicate classes after all modifications
htmlString = removeDuplicateClasses(htmlString);
return htmlString;
}
export const load = async ({ locals}) => { export const load = async ({ locals}) => {

View File

@ -4,7 +4,7 @@
import InfiniteLoading from '$lib/components/InfiniteLoading.svelte'; import InfiniteLoading from '$lib/components/InfiniteLoading.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import {userRegion, screenWidth, numberOfUnreadNotification, scrollToComment } from '$lib/store'; import {userRegion, numberOfUnreadNotification, scrollToComment } from '$lib/store';
export let data; export let data;
export let form; export let form;
@ -120,7 +120,7 @@ onMount(async () => {
<div class="w-full max-w-3xl m-auto min-h-screen bg-[#202020] sm:rounded-lg border border-gray-700 overflow-hidden sm:overflow-y-scroll scroller sm:max-h-[1100px] pt-5 sm:pb-10 sm:pt-10 sm:mt-3 mb-8"> <div class="w-full max-w-3xl m-auto min-h-screen bg-[#202020] sm:rounded-lg sm:border sm:border-gray-700 overflow-hidden sm:overflow-y-scroll scroller sm:max-h-[1100px] pt-5 sm:pb-10 sm:pt-10 sm:mt-3 sm:mb-8">
<h1 class="pl-5 text-2xl text-white font-semibold mt-2 sm:mt-0"> <h1 class="pl-5 text-2xl text-white font-semibold mt-2 sm:mt-0">
Notifications Notifications