-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
bad9ae4
commit fee6109
Showing
7 changed files
with
195 additions
and
103 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| import { useEffect, useRef } from "preact/hooks"; | ||
| import type { ImageWidget } from "apps/admin/widgets.ts"; | ||
| import Icon from "site/components/ui/Icon.tsx"; | ||
|
|
||
| export interface CTA { | ||
| src?: string; | ||
| href: string; | ||
| text?: string; | ||
| alt?: string; | ||
| } | ||
|
|
||
| export interface Props { | ||
| title: string; | ||
| description: string; | ||
| button: CTA; | ||
| logos?: ImageWidget[]; | ||
| } | ||
|
|
||
| export default function AffiliatesIsland({ | ||
| title, | ||
| description, | ||
| button, | ||
| logos, | ||
| }: Props) { | ||
| const boardRef = useRef<HTMLDivElement>(null); | ||
|
|
||
| useEffect(() => { | ||
| const params = new URLSearchParams(window.location.search); | ||
| if (params.get("section") === "afiliadas" && boardRef.current) { | ||
| boardRef.current.scrollIntoView({ behavior: "smooth" }); | ||
| } | ||
| }, []); | ||
|
|
||
| return ( | ||
| <div class="lg:container lg:p-16 text-sm py-8 lg:py-20 px-5"> | ||
| <div class="space-y-10"> | ||
| <div class="flex w-full md:w-[350px] flex-col gap-4 justify-center"> | ||
| <h2 class="text-4xl font-black leading-snug">{title}</h2> | ||
| <span class="text-lg font-medium leading-snug">{description}</span> | ||
| <button | ||
| class="w-[12rem] p-2 flex gap-2 items-center justify-center text-white rounded-md bg-pink-500 hover:bg-pink-600 transition duration-300" | ||
| href={button.href} | ||
| > | ||
| {button.text} | ||
| <Icon id="ArrowNorthEast" size={12} strokeWidth={1} /> | ||
| </button> | ||
| </div> | ||
| <div class="grid grid-cols-2 md:grid-cols-5 gap-6 md:gap-10 items-center justify-center"> | ||
| {logos?.map((logo) => ( | ||
| <div> | ||
| <img src={logo} alt={logo} decoding="async" loading="lazy" /> | ||
| </div> | ||
| ))} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| import { useEffect, useRef } from "preact/hooks"; | ||
| import Image from "apps/website/components/Image.tsx"; | ||
| import { ImageWidget } from "apps/admin/widgets.ts"; | ||
| import { Text1 } from "site/islands/text1-history.tsx"; | ||
| import { Text2 } from "site/islands/text2-history.tsx"; | ||
| import { Text3 } from "site/islands/text3-history.tsx"; | ||
| interface Props { | ||
| image1: ImageWidget; | ||
| image2: ImageWidget; | ||
| } | ||
| export default function HistoryIsland({ image1, image2 }: Props) { | ||
| const boardRef = useRef<HTMLDivElement>(null); | ||
| const params = new URLSearchParams(window.location.search); | ||
| useEffect(() => { | ||
| if (params.get("section") === "historia" && boardRef.current) { | ||
| boardRef.current.scrollIntoView({ behavior: "smooth" }); | ||
| } | ||
| }, [params]); | ||
|
|
||
| return ( | ||
| <div className="lg:container text-sm mb-40"> | ||
| <div className="space-y-10"> | ||
| <div class="px-6 flex flex-col items-center gap-8"> | ||
| <div class="w-full max-w-[850px] flex flex-col"> | ||
| <h2 class="text-6xl font-bold text-black leading-snug"> | ||
| E assim nasceu o | ||
| </h2> | ||
| <h2 class="text-6xl font-bold text-black leading-snug text-center"> | ||
| <span class="text-blue-400">movimento</span>{" "} | ||
| <span class="text-pink-500">nacional</span> | ||
| </h2> | ||
| <h2 class="text-6xl font-bold text-black leading-snug text-right"> | ||
| de <span class="text-black">Travestis e Transexuais</span>. | ||
| </h2> | ||
| <p class="text-gray-500 mt-2 text-right">Keila Simpson Sousa</p> | ||
| </div> | ||
| <Text1 /> | ||
| <Text2 /> | ||
| <div class="flex gap-5 max-w-[800px] w-full"> | ||
| <Image | ||
| className="w-1/2 object-contain rounded-2xl" | ||
| width={380} | ||
| height={274} | ||
| src={image1} | ||
| alt={image1} | ||
| decoding="async" | ||
| loading="lazy" | ||
| /> | ||
| <Image | ||
| className="w-1/2 object-contain rounded-2xl" | ||
| width={380} | ||
| height={274} | ||
| src={image2} | ||
| alt={image2} | ||
| decoding="async" | ||
| loading="lazy" | ||
| /> | ||
| </div> | ||
| <Text3 /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| import { useEffect, useRef } from "preact/hooks"; | ||
| import type { ImageWidget } from "apps/admin/widgets.ts"; | ||
| import Image from "apps/website/components/Image.tsx"; | ||
|
|
||
| interface Member { | ||
| name: string; | ||
| role: string; | ||
| description: string; | ||
| image: ImageWidget; | ||
| } | ||
| export interface Props { | ||
| title: string; | ||
| members: Member[]; | ||
| } | ||
|
|
||
| export default function OurBoardIsland({ title, members }: Props) { | ||
| const boardRef = useRef<HTMLDivElement>(null); | ||
|
|
||
| useEffect(() => { | ||
| const params = new URLSearchParams(window.location.search); | ||
| if (params.get("section") === "diretoria" && boardRef.current) { | ||
| boardRef.current.scrollIntoView({ behavior: "smooth" }); | ||
| } | ||
| }, []); | ||
|
|
||
| return ( | ||
| <div ref={boardRef} className="lg:container text-sm mb-10"> | ||
| <div className="space-y-10 px-6 md:px-24 py-8 md:py-24"> | ||
| <div class="w-full flex flex-col gap-8"> | ||
| <h1 class="text-4xl md:text-5xl font-semibold">{title}</h1> | ||
| <div className="flex flex-col md:flex-row gap-8"> | ||
| {members.map((member, index) => ( | ||
| <div class="flex flex-col gap-6" key={index}> | ||
| <Image | ||
| className="w-full rounded-2xl" | ||
| width={380} | ||
| height={274} | ||
| src={member.image} | ||
| alt={member.image} | ||
| decoding="async" | ||
| loading="lazy" | ||
| /> | ||
| <div class="md:px-6"> | ||
| <p class="text-xl font-semibold">{member.name}</p> | ||
| <p class="text-lg">{member.role}</p> | ||
| </div> | ||
| <p class="md:px-6">{member.description}</p> | ||
| </div> | ||
| ))} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,55 +1,10 @@ | ||
| import Image from "apps/website/components/Image.tsx"; | ||
| import { ImageWidget } from "apps/admin/widgets.ts"; | ||
| import { Text1 } from "site/islands/text1-history.tsx"; | ||
| import { Text2 } from "site/islands/text2-history.tsx"; | ||
| import { Text3 } from "site/islands/text3-history.tsx"; | ||
| import HistoryIsland from "site/islands/history-island.tsx"; | ||
|
|
||
| interface Props { | ||
| image1: ImageWidget; | ||
| image2: ImageWidget; | ||
| } | ||
| export default function History({ image1, image2 }: Props) { | ||
| return ( | ||
| <div className="lg:container text-sm mb-40"> | ||
| <div className="space-y-10"> | ||
| <div class="px-6 flex flex-col items-center gap-8"> | ||
| <div class="w-full max-w-[850px] flex flex-col"> | ||
| <h2 class="text-6xl font-bold text-black leading-snug"> | ||
| E assim nasceu o | ||
| </h2> | ||
| <h2 class="text-6xl font-bold text-black leading-snug text-center"> | ||
| <span class="text-blue-400">movimento</span>{" "} | ||
| <span class="text-pink-500">nacional</span> | ||
| </h2> | ||
| <h2 class="text-6xl font-bold text-black leading-snug text-right"> | ||
| de <span class="text-black">Travestis e Transexuais</span>. | ||
| </h2> | ||
| <p class="text-gray-500 mt-2 text-right">Keila Simpson Sousa</p> | ||
| </div> | ||
| <Text1 /> | ||
| <Text2 /> | ||
| <div class="flex gap-5 max-w-[800px] w-full"> | ||
| <Image | ||
| className="w-1/2 object-contain rounded-2xl" | ||
| width={380} | ||
| height={274} | ||
| src={image1} | ||
| alt={image1} | ||
| decoding="async" | ||
| loading="lazy" | ||
| /> | ||
| <Image | ||
| className="w-1/2 object-contain rounded-2xl" | ||
| width={380} | ||
| height={274} | ||
| src={image2} | ||
| alt={image2} | ||
| decoding="async" | ||
| loading="lazy" | ||
| /> | ||
| </div> | ||
| <Text3 /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| return <HistoryIsland image1={image1} image2={image2} />; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters