-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
111 lines (94 loc) · 4.97 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>konbikol</title>
<meta name="description" content="Converts PKP Intercity PDF train tickets to iCalendar events (ics).">
<script src="main.js"></script>
<script defer src="vendor/ics.deps.min.js"></script>
<style>
// https://github.com/csstools/sanitize.css
*,::after,::before{box-sizing:border-box}::after,::before{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.5;-moz-tab-size:4;tab-size:4;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;word-break:break-word}body{margin:0}h1{font-size:2em;margin:.67em 0}dl dl,dl ol,dl ul,ol dl,ul dl{margin:0}ol ol,ol ul,ul ol,ul ul{margin:0}hr{height:0;overflow:visible}main{display:block}nav ol,nav ul{list-style:none;padding:0}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}audio,canvas,iframe,img,svg,video{vertical-align:middle}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}iframe{border-style:none}img{border-style:none}svg:not([fill]){fill:currentColor}svg:not(:root){overflow:hidden}table{border-collapse:collapse}button,input,select{margin:0}button{overflow:visible;text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}fieldset{border:1px solid #a0a0a0;padding:.35em .75em .625em}input{overflow:visible}legend{color:inherit;display:table;max-width:100%;white-space:normal}progress{display:inline-block;vertical-align:baseline}select{text-transform:none}textarea{margin:0;overflow:auto;resize:vertical}[type=checkbox],[type=radio]{padding:0}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}details{display:block}dialog{background-color:#fff;border:solid;color:#000;display:block;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}dialog:not([open]){display:none}summary{display:list-item}canvas{display:inline-block}template{display:none}[tabindex],a,area,button,input,label,select,summary,textarea{-ms-touch-action:manipulation;touch-action:manipulation}[hidden]{display:none}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}[aria-hidden=false][hidden]{display:initial}[aria-hidden=false][hidden]:not(:focus){clip:rect(0,0,0,0);position:absolute}
:root {
--font-color: #333;
--background-color: white;
--link-color: inherit;
--drop-color-start: rgba(50, 205, 50, 0.5);
--drop-color-end: rgba(50, 205, 50, 0);
}
@media (prefers-color-scheme: dark) {
:root {
--font-color: white;
--background-color: #333;
--link-color: mediumvioletred;
--drop-color-start: rgba(255, 255, 255, 0.5);
--drop-color-end: rgba(255, 255, 255, 0);
}
a {
color: var(--link-color);
}
}
html {
color: var(--font-color);
background-color: var(--background-color);
font-size: 24px;
}
.layout {
padding: 1em;
min-height: 100vh;
}
.has-hover {
animation: shadow-pulse 0.75s infinite;
}
@media screen and (min-width: 320px) {
html {
font-size: calc(24px + 6 * ((100vw - 320px) / 680));
}
}
@media screen and (min-width: 1000px) {
html {
font-size: 32px;
}
}
button {
font-size: 0.55em;
}
.details {
font-size: 0.85em;
}
time {
font-size: 0.85em;
display: block;
}
time ~ time {
margin-top: 0.5em;
}
input, button {
font-family: sans-serif;
}
.file-input, .file-input input {
cursor: pointer;
}
.file-input input {
margin-left: 1em;
}
.file-input--secondary {
font-size: 0.55em;
}
@keyframes shadow-pulse
{
0% {
box-shadow: 0 0 0 0px var(--drop-color-start) inset;
}
100% {
box-shadow: 0 0 0 1em var(--drop-color-end) inset;
}
}
</style>
</head>
<body>
<div id="app-container"></div>
<script src="init.js"></script>
</body>
</html>