fix faq in safari, add latest news

opentofu · Aug 31, 2023 · 2a60f9f · 2a60f9f
1 parent 8399795
commit 2a60f9f
Show file tree

Hide file tree

Showing 5 changed files with 72 additions and 4 deletions.
diff --git a/src/components/Accordion/Item.tsx b/src/components/Accordion/Item.tsx
@@ -25,7 +25,7 @@ const AccordionItem = ({ summary, open, children }: AccordionItemProps) => {
     >
       <summary
         onClick={handleItemClick}
-        className="py-6 px-6 group-open:pb-0 text-xl flex cursor-pointer flex-row items-center justify-between  font-medium marker:[font-size:0px]"
+        className="list-none py-6 px-6 group-open:pb-0 text-xl flex cursor-pointer flex-row items-center justify-between  font-medium marker:[font-size:0px]"
       >
         {summary}
         <svg

diff --git a/src/components/LatestNews/big-logo.svg b/src/components/LatestNews/big-logo.svg
diff --git a/src/components/LatestNews/index.tsx b/src/components/LatestNews/index.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+import Logo from "./big-logo.svg";
+
+export default function LatestNews() {
+  return (
+    <section className="text-[#F6F6F6] flex flex-col justify-center w-full py-10 md:py-20 px-6">
+      <div className="w-full max-w-3xl mx-auto">
+        <h3 className="text-center text-3xl md:text-5xl font-bold mb-6 md:mb-12">
+          Latest News
+        </h3>
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+          <div className="bg-dark2 w-full flex justify-center py-20 px-16">
+            <Logo />
+          </div>
+          <div className="flex flex-col gap-2">
+            <span className="text-[#A965FF] font-bold">Aug 25, 2023</span>
+            <h4 className="text-3xl font-bold text-[#E7E9EC]">
+              OpenTF Announces Fork of Terraform
+            </h4>
+            <p className="text-[#8590A2]">
+              Two weeks ago, HashiCorp announced they are changing the license
+              to all their core products, including Terraform, to the Business
+              Source License (BSL).
+            </p>
+            <a
+              className="border border-[#505661] md:self-start font-bold text-white h-12 px-6 flex items-center hover:no-underline"
+              href="https://opentf.org/announcement"
+            >
+              Read More
+            </a>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}
diff --git a/src/css/custom.css b/src/css/custom.css
@@ -12,8 +12,13 @@ html[data-theme="dark"] {
   --ifm-color-primary-light: #c698ff;
   --ifm-color-primary-lighter: #d0aaff;
   --ifm-color-primary-lightest: #efe2ff;
-  --ifm-background-color: #21252b;
-  --ifm-navbar-background-color: #2c3036;
+  --ifm-background-color: theme("colors.dark1");
+  --ifm-navbar-background-color: transparent;
+  --ifm-heading-font-family: theme("fontFamily.sans");
+}
+
+.list-none::-webkit-details-marker {
+  display: none;
 }
 
 .navbar {
@@ -22,7 +27,8 @@ html[data-theme="dark"] {
 }
 
 .navbar__logo {
-  height: 42px;
+  width: 123px;
+  height: 48px;
 }
 
 .header-github-link::before {

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -3,13 +3,15 @@ import Layout from "@theme/Layout";
 import FAQ from "../components/FAQ";
 import HowToSupport from "../components/HowToSupport";
 import HowToContribute from "../components/HowToContribute";
+import LatestNews from "../components/LatestNews";
 
 export default function Home() {
   return (
     <Layout>
       <FAQ />
       <HowToSupport />
       <HowToContribute />
+      <LatestNews />
     </Layout>
   );
 }