🎨 Basics of open source section

awtkns · awtkns · commit a57f304716cd · 2023-07-03T01:20:15.000-07:00
diff --git a/next/src/components/PrimaryButton.tsx b/next/src/components/PrimaryButton.tsx
@@ -3,14 +3,18 @@ import clsx from "clsx";
 type PrimaryButtonProps = {
   children: string;
   onClick?: () => void;
+  outline?: boolean;
 };
-export default function PrimaryButton({ children, onClick }: PrimaryButtonProps) {
+export default function PrimaryButton({ children, onClick, outline }: PrimaryButtonProps) {
   return (
     <button
       type="button"
       className={clsx(
-        "text-md rounded-lg bg-[#BF7DFF] px-4 py-2.5 text-white shadow-sm ",
-        "transition-colors duration-300 hover:border-blue-200 hover:bg-[#9124ff] hover:text-zinc-200 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
+        "text-md rounded-lg px-4 py-2.5  shadow-sm ",
+        "transition-colors duration-300 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600",
+        outline
+          ? "text-[#BF7DFF]/90 ring-1 ring-[#BF7DFF] hover:bg-[#BF7DFF]/20"
+          : "bg-[#BF7DFF] text-white hover:border-blue-200 hover:bg-[#9124ff] hover:text-zinc-200 "
       )}
       onClick={onClick}
     >
diff --git a/next/src/components/landing/OpenSource.tsx b/next/src/components/landing/OpenSource.tsx
@@ -14,9 +14,9 @@ const OpenSource = () => {
   return (
     <div className="min-h-[50vh] w-full">
       <div className="flex flex-row">
-        <div className="relative w-full">
+        <div className="relative hidden w-full md:flex">
           <Terminal className="absolute" title="index.ts">
-            <pre className="overflow-hidden">
+            <pre className="overflow-x-hidden">
               {"" +
                 "<!DOCTYPE html>\n" +
                 "<html>\n" +
@@ -42,7 +42,7 @@ const OpenSource = () => {
             </pre>
           </Terminal>
           <Terminal className="absolute left-16 top-20 z-10" title="agent_service.py">
-            <pre>
+            <pre className="overflow-x-hidden">
               {"import requests\n" +
                 "\n" +
                 "# Define the API endpoint\n" +
@@ -74,9 +74,14 @@ const OpenSource = () => {
             community. This is why we are proudly open source. We'd love to hear your feedback at
             every step of the journey.
           </p>
-          <a href="https://github.com/reworkd" target="_blank" className="mt-16">
-            <PrimaryButton>View on Github</PrimaryButton>
-          </a>
+          <div className="mt-6 flex flex-row gap-4">
+            <a href="https://github.com/reworkd" target="_blank">
+              <PrimaryButton>View on Github</PrimaryButton>
+            </a>
+            <a href="https://github.com/orgs/reworkd/projects/3" target="_blank">
+              <PrimaryButton outline>Public Roadmap</PrimaryButton>
+            </a>
+          </div>
         </div>
       </div>
     </div>
@@ -86,7 +91,7 @@ const OpenSource = () => {
 const Terminal = (props: TerminalProps) => {
   return (
     <div
-      className={clsx("w-full max-w-md rounded-xl bg-neutral-800 drop-shadow-2xl", props.className)}
+      className={clsx("w-3/4 max-w-md rounded-xl bg-neutral-800 drop-shadow-2xl", props.className)}
     >
       <MacWindowInternal>{props.title}</MacWindowInternal>
       <div className="h-72 overflow-hidden rounded-b-xl bg-neutral-900 p-4 text-[8pt] text-gray-400">
