mirror of
https://github.com/seigler/presentation-blockchains
synced 2025-07-26 01:06:09 +00:00
initial commit
This commit is contained in:
Joshua Seigler
commit
b0a2712b2c
12 changed files with 1146 additions and 0 deletions
6
.gitignore
vendored
Normal file
6
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
# https://git-scm.com/docs/gitignore
|
||||
# https://help.github.com/articles/ignoring-files
|
||||
# Example .gitignore files: https://github.com/github/gitignore
|
||||
/bower_components/
|
||||
/node_modules/
|
||||
/presentation-bundle.html
|
||||
18
README.md
Normal file
18
README.md
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
#JANUS
|
||||
|
||||
This is a browser-based presentation framework with two connected views: one for the presenter, and one for the audience.
|
||||
|
||||
## Features:
|
||||
|
||||
* Presenter view and presentation view, connected through Localstorage
|
||||
* Specializes in live-coding demos
|
||||
|
||||
## How to Use:
|
||||
|
||||
Use `npm run start` to serve the project folder on `localhost` and launch it in your default browser.
|
||||
|
||||
After you have edited index.html to your liking, you can run `npm run build` to compile the whole presentation into a single portable file for use elsewhere.
|
||||
|
||||
## Gotchas:
|
||||
|
||||
Firefox and Chrome handle `file:///` urls differently. In Firefox, local files are allowed to interact with LocalStorage, but on Chrome they are not. To circumvent this issue, you have to serve the file on `localhost` with `npm run start` or some other local server.
|
||||
59
index.html
Normal file
59
index.html
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Janus Presentation Framework</title>
|
||||
<link rel="stylesheet" href="styles/main.css" charset="utf-8">
|
||||
<link rel="stylesheet" href="styles/blockchain.css" charset="utf-8">
|
||||
</head>
|
||||
<body class="is-loading">
|
||||
<nav>
|
||||
<label for="commandField">Command:</label>
|
||||
<input list="commands" type="text" id="commandField" autocomplete="off" pattern="[0-9]+|[spc]">
|
||||
<ul class="help">
|
||||
<li>
|
||||
<strong>#</strong> - jump to a slide item
|
||||
</li>
|
||||
<li>
|
||||
<strong>s</strong> - toggle projector simulation
|
||||
</li>
|
||||
<li>
|
||||
<strong>p</strong> - toggle presenter mode
|
||||
</li>
|
||||
<li>
|
||||
<strong>c</strong> - clone window
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
|
||||
<section class="row title-page">
|
||||
<div class="col">
|
||||
<img src="styles/blocks.jpg" alt="" class="cover">
|
||||
<h1 style="background-color: black; color: white; display: inline-block; align-self: flex-end;">Block</h1>
|
||||
</div>
|
||||
<div class="col">
|
||||
<img src="styles/chains.jpg" alt="" class="cover">
|
||||
<h1 style="background-color: white; color: black; display: inline-block; align-self: flex-start;">Chain</h1>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="hashpointers">
|
||||
<img src="styles/linked-list.svg" alt="" class="contain" style="object-position: 70% 50%">
|
||||
<img janus-timeline src="styles/linked-list-hashpointers.svg" alt="" class="contain" style="object-position: 70% 50%">
|
||||
<h1>Hash Pointers</h1>
|
||||
</section>
|
||||
|
||||
<section class="credits">
|
||||
<h1>Credits</h1>
|
||||
<div>
|
||||
<a href="https://www.flickr.com/photos/stevendepolo/5644838033/"><img src="styles/blocks.jpg" alt="" class="thumbnail">Steven Depolo, Flickr</a>
|
||||
<a href="https://pixabay.com/en/chain-rust-past-bondage-history-232930/"><img src="styles/chains.jpg" alt="" class="thumbnail">Pixabay</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
<script type="text/javascript" src="libs/openjs-shortcut/shortcut.js"></script>
|
||||
<script type="text/javascript" src="scripts/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
223
libs/openjs-shortcut/shortcut.js
Normal file
223
libs/openjs-shortcut/shortcut.js
Normal file
|
|
@ -0,0 +1,223 @@
|
|||
/**
|
||||
* http://www.openjs.com/scripts/events/keyboard_shortcuts/
|
||||
* Version : 2.01.B
|
||||
* By Binny V A
|
||||
* License : BSD
|
||||
*/
|
||||
shortcut = {
|
||||
'all_shortcuts':{},//All the shortcuts are stored in this array
|
||||
'add': function(shortcut_combination,callback,opt) {
|
||||
//Provide a set of default options
|
||||
var default_options = {
|
||||
'type':'keydown',
|
||||
'propagate':false,
|
||||
'disable_in_input':false,
|
||||
'target':document,
|
||||
'keycode':false
|
||||
}
|
||||
if(!opt) opt = default_options;
|
||||
else {
|
||||
for(var dfo in default_options) {
|
||||
if(typeof opt[dfo] == 'undefined') opt[dfo] = default_options[dfo];
|
||||
}
|
||||
}
|
||||
|
||||
var ele = opt.target;
|
||||
if(typeof opt.target == 'string') ele = document.getElementById(opt.target);
|
||||
var ths = this;
|
||||
shortcut_combination = shortcut_combination.toLowerCase();
|
||||
|
||||
//The function to be called at keypress
|
||||
var func = function(e) {
|
||||
e = e || window.event;
|
||||
|
||||
if(opt['disable_in_input']) { //Don't enable shortcut keys in Input, Textarea fields
|
||||
var element;
|
||||
if(e.target) element=e.target;
|
||||
else if(e.srcElement) element=e.srcElement;
|
||||
if(element.nodeType==3) element=element.parentNode;
|
||||
|
||||
if(element.tagName == 'INPUT' || element.tagName == 'TEXTAREA') return;
|
||||
}
|
||||
|
||||
//Find Which key is pressed
|
||||
if (e.keyCode) code = e.keyCode;
|
||||
else if (e.which) code = e.which;
|
||||
var character = String.fromCharCode(code).toLowerCase();
|
||||
|
||||
if(code == 188) character=","; //If the user presses , when the type is onkeydown
|
||||
if(code == 190) character="."; //If the user presses , when the type is onkeydown
|
||||
|
||||
var keys = shortcut_combination.split("+");
|
||||
//Key Pressed - counts the number of valid keypresses - if it is same as the number of keys, the shortcut function is invoked
|
||||
var kp = 0;
|
||||
|
||||
//Work around for stupid Shift key bug created by using lowercase - as a result the shift+num combination was broken
|
||||
var shift_nums = {
|
||||
"`":"~",
|
||||
"1":"!",
|
||||
"2":"@",
|
||||
"3":"#",
|
||||
"4":"$",
|
||||
"5":"%",
|
||||
"6":"^",
|
||||
"7":"&",
|
||||
"8":"*",
|
||||
"9":"(",
|
||||
"0":")",
|
||||
"-":"_",
|
||||
"=":"+",
|
||||
";":":",
|
||||
"'":"\"",
|
||||
",":"<",
|
||||
".":">",
|
||||
"/":"?",
|
||||
"\\":"|"
|
||||
}
|
||||
//Special Keys - and their codes
|
||||
var special_keys = {
|
||||
'esc':27,
|
||||
'escape':27,
|
||||
'tab':9,
|
||||
'space':32,
|
||||
'return':13,
|
||||
'enter':13,
|
||||
'backspace':8,
|
||||
|
||||
'scrolllock':145,
|
||||
'scroll_lock':145,
|
||||
'scroll':145,
|
||||
'capslock':20,
|
||||
'caps_lock':20,
|
||||
'caps':20,
|
||||
'numlock':144,
|
||||
'num_lock':144,
|
||||
'num':144,
|
||||
|
||||
'pause':19,
|
||||
'break':19,
|
||||
|
||||
'insert':45,
|
||||
'home':36,
|
||||
'delete':46,
|
||||
'end':35,
|
||||
|
||||
'pageup':33,
|
||||
'page_up':33,
|
||||
'pu':33,
|
||||
|
||||
'pagedown':34,
|
||||
'page_down':34,
|
||||
'pd':34,
|
||||
|
||||
'left':37,
|
||||
'up':38,
|
||||
'right':39,
|
||||
'down':40,
|
||||
|
||||
'f1':112,
|
||||
'f2':113,
|
||||
'f3':114,
|
||||
'f4':115,
|
||||
'f5':116,
|
||||
'f6':117,
|
||||
'f7':118,
|
||||
'f8':119,
|
||||
'f9':120,
|
||||
'f10':121,
|
||||
'f11':122,
|
||||
'f12':123
|
||||
}
|
||||
|
||||
var modifiers = {
|
||||
shift: { wanted:false, pressed:false},
|
||||
ctrl : { wanted:false, pressed:false},
|
||||
alt : { wanted:false, pressed:false},
|
||||
meta : { wanted:false, pressed:false} //Meta is Mac specific
|
||||
};
|
||||
|
||||
if(e.ctrlKey) modifiers.ctrl.pressed = true;
|
||||
if(e.shiftKey) modifiers.shift.pressed = true;
|
||||
if(e.altKey) modifiers.alt.pressed = true;
|
||||
if(e.metaKey) modifiers.meta.pressed = true;
|
||||
|
||||
for(var i=0; k=keys[i],i<keys.length; i++) {
|
||||
//Modifiers
|
||||
if(k == 'ctrl' || k == 'control') {
|
||||
kp++;
|
||||
modifiers.ctrl.wanted = true;
|
||||
|
||||
} else if(k == 'shift') {
|
||||
kp++;
|
||||
modifiers.shift.wanted = true;
|
||||
|
||||
} else if(k == 'alt') {
|
||||
kp++;
|
||||
modifiers.alt.wanted = true;
|
||||
} else if(k == 'meta') {
|
||||
kp++;
|
||||
modifiers.meta.wanted = true;
|
||||
} else if(k.length > 1) { //If it is a special key
|
||||
if(special_keys[k] == code) kp++;
|
||||
|
||||
} else if(opt['keycode']) {
|
||||
if(opt['keycode'] == code) kp++;
|
||||
|
||||
} else { //The special keys did not match
|
||||
if(character == k) kp++;
|
||||
else {
|
||||
if(shift_nums[character] && e.shiftKey) { //Stupid Shift key bug created by using lowercase
|
||||
character = shift_nums[character];
|
||||
if(character == k) kp++;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(kp == keys.length &&
|
||||
modifiers.ctrl.pressed == modifiers.ctrl.wanted &&
|
||||
modifiers.shift.pressed == modifiers.shift.wanted &&
|
||||
modifiers.alt.pressed == modifiers.alt.wanted &&
|
||||
modifiers.meta.pressed == modifiers.meta.wanted) {
|
||||
callback(e);
|
||||
|
||||
if(!opt['propagate']) { //Stop the event
|
||||
//e.cancelBubble is supported by IE - this will kill the bubbling process.
|
||||
e.cancelBubble = true;
|
||||
e.returnValue = false;
|
||||
|
||||
//e.stopPropagation works in Firefox.
|
||||
if (e.stopPropagation) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
this.all_shortcuts[shortcut_combination] = {
|
||||
'callback':func,
|
||||
'target':ele,
|
||||
'event': opt['type']
|
||||
};
|
||||
//Attach the function with the event
|
||||
if(ele.addEventListener) ele.addEventListener(opt['type'], func, false);
|
||||
else if(ele.attachEvent) ele.attachEvent('on'+opt['type'], func);
|
||||
else ele['on'+opt['type']] = func;
|
||||
},
|
||||
|
||||
//Remove the shortcut - just specify the shortcut and I will remove the binding
|
||||
'remove':function(shortcut_combination) {
|
||||
shortcut_combination = shortcut_combination.toLowerCase();
|
||||
var binding = this.all_shortcuts[shortcut_combination];
|
||||
delete(this.all_shortcuts[shortcut_combination])
|
||||
if(!binding) return;
|
||||
var type = binding['event'];
|
||||
var ele = binding['target'];
|
||||
var callback = binding['callback'];
|
||||
|
||||
if(ele.detachEvent) ele.detachEvent('on'+type, callback);
|
||||
else if(ele.removeEventListener) ele.removeEventListener(type, callback, false);
|
||||
else ele['on'+type] = false;
|
||||
}
|
||||
}
|
||||
14
package.json
Normal file
14
package.json
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
{
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"build": "inliner index.html > presentation-bundle.html",
|
||||
"start": "http-server -o -cors"
|
||||
},
|
||||
"author": "Joshua Seigler",
|
||||
"devDependencies": {
|
||||
"inliner": "^1.9.5"
|
||||
},
|
||||
"dependencies": {
|
||||
"http-server": "^0.9.0"
|
||||
}
|
||||
}
|
||||
131
scripts/app.js
Normal file
131
scripts/app.js
Normal file
|
|
@ -0,0 +1,131 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
var slides = [],
|
||||
currentSlideNumber = 0,
|
||||
slideNext,
|
||||
slidePrev,
|
||||
commandBar,
|
||||
commandField,
|
||||
commandBarVisible = true;
|
||||
|
||||
function $(selector) {
|
||||
return document.querySelector(selector);
|
||||
}
|
||||
function $$(selector) {
|
||||
return Array.prototype.slice.call(document.querySelectorAll(selector), 0);
|
||||
}
|
||||
|
||||
function setCurrentSlide(newSlideNumber, storeChange) {
|
||||
newSlideNumber = Math.max(Math.min(newSlideNumber, slides.length - 1), 0);
|
||||
if (newSlideNumber !== currentSlideNumber) {
|
||||
currentSlideNumber = newSlideNumber;
|
||||
if (storeChange) {
|
||||
localStorage.setItem('janus-currentSlideNumber', currentSlideNumber);
|
||||
}
|
||||
}
|
||||
slides.forEach(function (item, index, array) {
|
||||
if (index < currentSlideNumber) {
|
||||
if (slides[index].contains(slides[currentSlideNumber])) {
|
||||
item.setAttribute('janus-timeline', 'present');
|
||||
} else {
|
||||
item.setAttribute('janus-timeline', 'past');
|
||||
}
|
||||
} else if (index === currentSlideNumber) {
|
||||
item.setAttribute('janus-timeline', 'present');
|
||||
} else {
|
||||
item.setAttribute('janus-timeline', 'future');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var sessionListener = function(e) {
|
||||
if (e.url === window.location.href) {
|
||||
if (e.key === 'janus-currentSlideNumber') {
|
||||
setCurrentSlide(+e.newValue, false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var toggleCommandBar = function(visible) {
|
||||
if (visible === false) {
|
||||
commandBar.style.display = 'none';
|
||||
commandBarVisible = false;
|
||||
} else if (visible === true) {
|
||||
commandBar.style.display = 'flex';
|
||||
commandField.value = '';
|
||||
commandField.focus();
|
||||
commandBarVisible = true;
|
||||
}
|
||||
}
|
||||
|
||||
var commandListener = function(event) {
|
||||
var typed = String.fromCharCode(event.keyCode).toLowerCase();
|
||||
if (/[0-9]/.test(typed)) {
|
||||
return;
|
||||
} else if (event.keyCode === 13) {
|
||||
runCommand(commandField.value);
|
||||
toggleCommandBar(false);
|
||||
} else if (/[spc]/.test(typed)) {
|
||||
runCommand(commandField.value + typed);
|
||||
toggleCommandBar(false);
|
||||
}
|
||||
};
|
||||
|
||||
var runCommand = function(command) {
|
||||
var s = command.split();
|
||||
if (s.length === 1 && /^[0-9]+$/.test(s[0])) {
|
||||
setCurrentSlide(+s[0], true);
|
||||
} else if (s.length === 1) {
|
||||
switch(s[0]) {
|
||||
case 's':
|
||||
document.body.classList.toggle('simulate-projection');
|
||||
break;
|
||||
case 'p':
|
||||
document.body.classList.toggle('show-notes');
|
||||
break;
|
||||
case 'c':
|
||||
window.open(window.location.href, '_blank');
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var init = function() {
|
||||
commandField = $('#commandField');
|
||||
commandField.addEventListener('keydown', commandListener);
|
||||
commandField.addEventListener('blur', function(event) {
|
||||
toggleCommandBar(false);
|
||||
});
|
||||
commandBar = $('body > nav');
|
||||
toggleCommandBar(false);
|
||||
|
||||
slides = $$('main>section, [janus-timeline]');
|
||||
currentSlideNumber = 0;
|
||||
shortcut.add('F1', function() {
|
||||
document.body.classList.toggle('show-notes');
|
||||
});
|
||||
shortcut.add('F2', function() {
|
||||
window.open(window.location.href, '_blank');
|
||||
});
|
||||
shortcut.add('Page_down', function() {
|
||||
setCurrentSlide(currentSlideNumber + 1, true);
|
||||
});
|
||||
shortcut.add('Page_up', function() {
|
||||
setCurrentSlide(currentSlideNumber - 1, true);
|
||||
});
|
||||
shortcut.add('Escape', function() {
|
||||
toggleCommandBar(!commandBarVisible);
|
||||
});
|
||||
var storedSlideNumber;
|
||||
if (storedSlideNumber = localStorage.getItem('janus-currentSlideNumber')) {
|
||||
setCurrentSlide(storedSlideNumber, false);
|
||||
} else {
|
||||
setCurrentSlide(0);
|
||||
}
|
||||
document.body.classList.remove('is-loading');
|
||||
};
|
||||
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
window.addEventListener('storage', sessionListener);
|
||||
})();
|
||||
42
styles/blockchain.css
Normal file
42
styles/blockchain.css
Normal file
|
|
@ -0,0 +1,42 @@
|
|||
.credits > a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
img.thumbnail {
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.row, .col {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
flex-basis: 0;
|
||||
}
|
||||
|
||||
.row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.row > div, .col > div {
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.title-page h1 {
|
||||
font-size: 2em;
|
||||
padding: 0.25em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.credits {
|
||||
padding: 0.5em;
|
||||
text-align: left;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.credits > div > a {
|
||||
display: block;
|
||||
font-size: 0.75em;
|
||||
}
|
||||
BIN
styles/blocks.jpg
Normal file
BIN
styles/blocks.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 123 KiB |
BIN
styles/chains.jpg
Normal file
BIN
styles/chains.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 431 KiB |
233
styles/linked-list-hashpointers.svg
Normal file
233
styles/linked-list-hashpointers.svg
Normal file
|
|
@ -0,0 +1,233 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="400"
|
||||
height="400"
|
||||
viewBox="0 0 400.00002 399.99997"
|
||||
id="svg2"
|
||||
version="1.1"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="linked-list-hashpointers.svg">
|
||||
<defs
|
||||
id="defs4">
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
id="path4239"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)"
|
||||
inkscape:connector-curvature="0" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1-0"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2-9"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1-6"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2-0"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1-2"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2-6"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="1.4"
|
||||
inkscape:cx="36.162609"
|
||||
inkscape:cy="195.21225"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
units="px"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1021"
|
||||
inkscape:window-x="1920"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata7">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-209.7363,42.325432)">
|
||||
<g
|
||||
transform="translate(-4.1341662,0.50657535)"
|
||||
id="g4197">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4183"
|
||||
d="M 365.29978,15.232822 A 15.152288,15.152288 0 0 1 350.14749,30.385111 15.152288,15.152288 0 0 1 334.9952,15.232822 15.152288,15.152288 0 0 1 350.14749,0.08053398 15.152288,15.152288 0 0 1 365.29978,15.232822 Z"
|
||||
style="opacity:1;fill:#7f7fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:3.00000024;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
|
||||
<g
|
||||
id="text4184-3"
|
||||
style="font-style:normal;font-weight:normal;font-size:44.98179626px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
transform="matrix(0.52285653,0,0,0.52285653,212.38885,-12.341957)">
|
||||
<path
|
||||
style="fill:#ffffff;fill-opacity:1"
|
||||
id="path4189-6"
|
||||
d="m 270.38073,49.23549 -1.29586,6.830732 5.97414,0 0,2.965109 -6.56717,0 -1.5155,7.92892 -3.16278,0 1.55943,-7.92892 -6.25967,0 -1.53747,7.92892 -3.09689,0 1.44961,-7.92892 -5.60076,0 0,-2.965109 6.17182,0 1.36175,-6.830732 -5.90825,0 0,-2.943145 6.43538,0 1.49354,-7.775173 3.16278,0 -1.47157,7.775173 6.3036,0 1.5155,-7.775173 3.09689,0 -1.5155,7.775173 5.64469,0 0,2.943145 -6.23771,0 z m -10.71832,6.830732 6.28164,0 1.31782,-6.830732 -6.25967,0 -1.33979,6.830732 z"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="translate(144.74037,11.519724)"
|
||||
id="g4197-3">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4183-6"
|
||||
d="M 365.29978,15.232822 A 15.152288,15.152288 0 0 1 350.14749,30.385111 15.152288,15.152288 0 0 1 334.9952,15.232822 15.152288,15.152288 0 0 1 350.14749,0.08053398 15.152288,15.152288 0 0 1 365.29978,15.232822 Z"
|
||||
style="opacity:1;fill:#7f7fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:3.00000024;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
|
||||
<g
|
||||
id="text4184-3-7"
|
||||
style="font-style:normal;font-weight:normal;font-size:44.98179626px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
transform="matrix(0.52285653,0,0,0.52285653,212.38885,-12.341957)">
|
||||
<path
|
||||
style="fill:#ffffff;fill-opacity:1"
|
||||
id="path4189-6-5"
|
||||
d="m 270.38073,49.23549 -1.29586,6.830732 5.97414,0 0,2.965109 -6.56717,0 -1.5155,7.92892 -3.16278,0 1.55943,-7.92892 -6.25967,0 -1.53747,7.92892 -3.09689,0 1.44961,-7.92892 -5.60076,0 0,-2.965109 6.17182,0 1.36175,-6.830732 -5.90825,0 0,-2.943145 6.43538,0 1.49354,-7.775173 3.16278,0 -1.47157,7.775173 6.3036,0 1.5155,-7.775173 3.09689,0 -1.5155,7.775173 5.64469,0 0,2.943145 -6.23771,0 z m -10.71832,6.830732 6.28164,0 1.31782,-6.830732 -6.25967,0 -1.33979,6.830732 z"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="translate(219.02611,128.66259)"
|
||||
id="g4197-35">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4183-62"
|
||||
d="M 365.29978,15.232822 A 15.152288,15.152288 0 0 1 350.14749,30.385111 15.152288,15.152288 0 0 1 334.9952,15.232822 15.152288,15.152288 0 0 1 350.14749,0.08053398 15.152288,15.152288 0 0 1 365.29978,15.232822 Z"
|
||||
style="opacity:1;fill:#7f7fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:3.00000024;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
|
||||
<g
|
||||
id="text4184-3-9"
|
||||
style="font-style:normal;font-weight:normal;font-size:44.98179626px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
transform="matrix(0.52285653,0,0,0.52285653,212.38885,-12.341957)">
|
||||
<path
|
||||
style="fill:#ffffff;fill-opacity:1"
|
||||
id="path4189-6-12"
|
||||
d="m 270.38073,49.23549 -1.29586,6.830732 5.97414,0 0,2.965109 -6.56717,0 -1.5155,7.92892 -3.16278,0 1.55943,-7.92892 -6.25967,0 -1.53747,7.92892 -3.09689,0 1.44961,-7.92892 -5.60076,0 0,-2.965109 6.17182,0 1.36175,-6.830732 -5.90825,0 0,-2.943145 6.43538,0 1.49354,-7.775173 3.16278,0 -1.47157,7.775173 6.3036,0 1.5155,-7.775173 3.09689,0 -1.5155,7.775173 5.64469,0 0,2.943145 -6.23771,0 z m -10.71832,6.830732 6.28164,0 1.31782,-6.830732 -6.25967,0 -1.33979,6.830732 z"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="translate(174.74037,251.51973)"
|
||||
id="g4197-7">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4183-0"
|
||||
d="M 365.29978,15.232822 A 15.152288,15.152288 0 0 1 350.14749,30.385111 15.152288,15.152288 0 0 1 334.9952,15.232822 15.152288,15.152288 0 0 1 350.14749,0.08053398 15.152288,15.152288 0 0 1 365.29978,15.232822 Z"
|
||||
style="opacity:1;fill:#7f7fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:3.00000024;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
|
||||
<g
|
||||
id="text4184-3-93"
|
||||
style="font-style:normal;font-weight:normal;font-size:44.98179626px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
transform="matrix(0.52285653,0,0,0.52285653,212.38885,-12.341957)">
|
||||
<path
|
||||
style="fill:#ffffff;fill-opacity:1"
|
||||
id="path4189-6-60"
|
||||
d="m 270.38073,49.23549 -1.29586,6.830732 5.97414,0 0,2.965109 -6.56717,0 -1.5155,7.92892 -3.16278,0 1.55943,-7.92892 -6.25967,0 -1.53747,7.92892 -3.09689,0 1.44961,-7.92892 -5.60076,0 0,-2.965109 6.17182,0 1.36175,-6.830732 -5.90825,0 0,-2.943145 6.43538,0 1.49354,-7.775173 3.16278,0 -1.47157,7.775173 6.3036,0 1.5155,-7.775173 3.09689,0 -1.5155,7.775173 5.64469,0 0,2.943145 -6.23771,0 z m -10.71832,6.830732 6.28164,0 1.31782,-6.830732 -6.25967,0 -1.33979,6.830732 z"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
transform="translate(21.168937,287.23402)"
|
||||
id="g4197-6">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4183-2"
|
||||
d="M 365.29978,15.232822 A 15.152288,15.152288 0 0 1 350.14749,30.385111 15.152288,15.152288 0 0 1 334.9952,15.232822 15.152288,15.152288 0 0 1 350.14749,0.08053398 15.152288,15.152288 0 0 1 365.29978,15.232822 Z"
|
||||
style="opacity:1;fill:#7f7fff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:3.00000024;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
|
||||
<g
|
||||
id="text4184-3-61"
|
||||
style="font-style:normal;font-weight:normal;font-size:44.98179626px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
transform="matrix(0.52285653,0,0,0.52285653,212.38885,-12.341957)">
|
||||
<path
|
||||
style="fill:#ffffff;fill-opacity:1"
|
||||
id="path4189-6-8"
|
||||
d="m 270.38073,49.23549 -1.29586,6.830732 5.97414,0 0,2.965109 -6.56717,0 -1.5155,7.92892 -3.16278,0 1.55943,-7.92892 -6.25967,0 -1.53747,7.92892 -3.09689,0 1.44961,-7.92892 -5.60076,0 0,-2.965109 6.17182,0 1.36175,-6.830732 -5.90825,0 0,-2.943145 6.43538,0 1.49354,-7.775173 3.16278,0 -1.47157,7.775173 6.3036,0 1.5155,-7.775173 3.09689,0 -1.5155,7.775173 5.64469,0 0,2.943145 -6.23771,0 z m -10.71832,6.830732 6.28164,0 1.31782,-6.830732 -6.25967,0 -1.33979,6.830732 z"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 13 KiB |
195
styles/linked-list.svg
Normal file
195
styles/linked-list.svg
Normal file
|
|
@ -0,0 +1,195 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="400"
|
||||
height="400"
|
||||
viewBox="0 0 400.00002 399.99997"
|
||||
id="svg2"
|
||||
version="1.1"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="linked-list.svg">
|
||||
<defs
|
||||
id="defs4">
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
id="path4239"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)"
|
||||
inkscape:connector-curvature="0" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1-0"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2-9"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1-6"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2-0"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:stockid="Arrow2Mend"
|
||||
orient="auto"
|
||||
refY="0"
|
||||
refX="0"
|
||||
id="Arrow2Mend-1-2"
|
||||
style="overflow:visible"
|
||||
inkscape:isstock="true">
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4239-2-6"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.625;stroke-linejoin:round;stroke-opacity:1"
|
||||
d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
|
||||
transform="scale(-0.6,-0.6)" />
|
||||
</marker>
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="1.4"
|
||||
inkscape:cx="167.59118"
|
||||
inkscape:cy="195.21225"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
units="px"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1021"
|
||||
inkscape:window-x="1920"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata7">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-209.7363,42.325432)">
|
||||
<path
|
||||
id="path4138"
|
||||
style="fill:#ffd000;fill-opacity:1;fill-rule:evenodd;stroke:#777777;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 283.17464,16.639669 20.4364,39.494509 m -82.56746,-7.90114 78.05284,-40.3883942 20.89055,40.3721642 -78.05284,40.388391 z"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4138-7"
|
||||
style="fill:#ffd000;fill-opacity:1;fill-rule:evenodd;stroke:#777777;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 454.31765,-18.117498 -2.94487,44.371056 m -66.56994,-49.479877 87.69035,5.819953 -3.01032,45.357084 -87.69035,-5.81995 z" />
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4138-5"
|
||||
style="fill:#ffd000;fill-opacity:1;fill-rule:evenodd;stroke:#777777;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 587.42829,89.814959 -37.89014,23.276611 m 1.82719,-82.924522 46.00147,74.882142 -38.73214,23.79387 -46.00147,-74.882142 z" />
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4138-3"
|
||||
style="fill:#ffd000;fill-opacity:1;fill-rule:evenodd;stroke:#777777;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 581.66035,239.21905 -43.10838,-10.91467 m 60.69508,-56.53247 -21.57062,85.19493 -44.06635,-11.15722 21.57062,-85.19493 z"
|
||||
inkscape:transform-center-x="-30.714286"
|
||||
inkscape:transform-center-y="-43.571429" />
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4138-2"
|
||||
style="fill:#ffd000;fill-opacity:1;fill-rule:evenodd;stroke:#777777;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 442.05813,332.29773 -7.71079,-43.79505 m 76.44116,32.19569 -86.55199,15.23881 -7.88214,-44.76828 86.55199,-15.23881 z" />
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path4138-9"
|
||||
style="fill:#ffd000;fill-opacity:1;fill-rule:evenodd;stroke:#777777;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 263.20584,275.55971 26.52258,-35.69334 m 29.12875,77.66163 -70.54062,-52.41649 27.11199,-36.48654 70.54062,52.41649 z" />
|
||||
<path
|
||||
style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-end:url(#Arrow2Mend)"
|
||||
d="M 297.85714,27.362198 414.28571,3.7907698"
|
||||
id="path4206"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-end:url(#Arrow2Mend-1)"
|
||||
d="M 461.30678,3.1834788 555.0679,76.122328"
|
||||
id="path4206-7"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-end:url(#Arrow2Mend-1-0)"
|
||||
d="m 571.89738,110.64016 -5.37257,93.91402"
|
||||
id="path4206-7-3"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-end:url(#Arrow2Mend-1-6)"
|
||||
d="m 557.97085,243.30524 -81.09091,61.87263"
|
||||
id="path4206-7-6"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:3.00000018;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-end:url(#Arrow2Mend-1-2)"
|
||||
d="m 428.80029,312.34005 -117.14544,-19.702"
|
||||
id="path4206-7-1"
|
||||
inkscape:connector-curvature="0" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.8 KiB |
225
styles/main.css
Normal file
225
styles/main.css
Normal file
|
|
@ -0,0 +1,225 @@
|
|||
/* Basics */
|
||||
|
||||
*, *:before, *:after {
|
||||
box-sizing: inherit;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
:root {
|
||||
box-sizing: border-box;
|
||||
font-family: sans-serif;
|
||||
font-size: calc(3vmax + 3vmin);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: Consolas, monaco, monospace;
|
||||
}
|
||||
|
||||
kbd {
|
||||
font-family: Consolas, monaco, monospace;
|
||||
background-color: hsla(0, 0%, 100%, 0.2);
|
||||
border-radius: 0.5em;
|
||||
padding: 0.1em 0.4em 0;
|
||||
margin: -0.1em 0 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
h2 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
h1, h2 {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Layout */
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background-color: black;
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body.is-loading:after {
|
||||
content: 'Loading...';
|
||||
font-size: 0.5em;
|
||||
line-height: 100vh;
|
||||
color: white;
|
||||
background-image: linear-gradient(45deg, #030, #000, #003);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
body.simulate-projection {
|
||||
filter: brightness(1.5) contrast(0.65);
|
||||
}
|
||||
|
||||
main {
|
||||
margin-top: 0;
|
||||
perspective: 100vmin;
|
||||
transform-style: preserve-3d;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
/* Components */
|
||||
nav {
|
||||
flex-wrap: wrap;
|
||||
display: flex;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0.25em 0.25em 4em;
|
||||
transition: transform ease 0.5s;
|
||||
font-size: 0.5rem;
|
||||
z-index: 2;
|
||||
background-image: linear-gradient(to top, hsla(0, 0%, 0%, 0), hsla(0, 0%, 0%, 0.5));
|
||||
}
|
||||
|
||||
nav > label {
|
||||
flex: 0 0 auto;
|
||||
padding-right: 1ch;
|
||||
}
|
||||
|
||||
nav > input {
|
||||
flex: 1 1 auto;
|
||||
padding: 0;
|
||||
font-size: inherit;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: inherit;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
nav > input:invalid {
|
||||
color: red;
|
||||
}
|
||||
|
||||
ul.help {
|
||||
width: 100%;
|
||||
flex-shrink: 0;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
||||
ul.help li {
|
||||
display: inline-block;
|
||||
background-color: hsla(0, 0%, 100%, 0.2);
|
||||
border-radius: 0.5em;
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
|
||||
section {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
background-color: black;
|
||||
transition: transform ease 0.5s, opacity ease 0.5s, visibility step-end 0.5s;
|
||||
transform-origin: 50% 50%;
|
||||
}
|
||||
|
||||
/*
|
||||
section > * {
|
||||
transform: rotate(-7deg);
|
||||
}
|
||||
*/
|
||||
|
||||
[janus-timeline='past'] {
|
||||
transition: transform ease-in 0.5s, opacity ease-in 0.5s, visibility step-end 0.5s;
|
||||
}
|
||||
|
||||
[janus-timeline='present'] {
|
||||
transition: transform ease-out 0.5s, opacity ease-out 0.5s, visibility step-start 0.5s;
|
||||
}
|
||||
|
||||
[janus-timeline='future'] {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
body.show-notes section [janus-timeline='future'] {
|
||||
visibility: visible;
|
||||
opacity: 0.25;
|
||||
}
|
||||
|
||||
body.show-notes section[janus-timeline='future'] [janus-timeline='future'] {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
section[janus-timeline='past'] {
|
||||
transform: translate3d(0, 0, 0) scale(5);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
section[janus-timeline='present'] {
|
||||
transform: none;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
section[janus-timeline='future'] {
|
||||
transform: translate3d(0, -5vmin, 0) scale(0.8);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
img.cover, img.contain {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: -1;
|
||||
transform: none;
|
||||
}
|
||||
img.cover {
|
||||
object-fit: cover;
|
||||
}
|
||||
img.contain {
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
body.show-notes section {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
body.show-notes section[janus-timeline='present'] + section[janus-timeline='future'] {
|
||||
transform: scale(0.25);
|
||||
transform-origin: bottom right;
|
||||
top: auto;
|
||||
left: auto;
|
||||
bottom: 0.4rem;
|
||||
right: 0.4rem;
|
||||
opacity: 0.75;
|
||||
visibility: visible;
|
||||
outline: 0.2rem solid white;
|
||||
z-index: 3;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue