Skip to content

Commit 3865836

Browse files
update
1 parent a4cf1b0 commit 3865836

2 files changed

Lines changed: 87 additions & 18 deletions

File tree

website2.0/index.html

Lines changed: 46 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -28,23 +28,53 @@
2828
margin: 4px;
2929
transition: 0.4s;
3030
}
31+
@media only screen and (max-width:200px) {
32+
.sponsor-btn{
33+
font-size: 12px !important;
34+
width: 90px !important;
35+
height: 46px !important;
36+
}
37+
.star-button{
38+
font-size: 12px !important;
39+
width: 90px !important;
40+
}
41+
}
42+
@media only screen and (max-width:497px){
43+
h1{
44+
font-size: 40px !important;
45+
}
46+
.main-content{
47+
gap: 30px;
48+
}
49+
}
50+
@media only screen and (max-width:347px){
51+
h1{
52+
font-size: 30px !important;
53+
}
54+
.get-started-btn{
55+
position: relative;
56+
top: 60px;
57+
}
58+
}
3159
</style>
3260

3361
</head>
3462
<body>
3563
<header>
3664
<nav>
3765
<a href="index.html">
38-
<div class="logo">
39-
<img src="HelpOps-H Fevicon.png" alt="Logo">
40-
</div>
41-
</a>
66+
<div class="logo">
67+
<img src="HelpOps-H Fevicon.png" alt="Logo">
68+
</div>
69+
</a>
70+
4271
<ul class="nav-links">
4372
<li><a href="index.html">Home</a></li>
4473
<li><a href="#">About</a></li>
4574
<li><a href="contributor.html">Team</a></li>
4675
<li><a href="#">Contact</a></li>
4776
</ul>
77+
4878
<div class="nav-actions">
4979
<a href="https://github.com/sponsors/mdazfar2">
5080
<button class="sponsor-btn">Sponsor <i id="heart" class="fas fa-heart"></i></button>
@@ -62,19 +92,21 @@
6292
<li><a href="#">About</a></li>
6393
<li><a href="contributor.html">Team</a></li>
6494
<li><a href="#">Contact</a></li>
65-
<li class="isDisplay">
66-
<a href="https://github.com/sponsors/mdazfar2">
67-
<button class="sponsor-btn">Sponsor <i id="heart" class="fas fa-heart"></i></button>
68-
</a> </li>
95+
6996
</ul>
7097
<main>
7198
<div class="main-content">
72-
73-
<button class="star-button">
74-
<i class="star-icon"><i class="fas fa-star"></i></i> <!-- This is a star character -->
75-
Star Us
76-
</button>
77-
99+
<div class="conte">
100+
101+
<button class="star-button">
102+
<i class="star-icon"><i class="fas fa-star"></i></i> <!-- This is a star character -->
103+
Star Us
104+
</button>
105+
<li class="isDisplay">
106+
<a href="https://github.com/sponsors/mdazfar2">
107+
<button class="sponsor-btn">Sponsor <i id="heart" class="fas fa-heart"></i></button>
108+
</a> </li>
109+
</div>
78110
<h1>HelpOps-Hub</h1>
79111
<p>Ensuring You Never Get Stuck In DevOps Again!</p>
80112
<a href="resources.html">

website2.0/styles.css

Lines changed: 41 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -51,17 +51,53 @@ text-decoration: none;
5151
}
5252
}
5353

54-
@media only screen and (max-width:360px) {
55-
.isDisplay{
54+
55+
@media only screen and (max-width:329px){
56+
.hamburger{
57+
width: 100% !important;
58+
59+
}
60+
.hamburger div{
61+
position: relative;
62+
left: 80%;
63+
}
64+
nav{
65+
flex-direction: column-reverse;
66+
}
67+
.isDisplay{
5668
display: block;
5769
}
70+
.conte{
71+
display: flex;
72+
width: 100%;
73+
justify-content: space-around;
74+
}
5875

5976
.nav-actions{
6077

6178
display: none !important;
62-
}}
79+
}
80+
.sponsor-btn{
81+
font-size: 16px !important;
82+
width: 114px !important;
83+
height: 46px !important;
84+
}
85+
.star-button{
86+
font-size: 16px !important;
87+
width: 114px !important ;
88+
}
89+
}
90+
@media only screen and (max-width:300px) {
91+
92+
93+
nav{
94+
gap: 2% !important;
95+
}
96+
}
6397
@media only screen and (max-width:409px) {
64-
98+
nav{
99+
gap: 5% !important;
100+
}
65101

66102
.logo img{
67103
width: 60px !important;
@@ -75,6 +111,7 @@ text-decoration: none;
75111
}
76112
} */
77113
}
114+
78115
.nav-links1{
79116
height: 0px ;
80117
overflow: hidden;

0 commit comments

Comments
 (0)