add flanksource as a member

Signed-off-by: Moshe Immerman <[email protected]>
open-gitops · Jul 27, 2021 · 09a5047 · 09a5047
1 parent 7d66054
commit 09a5047
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 10 deletions.
diff --git a/content/members/flanksource/flanksource.svg b/content/members/flanksource/flanksource.svg
diff --git a/content/members/flanksource/index.mdx b/content/members/flanksource/index.mdx
@@ -0,0 +1,5 @@
+---
+title: Flanksource
+site: https://www.flanksource.com
+logo: flanksource.svg
+---
diff --git a/src/components/featured-members.js b/src/components/featured-members.js
@@ -6,6 +6,7 @@ import Circle from "../svg/circle.svg"
 import Amazong from "../../content/members/amazon/amazon.svg"
 import Azure from "../../content/members/azure/azure.svg"
 import Codefresh from "../../content/members/codefresh/codefresh.svg"
+import Flanksource from "../../content/members/flanksource/flanksource.svg"
 import Github from "../../content/members/github/github.svg"
 import Redhat from "../../content/members/redhat/redhat.svg"
 import Weaveworks from "../../content/members/weaveworks/weaveworks.svg"
@@ -38,7 +39,8 @@ const FeaturedMembers = ({ className }) => {
   const itemInnerClass =
     "aspect-w-1 aspect-h-1 flex justify-center items-center"
   const itemLogoClass = "m-auto h-auto w-4/6"
-  const itemClass = "absolute bg-white rounded-full shadow-xl"
+  const itemClass = "absolute bg-white rounded-full shadow-xl w-[20%] md:w-[18%] lg:w-[16%] 2xl:w-[14%]"
+
   const wrapperClass = classNames({
     "relative flex flex-wrap py-12": true,
     [className]: className,
@@ -50,43 +52,54 @@ const FeaturedMembers = ({ className }) => {
       <Circle className="absolute -top-44 left-[50%] h-auto w-[700px] lg:w-[800px] text-[#3d81f6] transform rotate-[150deg]" />
 
       <div className="relative py-28 w-full sm:py-40 md:py-48 lg:w-3/4 lg:py-52">
+
         <div
-          className={`${itemClass} animate-float w-[23%] lg:w-[19%] 2xl:w-[15%] top-[1%] left-0`}>
+          className={`${itemClass} animate-float  top-[1%] left-0`}>
           <div className={itemInnerClass}>
             <Codefresh className={itemLogoClass} />
           </div>
         </div>
 
         <div
-          className={`${itemClass} animate-float animate-delay-100 w-[22%] lg:w-[18%] 2xl:w-[14%] top-[15%] left-[32%] lg:left-[32%] `}>
+          className={`${itemClass} animate-float animate-delay-100  top-[5%] left-[50%] lg:left-[55%] `}>
           <div className={itemInnerClass}>
-            <Github className={itemLogoClass} />
+            <Azure className={itemLogoClass} />
           </div>
         </div>
 
+
         <div
-          className={`${itemClass} animate-float animate-delay-200 w-[27%] md:w-[26%] lg:w-[18%] 2xl:w-[16%] top-[10%] left-[60%] lg:left-[65%] `}>
+          className={`${itemClass} animate-float animate-delay-150 top-[50%] sm:top-[60%] left-[10%] lg:left-[11%] `}>
           <div className={itemInnerClass}>
-            <Azure className={itemLogoClass} />
+            <Redhat className={itemLogoClass} />
           </div>
         </div>
 
+
         <div
-          className={`${itemClass} animate-float w-[25%] lg:w-[17%] 2xl:w-[13%] top-[50%] sm:top-[60%] left-[10%] lg:left-[16%] `}>
+          className={`${itemClass} animate-float animate-delay-100 top-[15%] left-[25%] lg:left-[28%] `}>
           <div className={itemInnerClass}>
-            <Redhat className={itemLogoClass} />
+            <Github className={itemLogoClass} />
           </div>
         </div>
 
+
         <div
-          className={`${itemClass} animate-float animate-delay-250 w-[20%] lg:w-[19%] 2xl:w-[15%] top-[60%] left-[46%] lg:left-[50%] `}>
+          className={`${itemClass} animate-float animate-delay-150 top-[60%] left-[45%] lg:left-[42%] `}>
           <div className={itemInnerClass}>
             <Weaveworks className={itemLogoClass} />
           </div>
         </div>
 
         <div
-          className={`${itemClass} animate-float animate-delay-150 w-[22%] lg:w-[18%] 2xl:w-[14%] top-[60%] left-[77%] lg:left-[85%] `}>
+          className={`${itemClass} animate-float animate-delay-100 top-[60%] left-[70%] lg:left-[70%] `}>
+          <div className={itemInnerClass}>
+            <Flanksource className={`${itemLogoClass} top-2`} />
+          </div>
+        </div>
+
+        <div
+          className={`${itemClass} animate-float animate-delay-150 w-[22%] lg:w-[18%] 2xl:w-[14%] top-[10%] left-[77%] lg:left-[85%] `}>
           <div className={itemInnerClass}>
             <Amazong className={`${itemLogoClass} top-2`} />
           </div>