Skip to content

Commit 25f6174

Browse files
mdazfar2mdazfar2
authored
Merge pull request #399 from dhairyagothi/main
Fixed Height and Width of boxes in mobile view #394
2 parents dee93c1 + cbe177b commit 25f6174

2 files changed

Lines changed: 64 additions & 15 deletions

File tree

‎website2.0/resources.css‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -120,4 +120,17 @@ input:checked + .switch:before {
120120
align-items: center;
121121
flex-direction: column;
122122
margin-top: 5rem;
123-
}
123+
}
124+
125+
@media (max-width: 768px) {
126+
.folder-card {
127+
flex: 0 0 calc(50% - 120px); /* Two cards per row (adjust margin as needed) */
128+
}
129+
}
130+
131+
@media (max-width: 576px) {
132+
.folder-card {
133+
flex: 0 0 calc(100% - 120px); /* One card per row (adjust margin as needed) */
134+
}
135+
}
136+

‎website2.0/resources.html‎

Lines changed: 50 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -22,35 +22,61 @@
2222
align-items: center;
2323
justify-content: center;
2424
/* height: 100vh; */
25+
}
26+
.hamburger div {
27+
width: 25px;
28+
height: 3px;
29+
background-color: #333;
30+
margin: 4px;
31+
transition: 0.4s;
32+
}
33+
@media only screen and (max-width:200px) {
34+
.sponsor-btn{
35+
font-size: 12px !important;
36+
width: 90px !important;
37+
height: 46px !important;
38+
}
39+
.star-button{
40+
font-size: 12px !important;
41+
width: 90px !important;
42+
}
2543
}
2644
</style>
2745
</head>
2846
<body>
2947
<header>
3048
<nav>
3149
<a href="index.html">
32-
<div class="logo">
33-
<img src="HelpOps-H Fevicon.png" alt="Logo">
34-
</div>
35-
</a>
50+
<div class="logo" data-tilt data-tilt-scale="1.1">
51+
<img src="HelpOps-H Fevicon.png" alt="Logo">
52+
</div>
53+
</a>
3654
<ul class="nav-links">
3755
<li><a href="index.html">Home</a></li>
3856
<li><a href="abouts.html">About</a></li>
3957
<li><a href="contributor.html">Team</a></li>
4058
<li><a href="contactus.html">Contact</a></li>
4159
</ul>
42-
<!-- <div id="search"><i class="fa fa-search"></i></div> -->
43-
<div class="toggle-switch">
44-
<div id="search"><i class="fa fa-search"></i></div>
45-
<input type="checkbox" id="toggle" />
46-
<label for="toggle" class="switch"></label>
47-
</div>
48-
49-
<!-- <div class="nav-actions">
50-
<button class="sponsor-btn">Sponsor <i id="heart" class="fas fa-heart"></i></button>
51-
</div> -->
60+
61+
<div class="nav-actions">
62+
<a href="https://github.com/sponsors/mdazfar2">
63+
<button class="sponsor-btn">Sponsor <i id="heart" class="fas fa-heart"></i></button>
64+
</a>
65+
</div>
66+
<div class="hamburger" id="hamburger">
67+
<div></div>
68+
<div></div>
69+
<div></div>
70+
</div>
5271
</nav>
5372
</header>
73+
<ul class="nav-links1" id="navlinks1">
74+
<li><a href="index.html">Home</a></li>
75+
<li><a href="abouts.html">About</a></li>
76+
<li><a href="contributor.html">Team</a></li>
77+
<li><a href="contactus.html">Contact</a></li>
78+
79+
</ul>
5480
<div class="heading"><h1>Resources</h1></div>
5581
<div id="maincontainer">
5682
<div id="loading">
@@ -83,5 +109,15 @@
83109
<p class="font h mm" >Developed by <a href="https://github.com/mdazfar2" target="_blank" class="font">Azfar Alam</a> & <a class="font" target="_blank" href="https://helpops-hub.vercel.app/contributor-index.html">Open Source Community</a> </p>
84110
</div>
85111
</div>
112+
<script>
113+
114+
// if(window.innerWidth>800){
115+
// document.getElementById("navlinks1").style.display='none'
116+
// }
117+
document.getElementById('hamburger').addEventListener('click',(e)=>{
118+
let ele=document.getElementById("navlinks1")
119+
document.querySelector('.nav-links1').classList.toggle('active');
120+
})
121+
</script>
86122
</body>
87123
</html>

0 commit comments

Comments
 (0)