From a0ab66189a5d9d4c0084a82b745776a503d587d3 Mon Sep 17 00:00:00 2001 From: Richard Bergsma Date: Fri, 8 Aug 2025 23:21:55 +0200 Subject: [PATCH] style: modernize headers for About/Events/Members/Orphanage/Contact/Gallery using brand-surface; simplify copy; fix date sort; unify CTA --- package-lock.json | 101 ++++++++--------- package.json | 2 +- src/pages/about.astro | 223 ++++++++------------------------------ src/pages/contact.astro | 20 ++-- src/pages/events.astro | 22 ++-- src/pages/gallery.astro | 10 +- src/pages/index.astro | 7 +- src/pages/members.astro | 20 ++-- src/pages/orphanage.astro | 20 ++-- src/styles/main.css | 7 ++ 10 files changed, 145 insertions(+), 287 deletions(-) diff --git a/package-lock.json b/package-lock.json index 1ba7d3b..0988ba7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,7 @@ "@tailwindcss/vite": "^4.1.10", "@types/react": "^19.1.8", "@types/react-dom": "^19.1.6", - "astro": "^5.9.4", + "astro": "^5.12.9", "keen-slider": "^6.8.6", "react": "^19.1.0", "react-dom": "^19.1.0", @@ -54,18 +54,18 @@ "license": "MIT" }, "node_modules/@astrojs/internal-helpers": { - "version": "0.6.1", - "resolved": "https://registry.npmjs.org/@astrojs/internal-helpers/-/internal-helpers-0.6.1.tgz", - "integrity": "sha512-l5Pqf6uZu31aG+3Lv8nl/3s4DbUzdlxTWDof4pEpto6GUJNhhCbelVi9dEyurOVyqaelwmS9oSyOWOENSfgo9A==", + "version": "0.7.1", + "resolved": "https://registry.npmjs.org/@astrojs/internal-helpers/-/internal-helpers-0.7.1.tgz", + "integrity": "sha512-7dwEVigz9vUWDw3nRwLQ/yH/xYovlUA0ZD86xoeKEBmkz9O6iELG1yri67PgAPW6VLL/xInA4t7H0CK6VmtkKQ==", "license": "MIT" }, "node_modules/@astrojs/markdown-remark": { - "version": "6.3.2", - "resolved": "https://registry.npmjs.org/@astrojs/markdown-remark/-/markdown-remark-6.3.2.tgz", - "integrity": "sha512-bO35JbWpVvyKRl7cmSJD822e8YA8ThR/YbUsciWNA7yTcqpIAL2hJDToWP5KcZBWxGT6IOdOkHSXARSNZc4l/Q==", + "version": "6.3.5", + "resolved": "https://registry.npmjs.org/@astrojs/markdown-remark/-/markdown-remark-6.3.5.tgz", + "integrity": "sha512-MiR92CkE2BcyWf3b86cBBw/1dKiOH0qhLgXH2OXA6cScrrmmks1Rr4Tl0p/lFpvmgQQrP54Pd1uidJfmxGrpWQ==", "license": "MIT", "dependencies": { - "@astrojs/internal-helpers": "0.6.1", + "@astrojs/internal-helpers": "0.7.1", "@astrojs/prism": "3.3.0", "github-slugger": "^2.0.0", "hast-util-from-html": "^2.0.3", @@ -80,7 +80,7 @@ "remark-rehype": "^11.1.2", "remark-smartypants": "^3.0.2", "shiki": "^3.2.1", - "smol-toml": "^1.3.1", + "smol-toml": "^1.3.4", "unified": "^11.0.5", "unist-util-remove-position": "^5.0.0", "unist-util-visit": "^5.0.0", @@ -1686,60 +1686,60 @@ ] }, "node_modules/@shikijs/core": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-3.6.0.tgz", - "integrity": "sha512-9By7Xb3olEX0o6UeJyPLI1PE1scC4d3wcVepvtv2xbuN9/IThYN4Wcwh24rcFeASzPam11MCq8yQpwwzCgSBRw==", + "version": "3.9.2", + "resolved": "https://registry.npmjs.org/@shikijs/core/-/core-3.9.2.tgz", + "integrity": "sha512-3q/mzmw09B2B6PgFNeiaN8pkNOixWS726IHmJEpjDAcneDPMQmUg2cweT9cWXY4XcyQS3i6mOOUgQz9RRUP6HA==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.6.0", + "@shikijs/types": "3.9.2", "@shikijs/vscode-textmate": "^10.0.2", "@types/hast": "^3.0.4", "hast-util-to-html": "^9.0.5" } }, "node_modules/@shikijs/engine-javascript": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/@shikijs/engine-javascript/-/engine-javascript-3.6.0.tgz", - "integrity": "sha512-7YnLhZG/TU05IHMG14QaLvTW/9WiK8SEYafceccHUSXs2Qr5vJibUwsDfXDLmRi0zHdzsxrGKpSX6hnqe0k8nA==", + "version": "3.9.2", + "resolved": "https://registry.npmjs.org/@shikijs/engine-javascript/-/engine-javascript-3.9.2.tgz", + "integrity": "sha512-kUTRVKPsB/28H5Ko6qEsyudBiWEDLst+Sfi+hwr59E0GLHV0h8RfgbQU7fdN5Lt9A8R1ulRiZyTvAizkROjwDA==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.6.0", + "@shikijs/types": "3.9.2", "@shikijs/vscode-textmate": "^10.0.2", "oniguruma-to-es": "^4.3.3" } }, "node_modules/@shikijs/engine-oniguruma": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/@shikijs/engine-oniguruma/-/engine-oniguruma-3.6.0.tgz", - "integrity": "sha512-nmOhIZ9yT3Grd+2plmW/d8+vZ2pcQmo/UnVwXMUXAKTXdi+LK0S08Ancrz5tQQPkxvjBalpMW2aKvwXfelauvA==", + "version": "3.9.2", + "resolved": "https://registry.npmjs.org/@shikijs/engine-oniguruma/-/engine-oniguruma-3.9.2.tgz", + "integrity": "sha512-Vn/w5oyQ6TUgTVDIC/BrpXwIlfK6V6kGWDVVz2eRkF2v13YoENUvaNwxMsQU/t6oCuZKzqp9vqtEtEzKl9VegA==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.6.0", + "@shikijs/types": "3.9.2", "@shikijs/vscode-textmate": "^10.0.2" } }, "node_modules/@shikijs/langs": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/@shikijs/langs/-/langs-3.6.0.tgz", - "integrity": "sha512-IdZkQJaLBu1LCYCwkr30hNuSDfllOT8RWYVZK1tD2J03DkiagYKRxj/pDSl8Didml3xxuyzUjgtioInwEQM/TA==", + "version": "3.9.2", + "resolved": "https://registry.npmjs.org/@shikijs/langs/-/langs-3.9.2.tgz", + "integrity": "sha512-X1Q6wRRQXY7HqAuX3I8WjMscjeGjqXCg/Sve7J2GWFORXkSrXud23UECqTBIdCSNKJioFtmUGJQNKtlMMZMn0w==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.6.0" + "@shikijs/types": "3.9.2" } }, "node_modules/@shikijs/themes": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/@shikijs/themes/-/themes-3.6.0.tgz", - "integrity": "sha512-Fq2j4nWr1DF4drvmhqKq8x5vVQ27VncF8XZMBuHuQMZvUSS3NBgpqfwz/FoGe36+W6PvniZ1yDlg2d4kmYDU6w==", + "version": "3.9.2", + "resolved": "https://registry.npmjs.org/@shikijs/themes/-/themes-3.9.2.tgz", + "integrity": "sha512-6z5lBPBMRfLyyEsgf6uJDHPa6NAGVzFJqH4EAZ+03+7sedYir2yJBRu2uPZOKmj43GyhVHWHvyduLDAwJQfDjA==", "license": "MIT", "dependencies": { - "@shikijs/types": "3.6.0" + "@shikijs/types": "3.9.2" } }, "node_modules/@shikijs/types": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/@shikijs/types/-/types-3.6.0.tgz", - "integrity": "sha512-cLWFiToxYu0aAzJqhXTQsFiJRTFDAGl93IrMSBNaGSzs7ixkLfdG6pH11HipuWFGW5vyx4X47W8HDQ7eSrmBUg==", + "version": "3.9.2", + "resolved": "https://registry.npmjs.org/@shikijs/types/-/types-3.9.2.tgz", + "integrity": "sha512-/M5L0Uc2ljyn2jKvj4Yiah7ow/W+DJSglVafvWAJ/b8AZDeeRAdMu3c2riDzB7N42VD+jSnWxeP9AKtd4TfYVw==", "license": "MIT", "dependencies": { "@shikijs/vscode-textmate": "^10.0.2", @@ -2341,14 +2341,14 @@ } }, "node_modules/astro": { - "version": "5.9.4", - "resolved": "https://registry.npmjs.org/astro/-/astro-5.9.4.tgz", - "integrity": "sha512-AEulm16C9IijMYrFb3VIFx9z17p/wfDSHUHdbbvSEX+rBca64xV+f67tnsql3s4CE8u2cwYpdX+5yH7l53W4iA==", + "version": "5.12.9", + "resolved": "https://registry.npmjs.org/astro/-/astro-5.12.9.tgz", + "integrity": "sha512-cZ7kZ61jyE5nwSrFKSRyf5Gds+uJELqQxJFqMkcgiWQvhWZJUSShn8Uz3yc9WLyLw5Kim5P5un9SkJSGogfEZQ==", "license": "MIT", "dependencies": { "@astrojs/compiler": "^2.12.2", - "@astrojs/internal-helpers": "0.6.1", - "@astrojs/markdown-remark": "6.3.2", + "@astrojs/internal-helpers": "0.7.1", + "@astrojs/markdown-remark": "6.3.5", "@astrojs/telemetry": "3.3.0", "@capsizecss/unpack": "^2.4.0", "@oslojs/encoding": "^1.1.0", @@ -2391,6 +2391,7 @@ "rehype": "^13.0.2", "semver": "^7.7.1", "shiki": "^3.2.1", + "smol-toml": "^1.3.4", "tinyexec": "^0.3.2", "tinyglobby": "^0.2.12", "tsconfck": "^3.1.5", @@ -2404,7 +2405,7 @@ "xxhash-wasm": "^1.1.0", "yargs-parser": "^21.1.1", "yocto-spinner": "^0.2.1", - "zod": "^3.24.2", + "zod": "^3.24.4", "zod-to-json-schema": "^3.24.5", "zod-to-ts": "^1.2.0" }, @@ -6087,17 +6088,17 @@ } }, "node_modules/shiki": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/shiki/-/shiki-3.6.0.tgz", - "integrity": "sha512-tKn/Y0MGBTffQoklaATXmTqDU02zx8NYBGQ+F6gy87/YjKbizcLd+Cybh/0ZtOBX9r1NEnAy/GTRDKtOsc1L9w==", + "version": "3.9.2", + "resolved": "https://registry.npmjs.org/shiki/-/shiki-3.9.2.tgz", + "integrity": "sha512-t6NKl5e/zGTvw/IyftLcumolgOczhuroqwXngDeMqJ3h3EQiTY/7wmfgPlsmloD8oYfqkEDqxiaH37Pjm1zUhQ==", "license": "MIT", "dependencies": { - "@shikijs/core": "3.6.0", - "@shikijs/engine-javascript": "3.6.0", - "@shikijs/engine-oniguruma": "3.6.0", - "@shikijs/langs": "3.6.0", - "@shikijs/themes": "3.6.0", - "@shikijs/types": "3.6.0", + "@shikijs/core": "3.9.2", + "@shikijs/engine-javascript": "3.9.2", + "@shikijs/engine-oniguruma": "3.9.2", + "@shikijs/langs": "3.9.2", + "@shikijs/themes": "3.9.2", + "@shikijs/types": "3.9.2", "@shikijs/vscode-textmate": "^10.0.2", "@types/hast": "^3.0.4" } @@ -6131,9 +6132,9 @@ "license": "MIT" }, "node_modules/smol-toml": { - "version": "1.3.4", - "resolved": "https://registry.npmjs.org/smol-toml/-/smol-toml-1.3.4.tgz", - "integrity": "sha512-UOPtVuYkzYGee0Bd2Szz8d2G3RfMfJ2t3qVdZUAozZyAk+a0Sxa+QKix0YCwjL/A1RR0ar44nCxaoN9FxdJGwA==", + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/smol-toml/-/smol-toml-1.4.1.tgz", + "integrity": "sha512-CxdwHXyYTONGHThDbq5XdwbFsuY4wlClRGejfE2NtwUtiHYsP1QtNsHb/hnj31jKYSchztJsaA8pSQoVzkfCFg==", "license": "BSD-3-Clause", "engines": { "node": ">= 18" diff --git a/package.json b/package.json index a8e9035..66bea8c 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "@tailwindcss/vite": "^4.1.10", "@types/react": "^19.1.8", "@types/react-dom": "^19.1.6", - "astro": "^5.9.4", + "astro": "^5.12.9", "keen-slider": "^6.8.6", "react": "^19.1.0", "react-dom": "^19.1.0", diff --git a/src/pages/about.astro b/src/pages/about.astro index 84ef8d2..1652c8b 100644 --- a/src/pages/about.astro +++ b/src/pages/about.astro @@ -3,92 +3,25 @@ import BaseLayout from '../layouts/BaseLayout.astro'; --- - -
- - -
- -
-
-
-
-
- -
🤝
- -
-
-
-
-
-
- - -
-
Nigeria 🇳🇬 • Netherlands 🇳🇱
-
- - -
- - + +
- -
- 🏠 Home - • +
+ Home + / About
- -
-

- About Us -

- - -
-
-
-
-
-
-
-
🤝
-
-
-
-
-
-
-
-
- +

About Us

- Discover the rich heritage and noble mission of the Omoluabi Association bridging - Nigerian culture with - Dutch hospitality in the Netherlands. + We connect Nigerian culture with + Dutch society—supporting families + and building opportunities across the Netherlands.

- -
-
-
- Nigerian Heritage -
-
🌉
-
-
- Dutch Integration -
+
+ 🇳🇬 Nigeria + 🇳🇱 Netherlands
@@ -97,58 +30,19 @@ import BaseLayout from '../layouts/BaseLayout.astro';
-
-
-
-

-
- OMOLUABI ASSOCIATION IN THE NETHERLANDS (OAN) -

- -
-

- The Omoluabi Association in the Royal Kingdom of The Netherlands (OAN) is a pan-Yoruba Association with well-bred, selective, like-minded individuals of enviable character as our members. -

- -

- It is worthy to note that our association is not solely focused on Yorubas or Nigerians only, but we extend our membership to culturally motivated Netherlanders who share our values and vision. -

- -

- The OMOLUABI association of The Netherlands was established on May 1st, 2018 by well-bred, dignifying, and unique personalities that live across the Royal Kingdom of The Netherlands. -

- -
-

- "Our association is a non-profit, non-religious, non-partisan, non-ethnic and socio-cultural organization that focuses on showcasing the Yoruba cultural heritages, norms, values and traditions to the western world, most especially in Holland." -

-
-
- -
-
-
2018
-
Established
-
-
-
500+
-
Members
-
-
-
50+
-
Events Held
-
-
-
€50K+
-
Raised for Charity
-
-
-
-
- -
+
Omoluabi Association Members -
Est. 2018
+
+
+

Omoluabi Association in the Netherlands (OAN)

+

The Omoluabi Association is a pan‑Yoruba, community‑led organization welcoming everyone who shares our values.

+

Founded on May 1, 2018, we preserve culture, support families, and build bridges with Dutch institutions.

+
+
2018
Established
+
500+
Members
+
50+
Events
+
€50K+
Raised
+
@@ -158,13 +52,8 @@ import BaseLayout from '../layouts/BaseLayout.astro';
-

- Who Are We? -

-

- Understanding the meaning and values behind the name "Omoluabi" -

-
+

Who are we?

+

The meaning and values behind the name “Omoluabi”.

@@ -183,52 +72,36 @@ import BaseLayout from '../layouts/BaseLayout.astro';
-

- Our Fundamental Identities -

+

Our values

-
- Ọ̀rọ̀ sísọ (Careful spoken words) -
-
- Ìtẹríba (Respect) -
-
- Irera eni sile (Humility) -
-
- Inú rere (Think good about others) -
-
- Òtítọ́ (Truth) -
-
- Ìwà (Good character) -
-
- Akínkanjú (Bravery) -
-
- Isẹ́ sísẹ (Hard working) -
-
- Ọpọlọ pípé (Highly intelligent) -
+ {[ + ['Ọ̀rọ̀ sísọ','Careful spoken words'], + ['Ìtẹríba','Respect'], + ['Irera eni sile','Humility'], + ['Inú rere','Think good about others'], + ['Òtítọ́','Truth'], + ['Ìwà','Good character'], + ['Akínkanjú','Bravery'], + ['Isẹ́ sísẹ','Hard working'], + ['Ọpọlọ pípé','Highly intelligent'] + ].map(([title,subtitle]) => ( +
+
{title}
+
({subtitle})
+
+ ))}
-
+
-

- Our Mission & Vision -

-
+

Mission & Vision

-
+
🎯

Motto

@@ -355,13 +228,13 @@ import BaseLayout from '../layouts/BaseLayout.astro';
-
+

- Ready to Join Our Community? + Ready to join our community?

diff --git a/src/pages/contact.astro b/src/pages/contact.astro index 6c8b9f2..ad484b9 100644 --- a/src/pages/contact.astro +++ b/src/pages/contact.astro @@ -4,22 +4,16 @@ import ContactForm from '../components/ContactForm.jsx'; --- - -

-
+ +
-
- 🏠 Home - • +
+ Home + / Contact -
-

- Contact Us -

-

- We'd love to hear from you! Please use the form below or reach out via our contact details. -

+

Contact Us

+

We’d love to hear from you. Use the form or our details below.

diff --git a/src/pages/events.astro b/src/pages/events.astro index 4a4354e..5e46f04 100644 --- a/src/pages/events.astro +++ b/src/pages/events.astro @@ -4,26 +4,20 @@ import EventFilterSearch from '../components/EventFilterSearch.jsx'; const eventFiles = Object.values(await import.meta.glob('../../content/events/*.md', { eager: true })) as any[]; const events = eventFiles; -const sortedEvents = events.sort((a, b) => new Date(b.frontmatter?.date || 0) - new Date(a.frontmatter?.date || 0)); +const sortedEvents = events.sort((a, b) => new Date(b.frontmatter?.date || 0).getTime() - new Date(a.frontmatter?.date || 0).getTime()); --- - -
-
+ +
-
- 🏠 Home - • +
+ Home + / Events -
-

- Our Events -

-

- Explore our upcoming and past events. Use the filters and search bar to find what you're looking for! -

+

Events

+

Find community gatherings, cultural celebrations, and programs across the Netherlands.

diff --git a/src/pages/gallery.astro b/src/pages/gallery.astro index 4575ab3..306427e 100644 --- a/src/pages/gallery.astro +++ b/src/pages/gallery.astro @@ -7,11 +7,13 @@ const images = galleryFiles[0]?.frontmatter?.images || []; --- +
+
+

Gallery

+

Moments of culture, community, and celebration.

+
+
-

Our Photo Gallery

-

- Explore moments of joy, culture, and community from our past events and activities. -

diff --git a/src/pages/index.astro b/src/pages/index.astro index f42da78..9efe39d 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -173,7 +173,7 @@ import HomeGallery from '../components/HomeGallery.astro';
-
+
@@ -187,8 +187,7 @@ import HomeGallery from '../components/HomeGallery.astro';

- Make A Donation For Our Various - Projects + Support Our Community Programs

@@ -207,7 +206,7 @@ import HomeGallery from '../components/HomeGallery.astro';

- ❤️ DONATE NOW ✈️ + ❤️ Donate now
diff --git a/src/pages/members.astro b/src/pages/members.astro index 8dc9e8d..9eb4c52 100644 --- a/src/pages/members.astro +++ b/src/pages/members.astro @@ -6,22 +6,16 @@ const members = memberFiles[0]?.frontmatter?.members || []; --- - -
-
+ +
-
- 🏠 Home - • +
+ Home + / Members -
-

- Meet Our Members -

-

- Discover the dedicated individuals who form the heart of the Omoluabi Association. -

+

Our Members

+

Dedicated people at the heart of Omoluabi.

diff --git a/src/pages/orphanage.astro b/src/pages/orphanage.astro index 380a87a..1612776 100644 --- a/src/pages/orphanage.astro +++ b/src/pages/orphanage.astro @@ -3,22 +3,16 @@ import BaseLayout from '../layouts/BaseLayout.astro'; --- - -
-
+ +
-
- 🏠 Home - • +
+ Home + / Orphanage -
-

- Our Orphanage Program -

-

- Learn more about our affiliated orphanage and how you can help us provide a brighter future for children in need. -

+

Our Orphanage Program

+

How we support children with care, education, and hope.

diff --git a/src/styles/main.css b/src/styles/main.css index 56f05d3..f496cca 100644 --- a/src/styles/main.css +++ b/src/styles/main.css @@ -365,6 +365,13 @@ .combined-flag-gradient { background: linear-gradient(90deg, var(--nigerian-green) 0%, var(--dutch-white) 20%, var(--dutch-red) 40%, var(--dutch-white) 60%, var(--dutch-blue) 80%, var(--nigerian-green) 100%); } + + /* Subtle brand surface (used for CTA sections) */ + .brand-surface { + background: radial-gradient(1200px 600px at 20% 20%, rgba(10,10,10,0.08), rgba(10,10,10,0) 60%), + linear-gradient(135deg, rgba(12, 84, 36, 0.95) 0%, rgba(29, 78, 216, 0.90) 100%); + color: #fff; + } /* Combined Flag Button */ .btn-combined-flag {