Nueva version con html plano

This commit is contained in:
2022-09-18 05:01:10 -03:00
parent 480ec72909
commit ab9d0c0b94
24 changed files with 420 additions and 5688 deletions

View File

@@ -1,2 +1,2 @@
Dockerfile
.git/
dist/
node_modules/

6
.gitignore vendored
View File

@@ -1,4 +1,4 @@
/node_modules/
/public/build/
.DS_Store
src/output.css
dist/
node_modules/

6
.idea/jsLibraryMappings.xml generated Normal file
View File

@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptLibraryMappings">
<includedPredefinedLibrary name="Node.js Core" />
</component>
</project>

View File

@@ -15,4 +15,4 @@ RUN npm run build
FROM nginx:latest as deployer
COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=builder /usr/app/src/public /usr/share/nginx/html
COPY --from=builder /usr/app/src/dist /usr/share/nginx/html

109
README.md
View File

@@ -1,109 +0,0 @@
*Psst — looking for a more complete solution? Check out [SvelteKit](https://kit.svelte.dev), the official framework for building web applications of all sizes, with a beautiful development experience and flexible filesystem-based routing.*
*Looking for a shareable component template instead? You can [use SvelteKit for that as well](https://kit.svelte.dev/docs#packaging) or the older [sveltejs/component-template](https://github.com/sveltejs/component-template)*
---
# svelte app
This is a project template for [Svelte](https://svelte.dev) apps. It lives at https://github.com/sveltejs/template.
To create a new project based on this template using [degit](https://github.com/Rich-Harris/degit):
```bash
npx degit sveltejs/template svelte-app
cd svelte-app
```
*Note that you will need to have [Node.js](https://nodejs.org) installed.*
## Get started
Install the dependencies...
```bash
cd svelte-app
npm install
```
...then start [Rollup](https://rollupjs.org):
```bash
npm run dev
```
Navigate to [localhost:5000](http://localhost:5000). You should see your app running. Edit a component file in `src`, save it, and reload the page to see your changes.
By default, the server will only respond to requests from localhost. To allow connections from other computers, edit the `sirv` commands in package.json to include the option `--host 0.0.0.0`.
If you're using [Visual Studio Code](https://code.visualstudio.com/) we recommend installing the official extension [Svelte for VS Code](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode). If you are using other editors you may need to install a plugin in order to get syntax highlighting and intellisense.
## Building and running in production mode
To create an optimised version of the app:
```bash
npm run build
```
You can run the newly built app with `npm run start`. This uses [sirv](https://github.com/lukeed/sirv), which is included in your package.json's `dependencies` so that the app will work when you deploy to platforms like [Heroku](https://heroku.com).
## Single-page app mode
By default, sirv will only respond to requests that match files in `public`. This is to maximise compatibility with static fileservers, allowing you to deploy your app anywhere.
If you're building a single-page app (SPA) with multiple routes, sirv needs to be able to respond to requests for *any* path. You can make it so by editing the `"start"` command in package.json:
```js
"start": "sirv public --single"
```
## Using TypeScript
This template comes with a script to set up a TypeScript development environment, you can run it immediately after cloning the template with:
```bash
node scripts/setupTypeScript.js
```
Or remove the script via:
```bash
rm scripts/setupTypeScript.js
```
If you want to use `baseUrl` or `path` aliases within your `tsconfig`, you need to set up `@rollup/plugin-alias` to tell Rollup to resolve the aliases. For more info, see [this StackOverflow question](https://stackoverflow.com/questions/63427935/setup-tsconfig-path-in-svelte).
## Deploying to the web
### With [Vercel](https://vercel.com)
Install `vercel` if you haven't already:
```bash
npm install -g vercel
```
Then, from within your project folder:
```bash
cd public
vercel deploy --name my-project
```
### With [surge](https://surge.sh/)
Install `surge` if you haven't already:
```bash
npm install -g surge
```
Then, from within your project folder:
```bash
npm run build
surge public my-project.surge.sh
```

View File

@@ -22,4 +22,3 @@ server {
expires 7d;
add_header Cache-Control "public";
}

5575
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,36 +1,9 @@
{
"name": "svelte-app",
"version": "1.0.0",
"private": true,
"scripts": {
"build:tailwind": "cross-env NODE_ENV=production npx postcss src/tailwind.css -o public/build/index.css",
"watch:tailwind": "npx postcss src/tailwind.css -o public/build/index.css -w",
"build:svelte": "rollup -c",
"watch:svelte": "rollup -c -w",
"build": "npm run build:tailwind && npm run build:svelte",
"dev": "concurrently npm:watch:*",
"start": "sirv public --no-clear"
"watch": "tailwindcss -i ./src/input.css -o ./src/style.css --watch",
"build": "mkdir -p dist; tailwindcss -i ./src/input.css -o ./dist/style.css; cp ./src/*.html ./src/*.png dist/"
},
"devDependencies": {
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-node-resolve": "^11.0.0",
"autoprefixer": "^10.4.0",
"concurrently": "^6.4.0",
"cross-env": "^7.0.3",
"postcss": "^8.4.5",
"postcss-cli": "^9.1.0",
"rollup": "^2.3.4",
"rollup-plugin-css-only": "^3.1.0",
"rollup-plugin-livereload": "^2.0.0",
"rollup-plugin-postcss": "^4.0.2",
"rollup-plugin-svelte": "^7.0.0",
"rollup-plugin-terser": "^7.0.0",
"svelte": "^3.0.0",
"tailwindcss": "^3.0.5"
},
"dependencies": {
"sirv-cli": "^1.0.0"
"tailwindcss": "^3.1.8"
}
}

View File

@@ -1,7 +0,0 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
...(process.env.NODE_ENV === 'production' ? { cssnano: {} } : {})
}
}

View File

@@ -1,22 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<title></title>
<link rel='icon' type='image/png' href='/favicon.png'>
<link rel="preload" href="/build/index.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript>
<link rel="stylesheet" href="/build/index.css">
</noscript>
<script defer src='/build/bundle.js'></script>
<script async defer data-website-id="18b19e7b-b080-4999-a6ba-472ac9314e97" src="https://umami.danielcortes.xyz/umami.js"></script>
</head>
<body>
</body>
</html>

View File

@@ -1,67 +0,0 @@
import svelte from 'rollup-plugin-svelte';
import commonjs from '@rollup/plugin-commonjs';
import resolve from '@rollup/plugin-node-resolve';
import livereload from 'rollup-plugin-livereload';
import {terser} from 'rollup-plugin-terser';
import postcss from 'rollup-plugin-postcss'
const production = !process.env.ROLLUP_WATCH;
function serve() {
let server;
function toExit() {
if (server) server.kill(0);
}
return {
writeBundle() {
if (server) return;
server = require('child_process').spawn('npm', ['run', 'start', '--', '--dev'], {
stdio: ['ignore', 'inherit', 'inherit'],
shell: true
});
process.on('SIGTERM', toExit);
process.on('exit', toExit);
}
};
}
export default {
input: 'src/main.js',
output: {
sourcemap: true,
format: 'iife',
name: 'app',
file: 'public/build/bundle.js'
},
plugins: [
svelte({
compilerOptions: {
// enable run-time checks when not in production
dev: !production
}
}),
postcss({
plugins: []
}),
resolve({
browser: true,
dedupe: ['svelte']
}),
commonjs(),
!production && serve(),
!production && livereload('public'),
production && terser()
],
watch: {
clearScreen: false
}
};

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -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

Binary file not shown.

After

Width:  |  Height:  |  Size: 829 KiB

96
src/index.html Normal file
View 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
View 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;
}

View File

@@ -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

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

@@ -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, () => {}, ()=>{})

View File

@@ -1,7 +0,0 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
body {
font-size:20px;
}

View File

@@ -1,7 +1,15 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{html,js,svelte}"],
theme: {
extend: {},
},
plugins: [],
content: ["./src/**/*.{html,js}"],
theme: {
colors: {
white: '#f0f0f0',
black: '#191919',
},
fontFamily: {
display: ['Silkscreen']
},
extend: {},
},
plugins: [],
}