Korbs/Zarro
Korbs/Zarro
1
Fork 0
Code Issues Pull requests Activity

Update search input in Header component and add script

Browse source
This commit is contained in:
Korbs 2024-10-23 13:58:20 -04:00
parent b2f1e23328
commit e5c49baa11
1 changed files with 46 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
source/src/components/global/Header.astro
View file

@ -1,6 +1,6 @@
---
// Properties
const {Query} = Astro.props
const {Query, QueryText} = Astro.props
// Icons
import { HalfMoon, Menu } from "@iconoir/vue";
@ -8,10 +8,10 @@ import { HalfMoon, Menu } from "@iconoir/vue";
<header>
<div class="header-start">
<img width="18px" src="https://md.sudovanilla.org/images/Union.png" />
<div class="search-box">
<input value={Query} placeholder="Search" />
</div>
<a href="/"><img width="18px" src="https://md.sudovanilla.org/images/Union.png"/></a>
<form class="search-box" onsubmit="return Search()">
<input type="search" value={QueryText} placeholder="Search" />
</form>
</div>
<div class="header-end">
<button>English</button>
@ -77,3 +77,43 @@ header {
}
}
</style>
<!-- Search Scripts -->
<!-- From https://ark.sudovanilla.org/MinPluto/MinPluto/src/branch/master/source/src/components/Search.astro#L18-L94 as of writing -->
<script is:inline>
/*
@licstart The following is the entire license notice for the
JavaScript code in this page.
Copyright (C) 2024 SudoVanilla
The JavaScript code in this page is free software: you can
redistribute it and/or modify it under the terms of the GNU
General Public License (GNU GPL) as published by the Free Software
Foundation, either version 3 of the License, or (at your option)
any later version. The code is distributed WITHOUT ANY WARRANTY;
without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
As additional permission under GNU GPL version 3 section 7, you
may distribute non-source (e.g., minimized or compacted) forms of
that code without the copy of the GNU GPL normally required by
section 4, provided you include this license notice and a URL
through which recipients can access the Corresponding Source.
@licend The above is the entire license notice
for the JavaScript code in this page.
*/
// Focus input
function FocusSearch() {
document.querySelector('input[type="search"]').focus();
}
// Trigger Search
function Search() {
var SearchQuery = document.querySelector('form > input[type="search"]').value;
location.href = `/web?=${SearchQuery}`;
}
</script>