Create basic svelte app

This commit is contained in:
IRHM
2023-03-11 22:56:29 +00:00
parent 7db40246be
commit 3a2f99adbb
19 changed files with 3317 additions and 0 deletions
+13
View File
@@ -0,0 +1,13 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock
+20
View File
@@ -0,0 +1,20 @@
module.exports = {
root: true,
parser: '@typescript-eslint/parser',
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
plugins: ['svelte3', '@typescript-eslint'],
ignorePatterns: ['*.cjs'],
overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
settings: {
'svelte3/typescript': () => require('typescript')
},
parserOptions: {
sourceType: 'module',
ecmaVersion: 2020
},
env: {
browser: true,
es2017: true,
node: false
}
};
+12
View File
@@ -19,3 +19,15 @@
# Go workspace file
go.work
# web
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
vite.config.js.timestamp-*
vite.config.ts.timestamp-*
+1
View File
@@ -0,0 +1 @@
engine-strict=true
+13
View File
@@ -0,0 +1,13 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock
+23
View File
@@ -0,0 +1,23 @@
{
"tabWidth": 2,
"semi": true,
"singleQuote": false,
"printWidth": 100,
"useTabs": false,
"trailingComma": "none",
"arrowParens": "always",
"plugins": [
"prettier-plugin-svelte"
],
"pluginSearchDirs": [
"."
],
"overrides": [
{
"files": "*.svelte",
"options": {
"parser": "svelte"
}
}
]
}
+2963
View File
File diff suppressed because it is too large Load Diff
+31
View File
@@ -0,0 +1,31 @@
{
"name": "watcharr",
"version": "0.0.1",
"private": true,
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"lint": "prettier --plugin-search-dir . --check . && eslint .",
"format": "prettier --plugin-search-dir . --write ."
},
"devDependencies": {
"@sveltejs/adapter-auto": "^2.0.0",
"@sveltejs/kit": "^1.5.0",
"@typescript-eslint/eslint-plugin": "^5.45.0",
"@typescript-eslint/parser": "^5.45.0",
"eslint": "^8.28.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-svelte3": "^4.0.0",
"prettier": "^2.8.0",
"prettier-plugin-svelte": "^2.8.1",
"svelte": "^3.54.0",
"svelte-check": "^3.0.1",
"tslib": "^2.4.1",
"typescript": "^4.9.3",
"vite": "^4.0.0"
},
"type": "module"
}
+12
View File
@@ -0,0 +1,12 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}
}
export {};
+12
View File
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>
+28
View File
@@ -0,0 +1,28 @@
<script lang="ts">
import type { Content } from "@/types";
export let content: Content;
</script>
<div>
<img src={content.poster} alt="poster" />
<!-- <span>{content.title}</span> -->
</div>
<style lang="scss">
div {
display: flex;
flex-flow: column;
background-color: rgb(48, 45, 45);
overflow: hidden;
flex: 1 1;
border-radius: 5px;
width: 170px;
// aspect-ratio: 2/3;
span {
color: white;
padding: 5px 8px;
}
}
</style>
+34
View File
@@ -0,0 +1,34 @@
<nav><h1>Watcharr</h1></nav>
<slot />
<style lang="scss">
@import url("https://fonts.googleapis.com/css2?family=Rampart+One&display=swap");
:global(*) {
padding: 0;
margin: 0;
box-sizing: border-box;
}
:global(body) {
font-family: sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue';
}
:global(h1, h2, h3, h4, h5) {
font-family: "Rampart One", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}
nav {
display: flex;
align-items: center;
justify-content: center;
h1 {
color: white;
-webkit-text-stroke: 1.5px black;
font-size: 35px;
}
}
</style>
+35
View File
@@ -0,0 +1,35 @@
<script lang="ts">
import Poster from "@/lib/Poster.svelte";
export let data: import("./$types").PageData;
</script>
<svelte:head>
<title>Watcharr</title>
</svelte:head>
<div>
<div><h1>Watched</h1></div>
<ul>
{#each data.watched as w}
<li><Poster content={w} /></li>
{/each}
</ul>
</div>
<style lang="scss">
div {
display: flex;
flex-flow: column;
justify-content: center;
ul {
display: flex;
flex-flow: row;
gap: 10px;
list-style: none;
flex-wrap: wrap;
}
}
</style>
+64
View File
@@ -0,0 +1,64 @@
import { error } from "@sveltejs/kit";
import type { Content } from "@/types";
export function load({ params }) {
return {
watched: [
{
title: "The Last Of Us",
poster:
"https://m.media-amazon.com/images/M/MV5BZGUzYTI3M2EtZmM0Yy00NGUyLWI4ODEtN2Q3ZGJlYzhhZjU3XkEyXkFqcGdeQXVyNTM0OTY1OQ@@._V1_QL75_UX140_CR0,0,140,207_.jpg"
},
{
title: "The Whale",
poster:
"https://m.media-amazon.com/images/M/MV5BZDQ4Njg4YTctNGZkYi00NWU1LWI4OTYtNmNjOWMyMjI1NWYzXkEyXkFqcGdeQXVyMTA3MDk2NDg2._V1_QL75_UY207_CR3,0,140,207_.jpg"
},
{
title: "Creed III",
poster:
"https://m.media-amazon.com/images/M/MV5BYWY1ZDY4MmQtYjhiYS00N2QwLTk1NzgtOWI2YzUwZThjNDYwXkEyXkFqcGdeQXVyMDM2NDM2MQ@@._V1_QL75_UX140_CR0,0,140,207_.jpg"
},
{
title: "Upright",
poster:
"https://m.media-amazon.com/images/M/MV5BNzk5ODJiOWUtMTBkNi00MTU4LWE5YmEtOGMxYmE3YTgwMDZlXkEyXkFqcGdeQXVyMTQyOTE3ODk1._V1_QL75_UY281_CR2,0,190,281_.jpg"
},
{
title: "Interstellar",
poster:
"https://m.media-amazon.com/images/M/MV5BZjdkOTU3MDktN2IxOS00OGEyLWFmMjktY2FiMmZkNWIyODZiXkEyXkFqcGdeQXVyMTMxODk2OTU@._V1_QL75_UX190_CR0,0,190,281_.jpg"
},
{
title: "Game of Thrones",
poster:
"https://m.media-amazon.com/images/M/MV5BYTRiNDQwYzAtMzVlZS00NTI5LWJjYjUtMzkwNTUzMWMxZTllXkEyXkFqcGdeQXVyNDIzMzcwNjc@._V1_QL75_UY281_CR8,0,190,281_.jpg"
},
{
title: "House of the Dragon",
poster:
"https://m.media-amazon.com/images/M/MV5BZjBiOGIyY2YtOTA3OC00YzY1LThkYjktMGRkYTNhNTExY2I2XkEyXkFqcGdeQXVyMTEyMjM2NDc2._V1_QL75_UX190_CR0,0,190,281_.jpg"
},
{
title: "The Punisher",
poster:
"https://m.media-amazon.com/images/M/MV5BNjJhZDZhNWYtMjdhYS00NjkyLWE5NzItMzljNmQ3NGE4MGZjXkEyXkFqcGdeQXVyMjkwOTAyMDU@._V1_QL75_UY281_CR11,0,190,281_.jpg"
},
{
title: "Fargo",
poster:
"https://m.media-amazon.com/images/M/MV5BN2NiMGE5M2UtNWNlNC00N2Y4LTkwOWUtMDlkMzEwNTcyOTcyXkEyXkFqcGdeQXVyMTkxNjUyNQ@@._V1_QL75_UY281_CR2,0,190,281_.jpg"
},
{
title: "Ash vs Evil Dead",
poster:
"https://m.media-amazon.com/images/M/MV5BMTYyMjQyNTE5MF5BMl5BanBnXkFtZTgwMjEyMjE2NDM@._V1_QL75_UX190_CR0,2,190,281_.jpg"
},
{
title: "Bonnie and Clyde",
poster:
"https://m.media-amazon.com/images/M/MV5BMTNjNzBlY2QtNmY1Ni00MzhkLThmODgtMzc3ZDQ0YzJjZjNlXkEyXkFqcGdeQXVyMjUzOTY1NTc@._V1_QL75_UX190_CR0,3,190,281_.jpg"
}
] as Content[]
};
}
+11
View File
@@ -0,0 +1,11 @@
export interface Content {
/**
* Title of content.
*/
title: string;
/**
* URL to poster image.
*/
poster: string;
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

+22
View File
@@ -0,0 +1,22 @@
import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/kit/vite';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://kit.svelte.dev/docs/integrations#preprocessors
// for more information about preprocessors
preprocess: [vitePreprocess()],
kit: {
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
// If your environment is not supported or you settled on a specific environment, switch out the adapter.
// See https://kit.svelte.dev/docs/adapters for more information about adapters.
adapter: adapter(),
alias: {
"@": "src"
}
}
};
export default config;
+17
View File
@@ -0,0 +1,17 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}
+6
View File
@@ -0,0 +1,6 @@
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
export default defineConfig({
plugins: [sveltekit()]
});