Skip to content

Commit

Permalink
fix
Browse files Browse the repository at this point in the history
  • Loading branch information
thelostone-mc committed Jun 17, 2024
1 parent 0cf5832 commit 7cedaec
Show file tree
Hide file tree
Showing 6 changed files with 184 additions and 171 deletions.
8 changes: 8 additions & 0 deletions packages/common/src/icons/AlloV1Black.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
export default function AlloV1Black() {
return (
<svg width="33" height="16" viewBox="0 0 33 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.3897 11.4377C12.2273 11.4171 12.1722 11.2132 12.3026 11.1154C13.9399 9.88569 14.4346 7.6153 13.3795 5.80926L10.2779 0.5C8.45179 1.54186 7.73179 3.74983 8.5246 5.6229C8.58776 5.77205 8.43686 5.92119 8.28595 5.85877C6.39073 5.07491 4.15604 5.7865 3.10155 7.59131L0 12.9006C1.82397 13.9412 4.11528 13.4559 5.36113 11.8458C5.46039 11.7176 5.66606 11.772 5.6869 11.9322C5.9492 13.9449 7.68916 15.5 9.7969 15.5H16C16 13.4169 14.4262 11.697 12.3897 11.438V11.4377ZM11.3872 11.4039H6.14118C5.93054 11.4039 5.79892 11.1785 5.90409 10.9983L8.52709 6.50824C8.63226 6.32804 8.8958 6.32804 9.00097 6.50824L11.624 10.9983C11.7295 11.1785 11.5975 11.4039 11.3869 11.4039H11.3872Z" fill="black"/>
<path d="M24.944 13H22.832L20.048 5.944H22.064L23.936 10.872H24L25.856 5.944H27.728L24.944 13ZM27.9573 5.736V4.424C29.3653 4.424 30.0053 3.944 30.3733 2.888H31.8453V13H29.8453V5.736H27.9573Z" fill="black"/>
</svg>
);
}
10 changes: 4 additions & 6 deletions packages/round-manager/src/features/common/LandingPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,14 +15,12 @@ function LandingPage() {
fetchProgramsStatus === ProgressStatus.IS_SUCCESS && !listProgramsError;

return (
<>
<div className="bg-grey-50 flex flex-col items-center">
<Navbar programCta={isSuccess} />
<div className="bg-grey-50 flex flex-col items-center">
<Navbar programCta={isSuccess} />
<ProgramListPage />
<RoundListPage />
<Footer />
</div>
</>
<Footer />
</div>
);
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import {
import { CardProps } from "../common/types";

export const ProgramCard: React.FC<CardProps> = (props: CardProps) => (
<BasicCard className="program-card border-none m-2 mb-6 min-w-[350px] sm:min-w-[375px] md:min-w-[400px] lg:min-w-[400px] xl:min-w-[350px] relative rounded-lg">
<BasicCard className="program-card border-none my-2 mb-6 min-w-[350px] sm:min-w-[375px] md:min-w-[400px] lg:min-w-[400px] xl:min-w-[380px] 2xl:min-w-[340px] relative rounded-lg mr-auto">
<CardContent className="p-4 px-5">
<CardTitle className="font-medium text-2xl font-sans">
{props.title}
Expand Down
181 changes: 92 additions & 89 deletions packages/round-manager/src/features/program/ProgramListPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import { useAlloVersion } from "common/src/components/AlloVersionSwitcher";
import { ExclamationCircleIcon } from "@heroicons/react/solid";
import { ProgramCard } from "./ProgramCard";
import { chunk } from "lodash";
import AlloV1Black from "common/src/icons/AlloV1Black";

const maxProgramsPerRow = 4;

Expand Down Expand Up @@ -67,19 +68,17 @@ function ListPrograms() {
className="rounded-full w-6 h-6 mr-2"
/>
</div>
<div className="-ml-28">
{program.tags?.includes("allo-v1") && (
// todo: add the icon for Allo
// <AlloV1 color="black" className="h-20 w-20 ml-12" />
<span>v1</span>
)}
</div>
{program.tags?.includes("allo-v1") && (
<div className="-ml-[9rem] 2xl:-ml-[5rem] mr-1">
<AlloV1Black/>
</div>
)}
<div
className="text-gray-500 font-normal ml-auto"
data-testid="program-card"
>
View details{" "}
<ArrowNarrowRightIcon className="h-5 w-5 inline ml-1" />
<ArrowNarrowRightIcon className="h-5 w-5 inline ml-1 mb-1" />
</div>
</>
}
Expand All @@ -89,94 +88,98 @@ function ListPrograms() {
});

return (
<div className="bg-grey-50">
{fetchProgramsStatus === ProgressStatus.IN_PROGRESS && (
<Spinner text="We're fetching your Programs." />
)}
{/* todo: remove when ready */}
{version === "allo-v1" && (
<div className="bg-[#D3EDFE] py-4 text-center font-medium flex flex-col items-center justify-center">
<div>
<ExclamationCircleIcon className="h-5 w-5 inline-block mr-2" />
You are currently on Allo v1. To switch to the most current version
of Manager,&nbsp;
<button
type="button"
className="underline"
onClick={(e) => {
e.preventDefault();
switchToVersion("allo-v2");
}}
>
switch to Allo v2.
</button>
&nbsp;
</div>
<div>
Click&nbsp;
<a
href="https://gitcoin.notion.site/Navigating-the-Transition-to-Allo-v2-A-Guide-for-Grants-Managers-63e2bdddccb94792af83fdffb1530b85?pvs=74"
rel="noreferrer"
className="underline"
target="_blank"
>
here
</a>
&nbsp;to learn more about Allo v2.
</div>
</div>
)}
{/* {version === "allo-v2" && ()} */}
<main className="container px-8 max-h-full">
<div className="flex flex-col mb-6">
<div className="flex flex-col md:flex-row items-center justify-between pt-2 md:pt-8">
<div className="flex flex-row items-center justify-start mb-2">
<span className="text-2xl font-medium text-gray-500 antialiased">
Programs
</span>
<span
className="ml-8 mt-1 text-xs font-mono hover:cursor-pointer"
onClick={() => {
setViewAllPrograms(!viewAllPrograms);
<main className="container max-h-full">
<div className="bg-grey-50 w-full">
{fetchProgramsStatus === ProgressStatus.IN_PROGRESS && (
<Spinner text="We're fetching your Programs." />
)}
{/* todo: remove when ready */}
{version === "allo-v1" && (
<div className="bg-[#D3EDFE] py-4 text-center font-medium flex flex-col items-center justify-center">
<div>
<ExclamationCircleIcon className="h-5 w-5 inline-block mr-2" />
You are currently on Allo v1. To switch to the most current version
of Manager,&nbsp;
<button
type="button"
className="underline"
onClick={(e) => {
e.preventDefault();
switchToVersion("allo-v2");
}}
>
{viewAllPrograms ? "View less" : "View all"}
</span>
switch to Allo v2.
</button>
&nbsp;
</div>
<div className="flex flex-row items-center justify-end mr-8 lg:mr-2">
<Link to="/program/create">
<span className="flex flex-row items-center justify-between p-2 bg-white hover:border-gray-200 border border-transparent rounded-lg text-xs font-mono font-medium hover:cursor-pointer">
<PlusIcon className="h-5 w-5 inline mr-2" />
<span data-testid="create-round-small-link">
Create program
</span>
</span>
</Link>
<div>
Click&nbsp;
<a
href="https://gitcoin.notion.site/Navigating-the-Transition-to-Allo-v2-A-Guide-for-Grants-Managers-63e2bdddccb94792af83fdffb1530b85?pvs=74"
rel="noreferrer"
className="underline"
target="_blank"
>
here
</a>
&nbsp;to learn more about Allo v2.
</div>
</div>
</div>
<div className="w-full overflow-hidden">
{isSuccess && hasNoPrograms() && startAProgramCard}
{chunk(
viewAllPrograms
? ProgramList
: ProgramList.slice(0, maxProgramsPerRow * 2),
maxProgramsPerRow
).map((programsChunk, rowIndex) => (
<div
key={rowIndex}
className={`flex flex-row flex-wrap w-full items-center ${rowIndex < 2 ? "justify-between" : "justify-start"}`}
>
{programsChunk.map((program, index) => (
<div key={index} className="w-full md:w-auto">
{program}
)}
<main className="max-w-screen-2xl mx-auto px-8 max-h-full">
{/* {version === "allo-v2" && ()} */}
{isSuccess &&
<div className="flex flex-col mb-6">
<div className="flex flex-col md:flex-row items-center justify-between pt-2 md:pt-8">
<div className="flex flex-row items-center justify-start mb-2">
<span className="text-2xl font-medium text-gray-500 antialiased">
Programs
</span>
<span
className="ml-8 mt-1 text-xs font-mono hover:cursor-pointer"
onClick={() => {
setViewAllPrograms(!viewAllPrograms);
}}
>
{viewAllPrograms ? "View less" : "View all"}
</span>
</div>
))}
<div className="flex flex-row items-center justify-end">
<Link to="/program/create">
<span className="flex flex-row items-center justify-between p-2 bg-white hover:border-gray-200 border border-transparent rounded-lg text-xs font-mono font-medium hover:cursor-pointer">
<PlusIcon className="h-5 w-5 inline mr-2" />
<span data-testid="create-round-small-link">
Create program
</span>
</span>
</Link>
</div>
</div>
</div>
))}
</div>
</main>
</div>
}
<div className="w-full overflow-hidden">
{isSuccess && hasNoPrograms() && startAProgramCard}
{chunk(
viewAllPrograms
? ProgramList
: ProgramList.slice(0, maxProgramsPerRow * 2),
maxProgramsPerRow
).map((programsChunk, rowIndex) => (
<div
key={rowIndex}
className={`flex flex-row flex-wrap w-full items-center ${rowIndex < 2 ? "justify-between" : "justify-start"}`}
>
{programsChunk.map((program, index) => (
<div key={index} className="w-full md:w-auto">
{program}
</div>
))}
</div>
))}
</div>
</main>
</div>
</main>
);
}

Expand Down
4 changes: 2 additions & 2 deletions packages/round-manager/src/features/round/RoundCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import {
import { CardProps } from "../common/types";

export const RoundCard: React.FC<CardProps> = (props: CardProps) => (
<BasicCard className="border border-gray-200 w-full mb-8 rounded-xl md:h-[230px]">
<BasicCard className="border border-gray-200 w-full mb-8 rounded-xl md:h-[220px]">
<CardContent className="p-4 px-5">
<div className="flex flex-row items-center justify-between">
<div className="flex flex-col">
Expand Down Expand Up @@ -37,7 +37,7 @@ export const RoundCard: React.FC<CardProps> = (props: CardProps) => (
<div className="flex justify-end text-sm font-mono mt-16">
{/* todo: figure out the status display by dates */}
<span
className={`border-none p-1 px-2 rounded-full ${props.status && props.status.style}`}
className={`border-none p-1 px-3 rounded-full ${props.status && props.status.style}`}
>
{props.status && props.status.status}
</span>
Expand Down
Loading

0 comments on commit 7cedaec

Please sign in to comment.