Widget:Timeline: Difference between revisions
No edit summary |
No edit summary |
||
| Line 2: | Line 2: | ||
<div id="timeline-loader" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: #fff9ed; z-index: 9999;"> | <div id="timeline-loader" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: #fff9ed; z-index: 9999;"> | ||
<div style="width: 50px; height: 50px; border: 5px solid #d1d5db; border-top-color: #1f2937; border-radius: 50%; animation: spin 1s linear infinite;"></div> | <div style="width: 50px; height: 50px; border: 5px solid #d1d5db; border-top-color: #1f2937; border-radius: 50%; animation: spin 1s linear infinite;"></div> | ||
<p style="margin-top: 15px; font-family: sans-serif; color: #1f2937; font-weight: bold;">Loading | <p style="margin-top: 15px; font-family: sans-serif; color: #1f2937; font-weight: bold;">Loading Timeline</p> | ||
<style>@keyframes spin { to { transform: rotate(360deg); } }</style> | <style>@keyframes spin { to { transform: rotate(360deg); } }</style> | ||
</div> | </div> | ||
Revision as of 15:15, 7 April 2026
Loading Timeline
<style>@keyframes spin { to { transform: rotate(360deg); } }</style>
<link rel="stylesheet" href="/assets/components/pixi-freeline/style.css">
<script type="importmap">
{
"imports": {
"pixi.js": "/assets/libs/pixi.mjs"
}
}
</script>
<script type="module" src="/assets/components/pixi-freeline/main.js"></script>