diff --git a/blog/2023-10-30-NGIAB-Updates.md b/blog/2023-10-30-NGIAB-Updates.md index a195f4c..2a2cdba 100644 --- a/blog/2023-10-30-NGIAB-Updates.md +++ b/blog/2023-10-30-NGIAB-Updates.md @@ -12,6 +12,7 @@ authors: tags: [nextgen] hide_table_of_contents: false +image: https://github.com/CIROH-UA/NGIAB-CloudInfra/raw/main/image/README/ngiab.png --- We've introduced a fresh addition within the NGIAB, offering the most up-to-date insights on NGIAB and NextGen monthly updates. diff --git a/blog/2023-10-30-NextGen-Forcings.md b/blog/2023-10-30-NextGen-Forcings.md index 92b337d..38c0211 100644 --- a/blog/2023-10-30-NextGen-Forcings.md +++ b/blog/2023-10-30-NextGen-Forcings.md @@ -5,6 +5,7 @@ authors: - name: Jordan Laser url: https://github.com/orgs/CIROH-UA/people/JordanLaserGit image_url: https://avatars.githubusercontent.com/u/79336055?v=4 +image: https://github.com/CIROH-UA/ngen-datastream/raw/main/docs/gifs/T2D_2_TMP_2maboveground_cali.gif tags: [nextgen] hide_table_of_contents: false --- diff --git a/blog/2023-11-30-NGIAB-Updates-All.md b/blog/2023-11-30-NGIAB-Updates-All.md index 12c0a6c..407e509 100644 --- a/blog/2023-11-30-NGIAB-Updates-All.md +++ b/blog/2023-11-30-NGIAB-Updates-All.md @@ -12,6 +12,7 @@ authors: tags: [nextgen] hide_table_of_contents: false +image: https://github.com/CIROH-UA/NGIAB-CloudInfra/raw/main/image/README/ngiab.png --- We've release NGIAB v1.1.0! This release fixes issues: diff --git a/blog/2023-11-30-NextGen-Update-Monthly.md b/blog/2023-11-30-NextGen-Update-Monthly.md index f710312..8d6e33d 100644 --- a/blog/2023-11-30-NextGen-Update-Monthly.md +++ b/blog/2023-11-30-NextGen-Update-Monthly.md @@ -10,7 +10,7 @@ authors: url: https://github.com/orgs/CIROH-UA/people/ZacharyWills image_url: https://avatars.githubusercontent.com/u/60660437?v=4 -tags: [nextgen] +tags: [news] hide_table_of_contents: false --- diff --git a/blog/2023-12-30-NextGen-Update-Monthly.md b/blog/2023-12-30-NextGen-Update-Monthly.md index 8f4405a..3ba3f97 100644 --- a/blog/2023-12-30-NextGen-Update-Monthly.md +++ b/blog/2023-12-30-NextGen-Update-Monthly.md @@ -10,7 +10,7 @@ authors: url: https://github.com/orgs/CIROH-UA/people/ZacharyWills image_url: https://avatars.githubusercontent.com/u/60660437?v=4 -tags: [nextgen] +tags: [news] hide_table_of_contents: false --- Happy New Year!!! We are back from SFO after attending AGU last month. We are excited to share the latest updates for NGIAB, NextGen, T-route, Hydrofabric, NextGen forcings, and Community Support from December 2023. diff --git a/blog/2024-07-31-IT-Update.md b/blog/2024-07-31-IT-Update.md index fc5d9c1..9f627f3 100644 --- a/blog/2024-07-31-IT-Update.md +++ b/blog/2024-07-31-IT-Update.md @@ -3,8 +3,9 @@ title: "CIROH Research CyberInfrastructure Update" description: "July Monthly IT Update" slug: July Monthly IT Update -tags: [ciroh, tuscaloosa, 2i2c, gcp, gpu, si, reu, bigquery, api, aws, nsf access] +tags: [ciroh, 2i2c, google, gpu, reu, bigquery, api, aws, nsf ] hide_table_of_contents: false +image: /img/summer-institute.jpg --- We're excited to share some recent developments and updates from CIROH's Research CyberInfrastructure team: diff --git a/blog/2024-08-28-Case-Studies.md b/blog/2024-08-28-Case-Studies.md index bcf8dda..b6d482f 100644 --- a/blog/2024-08-28-Case-Studies.md +++ b/blog/2024-08-28-Case-Studies.md @@ -3,8 +3,9 @@ title: "CIROH Cloud User Success Story" description: "August Monthly Blog Update" slug: August Monthly Blog Update -tags: [ciroh, tuscaloosa, 2i2c, gcp, gpu, si, reu, bigquery, api, aws, nsf access] +tags: [ciroh, 2i2c, aws, google, nextgen, jupyterhub, hpc, teehr, ngen] hide_table_of_contents: false +image: https://github.com/CIROH-UA/ngen-datastream/blob/main/docs/images/ngen-datastream.jpg?raw=true --- This month, we are excited to showcase two case studies that utilized our cyberinfrastructure tools and services. These case studies demonstrate how CIROH's cyberinfrastructure is being utilized to support hydrological research and operational advancements. diff --git a/blog/2024-09-30-BigQuery.md b/blog/2024-09-30-BigQuery.md index c1ddbfc..fb9ef7d 100644 --- a/blog/2024-09-30-BigQuery.md +++ b/blog/2024-09-30-BigQuery.md @@ -3,8 +3,9 @@ title: "Accessing National Water Model (NWM) Data via Google Cloud BigQuery API" description: "September Monthly Blog Update" slug: September Monthly Blog Update -tags: [BigQuery, BYU, NWM, CIROH, Google, Cloud, API] +tags: [bigquery, byu, nwm, ciroh, google, cloud, api, partnership] hide_table_of_contents: false +image: /img/gcp_architecture_diagram.png --- gcp architectrure diagram diff --git a/blog/2024-1-31-NextGen-Update-Monthly.md b/blog/2024-1-31-NextGen-Update-Monthly.md index 9e72c8b..ea694dd 100644 --- a/blog/2024-1-31-NextGen-Update-Monthly.md +++ b/blog/2024-1-31-NextGen-Update-Monthly.md @@ -7,7 +7,7 @@ authors: url: https://github.com/arpita0911patel image_url: https://avatars.githubusercontent.com/u/54657?v=4 -tags: [nextgen] +tags: [news] hide_table_of_contents: false --- Welcome to the January edition of the CIROH DocuHub blog, where we share the latest updates and news about the Community NextGen project monthly. NextGen is a cutting-edge hydrologic modeling framework that aims to advance the science and practice of hydrology and water resources management. In this month's blog, we will highlight some of the recent achievements and developments of the Community NextGen team. diff --git a/blog/2024-2-29-NextGen-Update-Monthly.md b/blog/2024-2-29-NextGen-Update-Monthly.md index c5ca20e..85296b7 100644 --- a/blog/2024-2-29-NextGen-Update-Monthly.md +++ b/blog/2024-2-29-NextGen-Update-Monthly.md @@ -7,7 +7,7 @@ authors: url: https://github.com/arpita0911patel image_url: https://avatars.githubusercontent.com/u/54657?v=4 -tags: [nextgen, ciroh, community-nextgen] +tags: [ciroh, community-nextgen, on-premises, nwm, news] hide_table_of_contents: false --- Welcome to the February edition of the CIROH DocuHub blog, where we bring you the latest updates and news about the Community NextGen project and CIROH's Cloud and on-premise Infrastructure. diff --git a/blog/2024-3-31-NextGen-Update-Monthly.md b/blog/2024-3-31-NextGen-Update-Monthly.md index 44b1df5..a9be390 100644 --- a/blog/2024-3-31-NextGen-Update-Monthly.md +++ b/blog/2024-3-31-NextGen-Update-Monthly.md @@ -7,7 +7,7 @@ authors: url: https://github.com/arpita0911patel image_url: https://avatars.githubusercontent.com/u/54657?v=4 -tags: [nextgen, ciroh, community-nextgen] +tags: [ciroh, community-nextgen, news, singularity] hide_table_of_contents: false --- diff --git a/blog/2024-4-16-AWRATuscaloosa.md b/blog/2024-4-16-AWRATuscaloosa.md index da478c1..3203c52 100644 --- a/blog/2024-4-16-AWRATuscaloosa.md +++ b/blog/2024-4-16-AWRATuscaloosa.md @@ -9,6 +9,7 @@ authors: tags: [awra, tuscaloosa, conference, water resources, modeling] hide_table_of_contents: false +image: /img/awra2024.jpeg --- **AWRA 2024 Spring Conference** diff --git a/blog/2024-4-16-GoogleCloudNext2024.md b/blog/2024-4-16-GoogleCloudNext2024.md index 5f3af75..6d2d011 100644 --- a/blog/2024-4-16-GoogleCloudNext2024.md +++ b/blog/2024-4-16-GoogleCloudNext2024.md @@ -9,6 +9,7 @@ authors: tags: [google, googlecloud, googlecloudnext, conference] hide_table_of_contents: false +image: /img/googlenext-3.jpeg --- **Google Cloud Next '24** diff --git a/blog/2024-5-02-DevCon24.md b/blog/2024-5-02-DevCon24.md index c2886bb..bd65ba0 100644 --- a/blog/2024-5-02-DevCon24.md +++ b/blog/2024-5-02-DevCon24.md @@ -7,8 +7,9 @@ authors: url: https://github.com/arpita0911patel image_url: https://avatars.githubusercontent.com/u/54657?v=4 -tags: [ciroh, tuscaloosa, conference, water resources, ngiab] +tags: [ciroh, conference, hydrology, training, nextgen, resources] hide_table_of_contents: false +image: /img/devcon24_02.jpeg --- **CIROH Developers Conference 2024** diff --git a/docusaurus.config.js b/docusaurus.config.js index 0f5e106..af9916c 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -32,12 +32,7 @@ const config = { trackingID: 'G-TQW7CE7E2P', anonymizeIP: true, }, - blog: { - blogTitle: "DocuHub blog!", - blogDescription: "A DocuHub powered blog!", - postsPerPage: "ALL", - authorsMapPath: "blog/authors.yaml", - }, + blog: false, docs: { sidebarPath: require.resolve("./sidebars.js"), // Please change this to your repo. @@ -51,9 +46,29 @@ const config = { ], ], -plugins: [[ require.resolve('docusaurus-lunr-search'), { - languages: ['en'] // language codes -}],['drawio', {}]], + plugins: [ + // Lunr Search Plugin for search functionality + [ + require.resolve('docusaurus-lunr-search'), + { + languages: ['en'], // language codes for search + } + ], + + // Draw.io Plugin for embedding diagrams + ['drawio', {}], + + // Custom Blog Plugin + [ + './plugins/plugin-content-blog.js', + { + blogTitle: "DocuHub blog!", + blogDescription: "A DocuHub powered blog!", + postsPerPage: "ALL", // Display all posts on a single page + authorsMapPath: "blog/authors.yaml", // Path to the authors' mapping file + } + ] + ], themeConfig: /** @type {import('@docusaurus/preset-classic').ThemeConfig} */ @@ -108,61 +123,73 @@ plugins: [[ require.resolve('docusaurus-lunr-search'), { }, { - href: "/news", - label: "News", - position: "right", - }, - { - href: "/contact", - label: "Contact Us", - position: "right", + href: "/impact", + label: "Community Impact", + position: "left", }, { - href: "/contribute", - label: "Contribute", + href: "/news", + label: "News", position: "right", }, { - href: "http://portal.ciroh.org//", - label: "Portal", + href: "https://forms.office.com/r/5ww7qRWwwf", + label: "Feedback", position: "right", - }, - + } ], }, footer: { style: "dark", links: [ { - title: "Docs", + title: 'Quick Links', items: [ { - label: "About CIROH", - href: "https://ciroh.ua.edu/about/", + label: 'Education', + href: '/docs/education/' + }, + { + label: 'Contact Us', + href: '/contact' }, { - label: "CIROH Members and Partners", - href: "https://ciroh.ua.edu/about/ciroh-partners/", + label: 'Contribute', + href: '/contribute' }, { - label: "Contact CIROH", - href: "https://ciroh.ua.edu/contact-us/", + label: 'CIROH Portal', + href: 'http://portal.ciroh.org/' + } + ] + }, + { + title: 'About CIROH', + items: [ + { + label: 'About Us', + href: 'https://ciroh.ua.edu/about/' }, { - label: "DocuHub Repo", - href: "https://github.com/CIROH-UA/ciroh-ua_website", + label: 'Members & Partners', + href: 'https://ciroh.ua.edu/about/ciroh-partners/' }, { - label: "CIROH Portal", - href: "http://portal.ciroh.org//", + label: 'Contact CIROH', + href: 'https://ciroh.ua.edu/contact-us/' }, - ], + { + label: 'DocuHub Repository', + href: 'https://github.com/CIROH-UA/ciroh-ua_website' + } + ] }, { title: "Follow us on", items: [ { html: ` + `, }, { @@ -189,9 +216,14 @@ plugins: [[ require.resolve('docusaurus-lunr-search'), { ], }, ], - copyright: `
This project received funding under award NA22NWS4320003 from NOAA Cooperative Institute Program. The statements, findings, conclusions, and recommendations are those of the author(s) and do not necessarily reflect the views of NOAA. -


-Copyright © ${new Date().getFullYear()} CIROH - The University of Alabama`, + copyright: ` + `, }, prism: { theme: prismThemes.github, diff --git a/plugins/plugin-content-blog.js b/plugins/plugin-content-blog.js new file mode 100644 index 0000000..c9e507b --- /dev/null +++ b/plugins/plugin-content-blog.js @@ -0,0 +1,41 @@ +const fs = require('node:fs'); + +const blogPluginExports = require('@docusaurus/plugin-content-blog'); + +const defaultBlogPlugin = blogPluginExports.default; + +async function blogPluginEnhanced(...pluginArgs) { + const blogPluginInstance = await defaultBlogPlugin(...pluginArgs); + + const dir = '.docusaurus'; + + return { + ...blogPluginInstance, + contentLoaded: async function (data) { + let recentPosts = [...data.content.blogPosts] + // Only show published posts. + .filter((p) => !p.metadata.unlisted) + + + recentPosts = recentPosts.map((p) => { + return { + id: p.id, + metadata: p.metadata, + }; + }); + + fs.mkdirSync(dir, { + recursive: true, // Avoid error if directory already exists. + }); + const fd = fs.openSync(`${dir}/recent-posts.json`, 'w'); + fs.writeSync(fd, JSON.stringify(recentPosts)); + + return blogPluginInstance.contentLoaded(data); + }, + }; +} + +module.exports = { + ...blogPluginExports, + default: blogPluginEnhanced, +}; \ No newline at end of file diff --git a/src/components/BlogFilter.js b/src/components/BlogFilter.js new file mode 100644 index 0000000..3784237 --- /dev/null +++ b/src/components/BlogFilter.js @@ -0,0 +1,110 @@ +import React, { useState } from 'react'; +import recentPosts from '@site/.docusaurus/recent-posts.json'; +import styles from './CommunityImpact.module.css'; + +export default function BlogFilter() { + const [activeTag, setActiveTag] = useState('*'); + + // Extract unique tags from your posts + const tags = ['AWS', 'Google', 'Conference', 'NextGen']; + + // Filter posts based on the selected tag + const filteredPosts = activeTag === '*' + ? recentPosts + : recentPosts.filter(post => + post.metadata.tags?.some(tag => tag.label.toLowerCase() === activeTag.toLowerCase()) + ); + + return ( +
+
+ + {tags.map((tag) => ( + + ))} +
+ +
+ ); +} diff --git a/src/components/CommunityImpact.js b/src/components/CommunityImpact.js new file mode 100644 index 0000000..fe43923 --- /dev/null +++ b/src/components/CommunityImpact.js @@ -0,0 +1,85 @@ +import React from 'react'; +import styles from './CommunityImpact.module.css'; +import BlogFilter from './BlogFilter'; +import clsx from 'clsx'; +import Layout from '@theme/Layout'; + +const ImpactItem = ({ title, count, imageSrc,users }) => ( +
+ {`${title} +

{title}

+

{count}

+

{users} active users

+ +
+); + +export default function CommunityImpact() { + const impactData = [ + { + title: "AWS Projects", + count: 24, + imageSrc: "/img/aws-logo.svg", + users:60 + }, + { + title: "GCP and JupyterHub Projects", + count: 3, + imageSrc: "/img/google-cloud.jpg", + users: 171 + }, + { + title: "On-premise HPC Projects", + count: 20, + imageSrc: "/img/pantarhei-logo.jpg", + users: 50 + }, + { + title: "NSF ACCESS Allocations Projects", + count: 7, + imageSrc: "/img/nsf-logo.png", + users:27 + } + ]; + + return ( +
+
+
+
+
+
+

Community Impact

+ + We are committed to providing infrastructure support to CIROH consortium partners and members to advance + their research. Our impact spans across various cloud platforms and resources. Here's an overview of our contributions: + + +
+ {/*
+ Logo +
*/} +
+
+
+
+ +
+ {impactData.map((item, index) => ( + + ))} +
+
+

To learn more about our projects and the impact we're making, check out our blogs for in-depth insights and updates!

+
+ +
+
+ ); +} \ No newline at end of file diff --git a/src/components/CommunityImpact.module.css b/src/components/CommunityImpact.module.css new file mode 100644 index 0000000..0ef1a98 --- /dev/null +++ b/src/components/CommunityImpact.module.css @@ -0,0 +1,188 @@ +/* CommunityImpact.module.css */ + +.heroBanner { + padding: 4rem 0; + text-align: center; + position: relative; + overflow: hidden; +} + +.mainTitle { + font-size: 2rem; + font-weight: bold; + text-align: center; + margin-bottom: 1rem; +} + +.description { + text-align: center; + margin-bottom: 2rem; + line-height: 1.6; +} + +.impactGrid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; +} +.sectionDivider { + margin: 3rem auto; + width: 100%; + height: 1px; + background: #7f7878; /* Optional: to match your content width */ +} +.postCard { + padding: 1rem; + border-radius: 12px; + transition: all 0.3s ease; + border: 1px solid transparent; +} + +.postCard:hover { + transform: translateY(-5px); + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); +} + +.postImage { + width: 100%; + height: 300px; + margin-bottom: 1rem; + display: flex; + justify-content: center; + align-items: center; + overflow: hidden; + transition: all 0.3s ease; +} + +.postImage img { + max-width: 100%; + max-height: 100%; + width: auto; + height: auto; + object-fit: contain; + border-radius: 8px; + transition: all 0.3s ease; +} + +.postImage:hover img { + transform: scale(1.03); +} + +.impactItem { + display: flex; + flex-direction: column; + align-items: center; + padding: 1.5rem; +} + +.impactIcon { + width: 120px; + height: 120px; + margin-bottom: 1rem; +} + +.impactTitle { + font-size: 1.25rem; + font-weight: bold; + margin-bottom: 0.5rem; + text-align: center; + min-height: 3rem; /* Set a minimum height to ensure equal spacing */ + line-height: 1.2; /* Ensure consistent line spacing for multiline titles */ +} + +.impactCount { + font-size: 2rem; + font-weight: bold; + color: #0066cc; + text-align: center; +} + +@media (max-width: 768px) { + .impactGrid { + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + } +} + +.blog-filter-container { + margin: 2rem 0; +} + +.tag-buttons-container { + display: flex; + flex-wrap: wrap; + margin-bottom: 1.5rem; +} + +.button { + background-color: #f1f3f4; + color: #333; + border: none; + padding: 0.5rem 1rem; + font-size: 1rem; + cursor: pointer; + transition: background-color 0.3s ease; + border-radius: 4px; +} + +.button:hover { + background-color: #e2e6ea; +} + +.button--active { + background-color: #007bff; + color: white; +} + +.margin-left--sm { + margin-left: 0.5rem; +} + +.post-list { + list-style-type: none; + padding: 0; +} + +.post-item { + margin-bottom: 1.5rem; +} + +.post-link { + text-decoration: none; + color: inherit; +} + +.post-title { + font-size: 1.25rem; + margin: 0; + transition: color 0.3s ease; +} + +.post-description { + margin: 0.5rem 0; + color: #525456; +} + +.post-date { + color: #555759; + font-size: 0.875rem; +} + +.center{ + text-align: center; +} + +.btn { +font-size: 1.4rem; +padding: 0.5rem 1rem; +border-radius: 20px; +transition: all 0.3s ease; +margin: 0.25rem; +font-weight: 600; +text-transform: capitalize; +} + +.btn:hover { +background: #f0f0f0; +transform: translateY(-1px); +box-shadow: 0 2px 5px rgba(0,0,0,0.1); +} diff --git a/src/components/HomepageFeatures/index.js b/src/components/HomepageFeatures/index.js index 41e89eb..7a459a0 100644 --- a/src/components/HomepageFeatures/index.js +++ b/src/components/HomepageFeatures/index.js @@ -410,26 +410,7 @@ export default function HomepageFeatures() { -
-

Community Impact

-

- We are committed to providing infrastructure support to CIROH - consortium partners and members to advance their research. Our impact - spans across various cloud platforms and resources. Here's an overview - of our contributions: -

-
- {impactData.map((item, index) => ( - - ))} -
-
+
diff --git a/src/css/custom.css b/src/css/custom.css index 446e01d..25c15d7 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -74,6 +74,10 @@ margin-right: 1.3rem; } + + + + .player-wrapper { position: relative; padding-top: 56.25%; /* 16:9 Aspect Ratio */ @@ -107,4 +111,99 @@ line-height: 1.5; } +} + +.footer { + padding-bottom: 2rem; +} + +/* Center the footer columns container */ +.footer__links { + display: flex; + justify-content: center; + gap: 4rem; + padding: 2rem 1rem; + margin-bottom: 2rem; + max-width: 1000px; /* Add max-width to match content width */ + margin-left: auto; + margin-right: auto; +} + +/* Column styling */ +.footer__col { + flex: 1 1 0; /* Change to flex: 1 to distribute space evenly */ + min-width: 200px; + max-width: 250px; /* Slightly reduce max-width */ +} + +/* Rest of the styles remain the same */ +.footer__title { + text-align: left; + margin-bottom: 1rem; +} + +.footer__item { + text-align: left; +} + +.footer-social-links { + display: flex; + gap: 1rem; + justify-content: flex-start; + margin-top: 0.5rem; +} + +.footer__funding { + text-align: center; + max-width: 800px; + margin: 0 auto; + padding: 2rem 1.5rem; + border-top: 1px solid rgba(255, 255, 255, 0.1); + border-bottom: 1px solid rgba(255, 255, 255, 0.1); + font-size: 0.9rem; + color: var(--ifm-footer-color); + line-height: 1.5; +} + +.footer__bottom { + text-align: center; + padding-top: 1.5rem; + font-size: 0.875rem; + color: var(--ifm-footer-color); + opacity: 0.8; +} + +@media (max-width: 996px) { + .footer__links { + gap: 2rem; + flex-wrap: wrap; + justify-content: center; /* Change to center */ + margin-bottom: 1.5rem; + } + + .footer__col { + flex: 0 1 auto; /* Reset flex in mobile view */ + min-width: 150px; + margin-bottom: 1rem; + } + + .footer__funding { + padding: 1.5rem 1rem; + font-size: 0.85rem; + } +} + +@media (min-width: 1440px) { + .community-impact-wrapper .container { + max-width: 100% !important; + } +} + +.community-impact-wrapper .col { + padding:0rem; +} + +.community-impact-wrapper .margin-vert--lg { + margin-bottom: 2rem !important; + margin-top: 0rem !important; } \ No newline at end of file diff --git a/src/pages/impact.md b/src/pages/impact.md new file mode 100644 index 0000000..b22c4b6 --- /dev/null +++ b/src/pages/impact.md @@ -0,0 +1,9 @@ +--- +title: Community Impact +hide_table_of_contents: true +wrapperClassName: community-impact-wrapper +--- + +import CommunityImpact from '@site/src/components/CommunityImpact'; + + \ No newline at end of file