initial commit

This commit is contained in:
HorizonCode 2024-01-04 01:26:09 +01:00
parent 1effd2264a
commit 35804c2868
13 changed files with 7549 additions and 52 deletions

View File

@ -27,6 +27,10 @@ function createWindow() {
show: false
});
// disable electron toolbar
/* if (!isDev()) */
mainWindow.setMenu(null);
// This block of code is intended for development purpose only.
// Delete this entire block of code when you are ready to package the application.
if (isDev()) {

7352
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -1,20 +1,24 @@
{
"name": "create-svelte-electron-app",
"version": "1.2.0",
"description": "The boilerplate code to get started creating Cross-platform Desktop Apps with Electron and Svelte as front-end technology.",
"name": "ezpplauncher-next",
"version": "2.0.0",
"description": "EZPPLauncher rewritten with Svelte.",
"private": false,
"license": "MIT",
"main": "main.js",
"author": "Souleh Shaikh <soulehshaikh99@gmail.com>",
"author": "HorizonCode <horizoncode88@gmail.com>",
"build": {
"icon": "public/favicon.png",
"productName": "Svelte and Electron App",
"productName": "EZPPLauncher",
"files": [
"public/**/*",
"main.js",
"preload.js"
],
"win": {},
"win": {
"target": [
"portable"
]
},
"linux": {},
"mac": {}
},
@ -31,18 +35,27 @@
"electron-serve": "^1.1.0"
},
"devDependencies": {
"@rollup/plugin-commonjs": "^23.0.2",
"@rollup/plugin-node-resolve": "^15.0.1",
"concurrently": "^7.5.0",
"@rollup/plugin-commonjs": "^25.0.7",
"@rollup/plugin-image": "^3.0.3",
"@rollup/plugin-node-resolve": "^15.2.3",
"@rollup/plugin-terser": "^0.4.4",
"@sveltejs/vite-plugin-svelte": "^3.0.1",
"autoprefixer": "^10.4.16",
"concurrently": "^8.2.2",
"electron": "^21.2.0",
"electron-builder": "^23.6.0",
"rollup": "^3.2.3",
"rollup-plugin-css-only": "^4.2.0",
"flowbite": "^2.2.1",
"flowbite-svelte": "^0.44.21",
"postcss": "^8.4.32",
"postcss-load-config": "^5.0.2",
"rollup": "^4.9.2",
"rollup-plugin-css-only": "^4.5.2",
"rollup-plugin-livereload": "^2.0.5",
"rollup-plugin-svelte": "^7.1.0",
"rollup-plugin-terser": "^7.0.2",
"rollup-plugin-postcss": "^4.0.2",
"rollup-plugin-svelte": "^7.1.6",
"sirv-cli": "^2.0.2",
"svelte": "^3.52.0",
"wait-on": "^6.0.1"
"svelte": "^4.2.8",
"tailwindcss": "^3.3.6",
"wait-on": "^7.2.0"
}
}

13
postcss.config.cjs Normal file
View File

@ -0,0 +1,13 @@
const tailwindcss = require("tailwindcss");
const autoprefixer = require("autoprefixer");
const config = {
plugins: [
//Some plugins, like tailwindcss/nesting, need to run before Tailwind,
tailwindcss(),
//But others, like autoprefixer, need to run after,
autoprefixer,
],
};
module.exports = config;

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 53 KiB

View File

@ -1,11 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<html lang="en" data-theme="dark" class="dark">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<title>Svelte app</title>
<title>EZPPLauncher</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Prompt:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<link rel='icon' type='image/png' href='/favicon.png'>
<link rel='stylesheet' href='/global.css'>
<link rel='stylesheet' href='/build/bundle.css'>
@ -13,6 +15,6 @@
<script defer src='/build/bundle.js'></script>
</head>
<body>
<body class="bg-gray-900">
</body>
</html>

View File

@ -2,8 +2,10 @@ 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 terser from '@rollup/plugin-terser';
import css from 'rollup-plugin-css-only';
import postcss from 'rollup-plugin-postcss';
import image from '@rollup/plugin-image';
const production = !process.env.ROLLUP_WATCH;
@ -43,9 +45,11 @@ export default {
dev: !production
}
}),
// we'll extract any component CSS out into
// a separate file - better for performance
css({ output: 'bundle.css' }),
postcss(),
// If you have external dependencies installed from
// npm, you'll most likely need these plugins. In
@ -57,6 +61,7 @@ export default {
dedupe: ['svelte']
}),
commonjs(),
image(),
// In dev mode, call `npm run start` once
// the bundle has been generated
@ -68,7 +73,8 @@ export default {
// If we're building for production (npm run build
// instead of npm run dev), minify
production && terser()
production && terser(),
],
watch: {
clearScreen: false

View File

@ -55,7 +55,7 @@ const rollupConfigPath = path.join(projectRoot, "rollup.config.js")
let rollupConfig = fs.readFileSync(rollupConfigPath, "utf8")
// Edit imports
rollupConfig = rollupConfig.replace(`'rollup-plugin-terser';`, `'rollup-plugin-terser';
rollupConfig = rollupConfig.replace(`'@rollup/plugin-terser';`, `'@rollup/plugin-terser';
import sveltePreprocess from 'svelte-preprocess';
import typescript from '@rollup/plugin-typescript';`)

View File

@ -1,10 +1,54 @@
<script>
export let name;
import {
Navbar,
NavBrand,
NavLi,
NavUl,
NavHamburger,
Avatar,
Dropdown,
DropdownItem,
DropdownHeader,
DropdownDivider
} from "flowbite-svelte";
import ezppLogo from '../public/favicon.png';
let count = 0;
</script>
<div
class="p-2 bg-gray-950 flex flex-row justify-between items-center rounded-lg"
>
<div class="flex flex-row items-center">
<img src={ezppLogo} class="w-12 h-12 mr-2" />
<span class="text-gray-100 text-xl font-extralight">EZPPLauncher</span>
</div>
<div class="w-fill cursor-pointer flex md:order-2">
<Avatar
class="rounded-lg hover:ring hover:ring-4 hover:ring-gray-800"
src="https://a.ez-pp.farm/1001"
id="avatar-menu"
/>
</div>
<Dropdown placement="bottom" triggeredBy="#avatar-menu">
<DropdownHeader>
<span class="block text-sm">Quetzalcoatl</span>
<span class="block truncate text-sm font-medium text-gray-200"
>me@horizonco.de</span
>
</DropdownHeader>
<DropdownItem class="border-0 !bg-gray-700 active:!bg-gray-800"
>Profile</DropdownItem
>
<DropdownDivider />
<DropdownItem class="border-0 !bg-gray-700 active:!bg-gray-800"
>Sign out</DropdownItem
>
</Dropdown>
</div>
<main>
<h1>Hello {name}!</h1>
<p>Visit the <a href="https://svelte.dev/tutorial">Svelte tutorial</a> to learn how to build Svelte apps.</p>
<!-- <button class="btn" on:click={() => (count += 1)}>Count: {count}</button> -->
</main>
<style>
@ -16,10 +60,18 @@
}
h1 {
color: #ff3e00;
font-size: 2rem;
margin: 0;
font-weight: 300;
font-style: normal;
color: #ccc;
text-transform: uppercase;
font-size: 4em;
font-weight: 100;
letter-spacing: 0.1em;
text-shadow: 0 0 1px #000;
text-align: center;
padding: 0.5em 0;
border-bottom: 1px solid #353535;
margin-bottom: 1.5rem;
}
@media (min-width: 640px) {

8
src/app.pcss Normal file
View File

@ -0,0 +1,8 @@
/* Write your global styles here, in PostCSS syntax */
@tailwind base;
@tailwind components;
@tailwind utilities;
* {
font-family: "Prompt";
}

View File

@ -1,10 +1,9 @@
import App from './App.svelte';
import "./app.pcss";
import App from "./App.svelte";
import '@fontsource/prompt';
const app = new App({
target: document.body,
props: {
name: 'world'
}
});
export default app;

7
svelte.config.js Normal file
View File

@ -0,0 +1,7 @@
const { vitePreprocess } = require("@sveltejs/vite-plugin-svelte");
const config = {
preprocess: [vitePreprocess({})],
};
module.exports = config;

41
tailwind.config.cjs Normal file
View File

@ -0,0 +1,41 @@
/** @type {import('tailwindcss').Config}*/
const config = {
content: ['./src/**/*.{html,js,svelte,ts}', './node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}'],
darkMode: 'class',
theme: {
extend: {
colors: {
// flowbite-svelte
primary: {
50: '#FFF5F2',
100: '#FFF1EE',
200: '#FFE4DE',
300: '#FFD5CC',
400: '#FFBCAD',
500: '#FE795D',
600: '#EF562F',
700: '#EB4F27',
800: '#CC4522',
900: '#A5371B'
},
gray: {
50: '#F9F9F9',
100: '#ECECEC',
200: '#D3D3D3',
300: '#B9B9B9',
400: '#A0A0A0',
500: '#868686',
600: '#6D6D6D',
700: '#535353',
800: '#393939',
900: '#202020',
950: '#1A1A1A'
},
}
}
},
plugins: [require('flowbite/plugin')],
};
module.exports = config;