mirror of
https://gitlab.com/arnekeller/trilium-timeline.git
synced 2024-11-25 02:15:05 +00:00
Update !!!meta.json, README.md, and 12 more files...
This commit is contained in:
Quentin Le Caignec
parent
6edf300f7c
commit
94490b83fa
328
!!!meta.json
328
!!!meta.json
@ -1,328 +0,0 @@
|
||||
{
|
||||
"formatVersion": 1,
|
||||
"appVersion": "0.45.9",
|
||||
"files": [
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "88wRRr8JFs9w",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w"
|
||||
],
|
||||
"title": "Timeline Widget",
|
||||
"notePosition": 70,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "render",
|
||||
"mime": "text/html",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "label",
|
||||
"name": "hideChildrenOverview",
|
||||
"value": "",
|
||||
"isInheritable": false,
|
||||
"position": 10
|
||||
},
|
||||
{
|
||||
"type": "relation",
|
||||
"name": "renderNote",
|
||||
"value": "K4zWN9M9WFWa",
|
||||
"isInheritable": false,
|
||||
"position": 20
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "iconClass",
|
||||
"value": "bx bxs-calendar",
|
||||
"isInheritable": false,
|
||||
"position": 30
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "label:timeline_start",
|
||||
"value": "promoted,single,text",
|
||||
"isInheritable": false,
|
||||
"position": 40
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "label:timeline_end",
|
||||
"value": "promoted,single,text",
|
||||
"isInheritable": false,
|
||||
"position": 50
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "label:timeline_present",
|
||||
"value": "promoted,single,text",
|
||||
"isInheritable": false,
|
||||
"position": 60
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "timeline_start",
|
||||
"value": "2020",
|
||||
"isInheritable": false,
|
||||
"position": 70
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "timeline_end",
|
||||
"value": "2050",
|
||||
"isInheritable": false,
|
||||
"position": 80
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "timeline_present",
|
||||
"value": "2021",
|
||||
"isInheritable": false,
|
||||
"position": 90
|
||||
}
|
||||
],
|
||||
"dirFileName": "Timeline Widget",
|
||||
"children": [
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "K4zWN9M9WFWa",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"K4zWN9M9WFWa"
|
||||
],
|
||||
"title": "render.html",
|
||||
"notePosition": 5,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "code",
|
||||
"mime": "text/html",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "label",
|
||||
"name": "archived",
|
||||
"value": "",
|
||||
"isInheritable": false,
|
||||
"position": 10
|
||||
}
|
||||
],
|
||||
"dataFileName": "render.html",
|
||||
"dirFileName": "1_render.html",
|
||||
"children": [
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "WfNOCj0WIe1V",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"K4zWN9M9WFWa",
|
||||
"WfNOCj0WIe1V"
|
||||
],
|
||||
"title": "script.js",
|
||||
"notePosition": 153,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "code",
|
||||
"mime": "application/javascript;env=frontend",
|
||||
"attributes": [],
|
||||
"dataFileName": "script.js",
|
||||
"dirFileName": "1_script.js",
|
||||
"children": [
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "mmW5usFcw0yu",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"K4zWN9M9WFWa",
|
||||
"WfNOCj0WIe1V",
|
||||
"mmW5usFcw0yu"
|
||||
],
|
||||
"title": "moment.min.js",
|
||||
"notePosition": 123,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "file",
|
||||
"mime": "application/javascript",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "label",
|
||||
"name": "originalFileName",
|
||||
"value": "moment.min.js",
|
||||
"isInheritable": false,
|
||||
"position": 1000
|
||||
}
|
||||
],
|
||||
"dataFileName": "moment.min.js"
|
||||
},
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "Cy3lxle7k81w",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"K4zWN9M9WFWa",
|
||||
"WfNOCj0WIe1V",
|
||||
"Cy3lxle7k81w"
|
||||
],
|
||||
"title": "vis.min.js",
|
||||
"notePosition": 133,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "file",
|
||||
"mime": "application/javascript",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "label",
|
||||
"name": "originalFileName",
|
||||
"value": "vis.min.js",
|
||||
"isInheritable": false,
|
||||
"position": 1000
|
||||
}
|
||||
],
|
||||
"dataFileName": "vis.min.js"
|
||||
},
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "6H1kgqEVe6aV",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"K4zWN9M9WFWa",
|
||||
"WfNOCj0WIe1V",
|
||||
"6H1kgqEVe6aV"
|
||||
],
|
||||
"title": "vis-timeline-graph2d.min.js",
|
||||
"notePosition": 143,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "file",
|
||||
"mime": "application/javascript",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "label",
|
||||
"name": "originalFileName",
|
||||
"value": "vis-timeline-graph2d.min.js",
|
||||
"isInheritable": false,
|
||||
"position": 1000
|
||||
}
|
||||
],
|
||||
"dataFileName": "vis-timeline-graph2d.min.js"
|
||||
},
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "mqnQgjq1H3PN",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"K4zWN9M9WFWa",
|
||||
"WfNOCj0WIe1V",
|
||||
"mqnQgjq1H3PN"
|
||||
],
|
||||
"title": "vis.min.css",
|
||||
"notePosition": 153,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "file",
|
||||
"mime": "text/css",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "label",
|
||||
"name": "originalFileName",
|
||||
"value": "vis.min.css",
|
||||
"isInheritable": false,
|
||||
"position": 10
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "appCss",
|
||||
"value": "",
|
||||
"isInheritable": false,
|
||||
"position": 20
|
||||
}
|
||||
],
|
||||
"dataFileName": "vis.min.css"
|
||||
},
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "pAtCFHdWtxQj",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"K4zWN9M9WFWa",
|
||||
"WfNOCj0WIe1V",
|
||||
"pAtCFHdWtxQj"
|
||||
],
|
||||
"title": "vis-timeline-graph2d.min.css",
|
||||
"notePosition": 163,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "file",
|
||||
"mime": "text/css",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "label",
|
||||
"name": "originalFileName",
|
||||
"value": "vis-timeline-graph2d.min.css",
|
||||
"isInheritable": false,
|
||||
"position": 10
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "appCss",
|
||||
"value": "",
|
||||
"isInheritable": false,
|
||||
"position": 20
|
||||
}
|
||||
],
|
||||
"dataFileName": "vis-timeline-graph2d.min.css"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"isClone": false,
|
||||
"noteId": "JcAPShvMupkV",
|
||||
"notePath": [
|
||||
"88wRRr8JFs9w",
|
||||
"JcAPShvMupkV"
|
||||
],
|
||||
"title": "button.js",
|
||||
"notePosition": 15,
|
||||
"prefix": null,
|
||||
"isExpanded": 0,
|
||||
"type": "code",
|
||||
"mime": "application/javascript;env=frontend",
|
||||
"attributes": [
|
||||
{
|
||||
"type": "relation",
|
||||
"name": "targetNote",
|
||||
"value": "88wRRr8JFs9w",
|
||||
"isInheritable": false,
|
||||
"position": 10
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "run",
|
||||
"value": "frontendStartup",
|
||||
"isInheritable": false,
|
||||
"position": 20
|
||||
},
|
||||
{
|
||||
"type": "label",
|
||||
"name": "archived",
|
||||
"value": "",
|
||||
"isInheritable": false,
|
||||
"position": 30
|
||||
}
|
||||
],
|
||||
"dataFileName": "button.js"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"noImport": true,
|
||||
"dataFileName": "navigation.html"
|
||||
},
|
||||
{
|
||||
"noImport": true,
|
||||
"dataFileName": "index.html"
|
||||
},
|
||||
{
|
||||
"noImport": true,
|
||||
"dataFileName": "style.css"
|
||||
}
|
||||
]
|
||||
}
|
||||
20
README.md
20
README.md
@ -10,4 +10,22 @@ Used for my own personal purposes (prepping and tracking a Pathfinder 2e tableto
|
||||
|
||||
## Install
|
||||
|
||||
Zip this source into a .zip file and import it into Trilium Notes (right-click into the tree sidebar -> Import).
|
||||
Download this repo and extract it.
|
||||
Inside of Trilium, right click the folder you want to import into and click "Import into Note" at the bottom.
|
||||
Select the "Timeline Widget Import.zip" archive.
|
||||
Import without changing any of the the default options (although if you get issues maybe try unchecking stuff like Safe Import which i'm assuming can sometimes decide to not import things as they are, although I've never had problems).
|
||||
The Timeline Widget is then imported but nothing is displayed yet, as indicated by the message "Render HTML doesn't have required relation to function properly", because the renderNote attribute has been automatically disabled on import. To fix this, go to the Owned attributes tab at the top and look for "~disabled:renderNote=render.html", normally the last attribute in the list. Click on it and remove the "disabled:" part so as to have "renderNote" as the attribute name. Save and now the widget should display.
|
||||
|
||||
## Usage
|
||||
|
||||
The widget fetches notes with a "date_start" label attribute (and treats them as events of various types), and "date_birth"/"date_death" label attributes (and treats them as date of birth/death "agent" events).
|
||||
A note can also contain a "date_type" label attribute that sorts it into different categories. The existing ones (the ones I need, you will need to change them in "script.js" if you want your own) are "session", "astrological", "player", "omen", "agent", "local", "global" and "era". All of those have their own toggle button to show/hide the events under that category.
|
||||
The "era" type is special and will be displayed as a block in the background of the global events category (used for large ranges of years).
|
||||
|
||||
The widget has 3 label promoted attributes (of type Text and not Date to be able to enter hours/minutes/seconds) that can be configured, they are all in the format "YYYY-MM-DD:hh:mm:ss" but you can enter simply "YYYY", or "YYYY-MM-DD:hh" and not the entire date.
|
||||
They are as follows :
|
||||
|
||||
- "timeline_start" and "timeline_end" are the range of dates where the view STARTS, to be able to determine where (and how "zoomed-in") you want the timeline to be when loading the widget. You may still scroll and drag to the rest of the full timeline, this only affects the visible part of the timeline in the view when loading.
|
||||
- "timeline_present" optionally shows a red vertical line indicating where the "present" is if you need a timeline where the present isn't actually the present (in my case, to represent the present within the setting of a tabletop campaign, which I change session to session). Be aware this line doesn't stay still, so if you stay on the widget for some time you will notice it moves ahead in real time, but of course resets every time you load/render the widget.
|
||||
|
||||
The events showing up on the timeline can be hovered and clicked.
|
||||
|
||||
BIN
Timeline Widget Import.zip
Normal file
BIN
Timeline Widget Import.zip
Normal file
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,138 +0,0 @@
|
||||
// Initialize libraries and context
|
||||
var vis = require('vis.min.js');
|
||||
var moment = require('moment.min.js');
|
||||
var container = document.getElementById("timeline");
|
||||
|
||||
// Get notes with specific labels
|
||||
const events = await api.runOnServer(() => {
|
||||
const event_notes = api.getNotesWithLabel('date_start');
|
||||
const agent_notes = api.getNotesWithLabel('date_birth');
|
||||
const events = [];
|
||||
for (const note of event_notes) {
|
||||
const id = note.noteId;
|
||||
const content = note.title;
|
||||
const start = note.getLabelValue('date_start');
|
||||
const end = note.getLabelValue('date_end');
|
||||
const group = note.getLabelValue('date_type');
|
||||
if (content && start) {
|
||||
events.push({ id, content, start, end, group });
|
||||
}
|
||||
}
|
||||
for (const note of agent_notes) {
|
||||
const id = note.noteId;
|
||||
const start = note.getLabelValue('date_birth');
|
||||
const end = note.getLabelValue('date_death');
|
||||
const group = note.getLabelValue('date_type') ? note.getLabelValue('date_type') : 'agent';
|
||||
if (start) {
|
||||
const content = note.title + ' (Naissance)';
|
||||
events.push({ id, content, start, group });
|
||||
}
|
||||
if (end) {
|
||||
const content = note.title + ' (Mort)';
|
||||
events.push({ id, content, end, group });
|
||||
}
|
||||
}
|
||||
return events;
|
||||
});
|
||||
|
||||
// Create groups
|
||||
var groups = new vis.DataSet([
|
||||
{id: 0, order: 2, content:'Évenements', visible: true}, // 'default'
|
||||
// {id: 1, order: 5, content:'Âge', visible: false}, // 'era'
|
||||
{id: 2, order: 4, content:'Astrologique/Fêtes', visible: true}, // 'astrological'
|
||||
{id: 3, order: 1, content:'Agents', visible: true}, // 'agent'
|
||||
{id: 4, order: 0, content:'Joueurs', visible: true}, // 'player'
|
||||
{id: 5, order: 5, content:'Sessions', visible: true}, // 'session'
|
||||
{id: 6, order: 3, content:'Prophéties', visible: true}, // 'session'
|
||||
]);
|
||||
|
||||
// Create a DataSet, change groups/type with custom logic
|
||||
var items = new vis.DataSet();
|
||||
for (var i = 0; i < events.length; i++) {
|
||||
var note_id = events[i].id;
|
||||
var note_link = await api.createNoteLink(note_id);
|
||||
var event_content = events[i].content;
|
||||
note_link[0].firstChild.innerText = event_content;
|
||||
var event_start = vis.moment(events[i].start);
|
||||
var event_end = events[i].end ? vis.moment(events[i].end) : null;
|
||||
// If no group is set, default
|
||||
var event_groupName = events[i].group ? events[i].group : 'default';
|
||||
// Change 'era' type dates to appear in the background
|
||||
var event_type = (event_groupName == 'era') ? 'background' : null;
|
||||
// Convert group names into IDs
|
||||
var event_group = (event_groupName == 'default') ? 0 :
|
||||
(event_groupName == 'era') ? 1 :
|
||||
(event_groupName == 'astrological') ? 2 :
|
||||
(event_groupName == 'agent') ? 3 :
|
||||
(event_groupName == 'player') ? 4 :
|
||||
(event_groupName == 'session') ? 5 :
|
||||
(event_groupName == 'prophecy') ? 6 : 0;
|
||||
var event_style = events[i].style ? events[i].style : null;
|
||||
items.add({
|
||||
id: i,
|
||||
content: note_link[0].firstChild,
|
||||
start: event_start,
|
||||
end: event_end,
|
||||
group: (event_group == 1) ? 5 : event_group, // force change specific notes into other group
|
||||
type: event_type,
|
||||
className: event_groupName,
|
||||
style: event_style,
|
||||
});
|
||||
}
|
||||
|
||||
const timeline_options = await api.runOnServer(() => {
|
||||
const parentNote = api.startNote.getParentNotes()[0];
|
||||
const timeline_start = parentNote.getLabelValue('timeline_start');
|
||||
const timeline_end = parentNote.getLabelValue('timeline_end');
|
||||
const timeline_present = parentNote.getLabelValue('timeline_present');
|
||||
return {timeline_start, timeline_end, timeline_present};
|
||||
});
|
||||
console.log(timeline_options);
|
||||
|
||||
// Timeline options
|
||||
var options = {
|
||||
clickToUse: false,
|
||||
showCurrentTime: true,
|
||||
minHeight: 750,
|
||||
maxHeight: 820,
|
||||
start: timeline_options.timeline_start,
|
||||
end: timeline_options.timeline_end,
|
||||
};
|
||||
|
||||
// Create Timeline
|
||||
var timeline = new vis.Timeline(container, items, groups, options);
|
||||
// Add present time marker based on "timeline_present" label
|
||||
timeline.setCurrentTime(timeline_options.timeline_present);
|
||||
|
||||
|
||||
// Set specific groups as hidden by default
|
||||
toggleGroupVisibility(2);
|
||||
toggleGroupVisibility(6);
|
||||
|
||||
// Toggle buttons
|
||||
document.getElementById('toggle_players').onclick = function () {
|
||||
toggleGroupVisibility(4); // players
|
||||
};
|
||||
document.getElementById('toggle_agents').onclick = function () {
|
||||
toggleGroupVisibility(3); // agents
|
||||
};
|
||||
document.getElementById('toggle_events').onclick = function () {
|
||||
toggleGroupVisibility(0); // events
|
||||
};
|
||||
document.getElementById('toggle_prophecies').onclick = function () {
|
||||
toggleGroupVisibility(6); // prophecies
|
||||
};
|
||||
document.getElementById('toggle_astros').onclick = function () {
|
||||
toggleGroupVisibility(2); // astrological
|
||||
};
|
||||
document.getElementById('toggle_sessions').onclick = function () {
|
||||
toggleGroupVisibility(5); // sessions
|
||||
};
|
||||
|
||||
|
||||
// Function to toggle group visibility
|
||||
function toggleGroupVisibility(group_id){
|
||||
var setting = groups.get({filter:function(item){return (item.id==group_id)}})[0].visible;
|
||||
groups.update({id: group_id, visible: !setting});
|
||||
timeline.setGroups(groups);
|
||||
}
|
||||
@ -1,6 +0,0 @@
|
||||
// Add UI Button shortcut
|
||||
api.addButtonToToolbar({
|
||||
title: 'Timeline',
|
||||
icon: 'bx bxs-calendar',
|
||||
action: async () => api.activateNote(await api.startNote.getRelationValue('targetNote'))
|
||||
});
|
||||
@ -1,107 +0,0 @@
|
||||
<div id="timeline">
|
||||
<div class="menu">
|
||||
<input type="button" id="toggle_players" value="Toggle Joueurs">
|
||||
<input type="button" id="toggle_agents" value="Toggle Agents">
|
||||
<input type="button" id="toggle_events" value="Toggle Évenements">
|
||||
<input type="button" id="toggle_prophecies" value="Toggle Prophéties">
|
||||
<input type="button" id="toggle_astros" value="Toggle Astrologique">
|
||||
<input type="button" id="toggle_sessions" value="Toggle Sessions">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
body, html {
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
/* button menu */
|
||||
.menu {
|
||||
z-index: 5;
|
||||
right: 2px;
|
||||
top: 140px;
|
||||
font-size: small;
|
||||
}
|
||||
.menu > input {
|
||||
border-color: gray;
|
||||
border-radius: 5px;
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
|
||||
/* add visible dotted line to ranges */
|
||||
.vis-item.vis-range {
|
||||
border-style: dotted !important;
|
||||
border-color: black !important;
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
/* change text and label color */
|
||||
.vis-text, .vis-label {
|
||||
color: lightgray !important;
|
||||
}
|
||||
|
||||
/* change link color */
|
||||
.vis-item-content > a {
|
||||
color: #1a1a1a;
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
/* custom event style */
|
||||
.default {
|
||||
background-color : brown;
|
||||
border-color : brown;
|
||||
}
|
||||
.era {
|
||||
/*background-color : brown;*/
|
||||
/*border-color : brown;*/
|
||||
}
|
||||
.player {
|
||||
background-color : orange;
|
||||
border-color: orange;
|
||||
}
|
||||
.agent {
|
||||
background-color: forestgreen;
|
||||
border-color: forestgreen;
|
||||
}
|
||||
.prophecy {
|
||||
background-color: blueviolet;
|
||||
border-color : blueviolet;
|
||||
}
|
||||
.astrological {
|
||||
background-color: royalblue;
|
||||
border-color : royalblue;
|
||||
}
|
||||
|
||||
/* change current time marker color */
|
||||
.vis-current-time {
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
/* alternating column backgrounds */
|
||||
.vis-time-axis .vis-grid.vis-odd {
|
||||
background: #424242;
|
||||
}
|
||||
|
||||
/* gray background in weekends, white text color */
|
||||
.vis-time-axis .vis-grid.vis-saturday,
|
||||
.vis-time-axis .vis-grid.vis-sunday {
|
||||
background: gray;
|
||||
}
|
||||
.vis-time-axis .vis-text.vis-saturday,
|
||||
.vis-time-axis .vis-text.vis-sunday {
|
||||
color: dimgray;
|
||||
}
|
||||
|
||||
/* interior grid color */
|
||||
.vis-grid.vis-minor {
|
||||
border-color: dimgray !important;
|
||||
}
|
||||
.vis-foreground .vis-group {
|
||||
border-color: dimgray !important;
|
||||
}
|
||||
|
||||
/* reduce padding */
|
||||
.vis-item .vis-item-content {
|
||||
padding: 2px;
|
||||
}
|
||||
</style>
|
||||
11
index.html
11
index.html
@ -1,11 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
<frameset cols="25%,75%">
|
||||
<frame name="navigation" src="navigation.html">
|
||||
<frame name="detail" src="Timeline%20Widget/render.html">
|
||||
</frameset>
|
||||
</html>
|
||||
@ -1,39 +0,0 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<ul>
|
||||
<li>Timeline Widget
|
||||
<ul>
|
||||
<li><a href="Timeline%20Widget/render.html" target="detail">render.html</a>
|
||||
<ul>
|
||||
<li><a href="Timeline%20Widget/1_render.html/script.js" target="detail">script.js</a>
|
||||
<ul>
|
||||
<li><a href="Timeline%20Widget/1_render.html/1_script.js/moment.min.js" target="detail">moment.min.js</a>
|
||||
</li>
|
||||
<li><a href="Timeline%20Widget/1_render.html/1_script.js/vis.min.js" target="detail">vis.min.js</a>
|
||||
</li>
|
||||
<li><a href="Timeline%20Widget/1_render.html/1_script.js/vis-timeline-graph2d.min.js"
|
||||
target="detail">vis-timeline-graph2d.min.js</a>
|
||||
</li>
|
||||
<li><a href="Timeline%20Widget/1_render.html/1_script.js/vis.min.css" target="detail">vis.min.css</a>
|
||||
</li>
|
||||
<li><a href="Timeline%20Widget/1_render.html/1_script.js/vis-timeline-graph2d.min.css"
|
||||
target="detail">vis-timeline-graph2d.min.css</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="Timeline%20Widget/button.js" target="detail">button.js</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
338
style.css
338
style.css
@ -1,338 +0,0 @@
|
||||
/* !!!!!! TRILIUM CUSTOM CHANGES !!!!!! */
|
||||
|
||||
.printed-content .ck-widget__selection-handle, .printed-content .ck-widget__type-around { /* gets rid of triangles: https://github.com/zadam/trilium/issues/1129 */
|
||||
display: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* CKEditor 5 (v23.1.0) content styles.
|
||||
* Generated on Thu, 29 Oct 2020 12:17:48 GMT.
|
||||
* For more information, check out https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/content-styles.html
|
||||
*/
|
||||
|
||||
:root {
|
||||
--ck-color-mention-background: hsla(341, 100%, 30%, 0.1);
|
||||
--ck-color-mention-text: hsl(341, 100%, 30%);
|
||||
--ck-highlight-marker-blue: hsl(201, 97%, 72%);
|
||||
--ck-highlight-marker-green: hsl(120, 93%, 68%);
|
||||
--ck-highlight-marker-pink: hsl(345, 96%, 73%);
|
||||
--ck-highlight-marker-yellow: hsl(60, 97%, 73%);
|
||||
--ck-highlight-pen-green: hsl(112, 100%, 27%);
|
||||
--ck-highlight-pen-red: hsl(0, 85%, 49%);
|
||||
--ck-image-style-spacing: 1.5em;
|
||||
--ck-todo-list-checkmark-size: 16px;
|
||||
}
|
||||
|
||||
/* ckeditor5-image/theme/imagestyle.css */
|
||||
.ck-content .image-style-side {
|
||||
float: right;
|
||||
margin-left: var(--ck-image-style-spacing);
|
||||
max-width: 50%;
|
||||
}
|
||||
/* ckeditor5-image/theme/imagestyle.css */
|
||||
.ck-content .image-style-align-left {
|
||||
float: left;
|
||||
margin-right: var(--ck-image-style-spacing);
|
||||
}
|
||||
/* ckeditor5-image/theme/imagestyle.css */
|
||||
.ck-content .image-style-align-center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
/* ckeditor5-image/theme/imagestyle.css */
|
||||
.ck-content .image-style-align-right {
|
||||
float: right;
|
||||
margin-left: var(--ck-image-style-spacing);
|
||||
}
|
||||
/* ckeditor5-image/theme/image.css */
|
||||
.ck-content .image {
|
||||
display: table;
|
||||
clear: both;
|
||||
text-align: center;
|
||||
margin: 1em auto;
|
||||
}
|
||||
/* ckeditor5-image/theme/image.css */
|
||||
.ck-content .image img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: 100%;
|
||||
min-width: 50px;
|
||||
}
|
||||
/* ckeditor5-image/theme/imagecaption.css */
|
||||
.ck-content .image > figcaption {
|
||||
display: table-caption;
|
||||
caption-side: bottom;
|
||||
word-break: break-word;
|
||||
color: hsl(0, 0%, 20%);
|
||||
background-color: hsl(0, 0%, 97%);
|
||||
padding: .6em;
|
||||
font-size: .75em;
|
||||
outline-offset: -1px;
|
||||
}
|
||||
/* ckeditor5-image/theme/imageresize.css */
|
||||
.ck-content .image.image_resized {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/* ckeditor5-image/theme/imageresize.css */
|
||||
.ck-content .image.image_resized img {
|
||||
width: 100%;
|
||||
}
|
||||
/* ckeditor5-image/theme/imageresize.css */
|
||||
.ck-content .image.image_resized > figcaption {
|
||||
display: block;
|
||||
}
|
||||
/* ckeditor5-highlight/theme/highlight.css */
|
||||
.ck-content .marker-yellow {
|
||||
background-color: var(--ck-highlight-marker-yellow);
|
||||
}
|
||||
/* ckeditor5-highlight/theme/highlight.css */
|
||||
.ck-content .marker-green {
|
||||
background-color: var(--ck-highlight-marker-green);
|
||||
}
|
||||
/* ckeditor5-highlight/theme/highlight.css */
|
||||
.ck-content .marker-pink {
|
||||
background-color: var(--ck-highlight-marker-pink);
|
||||
}
|
||||
/* ckeditor5-highlight/theme/highlight.css */
|
||||
.ck-content .marker-blue {
|
||||
background-color: var(--ck-highlight-marker-blue);
|
||||
}
|
||||
/* ckeditor5-highlight/theme/highlight.css */
|
||||
.ck-content .pen-red {
|
||||
color: var(--ck-highlight-pen-red);
|
||||
background-color: transparent;
|
||||
}
|
||||
/* ckeditor5-highlight/theme/highlight.css */
|
||||
.ck-content .pen-green {
|
||||
color: var(--ck-highlight-pen-green);
|
||||
background-color: transparent;
|
||||
}
|
||||
/* ckeditor5-font/theme/fontsize.css */
|
||||
.ck-content .text-tiny {
|
||||
font-size: .7em;
|
||||
}
|
||||
/* ckeditor5-font/theme/fontsize.css */
|
||||
.ck-content .text-small {
|
||||
font-size: .85em;
|
||||
}
|
||||
/* ckeditor5-font/theme/fontsize.css */
|
||||
.ck-content .text-big {
|
||||
font-size: 1.4em;
|
||||
}
|
||||
/* ckeditor5-font/theme/fontsize.css */
|
||||
.ck-content .text-huge {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
/* ckeditor5-block-quote/theme/blockquote.css */
|
||||
.ck-content blockquote {
|
||||
overflow: hidden;
|
||||
padding-right: 1.5em;
|
||||
padding-left: 1.5em;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
font-style: italic;
|
||||
border-left: solid 5px hsl(0, 0%, 80%);
|
||||
}
|
||||
/* ckeditor5-block-quote/theme/blockquote.css */
|
||||
.ck-content[dir="rtl"] blockquote {
|
||||
border-left: 0;
|
||||
border-right: solid 5px hsl(0, 0%, 80%);
|
||||
}
|
||||
/* ckeditor5-basic-styles/theme/code.css */
|
||||
.ck-content code {
|
||||
background-color: hsla(0, 0%, 78%, 0.3);
|
||||
padding: .15em;
|
||||
border-radius: 2px;
|
||||
}
|
||||
/* ckeditor5-table/theme/table.css */
|
||||
.ck-content .table {
|
||||
margin: 1em auto;
|
||||
display: table;
|
||||
}
|
||||
/* ckeditor5-table/theme/table.css */
|
||||
.ck-content .table table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px double hsl(0, 0%, 70%);
|
||||
}
|
||||
/* ckeditor5-table/theme/table.css */
|
||||
.ck-content .table table td,
|
||||
.ck-content .table table th {
|
||||
min-width: 2em;
|
||||
padding: .4em;
|
||||
border: 1px solid hsl(0, 0%, 75%);
|
||||
}
|
||||
/* ckeditor5-table/theme/table.css */
|
||||
.ck-content .table table th {
|
||||
font-weight: bold;
|
||||
background: hsla(0, 0%, 0%, 5%);
|
||||
}
|
||||
/* ckeditor5-table/theme/table.css */
|
||||
.ck-content[dir="rtl"] .table th {
|
||||
text-align: right;
|
||||
}
|
||||
/* ckeditor5-table/theme/table.css */
|
||||
.ck-content[dir="ltr"] .table th {
|
||||
text-align: left;
|
||||
}
|
||||
/* ckeditor5-page-break/theme/pagebreak.css */
|
||||
.ck-content .page-break {
|
||||
position: relative;
|
||||
clear: both;
|
||||
padding: 5px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
/* ckeditor5-page-break/theme/pagebreak.css */
|
||||
.ck-content .page-break::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
border-bottom: 2px dashed hsl(0, 0%, 77%);
|
||||
width: 100%;
|
||||
}
|
||||
/* ckeditor5-page-break/theme/pagebreak.css */
|
||||
.ck-content .page-break__label {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: .3em .6em;
|
||||
display: block;
|
||||
text-transform: uppercase;
|
||||
border: 1px solid hsl(0, 0%, 77%);
|
||||
border-radius: 2px;
|
||||
font-family: Helvetica, Arial, Tahoma, Verdana, Sans-Serif;
|
||||
font-size: 0.75em;
|
||||
font-weight: bold;
|
||||
color: hsl(0, 0%, 20%);
|
||||
background: hsl(0, 0%, 100%);
|
||||
box-shadow: 2px 2px 1px hsla(0, 0%, 0%, 0.15);
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list {
|
||||
list-style: none;
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list li {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list li .todo-list {
|
||||
margin-top: 5px;
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list .todo-list__label > input {
|
||||
-webkit-appearance: none;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: var(--ck-todo-list-checkmark-size);
|
||||
height: var(--ck-todo-list-checkmark-size);
|
||||
vertical-align: middle;
|
||||
border: 0;
|
||||
left: -25px;
|
||||
margin-right: -15px;
|
||||
right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list .todo-list__label > input::before {
|
||||
display: block;
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
content: '';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid hsl(0, 0%, 20%);
|
||||
border-radius: 2px;
|
||||
transition: 250ms ease-in-out box-shadow, 250ms ease-in-out background, 250ms ease-in-out border;
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list .todo-list__label > input::after {
|
||||
display: block;
|
||||
position: absolute;
|
||||
box-sizing: content-box;
|
||||
pointer-events: none;
|
||||
content: '';
|
||||
left: calc( var(--ck-todo-list-checkmark-size) / 3 );
|
||||
top: calc( var(--ck-todo-list-checkmark-size) / 5.3 );
|
||||
width: calc( var(--ck-todo-list-checkmark-size) / 5.3 );
|
||||
height: calc( var(--ck-todo-list-checkmark-size) / 2.6 );
|
||||
border-style: solid;
|
||||
border-color: transparent;
|
||||
border-width: 0 calc( var(--ck-todo-list-checkmark-size) / 8 ) calc( var(--ck-todo-list-checkmark-size) / 8 ) 0;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list .todo-list__label > input[checked]::before {
|
||||
background: hsl(126, 64%, 41%);
|
||||
border-color: hsl(126, 64%, 41%);
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list .todo-list__label > input[checked]::after {
|
||||
border-color: hsl(0, 0%, 100%);
|
||||
}
|
||||
/* ckeditor5-list/theme/todolist.css */
|
||||
.ck-content .todo-list .todo-list__label .todo-list__label__description {
|
||||
vertical-align: middle;
|
||||
}
|
||||
/* ckeditor5-media-embed/theme/mediaembed.css */
|
||||
.ck-content .media {
|
||||
clear: both;
|
||||
margin: 1em 0;
|
||||
display: block;
|
||||
min-width: 15em;
|
||||
}
|
||||
/* ckeditor5-html-embed/theme/htmlembed.css */
|
||||
.ck-content .raw-html-embed {
|
||||
margin: 1em auto;
|
||||
min-width: 15em;
|
||||
}
|
||||
/* ckeditor5-horizontal-line/theme/horizontalline.css */
|
||||
.ck-content hr {
|
||||
margin: 15px 0;
|
||||
height: 4px;
|
||||
background: hsl(0, 0%, 87%);
|
||||
border: 0;
|
||||
}
|
||||
/* ckeditor5-code-block/theme/codeblock.css */
|
||||
.ck-content pre {
|
||||
padding: 1em;
|
||||
color: hsl(0, 0%, 20.8%);
|
||||
background: hsla(0, 0%, 78%, 0.3);
|
||||
border: 1px solid hsl(0, 0%, 77%);
|
||||
border-radius: 2px;
|
||||
text-align: left;
|
||||
direction: ltr;
|
||||
tab-size: 4;
|
||||
white-space: pre-wrap;
|
||||
font-style: normal;
|
||||
min-width: 200px;
|
||||
}
|
||||
/* ckeditor5-code-block/theme/codeblock.css */
|
||||
.ck-content pre code {
|
||||
background: unset;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
/* ckeditor5-mention/theme/mention.css */
|
||||
.ck-content .mention {
|
||||
background: var(--ck-color-mention-background);
|
||||
color: var(--ck-color-mention-text);
|
||||
}
|
||||
@media print {
|
||||
/* ckeditor5-page-break/theme/pagebreak.css */
|
||||
.ck-content .page-break {
|
||||
padding: 0;
|
||||
}
|
||||
/* ckeditor5-page-break/theme/pagebreak.css */
|
||||
.ck-content .page-break::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user