IBCornelsen/online-energieausweis
1
0
Fork 0
Code Issues 272 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

CAD

Browse Source
This commit is contained in:
Jens Cornelsen
2024-12-09 22:27:02 +01:00
parent e595b5d4c4
commit 625ed56b50
3 changed files with 87 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/CAD.svelte
View File

@@ -1,33 +1,4 @@
<style>
body {
font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
margin: 0;
padding: 0;
}
canvas {
border: 1px solid #ccc;
cursor: crosshair;
}
.controls {
margin: 10px;
}
.controls button {
margin-right: 5px;
}
.log {
margin: 10px;
width: 800px;
max-height: 150px;
overflow-y: auto;
border: 1px solid #ccc;
padding: 10px;
background: #f9f9f9;
}
</style>
<div class="controls">
<button onclick="clearCanvas()">Clear</button>
</div>
@@ -38,7 +9,7 @@
</div>
<script type="ts">
const canvas = document.getElementById('cadCanvas') as HTMLCanvasElement;
const ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
const lineLog = document.getElementById('line-log') as HTMLUListElement;

83
src/layouts/cadLayout.astro Normal file
View File

@@ -0,0 +1,83 @@
---
import "../style/global.css";
import "../../svelte-dialogs.config"
import Header from "#header/Header.astro";
import Footer from "#footer/Footer.astro";
import SidebarLeft from "#sidebarLeft/SidebarLeft.astro";
import SidebarRight from "#sidebarRight/SidebarRight.astro";
import { NotificationWrapper } from "@ibcornelsen/ui";
export interface Props {
title: string;
}
const { title } = Astro.props;
---
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple CAD Program - Thick Black Lines</title>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
margin: 0;
padding: 0;
}
canvas {
border: 1px solid #ccc;
cursor: crosshair;
}
.controls {
margin: 10px;
}
.controls button {
margin-right: 5px;
}
.log {
margin: 10px;
width: 800px;
max-height: 150px;
overflow-y: auto;
border: 1px solid #ccc;
padding: 10px;
background: #f9f9f9;
}
</style>
</head>
<body>
<container class="w-full max-w-[1920px]">
<Header />
<main
class="w-full p-0 grid
sm:grid-cols-[minmax(1fr,1fr)] sm:gap-1 sm:px-0
md:grid-cols-[minmax(1fr,1fr)] md:gap-2 md:px-0
lg:grid-cols-[minmax(250px,250px)1fr] lg:gap-3 lg:p-3
xl:grid-cols-[minmax(350px,350px)1fr] xl:gap-4 xl:p-4
2xl:grid-cols-[minmax(350px,350px)1fr_minmax(350px,350px)] 2xl:gap-5 2xl:p-5
">
<SidebarLeft />
<article class="box grow rounded-tl-none">
<slot />
</article>
<SidebarRight />
</main>
<Footer />
<NotificationWrapper client:load />
</container>
</body>
</html>

4
src/pages/faq/erstellung-energieausweise/index.astro
View File

@@ -6,9 +6,9 @@ import CAD from "#components/CAD.svelte";
---
<Layout title="Welcher Energieausweis">
<Layout title="CAD">
<h1 class="text-3xl">Welcher Energieausweis?</h1>
<h1 class="text-3xl">CAD</h1>
<div class="mt-12 m-auto w-[95%] relative">
<CAD client:load />