From 88009c171507e4ec0e6a371ae9017c93f0eace27 Mon Sep 17 00:00:00 2001 From: Guillermo Alejandro Gallardo Diez Date: Wed, 4 Mar 2026 15:11:25 +0100 Subject: [PATCH] feat: added office-hours page --- website/docusaurus.config.js | 6 ++ .../src/components/UI/Card/Card.module.scss | 8 +-- website/src/pages/office-hours.jsx | 60 ++++++++++++++++++ website/src/pages/office-hours.module.scss | 63 +++++++++++++++++++ 4 files changed, 133 insertions(+), 4 deletions(-) create mode 100644 website/src/pages/office-hours.jsx create mode 100644 website/src/pages/office-hours.module.scss diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 3115c9b1476..4034e5a3f51 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -252,6 +252,12 @@ const config = { description: 'Join our WeChat community', icon: '/assets/menu/wechat.svg', }, + { + label: 'Office Hours', + to: '/office-hours', + description: 'Book a session with our developer advocates', + icon: '/assets/menu/event.png', + } ], }, { diff --git a/website/src/components/UI/Card/Card.module.scss b/website/src/components/UI/Card/Card.module.scss index c2f884c6ec6..5b1672cfd3b 100644 --- a/website/src/components/UI/Card/Card.module.scss +++ b/website/src/components/UI/Card/Card.module.scss @@ -1,5 +1,5 @@ .card { - padding: var(--space-3) var(--space-1) var(--space-1); + padding: var(--space-1); border-radius: var(--radius-card); border: var(--border-card); background: var(--color-bg-surface); @@ -233,8 +233,8 @@ // Title element &__title { margin: var(--space-1) 0 var(--space-3) 0; - font-size: var(--text-xl); - font-weight: var(--font-weight-semibold); + font-size: var(--text-md); + font-weight: var(--font-weight-bold); line-height: var(--leading-tight); } @@ -243,7 +243,7 @@ flex-grow: 1; margin: 0; line-height: var(--leading-relaxed); - font-size: var(--text-base); + font-size: var(--text-md); } // Content element diff --git a/website/src/pages/office-hours.jsx b/website/src/pages/office-hours.jsx new file mode 100644 index 00000000000..d52ece9f8f3 --- /dev/null +++ b/website/src/pages/office-hours.jsx @@ -0,0 +1,60 @@ +import Layout from '@theme/Layout' +import Card from '@site/src/components/UI/Card' + + +// Are you a developer building on NEAR? Do you have questions about the NEAR protocol, tools, or best practices? Join our weekly office hours to connect with technical experts and get your questions answered. +// Building a Shade Agent? Using chain signatures? Book a session with Owen: https://calendly.com/owen-proximity/office-hours +// Building a Smart Contract? A general question about the NEAR protocol? Book a session with Guille: https://calendar.app.google/6q2ssGUmvFcMoJk97 + + +export default function OfficeHours() { + + return <> + +
+
+
+

Office Hours

+

Are you a developer building on NEAR? Do you have questions about the NEAR protocol, tools, or best practices? Join our weekly office hours to connect with technical experts and get your questions answered.

+
+

What are you Building?

+
+
+ + Book Support + +
+
+ + Book Support + +
+
+ + Book Support + +
+
+
+
+ + Book Support + +
+
+ + Book Support + +
+
+ + Book Support + +
+
+
+
+
+ + +} \ No newline at end of file diff --git a/website/src/pages/office-hours.module.scss b/website/src/pages/office-hours.module.scss new file mode 100644 index 00000000000..d88c23ebd53 --- /dev/null +++ b/website/src/pages/office-hours.module.scss @@ -0,0 +1,63 @@ +.page { + padding: var(--space-8) 0; +} + +.container { + max-width: 1200px; + margin: 0 auto; + padding: 0 var(--space-6); +} + +.header { + max-width: 860px; + margin-bottom: var(--space-8); +} + +.title { + margin: 0 0 var(--space-4) 0; + font-size: var(--text-4xl); + line-height: var(--leading-tight); + color: var(--color-text-primary); +} + +.paragraph { + margin: 0 0 var(--space-4) 0; + font-size: var(--text-lg); + line-height: var(--leading-relaxed); + color: var(--color-text-secondary); + + &:last-child { + margin-bottom: 0; + } +} + +.columns { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: var(--space-6); +} + +.card { + display: flex; + flex-direction: column; + gap: var(--space-4); +} + +.cardTitle { + margin: 0; + font-size: var(--text-xl); + line-height: var(--leading-snug); + color: var(--color-text-primary); +} + +.cardText { + margin: 0; + color: var(--color-text-secondary); + line-height: var(--leading-relaxed); +} + +@media (max-width: 996px) { + .columns { + grid-template-columns: 1fr; + } +} \ No newline at end of file