Nueva version con html plano
This commit is contained in:
@@ -1,18 +0,0 @@
|
||||
<script>
|
||||
import Search from "./Search.svelte";
|
||||
import LinkGroup from "./LinkGroup.svelte";
|
||||
import Container from "./Container.svelte";
|
||||
|
||||
import {groups} from "./store";
|
||||
</script>
|
||||
|
||||
<Container>
|
||||
<Search slot="search"/>
|
||||
|
||||
<svelte:fragment slot="groups">
|
||||
{#each $groups as group}
|
||||
<LinkGroup group="{group}"/>
|
||||
{/each}
|
||||
</svelte:fragment>
|
||||
|
||||
</Container>
|
||||
@@ -1,8 +0,0 @@
|
||||
<div class="h-screen w-screen flex items-center justify-center">
|
||||
<div class="flex flex-col w-full max-w-screen-md p-2 space-y-2">
|
||||
<slot name="search"/>
|
||||
<div class="grid grid-cols-[10ch_auto]">
|
||||
<slot name="groups"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,11 +0,0 @@
|
||||
<script>
|
||||
export let link;
|
||||
</script>
|
||||
|
||||
<a
|
||||
href="{link.href}"
|
||||
referrerpolicy="no-referrer"
|
||||
class="cursor-pointer hover:underline tracking-wide"
|
||||
>
|
||||
[{link.name}]
|
||||
</a>
|
||||
@@ -1,15 +0,0 @@
|
||||
<script>
|
||||
import Link from "./Link.svelte";
|
||||
|
||||
export let group = {
|
||||
name: '',
|
||||
links: []
|
||||
};
|
||||
</script>
|
||||
|
||||
<span class="font-bold">{group.name}</span>
|
||||
<div class="space-x-3">
|
||||
{#each group.links as link}
|
||||
<Link link="{link}"/>
|
||||
{/each}
|
||||
</div>
|
||||
@@ -1,39 +0,0 @@
|
||||
<script>
|
||||
let search = '';
|
||||
|
||||
function doNavigation(url) {
|
||||
if(
|
||||
url.slice(0,7) === 'http://' ||
|
||||
url.slice(0,8) === 'https://' ||
|
||||
url.slice(0,2) === '//'
|
||||
){
|
||||
window.location.href=url;
|
||||
} else {
|
||||
window.location.href=`//${url}`;
|
||||
}
|
||||
}
|
||||
|
||||
function doSearch(term) {
|
||||
doNavigation(`https://duckduckgo.com/?q=${term}`);
|
||||
}
|
||||
|
||||
function submit(event) {
|
||||
if(event.key !== 'Enter') return;
|
||||
if(search.trim() === '') return;
|
||||
|
||||
if(event.composed && event.ctrlKey){
|
||||
doNavigation(search);
|
||||
}else{
|
||||
doSearch(search);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<input
|
||||
type="search"
|
||||
autocomplete="false"
|
||||
autofocus
|
||||
class="border-2 border-black py-2 px-2"
|
||||
bind:value={search}
|
||||
on:keyup|preventDefault={submit}
|
||||
/>
|
||||
BIN
src/desk.png
Normal file
BIN
src/desk.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 829 KiB |
96
src/index.html
Normal file
96
src/index.html
Normal file
@@ -0,0 +1,96 @@
|
||||
<!doctype html>
|
||||
<html class="h-full" lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Startpage</title>
|
||||
<link href="style.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="h-full bg-black font-display">
|
||||
<div class="w-full lg:max-w-screen-xl mx-auto lg:pt-[10rem] flex flex-col gap-2 p-4">
|
||||
<span id="time" class="text-white text-center lg:text-left"></span>
|
||||
|
||||
<div class="flex flex-col-reverse lg:flex-row gap-2 h-full lg:h-[30rem]">
|
||||
<div class="flex justify-center items-center py-4 bg-white w-full">
|
||||
<div class="flex flex-col lg:flex-row justify-around gap-4 lg:gap-16">
|
||||
<div class="flex flex-col">
|
||||
<a class="hover:underline" href="https://twitter.com">twitter</a>
|
||||
<a class="hover:underline" href="https://youtube.com">youtube</a>
|
||||
<a class="hover:underline" href="https://web.whatsapp.com">whatsapp</a>
|
||||
<a class="hover:underline" href="https://lobste.rs">lobsters</a>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<a class="hover:underline" href="https://www.inacap.cl/">inacap</a>
|
||||
<a class="hover:underline" href="https://adfs.inacap.cl/adfs/ls/?wtrealm=https://siga.inacap.cl/sts/&wa=wsignin1.0&wreply=https://siga.inacap.cl/sts/&wctx=https%3a%2f%2fadfs.inacap.cl%2fadfs%2fls%2f%3fwreply%3dhttps%3a%2f%2fwww.inacap.cl%2ftportalvp%2fintranet-alumno%26wtrealm%3dhttps%3a%2f%2fwww.inacap.cl%2f">intranet</a>
|
||||
<a class="hover:underline" href="https://www.inacap.cl/tportalvp/procesar_link.php?url=https://lms.inacap.cl/auth/saml2/login.php?wants=https://lms.inacap.cl/my/">aprendizaje</a>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<a class="hover:underline" href="https://fastmail.com">fastmail</a>
|
||||
<a class="hover:underline" href="https://gmail.com">gmail</a>
|
||||
<a class="hover:underline" href="https://drive.google.com">drive</a>
|
||||
<a class="hover:underline" href="https://console.aws.amazon.com/console/home">aws</a>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<a class="hover:underline" href="https://reddit.com">reddit</a>
|
||||
<a class="hover:underline" href="https://reddit.com/r/chile">/r/chile</a>
|
||||
<a class="hover:underline" href="https://4chan.org/g/catalog">/g/</a>
|
||||
<a class="hover:underline" href="https://4chan.org/wg/catalog">/wg/</a>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<a class="hover:underline" href="https://jellyfin.danielcortes.xyz">jellyfin</a>
|
||||
<a class="hover:underline" href="https://firefly.danielcortes.xyz">firefly</a>
|
||||
<a class="hover:underline" href="https://torrent.danielcortes.xyz">torrent</a>
|
||||
<a class="hover:underline" href="https://sonarqube.danielcortes.xyz">sonarqube</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img alt="img" src="desk.png" class="object-cover hidden lg:block"/>
|
||||
<img alt="img" src="mobile.png" class="object-cover h-32 lg:hidden"/>
|
||||
</div>
|
||||
<div>
|
||||
<input id="search" type="search" class="w-full px-2 py-1 bg-white" placeholder="search" autofocus autocomplete="off"/>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
const dateFormatter = new Intl.DateTimeFormat('es-CL', {dateStyle: 'medium', timeStyle: 'short'});
|
||||
const updateDate = () => document.querySelector('#time').innerHTML = dateFormatter.format(new Date())
|
||||
|
||||
updateDate();
|
||||
setInterval(() => updateDate(), 1000)
|
||||
|
||||
const doNavigation = (url) => {
|
||||
if(
|
||||
url.slice(0,7) === 'http://' ||
|
||||
url.slice(0,8) === 'https://' ||
|
||||
url.slice(0,2) === '//'
|
||||
){
|
||||
window.location.href = url;
|
||||
} else {
|
||||
window.location.href = `//${url}`;
|
||||
}
|
||||
}
|
||||
|
||||
function doSearch(term) {
|
||||
doNavigation(`https://duckduckgo.com/?q=${term}`);
|
||||
}
|
||||
function submit(event) {
|
||||
if(event.key !== 'Enter') return;
|
||||
|
||||
const search = event.target.value;
|
||||
if(search.trim() === '') return;
|
||||
|
||||
if(event.composed && event.ctrlKey){
|
||||
doNavigation(search);
|
||||
}else{
|
||||
doSearch(search);
|
||||
}
|
||||
}
|
||||
|
||||
document.querySelector('#search').addEventListener("keyup", submit);
|
||||
</script>
|
||||
</html>
|
||||
9
src/input.css
Normal file
9
src/input.css
Normal file
@@ -0,0 +1,9 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Silkscreen&display=swap');
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
input {
|
||||
outline: 0 !important;
|
||||
}
|
||||
@@ -1,5 +0,0 @@
|
||||
import App from './App.svelte';
|
||||
|
||||
const app = new App({target: document.body});
|
||||
|
||||
export default app;
|
||||
BIN
src/mobile.png
Normal file
BIN
src/mobile.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
50
src/store.js
50
src/store.js
@@ -1,50 +0,0 @@
|
||||
import {readable} from "svelte/store";
|
||||
|
||||
const defaultGroups = [
|
||||
{
|
||||
name: 'General',
|
||||
links: [
|
||||
{name: 'twitter', href: 'https://twitter.com'},
|
||||
{name: 'youtube', href: 'https://youtube.com'},
|
||||
{name: 'hacker_news', href: 'https://news.ycombinator.com'},
|
||||
{name: 'lobsters', href: 'https://lobste.rs'},
|
||||
{name: 'whatsapp', href: 'https://web.whatsapp.com'},
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Inacap',
|
||||
links: [
|
||||
{name: 'home', href: 'https://www.inacap.cl/'},
|
||||
{name: 'intranet', href: 'https://adfs.inacap.cl/adfs/ls/?wtrealm=https://siga.inacap.cl/sts/&wa=wsignin1.0&wreply=https://siga.inacap.cl/sts/&wctx=https%3a%2f%2fadfs.inacap.cl%2fadfs%2fls%2f%3fwreply%3dhttps%3a%2f%2fwww.inacap.cl%2ftportalvp%2fintranet-alumno%26wtrealm%3dhttps%3a%2f%2fwww.inacap.cl%2f'},
|
||||
{name: 'aprendizaje', href: 'https://www.inacap.cl/tportalvp/procesar_link.php?url=https://lms.inacap.cl/auth/saml2/login.php?wants=https://lms.inacap.cl/my/'},
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Reddit',
|
||||
links: [
|
||||
{name: 'frontpage', href: 'https://reddit.com'},
|
||||
{name: 'r/unixporn', href: 'https://reddit.com/r/unixporn'},
|
||||
{name: 'r/piracy', href: 'https://reddit.com/r/piracy'},
|
||||
{name: 'r/roms', href: 'https://reddit.com/r/roms'},
|
||||
{name: 'r/chile', href: 'https://reddit.com/r/chile'},
|
||||
]
|
||||
},
|
||||
{
|
||||
name: '4chan',
|
||||
links: [
|
||||
{name: '/g/', href: 'https://4chan.org/g/catalog'},
|
||||
{name: '/wg/', href: 'https://4chan.org/wg/catalog'},
|
||||
{name: '/v/', href: 'https://4chan.org/v/catalog'},
|
||||
{name: '/x/', href: 'https://4chan.org/x/catalog'},
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Home',
|
||||
links: [
|
||||
{name: 'status', href: 'http://192.168.1.200:19999'},
|
||||
{name: 'torrent', href: 'http://192.168.1.200:8080'},
|
||||
]
|
||||
},
|
||||
]
|
||||
|
||||
export const groups = readable(defaultGroups, () => {}, ()=>{})
|
||||
@@ -1,7 +0,0 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
body {
|
||||
font-size:20px;
|
||||
}
|
||||
Reference in New Issue
Block a user