jafreli/Linktree
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: jafreli:message_board
Branches Tags
jafreli:main jafreli:jbin jafreli:message_board
..
compare: jafreli:f556fda1c8f874d0d538a75f9f484f6dbf9e9b04
Branches Tags
jafreli:jbin jafreli:main jafreli:message_board

1 Commits
message_bo ... f556fda1c8

Author SHA1 Message Date
jafreli
f556fda1c8 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
Details 
Reviewed-on: #5
 2025-01-17 01:14:28 +00:00
3 changed files with 6 additions and 23 deletions
Expand all files Collapse all files

11
view/message-board.html
View File

@@ -13,15 +13,14 @@
<body> <body>
<div class="container"> <div class="container">
<h1>Message Board</h1> <h1>Message Board</h1>
<form id="messageForm">
<input type="text" id="name" placeholder="Your Name" required>
<textarea id="message" placeholder="Your Message" maxlength="100" required></textarea>
<div id="charCount">0 / 100</div>
<button type="submit">Send</button>
</form>
<div id="messages"> <div id="messages">
<!-- Nachrichten werden hier dynamisch geladen --> <!-- Nachrichten werden hier dynamisch geladen -->
</div> </div>
<form id="messageForm">
<input type="text" id="name" placeholder="Your Name" required>
<textarea id="message" placeholder="Your Message" required></textarea>
<button type="submit">Send</button>
</form>
</div> </div>
<script src="message-board.js"></script> <script src="message-board.js"></script>
</body> </body>

11
view/message-board.js
View File

@@ -4,7 +4,7 @@ const messageForm = document.getElementById('messageForm');
// Funktion, um die letzten 10 Nachrichten zu laden // Funktion, um die letzten 10 Nachrichten zu laden
async function loadMessages() { async function loadMessages() {
const result = await pb.collection('message_board').getList(1, 8, { const result = await pb.collection('message_board').getList(1, 10, {
sort: '-created', // Sortiert nach Erstellungsdatum absteigend sort: '-created', // Sortiert nach Erstellungsdatum absteigend
}); });
@@ -40,12 +40,3 @@ messageForm.addEventListener('submit', async (e) => {
// Nachrichten beim Laden der Seite anzeigen // Nachrichten beim Laden der Seite anzeigen
loadMessages(); loadMessages();
const messageInput = document.getElementById('message');
const charCount = document.getElementById('charCount');
// Event-Listener für Eingaben im Textfeld
messageInput.addEventListener('input', () => {
const currentLength = messageInput.value.length;
charCount.textContent = `${currentLength} / 100`;
});

7
view/styles.css
View File

@@ -108,10 +108,3 @@ form button {
form button:hover { form button:hover {
background: #0056b3; background: #0056b3;
} }
#charCount {
font-size: 12px;
color: #666;
text-align: right; /* Rechtsbündig unter dem Textfeld */
width: 90%;
}