Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Email hover #1736

Closed
wants to merge 5 commits into from
Closed

Email hover #1736

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
32ca80d
nav style
puneet426 Jun 4, 2024
559de76
Update navbar.css
puneet426 Jun 4, 2024
254ccd1
navstyle
puneet426 Jun 4, 2024
cfcb3f5
change
puneet426 Jun 4, 2024
2fa8b6a
Update index.html
puneet426 Jun 5, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
135 changes: 135 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,97 @@ <h1 class="text-4xl text_2 text-center md:text-left md:ml-12 uppercase font-ser
today!</h1>
<p class="text-lg text-gray-400 text-center md:text-left md:ml-12 mt-2">Give life to a needed animal</p>
</div> -->
<<<<<<< HEAD
</div>
<button
data-collapse-toggle="navbar-default"
type="button"
class="absolute top-4 right-4 sm:inline-flex sm:items-center p-2 lg:hidden focus:outline-none text_4"
aria-controls="navbar-default"
aria-expanded="false"
id="nav-button"
>
<span class="sr-only">Open main menu</span>
<svg
class="w-6 h-6"
aria-hidden="true"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
clip-rule="evenodd"
></path>
</svg>
</button>
<nav class="">
<div class="hidden w-full lg:block z-2" id="navbar">
<ul class="w-[100vw] h-1/2 top-0 right-0 p-8 lg:p-4 mt-12 lg:mt-0 text-center text-base lg:text-lg space-y-4 lg:space-y-0 lg:space-x-5 lg:static lg:w-auto flex flex-col rounded-lg items-center lg:items-center lg:bg-transparent lg:border-0 lg:flex-row justify-between">
<div class="nav-item">
<li>
<a
href="#meet"
class="lg:p-3 text-custom-heading font-bold underline-offset-4 turn-red-hover navbar-item"
>Meet Pets</a
>

</li>
</div>
<li>
<a
href="#About"
class="text-custom-heading font-bold underline-offset-4 turn-red-hover navbar-item"
>About Us</a
>
</li>
<li>
<a
href="./news.html"
class="text-custom-heading font-bold underline-offset-4 turn-red-hover navbar-item"
>Pet News</a
>
</li>
<li>
<a
href="./blog.html"
class="text-custom-heading font-bold underline-offset-4 turn-red-hover navbar-item"
>Blogs</a
>
</li>
<li>
<a
href="./donate.html"
class="text-custom-heading font-bold underline-offset-4 turn-red-hover navbar-item"
>Donate</a
>
</li>

<li>
<div x-data="{ open: false }" @mouseleave="open = false" class="relative">
<a
@mouseover="open = true"
class="text-custom-heading flex font-bold underline-offset-4 turn-red-hover navbar-item w-full"
>
Support Us
<svg
xmlns="http://www.w3.org/2000/svg"
width="14px"
height="14px"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
class="mt-1"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M19 9l-7 7-7-7"
></path>
</svg>
=======
</div>
<button data-collapse-toggle="navbar-default" type="button"
class="absolute top-4 right-4 sm:inline-flex sm:items-center p-2 lg:hidden focus:outline-none text_4"
Expand Down Expand Up @@ -93,8 +184,52 @@ <h1 class="text-4xl text_2 text-center md:text-left md:ml-12 uppercase font-ser
<a href="volunteer.html"
class="block px-4 py-2 text-base text-gray-600 hover:bg-gray-400 hover:text-white">
Become a Volunteer
>>>>>>> 2ebdd849478ed77945b77bcace647ca97cbd1abe
</a>
</div>
<<<<<<< HEAD

</li>
<li>
<a
href="./reportstary.html"
class="text-custom-heading font-bold underline-offset-4 turn-red-hover navbar-item"
>SOS Report</a
>
</li>
<li>
<a href="#contact">
<button
class="inline-flex items-center bg-header-orange-light border-0 py-2 lg:py-2 text-choco text-base px-2 focus:outline-none text_4 font-bold rounded mt-4 md:mt-0 hover:translate-x-2 transition-transform"
>
Contact Us
<svg
fill="none"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
class="w-4 h-4 ml-1 transform translate-x-0 transition-transform"
viewBox="0 0 24 24"
>
<path d="M5 12h14M12 5l7 7-7 7"></path>
</svg>
</button>
</a>
</li>
<li>
<a id="theme-toggle">
<i class="ri-sun-line turn-yellow-hover light-theme" id="switch"></i>
</a>
</li>
<!-- google translate -->
<div id="google_translate_element">
<script
type="text/javascript"
src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"
></script>
=======
>>>>>>> 2ebdd849478ed77945b77bcace647ca97cbd1abe
</div>

</li>
Expand Down
2 changes: 1 addition & 1 deletion introSection.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@
color: white;
}
.main-body-heading-text span{
color: #c97f06;
color: hsl(37, 73%, 59%);
text-shadow: 3px 3px 4px rgba(0, 0, 0, 0.5);
}

Expand Down
25 changes: 23 additions & 2 deletions navbar.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
}

#switch.light-theme {
color: white;
color: rgb(255, 255, 255);
}

#switch.dark-theme {
Expand All @@ -25,7 +25,7 @@

#switch.turn-red-hover:hover {
--tw-text-opacity: 0.65;
color: rgb(255 0 0 / var(--tw-text-opacity));
color: red;
}

#switch.turn-yellow-hover:hover {
Expand Down Expand Up @@ -161,4 +161,25 @@
#navbar ul {
font-size: 15px;
}
}
.nav-items{
display: flex;
gap: 2rem;
padding: 0 4rem;

}
a{
text-decoration: none;
color: white;
}
a:hover{
color:hwb(37 38% 0%);
font-size: 1.25rem;
}
.nav-items div{
font-size: 20px;
font-weight: 500;
cursor: pointer;
transition: 5s;

}
2 changes: 1 addition & 1 deletion style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -276,7 +276,7 @@
font-family: "Poppins";
}
#google_translate_element div {
color: white;
color: rgb(255, 255, 255);
}
#google_translate_element span {
}
Expand Down