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

Redesign the menu and logo #86

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Redesign the menu and logo #86

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
17 changes: 12 additions & 5 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,18 +33,25 @@
<div>
<!-- Navbar -->

<nav class="bg-white border-gray-200 px-2 sm:px-4 py-2.5 rounded dark:bg-zinc-900">
<nav class="bg-white border-gray-200 px-2 sm:px-4 rounded dark:bg-zinc-900 top-bar">

<div class="container flex flex-wrap justify-between items-center mx-auto">

<!-- LOGO here -->
<a href="index.html" class="flex items-center">
<img src="assests/image.png" class="mr-3 h-6 sm:h-9" alt="Logo">
<span class="name self-center text-xl font-semibold whitespace-nowrap dark:text-white">Cryptic</span>
<img src="assests/image.png" class="mr-3 h-6 sm:h-9 logo" alt="Logo">
<span class="logo-name self-center text-xl font-semibold whitespace-nowrap dark:text-white">C<span class="logo-name-1">RYPTIC</span></span>
</a>

<!-- Small Sereen Button -->
<button data-collapse-toggle="navbar-default" type="button" class="inline-flex items-center p-2 ml-3 text-sm text-gray-500 rounded-lg lg:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600" aria-controls="navbar-default" aria-expanded="false">
<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>
<div class="hidden w-full lg:block lg:w-auto" id="navbar-default">
<ul class="flex ml-auto items flex-col mt-4 bg-zinc-900 rounded-lg border border-gray-100 lg:flex-row lg:space-x-8 lg:mt-0 lg:text-sm md:font-medium lg:border-0 dark:border-gray-700">

<!-- Menu starts here -->
<div class="hidden w-full lg:block lg:w-auto " id="navbar-default">
<ul class="flex ml-auto items flex-col mt-4 bg-zinc-900 rounded-lg border border-gray-100 lg:flex-row lg:space-x-8 lg:mt-0 lg:text-sm md:font-medium lg:border-0 dark:border-gray-700 menu">
<li>
<a href="#" class="links my-2">Home</a>
</li>
Expand Down
28 changes: 15 additions & 13 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,18 +17,18 @@ body {
position: relative;
top: 450px;
} */

/* Navbar- Navigation bar of the website */

.navigation {
display: flex;
flex-direction: column;
.top-bar{
padding: 25px;
}

.name {
.logo-name {
font-family: Arial, Helvetica, sans-serif !important;
font-size: 3rem !important;
color: aqua !important;
color: rgb(0, 163, 163) !important;
}
.logo-name-1{
font-size: 2rem;
color: #47d7ff;
}

.home {
Expand All @@ -46,18 +46,21 @@ top: 450px;
border-radius: 25px;
border: #72b1e4;
padding: 7px;
margin: 5px;
}

.items {
/* gap: 2rem; */
font-weight: bold;
color: #797f98 !important;
font-family: "Times New Roman", serif !important;
/* font-family: "Times New Roman", serif !important; */
text-decoration: none;
font-size: 1.2rem !important;
font-size: 1rem;
text-decoration: none;
padding: 15px;justify-content: center;
}


.items > li > a:hover {
color: #e6a2f4 !important;
transition: all 0.3s;
Expand All @@ -70,8 +73,8 @@ top: 450px;
}

.logo {
width: 30px;
height: 30px;
width: 50px;
height: 50px;
background-color: white;
border-radius: 100%;
cursor: pointer;
Expand All @@ -88,7 +91,6 @@ top: 450px;
/*inside the box*/ radial-gradient(circle at top left, #fd00da, #19d7f8);
background-origin: border-box;
background-clip: content-box, border-box;
margin-right: 40px;
}

.sign {
Expand Down