Skip to content

Commit

Permalink
wip: our-story
Browse files Browse the repository at this point in the history
  • Loading branch information
kaizendae committed Oct 28, 2024
1 parent 150fb82 commit a5997f5
Show file tree
Hide file tree
Showing 4 changed files with 319 additions and 0 deletions.
Binary file added public/about/path.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/devc-1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
317 changes: 317 additions & 0 deletions src/components/about/our-story.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,317 @@
---
import { Image } from "astro:assets";
---

<section id="history">
<div class="container mx-auto">
<!-- <div class="absolute inset-0 bg-no-repeat bg-center bg-contain w-full h-full" style="background-image: url('/public/about/path.png'); z-index: -1;"></div> -->

<h2
class="mb-6 text-center text-heading-lg font-bold text-neutral-dark-10 md:text-left"
>
About Us
</h2>
<div
class="absolute inset-0 top-40 h-full w-full bg-contain bg-center bg-no-repeat"
style="background-image: url('/public/about/path.png');"
>
</div>
<!-- <div
class="absolute left-1/3 top-0 h-full w-[2px] -translate-x-1/2 transform bg-gray-300"
> -->
<div class="flex items-center justify-center pt-20">
<div class="grid grid-cols-2 gap-4 bg-white">
<!-- Left section -->
<div class="flex items-center justify-center">
<!-- Illustration goes here -->
<Image
class="mx-auto overflow-hidden rounded-t-[4px]"
src="/public/devc-1.png"
width={670}
height={500}
loading="lazy"
alt="DevC Casa illustration"
/>
</div>

<!-- Right section -->
<div class="p-8">
<div class="flex items-start justify-between">
<h2 class="text-heading-sm text-neutral-dark-30">
DevC Casa is born
</h2>
<p class="text-label-xs whitespace-nowrap">Jan 2017</p>
</div>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
The Facebook Developer Circles program is a community-driven
initiative designed to foster collaboration and knowledge-sharing
among developers worldwide.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
Developer Circles Casablanca was one of the few communities launched
with the aim to provide a platform for Moroccan developers to
connect locally, learn new skills, collaborate on projects, and
advance their careers through workshops, meetups, and online forums.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
DevC Casa had great success and was one the largest and most active
groups globally. A success that led to the creation of 2 other DevCs
in Rabat and Marrakech.
</p>
</div>
</div>
</div>
<div class="flex items-center justify-center py-10">
<div class="grid grid-cols-2 gap-4 bg-white">
<!-- Left section -->
<div class="p-8">
<div class="flex items-start justify-between">
<h2 class="text-heading-sm text-neutral-dark-30">
Geeksblabla, as a DevC Casa podcast
</h2>
<p class="text-label-xs whitespace-nowrap">May 2018</p>
</div>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
The Facebook Developer Circles program is a community-driven
initiative designed to foster collaboration and knowledge-sharing
among developers worldwide.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
Developer Circles Casablanca was one of the few communities launched
with the aim to provide a platform for Moroccan developers to
connect locally, learn new skills, collaborate on projects, and
advance their careers through workshops, meetups, and online forums.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
DevC Casa had great success and was one the largest and most active
groups globally. A success that led to the creation of 2 other DevCs
in Rabat and Marrakech.
</p>
</div>

<!-- Right section -->
<div class="flex items-center justify-center">
<!-- Illustration goes here -->
<Image
class="mx-auto overflow-hidden rounded-t-[4px]"
src="/public/devc-1.png"
width={670}
height={500}
loading="lazy"
alt="DevC Casa illustration"
/>
</div>
</div>
</div>
<div class="flex items-center justify-center py-10">
<div class="grid grid-cols-2 gap-4 bg-white">
<!-- Left section -->
<div class="flex items-center justify-center">
<!-- Illustration goes here -->
<Image
class="mx-auto overflow-hidden rounded-t-[4px]"
src="/public/devc-1.png"
width={670}
height={500}
loading="lazy"
alt="DevC Casa illustration"
/>
</div>

<!-- Right section -->
<div class="p-8">
<div class="flex items-start justify-between">
<h2 class="text-heading-sm text-neutral-dark-30">
DevC Casa is born
</h2>
<p class="text-label-xs whitespace-nowrap">Jan 2017</p>
</div>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
The Facebook Developer Circles program is a community-driven
initiative designed to foster collaboration and knowledge-sharing
among developers worldwide.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
Developer Circles Casablanca was one of the few communities launched
with the aim to provide a platform for Moroccan developers to
connect locally, learn new skills, collaborate on projects, and
advance their careers through workshops, meetups, and online forums.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
DevC Casa had great success and was one the largest and most active
groups globally. A success that led to the creation of 2 other DevCs
in Rabat and Marrakech.
</p>
</div>
</div>
</div>
<div class="flex items-center justify-center py-10">
<div class="grid grid-cols-2 gap-4 bg-white">
<!-- Left section -->
<div class="p-8">
<div class="flex items-start justify-between">
<h2 class="text-heading-sm text-neutral-dark-30">
Geeksblabla, as a DevC Casa podcast
</h2>
<p class="text-label-xs whitespace-nowrap">May 2018</p>
</div>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
The Facebook Developer Circles program is a community-driven
initiative designed to foster collaboration and knowledge-sharing
among developers worldwide.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
Developer Circles Casablanca was one of the few communities launched
with the aim to provide a platform for Moroccan developers to
connect locally, learn new skills, collaborate on projects, and
advance their careers through workshops, meetups, and online forums.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
DevC Casa had great success and was one the largest and most active
groups globally. A success that led to the creation of 2 other DevCs
in Rabat and Marrakech.
</p>
</div>

<!-- Right section -->
<div class="flex items-center justify-center">
<!-- Illustration goes here -->
<Image
class="mx-auto overflow-hidden rounded-t-[4px]"
src="/public/devc-1.png"
width={670}
height={500}
loading="lazy"
alt="DevC Casa illustration"
/>
</div>
</div>
</div>
<div class="flex items-center justify-center py-10">
<div class="grid grid-cols-2 gap-4 bg-white">
<!-- Left section -->
<div class="flex items-center justify-center">
<!-- Illustration goes here -->
<Image
class="mx-auto overflow-hidden rounded-t-[4px]"
src="/public/devc-1.png"
width={670}
height={500}
loading="lazy"
alt="DevC Casa illustration"
/>
</div>

<!-- Right section -->
<div class="p-8">
<div class="flex items-start justify-between">
<h2 class="text-heading-sm text-neutral-dark-30">
DevC Casa is born
</h2>
<p class="text-label-xs whitespace-nowrap">Jan 2017</p>
</div>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
The Facebook Developer Circles program is a community-driven
initiative designed to foster collaboration and knowledge-sharing
among developers worldwide.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
Developer Circles Casablanca was one of the few communities launched
with the aim to provide a platform for Moroccan developers to
connect locally, learn new skills, collaborate on projects, and
advance their careers through workshops, meetups, and online forums.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
DevC Casa had great success and was one the largest and most active
groups globally. A success that led to the creation of 2 other DevCs
in Rabat and Marrakech.
</p>
</div>
</div>
</div>
<div class="flex items-center justify-center py-10">
<div class="grid grid-cols-2 gap-4 bg-white">
<!-- Left section -->
<div class="p-8">
<div class="flex items-start justify-between">
<h2 class="text-heading-sm text-neutral-dark-30">
Geeksblabla, as a DevC Casa podcast
</h2>
<p class="text-label-xs whitespace-nowrap">May 2018</p>
</div>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
The Facebook Developer Circles program is a community-driven
initiative designed to foster collaboration and knowledge-sharing
among developers worldwide.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
Developer Circles Casablanca was one of the few communities launched
with the aim to provide a platform for Moroccan developers to
connect locally, learn new skills, collaborate on projects, and
advance their careers through workshops, meetups, and online forums.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
DevC Casa had great success and was one the largest and most active
groups globally. A success that led to the creation of 2 other DevCs
in Rabat and Marrakech.
</p>
</div>

<!-- Right section -->
<div class="flex items-center justify-center">
<!-- Illustration goes here -->
<Image
class="mx-auto overflow-hidden rounded-t-[4px]"
src="/public/devc-1.png"
width={670}
height={500}
loading="lazy"
alt="DevC Casa illustration"
/>
</div>
</div>
</div>
<div class="flex items-center justify-center py-10">
<div class="grid grid-cols-2 gap-4 bg-white">
<!-- Left section -->
<div class="flex items-center justify-center">
<!-- Illustration goes here -->
<Image
class="mx-auto overflow-hidden rounded-t-[4px]"
src="/public/devc-1.png"
width={670}
height={500}
loading="lazy"
alt="DevC Casa illustration"
/>
</div>

<!-- Right section -->
<div class="p-8">
<div class="flex items-start justify-between">
<h2 class="text-heading-sm text-neutral-dark-30">
DevC Casa is born
</h2>
<p class="text-label-xs whitespace-nowrap">Jan 2017</p>
</div>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
The Facebook Developer Circles program is a community-driven
initiative designed to foster collaboration and knowledge-sharing
among developers worldwide.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
Developer Circles Casablanca was one of the few communities launched
with the aim to provide a platform for Moroccan developers to
connect locally, learn new skills, collaborate on projects, and
advance their careers through workshops, meetups, and online forums.
</p>
<p class="mt-4 text-paragraph-xs text-neutral-dark-20">
DevC Casa had great success and was one the largest and most active
groups globally. A success that led to the creation of 2 other DevCs
in Rabat and Marrakech.
</p>
</div>
</div>
</div>
</div>
</section>
2 changes: 2 additions & 0 deletions src/pages/about.astro
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,11 @@
import Layout from "@/components/layout.astro";
import Header from "@/components/header.astro";
import Team from "@/components/about/team.astro";
import OurStory from "@/components/about/our-story.astro";
---

<Layout title="About">
<Header />
<OurStory />
<Team />
</Layout>

0 comments on commit a5997f5

Please sign in to comment.