Merge pull request 'changed style' (#5) from message_board into main
All checks were successful
Build and Push Docker Image to Gitea Registry / build-and-push (push) Successful in 5s

Reviewed-on: #5
This commit is contained in:
2025-01-17 01:14:28 +00:00
2 changed files with 14 additions and 3 deletions

View File

@@ -5,6 +5,9 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Message Board</title>
<link rel="stylesheet" href="styles.css">
<link rel="apple-touch-icon" sizes="180x180" href="logos/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="logos/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="logos/favicon/favicon-16x16.png">
<script src="https://cdn.jsdelivr.net/npm/pocketbase/dist/pocketbase.umd.js"></script>
</head>
<body>

View File

@@ -19,7 +19,7 @@ body {
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
display: flex;
flex-direction: column;
align-items: center; /* Zentriert die Links im Container */
align-items: center; /* Zentriert die Inhalte im Container */
}
h1 {
@@ -76,17 +76,26 @@ h1 {
form {
display: flex;
flex-direction: column;
align-items: center; /* Zentriert die Form-Inhalte horizontal */
gap: 10px;
width: 100%; /* Maximale Breite der Form */
}
form input, form textarea {
width: 100%;
width: 90%; /* Eingabefelder nehmen 90% der Breite ein */
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
box-sizing: border-box; /* Verhindert, dass Padding die Größe beeinflusst */
}
form textarea {
height: 100px; /* Größeres Textfeld */
resize: none; /* Deaktiviert Größenänderungen durch den Benutzer */
}
form button {
width: 50%; /* Sende-Knopf nimmt 50% der Form-Breite ein */
padding: 10px;
background: #007BFF;
color: white;
@@ -99,4 +108,3 @@ form button {
form button:hover {
background: #0056b3;
}