69 lines
2.1 KiB
Svelte
69 lines
2.1 KiB
Svelte
<script>
|
|
import {link} from 'svelte-spa-router'
|
|
import Button from "../../Components/Button.svelte";
|
|
|
|
function getRandomIntInclusive(min, max) {
|
|
min = Math.ceil(min);
|
|
max = Math.floor(max);
|
|
return Math.floor(Math.random() * (max - min + 1) + min); //The maximum is inclusive and the minimum is inclusive
|
|
}
|
|
let num = getRandomIntInclusive(100,1000000)
|
|
|
|
let search = "asdf"
|
|
</script>
|
|
<div class="main">
|
|
<div class="spacing">
|
|
<h1 class="heading section spacing">Subooru</h1>
|
|
<div class="section spacing">
|
|
<ul>
|
|
<li><a href="/" use:link>Posts</a></li>
|
|
<li>Comments</li>
|
|
<li>Tags</li>
|
|
<li>Wiki</li>
|
|
<li>Documentation</li>
|
|
</ul>
|
|
</div>
|
|
<div class="flex section spacing">
|
|
<div class="flex-grow mr-2">
|
|
{search}
|
|
<input bind:value={search} type="text" class="w-full text-black shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md" placeholder="Image Search">
|
|
</div>
|
|
<Button rounded blue on:click={() => ++num}>Search</Button>
|
|
</div>
|
|
</div>
|
|
<div class="spacing">
|
|
{#each num.toString() as d}
|
|
<img alt={d} src={`https://shimmie.shishnet.org/ext/home/counters/newcounter/${d}.gif`} />
|
|
{/each}
|
|
</div>
|
|
<div class="spacing">
|
|
Serving {new Intl.NumberFormat().format(num)} posts
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.heading
|
|
{
|
|
@apply text-7xl;
|
|
-webkit-text-stroke: 0.02em black;
|
|
}
|
|
ul li { @apply ml-1 mr-1 inline; }
|
|
img
|
|
{
|
|
@apply inline-block text-white md:h-40 h-20;
|
|
aspect-ratio: 1/1.66;
|
|
}
|
|
.section .spacing
|
|
{
|
|
@apply lg:mt-4 lg:mb-4 md:mt-2 md:mb-2 mt-0 mb-0;
|
|
}
|
|
.spacing
|
|
{
|
|
@apply lg:mt-6 lg:mb-6 md:mt-4 md:mb-4 mt-2 mb-2;
|
|
}
|
|
.main
|
|
{
|
|
@apply min-h-full flex flex-col items-center justify-center text-center;
|
|
min-height: -webkit-fill-available;
|
|
}
|
|
</style> |