Skip to content

Commit

Permalink
Fixed the theme button position on small devices (#1919)
Browse files Browse the repository at this point in the history
  • Loading branch information
@SHRUTISINHA250714
SHRUTISINHA250714 authored Dec 18, 2024
1 parent a85ecea commit 548272c
Show file tree
Hide file tree
Showing 6 changed files with 57 additions and 25 deletions.
12 changes: 7 additions & 5 deletions assets/about/about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,17 +78,19 @@
<li class="nav-item">
<a href="../contact/contact.html" class="nav-link"><i class="fa fa-phone" aria-hidden="true"></i> Contact</a>
</li>
</ul>
<div class="small-screen-adjustment">
<div class="theme-switch-wrapper">
<label class="theme-switch" for="checkbox">
<input type="checkbox" id="checkbox">
<div class="slider round"></div>
</label>
</div>
</ul>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
</div>
</nav>
</header>
Expand Down
12 changes: 7 additions & 5 deletions assets/contact/contact.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,17 +77,19 @@
<li>
<a href="#" class="nav-link" id="active1"><i class="fa fa-phone" aria-hidden="true"></i> Contact</a>
</li>
</ul>
<div class="small-screen-adjustment">
<div class="theme-switch-wrapper">
<label class="theme-switch" for="checkbox">
<input type="checkbox" id="checkbox">
<div class="slider round"></div>
</label>
</div>
</ul>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
</div>
</nav>
</header>
Expand Down
12 changes: 7 additions & 5 deletions assets/contributors/contributor.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,17 +77,19 @@
<li>
<a href="../contact/contact.html" class="nav-link"><i class="fa fa-phone" aria-hidden="true"></i> Contact</a>
</li>
</ul>
<div class="small-screen-adjustment">
<div class="theme-switch-wrapper">
<label class="theme-switch" for="checkbox">
<input type="checkbox" id="checkbox">
<div class="slider round"></div>
</label>
</div>
</ul>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
</div>
</nav>
</header>
Expand Down
12 changes: 7 additions & 5 deletions assets/faq/faq.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,17 +78,19 @@
<li class="nav-item">
<a href="../contact/contact.html" class="nav-link"><i class="fa fa-phone" aria-hidden="true"></i> Contact</a>
</li>
</ul>
<div class="small-screen-adjustment">
<div class="theme-switch-wrapper">
<label class="theme-switch" for="checkbox">
<input type="checkbox" id="checkbox">
<div class="slider round"></div>
</label>
</div>
</ul>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
</div>
</nav>
</header>
Expand Down
12 changes: 7 additions & 5 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,17 +82,19 @@
<li class="nav-item">
<a href="./assets/contact/contact.html" class="nav-link"><i class="fa fa-phone" aria-hidden="true"></i> Contact</a>
</li>
</ul>
<div class="small-screen-adjustment">
<div class="theme-switch-wrapper">
<label class="theme-switch" for="checkbox">
<input type="checkbox" id="checkbox">
<div class="slider round"></div>
</label>
</div>
</ul>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
</div>
</nav>
</header>
Expand Down
22 changes: 22 additions & 0 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,13 @@

/* Dark and light mode Css*/

.small-screen-adjustment {
display: flex;
align-items: center;
justify-content: space-between;
margin-left: 15px;
}

.theme-switch-wrapper {
display: flex;
align-items: center;
Expand All @@ -42,6 +49,7 @@
height: 32px;
position: relative;
width: 55px;
margin-left: auto;
}

.theme-switch input {
Expand Down Expand Up @@ -355,12 +363,22 @@ nav {
padding: 0.5rem;
}

.nav-menu {
display: flex;
margin-left: auto;
}

nav ul {
display: flex;
gap: 2rem;
list-style: none;
align-items: center;
}
.nav-menu {
display: flex;
margin-left: auto;
gap: 1rem;
}

#active1 {
color: #ff1b82;
Expand Down Expand Up @@ -2231,6 +2249,10 @@ footer {
transition: 0.3s ease-in-out;
}

.theme-switch-wrapper {
margin-right: 15px;
}

.hamburger {
display: block;
cursor: pointer;
Expand Down

0 comments on commit 548272c

Please sign in to comment.