ngn/dumb
1
0
Fork 0
Code Issues 1 Pull Requests 3 Actions Packages Activity

feat: add option to easily redirect to Genius website

Browse Source
This commit is contained in:
rramiachraf 2024-04-16 01:26:28 +01:00
parent e54ea8abec
commit 22d4ab2cda
3 changed files with 39 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
static/script.js
View File

@ -9,6 +9,8 @@ function showAbout() {
fullAbout && [fullAbout, summary].forEach(item => item.onclick = showAbout) fullAbout && [fullAbout, summary].forEach(item => item.onclick = showAbout)
window.addEventListener("load", () => { window.addEventListener("load", () => {
const geniusURL = "https://genius.com" + document.location.pathname + document.location.search
document.getElementById("goto-genius").setAttribute("href", geniusURL)
document.querySelectorAll("#lyrics a").forEach(item => { document.querySelectorAll("#lyrics a").forEach(item => {
item.addEventListener("click", getAnnotation) item.addEventListener("click", getAnnotation)
}) })

8
style/navbar.css
View File

@ -24,7 +24,13 @@ nav img {
width: 50px; width: 50px;
} }
#choose-theme { #nav-icons {
display: flex;
align-items: center;
gap: 1rem;
}
.nav-icon {
background: none; background: none;
border: none; border: none;
cursor: pointer; cursor: pointer;

46
views/navbar.templ
View File

@ -4,24 +4,38 @@ templ navbar() {
<nav> <nav>
<div id="nav-container"> <div id="nav-container">
<a href="/"><img src="/static/logo.svg"/></a> <a href="/"><img src="/static/logo.svg"/></a>
<button id="choose-theme"> <div id="nav-icons">
<svg <a
width="25px" title="Go to Genius.com"
height="25px" alt="Go to Genius.com"
viewBox="0 0 24 24" class="nav-icon"
version="1.1" id="goto-genius"
xmlns="http://www.w3.org/2000/svg" rel="noopener noreferrer"
xmlns:xlink="http://www.w3.org/1999/xlink" target="_blank"
> >
<g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" fill="none" viewBox="0 0 24 24">
<g id="ic_fluent_dark_theme_24_regular" fill="#181d31" fill-rule="nonzero"> <path stroke="#181d31" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 14v4.833A1.166 1.166 0 0 1 16.833 20H5.167A1.167 1.167 0 0 1 4 18.833V7.167A1.166 1.166 0 0 1 5.167 6h4.618m4.447-2H20v5.768m-7.889 2.121 7.778-7.778"></path>
<path </svg>
d="M12,22 C17.5228475,22 22,17.5228475 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,17.5228475 6.4771525,22 12,22 Z M12,20.5 L12,3.5 C16.6944204,3.5 20.5,7.30557963 20.5,12 C20.5,16.6944204 16.6944204,20.5 12,20.5 Z" </a>
></path> <button id="choose-theme" class="nav-icon">
<svg
width="25px"
height="25px"
viewBox="0 0 24 24"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<g id="🔍-Product-Icons" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="ic_fluent_dark_theme_24_regular" fill="#181d31" fill-rule="nonzero">
<path
d="M12,22 C17.5228475,22 22,17.5228475 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,17.5228475 6.4771525,22 12,22 Z M12,20.5 L12,3.5 C16.6944204,3.5 20.5,7.30557963 20.5,12 C20.5,16.6944204 16.6944204,20.5 12,20.5 Z"
></path>
</g>
</g> </g>
</g> </svg>
</svg> </button>
</button> </div>
</div> </div>
</nav> </nav>
} }