Merge pull request #45 from web3privacy/pages-redesign

Pages redesign

src/components/AboutFooter.astro

@@ -104,7 +104,8 @@ const sortedSections = sectionsConfig
           <SpeakerGrid
             people={core.people}
             team={core.teams["core-contributors"]}
-            core={false}
+            core={true}
+            contributors={true}
           />
         </div>
       )}
@@ -149,7 +150,7 @@ const sortedSections = sectionsConfig
         <div class="mx-4 mt-16">
           <h1 class="my-6 middle-pane-medium glitch-text">Members</h1>
           <div class="middle-pane-medium">
-            <MembersGrid people={core.people} team={core.teams["members"]} core={false} />
+            <MembersGrid people={core.people} team={core.members} core={false} />
           </div>
         </div>
       )}

src/components/SpeakerGrid.astro

@@ -1,7 +1,7 @@
 ---
 import { parseAndWrapCaptions } from "../../utils/captionParser";
 
-const { people, team, core } = Astro.props;
+const { people, team, core, contributors } = Astro.props;
 
 // Filter based on the `core` parameter
 const members = core ? people.filter((p) => {
@@ -40,7 +40,7 @@ function personLink(person) {
       <div
         class={`max-w-xs w-full  max-h-[340px] bg-transparent overflow-hidden p-1 space-y-1 mb-2`}
       >
-        <a href={personLink(person)} class={`${core ? "person-item" : ""}`}>
+        <a href={personLink(person)} class={`${core ? "person-item" : ""}`} target="_blank">
           <img
             src={person.imageUrl}
             alt={person.name}
@@ -50,7 +50,7 @@ function personLink(person) {
         <div class="mt-4">
           <h3 class="text-[10px] pt-2 font-bold leading-3 md:leading-9 md:text-[16px] ">{person.name}</h3>
         
-          {person.refs && (
+          {!contributors ? person.refs && (
             <p class="text-xs text-gray-500">
               {person.refs.twitter && `@${person.refs.twitter}`}
               {person.refs.email && ` | Email: ${person.refs.email}`}
@@ -60,14 +60,13 @@ function personLink(person) {
               {person.refs.matrix && ` | Matrix: ${person.refs.matrix}`}
               {person.refs.email && ` | Email: ${person.refs.email}`}
             </p>
-       <p class="text-xs text-gray-500" set:html={person.caption && parseAndWrapCaptions(person.caption)}></p>
+            <p class="text-xs text-gray-500" set:html={person.caption && parseAndWrapCaptions(person.caption)}></p>
-
-
             <p class="text-xs text-gray-500">
               {person.refs.designation && `${person.refs.designation}`}
 
             </p>
-          )}
+          ) : 
+          <p class="text-xs text-gray-500" set:html={person.caption && parseAndWrapCaptions(person.caption)}></p>}
         </div>
       </div>
     ))

src/layouts/base.astro

@@ -172,9 +172,9 @@ function genHeading(str) {
         !banner && (
           <>
             <div class="middle-pane-medium mt-8  sm:mt-14 sm:mb-8">
-              <div class="leading-none flex justify-center mb-3 text-[4px] sm:text-[8px] text-white">
+              <div class="leading-none flex justify-center mb-3 text-[3.5px] sm:text-[8px] text-white">
                 <pre>
-                  <code class="font-mono layout-heading  ">
+                  <code class="font-mono layout-heading">
                     {genHeading(title)}
                   </code>
                 </pre>

src/pages/about.astro

@@ -65,7 +65,7 @@ for (const e of upcomingEvents) {
   subimage="/about/about.png"
   subtext="We are a think-and-do tank of hundreds of people, projects, and organizations committed to protecting and advancing civil liberties, decentralization, and open-source software."
 >
-  <div class="middle-pane-medium mt-10">th
+  <div class="middle-pane-medium mt-10">
     <div class="grid grid-cols-1 xl:grid-cols-2 gap-16 mb-[82px]">
       <div class="flex flex-col gap-[36px] md:order-2">
         <div class="md:hidden block mb-[12px]">

src/pages/membership/index.astro

@@ -86,7 +86,7 @@ const sectionsConfig = [
     <div class="middle-pane-big">
       <MembersGrid
         people={core.people}
-        team={core.teams["members"]}
+        team={core.members}
         core={false}
       />
     </div>
@@ -147,7 +147,7 @@ const sectionsConfig = [
     <div class="middle-pane-big">
       <MembersGrid
         people={core.people}
-        team={core.teams["community-partners"]}
+        team={core["community-partners"]}
       />
     </div>
   </div>