diff --git a/docs/my-website/src/theme/BlogPostPage/index.js b/docs/my-website/src/theme/BlogPostPage/index.js new file mode 100644 index 00000000000..ab8a8a173a8 --- /dev/null +++ b/docs/my-website/src/theme/BlogPostPage/index.js @@ -0,0 +1,40 @@ +import React, {useEffect} from 'react'; +import OriginalBlogPostPage from '@theme-original/BlogPostPage'; +import styles from './styles.module.css'; + +function HiringCTA() { + return ( +
+
+

We're hiring

+ + Like what you see? Join us + + +

Come build the future of AI infrastructure.

+
+
+ ); +} + +export default function BlogPostPage(props) { + // Add body class so CSS can hide the sidebar + useEffect(() => { + document.body.classList.add('blog-post-body'); + return () => document.body.classList.remove('blog-post-body'); + }, []); + + return ( + <> + + + + ); +} diff --git a/docs/my-website/src/theme/BlogPostPage/styles.module.css b/docs/my-website/src/theme/BlogPostPage/styles.module.css new file mode 100644 index 00000000000..b9a0a479eba --- /dev/null +++ b/docs/my-website/src/theme/BlogPostPage/styles.module.css @@ -0,0 +1,68 @@ +.ctaOuter { + max-width: 820px; + margin: 0 auto; + padding: 0 2rem 4rem; +} + +.cta { + border-radius: 16px; + background: #f9fafb; + border: 1px solid #e5e7eb; + padding: 2.5rem 2rem; + text-align: center; +} + +.ctaEyebrow { + font-size: 0.68rem; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.12em; + color: #9ca3af; + margin: 0 0 0.75rem; +} + +.ctaLink { + display: inline-flex; + align-items: center; + gap: 0.5rem; + font-size: 1.5rem; + font-weight: 600; + letter-spacing: -0.01em; + color: #111827; + text-decoration: none !important; + transition: color 0.15s; +} + +.ctaLink:hover { + color: #0ea5e9; +} + +.ctaArrow { + width: 1.25rem; + height: 1.25rem; + transition: transform 0.15s; + flex-shrink: 0; +} + +.ctaLink:hover .ctaArrow { + transform: translateX(3px); +} + +.ctaSub { + margin: 0.75rem 0 0; + font-size: 0.875rem; + color: #6b7280; +} + +[data-theme='dark'] .cta { + background: #1f2937; + border-color: #374151; +} + +[data-theme='dark'] .ctaLink { + color: #f9fafb; +} + +[data-theme='dark'] .ctaSub { + color: #9ca3af; +}