Skip to content

Commit 75f7b40

Browse files
vinayakgavariyavinayakgavariya
authored
Merge pull request #14 from Anupamgupt/main
fixed the css
2 parents 94325ea + 23fda2f commit 75f7b40

3 files changed

Lines changed: 261 additions & 13 deletions

File tree

‎dark.js‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,50 @@
11

2+
3+
let darkMode=false;
4+
var dark=document.getElementById("dark");
5+
var moon=document.getElementById("moon");
6+
var sun=document.getElementById("sun");
7+
var nav=document.getElementById("nav");
8+
var body=document.getElementById("body");
9+
var logo=document.getElementById("logo")
10+
11+
dark.addEventListener('click',handleCLick)
12+
13+
function handleCLick(){
14+
if(darkMode===false){
15+
darkMode=true;
16+
moon.style.visibility="hidden";
17+
sun.style.visibility="visible";
18+
dark.style.backgroundColor="white";
19+
logo.style.color="white";
20+
body.style.backgroundColor="rgb(40, 46, 65)"
21+
nav.style.backgroundColor="#28292e"
22+
// console.log(nav);
23+
}
24+
else{
25+
26+
darkMode=false;
27+
logo.style.color="black";
28+
dark.style.backgroundColor="#2e2f30";
29+
body.style.backgroundColor="#eee"
30+
sun.style.visibility="hidden";
31+
moon.style.visibility="visible";
32+
nav.style.backgroundColor="#dcdee6";
33+
34+
}
35+
36+
37+
// console.log(darkMode);
38+
}
39+
240
let darkMode = false;
341
var dark = document.getElementById("dark");
442
var moon = document.getElementById("moon");
543
var sun = document.getElementById("sun");
644
var nav = document.getElementById("nav");
745
var body = document.getElementById("body");
846

47+
948
dark.addEventListener('click', handleCLick)
1049

1150
function handleCLick() {

‎index.html‎

Lines changed: 149 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,11 @@
1111
<body id="body">
1212
<div class="navbar" id="nav">
1313
<div class="leftNav">
14+
15+
<h1 class="logo" id="logo"> Blue-Quote</h1>
16+
1417
<a href="#"><img class="logo" src="assets/blueQuote.svg" /></a>
18+
1519
</div>
1620
<div class="right">
1721
<div class="box" id="dark">
@@ -26,6 +30,65 @@ <h4 class="light-text">Light Mode</h4>
2630
</div>
2731
</div>
2832
</div>
33+
34+
<div class="main">
35+
<h1 class="title">Blue-Quote</h1>
36+
37+
<h3 class="subtitle">The quotes which can blue your mind.</h3>
38+
39+
</div>
40+
41+
<div class="grid">
42+
<div class="grid-item">
43+
<div class="card">
44+
<div class="img-cont">
45+
<img class="card-img" src="https://imageproxy.ifunny.co/crop:x-20,resize:640x,quality:90x75/images/519280f60d8d843822f7b2ae99729ecf65a15e4c70e63c720e5869ab26142725_1.jpg" alt="Rome" />
46+
</div>
47+
48+
<div class="card-content">
49+
<h1 class="card-header">🏹</h1>
50+
<p class="card-text">
51+
When you focus on you YOU grow. When you focus on shit SHIT grows
52+
</p>
53+
<h3>by anonymous</h3>
54+
<button class="card-btn">Click Here</button>
55+
</div>
56+
</div>
57+
</div>
58+
<div class="grid-item">
59+
<div class="card">
60+
<div class="img-cont">
61+
<img
62+
class="card-img"
63+
src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg"
64+
alt="Grand Canyon"
65+
/>
66+
</div>
67+
68+
<div class="card-content">
69+
<h1 class="card-header">👀</h1>
70+
<p class="card-text">
71+
Just Do It.
72+
</p>
73+
<h3>not by pious</h3>
74+
<button class="card-btn">Click Here</button>
75+
</div>
76+
</div>
77+
</div>
78+
<div class="grid-item">
79+
<div class="card">
80+
81+
<div class="img-cont">
82+
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
83+
</div>
84+
85+
<div class="card-content">
86+
<h1 class="card-header">💩</h1>
87+
<h1 class="card-header">👀( insert your fav emoji)</h1>
88+
<button class="card-btn">Life is shit if you don't flush.</button>
89+
90+
91+
2992
<div class="container">
3093
<!-- <div class="main">
3194
<h1 class="title">blueQuote</h1>
@@ -81,6 +144,7 @@ <h1 class="card-header">💩</h1>
81144
<h3>Gaurav Kumar</h3>
82145
<button class="card-btn">Click Here</button>
83146
</div>
147+
84148
</div>
85149
</div>
86150
<div class="grid-item">
@@ -101,11 +165,17 @@ <h3>by Shubham Yadav</h3>
101165
</div>
102166
<div class="grid-item">
103167
<div class="card">
104-
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
168+
<div class="img-cont">
169+
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
170+
</div>
171+
105172
<div class="card-content">
106173

107174
<h1 class="card-header">💪</h1>
108175
<p class="card-text">
176+
177+
No man has the right to be an amateur of physical training.
178+
109179
No man has the right to be an amateur in the matter of physical training. It is a shame for a man to grow old without seeing the beauty and strength of which his body is capable.
110180
</p>
111181
<h3>Shobhit Nagpal</h3>
@@ -117,12 +187,89 @@ <h3>Nistha Jain</h3>
117187
<h1 class="card-header">&#10024; my favourite emoji</h1>
118188
<p class="card-text">
119189
Sparkle like Bappi lahiri
190+
120191
</p>
192+
121193
<h3>Srishti Majumder</h3>
122194

123195
<button class="card-btn">Click Here</button>
124196
</div>
125197
</div>
198+
199+
</div>
200+
<div class="grid-item">
201+
<div class="card">
202+
<div class="img-cont">
203+
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
204+
</div>
205+
206+
<div class="card-content">
207+
<h1 class="card-header">👀( insert your fav emoji)</h1>
208+
<p class="card-text">
209+
When you focus on you YOU grow. When you focus on shit SHIT grows
210+
</p>
211+
<h3>by insert your name here</h3>
212+
<button class="card-btn">Click Here</button>
213+
</div>
214+
</div>
215+
</div>
216+
<div class="grid-item">
217+
<div class="card">
218+
<div class="img-cont">
219+
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
220+
</div>
221+
222+
<div class="card-content">
223+
<h1 class="card-header">👀( insert your fav emoji)</h1>
224+
<p class="card-text">
225+
When you focus on you YOU grow. When you focus on shit SHIT grows
226+
</p>
227+
<h3>by insert your name here</h3>
228+
<button class="card-btn">Click Here</button>
229+
</div>
230+
</div>
231+
</div>
232+
<div class="grid-item">
233+
<div class="card">
234+
<div class="img-cont">
235+
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
236+
</div>
237+
238+
<div class="card-content">
239+
<h1 class="card-header">👀( insert your fav emoji)</h1>
240+
<p class="card-text">
241+
When you focus on you YOU grow. When you focus on shit SHIT grows
242+
</p>
243+
<h3>by insert your name here</h3>
244+
<button class="card-btn">Click Here</button>
245+
</div>
246+
</div>
247+
</div>
248+
<div class="grid-item">
249+
<div class="card">
250+
<div class="img-cont">
251+
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
252+
</div>
253+
254+
<div class="card-content">
255+
<h1 class="card-header">👀( insert your fav emoji)</h1>
256+
<p class="card-text">
257+
When you focus on you YOU grow. When you focus on shit SHIT grows
258+
</p>
259+
<h3>by insert your name here</h3>
260+
<button class="card-btn">Click Here</button>
261+
</div>
262+
</div>
263+
</div>
264+
<div class="grid-item">
265+
<div class="card">
266+
<div class="img-cont">
267+
<img class="card-img" src="https://www.adweek.com/wp-content/uploads/files/blogs/just-do-it-hed-2013.jpg" alt="Maldives" />
268+
</div>
269+
270+
<div class="card-content">
271+
<h1 class="card-header">👀( insert your fav emoji)</h1>
272+
126273
<div class="grid-item">
127274
<div class="card">
128275
<img
@@ -204,6 +351,7 @@ <h3>by insert your name here</h3>
204351
/>
205352
<div class="card-content">
206353
<h1 class="card-header">👀( insert your fav emoji)</h1>
354+
207355
<p class="card-text">
208356
When you focus on you YOU grow. When you focus on shit SHIT
209357
grows

0 commit comments

Comments
 (0)