Skip to content

Commit dd563bd

Browse files
committed
fix the responsiveness and theme UI for leaderBoard
1 parent 7e17129 commit dd563bd

File tree

2 files changed

+65
-5
lines changed

2 files changed

+65
-5
lines changed

about.html

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@
5050
}
5151

5252
.navbar-right-links {
53-
display: none;
53+
display: none !important;
5454
position: absolute;
5555
top: 70px; /* adjust depending on navbar height */
5656
right: 10px;
@@ -68,7 +68,7 @@
6868
}
6969

7070
.navbar-right-links.show {
71-
display: flex;
71+
display: flex !important;
7272
}
7373

7474
.nav-item {
@@ -1347,7 +1347,11 @@ <h4>Connect</h4>
13471347
<script>
13481348
function toggleMenu() {
13491349
const nav = document.querySelector(".navbar-right-links");
1350-
nav.classList.toggle("show");
1350+
if(nav.classList.contains("show")){
1351+
nav.classList.remove("show");
1352+
}else{
1353+
nav.classList.add("show");
1354+
}
13511355
}
13521356

13531357
// Dark mode functionality

css/about.css

Lines changed: 58 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -178,12 +178,19 @@ body {
178178
font-size: 1.5rem;
179179
}
180180
.contributions {
181-
background-color: #1a1c29;
182-
color: #00ff90;
181+
background: linear-gradient(135deg, var(--primary), var(--primary-dark));
182+
color: #fff;
183183
padding: 5px 10px;
184184
border-radius: 12px;
185185
font-weight: bold;
186186
text-align: center;
187+
transition: transform 0.25s ease ,box-shadow 0.25s ease;
188+
box-shadow: 0 4px 12px rgba(30, 33, 63, 0.05);
189+
}
190+
.contributions:hover{
191+
background: #1d4ed8;
192+
transform: translateY(-2px);
193+
box-shadow: 0 6px 14px rgba(99, 102, 241, 0.3);
187194
}
188195
.level {
189196
padding: 5px 10px;
@@ -196,3 +203,52 @@ body {
196203
text-decoration: none;
197204
font-size: 18px;
198205
}
206+
/* add responsive ness */
207+
@media (max-width: 900px) {
208+
.leaderboard{
209+
max-width: 700px;
210+
}
211+
th:nth-child(3),
212+
td:nth-child(3) {
213+
display: none; /* hide contributions count column for small screens */
214+
}
215+
}
216+
@media (max-width : 720px) {
217+
th:nth-child(5) ,td:nth-child(5){
218+
display: none;
219+
}
220+
.contributor-info img{
221+
width: 32px;
222+
height: 32px;
223+
}
224+
}
225+
@media (max-width : 606px) {
226+
.leaderboard{
227+
max-width: 200px;
228+
text-align: center;
229+
}
230+
th:nth-child(4) ,td:nth-child(4){
231+
display: none;
232+
}
233+
.contributor-info img{
234+
width: 30px;
235+
height: 30px;
236+
}
237+
}
238+
239+
@media (max-width : 467px) {
240+
.leaderboard{
241+
max-width: 150px;
242+
}
243+
.contributor-info .name{
244+
font-size: 1rem;
245+
}
246+
}
247+
@media (max-width:369px) {
248+
th:nth-child(1),td:nth-child(1){
249+
display: none;
250+
}
251+
.leaderboard{
252+
max-width: 100px;
253+
}
254+
}

0 commit comments

Comments
 (0)