8000 initial commit · Likhon-baRoy/HTML-CSS-Javascript@8bf1768 · GitHub
[go: up one dir, main page]
Skip to content

Commit 8bf1768

Browse files
Likhon-baRoyLikhon-baRoy
committed
initial commit
1 parent 491d0e0 commit 8bf1768

File tree

9 files changed

+678
-0
lines changed

9 files changed

+678
-0
lines changed

‎bangla/blue.html

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html lang="bn">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>আমার সোনার বাংলা</title>
6+
<link rel="stylesheet" type="text/css" href="../css/style.css">
7+
</head>
8+
<body>
9+
<h1 style="text-align: center;">আমাকে খুঁজোনা কেউ, আমি হারিয়েছি অজানায়।।</h1>
10+
<img src="../pix/god.jpg" class="center">
11+
<img src="../pix/poetry-icon.png">
12+
<a href="../index.html">Back to Home</a>
13+
</body>
14+
</html>

‎css/luke.css

Lines changed: 382 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,382 @@
1+
:root {
2+
3+
--bg: #ccc ;
4+
--fg: #222 ;
5+
--behind: #123 ;
6+
--h1: #008 ;
7+
--red: #400 ;
8+
--yellow: #440 ;
9+
--blue: #004 ;
10+
--link: #037 ;
11+
--linksec: #059 ;
12+
--border: #333 ;
13+
--box: #444 ;
14+
--lime: #070 ;
15+
16+
}
17+
dt {
18+
font-weight: bold ;
19+
}
20+
body {
21+
background: var(--behind) ;
22+
color: var(--fg) ;
23+
margin-bottom: 200px ;
24+
font-family: "Garamond", Georgia, serif, 'Noto Color Emoji', 'Apple Color Emoji', 'Segoe UI Emoji';
25+
}
26+
27+
aside {
28+
padding: 0 5em;
29+
font-style: italic;
30+
}
31+
32+
a:hover {
33+
color: var(--linksec) ;
34+
}
35+
36+
.lw, p img, li img, h1 img, h2 img, h3 img, h4 img, dt img, td img, button img {
37+
max-height: .8em;
38+
max-width: 1em;
39+
vertical-align: middle ;
40+
}
41+
42+
img { max-width: 90% ; }
43+
44+
main {
45+
max-width: 800px ;
46+
margin: auto ;
47+
}
48+
49+
main > article {
50+
background: tan ;
51+
background-image: url("/pix/bg.gif");
52+
margin-bottom: 0 ;
53+
padding: 1em ;
54+
border-color: #234 ;
55+
border-width: 1em 1em 1em 1em ;
56+
border-style: solid ;
57+
border-radius: 20px ;
58+
margin: auto ;
59+
}
60+
61+
.taglist {
62+
max-width: 400px ;
63+
margin: auto ;
64+
text-align: center ;
65+
margin-bottom: 1em ;
66+
}
67+
68+
header h1 {
69+
color: lightblue ;
70+
text-align: center ;
71+
font-size: xx-large ;
72+
font-family: "Fira Sans",sans ;
73+
}
74+
75+
h1,h2,h3,h4,h5,h6 {
76+
text-align: center ;
77+
}
78+
79+
.menuname {
80+
display: none ;
81+
}
82+
83+
.buttonlist {
84+
display: none ;
85+
position: absolute ;
86+
bottom: 1em ;
87+
}
88+
89+
footer {
90+
max-width: 400px ;
91+
background: tan ;
92+
background-image: url("/pix/bg.gif");
93+
margin-left: auto ;
94+
margin-right: auto ;
95+
margin-top: -16px ;
96+
text-align: center ;
97+
clear: both ;
98+
border-color: #234 ;
99+
border-width: 0 1em 1em 1em ;
100+
border-style: solid ;
101+
border-radius: 0 0 20px 20px ;
102+
}
103+
104+
#tag_crypto:before { content: '💰' ; }
105+
#tag_economics:before { content: "📈" ; }
106+
#tag_lifestyle:before { content: "👨‍👩‍👦" ; }
107+
#tag_language:before { content: "🗣️" ; }
108+
#tag_linux:before { content: "🐃" ; }
109+
#tag_personal:before { content: "😎" ; }
110+
#tag_philosophy:before { content: "🎓" ; }
111+
#tag_religion:before { content:"☦️" ; }
112+
#tag_science:before { content:"🥼" ; }
113+
#tag_software:before { content: "🖥️" ; }
114+
#tag_technology:before { content: "⚙️" ; }
115+
#tag_tutorial:before { content: "📖" ; }
116+
#tag_tradition:before { content: "📜" ; }
117+
#tag_updates:before { content: "🆕" ; }
118+
#tag_politics:before { content: "👑" ; }
119+
#tag_history:before { content: "⏳" ; }
120+
121+
122+
.menuactive li {
123+
background: #111 ;
124+
}
125+
126+
@media (min-width: 1200px) {
127+
.buttonlist {
128+
display: block ;
129+
}
130+
131+
.buttonlist img {
132+
max-height: inherit ;
133+
max-width: inherit ;
134+
vertical-align: middle ;
135+
}
136+
137+
138+
.resright, .profile{
139+
display: block ;
140+
float: right;
141+
padding: 10px ;
142+
clear: both ;
143+
max-width: 300px ;
144+
}
145+
.menuname {
146+
display: inline-block ;
147+
}
148+
149+
}
150+
151+
#tagcloud {
152+
clear: both ;
153+
padding: 0;
154+
border-radius: 10px ;
155+
text-align: center ;
156+
margin: 0 auto ;
157+
border: solid 1px ;
158+
border-style: dashed ;
159+
list-style: none ;
160+
}
161+
162+
#tagcloud li {
163+
display: inline-block ;
164+
}
165+
166+
#tagcloud a {
167+
display: block ;
168+
width: auto ;
169+
border-radius: 10px ;
170+
padding: .25em ;
171+
margin: 2px ;
172+
}
173+
174+
#tagcloud a:hover {
175+
box-shadow: 2px 2px 2px 2px black ;
176+
}
177+
178+
.titleimg {
179+
align: center ;
180+
}
181+
182+
.titleimg img {
183+
margin: auto ;
184+
max-width: 90% ;
185+
max-height: 400px ;
186+
display: block ;
187+
}
188+
189+
code {
190+
color: var(--lime) ;
191+
overflow-wrap: break-word ;
192+
font-size: 10pt ;
193+
}
194+
195+
.resright {
196+
margin: auto ;
197+
display: block ;
198+
text-align: center ;
199+
}
200+
201+
.resright img {
202+
max-height: 300px ;
203+
}
204+
205+
.profile {
206+
text-align: center ;
207+
max-height: 250px ;
208+
}
209+
.profile img {
210+
max-height: inherit ;
211+
border-radius: 50px ;
212+
}
213+
214+
figcaption {
215+
text-align: center ;
216+
display: block ;
217+
font-style: italic ;
218+
}
219+
220+
math {
221+
display: block ;
222+
text-align: center ;
223+
}
224+
225+
h1 { color: #000 ; }
226+
h2 { color: var(--yellow) ; }
227+
h3 { color: var(--red) ; }
228+
h4 { color: var(--blue) ; }
229+
230+
sup {
231+
vertical-align: top;
232+
font-size: 0.6em;
233+
}
234+
235+
a {
236+
color: var(--link) ;
237+
text-decoration: none ;
238+
}
239+
.qr { max-width: 150px ; padding: 10px }
240+
241+
242+
li .summary {
243+
display: none;
244+
}
245+
246+
li:hover .summary {
247+
display: block ;
248+
font-style: italic ;
249+
}
250+
251+
input, textarea {
252+
background: #222 ;
253+
color: white ;
254+
margin: auto ;
255+
border-color: #333 ;
256+
font-size: large ;
257+
}
258+
259+
260+
#name {
261+
max-width: 25em ;
262+
}
263+
#amount {
264+
max-width: 25em ;
265+
}
266+
#message {
267+
width: 100% ;
268+
}
269+
270+
form {
271+
margin: auto ;
272+
width: 30em ;
273+
}
274+
275+
pre {
276+
border-radius: 20px ;
277+
padding: 1em ;
278+
}
279+
280+
.loc {
281+
color: #777 ;
282+
display: none ;
283+
}
284+
285+
.mainmenucont {
286+
position: relative ;
287+
text-align: center ;
288+
height: 100px ;
289+
width: 100px ;
290+
display: inline-block ;
291+
292+
}
293+
294+
.menulink {
295+
text-decoration: none ;
296+
}
297+
298+
.mainmenucont:hover {
299+
background: darkmagenta ;
300+
border-radius: 20px ;
301+
}
302+
303+
.mainmenuimg {
304+
height: 100px ;
305+
width: 100px ;
306+
}
307+
308+
.mainmenutext {
309+
position: absolute ;
310+
top: 50% ;
311+
left: 50% ;
312+
transform: translate(-50%, -50%) ;
313+
font-size: 24px ;
314+
color: white ;
315+
text-shadow: 0px 0px 3px black ;
316+
}
317+
318+
.mainmenucont:hover .mainmenutext {
319+
color: var(--lime) ;
320+
}
321+
322+
.backforth {
323+
animation: bf .5s linear both infinite alternate ;
324+
position: absolute ;
325+
}
326+
327+
@keyframes bf{
328+
from{transform: translateX(.25em);}
329+
to{transform: translateX(0em);}
330+
}
331+
332+
time {
333+
font-family: monospace ;
334+
color: #333 ;
335+
}
336+
337+
.soy {
338+
animation: shake 2s ease-out;
339+
animation-iteration-count: infinite;
340+
text-align: center ;
341+
}
342+
343+
@keyframes shake {
344+
0% { transform: translate(1px, 1px) rotate(0deg); }
345+
10% { transform: translate(-1px, -2px) rotate(-1deg); }
346+
20% { transform: translate(-3px, 0px) rotate(1deg); }
347+
30% { transform: translate(3px, 2px) rotate(0deg); }
348+
40% { transform: translate(1px, -1px) rotate(1deg); }
349+
50% { transform: translate(-1px, 2px) rotate(-1deg); }
350+
60% { transform: translate(-3px, 1px) rotate(0deg); }
351+
70% { transform: translate(3px, 1px) rotate(-1deg); }
352+
80% { transform: translate(-1px, -1px) rotate(1deg); }
353+
90% { transform: translate(1px, 2px) rotate(0deg); }
354+
100% { transform: translate(1px, -2px) rotate(-1deg); }
355+
}
356+
357+
input, textarea {
358+
background: black ;
359+
}
360+
361+
.type_updates a, .type_updates {
362+
color: #000303 ;
363+
}
364+
365+
366+
/* For NEXTPREV.HTML */
367+
#prevart {
368+
float: left ;
369+
text-align: left ;
370+
}
371+
#nextart {
372+
float: right ;
373+
text-align: right ;
374+
}
375+
#nextart,#prevart {
376+
max-width: 33% ;
377+
}
378+
379+
blockquote {
380+
font-style: italic ;
381+
font-size: small ;
382+
}

0 commit comments

Comments
 (0)
0