From 0709d64595f736f96c0a11668da971a97fc30345 Mon Sep 17 00:00:00 2001
From: "@andatoshiki" <hello@toshiki.dev>
Date: Wed, 13 Sep 2023 18:38:50 -0700
Subject: [PATCH] style(backgroud): add custom stylesheets and transperaent svg
 as tempalte to customize the overall background appearances to grid styled
 specifically in dark mode but currently commented due to transparent block
 background incomptability

---
 docs/.vitepress/theme/styles/custom.scss | 7 +++++++
 docs/public/grid.svg                     | 5 +++++
 2 files changed, 12 insertions(+)
 create mode 100644 docs/public/grid.svg

diff --git a/docs/.vitepress/theme/styles/custom.scss b/docs/.vitepress/theme/styles/custom.scss
index f1fa0f07..79a23749 100644
--- a/docs/.vitepress/theme/styles/custom.scss
+++ b/docs/.vitepress/theme/styles/custom.scss
@@ -378,3 +378,10 @@ html.dark {
 }
 
 // link preview markdown-it plugin dark mode style ends
+
+// vitepress dark mode grid styled notebook background texture style starts
+// .dark .VPContent {
+//     background-color: rgb(30, 30, 32);
+//     background-image: url("/grid.svg");
+// }
+// vitepress dark mode grid styled notebook background texture style ends
\ No newline at end of file
diff --git a/docs/public/grid.svg b/docs/public/grid.svg
new file mode 100644
index 00000000..d467ad6d
--- /dev/null
+++ b/docs/public/grid.svg
@@ -0,0 +1,5 @@
+
+<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
+  <path d="M96,95h4v1H96v4H95V96H86v4H85V96H76v4H75V96H66v4H65V96H56v4H55V96H46v4H45V96H36v4H35V96H26v4H25V96H16v4H15V96H0V95H15V86H0V85H15V76H0V75H15V66H0V65H15V56H0V55H15V46H0V45H15V36H0V35H15V26H0V25H15V16H0V15H15V0h1V15h9V0h1V15h9V0h1V15h9V0h1V15h9V0h1V15h9V0h1V15h9V0h1V15h9V0h1V15h9V0h1V15h4v1H96v9h4v1H96v9h4v1H96v9h4v1H96v9h4v1H96v9h4v1H96v9h4v1H96v9h4v1H96Zm-1,0V86H86v9ZM85,95V86H76v9ZM75,95V86H66v9ZM65,95V86H56v9ZM55,95V86H46v9ZM45,95V86H36v9ZM35,95V86H26v9ZM25,95V86H16v9ZM16,85h9V76H16Zm10,0h9V76H26Zm10,0h9V76H36Zm10,0h9V76H46Zm10,0h9V76H56Zm10,0h9V76H66Zm10,0h9V76H76Zm10,0h9V76H86Zm9-10V66H86v9ZM85,75V66H76v9ZM75,75V66H66v9ZM65,75V66H56v9ZM55,75V66H46v9ZM45,75V66H36v9ZM35,75V66H26v9ZM25,75V66H16v9ZM16,65h9V56H16Zm10,0h9V56H26Zm10,0h9V56H36Zm10,0h9V56H46Zm10,0h9V56H56Zm10,0h9V56H66Zm10,0h9V56H76Zm10,0h9V56H86Zm9-10V46H86v9ZM85,55V46H76v9ZM75,55V46H66v9ZM65,55V46H56v9ZM55,55V46H46v9ZM45,55V46H36v9ZM35,55V46H26v9ZM25,55V46H16v9ZM16,45h9V36H16Zm10,0h9V36H26Zm10,0h9V36H36Zm10,0h9V36H46Zm10,0h9V36H56Zm10,0h9V36H66Zm10,0h9V36H76Zm10,0h9V36H86Zm9-10V26H86v9ZM85,35V26H76v9ZM75,35V26H66v9ZM65,35V26H56v9ZM55,35V26H46v9ZM45,35V26H36v9ZM35,35V26H26v9ZM25,35V26H16v9ZM16,25h9V16H16Zm10,0h9V16H26Zm10,0h9V16H36Zm10,0h9V16H46Zm10,0h9V16H56Zm10,0h9V16H66Zm10,0h9V16H76Zm10,0h9V16H86Z" fill="rgba(255,255,255,0.2)" fill-rule="evenodd" opacity="0.2"/>
+  <path d="M6,5V0H5V5H0V6H5v94H6V6h94V5Z" fill="rgba(255,255,255,0.075)" fill-rule="evenodd"/>
+</svg>