fixed html structure for news sidebar
This commit is contained in:
@@ -204,20 +204,31 @@ $news_items = $stmt->fetchAll();
|
||||
<span class="leaflet-sidebar-close"><i class="fa-solid fa-xmark"></i></span>
|
||||
</h2>
|
||||
<div class="sidebar-body">
|
||||
<?php if (empty($news_items)): ?>
|
||||
<p style="text-align:center;color:#999;padding:20px;">Noch keine Neuigkeiten veröffentlicht.</p>
|
||||
<?php else: ?>
|
||||
<?php foreach ($news_items as $news): ?>
|
||||
<div class="news-item">
|
||||
<h3><?= htmlspecialchars($news['title']) ?></h3>
|
||||
<p><?= nl2br(htmlspecialchars($news['content'])) ?></p>
|
||||
<span class="news-date">
|
||||
<?= htmlspecialchars($news['author_name']) ?>
|
||||
· <?= date('d.m.Y', strtotime($news['published_at'])) ?>
|
||||
</span>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
<!-- News Search -->
|
||||
<div class="list-search">
|
||||
<input type="text" id="news-search-input" placeholder="Neuigkeiten durchsuchen..." class="form-input" oninput="filterNews()">
|
||||
</div>
|
||||
|
||||
<!-- News Items Container -->
|
||||
<div id="news-list">
|
||||
<?php if (empty($news_items)): ?>
|
||||
<p style="text-align:center;color:#999;padding:20px;">Noch keine Neuigkeiten veröffentlicht.</p>
|
||||
<?php else: ?>
|
||||
<?php foreach ($news_items as $news): ?>
|
||||
<div class="news-item"
|
||||
data-title="<?= htmlspecialchars(strtolower($news['title'])) ?>"
|
||||
data-content="<?= htmlspecialchars(strtolower($news['content'])) ?>"
|
||||
data-author="<?= htmlspecialchars(strtolower($news['author_name'])) ?>">
|
||||
<h3><?= htmlspecialchars($news['title']) ?></h3>
|
||||
<p><?= nl2br(htmlspecialchars($news['content'])) ?></p>
|
||||
<span class="news-date">
|
||||
<?= htmlspecialchars($news['author_name']) ?>
|
||||
· <?= date('d.m.Y', strtotime($news['published_at'])) ?>
|
||||
</span>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -983,6 +983,25 @@ function reverseGeocode(contributionId, lat, lng) {
|
||||
.catch(function () {});
|
||||
}
|
||||
|
||||
// Filters News Items in Sidebar by Search Term
|
||||
function filterNews() {
|
||||
const searchTerm = document.getElementById('news-search-input').value.toLowerCase();
|
||||
const newsItems = document.querySelectorAll('#news-list .news-item');
|
||||
|
||||
newsItems.forEach(function (item) {
|
||||
const title = item.dataset.title || '';
|
||||
const content = item.dataset.content || '';
|
||||
const author = item.dataset.author || '';
|
||||
|
||||
// Shows Item if Search Term matches Title, Content or Author
|
||||
if (!searchTerm || title.indexOf(searchTerm) !== -1 || content.indexOf(searchTerm) !== -1 || author.indexOf(searchTerm) !== -1) {
|
||||
item.style.display = '';
|
||||
} else {
|
||||
item.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// =====================================================================
|
||||
// Block 16: Application Startup
|
||||
|
||||
Reference in New Issue
Block a user