This commit is contained in:
2025-06-09 22:36:46 +02:00
parent 3f4de2266c
commit 08477e6e1b
2 changed files with 21 additions and 16 deletions

View File

@@ -4,14 +4,9 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Cookbook</title>
<script src="index.js" defer></script>
<!-- San Francisco System Font -->
<style>
html {
font-family: -apple-system, BlinkMacSystemFont, "San Francisco",
"Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
</style>
<!-- Apple-Style: San Francisco Font und Styling -->
</head>
<body>
<main class="container">
@@ -19,16 +14,33 @@
<h1>Cookbook</h1>
<div class="button-group">
<button onclick="syncRecipes()">🔄 Sync Recipes</button>
<a href="/add" class="secondary-button"> Add Recipe</a>
<a href="addRecipe/addRecipe.html" class="secondary-button"
> Add Recipe</a
>
<a
href="https://example.com/help"
class="secondary-button"
target="_blank"
rel="noopener noreferrer"
>❓ Help</a
>
</div>
</header>
<section id="recipes" class="recipes-list"></section>
<section id="recipes" class="recipes-list">
<!-- Recipes will be dynamically loaded here -->
</section>
</main>
</body>
</html>
<style>
/* System Font */
html {
font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI",
Roboto, Helvetica, Arial, sans-serif;
}
/* Reset */
* {
margin: 0;
@@ -47,7 +59,6 @@
min-height: 100vh;
}
/* Main container */
.container {
width: 100%;
max-width: 800px;
@@ -57,7 +68,6 @@
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}
/* Header */
header {
display: flex;
flex-direction: column;
@@ -71,7 +81,6 @@
font-weight: 600;
}
/* Button group */
.button-group {
display: flex;
justify-content: center;
@@ -93,7 +102,6 @@
text-align: center;
}
/* Primary button */
button {
background-color: #007aff;
color: #fff;
@@ -103,7 +111,6 @@
background-color: #005ecb;
}
/* Secondary button (styled link) */
.secondary-button {
background-color: #e5e5ea;
color: #1d1d1f;
@@ -113,14 +120,12 @@
background-color: #d1d1d6;
}
/* Recipe list */
.recipes-list {
display: flex;
flex-direction: column;
gap: 1rem;
}
/* Placeholder for recipe cards (can be enhanced later) */
.recipe-card {
padding: 1rem;
border-radius: 16px;

0
helpSite.md Normal file
View File