Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 15 additions & 11 deletions src/app/about/page.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -104,14 +104,14 @@ export default function About() {
// ── gradient fill factory ────────────────────────────────────────────────
const getGradient = (ctx, chartArea) => {
const gradient = ctx.createLinearGradient(0, chartArea.top, 0, chartArea.bottom);
gradient.addColorStop(0, 'rgba(0,132,61,0.35)');
gradient.addColorStop(0, 'rgba(0,132,61,0.35)');
gradient.addColorStop(0.5, 'rgba(0,132,61,0.12)');
gradient.addColorStop(1, 'rgba(0,132,61,0.0)');
gradient.addColorStop(1, 'rgba(0,132,61,0.0)');
return gradient;
};

const rawData = [4, 8, 12, 9, 9, 11, 8, 6, 18, 22];
const labels = ['2016', '2017', '2018', '2019', '2020', '2021', '2022', '2023', '2024', '2025'];
const labels = ['2016', '2017', '2018', '2019', '2020', '2021', '2022', '2023', '2024', '2025'];

const data = {
labels,
Expand Down Expand Up @@ -216,13 +216,17 @@ export default function About() {
animate={{ opacity: 1 }}
transition={{ duration: 0.8, delay: 0.2 }}
>
<h5 className='font-bold text-3xl md:text-4xl text-zinc-900 dark:text-zinc-100 font-mono leading-tight mb-6 text-center'>
Get to know our <span className="text-[#00843D] dark:text-yellow-400">Community</span>
</h5>
<h5 className='font-bold text-3xl md:text-4xl text-zinc-900 dark:text-zinc-100 font-mono leading-tight mb-6 text-center'>
Get to know our <span className="text-[#00843D] dark:text-yellow-400">Community</span>
</h5>
Comment thread
hiranya25 marked this conversation as resolved.
<span className="text-[#32a852] font-bold">AOSSIE</span> (Australian Open
Source Software Innovation and Education) is a not-for-profit
organization dedicated to project-based innovation-focused and
research-intensive education. Our projects are free and open-source.
<br />
<Link href="https://opencollective.com/aossie" target="_blank" rel="noopener noreferrer" className="inline-block mt-4 text-[#00843D] dark:text-yellow-400 font-bold hover:underline">
Support our work on Open Collective →
</Link>
Comment thread
hiranya25 marked this conversation as resolved.
</motion.p>
</div>

Expand Down Expand Up @@ -259,12 +263,12 @@ export default function About() {
}}
>
{[
{ value: stats.years, label: 'years' },
{ value: stats.projects, label: 'projects' },
{ value: 203, label: 'repos' },
{ value: '88', label: 'mentors' },
{ value: stats.years, label: 'years' },
{ value: stats.projects, label: 'projects' },
{ value: 203, label: 'repos' },
{ value: '88', label: 'mentors' },
{ value: `${stats.contributors}+`, label: 'contributors' },
{ value: '7500+', label: 'community members' },
{ value: '7500+', label: 'community members' },
].map((item, index) => (
<motion.div
key={index}
Expand Down
205 changes: 110 additions & 95 deletions src/app/page.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export default function Home() {

{/* Main Content */}
<div className="flex flex-col lg:flex-row relative z-10 mb-16 gap-12 items-center">
<motion.div
<motion.div
initial={{ opacity: 0, scale: 0.5 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ duration: 0.8 }}
Expand All @@ -63,15 +63,15 @@ export default function Home() {
</motion.div>
<div className="flex-1 w-full lg:pl-4">
<div className="max-w-2xl mx-auto lg:mx-0">
<motion.h1
<motion.h1
initial={{ opacity: 0, x: 50 }}
animate={{ opacity: 1, x: 0 }}
transition={{ duration: 0.8, delay: 0.2 }}
className="font-mono text-5xl sm:text-6xl md:text-7xl font-extrabold tracking-tight text-[#00843d] md:text-[#FED41E] dark:text-[#FED41E] md:dark:text-black leading-tight relative lg:-top-[30px] text-center lg:text-left"
>
We Innovate <br /> We Educate
</motion.h1>
<motion.p
<motion.p
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ duration: 0.8, delay: 0.4 }}
Expand All @@ -82,7 +82,7 @@ export default function Home() {
provides a resource-efficient channel to transfer knowledge and
achieve innovation and education.
</motion.p>
<motion.div
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.6 }}
Expand Down Expand Up @@ -142,114 +142,129 @@ export default function Home() {
>
<FontAwesomeIcon icon={faYoutube} size="2xl" />
</Link>

</motion.div>
<motion.div
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8, delay: 0.8 }}
className="mt-12 mx-4 md:mx-0 md:mt-8 text-center lg:text-left relative lg:top-[20px]"
>
<Link href="/about" className="group relative inline-block text-lg">
<span className="relative z-10 block overflow-hidden rounded-lg border-2 border-gray-900 px-5 py-3 transition-colors duration-300 ease-in-out group-hover:text-white dark:group-hover:text-black">
<span className="absolute inset-0 h-full w-full rounded-lg bg-white px-5 py-3"></span>
<span className="absolute left-0 -ml-2 h-48 w-72 origin-top-right -translate-x-full translate-y-12 -rotate-90 bg-[#00843D] transition-all duration-300 ease-in-out group-hover:-rotate-180 dark:bg-yellow-400"></span>
<span className="relative font-mono text-xl font-black tracking-tighter">
Learn More About Us
<div className="flex flex-wrap gap-4 justify-center lg:justify-start">
<Link href="/about" className="group relative inline-block text-lg">
<span className="relative z-10 block overflow-hidden rounded-lg border-2 border-gray-900 px-5 py-3 transition-colors duration-300 ease-in-out group-hover:text-white dark:group-hover:text-black">
<span className="absolute inset-0 h-full w-full rounded-lg bg-white px-5 py-3"></span>
<span className="absolute left-0 -ml-2 h-48 w-72 origin-top-right -translate-x-full translate-y-12 -rotate-90 bg-[#00843D] transition-all duration-300 ease-in-out group-hover:-rotate-180 dark:bg-yellow-400"></span>
<span className="relative font-mono text-xl font-black tracking-tighter">
Learn More About Us
</span>
</span>
</span>
<span
className="absolute bottom-0 right-0 mb-3 mr-2 h-14 w-full rounded-lg bg-[#00843D] transition-all duration-200 ease-linear group-hover:m-0 dark:bg-yellow-400"
data-rounded="rounded-lg"
></span>
</Link>
<span
className="absolute bottom-0 right-0 mb-3 mr-2 h-14 w-full rounded-lg bg-[#00843D] transition-all duration-200 ease-linear group-hover:m-0 dark:bg-yellow-400"
data-rounded="rounded-lg"
></span>
</Link>
<Link href="https://opencollective.com/aossie" target="_blank" rel="noopener noreferrer" className="group relative inline-block text-lg">
<span className="relative z-10 block overflow-hidden rounded-lg border-2 border-gray-900 px-5 py-3 transition-colors duration-300 ease-in-out group-hover:text-white dark:group-hover:text-black">
<span className="absolute inset-0 h-full w-full rounded-lg bg-white px-5 py-3"></span>
<span className="absolute left-0 -ml-2 h-48 w-72 origin-top-right -translate-x-full translate-y-12 -rotate-90 bg-[#00843D] transition-all duration-300 ease-in-out group-hover:-rotate-180 dark:bg-yellow-400"></span>
<span className="relative font-mono text-xl font-black tracking-tighter">
Support Our Work
</span>
</span>
<span
className="absolute bottom-0 right-0 mb-3 mr-2 h-14 w-full rounded-lg bg-[#00843D] transition-all duration-200 ease-linear group-hover:m-0 dark:bg-yellow-400"
data-rounded="rounded-lg"
></span>
</Link>
</div>
</motion.div>
</div>
</div>
</div>
</div>
</Container.Outer>

<Stats />

{/* Projects Section */}
<Container className="mt-24 mb-20">
<div className="space-y-10 ">
<div className="flex text-center items-center justify-center">
<div className=" relative top-2 hidden h-12 w-12 translate-x-px transform items-center justify-center rounded-full bg-[#00843D] p-2 dark:bg-yellow-400 md:flex">
<svg
aria-hidden="true"
role="img"
className="scale-125 font-extrabold text-white dark:text-black"
viewBox="0 0 24 24"
width="24"
height="24"
fill="currentColor"
>
<path d="M7.25 6a.75.75 0 00-.75.75v7.5a.75.75 0 001.5 0v-7.5A.75.75 0 007.25 6zM12 6a.75.75 0 00-.75.75v4.5a.75.75 0 001.5 0v-4.5A.75.75 0 0012 6zm4 .75a.75.75 0 011.5 0v9.5a.75.75 0 01-1.5 0v-9.5z"></path>
<path
fillRule="evenodd"
d="M3.75 2A1.75 1.75 0 002 3.75v16.5c0 .966.784 1.75 1.75 1.75h16.5A1.75 1.75 0 0022 20.25V3.75A1.75 1.75 0 0020.25 2H3.75zM3.5 3.75a.25.25 0 01.25-.25h16.5a.25.25 0 01.25.25v16.5a.25.25 0 01-.25.25H3.75a.25.25 0 01-.25-.25V3.75z"
></path>
</svg>
</div>
<div className="col-span-8 mt-3 self-center lg:col-start-2">
<h1 className="font-mono pl-3 text-5xl font-black capitalize tracking-tighter text-zinc-800 dark:text-white">
Our Projects
</h1>
</div>
</div>
<Stats />

<p className=" font-mono text-lg text-zinc-600 dark:text-zinc-400 text-center ">
Our Projects span a wide range of themes, such as:
open money; decentralized economic and financial stability;
trust; education; sustainability; communication; governance and management;
and user-empowering sunny tools.
</p>
</div>
<div className="mt-10">
<Container.Inner>
<div className="grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 lg:grid-cols-3 justify-items-center">
{randomProjects.map((project) => (
<div key={project.name} className="w-full max-w-[18rem] sm:max-w-none">
<CardEffect
heading={project.name}
logo={project.logo}
content={project.description}
/>
</div>
))}
</div>
</Container.Inner>
{/* Projects Section */}
<Container className="mt-24 mb-20">
<div className="space-y-10 ">
<div className="flex text-center items-center justify-center">
<div className=" relative top-2 hidden h-12 w-12 translate-x-px transform items-center justify-center rounded-full bg-[#00843D] p-2 dark:bg-yellow-400 md:flex">
<svg
aria-hidden="true"
role="img"
className="scale-125 font-extrabold text-white dark:text-black"
viewBox="0 0 24 24"
width="24"
height="24"
fill="currentColor"
>
<path d="M7.25 6a.75.75 0 00-.75.75v7.5a.75.75 0 001.5 0v-7.5A.75.75 0 007.25 6zM12 6a.75.75 0 00-.75.75v4.5a.75.75 0 001.5 0v-4.5A.75.75 0 0012 6zm4 .75a.75.75 0 011.5 0v9.5a.75.75 0 01-1.5 0v-9.5z"></path>
<path
fillRule="evenodd"
d="M3.75 2A1.75 1.75 0 002 3.75v16.5c0 .966.784 1.75 1.75 1.75h16.5A1.75 1.75 0 0022 20.25V3.75A1.75 1.75 0 0020.25 2H3.75zM3.5 3.75a.25.25 0 01.25-.25h16.5a.25.25 0 01.25.25v16.5a.25.25 0 01-.25.25H3.75a.25.25 0 01-.25-.25V3.75z"
></path>
</svg>
</div>
<div className="col-span-8 mt-3 self-center lg:col-start-2">
<h1 className="font-mono pl-3 text-5xl font-black capitalize tracking-tighter text-zinc-800 dark:text-white">
Our Projects
</h1>
</div>
</div>
<div className="mt-12 text-center">
<Link
target="_blank"
className="group relative inline-flex items-center overflow-hidden rounded-lg bg-[#00843D] px-8 py-3 text-white focus:outline-none active:bg-[#00843D] dark:bg-yellow-400 dark:text-zinc-900"
href="/projects"
>
<span className="absolute right-0 flex-shrink-0 translate-x-full rounded-full border border-current bg-white p-1 text-black transition-transform group-hover:-translate-x-4">
<svg
className="h-5 w-5"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M17 8l4 4m0 0l-4 4m4-4H3"

<p className=" font-mono text-lg text-zinc-600 dark:text-zinc-400 text-center ">
Our Projects span a wide range of themes, such as:
open money; decentralized economic and financial stability;
trust; education; sustainability; communication; governance and management;
and user-empowering sunny tools.
</p>
</div>
<div className="mt-10">
<Container.Inner>
<div className="grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 lg:grid-cols-3 justify-items-center">
{randomProjects.map((project) => (
<div key={project.name} className="w-full max-w-[18rem] sm:max-w-none">
<CardEffect
heading={project.name}
logo={project.logo}
content={project.description}
/>
</svg>
</span>
<span className="font-mono font-semibold transition-all group-hover:mr-6">
View All Projects
</span>
</Link>
</div>
</Container>
</div>
))}
</div>
</Container.Inner>
</div>
<div className="mt-12 text-center">
<Link
target="_blank"
className="group relative inline-flex items-center overflow-hidden rounded-lg bg-[#00843D] px-8 py-3 text-white focus:outline-none active:bg-[#00843D] dark:bg-yellow-400 dark:text-zinc-900"
href="/projects"
>
Comment thread
hiranya25 marked this conversation as resolved.
<span className="absolute right-0 flex-shrink-0 translate-x-full rounded-full border border-current bg-white p-1 text-black transition-transform group-hover:-translate-x-4">
<svg
className="h-5 w-5"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M17 8l4 4m0 0l-4 4m4-4H3"
/>
</svg>
</span>
<span className="font-mono font-semibold transition-all group-hover:mr-6">
View All Projects
</span>
</Link>
</div>
</Container>


<Container.Outer className="mt-28">
Expand Down
6 changes: 6 additions & 0 deletions src/components/apply/ApplyHeader.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,12 @@ export function ApplyHeader({ children }) {
<p className='text-zinc-600 dark:text-zinc-400 text-lg font-mono leading-8 max-w-4xl text-center'>
Our application timeline is your step-by-step guide to becoming a part of our open-source community and contributing to projects that are shaping the future of technology. From submitting your proposal to final evaluations, we&apos;ll walk you through the process every step of the way. Don&apos;t miss this opportunity to be a part of something great and apply now!
</p>
<p className='text-zinc-500 dark:text-zinc-500 text-sm font-mono mt-4'>
Want to help us keep these projects free and open-source?{' '}
<Link href="https://opencollective.com/aossie" target="_blank" rel="noopener noreferrer" className="text-[#00843D] dark:text-yellow-400 font-bold hover:underline">
Support us on Open Collective
</Link>
Comment thread
hiranya25 marked this conversation as resolved.
</p>
</motion.div>

{/* Horizontal Timeline Steps */}
Expand Down
Loading