57 lines
1007 B
Svelte
57 lines
1007 B
Svelte
<script>
|
|
import offLogo from './assets/off-logo.svg';
|
|
import OFF from './lib/OFF.svelte';
|
|
import Scanner from './lib/Scanner.svelte';
|
|
import BarcodeIcon from './assets/barcode.svg';
|
|
</script>
|
|
|
|
<main class="dark">
|
|
<div>
|
|
<a href="/">
|
|
<img src={offLogo} class="logo" alt="Open Food Facts Logo" />
|
|
</a>
|
|
</div>
|
|
<h1>OpenFoodFacts Client</h1>
|
|
|
|
<div class="card">
|
|
<Scanner />
|
|
</div>
|
|
|
|
<nav class="menu bottom nav-bar">
|
|
<ul>
|
|
<li>
|
|
<a class="nav-item" href="/scan" title="Scan barcode">
|
|
<img class="icon" src={BarcodeIcon} alt="Barcode icon" />
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</main>
|
|
|
|
<style>
|
|
.logo {
|
|
height: 6em;
|
|
padding: 1.5em;
|
|
will-change: filter;
|
|
}
|
|
.logo:hover {
|
|
filter: drop-shadow(0 0 2em #646cffaa);
|
|
}
|
|
.logo:hover {
|
|
filter: drop-shadow(0 0 2em #ff3e00aa);
|
|
}
|
|
|
|
.menu .icon {
|
|
height: 5rem;
|
|
width: 5rem;
|
|
}
|
|
|
|
.menu li {
|
|
list-style: none;
|
|
}
|
|
|
|
.icon {
|
|
filter: invert(1);
|
|
}
|
|
</style>
|