-
Notifications
You must be signed in to change notification settings - Fork 6
/
index.prod.html.template
130 lines (123 loc) · 4.96 KB
/
index.prod.html.template
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
<!DOCTYPE html>
<html>
<head>
<title>Fonio</title>
<meta charset="utf-8">
<!-- icons -->
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
<link rel="apple-touch-icon" sizes="120x120" href="${URL_PREFIX}/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="${URL_PREFIX}/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="${URL_PREFIX}/favicon-16x16.png">
<link rel="manifest" href="${URL_PREFIX}/manifest.json">
<link rel="mask-icon" href="${URL_PREFIX}/safari-pinned-tab.svg" color="#5bbad5">
<meta name="theme-color" content="#ffffff" />
<!-- META DUBLIN CORE -->
<meta name="DC.Title" lang="fr" content="Fonio" />
<meta name="DC.Date.created" scheme="W3CDTF" content="2017-09-01" />
<meta name="DC.subject" xml:lang="en-GB" content="data-presentation" />
<meta name="DC.subject" xml:lang="en-GB" content="rich content edition" />
<!-- END META DUBLIN CORE -->
<!-- REGULAR META -->
<meta name="author" content="médialab Sciences Po" />
<meta name="keywords" content="data stories, data, data comment, rich media, academic editing, scholarly media, scholarly editor, academic editor" />
<meta name="description" content="The data stories editor" />
<meta name="viewport" content="user-scalable=no,width=device-width" />
<meta name="robots" content="noindex, nofollow" />
<!-- END REGULAR META -->
<!-- META TWITTER -->
<meta name="twitter:card" value="summary" />
<!-- <meta name="twitter:site" content="https://fonio.surge.sh/"> -->
<meta name="twitter:title" content="Fonio" />
<meta name="twitter:description" content="The data stories editor" />
<meta name="twitter:creator" content="@medialab" />
<!-- todo : Twitter Summary card images must be at least 200x200px -->
<!-- <meta name="twitter:image" content="https://fonio.surge.sh/apple-touch-icon.png"> -->
<!-- end meta twitter-->
<!-- META GOOGLE + -->
<meta itemprop="name" content="Fonio" />
<meta itemprop="description" content="The data stories editor" />
<!-- <meta itemprop="image" content="https://fonio.surge.sh/bulgur-rs.png"> -->
<!-- END META GOOGLE + -->
<!-- META OPEN GRAPH / FACEBOOK -->
<meta property="og:title" content="Fonio" />
<meta property="og:type" content="website" />
<!-- <meta property="og:url" content="https://fonio.surge.sh/"/> -->
<meta property="og:description" content="The data stories editor" />
<!-- <meta property="og:image" content="https://fonio.surge.sh/fonio-rs.png"/> -->
<!-- <meta property="og:image:width" content="1200"/> -->
<!-- <meta property="og:image:height" content="900"/> -->
<!-- END META OPEN GRAPH / FACEBOOK -->
<style type="text/css">
body {
background-color: #f4f4f4;
}
.spinner-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
font-family: 'Roboto', sans-serif;
display: flex;
flex-flow: column nowrap;
justify-content: center;
align-items: center;
}
.logo-img{
display: inline;
max-height: 1em;
}
.spinner {
width: 40px;
height: 40px;
background-color: #3fb0ac;
-webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
animation: sk-rotateplane 1.2s infinite ease-in-out;
}
@-webkit-keyframes sk-rotateplane {
0% { -webkit-transform: perspective(120px) }
50% { -webkit-transform: perspective(120px) rotateY(180deg) }
100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg) }
}
@keyframes sk-rotateplane {
0% {
transform: perspective(120px) rotateX(0deg) rotateY(0deg);
-webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
} 50% {
transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
-webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
} 100% {
transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
-webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
}
}
</style>
</head>
<body>
<!--CSS Spinner-->
<div class="spinner-wrapper">
<h1><img class="logo-img" src="${URL_PREFIX}/android-chrome-96x96.png"></img> Fonio</h1>
<!-- <div class="spinner"></div> -->
</div>
<!-- Element in which to mount the app -->
<div id="mount"></div>
<!-- FONIO_CONFIG -->
<script type="text/javascript">
window.FONIO_CONFIG = {
apiUrl: '${API_URL}',
maxSectionLevel: ${MAX_SECTION_LEVEL},
sessionName: '${SESSION_NAME}',
urlPrefix: '${URL_PREFIX}',
maxResourceSize: ${MAX_RESOURCE_SIZE},
maxStorySize: ${MAX_STORY_SIZE},
maxFolderSize: ${MAX_FOLDER_SIZE},
maxBatchNumber: ${MAX_BATCH_NUMBER},
demoMode: ${DEMO_MODE},
requirePublicationConsent: ${REQUIRE_PUBLICATION_CONSENT}
};
</script>
<!-- Loading Bundle -->
<script type="text/javascript" src="${URL_PREFIX}/build/bundle.js"></script>
</body>
</html>