diff --git a/docusaurus.config.js b/docusaurus.config.js index 4036d36..e70c270 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -12,7 +12,7 @@ import tailwindPlugin from './plugins/tailwind-config.cjs' const config = { title: 'Syncosaurus', tagline: - "A performant, collaborative, real-time Javascript framework that enables developers to focus on their application's features and business logic, instead of the complexities of state synchronization and conflict resolution.", + 'An open-source framework for real-time, collaborative web applications', favicon: 'img/favicon.ico', // Set the production url of your site here @@ -66,15 +66,18 @@ const config = { title: 'Syncosaurus', logo: { alt: 'Syncosaurus Logo', - src: 'img/logo.svg', + src: 'img/icons/logo_transparent.png', }, items: [ { to: '/case-study', label: 'Case Study', position: 'right' }, { to: '/team', label: 'The Team', position: 'right' }, { type: 'doc', label: 'Docs', docId: 'index', position: 'right' }, { - to: 'https://github.com/syncosaurus', - label: 'Github', + type: 'html', + value: ` + + Github + `, position: 'right', }, ], @@ -102,14 +105,20 @@ const config = { label: 'Docs', to: '/docs', }, + ], + }, + { + title: 'More', + items: [ { - label: 'GitHub', - to: 'https://github.com/syncosaurus', + html: ` + + Github + `, }, ], }, - ], - copyright: `Copyright © ${new Date().getFullYear()} Syncosaurus`, + ] }, prism: { theme: prismThemes.github, diff --git a/src/components/HomepageFeatures/index.js b/src/components/HomepageFeatures/index.js index 0fcf762..12b5916 100644 --- a/src/components/HomepageFeatures/index.js +++ b/src/components/HomepageFeatures/index.js @@ -8,24 +8,38 @@ export default function HomepageFeatures() { return ( <> -
-
-
-
-
- image -
+
+

Key Features

+
+ + + +
+
+
+
+
-
-
-
-

- A synchronization engine based on server reconciliation +
+
+
+

+ Robust and Flexible Collaboration Engine

+

+ Fast and reliable user updates are at the heart of + real-time, collaborative web applications. But what + happens when multiple clients make conflicting changes + simultaneously?



+ Synocusaurus provides the backbone for + both performant state synchronization and flexible + conflict resolution logic using client-side prediction and + server reconcilliation, techniques developed originally + for multi-player video games. +

@@ -34,26 +48,27 @@ export default function HomepageFeatures() {

-
-
-
-
-
-
-

- A convenient CLI tool to seamlessly create, configure, manage, and deploy your collaborative application -

-
-
+
+
+
+
+

+ Easy Development and Deployment +

+

+ Seamlessly create, iterate, deploy, and manage your Syncosaurus + applications with our convenient CLI tool. +

-
- -
- image +
+
+
+ image +
@@ -61,24 +76,28 @@ export default function HomepageFeatures() {
-
-
-
-
-
+
+
+
+
+
image
-
-
-
-

- An analytics dashboard to monitor your collaborative application's usage and error metrics +
+
+
+

+ Built-in Analytics

+

+ Monitor your collaborative application's usage metrics, in aggregate or on a + per-room basis, with our beautiful dashboard application. +

diff --git a/src/components/HomepageFeatures/styles.module.css b/src/components/HomepageFeatures/styles.module.css index b248eb2..fa4fe51 100644 --- a/src/components/HomepageFeatures/styles.module.css +++ b/src/components/HomepageFeatures/styles.module.css @@ -1,7 +1,8 @@ .features { display: flex; align-items: center; - padding: 2rem 0; + vertical-align: middle; + padding: 2rem 2rem; width: 100%; } diff --git a/src/css/custom.css b/src/css/custom.css index c996558..c57015d 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -8,6 +8,18 @@ @tailwind components; @tailwind utilities; +@layer components { + .filter-syncoGreen { + @apply invert-[.68] sepia-[.92] saturate-[3.21] hue-rotate-[48deg] brightness-[.93] contrast-[.9]; + } +} + +@layer components { + .filter-syncoBlue { + @apply invert-[.2] sepia-[.11] saturate-[60.63] hue-rotate-[197deg] brightness-[.89] contrast-[.98]; + } +} + /* You can override the default Infima variables here. */ :root { --ifm-color-primary: #243d83; @@ -38,20 +50,99 @@ align-self: center; } +* { + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.footer { + display: flex; + align-self: center; + align-items: center; + width: 99.5%; + opacity: 92%; + outline: none; + max-height: 180px; + margin-top: auto; + bottom: 0; + background-color: #f9f9f9; + opacity: 92%; + border-top-right-radius: 1.5rem; /* 24px */ + border-top-left-radius: 1.5rem; /* 24px */ + box-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05); +} + +.footer__items a { + color: #1d3370; + align-content: center; +} + +.footer__items a:hover { + color: #7ed348; + text-decoration: none; +} + +.footer__title { + padding-top:0.75rem; + color: #1d3370; + font-size: 1.08rem; + align-self: center; +} + +/* .footer__copyright { + color: #1d3370; + font-size: 0.9rem; + padding-bottom: 0.5rem; +} */ + .navbar { + display: flex; + align-items: center; width: 99.5%; + height: 50px; align-self: center; - background-color: white; - opacity: 90%; + background-color: #f9f9f9; + margin-bottom: 0.25rem; + opacity: 92%; outline: none; border-bottom-right-radius: 1.5rem; /* 24px */ border-bottom-left-radius: 1.5rem; /* 24px */ box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); - font-weight: bold; + z-index: 500; +} + +.navbar__inner { + display: flex; + width: 100%; +} + +.navbar__items a { + color: #1d3370; + font-weight: 450; + font-size: 1.1rem; } -.navbar__items { - font-weight: bold; +.navbar__items a:hover { + color: #7ed348; + text-decoration: none; +} + +.navbar__title { + font-size: 1.25rem; + font-weight: 900; + color: #1d3370; +} + +.navbar__title:hover { + color: #7ed348; + text-decoration: none; +} + +.navbar__logo img { + width: 48px; /* Set the desired width */ + height: 48px; /* Set the desired height */ + margin-top: -15%; + align-self: center; } .col--2 { diff --git a/src/pages/index.js b/src/pages/index.js index c424e83..acb07b0 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -1,21 +1,24 @@ -import clsx from 'clsx' import Link from '@docusaurus/Link' import useDocusaurusContext from '@docusaurus/useDocusaurusContext' import Layout from '@theme/Layout' import HomepageFeatures from '@site/src/components/HomepageFeatures' import Puzzle from '@site/src/components/Puzzle' -import { useState, useEffect } from 'react' +import { useState, useEffect, useRef } from 'react' -import Heading from '@theme/Heading' -import styles from './index.module.css' - -function HomepageHeader() { - const [scrollDownArrowDisplay, setScrollDownArrowDisplay] = useState('block') +export default function Home() { + const featureRef = useRef(null) + const [scrollDownArrowOpacity, setScrollDownArrowOpacity] = useState(0.9) const setScroll = () => { const displayValue = - window.scrollY / document.body.scrollHeight < 0.05 ? 'block' : 'none' - setScrollDownArrowDisplay(displayValue) + window.scrollY / document.body.scrollHeight < 0.05 ? 1 : 0; + setScrollDownArrowOpacity(displayValue) + } + + const handleScrollClick = () => { + if (featureRef.current) { + featureRef.current.scrollIntoView({ behavior: 'smooth'}); + } } useEffect(() => { @@ -28,41 +31,38 @@ function HomepageHeader() { const { siteConfig } = useDocusaurusContext() return ( - // rounded-2xl bg-indigo-50 py-10 overflow-hidden m-5 lg:m-0 2xl:py-16 xl:py-8 lg:rounded-tl-2xl lg:rounded-bl-2xl -
+ +
-

{siteConfig.title}

+

{siteConfig.title}

{siteConfig.tagline}

Read Case Study
-
+
- ) -} - -export default function Home() { - return ( - - -
+
diff --git a/src/pages/team.js b/src/pages/team.js index 3cba723..917ee7f 100644 --- a/src/pages/team.js +++ b/src/pages/team.js @@ -4,236 +4,141 @@ import Layout from '@theme/Layout' export default function Team() { return ( -
-
-

- The Team -

-

-
-
- Bonnie Avatar -

- Bonnie Green -

-

CEO/Co-founder

- +
+

The Team

+
+
+
+

+
+
+ Alex Sklar +

+ Alex Sklar +

+

+ Portland, OR +

+
+ + + + + + + + + + + +
-
- Helene Avatar -

- Helene Engels -

-

CTO/Co-founder

- +
+
+ Erik Margetis +

+ Erik Margetis +

+

+ San Francisco, CA +

+
+ + + + + + + + + + + +
- -
- Joseph Avatar -

- Joseph Mcfall -

-

Sales

- +
+
+ Joseph Liang +

+ Joseph Liang +

+

+ Oakland, CA +

+
+ + + + + + + + + + + +
-
+
) } diff --git a/static/img/dashboard_screenshot.png b/static/img/dashboard_screenshot.png deleted file mode 100644 index 6db1cc7..0000000 Binary files a/static/img/dashboard_screenshot.png and /dev/null differ diff --git a/static/img/docusaurus-social-card.jpg b/static/img/docusaurus-social-card.jpg deleted file mode 100644 index ffcb448..0000000 Binary files a/static/img/docusaurus-social-card.jpg and /dev/null differ diff --git a/static/img/docusaurus.png b/static/img/docusaurus.png deleted file mode 100644 index f458149..0000000 Binary files a/static/img/docusaurus.png and /dev/null differ diff --git a/static/img/icons/email.svg b/static/img/icons/email.svg new file mode 100644 index 0000000..8fda0dd --- /dev/null +++ b/static/img/icons/email.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/img/icons/github.svg b/static/img/icons/github.svg new file mode 100644 index 0000000..174c958 --- /dev/null +++ b/static/img/icons/github.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/img/icons/linkedin.svg b/static/img/icons/linkedin.svg new file mode 100644 index 0000000..665e6f2 --- /dev/null +++ b/static/img/icons/linkedin.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/img/logo.svg b/static/img/icons/logo.svg similarity index 100% rename from static/img/logo.svg rename to static/img/icons/logo.svg diff --git a/static/img/logo_transparent.png b/static/img/icons/logo_transparent.png similarity index 100% rename from static/img/logo_transparent.png rename to static/img/icons/logo_transparent.png diff --git a/static/img/outlink.svg b/static/img/icons/outlink.svg similarity index 100% rename from static/img/outlink.svg rename to static/img/icons/outlink.svg diff --git a/static/img/scroll-down-arrow.png b/static/img/icons/scroll-down-arrow.png similarity index 100% rename from static/img/scroll-down-arrow.png rename to static/img/icons/scroll-down-arrow.png diff --git a/static/img/icons/website.svg b/static/img/icons/website.svg new file mode 100644 index 0000000..84b8abd --- /dev/null +++ b/static/img/icons/website.svg @@ -0,0 +1 @@ + diff --git a/static/img/screenshots/dashboard_screenshot.png b/static/img/screenshots/dashboard_screenshot.png new file mode 100644 index 0000000..7304847 Binary files /dev/null and b/static/img/screenshots/dashboard_screenshot.png differ diff --git a/static/img/screenshots/syncosaurus-deploy.png b/static/img/screenshots/syncosaurus-deploy.png new file mode 100644 index 0000000..2a7565e Binary files /dev/null and b/static/img/screenshots/syncosaurus-deploy.png differ diff --git a/static/img/syncosaurus-deploy.gif b/static/img/syncosaurus-deploy.gif deleted file mode 100644 index 7bd9d84..0000000 Binary files a/static/img/syncosaurus-deploy.gif and /dev/null differ diff --git a/static/img/team/alex.jpeg b/static/img/team/alex.jpeg new file mode 100644 index 0000000..c3ae783 Binary files /dev/null and b/static/img/team/alex.jpeg differ diff --git a/static/img/team/erik.jpeg b/static/img/team/erik.jpeg new file mode 100644 index 0000000..fa6cb79 Binary files /dev/null and b/static/img/team/erik.jpeg differ diff --git a/static/img/team/joseph.jpeg b/static/img/team/joseph.jpeg new file mode 100644 index 0000000..887d3b9 Binary files /dev/null and b/static/img/team/joseph.jpeg differ diff --git a/static/img/undraw_docusaurus_mountain.svg b/static/img/undraw_docusaurus_mountain.svg deleted file mode 100644 index af961c4..0000000 --- a/static/img/undraw_docusaurus_mountain.svg +++ /dev/null @@ -1,171 +0,0 @@ - - Easy to Use - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/static/img/undraw_docusaurus_react.svg b/static/img/undraw_docusaurus_react.svg deleted file mode 100644 index 94b5cf0..0000000 --- a/static/img/undraw_docusaurus_react.svg +++ /dev/null @@ -1,170 +0,0 @@ - - Powered by React - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/static/img/undraw_docusaurus_tree.svg b/static/img/undraw_docusaurus_tree.svg deleted file mode 100644 index d9161d3..0000000 --- a/static/img/undraw_docusaurus_tree.svg +++ /dev/null @@ -1,40 +0,0 @@ - - Focus on What Matters - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/tailwind.config.js b/tailwind.config.js index ac14698..aeedebd 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -13,7 +13,7 @@ module.exports = { extend: { fontFamily: { sans: ['"Inter"', ...fontFamily.sans], - jakarta: ['"Plus Jakarta Sans"', ...fontFamily.sans], + jakarta: ['Plus Jakarta Sans', ...fontFamily.sans], mono: ['"Fira Code"', ...fontFamily.mono], }, borderRadius: {