chroniko 0.2.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/README.md +10 -5
  3. package/dist/chroniko.min.css +1 -1
  4. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  All notable changes to Chroniko are documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/), and the project follows [Semantic Versioning](https://semver.org/).
4
4
 
5
+ ## [0.2.1] - 2026-10-15
6
+
7
+ ### Changed
8
+
9
+ - `textSizeToggle` also enlarges the story and the toolbar buttons by 1px: body text from 13px to 14px, meta and dates from 12px to 13px, card titles from 16px to 17px.
10
+
5
11
  ## [0.2.0] - 2026-10-15
6
12
 
7
13
  ### Added
@@ -38,6 +44,7 @@ All notable changes to Chroniko are documented in this file. The format is based
38
44
 
39
45
  - Initial release.
40
46
 
47
+ [0.2.1]: https://github.com/ykyuen/chroniko/compare/0.2.0...0.2.1
41
48
  [0.2.0]: https://github.com/ykyuen/chroniko/compare/0.1.1...0.2.0
42
49
  [0.1.1]: https://github.com/ykyuen/chroniko/compare/0.1.0...0.1.1
43
50
  [0.1.0]: https://github.com/ykyuen/chroniko/releases/tag/0.1.0
package/README.md CHANGED
@@ -1,6 +1,11 @@
1
- # chroniko
1
+ <picture>
2
+ <source media="(prefers-color-scheme: dark)" srcset="https://chroniko.ykyuen.info/images/favicon-dark-180.png">
3
+ <img src="https://chroniko.ykyuen.info/images/favicon-light-180.png" alt="Chroniko logo">
4
+ </picture>
2
5
 
3
- Render historical events on a single zoomable time axis. Plain HTML, CSS and JavaScript, with no dependencies. Here is the [demo](https://chroniko.ykyuen.info/philosophers-in-history/).
6
+ # Chroniko
7
+
8
+ Render historical events on a single zoomable time axis. Plain HTML, CSS and JavaScript, with no dependencies. Here is the [demo](https://chroniko.ykyuen.info/philosophers-in-history/?lang=en).
4
9
 
5
10
  ## Install
6
11
 
@@ -27,13 +32,13 @@ The minified files can be loaded from jsDelivr without installing anything.
27
32
  <meta charset="utf-8">
28
33
  <meta name="viewport" content="width=device-width, initial-scale=1">
29
34
  <title>Chroniko</title>
30
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/chroniko@0.2.0/dist/chroniko.min.css">
35
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/chroniko@0.2.1/dist/chroniko.min.css">
31
36
  </head>
32
37
  <body>
33
38
  <div id="timeline"></div>
34
39
 
35
40
  <script type="module">
36
- import { Chroniko } from 'https://cdn.jsdelivr.net/npm/chroniko@0.2.0/dist/chroniko.min.js';
41
+ import { Chroniko } from 'https://cdn.jsdelivr.net/npm/chroniko@0.2.1/dist/chroniko.min.js';
37
42
 
38
43
  const timeline = new Chroniko('#timeline', {
39
44
  events: [
@@ -85,7 +90,7 @@ Ids must be unique. If two events end up with the same id, whether given or gene
85
90
  | `syncUrl` | `boolean` | no | `false` | Keep the view, selection and hidden categories in the URL hash. See [Sharing](#sharing). |
86
91
  | `storyPosition` | `'below' \| 'right'` | no | `'below'` | Where the [story](#story-view) goes. See [Story beside the timeline](#story-beside-the-timeline). |
87
92
  | `split` | `number` | no | `0.6` | With `storyPosition: 'right'`, the timeline's share of the width, between 0 and 1 (exclusive). The story gets the rest. |
88
- | `textSizeToggle` | `boolean` | no | `false` | Show an **Aa** button in the toolbar that switches the event and category labels from 13px to 14px and the time axis labels from 12px to 13px. |
93
+ | `textSizeToggle` | `boolean` | no | `false` | Show an **Aa** button in the toolbar that switches the event and category labels from 13px to 14px and the time axis labels from 12px to 13px. Text in the story and the toolbar buttons also grows by 1px. |
89
94
  | `language` | `string` | no | `'en'` | Language of the timeline's own text and dates. See [Languages](#languages). An unknown code throws. |
90
95
  | `uiText` | `object` | no | N/A | Replaces individual UI strings of the chosen language. See [Languages](#languages). |
91
96
  | `categoryLabels` | `object` | no | `{}` | Category → text shown in the legend and on cards, e.g. `{ war: '戰爭' }`. Categories without a label show their name. |
package/dist/chroniko.min.css CHANGED
@@ -1 +1 @@
1
- .chroniko{--ck-height:420px;--ck-sticky-top:0px;--ck-bg:#fff;--ck-surface:#f6f7f9;--ck-fg:#1f2328;--ck-muted:#656d76;--ck-border:#d8dee4;--ck-grid:#eef1f4;--ck-focus:#0969da;background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:8px;color:var(--ck-fg);font:13px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}@media (prefers-color-scheme:dark){.chroniko{--ck-bg:#0d1117;--ck-surface:#161b22;--ck-fg:#e6edf3;--ck-muted:#8d96a0;--ck-border:#30363d;--ck-grid:#1c2128;--ck-focus:#4493f8}}.chroniko button{color:inherit;font:inherit}.ck-toolbar{align-items:center;background:var(--ck-surface);border-bottom:1px solid var(--ck-border);gap:8px;justify-content:space-between;padding:8px 12px}.ck-legend,.ck-toolbar{display:flex;flex-wrap:wrap}.ck-legend{gap:6px}.ck-legend-item{align-items:center;background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:999px;cursor:pointer;display:inline-flex;gap:6px;padding:3px 10px;text-transform:capitalize}.ck-legend-item[aria-pressed=false]{color:var(--ck-muted);opacity:.6}.ck-swatch{background:var(--ck-color);border:2px solid var(--ck-color);border-radius:50%;box-sizing:border-box;height:10px;width:10px}.ck-legend-item[aria-pressed=false] .ck-swatch{background:transparent}.ck-controls{display:flex;gap:4px}.ck-controls button{background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:6px;cursor:pointer;height:28px;min-width:30px;padding:0 8px}.ck-controls button[aria-pressed=true]{border-color:var(--ck-focus);color:var(--ck-focus)}.ck-controls button:hover,.ck-legend-item:hover{border-color:var(--ck-muted)}.ck-viewport{cursor:grab;height:var(--ck-height);overflow:hidden;position:relative;touch-action:pan-y;user-select:none}.ck-viewport.ck-dragging{cursor:grabbing}.ck-viewport:after{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--ck-focus) 40%,transparent);content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .15s;z-index:2}.ck-viewport:focus-within:after{opacity:1}.chroniko .ck-viewport:focus-visible{outline:none}.ck-viewport:focus-visible:after{box-shadow:inset 0 0 0 2px var(--ck-focus)}.ck-hint{background:color-mix(in srgb,var(--ck-fg) 85%,transparent);border-radius:6px;color:var(--ck-bg);left:50%;opacity:0;padding:6px 12px;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity .2s;white-space:nowrap;z-index:1}.ck-hint.ck-visible{opacity:1}.chroniko :focus-visible{outline:2px solid var(--ck-focus);outline-offset:-2px}.ck-grid{inset:0;pointer-events:none;position:absolute}.ck-gridline{background:var(--ck-grid);bottom:0;position:absolute;top:0;width:1px}.ck-lanes{font-weight:500;inset:0 0 32px 0;overflow:hidden auto;position:absolute}.ck-large-text .ck-lanes,.ck-large-text .ck-legend-item{font-size:14px}.ck-large-text .ck-tick{font-size:13px}.ck-lanes-inner{position:relative}.ck-axis{background:var(--ck-bg);border-top:1px solid var(--ck-border);bottom:0;height:32px;left:0;position:absolute;right:0}.ck-tick{color:var(--ck-muted);font-size:12px;font-variant-numeric:tabular-nums;padding-top:8px;position:absolute;top:0;transform:translateX(-50%);white-space:nowrap}.ck-tick:before{background:var(--ck-border);content:"";height:5px;left:50%;position:absolute;top:0;width:1px}.ck-event{background:none;border:0;cursor:pointer;height:22px;margin:0;padding:0;position:absolute;text-align:left}.ck-event,.ck-label{white-space:nowrap}.ck-event:hover .ck-label{text-decoration:underline}.ck-range{background:color-mix(in srgb,var(--ck-color) 22%,transparent);border-left:3px solid var(--ck-color);border-radius:4px}.ck-range .ck-label{position:absolute;top:50%;transform:translateY(-50%)}.ck-range.ck-selected{box-shadow:0 0 0 2px var(--ck-color)}.ck-point{align-items:center;display:flex;gap:6px}.ck-dot{background:var(--ck-color);border-radius:50%;box-shadow:0 0 0 2px var(--ck-bg);flex:none;height:10px;width:10px}.ck-point.ck-selected .ck-dot{box-shadow:0 0 0 2px var(--ck-bg),0 0 0 4px var(--ck-color)}.ck-event.ck-hover{z-index:1}.ck-event.ck-hover .ck-label{text-decoration:underline}.ck-range.ck-hover{background:color-mix(in srgb,var(--ck-color) 40%,transparent)}.ck-point.ck-hover .ck-dot{transform:scale(1.3)}.ck-event.ck-flash{animation:ck-event-flash 1.5s ease-out;border-radius:6px;z-index:1}@keyframes ck-event-flash{0%,40%{box-shadow:0 0 0 4px color-mix(in srgb,var(--ck-color) 60%,transparent)}to{box-shadow:0 0 0 4px transparent}}@media (prefers-reduced-motion:reduce){.ck-event.ck-flash{animation-timing-function:step-end}}.ck-story{background:var(--ck-surface);border-top:1px solid var(--ck-border);padding:12px 16px 16px}.ck-story[hidden]{display:none}.ck-story-header{align-items:center;display:flex;gap:8px;justify-content:space-between}.ck-story-title{font-weight:600}.ck-count{background:var(--ck-border);border-radius:999px;font-size:12px;font-weight:500;margin-left:4px;padding:0 7px}.chroniko .ck-clear{background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:6px;cursor:pointer;padding:3px 10px}.chroniko .ck-clear:hover{border-color:var(--ck-muted)}.ck-story-list{list-style:none;margin:0;padding:0 0 0 20px;position:relative}.ck-card{background:var(--ck-bg);border:1px solid var(--ck-border);border-left:3px solid var(--ck-color);border-radius:6px;margin-top:10px;padding:10px 44px 12px 14px;position:relative}.ck-card:before{background:var(--ck-color);border-radius:50%;box-shadow:0 0 0 2px var(--ck-surface);content:"";height:10px;left:-22px;position:absolute;top:15px;width:10px}.ck-story-list>li:not(:last-child):after{background:var(--ck-border);bottom:-26px;content:"";left:-18px;position:absolute;top:25px;width:2px}.ck-card:focus{outline:none}.ck-card.ck-flash{animation:ck-flash 1.2s ease-out}@keyframes ck-flash{0%{box-shadow:0 0 0 3px color-mix(in srgb,var(--ck-color) 55%,transparent)}to{box-shadow:0 0 0 3px transparent}}@media (prefers-reduced-motion:reduce){.ck-card.ck-flash{animation-duration:.01ms;outline:2px solid var(--ck-color)}}.ck-end{margin-top:10px;position:relative}.ck-end:before{background:var(--ck-surface);border:2px solid var(--ck-color);border-radius:50%;content:"";height:6px;left:-19px;position:absolute;top:13px;width:6px}.ck-story-list>.ck-end:not(:last-child):after{left:-15px;top:23px}.chroniko .ck-end-jump{align-items:baseline;background:none;border:1px dashed var(--ck-border);border-left:3px solid color-mix(in srgb,var(--ck-color) 50%,transparent);border-radius:6px;color:var(--ck-muted);cursor:pointer;display:flex;flex-wrap:wrap;font:inherit;font-size:13px;gap:4px 10px;padding:6px 14px;text-align:left;width:100%}.chroniko .ck-end-jump.ck-hover,.chroniko .ck-end-jump:hover{border-color:var(--ck-muted);border-left-color:var(--ck-color)}.ck-end-jump strong{color:var(--ck-fg);font-weight:600}.ck-end-date,.ck-end-duration,.ck-meta{font-size:12px}.ck-meta{align-items:center;color:var(--ck-muted);display:flex;flex-wrap:wrap;gap:8px}.ck-badge{background:color-mix(in srgb,var(--ck-color) 22%,transparent);border-radius:999px;color:var(--ck-fg);padding:1px 8px;text-transform:capitalize}.ck-title{font-size:16px;margin:4px 0 2px}.ck-description{margin:4px 0 0;max-width:70ch}.ck-card.ck-hover{border-color:color-mix(in srgb,var(--ck-color) 60%,var(--ck-border));border-left-color:var(--ck-color)}.ck-card-actions{align-items:center;display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:6px}.chroniko .ck-locate,.ck-link{color:var(--ck-focus)}.chroniko .ck-locate{background:none;border:0;cursor:pointer;padding:0}.chroniko .ck-locate:hover{text-decoration:underline}.chroniko .ck-remove{background:none;border:0;border-radius:6px;color:var(--ck-muted);cursor:pointer;font-size:20px;height:28px;line-height:1;position:absolute;right:10px;top:8px;width:28px}.chroniko .ck-remove:hover{background:var(--ck-border)}.chroniko.ck-side{container:chroniko/inline-size;overflow:clip}.ck-side .ck-layout{display:grid;grid-template-columns:calc(var(--ck-split)*100%) minmax(0,1fr)}.ck-side .ck-main{align-self:start;min-width:0;position:sticky;top:var(--ck-sticky-top)}.ck-side .ck-story{border-left:1px solid var(--ck-border);border-top:0;min-width:0}.ck-story-placeholder{color:var(--ck-muted);margin:0}@container chroniko (max-width: 640px){.ck-side .ck-layout{display:block}.ck-side .ck-main{position:static}.ck-side .ck-story{border-left:0;border-top:1px solid var(--ck-border)}.ck-side .ck-story.ck-empty{display:none}}
1
+ .chroniko{--ck-height:420px;--ck-sticky-top:0px;--ck-bg:#fff;--ck-surface:#f6f7f9;--ck-fg:#1f2328;--ck-muted:#656d76;--ck-border:#d8dee4;--ck-grid:#eef1f4;--ck-focus:#0969da;background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:8px;color:var(--ck-fg);font:13px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}@media (prefers-color-scheme:dark){.chroniko{--ck-bg:#0d1117;--ck-surface:#161b22;--ck-fg:#e6edf3;--ck-muted:#8d96a0;--ck-border:#30363d;--ck-grid:#1c2128;--ck-focus:#4493f8}}.chroniko button{color:inherit;font:inherit}.ck-toolbar{align-items:center;background:var(--ck-surface);border-bottom:1px solid var(--ck-border);gap:8px;justify-content:space-between;padding:8px 12px}.ck-legend,.ck-toolbar{display:flex;flex-wrap:wrap}.ck-legend{gap:6px}.ck-legend-item{align-items:center;background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:999px;cursor:pointer;display:inline-flex;gap:6px;padding:3px 10px;text-transform:capitalize}.ck-legend-item[aria-pressed=false]{color:var(--ck-muted);opacity:.6}.ck-swatch{background:var(--ck-color);border:2px solid var(--ck-color);border-radius:50%;box-sizing:border-box;height:10px;width:10px}.ck-legend-item[aria-pressed=false] .ck-swatch{background:transparent}.ck-controls{display:flex;gap:4px}.ck-controls button{background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:6px;cursor:pointer;height:28px;min-width:30px;padding:0 8px}.ck-controls button[aria-pressed=true]{border-color:var(--ck-focus);color:var(--ck-focus)}.ck-controls button:hover,.ck-legend-item:hover{border-color:var(--ck-muted)}.ck-viewport{cursor:grab;height:var(--ck-height);overflow:hidden;position:relative;touch-action:pan-y;user-select:none}.ck-viewport.ck-dragging{cursor:grabbing}.ck-viewport:after{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--ck-focus) 40%,transparent);content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .15s;z-index:2}.ck-viewport:focus-within:after{opacity:1}.chroniko .ck-viewport:focus-visible{outline:none}.ck-viewport:focus-visible:after{box-shadow:inset 0 0 0 2px var(--ck-focus)}.ck-hint{background:color-mix(in srgb,var(--ck-fg) 85%,transparent);border-radius:6px;color:var(--ck-bg);left:50%;opacity:0;padding:6px 12px;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:opacity .2s;white-space:nowrap;z-index:1}.ck-hint.ck-visible{opacity:1}.chroniko :focus-visible{outline:2px solid var(--ck-focus);outline-offset:-2px}.ck-grid{inset:0;pointer-events:none;position:absolute}.ck-gridline{background:var(--ck-grid);bottom:0;position:absolute;top:0;width:1px}.ck-lanes{font-weight:500;inset:0 0 32px 0;overflow:hidden auto;position:absolute}.ck-large-text .ck-lanes,.ck-large-text .ck-legend-item{font-size:14px}.ck-large-text .ck-tick{font-size:13px}.ck-lanes-inner{position:relative}.ck-axis{background:var(--ck-bg);border-top:1px solid var(--ck-border);bottom:0;height:32px;left:0;position:absolute;right:0}.ck-tick{color:var(--ck-muted);font-size:12px;font-variant-numeric:tabular-nums;padding-top:8px;position:absolute;top:0;transform:translateX(-50%);white-space:nowrap}.ck-tick:before{background:var(--ck-border);content:"";height:5px;left:50%;position:absolute;top:0;width:1px}.ck-event{background:none;border:0;cursor:pointer;height:22px;margin:0;padding:0;position:absolute;text-align:left}.ck-event,.ck-label{white-space:nowrap}.ck-event:hover .ck-label{text-decoration:underline}.ck-range{background:color-mix(in srgb,var(--ck-color) 22%,transparent);border-left:3px solid var(--ck-color);border-radius:4px}.ck-range .ck-label{position:absolute;top:50%;transform:translateY(-50%)}.ck-range.ck-selected{box-shadow:0 0 0 2px var(--ck-color)}.ck-point{align-items:center;display:flex;gap:6px}.ck-dot{background:var(--ck-color);border-radius:50%;box-shadow:0 0 0 2px var(--ck-bg);flex:none;height:10px;width:10px}.ck-point.ck-selected .ck-dot{box-shadow:0 0 0 2px var(--ck-bg),0 0 0 4px var(--ck-color)}.ck-event.ck-hover{z-index:1}.ck-event.ck-hover .ck-label{text-decoration:underline}.ck-range.ck-hover{background:color-mix(in srgb,var(--ck-color) 40%,transparent)}.ck-point.ck-hover .ck-dot{transform:scale(1.3)}.ck-event.ck-flash{animation:ck-event-flash 1.5s ease-out;border-radius:6px;z-index:1}@keyframes ck-event-flash{0%,40%{box-shadow:0 0 0 4px color-mix(in srgb,var(--ck-color) 60%,transparent)}to{box-shadow:0 0 0 4px transparent}}@media (prefers-reduced-motion:reduce){.ck-event.ck-flash{animation-timing-function:step-end}}.ck-story{background:var(--ck-surface);border-top:1px solid var(--ck-border);padding:12px 16px 16px}.ck-story[hidden]{display:none}.ck-story-header{align-items:center;display:flex;gap:8px;justify-content:space-between}.ck-story-title{font-weight:600}.ck-count{background:var(--ck-border);border-radius:999px;font-size:12px;font-weight:500;margin-left:4px;padding:0 7px}.chroniko .ck-clear{background:var(--ck-bg);border:1px solid var(--ck-border);border-radius:6px;cursor:pointer;padding:3px 10px}.chroniko .ck-clear:hover{border-color:var(--ck-muted)}.ck-story-list{list-style:none;margin:0;padding:0 0 0 20px;position:relative}.ck-card{background:var(--ck-bg);border:1px solid var(--ck-border);border-left:3px solid var(--ck-color);border-radius:6px;margin-top:10px;padding:10px 44px 12px 14px;position:relative}.ck-card:before{background:var(--ck-color);border-radius:50%;box-shadow:0 0 0 2px var(--ck-surface);content:"";height:10px;left:-22px;position:absolute;top:15px;width:10px}.ck-story-list>li:not(:last-child):after{background:var(--ck-border);bottom:-26px;content:"";left:-18px;position:absolute;top:25px;width:2px}.ck-card:focus{outline:none}.ck-card.ck-flash{animation:ck-flash 1.2s ease-out}@keyframes ck-flash{0%{box-shadow:0 0 0 3px color-mix(in srgb,var(--ck-color) 55%,transparent)}to{box-shadow:0 0 0 3px transparent}}@media (prefers-reduced-motion:reduce){.ck-card.ck-flash{animation-duration:.01ms;outline:2px solid var(--ck-color)}}.ck-end{margin-top:10px;position:relative}.ck-end:before{background:var(--ck-surface);border:2px solid var(--ck-color);border-radius:50%;content:"";height:6px;left:-19px;position:absolute;top:13px;width:6px}.ck-story-list>.ck-end:not(:last-child):after{left:-15px;top:23px}.chroniko .ck-end-jump{align-items:baseline;background:none;border:1px dashed var(--ck-border);border-left:3px solid color-mix(in srgb,var(--ck-color) 50%,transparent);border-radius:6px;color:var(--ck-muted);cursor:pointer;display:flex;flex-wrap:wrap;font:inherit;font-size:13px;gap:4px 10px;padding:6px 14px;text-align:left;width:100%}.chroniko .ck-end-jump.ck-hover,.chroniko .ck-end-jump:hover{border-color:var(--ck-muted);border-left-color:var(--ck-color)}.ck-end-jump strong{color:var(--ck-fg);font-weight:600}.ck-end-date,.ck-end-duration,.ck-meta{font-size:12px}.ck-meta{align-items:center;color:var(--ck-muted);display:flex;flex-wrap:wrap;gap:8px}.ck-badge{background:color-mix(in srgb,var(--ck-color) 22%,transparent);border-radius:999px;color:var(--ck-fg);padding:1px 8px;text-transform:capitalize}.ck-title{font-size:16px;margin:4px 0 2px}.ck-description{margin:4px 0 0;max-width:70ch}.ck-card.ck-hover{border-color:color-mix(in srgb,var(--ck-color) 60%,var(--ck-border));border-left-color:var(--ck-color)}.ck-card-actions{align-items:center;display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:6px}.chroniko .ck-locate,.ck-link{color:var(--ck-focus)}.chroniko .ck-locate{background:none;border:0;cursor:pointer;padding:0}.chroniko .ck-locate:hover{text-decoration:underline}.chroniko .ck-remove{background:none;border:0;border-radius:6px;color:var(--ck-muted);cursor:pointer;font-size:20px;height:28px;line-height:1;position:absolute;right:10px;top:8px;width:28px}.chroniko .ck-remove:hover{background:var(--ck-border)}.ck-large-text .ck-controls,.ck-large-text .ck-story{font-size:14px}.ck-large-text .ck-count,.ck-large-text .ck-end-date,.ck-large-text .ck-end-duration,.ck-large-text .ck-meta{font-size:13px}.ck-large-text .ck-end-jump{font-size:14px}.ck-large-text .ck-title{font-size:17px}.ck-large-text .ck-remove{font-size:21px}.chroniko.ck-side{container:chroniko/inline-size;overflow:clip}.ck-side .ck-layout{display:grid;grid-template-columns:calc(var(--ck-split)*100%) minmax(0,1fr)}.ck-side .ck-main{align-self:start;min-width:0;position:sticky;top:var(--ck-sticky-top)}.ck-side .ck-story{border-left:1px solid var(--ck-border);border-top:0;min-width:0}.ck-story-placeholder{color:var(--ck-muted);margin:0}@container chroniko (max-width: 640px){.ck-side .ck-layout{display:block}.ck-side .ck-main{position:static}.ck-side .ck-story{border-left:0;border-top:1px solid var(--ck-border)}.ck-side .ck-story.ck-empty{display:none}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "chroniko",
3
- "version": "0.2.0",
3
+ "version": "0.2.1",
4
4
  "description": "Render historical events on a single zoomable time axis. Plain HTML, CSS and JavaScript, no dependencies.",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",