Skip to content

Commit 6b7c0a1

Browse files
mkubdevmkubdev
committed
chore: fix various responsive issue for blog/collab + remove absolute circle not matching the wbesitedesign
1 parent 40440e7 commit 6b7c0a1

File tree

3 files changed

+26
-34
lines changed

3 files changed

+26
-34
lines changed

‎.prettierrc‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"trailingComma": "es5",
3+
"singleQuote": false,
4+
"jsxSingleQuote": false,
5+
"printWidth": 100,
6+
"tabWidth": 2,
7+
"semi": true,
8+
"endOfLine": "auto"
9+
}

‎src/pages/blog.js‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -23,16 +23,10 @@ const Blog = ({ data }) => {
2323
<h1 className="w-full my-2 text-4xl font-bold leading-tight text-center text-white">
2424
Blogs
2525
</h1>
26-
<div className="w-full mb-4">
27-
<div className="w-64 h-1 py-0 mx-auto my-0 rounded-t opacity-25 gradient"></div>
28-
</div>
2926
</div>
3027

31-
<div className="absolute top-40 -left-16 xl:w-96 xl:h-96 bg-gradient-to-t from-[#1BFFFF] to-[#2E3192] rounded-full"></div>
32-
<div className="absolute top-96 -right-80 xl:w-[50rem] xl:h-[50rem] bg-gradient-to-t from-[#FBB03B] to-[#D4145A] rounded-full"></div>
33-
3428
<section>
35-
<div className="relative flex grid flex-wrap items-center justify-center grid-cols-1 mx-0 sm:grid-cols-2 z-2 my-7">
29+
<div className="relative flex flex-wrap items-center justify-center grid-cols-1 mx-0 z-2 my-7">
3630
{data.map((curElem) => {
3731
return (
3832
<div
@@ -52,9 +46,7 @@ const Blog = ({ data }) => {
5246
<b>{curElem.title}</b>
5347
<br></br>
5448
<br></br>
55-
<spam className="text-xs font-light lowercase">
56-
{curElem.description}
57-
</spam>
49+
<spam className="text-xs font-light lowercase">{curElem.description}</spam>
5850
<a
5951
href={curElem.url}
6052
target="_blank"

‎src/pages/contributors.js‎

Lines changed: 15 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
import Head from "next/head";
22

33
export const getStaticProps = async () => {
4-
const res = await fetch(
5-
"https://api.github.com/repos/WebXDAO/webXDAO.github.io/contributors"
6-
);
4+
const res = await fetch("https://api.github.com/repos/WebXDAO/webXDAO.github.io/contributors");
75
const data = await res.json();
86

97
return {
@@ -19,43 +17,36 @@ const contributors = ({ data }) => {
1917
<Head>
2018
<title>Contributors | WebXDAO</title>
2119
</Head>
22-
<section>
23-
<div className="absolute top-40 -left-16 w-96 h-96 bg-gradient-to-t from-[#1BFFFF] to-[#2E3192] rounded-full"></div>
24-
<div className="absolute top-96 -right-80 w-[50rem] h-[50rem] bg-gradient-to-t from-[#FBB03B] to-[#D4145A] rounded-full"></div>
25-
<div className="absolute top-[70rem] -left-72 w-[40rem] h-[40rem] bg-gradient-to-t from-[#ED1E79] to-[#662D8C] rounded-full"></div>
26-
<div className="absolute top-[100rem] -right-16 w-96 h-96 bg-gradient-to-t from-[#FCEE21] to-[#009245] rounded-full"></div>
20+
<section className="py-8">
21+
<div className="container max-w-5xl mx-auto">
22+
<h1 className="w-full my-2 text-4xl font-bold leading-tight text-center text-white">
23+
Contributors
24+
</h1>
25+
</div>
2726
<div className="relative z-1 my-[40px] mx-0 flex justify-center items-center flex-wrap">
2827
{data.map((curElem) => {
2928
return (
3029
<div
31-
className="group relative w-48 h-64 m-5 flex justify-center items-center bg-white bg-opacity-5 m-10 shadow-2xl rounded-2xl backdrop-filter backdrop-blur-md"
30+
className="relative flex items-center justify-center w-48 h-64 m-5 m-10 bg-white shadow-2xl group bg-opacity-5 rounded-2xl backdrop-filter backdrop-blur-md"
3231
key={curElem.login}
3332
>
34-
<div className="relative flex justify-center items-center flex-col opacity-70 hover:opacity-100">
35-
<div className="relative w-40 h-40 overflow-hidden rounded-full truncate border-8 border-solid border-black/25 group-hover:-translate-y-6 duration-500">
36-
<a
37-
href={curElem.html_url}
38-
target="_blank"
39-
rel="noopener noreferrer"
40-
>
33+
<div className="relative flex flex-col items-center justify-center opacity-70 hover:opacity-100">
34+
<div className="relative w-40 h-40 overflow-hidden truncate duration-500 border-8 border-solid rounded-full border-black/25 group-hover:-translate-y-6">
35+
<a href={curElem.html_url} target="_blank" rel="noopener noreferrer">
4136
<img
4237
src={curElem.avatar_url}
4338
alt="Avatar"
44-
className="relative top-0 left-0 w-full h-full object-cover"
39+
className="relative top-0 left-0 object-cover w-full h-full"
4540
/>
4641
</a>
4742
</div>
48-
<div className="relative justify-center items-center relative justify-center items-center flex-wrap text-center mx-0 my-0">
49-
<a
50-
href={curElem.html_url}
51-
target="_blank"
52-
rel="noopener noreferrer"
53-
>
43+
<div className="relative flex-wrap items-center justify-center mx-0 my-0 text-center">
44+
<a href={curElem.html_url} target="_blank" rel="noopener noreferrer">
5445
<h3 className="group-hover:-translate-y-6 duration-500 text-white uppercase font-medium text-sm text-center tracking-wider mt-5 mr-2.5 ml-2.5 mb-2.5 leading-4">
5546
{curElem.login}
5647
</h3>
5748
</a>
58-
<h5 className="group-hover:-translate-y-6 duration-500 rounded-md bg-green-500 pl-4 pr-4 text-base font-normal mb-0 mt-0 m-auto w-fit h-fit">
49+
<h5 className="pl-4 pr-4 m-auto mt-0 mb-0 text-base font-normal duration-500 bg-green-500 rounded-md group-hover:-translate-y-6 w-fit h-fit">
5950
{curElem.contributions}
6051
<svg
6152
className="overflow-visible inline-block w-[1.25em] lowercase h-[1em] align-[-0.125em]"

0 commit comments

Comments
 (0)