Mirror/awesome-nostr
1
0
Fork 0
mirror of https://github.com/aljazceru/awesome-nostr.git synced 2025-02-22 14:48:59 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

repositioned serach bar to top nav

Browse Source
This commit is contained in:
Yeghro 2025-01-24 23:33:09 -08:00
parent 3d44f538ae
commit 1512364426
2 changed files with 31 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
index.html
View File

@ -29,6 +29,10 @@
<nav class="top-nav">
<div class="nav-content">
<h1>Awesome Nostr.net</h1>
<div class="search-box">
<input type="text" id="search" placeholder="Search resources...">
<i class="fas fa-search"></i>
</div>
<button id="darkModeToggle" class="theme-toggle" aria-label="Toggle dark mode">
<i class="fas fa-moon"></i>
</button>
@ -44,10 +48,6 @@
</button>
</header>
<div class="sidebar-content">
<div class="search-box">
<input type="text" id="search" placeholder="Search resources...">
<i class="fas fa-search"></i>
</div>
<ul class="nav-links">
<!-- Categories will be dynamically populated here -->
</ul>

35
styles.css
View File

@ -62,16 +62,21 @@ body {
.search-box {
position: relative;
margin-bottom: 1.5rem;
flex-grow: 1;
max-width: 400px;
}
.search-box input {
width: 100%;
padding: 0.5rem 2rem 0.5rem 1rem;
border: 1px solid #ddd;
border: none;
border-radius: 4px;
background-color: var(--background-color);
color: var(--text-color);
background-color: rgba(255, 255, 255, 0.1);
color: white;
}
.search-box input::placeholder {
color: rgba(255, 255, 255, 0.7);
}
.search-box i {
@ -79,7 +84,7 @@ body {
right: 10px;
top: 50%;
transform: translateY(-50%);
color: #666;
color: rgba(255, 255, 255, 0.7);
}
.nav-links {
@ -261,8 +266,22 @@ body {
padding: 0.75rem;
}
.top-nav h1 {
.nav-content {
flex-wrap: wrap;
gap: 0.5rem;
}
.nav-content h1 {
font-size: 1.25rem;
width: 100%;
text-align: center;
}
.search-box {
order: 3;
width: 100%;
max-width: none;
margin-top: 0.5rem;
}
}
@ -498,14 +517,14 @@ button:focus {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
}
.nav-content h1 {
margin: 0;
font-size: 1.5rem;
font-weight: 600;
flex-grow: 1;
text-align: center;
white-space: nowrap;
}
.theme-toggle {