[feat] css full support

src/lib/ChatScreens/ChatScreen.svelte

@@ -55,7 +55,7 @@
 {:else if $DataBase.theme === 'waifuMobile'}
     <div class="flex-grow h-full relative" style={bgImg.length < 4 ? wallPaper : bgImg}>
         <BackgroundDom />
-        <div class="w-full absolute z-10 bottom-0 left-0" class:pre33={$selectedCharID >= 0}>
+        <div class="w-full absolute z-10 bottom-0 left-0" class:per33={$selectedCharID >= 0}>
             <DefaultChatScreen customStyle={`${externalStyles}backdrop-filter: blur(4px);`} bind:openChatList/>
         </div>
         {#if $selectedCharID >= 0}

src/lib/UI/MainMenu.svelte

@@ -66,7 +66,6 @@
           <button class="mr-2 text-gray-400 hover:text-green-500" on:click={() => (openHub = false)}>
             <ArrowLeft/>
           </button>
-          <h1 class="text-3xl font-bold">{language.hub} <Help key="experimental" /> </h1>
         </div>
         <Hub />
       {/if}

src/ts/characterCards.ts

@@ -636,7 +636,8 @@ export async function shareRisuHub(char:character, arg:{
             body: JSON.stringify({
                 card: card,
                 img: Buffer.from(img).toString('base64'),
-                resources: resources
+                resources: resources,
+                token: get(DataBase)?.account?.token
             })
         })
 

src/ts/parser.ts

@@ -4,6 +4,7 @@ import { DataBase, type character, type groupChat } from './storage/database';
 import { getFileSrc } from './storage/globalApi';
 import { processScript } from './process/scripts';
 import { get } from 'svelte/store';
+import css from '@adobe/css-tools'
 
 const convertor = new showdown.Converter({
     simpleLineBreaks: true,
@@ -27,6 +28,28 @@ DOMPurify.addHook("uponSanitizeElement", (node: HTMLElement, data) => {
           return node.parentNode.removeChild(node);
        }
     }
+    if(data.tagName === 'style'){
+        try {
+            const ast = css.parse(node.innerHTML)
+            const rules = ast?.stylesheet?.rules
+            if(rules){
+                for(const rule of rules){
+                    if(rule.selectors){
+                        for(let i=0;i<rule.selectors.length;i++){
+                            rule.selectors[i] = ".chattext " + rule.selectors[i]
+                        }
+                    }
+                }
+            }
+            node.innerHTML = css.stringify(ast)
+       
+        } catch (error) {
+            const ErrorNode = document.createElement("div")
+            ErrorNode.innerText = `CSS ERROR: ${error}`
+            node.parentNode.appendChild(ErrorNode)
+            return node.parentNode.removeChild(node);
+        }
+    }
 });
 
 DOMPurify.addHook("uponSanitizeAttribute", (node, data) => {