mirror of
https://github.com/yverdon/agenda-embed.git
synced 2026-08-26 03:34:16 +00:00
An embeddable web component displaying events on a agenda-like from a geojson endpoint | Read-only mirror of https://github.com/yverdon/agenda-embed — Ville d'Yverdon-les-Bains. Issues & pull requests at the source.
- JavaScript 48.7%
- HTML 24.1%
- CSS 15.3%
- TypeScript 8.2%
- Vue 3.7%
| Filename | Latest commit message | Latest commit date |
|---|---|---|
| .github/workflows | ||
| cypress | ||
| public | ||
| src | ||
| .eslintrc.cjs | ||
| .gitignore | ||
| CONTRIBUTING.md | ||
| cypress.config.ts | ||
| env.d.ts | ||
| index.html | ||
| LICENSE | ||
| package-lock.json | ||
| package.json | ||
| postcss.config.js | ||
| prettier.config.js | ||
| README.md | ||
| tailwind.config.js | ||
| tsconfig.app.json | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||
| yverdon.html | ||
Agenda Embed
Web component to browse, filter and search events; including a detail view.
Usage
⚠️ Work in progress
Embed the web component directly in an HTML page:
<!-- Customize the style -->
<style>
agenda-embed {
--agd-color-primary: #008c6f;
--agd-color-accent: #005d95;
--agd-headings-font-family: 'Playfair Display', serif;
--agd-headings-font-weight: 500;
/* ... */
}
</style>
<!-- Render the component -->
<agenda-embed></agenda-embed>
<!-- Initialize the component -->
<script type="module" src="/path/to/agenda-embed.js"></script>
Filter events displayed by domain
You can globally restrict the widget to events of a given domain by using the domain attribute on the component:
<agenda-embed domain="sport"></agenda-embed>
To display events from all domains, don’t specify this attribute.
Customize the API target
Specify the api-base-url attribute to use a different API target:
<agenda-embed api-base-url="https://www.yourdomain.ch/api"></agenda-embed>
This parameter is optional, https://geocity.ch/rest is the default.
The end-points called by the widget are:
- GET
/agendafor the list of events - GET
/agenda/:idfor the event details