dave/calorie-counter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 16 Wiki Activity

Clean up wails

Browse Source
This commit is contained in:
PhatPhuckDave
2024-08-09 16:43:04 +02:00
parent 67d165c256
commit 3a4839cd24
4 changed files with 91 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
frontend/src/App.svelte
View File

@@ -1,79 +1,77 @@
<script lang="ts"> <script lang="ts">
import logo from './assets/images/logo-universal.png' import logo from "./assets/images/logo-universal.png";
import {Greet} from '../wailsjs/go/main/App.js' import { Greet } from "../wailsjs/go/main/App.js";
let resultText: string = "Please enter your name below 👇" let resultText: string = "Please enter your name below 👇";
let name: string let name: string;
function greet(): void { function greet(): void {
Greet(name).then(result => resultText = result) Greet(name).then((result) => (resultText = result));
} }
</script> </script>
<main> <main>
<img alt="Wails logo" id="logo" src="{logo}"> <img alt="Wails logo" id="logo" src={logo} />
<div class="result" id="result">{resultText}</div> <div class="result" id="result">{resultText}</div>
<div class="input-box" id="input"> <div class="input-box" id="input">
<input autocomplete="off" bind:value={name} class="input" id="name" type="text"/> <input autocomplete="off" bind:value={name} class="input" id="name" type="text" />
<button class="btn" on:click={greet}>Greet</button> <button class="btn" on:click={greet}>Greet</button>
</div> </div>
</main> </main>
<style> <style>
#logo {
display: block;
width: 50%;
height: 50%;
margin: auto;
padding: 10% 0 0;
background-position: center;
background-repeat: no-repeat;
background-size: 100% 100%;
background-origin: content-box;
}
#logo { .result {
display: block; height: 20px;
width: 50%; line-height: 20px;
height: 50%; margin: 1.5rem auto;
margin: auto; }
padding: 10% 0 0;
background-position: center;
background-repeat: no-repeat;
background-size: 100% 100%;
background-origin: content-box;
}
.result { .input-box .btn {
height: 20px; width: 60px;
line-height: 20px; height: 30px;
margin: 1.5rem auto; line-height: 30px;
} border-radius: 3px;
border: none;
margin: 0 0 0 20px;
padding: 0 8px;
cursor: pointer;
}
.input-box .btn { .input-box .btn:hover {
width: 60px; background-image: linear-gradient(to top, #cfd9df 0%, #e2ebf0 100%);
height: 30px; color: #333333;
line-height: 30px; }
border-radius: 3px;
border: none;
margin: 0 0 0 20px;
padding: 0 8px;
cursor: pointer;
}
.input-box .btn:hover { .input-box .input {
background-image: linear-gradient(to top, #cfd9df 0%, #e2ebf0 100%); border: none;
color: #333333; border-radius: 3px;
} outline: none;
height: 30px;
line-height: 30px;
padding: 0 10px;
background-color: rgba(240, 240, 240, 1);
-webkit-font-smoothing: antialiased;
}
.input-box .input { .input-box .input:hover {
border: none; border: none;
border-radius: 3px; background-color: rgba(255, 255, 255, 1);
outline: none; }
height: 30px;
line-height: 30px;
padding: 0 10px;
background-color: rgba(240, 240, 240, 1);
-webkit-font-smoothing: antialiased;
}
.input-box .input:hover {
border: none;
background-color: rgba(255, 255, 255, 1);
}
.input-box .input:focus {
border: none;
background-color: rgba(255, 255, 255, 1);
}
.input-box .input:focus {
border: none;
background-color: rgba(255, 255, 255, 1);
}
</style> </style>

54
frontend/tsconfig.json
View File

@@ -1,30 +1,30 @@
{ {
"extends": "@tsconfig/svelte/tsconfig.json", "extends": "@tsconfig/svelte/tsconfig.json",
"compilerOptions": { "compilerOptions": {
"target": "ESNext", "target": "ESNext",
"useDefineForClassFields": true, "useDefineForClassFields": true,
"module": "ESNext", "module": "ESNext",
"resolveJsonModule": true, "resolveJsonModule": true,
"baseUrl": ".", "baseUrl": ".",
/** /**
* Typecheck JS in `.svelte` and `.js` files by default. * Typecheck JS in `.svelte` and `.js` files by default.
* Disable checkJs if you'd like to use dynamic types in JS. * Disable checkJs if you'd like to use dynamic types in JS.
* Note that setting allowJs false does not prevent the use * Note that setting allowJs false does not prevent the use
* of JS in `.svelte` files. * of JS in `.svelte` files.
*/ */
"allowJs": true, "allowJs": true,
"checkJs": true, "checkJs": true,
"isolatedModules": true "isolatedModules": true,
}, "paths": {
"include": [ "$lib/*": ["src/lib/*"],
"src/**/*.d.ts", "$components/*": ["src/lib/components/*"],
"src/**/*.ts", "$router/*": ["src/lib/router/*"]
"src/**/*.js",
"src/**/*.svelte"
],
"references": [
{
"path": "./tsconfig.node.json"
} }
] },
"include": ["src/**/*.d.ts", "src/**/*.ts", "src/**/*.js", "src/**/*.svelte"],
"references": [
{
"path": "./tsconfig.node.json"
}
]
} }

2
main.go
View File

@@ -6,9 +6,7 @@ import (
"fmt" "fmt"
"io" "io"
"log" "log"
"math/rand"
"os" "os"
"sync"
"github.com/wailsapp/wails/v2" "github.com/wailsapp/wails/v2"
"github.com/wailsapp/wails/v2/pkg/options" "github.com/wailsapp/wails/v2/pkg/options"

6
wails.json
View File

@@ -2,9 +2,9 @@
"$schema": "https://wails.io/schemas/config.v2.json", "$schema": "https://wails.io/schemas/config.v2.json",
"name": "calorie-counter", "name": "calorie-counter",
"outputfilename": "calorie-counter", "outputfilename": "calorie-counter",
"frontend:install": "npm install", "frontend:install": "pnpm install",
"frontend:build": "npm run build", "frontend:build": "pnpm build",
"frontend:dev:watcher": "npm run dev", "frontend:dev:watcher": "pnpm dev",
"frontend:dev:serverUrl": "auto", "frontend:dev:serverUrl": "auto",
"author": { "author": {
"name": "PhatPhuckDave", "name": "PhatPhuckDave",