diff --git a/src/blog-background/glow-dark.svg b/src/blog-background/glow-dark.svg new file mode 100644 index 0000000..f961f9b --- /dev/null +++ b/src/blog-background/glow-dark.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/blog-background/glow-light.svg b/src/blog-background/glow-light.svg new file mode 100644 index 0000000..7100e55 --- /dev/null +++ b/src/blog-background/glow-light.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/blog-background/index.module.scss b/src/blog-background/index.module.scss index 496694e..2222dd2 100644 --- a/src/blog-background/index.module.scss +++ b/src/blog-background/index.module.scss @@ -4,6 +4,7 @@ linear-gradient(180deg, rgba(15, 23, 42, 0.02), transparent 72%), linear-gradient(90deg, rgba(15, 23, 42, 0.025) 1px, transparent 1px), linear-gradient(rgba(15, 23, 42, 0.025) 1px, transparent 1px); + --rs-blog-glow-bg: url('./glow-light.svg'); } html.dark { @@ -11,6 +12,7 @@ linear-gradient(180deg, rgba(148, 163, 184, 0.04), transparent 72%), linear-gradient(90deg, rgba(148, 163, 184, 0.05) 1px, transparent 1px), linear-gradient(rgba(148, 163, 184, 0.05) 1px, transparent 1px); + --rs-blog-glow-bg: url('./glow-dark.svg'); } } @@ -28,3 +30,19 @@ background-size: 1200px; opacity: 0.15; } + +.glowBackground { + position: absolute; + inset: 0; + background: var(--rs-blog-glow-bg) no-repeat center 300px; + background-size: 1200px; + pointer-events: none; + z-index: -1; + opacity: 0.6; +} + +:global(html.dark) { + .glowBackground { + opacity: 0.2; + } +} diff --git a/src/blog-background/index.tsx b/src/blog-background/index.tsx index 0e915d6..cd62b74 100644 --- a/src/blog-background/index.tsx +++ b/src/blog-background/index.tsx @@ -18,6 +18,7 @@ export function BlogBackground({ return (
+
{` + .rp-doc > h1 { font-weight: 700; } + .rp-doc > p { color: var(--rs-blog-list-desc-color); } .rp-doc-layout__sidebar-placeholder { display: none; } .rp-doc-layout__outline { display: none; } .rp-doc-layout__doc { width: 100% !important; max-width: 100% !important; }