fix(style): remove deprecated customlayout vue template entry for redesgining original component styles & full migrate to custom component slot preseved & lint and remove overrided error styling from twoslash & roll overall site color pallete back to match deafult styles provided by vitepress as temporary color schemes until new overrides are being written

docs/.vitepress/theme/index.ts

@@ -59,7 +59,7 @@ export default {
     ...DefaultTheme,
     Layout: () => {
         // custom layout migrated to custom slots
-        CustomLayout
+        // CustomLayout
 
         const props: Record<string, any> = {}
         // get frontmatter data via vitepress builtin

docs/.vitepress/theme/styles/component/twoslash.scss

@@ -1,18 +1,18 @@
 /* Dark/light theme */
-:root:not(.dark) {
+// :root:not(.dark) {
-    --vp-code-block-bg: rgba(125, 125, 125, 0.04);
+//     --vp-code-block-bg: rgba(125, 125, 125, 0.04);
-    --vp-code-copy-code-active-text: var(--vp-c-text-2);
+//     --vp-code-copy-code-active-text: var(--vp-c-text-2);
-    --vp-code-copy-code-hover-bg: rgba(125, 125, 125, 0.1);
+//     --vp-code-copy-code-hover-bg: rgba(125, 125, 125, 0.1);
-    --vp-code-tab-divider: var(--vp-c-mute-dark);
+//     --vp-code-tab-divider: var(--vp-c-mute-dark);
-    --vp-code-tab-hover-text-color: var(--vp-c-text-1);
+//     --vp-code-tab-hover-text-color: var(--vp-c-text-1);
-    /* fix contrast: lang name on gray code block */
+//     /* fix contrast: lang name on gray code block */
-    --vp-c-text-dark-3: rgba(180, 180, 180, 0.7);
+//     --vp-c-text-dark-3: rgba(180, 180, 180, 0.7);
-}
+// }
-:root.dark {
+// :root.dark {
-    --vp-code-block-bg: rgba(0, 0, 0, 0.2);
+//     --vp-code-block-bg: rgba(0, 0, 0, 0.2);
-    /* fix lang name: check the same above (this is the default) */
+//     /* fix lang name: check the same above (this is the default) */
-    --vp-c-text-dark-3: rgba(235, 235, 235, 0.38);
+//     --vp-c-text-dark-3: rgba(235, 235, 235, 0.38);
-}
+// }
 
 /* Hide block based on theme */
 html:not(.dark) pre.shiki[class*='dark'] {

docs/.vitepress/theme/styles/index.scss

@@ -1,2 +1,5 @@
 @import './custom.scss';
 @import './vars.scss';
+
+// vitepress site color palete tweak option with more flavorful color profiles
+@import './tweak.scss';

docs/.vitepress/theme/styles/tweak.scss

@@ -0,0 +1,69 @@
+:root {
+    --vp-c-default-1: var(--vp-c-gray-1);
+    --vp-c-default-2: var(--vp-c-gray-2);
+    --vp-c-default-3: var(--vp-c-gray-3);
+    --vp-c-default-soft: var(--vp-c-gray-soft);
+
+    --vp-c-brand-1: var(--vp-c-indigo-1);
+    --vp-c-brand-2: var(--vp-c-indigo-2);
+    --vp-c-brand-3: var(--vp-c-indigo-3);
+    --vp-c-brand-soft: var(--vp-c-indigo-soft);
+
+    --vp-c-tip-1: var(--vp-c-brand-1);
+    --vp-c-tip-2: var(--vp-c-brand-2);
+    --vp-c-tip-3: var(--vp-c-brand-3);
+    --vp-c-tip-soft: var(--vp-c-brand-soft);
+
+    --vp-c-warning-1: var(--vp-c-yellow-1);
+    --vp-c-warning-2: var(--vp-c-yellow-2);
+    --vp-c-warning-3: var(--vp-c-yellow-3);
+    --vp-c-warning-soft: var(--vp-c-yellow-soft);
+
+    --vp-c-danger-1: var(--vp-c-red-1);
+    --vp-c-danger-2: var(--vp-c-red-2);
+    --vp-c-danger-3: var(--vp-c-red-3);
+    --vp-c-danger-soft: var(--vp-c-red-soft);
+}
+
+:root {
+    --vp-button-brand-border: transparent;
+    --vp-button-brand-text: var(--vp-c-white);
+    --vp-button-brand-bg: var(--vp-c-brand-3);
+    --vp-button-brand-hover-border: transparent;
+    --vp-button-brand-hover-text: var(--vp-c-white);
+    --vp-button-brand-hover-bg: var(--vp-c-brand-2);
+    --vp-button-brand-active-border: transparent;
+    --vp-button-brand-active-text: var(--vp-c-white);
+    --vp-button-brand-active-bg: var(--vp-c-brand-1);
+}
+
+:root {
+    --vp-home-hero-name-color: transparent;
+    --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #bd34fe 30%, #41d1ff);
+
+    --vp-home-hero-image-background-image: linear-gradient(-45deg, #bd34fe 50%, #47caff 50%);
+    --vp-home-hero-image-filter: blur(40px);
+}
+
+@media (min-width: 640px) {
+    :root {
+        --vp-home-hero-image-filter: blur(56px);
+    }
+}
+
+@media (min-width: 960px) {
+    :root {
+        --vp-home-hero-image-filter: blur(72px);
+    }
+}
+
+:root {
+    --vp-custom-block-tip-border: transparent;
+    --vp-custom-block-tip-text: var(--vp-c-text-1);
+    --vp-custom-block-tip-bg: var(--vp-c-brand-soft);
+    --vp-custom-block-tip-code-bg: var(--vp-c-brand-soft);
+}
+
+.DocSearch {
+    --docsearch-primary-color: var(--vp-c-brand-1) !important;
+}