Compare commits

...

2 Commits

Author SHA1 Message Date
5ae7c7f47b calibretest 2025-09-05 19:28:46 +02:00
2ffeb53e32 daisyui 2025-09-05 19:28:10 +02:00
9 changed files with 1950 additions and 21 deletions

View File

@ -6,6 +6,7 @@
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<link rel="shortcut icon" type="image/ico" href="/src/assets/favicon.ico" /> <link rel="shortcut icon" type="image/ico" href="/src/assets/favicon.ico" />
<title>Solid App</title> <title>Solid App</title>
<link href="/src/styles/styles.css" rel="stylesheet" />
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>

1876
Frontend/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -3,6 +3,7 @@
"version": "1.0.0", "version": "1.0.0",
"main": "index.ts", "main": "index.ts",
"license": "MIT", "license": "MIT",
"type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build" "build": "vite build"
@ -15,6 +16,9 @@
"vite-plugin-solid": "^2.11.8" "vite-plugin-solid": "^2.11.8"
}, },
"dependencies": { "dependencies": {
"solid-js": "^1.9.9" "@tailwindcss/vite": "^4.1.13",
"daisyui": "^5.1.7",
"solid-js": "^1.9.9",
"tailwindcss": "^4.1.13"
} }
} }

View File

@ -1,22 +1,18 @@
import type { Component } from "solid-js"; import type { Component } from "solid-js";
import { createSignal, For, onMount } from "solid-js"; import { createSignal, For, onMount } from "solid-js";
import CalibreService from "./services/calibreservice";
interface Weather { import { book } from "./types/calibretypes";
date: string; import BookCard from "./components/BookCard";
temperatureC: number;
temperatureF: number;
summary: string;
}
const App: Component = () => { const App: Component = () => {
const [weather, setWeather] = createSignal<Weather[]>([]); const [books, setBooks] = createSignal<book[]>([]);
onMount(() => { onMount(() => {
fetch("/api/weatherforecast") CalibreService.getBooks().then(setBooks);
.then((r) => r.json())
.then(setWeather);
}); });
return ( return (
<div> <div>
<button class="btn btn-primary">primary knapp</button>
<button class="btn btn-blue">blå knapp</button>
<header> <header>
<p> <p>
Edit <code>src/App.tsx</code> and save to reload. Edit <code>src/App.tsx</code> and save to reload.
@ -30,14 +26,9 @@ const App: Component = () => {
</a> </a>
</header> </header>
<For each={weather()}> <div class="book-grid text-base-content mx-auto grid gap-6 pb-20 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 [&_.carbon-responsive-wrap]:flex-nowrap! [&_.carbon-responsive-wrap]:text-[11px]! [&_:is(div,button)]:[transition:background-color_0ms,border-color_100ms,box-shadow_300ms,border-radius_500ms_ease-out] [&>*]:mb-6">
{(item) => ( <For each={books()}>{(item) => <BookCard book={item} />}</For>
<li> </div>
{item.date} - {item.temperatureC}°C / {item.temperatureF}°F -{" "}
{item.summary}
</li>
)}
</For>
</div> </div>
); );
}; };

View File

@ -0,0 +1,27 @@
import type { Component } from "solid-js";
import { book } from "../types/calibretypes";
const BookCard: Component<{ book: book }> = (props: { book: book }) => {
return (
<div class="card book-card bg-base-100 card-border border-base-300 card-sm">
{/* <figure>
<img
src="https://img.daisyui.com/images/stock/photo-1606107557195-0e29a4b5b4aa.webp"
alt="Shoes"
/>
</figure> */}
<div class="card-body">
<h3 class="card-title">{props.book.title}</h3>
<h4 class="author">{props.book.author}</h4>
<p>
Series: {props.book.seriesName} {props.book.seriesNumber}
</p>
{/* <div class="card-actions justify-end">
<button class="btn btn-primary">Buy Now</button>
</div> */}
</div>
</div>
);
};
export default BookCard;

View File

@ -0,0 +1,10 @@
import { book } from "../types/calibretypes";
const CalibreService = {
getBooks: async (): Promise<book[]> => {
const response = await fetch("/api/calibre/books");
return response.json();
},
};
export default CalibreService;

View File

@ -0,0 +1,4 @@
@import "tailwindcss";
@plugin "daisyui" {
themes: dim --default;
}

View File

@ -0,0 +1,15 @@
interface book {
id: number;
title: string;
authorId: number;
author: string;
comments: string;
language: string;
path: string;
hasCover: boolean;
formats: Array<{ id: number; format: string; fileName: string }>;
seriesName: string;
seriesNumber: number;
}
export type { book };

View File

@ -1,12 +1,13 @@
import { defineConfig } from "vite"; import { defineConfig } from "vite";
import solidPlugin from "vite-plugin-solid"; import solidPlugin from "vite-plugin-solid";
import tailwindcss from "@tailwindcss/vite";
import { env } from "process"; import { env } from "process";
const target = env.BACKEND_URL ?? "http://localhost:5084/"; //"https://localhost:7192/"; const target = env.BACKEND_URL ?? "http://localhost:5084/"; //"https://localhost:7192/";
console.log("vite backend:", target); console.log("vite backend:", target);
export default defineConfig({ export default defineConfig({
plugins: [solidPlugin()], plugins: [solidPlugin(), tailwindcss()],
server: { server: {
port: 3000, port: 3000,
proxy: { proxy: {