-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
146 lines (146 loc) · 5.56 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
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<html>
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<title>Finance 4.0 eBook</title>
<script src="https://kit.fontawesome.com/706ec39613.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Ubuntu">
<style>
html * {
font-family: ubuntu;
}
/*body {
background-image: url("coverPageImage.jpg");
}*/
body {
margin: 0;
}
.backgroundImageContainer {
position: relative;
height: 100%;
}
.backgroundImageContainer:before {
background: url("coverPageImage.jpg") center / cover;
content: '';
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
z-index: -1;
opacity: 0.2;
}
.heading {
font-size: x-large;
padding: 50px 0 30px 0;
}
.navButtonDiv {
margin: auto;
color: white;
text-align: center;
border-radius: 25px;
width: 180px;
height: 85px;
box-shadow: 0 4px 6px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
margin: 30px;
}
.F2Blue {
background: #00A3EF;
}
.F2DarkViolet {
background: #695EAD;
}
.F2DarkPink {
background: #CC1C6E;
}
.F2DarkGrey {
background: #3D363F;
}
a {
text-decoration: none;
}
.icon {
font-size: xx-large;
margin: 14px 0 8px 0;
}
.citationColor {
color: DarkSlateGray;
}
.citationPrompt {
padding: 20px 0 10px 0;
}
.citationContent {
font-size: small;
font-family: Courier !important;
}
.copyCitationIcon {
font-size: large;
padding: 10px 0 0 0;
}
</style>
<!-- Matomo -->
<script type="text/javascript">
var _paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//18.157.64.166/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '2']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//18.157.64.166/matomo.php?idsite=2&rec=1" style="border:0;" alt="" /></p></noscript>
<!-- End Matomo Code -->
</head>
<body>
<script>
function copyToClipboard() {
let text = "D. Helbing, S. Klauser, M. Dapp, M. Ballandies, and B. Degenhart. 2020. FuturICT 2.0: Towards a Sustainable Digital Society with a Socio-Ecological Finance System (Finance 4.0). ETH Zürich. ebook.finfour.net.";
// via https://stackoverflow.com/a/46215202/2474159
var input = document.createElement('textarea');
input.innerHTML = text;
document.body.appendChild(input);
input.select();
var result = document.execCommand('copy');
document.body.removeChild(input);
}
</script>
<div class="backgroundImageContainer">
<center>
<div class="heading">
FuturICT 2.0 eBook
</div>
<a href="desktop">
<div class="navButtonDiv F2DarkPink">
<i class="icon fas fa-desktop"></i>
<div>desktop browser</div>
</div>
</a>
<a href="mobile">
<div class="navButtonDiv F2Blue">
<i class="icon fas fa-mobile-alt"></i>
<div>mobile browser</div>
</div>
</a>
<a href="pdf/FuturICT2-eBook.pdf">
<div class="navButtonDiv F2DarkViolet">
<i class="icon far fa-file-alt"></i>
<div>PDF</div>
</div>
</a>
<div class="citationColor">
<div class="citationPrompt">
Please cite as follows:
</div>
<div class="citationContent">
D. Helbing, S. Klauser, M. Dapp, M. Ballandies, and B. Degenhart. 2020. FuturICT 2.0:<br/>
Towards a Sustainable Digital Society with a Socio-Ecological Finance System (Finance 4.0).<br/>
ETH Zürich. ebook.finfour.net.
</div>
<div class="copyCitationIcon" title="Click to copy" onclick="copyToClipboard()">
<i class="far fa-copy"></i>
</div>
</div>
</center>
</div>
</body>
</html>