Skip to content

Commit 9d1ab0e

Browse files
zonayedpcazonayedpca
committed
case problem fix
1 parent 11f3dde commit 9d1ab0e

11 files changed

Lines changed: 589 additions & 0 deletions

File tree

‎src/components/Footer.js‎

Lines changed: 171 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,171 @@
1+
import React from "react"
2+
import styled from "@emotion/styled"
3+
4+
import { Container, Curve, Section } from "./common"
5+
6+
const FooterContainer = styled.footer`
7+
background: var(--accentlight);
8+
text-align: center;
9+
@media print {
10+
visibility: hidden;
11+
}
12+
`
13+
14+
const FooterArea = styled.div`
15+
display: flex;
16+
justify-content: space-between;
17+
color: #fff;
18+
text-align: left;
19+
@media (max-width: 991px) {
20+
flex-wrap: wrap;
21+
}
22+
> div {
23+
flex: 1;
24+
@media (max-width: 480px) {
25+
flex: 1 1 100%;
26+
margin: 0;
27+
margin-bottom: 15px;
28+
text-align: center;
29+
ul {
30+
list-style: none;
31+
margin-left: 0 !important;
32+
}
33+
}
34+
margin: 0 15px;
35+
:nth-of-type(2n + 2) {
36+
@media (max-width: 991px) {
37+
margin-left: 0;
38+
}
39+
}
40+
:first-of-type {
41+
margin-left: 0;
42+
@media (max-width: 991px) {
43+
flex: 1 1 100%;
44+
margin-bottom: 15px;
45+
}
46+
}
47+
:last-of-type {
48+
margin-right: 0;
49+
}
50+
ul {
51+
margin-left: 20px;
52+
li {
53+
a {
54+
position: relative;
55+
color: #fff;
56+
text-decoration: none;
57+
:after {
58+
position: absolute;
59+
content: "";
60+
width: 100%;
61+
height: 2px;
62+
bottom: 3px;
63+
left: 0;
64+
background: #fff;
65+
}
66+
}
67+
}
68+
}
69+
}
70+
`
71+
72+
const Footer = () => (
73+
<FooterContainer>
74+
<Curve color="var(--accentdark)">
75+
<Container>
76+
<Section>
77+
<FooterArea>
78+
<div>
79+
<h3>ডেভসংকেত সম্পর্কে</h3>
80+
<p>
81+
ডেভসংকেত এর লক্ষ্য হচ্ছে বাংলাতে একটা বড় চিটশিটের ভান্ডার গড়ে
82+
তোলা। এটা সম্পূর্ণ স্বাধীন এবং ওপেন সোর্স গিটহাব অর্গানাইজেশন।
83+
</p>
84+
</div>
85+
<div>
86+
<h3>কমিউনিটি</h3>
87+
<ul>
88+
<li>
89+
<a
90+
target="__blank"
91+
rel="noopener noreferrer"
92+
href="https://www.facebook.com/devsonket"
93+
>
94+
ফেইসবুক পেইজ
95+
</a>
96+
</li>
97+
<li>
98+
<a
99+
target="__blank"
100+
rel="noopener noreferrer"
101+
href="https://www.facebook.com/groups/devsonket"
102+
>
103+
ফেইসবুক গ্রুপ
104+
</a>
105+
</li>
106+
<li>
107+
<a
108+
target="__blank"
109+
rel="noopener noreferrer"
110+
href="https://github.com/devsonket/devsonket.github.io"
111+
>
112+
গিটহাব প্রোজেক্ট
113+
</a>
114+
</li>
115+
<li>
116+
<a
117+
target="__blank"
118+
rel="noopener noreferrer"
119+
href="https://github.com/devsonket/devsonket.github.io/issues"
120+
>
121+
গিটহাব ইস্যু
122+
</a>
123+
</li>
124+
</ul>
125+
</div>
126+
<div>
127+
<h3>গুরুত্বপূর্ণ লিঙ্ক</h3>
128+
<ul>
129+
<li>
130+
<a
131+
target="__blank"
132+
rel="noopener noreferrer"
133+
href="https://medium.com/%E0%A6%AA%E0%A7%8D%E0%A6%B0%E0%A7%8B%E0%A6%97%E0%A7%8D%E0%A6%B0%E0%A6%BE%E0%A6%AE%E0%A6%BF%E0%A6%82-%E0%A6%AA%E0%A6%BE%E0%A6%A4%E0%A6%BE"
134+
>
135+
প্রোগ্রামিং পাতা
136+
</a>
137+
</li>
138+
<li>
139+
<a
140+
target="__blank"
141+
rel="noopener noreferrer"
142+
href="https://github.com/me-shaon/bangla-programming-resources"
143+
>
144+
বাংলায় প্রোগ্রামিং রিসোর্স
145+
</a>
146+
</li>
147+
</ul>
148+
</div>
149+
<div>
150+
<h3>স্পন্সর</h3>
151+
<ul>
152+
<li>
153+
ডোমেইন -{" "}
154+
<a
155+
target="__blank"
156+
rel="noopener noreferrer"
157+
href="https://github.com/NaSabbir"
158+
>
159+
Nazir Ahmed Sabbir
160+
</a>
161+
</li>
162+
</ul>
163+
</div>
164+
</FooterArea>
165+
</Section>
166+
</Container>
167+
</Curve>
168+
</FooterContainer>
169+
)
170+
171+
export default Footer

‎src/components/Header.js‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import React from "react"
2+
import styled from "@emotion/styled"
3+
import { FiPlus, FiEdit, FiStar } from "react-icons/fi"
4+
5+
import { Logo } from "./common"
6+
7+
const MenuList = styled.ul`
8+
display: flex;
9+
align-items: center;
10+
list-style: none;
11+
li {
12+
margin-left: 15px;
13+
font-weight: bolder;
14+
a {
15+
display: flex;
16+
align-items: center;
17+
text-decoration: none;
18+
color: ${props =>
19+
props.islightcolor === "true"
20+
? "var(--accentlight)"
21+
: "var(--accentdark)"};
22+
svg {
23+
margin-right: 5px;
24+
}
25+
@media (max-width: 480px) {
26+
span {
27+
display: none;
28+
}
29+
}
30+
}
31+
}
32+
`
33+
34+
const HeaderContainer = styled.div`
35+
display: flex;
36+
align-items: center;
37+
justify-content: space-between;
38+
padding: 25px 0;
39+
`
40+
41+
const Header = ({ children, colorpref, filename, islightcolor }) => (
42+
<HeaderContainer>
43+
<div>
44+
<Logo colorpref={colorpref} islightcolor={islightcolor} />
45+
</div>
46+
<MenuList islightcolor={islightcolor}>
47+
<li>
48+
{filename ? (
49+
<a
50+
target="__blank"
51+
rel="noopener noreferrer"
52+
href={`https://github.com/devsonket/devsonket.github.io/blob/develop/data/${filename}.json`}
53+
>
54+
<FiEdit /> <span>এডিট করুন</span>
55+
</a>
56+
) : (
57+
<a
58+
target="__blank"
59+
rel="noopener noreferrer"
60+
href="https://github.com/devsonket/devsonket.github.io#%E0%A6%95%E0%A6%BF%E0%A6%AD%E0%A6%BE%E0%A6%AC%E0%A7%87-%E0%A6%95%E0%A6%A8%E0%A7%8D%E0%A6%9F%E0%A7%8D%E0%A6%B0%E0%A6%BF%E0%A6%AC%E0%A6%BF%E0%A6%89%E0%A6%9F-%E0%A6%95%E0%A6%B0%E0%A6%AC%E0%A7%87%E0%A6%A8"
61+
>
62+
<FiPlus /> <span>কন্ট্রিবিউট করুন</span>
63+
</a>
64+
)}
65+
</li>
66+
<li>
67+
<a
68+
target="__blank"
69+
rel="noopener noreferrer"
70+
href="https://github.com/devsonket/devsonket.github.io"
71+
>
72+
<FiStar /> <span>স্টার দিন</span>
73+
</a>
74+
</li>
75+
</MenuList>
76+
</HeaderContainer>
77+
)
78+
79+
export default Header

‎src/components/common/Card.js‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import React from "react"
2+
import { Link } from "gatsby"
3+
import styled from "@emotion/styled"
4+
5+
const CardContainer = styled.div`
6+
position: relative;
7+
margin-bottom: 15px;
8+
h4 {
9+
font-size: 20px;
10+
margin-bottom: 0;
11+
line-height: 24px;
12+
}
13+
p {
14+
margin-bottom: 0;
15+
opacity: 0.85;
16+
}
17+
span {
18+
position: absolute;
19+
top: 25px;
20+
right: 20px;
21+
height: 10px;
22+
width: 10px;
23+
border-radius: 100%;
24+
}
25+
a {
26+
text-decoration: none;
27+
display: block;
28+
padding: 20px 25px;
29+
line-height: 24px;
30+
background: #fff;
31+
color: var(--sub-headline);
32+
border-radius: 8px;
33+
box-shadow: rgba(0, 0, 0, 0.03) 0px 6px 8px, rgba(0, 0, 0, 0.3) 0px 1px 2px;
34+
}
35+
`
36+
37+
export const Card = ({ id, title, description, colorPref }) => (
38+
<CardContainer key={id}>
39+
<Link to={`/${id}`}>
40+
<h4>{title}</h4>
41+
{description && (
42+
<>
43+
<p>
44+
{String(description)
45+
.substr(0, 33)
46+
.trim()}
47+
...
48+
</p>
49+
<span style={{ backgroundColor: colorPref }} />
50+
</>
51+
)}
52+
</Link>
53+
</CardContainer>
54+
)

‎src/components/common/Container.js‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import React from "react"
2+
import styled from "@emotion/styled"
3+
4+
const ContainerContainer = styled.div`
5+
margin: 0 auto;
6+
padding: 0 25px;
7+
max-width: 1260px;
8+
@media (min-width: 480px) {
9+
padding: 0 25px;
10+
}
11+
`
12+
13+
const Container = ({ children }) => {
14+
return <ContainerContainer>{children}</ContainerContainer>
15+
}
16+
17+
export { Container }

‎src/components/common/Curve.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from "react"
2+
import styled from "@emotion/styled"
3+
4+
const CurveContainer = styled.div`
5+
background: ${props => props.color};
6+
border-radius: 30px;
7+
border-bottom-left-radius: 0;
8+
border-bottom-right-radius: 0;
9+
`
10+
11+
const Curve = ({ children, color }) => {
12+
return <CurveContainer color={color}>{children}</CurveContainer>
13+
}
14+
15+
Curve.defaultProps = {
16+
color: "#fff",
17+
}
18+
19+
export { Curve }

‎src/components/common/Description.js‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import React from "react"
2+
import styled from "@emotion/styled"
3+
4+
const DescriptionContainer = styled.div`
5+
text-align: center;
6+
h1 {
7+
margin: 0;
8+
font-size: 72px;
9+
color: ${props =>
10+
props.islightcolor === "true"
11+
? `var(--accentwhite)`
12+
: `var(--accentdark)`};
13+
}
14+
p {
15+
font-size: 22px;
16+
color: ${props =>
17+
props.islightcolor === "true"
18+
? `var(--accentwhite)`
19+
: `var(--accentdark)`};
20+
}
21+
`
22+
23+
const Description = ({ title, description, islightcolor }) => {
24+
return (
25+
<DescriptionContainer islightcolor={islightcolor}>
26+
<h1>{title}</h1>
27+
<p>{description}</p>
28+
</DescriptionContainer>
29+
)
30+
}
31+
32+
export { Description }

0 commit comments

Comments
 (0)