web3privacy/web
1
0
Fork 0
mirror of https://github.com/web3privacy/web synced 2024-10-15 18:26:27 +02:00
Code Issues Projects Releases Packages Wiki Activity

Pier's Edits along with Minor Improvements

Browse source
This commit is contained in:
NoobDeveloper412 2024-09-19 23:01:31 +05:00
parent 4d7ead656c
commit acc1e3cf56
7 changed files with 59 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/AboutFooter.astro
View file

@ -121,7 +121,7 @@ const sortedSections = sectionsConfig
> >
<img <img
src={contrib.avatar_url} src={contrib.avatar_url}
class="w-14 rounded-full aspect-square" class="w-6 md:w-14 rounded-full aspect-square"
/> />
</a> </a>
</div> </div>

20
src/components/EventMasonry.astro
View file

@ -14,12 +14,14 @@ const {
} = Astro.props; } = Astro.props;
--- ---
<div class="middle-pane-big flex flex-wrap lg:flex-nowrap gap-[3px]"> <div
class="middle-pane-big grid grid-cols-2 lg:flex lg:flex-nowrap gap-2 md:gap-[3px]"
>
{ {
images.slice(0, 4).map((image, index) => ( images.slice(0, 4).map((image, index) => (
<div class="flex-auto overflow-hidden" key={index}> <div class="flex-auto overflow-hidden">
<img <img
class="object-cover w-full max-h-[223px] cursor-pointer gallery-image" class="object-cover w-full max-h-28 md:max-h-[223px] cursor-pointer gallery-image"
src={image} src={image}
alt={`Image ${index + 1}`} alt={`Image ${index + 1}`}
data-index={index} data-index={index}
@ -29,12 +31,14 @@ const {
} }
</div> </div>
<div class="middle-pane-big flex flex-wrap lg:flex-nowrap gap-[3px]"> <div
class="middle-pane-big grid grid-cols-2 lg:flex lg:flex-nowrap gap-2 md:gap-[3px]"
>
{ {
images.slice(4).map((image, index) => ( images.slice(4).map((image, index) => (
<div class="flex-auto overflow-hidden" key={index + 4}> <div class="flex-auto overflow-hidden">
<img <img
class="object-cover w-full max-h-[223px] cursor-pointer gallery-image" class="object-cover w-full max-h-28 md:max-h-[223px] cursor-pointer gallery-image"
src={image} src={image}
alt={`Image ${index + 5}`} alt={`Image ${index + 5}`}
data-index={index + 4} data-index={index + 4}
@ -49,8 +53,7 @@ const {
> >
<div class="relative modal-content"> <div class="relative modal-content">
<button class="absolute top-6 right-0 text-white close-modal z-100" <button class="absolute top-6 right-0 text-white close-modal z-100"
></button ></button>
>
</div> </div>
<div class="flex flex-col" style="width: 54vw; height: 60vh;"> <div class="flex flex-col" style="width: 54vw; height: 60vh;">
<img <img
@ -64,7 +67,6 @@ const {
{ {
images.map((image, index) => ( images.map((image, index) => (
<img <img
key={index}
class="w-24 h-24 object-contain cursor-pointer thumbnail-image" class="w-24 h-24 object-contain cursor-pointer thumbnail-image"
src={image} src={image}
alt={`Thumbnail ${index + 1}`} alt={`Thumbnail ${index + 1}`}

51
src/components/MembersGrid.astro
View file

@ -86,42 +86,51 @@ let filteredPeople = [
const limitedPeople = filteredPeople.slice(0, 12); const limitedPeople = filteredPeople.slice(0, 12);
function personLink(person) { function personLink(person) {
return person.refs?.twitter if (person.refs?.twitter) {
? `https://twitter.com/${person.refs.twitter}` return `https://twitter.com/${person.refs.twitter}`;
: person.refs?.bsky } else if (person.refs?.bsky) {
? `https://bsky.app/profile/${person.refs.bsky}` return `https://bsky.app/profile/${person.refs.bsky}`;
: "#"; } else if (person.refs?.linkedin) {
return `https://www.linkedin.com/in/${person.refs.linkedin}`;
} else if (person.refs?.github) {
return `https://github.com/${person.refs.github}`;
} else if (person.refs?.matrix) {
return `https://matrix.to/#/${person.refs.matrix}`;
} else if (person.refs?.email) {
return `mailto:${person.refs.email}`;
} else {
return "#";
}
} }
function truncateCaption(caption) {
if (!caption) return "";
const words = caption.split(" ");
if (words.length > 10) {
return words.slice(0, 20).join(" ") + "...";
}
return caption;
}
--- ---
<div <div
class="grid place-items-center grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-6 gap-2" class="grid place-items-start grid-cols-3 lg:grid-cols-4 xl:grid-cols-6 gap-2"
> >
{ {
limitedPeople.map((person) => ( limitedPeople.map((person) => (
<div class=" max-w-xs w-full h-[340px] bg-transparent overflow-hidden p-1 space-y-1 mb-2"> <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)}> <a href={personLink(person)}>
<img <img
src={person.imageUrl} src={person.imageUrl}
alt={person.name} alt={person.name}
class="w-full h-48 object-cover filter grayscale" class="h-24 w-full md:h-48 object-cover object-center h-full grayscale"
/> />
</a> </a>
<div class=" flex items-center justify-center flex-col pt-8"> <div class="mt-4 flex items-center justify-center flex-col ">
<h3 class="text-lg font-bold">{person.name}</h3> <h3 class="text-xs md:text-lg font-bold leading-6">{person.name}</h3>
{person.refs && person.refs.twitter && ( {person.refs && (
<p class="text-sm text-gray-500">@{person.refs.twitter}</p> <p class="text-xs md:text-sm text-gray-500">
{person.refs.twitter && `@${person.refs.twitter}`}
{person.refs.bsky && ` | bsky: ${person.refs.bsky}`}
{person.refs.linkedin && ` | LinkedIn: ${person.refs.linkedin}`}
{person.refs.github && ` | GitHub: ${person.refs.github}`}
{person.refs.matrix && ` | Matrix: ${person.refs.matrix}`}
{person.refs.email && ` | Email: ${person.refs.email}`}
</p>
)} )}
{/* <p class="text-sm">{truncateCaption(person.caption)}</p> */}
</div> </div>
</div> </div>
)) ))

8
src/components/SpeakerGrid.astro
View file

@ -28,7 +28,7 @@ function personLink(person) {
--- ---
<div <div
class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-6 gap-4 place-items-center md:place-items-start" class="grid grid-cols-3 lg:grid-cols-4 xl:grid-cols-6 md:gap-4 place-items-start"
> >
{ {
filteredPeople.map((person) => ( filteredPeople.map((person) => (
@ -37,13 +37,13 @@ function personLink(person) {
<img <img
src={person.imageUrl} src={person.imageUrl}
alt={person.name} alt={person.name}
class="w-full h-48 object-cover" class="h-24 w-full md:h-48 object-cover object-center h-full"
/> />
</a> </a>
<div class="mt-4"> <div class="mt-4">
<h3 class="text-lg font-bold leading-6">{person.name}</h3> <h3 class="text-xs md:text-lg font-bold leading-6">{person.name}</h3>
{person.refs && ( {person.refs && (
<p class="text-sm text-gray-500"> <p class="text-xs text-gray-500">
{person.refs.twitter && `@${person.refs.twitter}`} {person.refs.twitter && `@${person.refs.twitter}`}
{person.refs.bsky && ` | bsky: ${person.refs.bsky}`} {person.refs.bsky && ` | bsky: ${person.refs.bsky}`}
{person.refs.linkedin && ` | LinkedIn: ${person.refs.linkedin}`} {person.refs.linkedin && ` | LinkedIn: ${person.refs.linkedin}`}

2
src/config.yaml
View file

@ -22,7 +22,7 @@ header:
link: news link: news
- name: Docs - name: Docs
link: docs link: docs
- name: Membership - name: Get Involved
link: membership link: membership
url: /membership url: /membership
#- name: Manifesto #- name: Manifesto

14
src/layouts/base.astro
View file

@ -151,10 +151,12 @@ function genHeading(str) {
banner && typeof banner !== "object" && ( banner && typeof banner !== "object" && (
<div class="w-full flex mt-20 sm:mt-32 middle-pane-medium"> <div class="w-full flex mt-20 sm:mt-32 middle-pane-medium">
<div> <div>
{/* <div class="w3pn-logo w-64 sm:w-72 lg:w-80 xl:w-96" /> */} <div class="w3pn-logo w-64 sm:w-72 lg:w-80 xl:w-96" />
<h1 class="glitch-text-interval text-6xl">
{/* <h1 class="glitch-text-interval text-6xl">
web3privacy summit #1 web3privacy summit #1
</h1> </h1> */}
<div class="text-left mt-10">{config.hero.text}</div> <div class="text-left mt-10">{config.hero.text}</div>
<div class="mt-6"> <div class="mt-6">
<a class="button" href="/about"> <a class="button" href="/about">
@ -172,7 +174,11 @@ function genHeading(str) {
<> <>
<div class="middle-pane-medium mt-8 sm:mt-14 sm:mb-8"> <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-[4px] sm:text-[8px] text-white">
<pre>{genHeading(title)}</pre> <pre>
<code class="font-mono layout-heading ">
{genHeading(title)}
</code>
</pre>
</div> </div>
<div class="flex items-center justify-center w-full text-center"> <div class="flex items-center justify-center w-full text-center">
<h3 class=" w-full max-w-[938px] glitch-text">{subtext}</h3> <h3 class=" w-full max-w-[938px] glitch-text">{subtext}</h3>

4
src/pages/membership/index.astro
View file

@ -50,14 +50,14 @@ const sectionsConfig = [
</p> </p>
</div> </div>
<div class="flex gap-3 flex-wrap mb-4 justify-start mx-4"> <div class="flex gap-3 flex-wrap mb-4 justify-center md:justify-start mx-4">
{ {
contributors.items.map((contrib) => ( contributors.items.map((contrib) => (
<div> <div>
<a href={contrib.html_url} target="_blank" title={contrib.login}> <a href={contrib.html_url} target="_blank" title={contrib.login}>
<img <img
src={contrib.avatar_url} src={contrib.avatar_url}
class="w-14 rounded-full aspect-square" class="w-6 md:w-14 rounded-full aspect-square"
/> />
</a> </a>
</div> </div>