-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
177 lines (161 loc) · 12 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
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>MOOC de Chinois</title>
<!-- <script src="https://cdn.jsdelivr.net/npm/hanzi-writer@0.3/dist/hanzi-writer.min.js"></script>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-->
<script src="./js/jquery.min.js"></script>
<!--<script src="./js/hanzi-writer.js"></script> <!-- -->
<script src="./js/hanzi-writer.v0.8.2.js"></script>
<!-- -->
<script src="./js/polyfill.min.js"></script>
<script src="./js/howler-2.0.8.js"></script>
<script src="./js/bulma.js"></script>
<script src="./js/bowser.js"></script>
<link rel="stylesheet" href="./css/bulmaswatch.min.css">
<link href="https://fonts.googleapis.com/css?family=Noto+Sans:400,700|Roboto:400,500&subset=latin-ext" rel="stylesheet">
<script defer src="https://use.fontawesome.com/releases/v5.0.0/js/all.js"></script>
</head>
<body>
<style>
* { font-family: 'Roboto', sans-serif; }
.navbar-item a { margin: 0 0 0 .3em; }
/* CARD *********************************************** */
.card {
width: 380px;
margin: 0 .3em .6em 0;
display: inline-block;
}
.card figure .writer {
width: 300px;
height: 300px;
margin: 5px auto auto auto;
background-color: #FFF;
border: 1px solid #DDD;
}
.card figure .play {
width: 96px;
height: 96px;
}
.card-content {
padding-top: 0;
padding-bottom: 0;
height: 195px;
}
.card-content .content {}
.card-footer-item span { margin: 0 0 0 .5em; }
/* Dictionnaire **************************************** */
.hans,
.pinyin {
font-weight: 700;
font-family: 'Noto Sans', sans-serif
}
.decompositionzh {}
.decomposition,
.lesson {}
.root {}
/* Dom ************************************************* */
.hide { display: none; }
/* Knol */
.knol { color: #333; }
.masteryLevel1 { color: #d7191c; }
.masteryLevel2 { color: #fdae61; }
.masteryLevel3,
/*{ color:#ffffbf; }*/
.masteryLevel4 { color: #a6d96a; }
.masteryLevel5 { color: #1a9641; }
.social {
display: inline-block;
width: 32px;
height: 32px;
padding: 1em;
border-radius: 50% ;
margin: 0 1em;
}
.social.cri {
background: url("data:image/svg+xml;charset=UTF-8,<svg role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='white' d='m369 196c-11.5 7.45-21.1 17.6-28.8 29.1-5.6 8.02-9.24 17.1-13.6 25.9-6.76 13.4-15.5 26.1-27.9 34.9-12.3 11.1-18.2 28.5-16.2 44.9 2.05 12 4.46 24 9.14 35.2 5.12 12.5 13.1 24.2 24.8 31.6 16.8 9.34 34.9 16 53.5 20.1 28.2 5.15 55.5 12.3 82.2 3.28 10.4-3.58 20.2-10.2 25.8-20.1 13-28.2 21.9-56.1 29.9-83.8 2.91-10.4 5.88-21.2 3.91-32-4.14-17.9-12.9-34-19.5-51-3-6.92-4.34-14.5-7.98-21.1-6.41-12-17.2-22.1-30.5-26.1-9.16-2.26-18.5-4.2-28-4.8-19.2-1.02-42.2 5.85-56.8 14zm-309-10c-14.5 8.75-26.1 22.5-29.1 40-6.5 13.8-5.12 28.8-9.38 43.8-4.88 18.8-14.8 37.5-11.8 58.8 5.56 20 21.5 33.8 31.5 51.2 10.8 18.6 23.8 36.2 28.6 57 3.75 14.1 7.25 28.6 19.5 37.9 14 16.9 33.8 31.5 56.9 30.1 14.8-1.99 32 1.41 44.4-8.51 21.8-18 32.6-45.2 49.9-67 13-17.6 25.4-41.2 14.9-63.1-10.2-19.4-29.4-31.8-42.5-49-20.9-26.1-41-53.6-52.5-85.2-7.19-22.8-25-42.5-48.6-48.5-17.2-3.96-36.6-3.95-51.4 3.28zm175-120c-16.1 0.716-32.5-0.361-48.2 3.51-5.68 1.18-11 3.88-15.4 7.55-11.5 9.35-18.5 23.1-22.4 37.2-3.14 12-5.38 24.6-3.29 37 2.98 17 12.6 32.4 25 44.2 13.1 11.5 23 26.1 30.9 41.5 2.44 5.38 5.48 10.6 9.91 14.6 9.9 9.36 23.9 13.6 37.2 13 26.1-0.32 50.1-5.82 65.6-29.6 8.01-14.8 17.6-28.5 25.5-43.2 6.85-12.6 12.1-26.6 12.2-41.1 0.481-11.1-4.15-22-11.6-30.2-10.6-11.8-24.8-19.5-37.5-28.9-6.29-4.75-12.2-9.94-19-14-18.6-11.7-29.1-12.3-49-11.4zm-169-25c-15.5 5-23 21.2-36.8 27.5-14.9 5-25.4 17.5-28.1 32.5-2.95 13.8-0.151 28.8 5.34 41.2 4.16 9.28 9.66 23.2 20.1 23.6 12.3-0.198 23.6-9.86 34.2-9.62 14.4 2.8 27.8 13.1 41.5 7.46 8.44-4.21 15.4-10.8 22.1-17.2 6.08-4.98 9.2-13.4 7.32-21.1-6.28-18.1-13.1-35.6-20.5-51.9-5.11-11.3-12.5-22-23.2-28.6-7.44-3.79-14.6-6.4-22.1-4.32zm382-26.6c-7.79 4.6-10.2 15-7.69 23.2 3.75 13.1 8.44 27 19.1 36.2 6.56 6.26 16.9 6.25 24.9 2.79 8.48-3.69 16.1-11 17.6-20.4 2-11.3-3-23.3-12-31.1-5-6-11-16.7-19-18.5-8.39-1.8-16.2 4.9-23.1 7.86z'></path><path fill='black' d='m269 226c9.06 0.007 18.9-0.885 26.6 4.98 10.4 6.96 13.9 21.2 9.32 32.6-4.28 11.2-16.6 17.4-28.2 16.4-5.21-0.17-10.5 0.362-15.6-0.309-4.19-2.14-2.18-7.51-2.65-11.3 0.0511-13-0.101-25.9 0.0777-38.9 1.9-4.85 6.64-3.21 10.6-3.51zm89.2-12.2v158c2.8 17.9 23.9 13 24.2 0v-158c0-18.1-23.9-13-24.2 0zm-114-12c-6.86 1.1-10.8 8.28-9.9 14.8v123c9.68 10.1 21.2 20.2 24 34.6 1.12-7.34 0.295-14.9 0.546-22.2 0.0509-14.6-0.101-29.4 0.0777-44 1.11-4.92 6.88-3.2 10.5-3.51 7.7 0.142 16.5-1.24 22.5 4.7 7.96 6.48 6.68 17.6 8.56 26.6 1.99 12.9 3.25 25.9 5.59 38.6 2.35 8.19 13.6 11.2 19.8 5.16 5.35-4.34 4.16-10.7 2.04-22.4-2.12-11.6-3.08-29.4-7.04-46.6-0.541-7.48-13.1-15.2-4.02-21.4 11.8-12 17.5-29.9 13.9-46.4-4.06-23.1-26.1-41.1-44.6-41-18.6 0.0444-30.2-0.359-41.9 0.129zm-108 29.5c-3.6 10.5-1.89 21.8-2.29 32.6 0.078 26.1-0.158 52.2 0.122 78.4 1.21 17.5 13.8 33.8 30.9 38.5 20.6 6.68 45.3-4.8 52.8-25.2 2.56-6.89 5.07-15 1.97-22-2.11-3.84-6.28-6.59-10.7-6.49-7.91-0.365-13.4 7.5-12.6 14.9-1.23 12-15.4 19.9-26.2 14.8-8.32-3.34-12.8-12.5-11.9-21.1 0.0357-30.6-0.0725-61.2 0.0534-91.9 0.742-12.3 14.8-21.2 26.1-16.4 8.31 2.9 12.6 11.8 12.3 20.1 1.49 9.21 14.5 13.1 20.8 6.15 6.02-6.06 3.29-15.5 1.09-22.8-5.4-17.2-22.6-29.1-42.5-28.2-19.9 0.828-35 12.6-39.9 28.8z'></path></svg>") center no-repeat;
background-color: #82B45F;
background-size: 58%;
}
</style>
<nav class="navbar is-red">
<div class="navbar-brand">
<a class="navbar-item" href="https://hanzi.cri-paris.org">
<i src="" class="social cri" alt="Stroke Order exercices by the MOOC factory"></i>
</a>
<div id="navbar-toggle" class="navbar-burger burger" data-target="navMenu">
<span></span>
<span></span>
<span></span>
</div>
</div>
<div id="navbar-menu" class="navbar-menu">
<div class="navbar-start has-text-grey-dark ">
<a class="navbar-item selectors has-text-grey-dark" lesson="2" href="#S2">Semaine #2</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="3" href="#S3">Semaine #3</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="4" href="#S4">Semaine #4</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="5" href="#S5">Semaine #5</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="6" href="#S6">Semaine #6</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="7" href="#S7">Semaine #7</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="numbers" href="#Snumbers">Nombres</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="date" href="#Sdate">Dates</a>
<a class="navbar-item selectors has-text-grey-dark" lesson="radicals" href="#Sradicals">Radicaux</a>
<div class="navbar-item has-dropdown is-hoverable hide">
<a class="navbar-link has-text-grey-dark">Afficher...</a>
<div class="navbar-dropdown">
<a class="navbar-item has-text-grey-dark">Prononciations</a>
<a class="navbar-item has-text-grey-dark">Définitions</a>
</div>
</div>
</div>
<div class="navbar-end">
<span class="navbar-item">
<a class="button" target="_blank" href="https://twitter.com/intent/tweet?text=Venez%20voir%20le%20vocabulaire%20essentiel%20interactif%20du%20%23MOOCdechinois.%0ahttps:%2F%2Ffun-mooc.fr%2Fcourses%2Fcourse-v1:Inalco%2b52004%2bsession03%2Fabout&via=Inalco_Officiel%20@CRIparis&hashtags=Chinois,MOOC">
<span class="icon"><i class="fab fa-twitter"></i></span>
</a>
<a class="button is-primary" href="https://github.com/hugolpz/OpenEdx-hanzi/">
<span class="icon"><i class="fas fa-users"></i></span>
</a>
<a class="button is-warning" href="https://github.com/hugolpz/OpenEdx-hanzi/wiki">
<span class="icon"><i class="fas fa-bug"></i></span>
<span>Améliorer?</span>
</a>
</span>
</div>
</div>
</nav>
<!-- HIDDEN ******************************************************************************* -->
<div class="notification hide">
<strong class="tag is-info"><span class="icon has-text-light"><i class="fas fa-info-circle"></i></span> Note </strong>
L'application est en développement actif pour le MOOC de chinois. De courtes coupures peuvent avoir lieu. [<a class="is-warning" href="https://github.com/hugolpz/OpenEdx-hanzi/wiki">
<span class="icon"><i class="fas fa-bug"></i></span>
<span>Signaler?</span>
</a>]
</div>
<!-- HIDDEN ******************************************************************************* -->
<a href="https://github.com/hugolpz/OpenEdx-hanzi" class="github-corner hide" aria-label="View source on Github">
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#64CEAA; color:#fff;z-index:9; position: absolute; top: 45; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
<img style="position: absolute; top: 45px; right: 0; border: 0; width: 118px; height: 118px;z-index:9;" src="./img/right-orange@2x.png" alt="Fork me on GitHub" data-url="https://aral.github.com/fork-me-on-github-retina-ribbons">
</a>
<section class="section">
<div class="container">
<div id="hook"></div>
</div>
</section>
<footer class="footer" id="authors">
<div class="container">
<div class="content has-text-centered">
<p><strong>Activity for Chinese Characters on OpenEdX</strong> par le <a href="https://cri-paris.org">Centre de Recherche Interdisciplinaire</a> (<a href="https://github.com/hugolpz">Hugo Lopez</a>'s <a href="https://github.com/hugolpz/OpenEdx-hanzi">OpenEdx-hanzi</a>).</p>
<p class="">Données SVG <a href="https://github.com/skishore/MakeMeAHanzi">MakeMeAHanzi</a>. Animations, quiz par <a href="https://github.com/chanind/hanzi-writer/">Hanzi-Writer</a>. Audios par <a href="https://github.com/hugolpz/audio-cmn/">Audio-cmn</a>.</p>
<p>Nos projets et codes sont sous <a href="https://opensource.org/licenses/mit-license.php">Licence MIT</a> <a href="https://fr.wikipedia.org/wiki/Open_source">#OpenSource</a> et <a href="https://fr.wikipedia.org/wiki/Open_data">#OpenData</a> !</p>
<p><a><span class="icon is-small fa-1x"><i class="fas fa-heart"></i></span></a></p>
</div>
</div>
</foote48
</body>
<script src="./js/main.js?20190226d"></script>
</html>