feat: Add Banner component for fetching and displaying active banners
Some checks failed
ci/woodpecker/push/woodpecker Pipeline failed
Some checks failed
ci/woodpecker/push/woodpecker Pipeline failed
- Implemented `Banner.astro` component to retrieve active banners from the CMS. - Integrated styling via `Banner.css`. - Handles errors gracefully during banner fetch.
This commit is contained in:
26
src/components/Banner.astro
Normal file
26
src/components/Banner.astro
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
---
|
||||||
|
// src/components/Banner.astro
|
||||||
|
import "../styles/components/Banner.css"
|
||||||
|
|
||||||
|
const API_BASE = 'https://cms.gallus-pub.ch';
|
||||||
|
|
||||||
|
let banner = null;
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch(`${API_BASE}/api/banners/active`);
|
||||||
|
if (response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
banner = data.banner;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to fetch banner:', error);
|
||||||
|
}
|
||||||
|
---
|
||||||
|
|
||||||
|
{banner && (
|
||||||
|
<div class="banner-wrapper">
|
||||||
|
<div class="banner container">
|
||||||
|
<p>{banner.text}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
Reference in New Issue
Block a user