From 70fbf819c7519ac80522a28999da125ebb996f3d Mon Sep 17 00:00:00 2001 From: Brooke Date: Fri, 3 May 2024 23:27:18 -0400 Subject: [PATCH] outline of how the website should look and flow --- README.md | 3 - content/_index.md | 39 ++-- .../classes/3d-modeling-analysis/_index.md | 49 ++--- content/classes/_index.md | 4 +- content/classes/intro-to-drafting/_index.md | 53 ++--- content/classes/survey-graphics/_index.md | 49 ++--- content/docs/_index.md | 37 +--- content/docs/courses/_index.md | 41 ++++ content/docs/getting-started.md | 192 ------------------ content/docs/hugo/_index.md | 4 +- 10 files changed, 109 insertions(+), 362 deletions(-) create mode 100644 content/docs/courses/_index.md delete mode 100644 content/docs/getting-started.md diff --git a/README.md b/README.md index f130fe0..aa81ecf 100644 --- a/README.md +++ b/README.md @@ -6,9 +6,6 @@ git clone https://git.myco.systems/mycosystems/web.myco.systems.git ``` ``` -git fetch -``` -``` git submodule update --init --recursive ``` diff --git a/content/_index.md b/content/_index.md index 467ec48..d6f5235 100644 --- a/content/_index.md +++ b/content/_index.md @@ -11,56 +11,55 @@ layout: hextra-home
{{< hextra/hero-headline >}} - lorem
ipsum + Midtown Drafting & Design {{< /hextra/hero-headline >}}
{{< hextra/hero-subtitle >}} - lorem
ipsum + The Drafting & Design pathway provides students with the foundational
knowledge and skills to succeed in their chosen career. {{< /hextra/hero-subtitle >}}
-
-{{< hextra/hero-button text="lorem ipsum" link="docs" >}}
+
+{{< hextra/hero-button text="Read the docs" link="docs" >}} +
{{< hextra/feature-grid >}} {{< hextra/feature-card - title="lorem ipsum" - subtitle="lorem ipsum" + title="Introduction to Drafting and Design" + subtitle="The foundational course for the Engineering Drafting and Design pathway" class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]" image="images/hextra-doc.webp" link="classes/intro-to-drafting" imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card - title="lorem ipsum" - subtitle="lorem ipsum" + title="Survey of Engineering Graphics" + subtitle="Surveying the field of engineering graphics with a focus on math and design" class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]" image="images/hextra-markdown.webp" link="classes/survey-graphics" imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card - title="lorem ipsum" - subtitle="lorem ipsum" + title="3-D Modeling & Analysis" + subtitle="Mastering 3D Modeling and Analysis for Real-World Design Applications" class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]" image="images/hextra-markdown.webp" link="classes/3d-modeling-analysis" imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80" - style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" >}} + style="background: radial-gradient(ellipse at 50% 80%,#000,hsl(120,10%,40%,0.1),hsla(0,0%,100%,0));" >}} {{< hextra/feature-card - title="And Much More..." - icon="sparkles" - subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} + title="Saftey documentation" + icon="information-circle" + link="/docs" + subtitle="Guidelines for Prototype Room/Drafting Implements & GHS/NFPA safety guidelines">}} {{< hextra/feature-card - title="And Much More..." + title="And More..." icon="sparkles" - subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} -{{< hextra/feature-card - title="And Much More..." - icon="sparkles" - subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} + link="/docs/courses" + subtitle="Read some of our simple online courses available on the documentation page">}} {{< /hextra/feature-grid >}} diff --git a/content/classes/3d-modeling-analysis/_index.md b/content/classes/3d-modeling-analysis/_index.md index 8b3c651..250a5e5 100644 --- a/content/classes/3d-modeling-analysis/_index.md +++ b/content/classes/3d-modeling-analysis/_index.md @@ -3,39 +3,18 @@ linkTitle: "3-D Modeling & Analysis" title: 3-D Modeling & Analysis --- -👋 Hello! Welcome to the Hextra documentation! +{{< hextra/feature-grid style="margin-top:2rem;" cols="2">}} +{{< hextra/feature-card + title="Syllabus" + icon="external-link" + link="#" + style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));" + subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} - - -## What is Hextra? - -Hextra is a modern, fast and batteries-included [Hugo][hugo] theme built with [Tailwind CSS][tailwind-css]. -Designed for building beautiful websites for documentation, blogs, and websites, it provides out-of-the-box features and flexibility to meet various requirements. - -## Features - -- **Beautiful Design** - Inspired by Nextra, Hextra utilizes Tailwind CSS to offer a modern design that makes your site look outstanding. -- **Responsive Layout and Dark Mode** - It looks great on all devices, from mobile, tablet to desktop. Dark mode is also supported to accommodate various lighting conditions. -- **Fast and Lightweight** - Powered by Hugo, a lightning-fast static-site generator housed in a single binary file, Hextra keeps its footprint minimal. No JavaScript or Node.js are needed to use it. -- **Full-text Search** - Built-in offline full-text search powered by FlexSearch, no additional configuration required. -- **Battery-included** - Markdown, syntax highlighting, LaTeX math formulae, diagrams and Shortcodes elements to enhance your content. Table of contents, breadcrumbs, pagination, sidebar navigation and more are all automatically generated. -- **Multi-language and SEO Ready** - Multi-language sites made easy with Hugo's multilingual mode. Out-of-the-box support is included for SEO tags, Open Graph, and Twitter Cards. - -## Questions or Feedback? - -{{< callout emoji="❓" >}} - Hextra is still in active development. - Have a question or feedback? Feel free to [open an issue](https://github.com/imfing/hextra/issues)! -{{< /callout >}} - -## Next - -Dive right into the following section to get started: - -{{< cards >}} - {{< card link="getting-started" title="Getting Started" icon="document-text" subtitle="Learn how to create website using Hextra" >}} -{{< /cards >}} - -[hugo]: https://gohugo.io/ -[flex-search]: https://github.com/nextapps-de/flexsearch -[tailwind-css]: https://tailwindcss.com/ +{{< hextra/feature-card + title="Standards" + icon="external-link" + link="#" + style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" + subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} +{{< /hextra/feature-grid >}} \ No newline at end of file diff --git a/content/classes/_index.md b/content/classes/_index.md index 060ee90..97bdb37 100644 --- a/content/classes/_index.md +++ b/content/classes/_index.md @@ -3,6 +3,4 @@ linkTitle: "Classes" title: Classes --- -👋 Hello! Pick the title of your class from the left side menu to access syllabi and standards. Use the search bar if you can't find what you need. - -Remember to use the search bar at any time to find specific information you need or if your desired subject isn't listed in the left side menu. \ No newline at end of file +👋 Hello! Pick the title of your class from the left side menu to access syllabi and standards. Use the search bar if you can't find what you need, but keep in mind that a majority of the content on this website is related to tools within the prototype room and the classes pages will contain links to more apt resources for your or your child's class. \ No newline at end of file diff --git a/content/classes/intro-to-drafting/_index.md b/content/classes/intro-to-drafting/_index.md index c041a7c..f731da1 100644 --- a/content/classes/intro-to-drafting/_index.md +++ b/content/classes/intro-to-drafting/_index.md @@ -1,41 +1,20 @@ --- -linkTitle: "Introduction to Drafting & Design" -title: Introduction to Drafting & Design +linkTitle: "Intro to Drafting & Design" +title: Intro to Drafting & Design --- -👋 Hello! Welcome to the Hextra documentation! +{{< hextra/feature-grid style="margin-top:2rem;" cols="2">}} +{{< hextra/feature-card + title="Syllabus" + icon="external-link" + link="#" + style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));" + subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} - - -## What is Hextra? - -Hextra is a modern, fast and batteries-included [Hugo][hugo] theme built with [Tailwind CSS][tailwind-css]. -Designed for building beautiful websites for documentation, blogs, and websites, it provides out-of-the-box features and flexibility to meet various requirements. - -## Features - -- **Beautiful Design** - Inspired by Nextra, Hextra utilizes Tailwind CSS to offer a modern design that makes your site look outstanding. -- **Responsive Layout and Dark Mode** - It looks great on all devices, from mobile, tablet to desktop. Dark mode is also supported to accommodate various lighting conditions. -- **Fast and Lightweight** - Powered by Hugo, a lightning-fast static-site generator housed in a single binary file, Hextra keeps its footprint minimal. No JavaScript or Node.js are needed to use it. -- **Full-text Search** - Built-in offline full-text search powered by FlexSearch, no additional configuration required. -- **Battery-included** - Markdown, syntax highlighting, LaTeX math formulae, diagrams and Shortcodes elements to enhance your content. Table of contents, breadcrumbs, pagination, sidebar navigation and more are all automatically generated. -- **Multi-language and SEO Ready** - Multi-language sites made easy with Hugo's multilingual mode. Out-of-the-box support is included for SEO tags, Open Graph, and Twitter Cards. - -## Questions or Feedback? - -{{< callout emoji="❓" >}} - Hextra is still in active development. - Have a question or feedback? Feel free to [open an issue](https://github.com/imfing/hextra/issues)! -{{< /callout >}} - -## Next - -Dive right into the following section to get started: - -{{< cards >}} - {{< card link="getting-started" title="Getting Started" icon="document-text" subtitle="Learn how to create website using Hextra" >}} -{{< /cards >}} - -[hugo]: https://gohugo.io/ -[flex-search]: https://github.com/nextapps-de/flexsearch -[tailwind-css]: https://tailwindcss.com/ +{{< hextra/feature-card + title="Standards" + icon="external-link" + link="#" + style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" + subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} +{{< /hextra/feature-grid >}} \ No newline at end of file diff --git a/content/classes/survey-graphics/_index.md b/content/classes/survey-graphics/_index.md index aa509ea..52fa9e8 100644 --- a/content/classes/survey-graphics/_index.md +++ b/content/classes/survey-graphics/_index.md @@ -3,39 +3,18 @@ linkTitle: "Survey of Engineering Graphics" title: Survey of Engineering Graphics --- -👋 Hello! Welcome to the Hextra documentation! +{{< hextra/feature-grid style="margin-top:2rem;" cols="2">}} +{{< hextra/feature-card + title="Syllabus" + icon="external-link" + link="#" + style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));" + subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} - - -## What is Hextra? - -Hextra is a modern, fast and batteries-included [Hugo][hugo] theme built with [Tailwind CSS][tailwind-css]. -Designed for building beautiful websites for documentation, blogs, and websites, it provides out-of-the-box features and flexibility to meet various requirements. - -## Features - -- **Beautiful Design** - Inspired by Nextra, Hextra utilizes Tailwind CSS to offer a modern design that makes your site look outstanding. -- **Responsive Layout and Dark Mode** - It looks great on all devices, from mobile, tablet to desktop. Dark mode is also supported to accommodate various lighting conditions. -- **Fast and Lightweight** - Powered by Hugo, a lightning-fast static-site generator housed in a single binary file, Hextra keeps its footprint minimal. No JavaScript or Node.js are needed to use it. -- **Full-text Search** - Built-in offline full-text search powered by FlexSearch, no additional configuration required. -- **Battery-included** - Markdown, syntax highlighting, LaTeX math formulae, diagrams and Shortcodes elements to enhance your content. Table of contents, breadcrumbs, pagination, sidebar navigation and more are all automatically generated. -- **Multi-language and SEO Ready** - Multi-language sites made easy with Hugo's multilingual mode. Out-of-the-box support is included for SEO tags, Open Graph, and Twitter Cards. - -## Questions or Feedback? - -{{< callout emoji="❓" >}} - Hextra is still in active development. - Have a question or feedback? Feel free to [open an issue](https://github.com/imfing/hextra/issues)! -{{< /callout >}} - -## Next - -Dive right into the following section to get started: - -{{< cards >}} - {{< card link="getting-started" title="Getting Started" icon="document-text" subtitle="Learn how to create website using Hextra" >}} -{{< /cards >}} - -[hugo]: https://gohugo.io/ -[flex-search]: https://github.com/nextapps-de/flexsearch -[tailwind-css]: https://tailwindcss.com/ +{{< hextra/feature-card + title="Standards" + icon="external-link" + link="#" + style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));" + subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more...">}} +{{< /hextra/feature-grid >}} \ No newline at end of file diff --git a/content/docs/_index.md b/content/docs/_index.md index 2e12fc5..bd8ddc8 100644 --- a/content/docs/_index.md +++ b/content/docs/_index.md @@ -3,39 +3,6 @@ linkTitle: "Documentation" title: Introduction --- -👋 Hello! Welcome to the Hextra documentation! +Hello, welcome to the documentation for the Midtown Drafting & Design pathway. A pathway for learning - - -## What is Hextra? - -Hextra is a modern, fast and batteries-included [Hugo][hugo] theme built with [Tailwind CSS][tailwind-css]. -Designed for building beautiful websites for documentation, blogs, and websites, it provides out-of-the-box features and flexibility to meet various requirements. - -## Features - -- **Beautiful Design** - Inspired by Nextra, Hextra utilizes Tailwind CSS to offer a modern design that makes your site look outstanding. -- **Responsive Layout and Dark Mode** - It looks great on all devices, from mobile, tablet to desktop. Dark mode is also supported to accommodate various lighting conditions. -- **Fast and Lightweight** - Powered by Hugo, a lightning-fast static-site generator housed in a single binary file, Hextra keeps its footprint minimal. No JavaScript or Node.js are needed to use it. -- **Full-text Search** - Built-in offline full-text search powered by FlexSearch, no additional configuration required. -- **Battery-included** - Markdown, syntax highlighting, LaTeX math formulae, diagrams and Shortcodes elements to enhance your content. Table of contents, breadcrumbs, pagination, sidebar navigation and more are all automatically generated. -- **Multi-language and SEO Ready** - Multi-language sites made easy with Hugo's multilingual mode. Out-of-the-box support is included for SEO tags, Open Graph, and Twitter Cards. - -## Questions or Feedback? - -{{< callout emoji="❓" >}} - Hextra is still in active development. - Have a question or feedback? Feel free to [open an issue](https://github.com/imfing/hextra/issues)! -{{< /callout >}} - -## Next - -Dive right into the following section to get started: - -{{< cards >}} - {{< card link="getting-started" title="Getting Started" icon="document-text" subtitle="Learn how to create website using Hextra" >}} -{{< /cards >}} - -[hugo]: https://gohugo.io/ -[flex-search]: https://github.com/nextapps-de/flexsearch -[tailwind-css]: https://tailwindcss.com/ +It's sparce right now but we plan to build out this section of the website to contain guides and tasks for learning the tools within the prototype room. \ No newline at end of file diff --git a/content/docs/courses/_index.md b/content/docs/courses/_index.md new file mode 100644 index 0000000..6ad7e76 --- /dev/null +++ b/content/docs/courses/_index.md @@ -0,0 +1,41 @@ +--- +linkTitle: "Courses" +title: Courses +--- + +👋 Hello! Welcome to the Hextra documentation! + + + +## What is Hextra? + +Hextra is a modern, fast and batteries-included [Hugo][hugo] theme built with [Tailwind CSS][tailwind-css]. +Designed for building beautiful websites for documentation, blogs, and websites, it provides out-of-the-box features and flexibility to meet various requirements. + +## Features + +- **Beautiful Design** - Inspired by Nextra, Hextra utilizes Tailwind CSS to offer a modern design that makes your site look outstanding. +- **Responsive Layout and Dark Mode** - It looks great on all devices, from mobile, tablet to desktop. Dark mode is also supported to accommodate various lighting conditions. +- **Fast and Lightweight** - Powered by Hugo, a lightning-fast static-site generator housed in a single binary file, Hextra keeps its footprint minimal. No JavaScript or Node.js are needed to use it. +- **Full-text Search** - Built-in offline full-text search powered by FlexSearch, no additional configuration required. +- **Battery-included** - Markdown, syntax highlighting, LaTeX math formulae, diagrams and Shortcodes elements to enhance your content. Table of contents, breadcrumbs, pagination, sidebar navigation and more are all automatically generated. +- **Multi-language and SEO Ready** - Multi-language sites made easy with Hugo's multilingual mode. Out-of-the-box support is included for SEO tags, Open Graph, and Twitter Cards. + +## Questions or Feedback? + +{{< callout emoji="❓" >}} + Hextra is still in active development. + Have a question or feedback? Feel free to [open an issue](https://github.com/imfing/hextra/issues)! +{{< /callout >}} + +## Next + +Dive right into the following section to get started: + +{{< cards >}} + {{< card link="getting-started" title="Getting Started" icon="document-text" subtitle="Learn how to create website using Hextra" >}} +{{< /cards >}} + +[hugo]: https://gohugo.io/ +[flex-search]: https://github.com/nextapps-de/flexsearch +[tailwind-css]: https://tailwindcss.com/ diff --git a/content/docs/getting-started.md b/content/docs/getting-started.md deleted file mode 100644 index e25ca5c..0000000 --- a/content/docs/getting-started.md +++ /dev/null @@ -1,192 +0,0 @@ ---- -title: Getting Started -weight: 1 -next: /docs/guide -prev: /docs ---- - -## Quick Start from Template - -{{< icon "github" >}} [imfing/hextra-starter-template](https://github.com/imfing/hextra-starter-template) - -You could quickly get started by using the above template repository. - - - -We have provided a [GitHub Actions workflow](https://docs.github.com/en/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site#publishing-with-a-custom-github-actions-workflow) which can help automatically build and deploy your site to GitHub Pages, and host it for free. -For more options, check out [Deploy Site](../guide/deploy-site). - -[🌐 Demo ↗](https://imfing.github.io/hextra-starter-template/) - -## Start as New Project - -There are two main ways to add the Hextra theme to your Hugo project: - -1. **Hugo Modules (Recommended)**: The simplest and recommended method. [Hugo modules](https://gohugo.io/hugo-modules/) let you pull in the theme directly from its online source. Theme is downloaded automatically and managed by Hugo. - -2. **Git Submodule**: Alternatively, add Hextra as a [Git Submodule](https://git-scm.com/book/en/v2/Git-Tools-Submodules). The theme is downloaded by Git and stored in your project's `themes` folder. - -### Setup Hextra as Hugo module - -#### Prerequisites - -Before starting, you need to have the following software installed: - -- [Hugo (extended version)](https://gohugo.io/installation/) -- [Git](https://git-scm.com/) -- [Go](https://go.dev/) - -#### Steps - -{{% steps %}} - -### Initialize a new Hugo site - -```shell -hugo new site my-site --format=yaml -``` - -### Configure Hextra theme via module - -```shell -# initialize hugo module -cd my-site -hugo mod init github.com/username/my-site - -# add Hextra theme -hugo mod get github.com/imfing/hextra -``` - -Configure `hugo.yaml` to use Hextra theme by adding the following: - -```yaml -module: - imports: - - path: github.com/imfing/hextra -``` - -### Create your first content pages - -Create new content page for the home page and the documentation page: - -```shell -hugo new content/_index.md -hugo new content/docs/_index.md -``` - -### Preview the site locally - -```shell -hugo server --buildDrafts --disableFastRender -``` - -Voila, your new site preview is available at `http://localhost:1313/`. - -{{% /steps %}} - - -{{% details title="How to update theme?" %}} - -To update all Hugo modules in your project to their latest versions, run the following command: - -```shell -hugo mod get -u -``` - -To update Hextra to the [latest released version](https://github.com/imfing/hextra/releases), run the following command: - -```shell -hugo mod get -u github.com/imfing/hextra -``` - -See [Hugo Modules](https://gohugo.io/hugo-modules/use-modules/#update-all-modules) for more details. - -{{% /details %}} - -### Setup Hextra as Git submodule - -#### Prerequisites - -Before starting, you need to have the following software installed: - -- [Hugo (extended version)](https://gohugo.io/installation/) -- [Git](https://git-scm.com/) - -#### Steps - -{{% steps %}} - -### Initialize a new Hugo site - -```shell -hugo new site my-site --format=yaml -``` - -### Add Hextra theme as a Git submodule - -```shell -git submodule add https://github.com/imfing/hextra.git themes/hextra -``` - -Configure `hugo.yaml` to use Hextra theme by adding the following: - -```yaml -theme: hextra -``` - -### Create your first content pages - -Create new content page for the home page and the documentation page: - -```shell -hugo new content/_index.md -hugo new content/docs/_index.md -``` - -### Preview the site locally - -```shell -hugo server --buildDrafts --disableFastRender -``` - -Your new site preview is available at `http://localhost:1313/`. - -{{% /steps %}} - - -When using [CI/CD](https://en.wikipedia.org/wiki/CI/CD) for Hugo website deployment, it's essential to ensure that the following command is executed before running the `hugo` command. - -```shell -git submodule update --init -``` - -Failure to run this command results in the theme folder not being populated with Hextra theme files, leading to a build failure. - - -{{% details title="How to update theme?" %}} - -To update all submodules in your repository to their latest commits, run the following command: - -```shell -git submodule update --remote -``` - -To update Hextra to the latest commit, run the following command: - -```shell -git submodule update --remote themes/hextra -``` - -See [Git submodules](https://git-scm.com/book/en/v2/Git-Tools-Submodules) for more details. - -{{% /details %}} - -## Next - -Explore the following sections to start adding more contents: - -{{< cards >}} - {{< card link="../guide/organize-files" title="Organize Files" icon="document-duplicate" >}} - {{< card link="../guide/configuration" title="Configuration" icon="adjustments" >}} - {{< card link="../guide/markdown" title="Markdown" icon="markdown" >}} -{{< /cards >}} diff --git a/content/docs/hugo/_index.md b/content/docs/hugo/_index.md index 2e12fc5..5f9adc7 100644 --- a/content/docs/hugo/_index.md +++ b/content/docs/hugo/_index.md @@ -1,6 +1,6 @@ --- -linkTitle: "Documentation" -title: Introduction +linkTitle: "Hugo" +title: Hugo --- 👋 Hello! Welcome to the Hextra documentation!