diff --git a/docs/docusaurus.config.ts b/docs/docusaurus.config.ts index 97282c4b5f..b934acc932 100644 --- a/docs/docusaurus.config.ts +++ b/docs/docusaurus.config.ts @@ -47,10 +47,10 @@ const config: Config = { // Replace with your project's social card image: 'img/docusaurus-social-card.jpg', navbar: { - title: 'My Site', + title: 'Talawa-docs', logo: { alt: 'My Site Logo', - src: 'img/logo.svg', + src: 'img/logos/logo.png', }, items: [ { @@ -60,9 +60,39 @@ const config: Config = { label: 'Tutorial', }, { - href: 'https://github.com/facebook/docusaurus', - label: 'GitHub', - position: 'right', + label: "Mobile Guide", + position: "left", + href: "https://docs-mobile.talawa.io/", + target: "_blank", + }, + { + label: "Admin Guide", + position: "left", + href: "https://docs-admin.talawa.io/", + target: "_blank", + }, + { + label: "API Guide", + position: "left", + href: "https://docs-api.talawa.io/", + target: "_self", + }, + { + label: "Demo", + position: "left", + href: "http://admin-demo.talawa.io/", + }, + { + to: "https://github.com/PalisadoesFoundation", + position: "right", + className: "header-github-link", + "aria-label": "GitHub repository", + }, + { + to: "https://www.youtube.com/@PalisadoesOrganization", + position: "right", + className: "header-youtube-link", + "aria-label": "Palisadoes Youtube channel", }, ], }, @@ -82,28 +112,52 @@ const config: Config = { title: 'Community', items: [ { - label: 'Stack Overflow', - href: 'https://stackoverflow.com/questions/tagged/docusaurus', + label: "Slack", + to: "https://github.com/PalisadoesFoundation", + className: "footer__icon footer__slack", }, { - label: 'Discord', - href: 'https://discordapp.com/invite/docusaurus', + label: "News", + to: "https://www.palisadoes.org/news/", + className: "footer__icon footer__news", }, { - label: 'X', - href: 'https://x.com/docusaurus', + label: "Contact Us", + to: "https://www.palisadoes.org/contact/", + className: "footer__icon footer__contact", }, ], }, { - title: 'More', + title: "Social Media", items: [ { - label: 'GitHub', - href: 'https://github.com/facebook/docusaurus', + label: " Twitter", + to: "https://twitter.com/palisadoesorg?lang=en", + className: "footer__icon footer__twitter", + }, + { + label: " Facebook", + to: "https://www.facebook.com/palisadoesproject/", + className: "footer__icon footer__facebook", }, + { + label: " Instagram", + to: "https://www.instagram.com/palisadoes/?hl=en", + className: "footer__icon footer__instagram", + } ], }, + { + title: "Development", + items: [ + { + label: " GitHub", + to: "https://github.com/PalisadoesFoundation", + className: "footer__icon footer__github", + }, + ] + } ], copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`, }, diff --git a/docs/src/css/custom.css b/docs/src/css/custom.css index 2bc6a4cfde..07d6b99f60 100644 --- a/docs/src/css/custom.css +++ b/docs/src/css/custom.css @@ -5,26 +5,154 @@ */ /* You can override the default Infima variables here. */ + :root { - --ifm-color-primary: #2e8555; - --ifm-color-primary-dark: #29784c; - --ifm-color-primary-darker: #277148; - --ifm-color-primary-darkest: #205d3b; - --ifm-color-primary-light: #33925d; - --ifm-color-primary-lighter: #359962; - --ifm-color-primary-lightest: #3cad6e; --ifm-code-font-size: 95%; - --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1); + --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.29); + --secondary-blue-900: #001c63; + --sidebar-bg-color: #f3f4f6; + --secondary-blue-500: #3970fd; + --primary-blue-600: #1e56e3; + --base-neutral-0: #ffffff; + --primary-neutral-800: #1f2a37; + --ifm-menu-color-active: #1e56e3; + --primary-neutral-600: #4d5761; + --ifm-breadcrumb-color-active: var(--primary-neutral-600); + --ifm-link-color: #1e56e3; + --ifm-button-background-color: #2e8555; + --ifm-button-background-color-dark: #205d3b; + --ifm-button-background-color-hover: #359469; + --ifm-button-background-color-dark-hover: #266745; + --ifm-hover-overlay: rgba(0, 0, 0, 0.05); + --brand-color: black; + --next-prev-border-color: #e5e7eb; + --ifm-font-family-base: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, + Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", Helvetica, + Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } /* For readability concerns, you should choose a lighter palette in dark mode. */ [data-theme='dark'] { - --ifm-color-primary: #25c2a0; - --ifm-color-primary-dark: #21af90; - --ifm-color-primary-darker: #1fa588; - --ifm-color-primary-darkest: #1a8870; - --ifm-color-primary-light: #29d5b0; - --ifm-color-primary-lighter: #32d8b4; - --ifm-color-primary-lightest: #4fddbf; - --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3); + --ifm-background: #111927; + --ifm-background-surface-color: var(--ifm-background-color); + --ifm-menu-color: var(--ifm-color-gray-200); + --ifm-toc-link-color: var(--ifm-color-gray-200); + --ifm-code-background: #001b66; + --ifm-color-content: var(--ifm-color-white); + --ifm-navbar-search-input-background-color: #001b66; + --ifm-table-stripe-background: #001242; + --ifm-navbar-search-input-placeholder-color: var(--ifm-color-gray-200); + --ifm-hover-overlay: rgba(0, 0, 0, 0); + --ifm-color-primary: #1e56e3; + --secondary-blue-900: #c6d6ff; + --sidebar-bg-color: #161f36; + --primary-neutral-800: #c9c9cc; + --ifm-button-background-color: #25c2a0; + --ifm-button-background-color-dark: #2e8555; + --ifm-navbar-link-color: #9da4ae; + --ifm-navbar-border-color: #2d3956; + --brand-color: white; + --primary-neutral-600: #c4c4c4; + --next-prev-border-color: #293441; +} + +.main-wrapper{ + background-color: var(--ifm-background); + display: block; + padding: 0 max(var(--ifm-pre-padding), 16px); + max-width: 1400px; + margin: 0 auto; +} + +.table-of-contents { + font-size: 0.75rem; +} + +.main__content{ + background-color: var(--ifm-background); +} + +.menu__link, +.menu * { + font-size: 1rem; + padding-left: 0.5rem; + font-weight: 700; + line-height: 1.5; +} + +.menu__list { + border-bottom: 1px solid var(--next-prev-border-color); + padding: 0 15px; +} + +.navbar { + background-color: var(--sidebar-bg-color); + box-shadow: var(--ifm-navbar-shadow); + padding: 24px; + height: 80px; + border-bottom: 1px solid var(--ifm-navbar-border-color) ; +} + +.navbar__item { + font-size: 0.875rem; +} + +.navbar__link:hover, +.navbar__link--active { + color: var(--ifm-color-primary); + text-decoration: none; } + +.navbar__items--right > .navbar__item:not(:first-of-type) { + margin-left: 0.25rem; +} + +.footer--dark { + --ifm-footer-background-color: #111927; + border-top: 1px solid var(--next-prev-border-color); +} + +.header-github-link:before { + content: ""; + width: 20px; + height: 20px; + display: flex; + background: url("../../static/img/logos/github-dark.svg") no-repeat; + position: relative; + right: 8px; + top: 1.5px; +} + +.header-youtube-link:before { + content: ""; + width: 25px; + height: 30px; + display: flex; + background: url("../../static/img/logos/youtube.svg") no-repeat; + position: relative; + right: 8px; + top: 4.5px; +} + +html[data-theme="dark"] .header-github-link:before { + background: url("../../static/img/logos/github.svg") no-repeat; +} +html[data-theme="dark"] .header-youtube-link:before { + background: url("../../static/img/logos/youtube-light.svg") no-repeat; +} + +.footer--dark li { + margin-bottom: 0; + padding: 0.5rem; + line-height: normal; + transition: opacity 0.2s; +} + +.footer--dark li:hover { + opacity: 0.8; +} + +.footer__icon { + margin: 0; + color: #fff; +} \ No newline at end of file diff --git a/docs/src/pages/index.module.css b/docs/src/pages/index.module.css index 9f71a5da77..a020fd1d8b 100644 --- a/docs/src/pages/index.module.css +++ b/docs/src/pages/index.module.css @@ -4,12 +4,27 @@ */ .heroBanner { - padding: 4rem 0; + padding: 8rem 0; text-align: center; position: relative; overflow: hidden; } +.title { + font-size: 3rem; + font-weight: 700; + color: var(--primary-neutral-600); +} + +.subtitle { + margin-top: 1rem; + max-width: 42rem; + font-size: 1.25rem; + color: #718096; + margin-left: auto; + margin-right: auto; +} + @media screen and (max-width: 996px) { .heroBanner { padding: 2rem; @@ -20,4 +35,5 @@ display: flex; align-items: center; justify-content: center; -} + margin-top: 2rem; +} \ No newline at end of file diff --git a/docs/src/pages/index.tsx b/docs/src/pages/index.tsx index 270b7f9af8..7215a95537 100644 --- a/docs/src/pages/index.tsx +++ b/docs/src/pages/index.tsx @@ -10,19 +10,21 @@ import styles from './index.module.css'; function HomepageHeader() { const { siteConfig } = useDocusaurusContext(); return ( -
+
- - {siteConfig.title} - -

{siteConfig.tagline}

-
- - Docusaurus Tutorial - 5min ⏱️ - +
+ + {siteConfig.title} + +

{siteConfig.tagline}

+
+ + Docusaurus Tutorial - 5min ⏱️ + +
diff --git a/docs/static/img/logos/github-dark.svg b/docs/static/img/logos/github-dark.svg new file mode 100644 index 0000000000..654102ae55 --- /dev/null +++ b/docs/static/img/logos/github-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/logos/github.svg b/docs/static/img/logos/github.svg new file mode 100644 index 0000000000..ab49f9955c --- /dev/null +++ b/docs/static/img/logos/github.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/static/img/logos/logo.png b/docs/static/img/logos/logo.png new file mode 100644 index 0000000000..62ab0a91c3 Binary files /dev/null and b/docs/static/img/logos/logo.png differ diff --git a/docs/static/img/logos/youtube-light.svg b/docs/static/img/logos/youtube-light.svg new file mode 100644 index 0000000000..03a5666296 --- /dev/null +++ b/docs/static/img/logos/youtube-light.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/docs/static/img/logos/youtube.svg b/docs/static/img/logos/youtube.svg new file mode 100644 index 0000000000..97a61232b1 --- /dev/null +++ b/docs/static/img/logos/youtube.svg @@ -0,0 +1 @@ + \ No newline at end of file