Miraty
4 weeks ago
35 changed files with 99 additions and 1492 deletions
-
0antopie/404.md
-
1antopie/cgu.md
-
2antopie/contact.md
-
2antopie/courriel.md
-
12antopie/details-techniques.md
-
21antopie/fontello/LICENSE.txt
-
75antopie/fontello/README.txt
-
48antopie/fontello/config.json
-
85antopie/fontello/css/animation.css
-
6antopie/fontello/css/fontello-codes.css
-
59antopie/fontello/css/fontello-embedded.css
-
6antopie/fontello/css/fontello-ie7-codes.css
-
17antopie/fontello/css/fontello-ie7.css
-
62antopie/fontello/css/fontello.css
-
1antopie/fontello/css/fontello.min.css
-
312antopie/fontello/demo.html
-
BINantopie/fontello/font/fontello.eot
-
20antopie/fontello/font/fontello.svg
-
BINantopie/fontello/font/fontello.ttf
-
BINantopie/fontello/font/fontello.woff
-
BINantopie/fontello/font/fontello.woff2
-
BINantopie/img/antopiev5-350-fs8.png
-
BINantopie/img/antopiev5-350.png
-
41antopie/index.md
-
2antopie/manifeste-sur-le-contenu.md
-
1antopie/matrix.md
-
28antopie/md/nyan.md
-
8antopie/nextcloud.md
-
70antopie/pages.inc.php
-
576bibli/nyan.css
-
29bibli/nyan.js
-
58compil.php
-
27inc/debut.php
-
8inc/footer.php
-
14style.less
@ -1,3 +1,4 @@ |
|||
# Conditions d'utilisation |
|||
|
|||
## Préambule |
|||
|
|||
@ -1,3 +1,5 @@ |
|||
# Me contacter |
|||
|
|||
Vous pouvez me contacter par l'un des moyens suivants : |
|||
* Mail : [miraty+antopie@antopie.org](mailto:miraty+antopie@antopie.org) |
|||
OpenPGP : [`B16B 12A8 957B 2EC7 9659 04A6 B82D 15F0 3E67 B2B5`](<?= clearnetOrOnion("https://miraty.antopie.org", "http://miratyww5h7xhki2ttodapygnukmnrywn4osw3d32llc4sggzmyso5id.onion") ?>/B16B12A8957B2EC7965904A6B82D15F03E67B2B5.asc) |
|||
@ -1,3 +1,5 @@ |
|||
# Comment utiliser son adresse courriel Antopie |
|||
|
|||
Cette page de concerne que les personnes pour lesquelles j'ai manuellement créé un compte interne. Ce service n'est pas ouvert au public. |
|||
|
|||
## Webmail Roundcube |
|||
@ -1,21 +0,0 @@ |
|||
Font license info |
|||
|
|||
|
|||
## Font Awesome |
|||
|
|||
Copyright (C) 2016 by Dave Gandy |
|||
|
|||
Author: Dave Gandy |
|||
License: SIL () |
|||
Homepage: http://fortawesome.github.com/Font-Awesome/ |
|||
|
|||
|
|||
## Entypo |
|||
|
|||
Copyright (C) 2012 by Daniel Bruce |
|||
|
|||
Author: Daniel Bruce |
|||
License: SIL (http://scripts.sil.org/OFL) |
|||
Homepage: http://www.entypo.com |
|||
|
|||
|
|||
@ -1,75 +0,0 @@ |
|||
This webfont is generated by http://fontello.com open source project. |
|||
|
|||
|
|||
================================================================================ |
|||
Please, note, that you should obey original font licenses, used to make this |
|||
webfont pack. Details available in LICENSE.txt file. |
|||
|
|||
- Usually, it's enough to publish content of LICENSE.txt file somewhere on your |
|||
site in "About" section. |
|||
|
|||
- If your project is open-source, usually, it will be ok to make LICENSE.txt |
|||
file publicly available in your repository. |
|||
|
|||
- Fonts, used in Fontello, don't require a clickable link on your site. |
|||
But any kind of additional authors crediting is welcome. |
|||
================================================================================ |
|||
|
|||
|
|||
Comments on archive content |
|||
--------------------------- |
|||
|
|||
- /font/* - fonts in different formats |
|||
|
|||
- /css/* - different kinds of css, for all situations. Should be ok with |
|||
twitter bootstrap. Also, you can skip <i> style and assign icon classes |
|||
directly to text elements, if you don't mind about IE7. |
|||
|
|||
- demo.html - demo file, to show your webfont content |
|||
|
|||
- LICENSE.txt - license info about source fonts, used to build your one. |
|||
|
|||
- config.json - keeps your settings. You can import it back into fontello |
|||
anytime, to continue your work |
|||
|
|||
|
|||
Why so many CSS files ? |
|||
----------------------- |
|||
|
|||
Because we like to fit all your needs :) |
|||
|
|||
- basic file, <your_font_name>.css - is usually enough, it contains @font-face |
|||
and character code definitions |
|||
|
|||
- *-ie7.css - if you need IE7 support, but still don't wish to put char codes |
|||
directly into html |
|||
|
|||
- *-codes.css and *-ie7-codes.css - if you like to use your own @font-face |
|||
rules, but still wish to benefit from css generation. That can be very |
|||
convenient for automated asset build systems. When you need to update font - |
|||
no need to manually edit files, just override old version with archive |
|||
content. See fontello source code for examples. |
|||
|
|||
- *-embedded.css - basic css file, but with embedded WOFF font, to avoid |
|||
CORS issues in Firefox and IE9+, when fonts are hosted on the separate domain. |
|||
We strongly recommend to resolve this issue by `Access-Control-Allow-Origin` |
|||
server headers. But if you ok with dirty hack - this file is for you. Note, |
|||
that data url moved to separate @font-face to avoid problems with <IE9, when |
|||
string is too long. |
|||
|
|||
- animate.css - use it to get ideas about spinner rotation animation. |
|||
|
|||
|
|||
Attention for server setup |
|||
-------------------------- |
|||
|
|||
You MUST setup server to reply with proper `mime-types` for font files - |
|||
otherwise some browsers will fail to show fonts. |
|||
|
|||
Usually, `apache` already has necessary settings, but `nginx` and other |
|||
webservers should be tuned. Here is list of mime types for our file extensions: |
|||
|
|||
- `application/vnd.ms-fontobject` - eot |
|||
- `application/x-font-woff` - woff |
|||
- `application/x-font-ttf` - ttf |
|||
- `image/svg+xml` - svg |
|||
@ -1,48 +0,0 @@ |
|||
{ |
|||
"name": "", |
|||
"css_prefix_text": "icon-", |
|||
"css_use_suffix": false, |
|||
"hinting": true, |
|||
"units_per_em": 1000, |
|||
"ascent": 850, |
|||
"glyphs": [ |
|||
{ |
|||
"uid": "2a540649f305b0747c08e168c135b191", |
|||
"css": "ynh", |
|||
"code": 59392, |
|||
"src": "custom_icons", |
|||
"selected": true, |
|||
"svg": { |
|||
"path": "M1141.2 600C1117.4 658.6 1043.2 666.7 976.5 682.4 969.3 756.4 1012.4 811.2 964.7 870.6 889.3 867.5 876.8 801.7 882.4 717.6 870.6 717.6 858.8 717.6 847.1 717.6 822.5 750.2 857.6 770.8 847.1 811.8 833.9 862.8 754.4 904.8 717.6 894.1 692 886.6 647.5 816.1 658.8 752.9 692 721.1 691.3 789.6 729.4 788.2 788.8 696 616.1 687.6 635.3 588.2 649.9 512.7 772.5 474.6 811.8 576.5 829.9 626 750.9 578.4 752.9 611.8 749.7 630.8 764.1 632 764.7 647.1 794.4 656.1 784.5 621.6 800 611.8 821.9 598 836.4 602.9 870.6 600 899.4 570 883.3 495.1 917.6 470.6 963.2 476 989.2 501.1 988.2 552.9 1070.7 542.5 1109.4 541.8 1141.2 600ZM1023.5 152.9C1030.7 190.7 1050.8 211.5 1047.1 247.1 1043.1 284.8 1012.9 350.9 1000 352.9 986.2 355.1 984.2 373.9 976.5 376.5 921.6 394.9 830.7 359.1 811.8 294.1 798.1 247.4 834.1 136.8 858.8 94.1 874.1 67.6 873.2 58.9 917.6 47.1 946 39.4 960.6 20.6 988.2 47.1 993.8 52.4 1003.5 52.8 1010 57.5 1007.7 57.5 1033.5 94.5 1035.3 105.9 1039.1 130.2 1020.8 138.6 1023.5 152.9ZM929.4 258.8C950.3 236.6 968.1 211.3 964.7 164.7 911.6 145.1 878.5 250.6 929.4 258.8ZM788.2 247.1C787.4 315.4 817.4 372.9 788.2 423.5 709.1 436 703.1 375.3 658.8 352.9 636 369.3 641.3 413.9 623.5 435.3 579.1 440.5 568.4 412.1 541.2 400 570.2 308.1 556 176.7 564.7 94.1 665.6 87.3 655.1 192 705.9 235.3 712 184.2 701.7 52.7 741.2 0 827.4 38.7 789.3 152.8 788.2 247.1ZM611.8 647.1C634.5 746 613.2 914 470.6 882.4 451.9 878.2 371.5 820.9 364.7 800 345.6 741.2 368.7 643.1 400 611.8 459.2 552.6 535.1 592.5 611.8 647.1ZM458.8 776.5C512.4 787.8 532.9 727.1 505.9 694.1 463.2 694.5 454.2 728.7 458.8 776.5ZM458.8 94.1C524.5 104.7 534.1 174.2 517.6 270.6 500.8 369.2 482.1 442.2 411.8 447.1 299.2 454.7 267.6 250.7 305.9 105.9 403.8 120.8 383.4 227.8 376.5 305.9 408.4 315.6 402.4 295.9 411.8 282.4 435.9 247.5 444.9 160.1 458.8 94.1ZM329.4 729.4C330.6 796.1 381.2 862.7 352.9 929.4 302.1 917.5 275.6 881.3 247.1 847.1 210 841.4 220.5 883.2 176.5 870.6 168.6 930.1 203.4 959.6 164.7 988.2 109.4 980.8 86.4 941.2 70.6 894.1 39.9 877.9 6.1 864.5 0 823.5 1.6 782 52.7 790 82.4 776.5 87.9 711.4 65.8 618.7 105.9 588.2 203.6 594 202.5 672.1 188.2 764.7 239.5 768.1 246.4 713.5 247.1 682.4 247.8 653.8 225.6 585.2 270.6 552.9 306.6 544.4 305.2 573.3 341.2 564.7 380.6 620 328.5 675.8 329.4 729.4ZM282.4 141.2C294.9 224.4 236.9 236.9 211.8 282.4 214.2 363.3 206.2 433.6 188.2 494.1 119.3 478.6 85.9 372 117.6 294.1 113.8 252.7 55.8 244.5 35.3 200 31.8 192.2 29.8 147.9 23.5 117.6 12.8 66.2 6.5 50.7 35.3 11.8 131.3 6 120.1 107.4 141.2 176.5 200.6 181.1 187.2 112.7 235.3 105.9 246.8 121.8 266.7 129.4 282.4 141.2Z", |
|||
"width": 1153 |
|||
}, |
|||
"search": [ |
|||
"logo-ynh-white" |
|||
] |
|||
}, |
|||
{ |
|||
"uid": "e7cb72a17f3b21e3576f35c3f0a7639b", |
|||
"css": "git", |
|||
"code": 61907, |
|||
"src": "fontawesome" |
|||
}, |
|||
{ |
|||
"uid": "399ef63b1e23ab1b761dfbb5591fa4da", |
|||
"css": "right-open", |
|||
"code": 59394, |
|||
"src": "fontawesome" |
|||
}, |
|||
{ |
|||
"uid": "1d7c1d30ad49a988556273a238097c2a", |
|||
"css": "doc-text-inv", |
|||
"code": 59395, |
|||
"src": "entypo" |
|||
}, |
|||
{ |
|||
"uid": "d7271d490b71df4311e32cdacae8b331", |
|||
"css": "home", |
|||
"code": 59393, |
|||
"src": "fontawesome" |
|||
} |
|||
] |
|||
} |
|||
@ -1,85 +0,0 @@ |
|||
/* |
|||
Animation example, for spinners |
|||
*/ |
|||
.animate-spin { |
|||
-moz-animation: spin 2s infinite linear; |
|||
-o-animation: spin 2s infinite linear; |
|||
-webkit-animation: spin 2s infinite linear; |
|||
animation: spin 2s infinite linear; |
|||
display: inline-block; |
|||
} |
|||
@-moz-keyframes spin { |
|||
0% { |
|||
-moz-transform: rotate(0deg); |
|||
-o-transform: rotate(0deg); |
|||
-webkit-transform: rotate(0deg); |
|||
transform: rotate(0deg); |
|||
} |
|||
|
|||
100% { |
|||
-moz-transform: rotate(359deg); |
|||
-o-transform: rotate(359deg); |
|||
-webkit-transform: rotate(359deg); |
|||
transform: rotate(359deg); |
|||
} |
|||
} |
|||
@-webkit-keyframes spin { |
|||
0% { |
|||
-moz-transform: rotate(0deg); |
|||
-o-transform: rotate(0deg); |
|||
-webkit-transform: rotate(0deg); |
|||
transform: rotate(0deg); |
|||
} |
|||
|
|||
100% { |
|||
-moz-transform: rotate(359deg); |
|||
-o-transform: rotate(359deg); |
|||
-webkit-transform: rotate(359deg); |
|||
transform: rotate(359deg); |
|||
} |
|||
} |
|||
@-o-keyframes spin { |
|||
0% { |
|||
-moz-transform: rotate(0deg); |
|||
-o-transform: rotate(0deg); |
|||
-webkit-transform: rotate(0deg); |
|||
transform: rotate(0deg); |
|||
} |
|||
|
|||
100% { |
|||
-moz-transform: rotate(359deg); |
|||
-o-transform: rotate(359deg); |
|||
-webkit-transform: rotate(359deg); |
|||
transform: rotate(359deg); |
|||
} |
|||
} |
|||
@-ms-keyframes spin { |
|||
0% { |
|||
-moz-transform: rotate(0deg); |
|||
-o-transform: rotate(0deg); |
|||
-webkit-transform: rotate(0deg); |
|||
transform: rotate(0deg); |
|||
} |
|||
|
|||
100% { |
|||
-moz-transform: rotate(359deg); |
|||
-o-transform: rotate(359deg); |
|||
-webkit-transform: rotate(359deg); |
|||
transform: rotate(359deg); |
|||
} |
|||
} |
|||
@keyframes spin { |
|||
0% { |
|||
-moz-transform: rotate(0deg); |
|||
-o-transform: rotate(0deg); |
|||
-webkit-transform: rotate(0deg); |
|||
transform: rotate(0deg); |
|||
} |
|||
|
|||
100% { |
|||
-moz-transform: rotate(359deg); |
|||
-o-transform: rotate(359deg); |
|||
-webkit-transform: rotate(359deg); |
|||
transform: rotate(359deg); |
|||
} |
|||
} |
|||
@ -1,6 +0,0 @@ |
|||
|
|||
.icon-ynh:before { content: '\e800'; } /* '' */ |
|||
.icon-home:before { content: '\e801'; } /* '' */ |
|||
.icon-right-open:before { content: '\e802'; } /* '' */ |
|||
.icon-doc-text-inv:before { content: '\e803'; } /* '' */ |
|||
.icon-git:before { content: '\f1d3'; } /* '' */ |
|||
59
antopie/fontello/css/fontello-embedded.css
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -1,6 +0,0 @@ |
|||
|
|||
.icon-ynh { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-home { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-right-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-doc-text-inv { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-git { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
@ -1,17 +0,0 @@ |
|||
[class^="icon-"], [class*=" icon-"] { |
|||
font-family: 'fontello'; |
|||
font-style: normal; |
|||
font-weight: normal; |
|||
|
|||
/* fix buttons height */ |
|||
line-height: 1em; |
|||
|
|||
/* you can be more comfortable with increased icons size */ |
|||
/* font-size: 120%; */ |
|||
} |
|||
|
|||
.icon-ynh { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-home { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-right-open { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-doc-text-inv { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
.icon-git { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); } |
|||
@ -1,62 +0,0 @@ |
|||
@font-face { |
|||
font-family: 'fontello'; |
|||
src: url('../font/fontello.eot?5025401'); |
|||
src: url('../font/fontello.eot?5025401#iefix') format('embedded-opentype'), |
|||
url('../font/fontello.woff2?5025401') format('woff2'), |
|||
url('../font/fontello.woff?5025401') format('woff'), |
|||
url('../font/fontello.ttf?5025401') format('truetype'), |
|||
url('../font/fontello.svg?5025401#fontello') format('svg'); |
|||
font-weight: normal; |
|||
font-style: normal; |
|||
} |
|||
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ |
|||
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ |
|||
/* |
|||
@media screen and (-webkit-min-device-pixel-ratio:0) { |
|||
@font-face { |
|||
font-family: 'fontello'; |
|||
src: url('../font/fontello.svg?5025401#fontello') format('svg'); |
|||
} |
|||
} |
|||
*/ |
|||
|
|||
[class^="icon-"]:before, [class*=" icon-"]:before { |
|||
font-family: "fontello"; |
|||
font-style: normal; |
|||
font-weight: normal; |
|||
speak: never; |
|||
|
|||
display: inline-block; |
|||
text-decoration: inherit; |
|||
width: 1em; |
|||
margin-right: .2em; |
|||
text-align: center; |
|||
/* opacity: .8; */ |
|||
|
|||
/* For safety - reset parent styles, that can break glyph codes*/ |
|||
font-variant: normal; |
|||
text-transform: none; |
|||
|
|||
/* fix buttons height, for twitter bootstrap */ |
|||
line-height: 1em; |
|||
|
|||
/* Animation center compensation - margins should be symmetric */ |
|||
/* remove if not needed */ |
|||
margin-left: .2em; |
|||
|
|||
/* you can be more comfortable with increased icons size */ |
|||
/* font-size: 120%; */ |
|||
|
|||
/* Font smoothing. That was taken from TWBS */ |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
|
|||
/* Uncomment for 3D effect */ |
|||
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ |
|||
} |
|||
|
|||
.icon-ynh:before { content: '\e800'; } /* '' */ |
|||
.icon-home:before { content: '\e801'; } /* '' */ |
|||
.icon-right-open:before { content: '\e802'; } /* '' */ |
|||
.icon-doc-text-inv:before { content: '\e803'; } /* '' */ |
|||
.icon-git:before { content: '\f1d3'; } /* '' */ |
|||
@ -1 +0,0 @@ |
|||
@font-face{font-family:'fontello';src:url('../font/fontello.eot?5025401');src:url('../font/fontello.eot?5025401#iefix') format('embedded-opentype'), url('../font/fontello.woff2?5025401') format('woff2'), url('../font/fontello.woff?5025401') format('woff'), url('../font/fontello.ttf?5025401') format('truetype'), url('../font/fontello.svg?5025401#fontello') format('svg');font-weight:normal;font-style:normal;}[class^="icon-"]:before,[class*=" icon-"]:before{font-family:"fontello";font-style:normal;font-weight:normal;speak:never;display:inline-block;text-decoration:inherit;width:1em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;margin-left:.2em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.icon-ynh:before{content:'\e800';}.icon-home:before{content:'\e801';}.icon-right-open:before{content:'\e802';}.icon-doc-text-inv:before{content:'\e803';}.icon-git:before{content:'\f1d3';} |
|||
@ -1,312 +0,0 @@ |
|||
<!DOCTYPE html> |
|||
<html> |
|||
<head><!--[if lt IE 9]><script language="javascript" type="text/javascript" src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--> |
|||
<meta charset="UTF-8"><style>/* |
|||
* Bootstrap v2.2.1 |
|||
* |
|||
* Copyright 2012 Twitter, Inc |
|||
* Licensed under the Apache License v2.0 |
|||
* http://www.apache.org/licenses/LICENSE-2.0 |
|||
* |
|||
* Designed and built with all the love in the world @twitter by @mdo and @fat. |
|||
*/ |
|||
.clearfix { |
|||
*zoom: 1; |
|||
} |
|||
.clearfix:before, |
|||
.clearfix:after { |
|||
display: table; |
|||
content: ""; |
|||
line-height: 0; |
|||
} |
|||
.clearfix:after { |
|||
clear: both; |
|||
} |
|||
html { |
|||
font-size: 100%; |
|||
-webkit-text-size-adjust: 100%; |
|||
-ms-text-size-adjust: 100%; |
|||
} |
|||
a:focus { |
|||
outline: thin dotted #333; |
|||
outline: 5px auto -webkit-focus-ring-color; |
|||
outline-offset: -2px; |
|||
} |
|||
a:hover, |
|||
a:active { |
|||
outline: 0; |
|||
} |
|||
button, |
|||
input, |
|||
select, |
|||
textarea { |
|||
margin: 0; |
|||
font-size: 100%; |
|||
vertical-align: middle; |
|||
} |
|||
button, |
|||
input { |
|||
*overflow: visible; |
|||
line-height: normal; |
|||
} |
|||
button::-moz-focus-inner, |
|||
input::-moz-focus-inner { |
|||
padding: 0; |
|||
border: 0; |
|||
} |
|||
body { |
|||
margin: 0; |
|||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; |
|||
font-size: 14px; |
|||
line-height: 20px; |
|||
color: #333; |
|||
background-color: #fff; |
|||
} |
|||
a { |
|||
color: #08c; |
|||
text-decoration: none; |
|||
} |
|||
a:hover { |
|||
color: #005580; |
|||
text-decoration: underline; |
|||
} |
|||
.row { |
|||
margin-left: -20px; |
|||
*zoom: 1; |
|||
} |
|||
.row:before, |
|||
.row:after { |
|||
display: table; |
|||
content: ""; |
|||
line-height: 0; |
|||
} |
|||
.row:after { |
|||
clear: both; |
|||
} |
|||
[class*="span"] { |
|||
float: left; |
|||
min-height: 1px; |
|||
margin-left: 20px; |
|||
} |
|||
.container, |
|||
.navbar-static-top .container, |
|||
.navbar-fixed-top .container, |
|||
.navbar-fixed-bottom .container { |
|||
width: 940px; |
|||
} |
|||
.span12 { |
|||
width: 940px; |
|||
} |
|||
.span11 { |
|||
width: 860px; |
|||
} |
|||
.span10 { |
|||
width: 780px; |
|||
} |
|||
.span9 { |
|||
width: 700px; |
|||
} |
|||
.span8 { |
|||
width: 620px; |
|||
} |
|||
.span7 { |
|||
width: 540px; |
|||
} |
|||
.span6 { |
|||
width: 460px; |
|||
} |
|||
.span5 { |
|||
width: 380px; |
|||
} |
|||
.span4 { |
|||
width: 300px; |
|||
} |
|||
.span3 { |
|||
width: 220px; |
|||
} |
|||
.span2 { |
|||
width: 140px; |
|||
} |
|||
.span1 { |
|||
width: 60px; |
|||
} |
|||
[class*="span"].pull-right, |
|||
.row-fluid [class*="span"].pull-right { |
|||
float: right; |
|||
} |
|||
.container { |
|||
margin-right: auto; |
|||
margin-left: auto; |
|||
*zoom: 1; |
|||
} |
|||
.container:before, |
|||
.container:after { |
|||
display: table; |
|||
content: ""; |
|||
line-height: 0; |
|||
} |
|||
.container:after { |
|||
clear: both; |
|||
} |
|||
p { |
|||
margin: 0 0 10px; |
|||
} |
|||
.lead { |
|||
margin-bottom: 20px; |
|||
font-size: 21px; |
|||
font-weight: 200; |
|||
line-height: 30px; |
|||
} |
|||
small { |
|||
font-size: 85%; |
|||
} |
|||
h1 { |
|||
margin: 10px 0; |
|||
font-family: inherit; |
|||
font-weight: bold; |
|||
line-height: 20px; |
|||
color: inherit; |
|||
text-rendering: optimizelegibility; |
|||
} |
|||
h1 small { |
|||
font-weight: normal; |
|||
line-height: 1; |
|||
color: #999; |
|||
} |
|||
h1 { |
|||
line-height: 40px; |
|||
} |
|||
h1 { |
|||
font-size: 38.5px; |
|||
} |
|||
h1 small { |
|||
font-size: 24.5px; |
|||
} |
|||
body { |
|||
margin-top: 90px; |
|||
} |
|||
.header { |
|||
position: fixed; |
|||
top: 0; |
|||
left: 50%; |
|||
margin-left: -480px; |
|||
background-color: #fff; |
|||
border-bottom: 1px solid #ddd; |
|||
padding-top: 10px; |
|||
z-index: 10; |
|||
} |
|||
.footer { |
|||
color: #ddd; |
|||
font-size: 12px; |
|||
text-align: center; |
|||
margin-top: 20px; |
|||
} |
|||
.footer a { |
|||
color: #ccc; |
|||
text-decoration: underline; |
|||
} |
|||
.the-icons { |
|||
font-size: 14px; |
|||
line-height: 24px; |
|||
} |
|||
.switch { |
|||
position: absolute; |
|||
right: 0; |
|||
bottom: 10px; |
|||
color: #666; |
|||
} |
|||
.switch input { |
|||
margin-right: 0.3em; |
|||
} |
|||
.codesOn .i-name { |
|||
display: none; |
|||
} |
|||
.codesOn .i-code { |
|||
display: inline; |
|||
} |
|||
.i-code { |
|||
display: none; |
|||
} |
|||
@font-face { |
|||
font-family: 'fontello'; |
|||
src: url('./font/fontello.eot?44739574'); |
|||
src: url('./font/fontello.eot?44739574#iefix') format('embedded-opentype'), |
|||
url('./font/fontello.woff?44739574') format('woff'), |
|||
url('./font/fontello.ttf?44739574') format('truetype'), |
|||
url('./font/fontello.svg?44739574#fontello') format('svg'); |
|||
font-weight: normal; |
|||
font-style: normal; |
|||
} |
|||
|
|||
|
|||
.demo-icon |
|||
{ |
|||
font-family: "fontello"; |
|||
font-style: normal; |
|||
font-weight: normal; |
|||
speak: never; |
|||
|
|||
display: inline-block; |
|||
text-decoration: inherit; |
|||
width: 1em; |
|||
margin-right: .2em; |
|||
text-align: center; |
|||
/* opacity: .8; */ |
|||
|
|||
/* For safety - reset parent styles, that can break glyph codes*/ |
|||
font-variant: normal; |
|||
text-transform: none; |
|||
|
|||
/* fix buttons height, for twitter bootstrap */ |
|||
line-height: 1em; |
|||
|
|||
/* Animation center compensation - margins should be symmetric */ |
|||
/* remove if not needed */ |
|||
margin-left: .2em; |
|||
|
|||
/* You can be more comfortable with increased icons size */ |
|||
/* font-size: 120%; */ |
|||
|
|||
/* Font smoothing. That was taken from TWBS */ |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
|
|||
/* Uncomment for 3D effect */ |
|||
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ |
|||
} |
|||
</style> |
|||
<link rel="stylesheet" href="css/animation.css"><!--[if IE 7]><link rel="stylesheet" href="css/" + font.fontname + "-ie7.css"><![endif]--> |
|||
<script> |
|||
function toggleCodes(on) { |
|||
var obj = document.getElementById('icons'); |
|||
|
|||
if (on) { |
|||
obj.className += ' codesOn'; |
|||
} else { |
|||
obj.className = obj.className.replace(' codesOn', ''); |
|||
} |
|||
} |
|||
|
|||
</script> |
|||
</head> |
|||
<body> |
|||
<div class="container header"> |
|||
<h1>fontello <small>font demo</small></h1> |
|||
<label class="switch"> |
|||
<input type="checkbox" onclick="toggleCodes(this.checked)">show codes |
|||
</label> |
|||
</div> |
|||
<div class="container" id="icons"> |
|||
<div class="row"> |
|||
<div class="the-icons span3" title="Code: 0xe800"><i class="demo-icon icon-ynh"></i> <span class="i-name">icon-ynh</span><span class="i-code">0xe800</span></div> |
|||
<div class="the-icons span3" title="Code: 0xe801"><i class="demo-icon icon-home"></i> <span class="i-name">icon-home</span><span class="i-code">0xe801</span></div> |
|||
<div class="the-icons span3" title="Code: 0xe802"><i class="demo-icon icon-right-open"></i> <span class="i-name">icon-right-open</span><span class="i-code">0xe802</span></div> |
|||
<div class="the-icons span3" title="Code: 0xe803"><i class="demo-icon icon-doc-text-inv"></i> <span class="i-name">icon-doc-text-inv</span><span class="i-code">0xe803</span></div> |
|||
</div> |
|||
<div class="row"> |
|||
<div class="the-icons span3" title="Code: 0xf1d3"><i class="demo-icon icon-git"></i> <span class="i-name">icon-git</span><span class="i-code">0xf1d3</span></div> |
|||
</div> |
|||
</div> |
|||
<div class="container footer">Generated by <a href="http://fontello.com">fontello.com</a></div> |
|||
</body> |
|||
</html> |
|||
@ -1,20 +0,0 @@ |
|||
<?xml version="1.0" standalone="no"?> |
|||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> |
|||
<svg xmlns="http://www.w3.org/2000/svg"> |
|||
<metadata>Copyright (C) 2020 by original authors @ fontello.com</metadata> |
|||
<defs> |
|||
<font id="fontello" horiz-adv-x="1000" > |
|||
<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" /> |
|||
<missing-glyph horiz-adv-x="1000" /> |
|||
<glyph glyph-name="ynh" unicode="" d="M1141 250c-24-59-98-67-164-82-8-74 35-129-12-189-76 3-88 69-83 153-11 0-23 0-35 0-24-32 11-53 0-94-13-51-93-93-129-82-26 7-70 78-59 141 33 32 32-37 70-35 60 92-113 100-94 200 15 75 138 113 177 12 18-50-61-2-59-36-3-19 11-20 12-35 29-9 20 25 35 35 22 14 36 9 71 12 28 30 12 105 47 129 45-5 71-30 70-82 83 11 121 11 153-47z m-117 447c7-38 27-58 23-94-4-38-34-104-47-106-14-2-16-21-23-23-55-19-146 17-165 82-14 47 22 157 47 200 15 26 14 35 59 47 28 8 43 26 70 0 6-5 16-6 22-10-2 0 24-37 25-49 4-24-14-33-11-47z m-95-106c21 22 39 48 36 94-53 20-86-86-36-94z m-141 12c-1-68 29-126 0-176-79-13-85 48-129 70-23-16-18-61-35-82-45-5-56 23-83 35 29 92 15 223 24 306 101 7 90-98 141-141 6 51-4 182 35 235 86-39 48-153 47-247z m-176-400c23-99 1-267-141-235-19 4-99 61-106 82-19 59 4 157 35 188 59 59 135 20 212-35z m-153-129c53-12 74 49 47 82-43 0-52-35-47-82z m0 682c66-11 75-80 59-177-17-98-36-171-106-176-113-8-144 196-106 341 98-15 77-122 71-200 31-10 25 10 35 24 24 35 33 122 47 188z m-130-635c2-67 52-134 24-200-51 11-77 48-106 82-37 6-26-36-70-24-8-59 26-89-12-117-56 7-79 47-94 94-31 16-65 29-71 71 2 41 53 33 82 47 6 65-16 157 24 188 98-6 97-84 82-177 52-3 58 52 59 83 1 28-21 97 24 129 36 9 34-20 70-12 40-55-12-111-12-164z m-47 588c13-83-45-96-70-141 2-81-6-152-24-212-69 15-102 122-70 200-4 41-62 50-83 94-3 8-5 52-11 82-11 52-17 67 11 106 96 6 85-95 106-164 60-5 46 63 94 70 12-16 32-23 47-35z" horiz-adv-x="1153" /> |
|||
|
|||
<glyph glyph-name="home" unicode="" d="M786 296v-267q0-15-11-25t-25-11h-214v214h-143v-214h-214q-15 0-25 11t-11 25v267q0 1 0 2t0 2l321 264 321-264q1-1 1-4z m124 39l-34-41q-5-5-12-6h-2q-7 0-12 3l-386 322-386-322q-7-4-13-3-7 1-12 6l-35 41q-4 6-3 13t6 12l401 334q18 15 42 15t43-15l136-113v108q0 8 5 13t13 5h107q8 0 13-5t5-13v-227l122-102q6-4 6-12t-4-13z" horiz-adv-x="928.6" /> |
|||
|
|||
<glyph glyph-name="right-open" unicode="" d="M618 361l-414-415q-11-10-25-10t-25 10l-93 93q-11 11-11 25t11 25l296 297-296 296q-11 11-11 25t11 25l93 93q10 11 25 11t25-11l414-414q10-11 10-25t-10-25z" horiz-adv-x="714.3" /> |
|||
|
|||
<glyph glyph-name="doc-text-inv" unicode="" d="M600 800q42 0 71-29t29-71l0-700q0-40-29-70t-71-30l-500 0q-40 0-70 30t-30 70l0 700q0 42 30 71t70 29l500 0z m-460-208l0-88 420 0 0 88-420 0z m420-480l0 88-420 0 0-88 420 0z m0 196l0 90-418 0 0-90 418 0z" horiz-adv-x="700" /> |
|||
|
|||
<glyph glyph-name="git" unicode="" d="M332 5q0 56-92 56-88 0-88-58 0-57 96-57 84 0 84 59z m-33 422q0 34-17 56t-49 23q-69 0-69-81 0-75 69-75 66 0 66 77z m150 180v-112q-20-7-44-13 9-24 9-47 0-70-41-120t-110-63q-22-5-33-15t-11-33q0-17 13-28t32-18 44-12 48-15 44-21 32-35 13-55q0-170-203-170-38 0-72 7t-65 23-49 46-18 71q0 92 102 125v3q-38 22-38 70 0 61 35 76v3q-40 13-66 60t-27 93q0 77 53 129t131 51q54 0 100-26 54 0 121 26z m178-491h-124q2 25 2 74v340q0 53-2 72h124q-3-19-3-69v-343q0-49 3-74z m335 124v-110q-40-22-97-22-35 0-60 12t-39 27-22 44-10 51-2 58v196h1v2q-4 0-11 0t-10 1q-12 0-33-3v106h54v42q0 30-4 50h127q-3-23-3-92h95v-106q-8 0-24 1t-24 1h-47v-204q0-73 48-73 34 0 61 19z m-321 528q0-32-22-57t-54-24q-32 0-54 24t-23 57q0 33 22 57t55 25q33 0 54-25t22-57z" horiz-adv-x="1000" /> |
|||
</font> |
|||
</defs> |
|||
</svg> |
|||
|
Before Width: 350 | Height: 66 | Size: 4.1 KiB |
|
Before Width: 350 | Height: 66 | Size: 5.6 KiB After Width: 350 | Height: 66 | Size: 4.1 KiB |
@ -1,3 +1,5 @@ |
|||
# Manifeste sur le contenu |
|||
|
|||
Antopie est hostile à la propagation de contenus droitistes, et est susceptible d'appliquer une modération en conséquence. |
|||
|
|||
Le terme droitiste peut par exemple comprendre *essentialiste*, *spéciste*, *genriste*, *raciste*, *nationaliste*, *autoritariste*, *capitaliste*, *propriétariste*, *productiviste*, *capacitiste*, *socio-normativiste*, *théiste*, *spiritualiste* ou *conspirationniste*. |
|||
@ -1,3 +1,4 @@ |
|||
# Utiliser Matrix |
|||
|
|||
Matrix est un protocole de communication permettant les communications instantanées sur Internet. |
|||
|
|||
@ -1,28 +0,0 @@ |
|||
<div id="nc"> |
|||
<div class="sparks-combo"> |
|||
<div class="spark"></div> |
|||
<div class="spark"></div> |
|||
<div class="spark"></div> |
|||
<div class="spark"></div> |
|||
</div> |
|||
|
|||
<div id="wave-a" class="hot rainbow"></div> |
|||
<div id="wave-a" class="cold rainbow"></div> |
|||
|
|||
<div id="wave-b" class="hot rainbow"></div> |
|||
<div id="wave-b" class="cold rainbow"></div> |
|||
|
|||
<div id="nyan-cat" class="frame1"> |
|||
<div id="tail"></div> |
|||
|
|||
<div id="paws"></div> |
|||
|
|||
<div id="pop-tarts-body"> |
|||
<div id="pop-tarts-body-cream"></div> |
|||
</div> |
|||
|
|||
<div id="head"> |
|||
<div id="face"></div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
@ -1,70 +0,0 @@ |
|||
<?php |
|||
$suffix = " · Antopie"; |
|||
function getPageMetas($pageId) { |
|||
switch ($pageId) { |
|||
case "index": |
|||
$page['titre'] = "Antopie"; |
|||
$page['description'] = "Page d'accueil d'Antopie"; |
|||
$page['type'] = "centré"; |
|||
break; |
|||
case "404": |
|||
$page['titre'] = "Erreur 404"; |
|||
$page['description'] = "Erreur 404 : la page que vous avez demandé n'existe pas"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "cgu": |
|||
$page['titre'] = "Conditions générales d'utilisation"; |
|||
$page['h1'] = "Conditions générales d'utilisation"; |
|||
$page['description'] = "Conditions générales d'utilisation des services Antopie"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "manifeste-sur-le-contenu": |
|||
$page['titre'] = "Manifeste sur le contenu"; |
|||
$page['h1'] = "Manifeste sur le contenu"; |
|||
$page['description'] = "Manifeste concernant le contenu hébergé par Antopie"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "details-techniques": |
|||
$page['titre'] = "Détails techniques"; |
|||
$page['h1'] = "Détails techniques sur l'infrastructure d'Antopie"; |
|||
$page['description'] = "Détails techniques sur l'infrastructure d'Antopie"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "contact": |
|||
$page['titre'] = "Me contacter"; |
|||
$page['h1'] = "Me contacter"; |
|||
$page['description'] = "Me contacter à propos d'Antopie"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "nextcloud": |
|||
$page['titre'] = "Nextcloud"; |
|||
$page['h1'] = "Nextcloud"; |
|||
$page['description'] = "Aide pour utiliser le serveur Nextcloud d'Antopie"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "courriel": |
|||
$page['titre'] = "Courriel"; |
|||
$page['h1'] = "Comment utiliser mon adresse courriel Antopie ?"; |
|||
$page['description'] = "Comment utiliser mon adresse courriel Antopie ?"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "matrix": |
|||
$page['titre'] = "Utiliser Matrix"; |
|||
$page['h1'] = "Utiliser Matrix"; |
|||
$page['description'] = "Tutoriel pour apprendre à utiliser le protocol de communication Matrix"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
case "autres-initiatives": |
|||
$page['titre'] = "Autres initiatives"; |
|||
$page['h1'] = "Autres initiatives"; |
|||
$page['description'] = "Autres initiative de décentraliser et décommercialiser Internet"; |
|||
$page['type'] = "article"; |
|||
break; |
|||
default: |
|||
$page['titre'] = "Erreur : Le titre n'a pas été trouvé dans inc/pages.php"; |
|||
$page['h1'] = "Erreur : Le titre n'a pas été trouvé dans inc/pages.php"; |
|||
$page['description'] = "Erreur : La descripiton n'a pas été trouvée dans inc/pages.php"; |
|||
$page['type'] = "article"; |
|||
} |
|||
return $page; |
|||
} |
|||
@ -1,576 +0,0 @@ |
|||
|
|||
#nc { |
|||
width: 100%; |
|||
height: 100%; |
|||
margin: 0; |
|||
padding: 0; |
|||
overflow: hidden; |
|||
} |
|||
#nc { |
|||
font: 13px/1.4 Helvetica, arial, freesans, clean, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol"; |
|||
} |
|||
|
|||
/* nyan cat! */ |
|||
#nyan-cat { |
|||
position: absolute; |
|||
width: 194px; |
|||
height: 122px; |
|||
top: 50%; |
|||
left: 50%; |
|||
margin-top: -60px; |
|||
margin-left: -97px; |
|||
z-index: 2; |
|||
} |
|||
#nyan-cat.frame1, |
|||
#nyan-cat.frame2 { |
|||
margin-top: -54px; |
|||
} |
|||
/* pop-tarts body */ |
|||
#pop-tarts-body { |
|||
border: solid black; |
|||
border-width: 6px 0; |
|||
width: 97px; |
|||
height: 92px; |
|||
position: absolute; |
|||
left: 52px; |
|||
top: 0; |
|||
} |
|||
#pop-tarts-body:after { |
|||
content: ''; |
|||
border: solid black; |
|||
border-width: 0 6px; |
|||
width: 109px; |
|||
height: 80px; |
|||
position: absolute; |
|||
top: 6px; |
|||
left: -12px; |
|||
} |
|||
#pop-tarts-body:before { |
|||
content: ''; |
|||
position: absolute; |
|||
left: -6px; |
|||
top: 0; |
|||
width: 109px; |
|||
height: 92px; |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-color: #fc9; |
|||
background-size: 6px 6px; |
|||
background-position: 0 0, 103px 0, 0 86px, 103px 86px; |
|||
} |
|||
#pop-tarts-body-cream { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 80px; |
|||
top: 6px; |
|||
left: 0; |
|||
background: linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat, linear-gradient(#f39, #f39) no-repeat; |
|||
background-color: #f9f; |
|||
background-size: 6px 6px; |
|||
background-position: 12px 12px, 40px 6px, 58px 6px, 35px 29px, 80px 18px, 18px 40px, 40px 46px, 6px 52px, 29px 63px; |
|||
} |
|||
#pop-tarts-body-cream:before { |
|||
content: ''; |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
left: 0; |
|||
top: 0; |
|||
background: linear-gradient(#fc9, #fc9) no-repeat, linear-gradient(#fc9, #fc9) no-repeat, linear-gradient(#fc9, #fc9) no-repeat, linear-gradient(#fc9, #fc9) no-repeat, linear-gradient(#fc9, #fc9) no-repeat, linear-gradient(#fc9, #fc9) no-repeat, linear-gradient(#fc9, #fc9) no-repeat, linear-gradient(#fc9, #fc9) no-repeat; |
|||
background-size: 12px 6px, 12px 6px, 12px 6px, 12px 6px, 6px 12px, 6px 12px, 6px 12px, 6px 12px; |
|||
background-position: 0 0, 85px 0, 0 74px, 85px 74px, 0 0, 91px 0, 0 68px, 91px 68px; |
|||
} |
|||
/* pseudo elems */ |
|||
#head:before, |
|||
#head:after, |
|||
#tail:before, |
|||
#nyan-cat:before, |
|||
#paws:before, |
|||
#face:before { |
|||
content: ''; |
|||
position: absolute; |
|||
} |
|||
.sparks-combo { |
|||
height: 300px; |
|||
width: 200%; |
|||
position: relative; |
|||
animation: woosh 700ms 0ms linear infinite both; |
|||
} |
|||
.spark { |
|||
z-index: 1; |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background-color: transparent; |
|||
background: linear-gradient(to right, white 0px, white 6px, transparent 6px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 6px, transparent 6px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 6px, transparent 6px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 6px, transparent 6px, transparent 400px) repeat-x; |
|||
} |
|||
.spark:before { |
|||
background: linear-gradient(to right, white 0px, white 5px, transparent 5px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 5px, transparent 5px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 5px, transparent 5px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 5px, transparent 5px, transparent 400px) repeat-x; |
|||
} |
|||
.spark:after { |
|||
background: linear-gradient(to right, white 0px, white 6px, transparent 6px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 6px, transparent 6px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 11px, transparent 11px, transparent 400px) repeat-x, linear-gradient(to right, white 0px, white 11px, transparent 11px, transparent 400px) repeat-x; |
|||
} |
|||
.spark:before, |
|||
.spark:after { |
|||
content: ''; |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background-color: transparent; |
|||
} |
|||
.spark:nth-child(1) { |
|||
z-index: 3; |
|||
top: 0; |
|||
left: 20px; |
|||
animation: sparkly 700ms 0ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(1):before { |
|||
animation: sparkly-before 700ms 0ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(1):after { |
|||
animation: sparkly-after 700ms 0ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(2) { |
|||
top: 40px; |
|||
left: 170px; |
|||
animation: sparkly 700ms 200ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(2):before { |
|||
animation: sparkly-before 700ms 200ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(2):after { |
|||
animation: sparkly-after 700ms 200ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(3) { |
|||
top: 100px; |
|||
left: 320px; |
|||
animation: sparkly 700ms 400ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(3):before { |
|||
animation: sparkly-before 700ms 400ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(3):after { |
|||
animation: sparkly-after 700ms 400ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(4) { |
|||
top: 150px; |
|||
left: 200px; |
|||
animation: sparkly 700ms 600ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(4):before { |
|||
animation: sparkly-before 700ms 600ms steps(1) infinite both; |
|||
} |
|||
.spark:nth-child(4):after { |
|||
animation: sparkly-after 700ms 600ms steps(1) infinite both; |
|||
} |
|||
@keyframes woosh { |
|||
0% { |
|||
left: 0px; |
|||
} |
|||
100% { |
|||
left: -400px; |
|||
} |
|||
} |
|||
@keyframes sparkly { |
|||
0% { |
|||
background-size: 400px 6px, 0 0, 0 0, 0 0; |
|||
background-position: 17px 17px, 0 0, 0 0, 0 0; |
|||
} |
|||
16% { |
|||
background-size: 400px 6px, 400px 6px, 400px 6px, 400px 6px; |
|||
background-position: 17px 0, 34px 17px, 17px 34px, 0 17px; |
|||
} |
|||
33% { |
|||
background-size: 400px 6px, 400px 6px, 400px 6px, 400px 6px; |
|||
background-position: 17px 0, 34px 17px, 17px 34px, 0 17px; |
|||
} |
|||
50% { |
|||
background-size: 400px 6px, 0 0, 0 0, 0 0; |
|||
background-position: 17px 17px, 0 0, 0 0, 0 0; |
|||
} |
|||
66% { |
|||
background-size: 400px 11px, 400px 11px, 0 0, 0 0; |
|||
background-position: 17px 6px, 17px 23px, 0 0, 0 0; |
|||
} |
|||
83% { |
|||
background-size: 0 0, 0 0, 400px 5px, 400px 5px; |
|||
background-position: 0 0, 0 0, 11px 17px, 22px 17px; |
|||
} |
|||
100% { |
|||
background-size: 400px 6px, 0 0, 0 0, 0 0; |
|||
background-position: 17px 17px, 0 0, 0 0, 0 0; |
|||
} |
|||
} |
|||
@keyframes sparkly-before { |
|||
0% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
16% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
33% { |
|||
background-size: 400px 5px, 400px 5px, 400px 5px, 400px 5px; |
|||
background-position: 6px 6px, 29px 6px, 29px 29px, 6px 29px; |
|||
} |
|||
50% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
66% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
83% { |
|||
background-size: 0 0, 0 0, 400px 5px, 400px 5px; |
|||
background-position: 0 0, 0 0, 17px 12px, 17px 22px; |
|||
} |
|||
100% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
} |
|||
@keyframes sparkly-after { |
|||
0% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
16% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
33% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
50% { |
|||
background-size: 400px 11px, 400px 11px, 400px 6px, 400px 6px; |
|||
background-position: 17px 0, 17px 29px, 0 17px, 29px 17px; |
|||
} |
|||
66% { |
|||
background-size: 0 0, 0 0, 400px 6px, 400px 6px; |
|||
background-position: 0 0, 0 0, 6px 17px, 23px 17px; |
|||
} |
|||
83% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
100% { |
|||
background-size: 0 0, 0 0, 0 0, 0 0; |
|||
background-position: 0 0, 0 0, 0 0, 0 0; |
|||
} |
|||
} |
|||
.rainbow { |
|||
background: none; |
|||
height: 102px; |
|||
width: 50%; |
|||
position: absolute; |
|||
top: 50%; |
|||
right: 50%; |
|||
margin-right: 45px; |
|||
z-index: 2; |
|||
} |
|||
.hot:after, |
|||
.hot:before, |
|||
.cold:after, |
|||
.cold:before { |
|||
content: ""; |
|||
position: absolute; |
|||
left: 0; |
|||
right: 0; |
|||
height: 50%; |
|||
} |
|||
.hot:after, |
|||
.hot:before { |
|||
top: 0; |
|||
} |
|||
.cold:after, |
|||
.cold:before { |
|||
bottom: 0; |
|||
} |
|||
#wave-a { |
|||
margin-top: -54px; |
|||
animation: wavy 700ms 0ms steps(2) infinite both; |
|||
} |
|||
#wave-b { |
|||
margin-top: -60px; |
|||
animation: wavy 700ms 350ms steps(2) infinite both; |
|||
} |
|||
/* red */ |
|||
.hot { |
|||
background-image: linear-gradient(to right, #f00 49px, transparent 49px, transparent 92px); |
|||
} |
|||
/* orange */ |
|||
.hot:after { |
|||
background-image: linear-gradient(to right, #f90 49px, transparent 49px, transparent 92px); |
|||
} |
|||
/* yellow */ |
|||
.hot:before { |
|||
background-image: linear-gradient(to right, #ff0 49px, transparent 49px, transparent 92px); |
|||
} |
|||
/* green */ |
|||
.cold:after { |
|||
background-image: linear-gradient(to right, #3f0 49px, transparent 49px, transparent 92px); |
|||
background-position: left top; |
|||
} |
|||
/* blue */ |
|||
.cold:before { |
|||
background-image: linear-gradient(to right, #09f 49px, transparent 49px, transparent 92px); |
|||
} |
|||
/* purple */ |
|||
.cold { |
|||
background-image: linear-gradient(to right, #63f 49px, transparent 49px, transparent 92px); |
|||
} |
|||
.rainbow, |
|||
.hot:after, |
|||
.hot:before, |
|||
.cold:after, |
|||
.cold:before { |
|||
background-size: 95px 17px; |
|||
background-repeat: repeat-x; |
|||
} |
|||
#wave-a.hot, |
|||
#wave-a.cold:after { |
|||
background-position: left top; |
|||
} |
|||
#wave-a.hot:after, |
|||
#wave-a.cold:before { |
|||
background-position: left center; |
|||
} |
|||
#wave-a.hot:before, |
|||
#wave-a.cold { |
|||
background-position: left bottom; |
|||
} |
|||
#wave-b.hot, |
|||
#wave-b.cold:after { |
|||
background-position: 46px top; |
|||
} |
|||
#wave-b.hot:after, |
|||
#wave-b.cold:before { |
|||
background-position: 46px center; |
|||
} |
|||
#wave-b.hot:before, |
|||
#wave-b.cold { |
|||
background-position: 46px bottom; |
|||
} |
|||
@keyframes wavy { |
|||
0% { |
|||
margin-top: -54px; |
|||
} |
|||
100% { |
|||
margin-top: -60px; |
|||
} |
|||
} |
|||
/* head */ |
|||
#head { |
|||
width: 80px; |
|||
height: 30px; |
|||
border: solid black; |
|||
border-width: 0 6px; |
|||
background: #999; |
|||
position: absolute; |
|||
} |
|||
/* #head:before = left ear | #head:after = right ear */ |
|||
#head:before, |
|||
#head:after { |
|||
width: 40px; |
|||
height: 30px; |
|||
top: -30px; |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 6px 24px, 12px 6px, 12px 6px, 6px 6px, 6px 6px, 12px 30px, 12px 12px, 12px 6px, 6px 6px; |
|||
background-position: 0 6px, 6px 0, 30px 18px, 18px 6px, 24px 12px, 6px 6px, 18px 18px, 30px 24px, 18px 12px; |
|||
} |
|||
#head:after { |
|||
right: 0; |
|||
transform: scaleX(-1); |
|||
-webkit-transform: scaleX(-1); |
|||
} |
|||
#face { |
|||
width: 80px; |
|||
height: 100%; |
|||
position: absolute; |
|||
top: 6px; |
|||
background: linear-gradient(white, white) no-repeat, linear-gradient(white, white) no-repeat, linear-gradient(#f99, #f99) no-repeat, linear-gradient(#f99, #f99) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 6px 6px, 6px 6px, 12px 12px, 12px 12px, 12px 12px, 12px 12px, 6px 6px, 6px 6px, 6px 6px, 6px 6px; |
|||
background-position: 17px 0, 56px 0, 5px 12px, 68px 12px, 17px 0, 56px 0, 42px 6px, 23px 18px, 40px 18px, 56px 18px; |
|||
} |
|||
/* #face:before = chin */ |
|||
#face:before { |
|||
bottom: -12px; |
|||
width: 100%; |
|||
height: 18px; |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 6px 6px, 6px 6px, 6px 6px, 6px 6px, 56px 6px, 39px 6px, 68px 6px, 56px 6px; |
|||
background-position: 0 0, 6px 6px, 74px 0, 68px 6px, 12px 12px, 23px 0, 6px 0, 12px 6px; |
|||
} |
|||
/* FRAME 1 AND 5 */ |
|||
.frame1 #head, |
|||
.frame5 #head { |
|||
bottom: 36px; |
|||
right: 0; |
|||
} |
|||
/* FRAMES 2 AND 3 AND 4 */ |
|||
.frame2 #head, |
|||
.frame3 #head, |
|||
.frame4 #head { |
|||
bottom: 36px; |
|||
right: -6px; |
|||
} |
|||
/* FRAME 6 */ |
|||
.frame6 #head { |
|||
bottom: 42px; |
|||
right: 0; |
|||
} |
|||
/* paws */ |
|||
#paws { |
|||
width: 156px; |
|||
height: 30px; |
|||
position: absolute; |
|||
bottom: 0; |
|||
left: 24px; |
|||
} |
|||
/* FRAME 1 */ |
|||
.frame1 #paws { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 18px 18px; |
|||
background-position: 4px 6px, 10px 0, 34px 0, 40px 6px, 94px 0px, 101px 6px, 125px 0px, 131px 6px; |
|||
} |
|||
.frame1 #paws:before { |
|||
width: 100%; |
|||
height: 100%; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 12px 12px, 12px 12px, 12px 12px, 12px 12px, 6px 6px; |
|||
background-position: 10px 6px, 40px 6px, 101px 6px, 131px 6px, 22px 6px; |
|||
} |
|||
/* FRAMES 2 AND 4 */ |
|||
.frame2 #paws, |
|||
.frame4 #paws { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 18px 18px; |
|||
background-position: 10px 6px, 16px 0, 40px 0, 46px 6px, 95px 0, 101px 6px, 125px 0, 131px 6px; |
|||
} |
|||
.frame2 #paws:before, |
|||
.frame4 #paws:before { |
|||
width: 100%; |
|||
height: 100%; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 12px 12px; |
|||
background-position: 16px 6px, 46px 6px, 101px 6px, 131px 6px; |
|||
} |
|||
/* FRAME 3 */ |
|||
.frame3 #paws { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 18px 18px; |
|||
background-position: 16px 6px, 22px 0px, 46px 0px, 52px 6px, 100px 0px, 106px 6px, 131px 0px, 137px 6px; |
|||
} |
|||
.frame3 #paws:before { |
|||
width: 100%; |
|||
height: 100%; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 12px 12px; |
|||
background-position: 22px 6px, 52px 6px, 106px 6px, 137px 6px; |
|||
} |
|||
/* FRAME 5 AND 6 */ |
|||
.frame5 #paws, |
|||
.frame6 #paws { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 18px 18px; |
|||
background-position: 4px 6px, 10px 0, 34px 0, 40px 6px, 94px 0px, 101px 6px, 125px 0px, 131px 6px; |
|||
} |
|||
.frame5 #paws:before, |
|||
.frame6 #paws:before { |
|||
width: 100%; |
|||
height: 100%; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 12px 12px; |
|||
background-position: 10px 6px, 16px 0, 40px 6px, 101px 6px, 131px 6px; |
|||
} |
|||
/* FRAME 6 */ |
|||
.frame6 #paws { |
|||
background-position: 4px 6px, 10px 0, 40px 0, 34px 6px, 101px 0px, 95px 6px, 125px 0px, 131px 6px; |
|||
} |
|||
/* tail */ |
|||
#tail { |
|||
width: 40px; |
|||
height: 54px; |
|||
position: absolute; |
|||
left: 0; |
|||
top: 40px; |
|||
} |
|||
/* FRAME 1 */ |
|||
.frame1 #tail { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 23px 18px; |
|||
background-position: 6px 0, 11px 6px, 17px 11px, 23px 17px, 34px 23px; |
|||
} |
|||
.frame1 #tail:before { |
|||
left: 11px; |
|||
top: 6px; |
|||
width: 29px; |
|||
height: 23px; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 11px 6px; |
|||
background-position: 0 0, 6px 6px, 12px 12px, 18px 18px, 24px 24px; |
|||
} |
|||
/* FRAMES 2 AND 6 */ |
|||
.frame2 #tail, |
|||
.frame6 #tail { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 11px 23px, 11px 23px, 11px 23px, 6px 11px; |
|||
background-position: 12px 6px, 18px 12px, 29px 17px, 6px 12px; |
|||
} |
|||
.frame2 #tail:before, |
|||
.frame6 #tail:before { |
|||
width: 28px; |
|||
height: 23px; |
|||
left: 12px; |
|||
top: 12px; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 11px 6px; |
|||
background-position: 0 0, 0 5px, 6px 11px, 17px 11px, 17px 17px; |
|||
} |
|||
/* FRAME 3 */ |
|||
.frame3 #tail { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 24px 12px, 24px 12px, 24px 12px, 6px 24px; |
|||
background-position: 16px 24px, 4px 30px, 10px 36px, 34px 18px; |
|||
} |
|||
.frame3 #tail:before { |
|||
width: 30px; |
|||
height: 12px; |
|||
top: 30px; |
|||
right: 0; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 24px 6px, 18px 6px; |
|||
background-position: 6px 0, 0 6px; |
|||
} |
|||
/* FRAME 4 */ |
|||
.frame4 #tail { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 12px 24px, 12px 24px, 12px 24px, 6px 12px; |
|||
background-position: 28px 18px, 16px 24px, 10px 30px, 4px 36px; |
|||
} |
|||
.frame4 #tail:before { |
|||
width: 30px; |
|||
height: 24px; |
|||
top: 24px; |
|||
right: 0; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 12px 12px, 12px 12px, 12px 6px; |
|||
background-position: 18px 0, 0 12px, 6px 6px; |
|||
} |
|||
/* FRAME 5 */ |
|||
.frame5 #tail { |
|||
background: linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat, linear-gradient(black, black) no-repeat; |
|||
background-size: 24px 18px, 24px 18px, 6px 12px, 6px 12px, 12px 6px; |
|||
background-position: 6px 6px, 12px 12px, 0 12px, 36px 12px, 28px 30px; |
|||
} |
|||
.frame5 #tail:before { |
|||
width: 34px; |
|||
height: 18px; |
|||
top: 12px; |
|||
right: 0; |
|||
background: linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat, linear-gradient(#999, #999) no-repeat; |
|||
background-size: 18px 6px, 22px 6px, 6px 6px; |
|||
background-position: 0 0, 6px 6px, 28px 12px; |
|||
} |
|||
@ -1,29 +0,0 @@ |
|||
console.log('Nyan!') |
|||
|
|||
function cycleFrames (_nyanCat, _currentFrame) { |
|||
_nyanCat.classList = [] |
|||
_nyanCat.classList.add(`frame${_currentFrame}`) |
|||