beat/charmap
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

[add] Noto & Noto Emoji fonts

Browse source 
[add] Quick index
This commit is contained in:
Raphaël Renaudon 2016-10-07 17:52:53 +02:00
parent e773270606
commit b3e43fc9e8
10 changed files with 958 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
README
View file

@ -1,21 +0,0 @@
-= README =-
uuu.tf
Author : Raphaël
Website : http://www.onlinecreation.pro
Demo : http://uuu.tf
GIT : https://github.com/onlinecreation/uuu.tf
-= Credits =-
The favicon is from the famfamfam silk icons library
http://www.famfamfam.com/lab/icons/silk/
-= How to install it =-
Step 1:
Place the content of the htdocs folder into the root folder of your webserver
Step 2:
There is no step 2.

17
README.md Normal file
View file

@ -0,0 +1,17 @@
uuu.tf
======
* Author: [Raphaël](http://raphael.onlc.fr)
* Demo: http://uuu.tf
Credits
-------
The favicon is from the famfamfam silk icons library:
http://www.famfamfam.com/lab/icons/silk/
NoTo font by Google:
https://github.com/googlei18n/noto-fonts
How to install it
-----------------
* Step 1: Place the content of the htdocs folder into the root folder of your webserver
* Step 2: There is no step 2.

1
htdocs/.htaccess
View file

@ -1,4 +1,3 @@
Options +FollowSymLinks Options +FollowSymLinks
RewriteEngine on RewriteEngine on
RewriteBase /
RewriteRule ^([0-9]+)$ index.php?page=$1 [L] RewriteRule ^([0-9]+)$ index.php?page=$1 [L]

9
htdocs/css/emoji.css Normal file
View file

@ -0,0 +1,9 @@
@font-face {
font-family: "NotoEmoji";
src: url('notoemoji-regular.ttf') format('truetype'),
url('notoemoji-regular-webfont.woff2') format('woff2'),
url('notoemoji-regular-webfont.woff') format('woff'),
url('notoemoji-regular-webfont.svg#noto_emojiregular') format('svg');
font-weight: normal;
font-style: normal;
}

896
htdocs/css/notoemoji-regular-webfont.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 1.1 MiB

BIN
htdocs/css/notoemoji-regular-webfont.woff Normal file
View file

Binary file not shown.

BIN
htdocs/css/notoemoji-regular-webfont.woff2 Normal file
View file

Binary file not shown.

BIN
htdocs/css/notoemoji-regular.ttf Normal file
View file

Binary file not shown.

10
htdocs/css/style.css
View file

@ -1,13 +1,12 @@
body{ body{
background: #eee; background: #eee;
font-family: 'Source Sans Pro', Arial, Trebuchet MS, sans-serif; font-family: NoTo, sans-serif;
} }
.char{ .char{
display: inline-block; display: inline-block;
width: 100px; width: 100px;
height: 85px; height: 85px;
float: left;
text-align: center; text-align: center;
border: #ccc 1px solid; border: #ccc 1px solid;
background: #fff; background: #fff;
@ -16,21 +15,22 @@ body{
color: #666; color: #666;
text-decoration: none; text-decoration: none;
overflow: hidden; overflow: hidden;
float: left;
} }
.char strong{ .char span{
font-size: 40px; font-size: 40px;
display: block; display: block;
color: #000; color: #000;
font-family: Arial, sans-serif;
padding: 5px; padding: 5px;
font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", NoTo, NotoEmoji, sans-serif;
} }
.clear{ .clear{
clear: both; clear: both;
} }
a, a.char strong{ a, a.char span{
color: #006699; color: #006699;
} }

42
htdocs/index.php
View file

@ -6,7 +6,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="http://www.onlinecreation.pro"> <meta name="author" content="http://www.onlinecreation.pro">
<meta name="description" content="<?php echo $_GET["page"] > 0 ? "UTF-8 and HTML charmap, Page " . $_GET["page"] . ", from char nr." . (($_GET["page"] - 1) * 1000) . " to char nr." . ($_GET["page"] * 1000 - 1) . "." : "Certainly the biggest unicode character map in the world. Each char is associated with its HTML code."; ?>" /> <meta name="description" content="<?php echo $_GET["page"] > 0 ? "UTF-8 and HTML charmap, Page " . $_GET["page"] . ", from char nr." . (($_GET["page"] - 1) * 1000) . " to char nr." . ($_GET["page"] * 1000 - 1) . "." : "Certainly the biggest unicode character map in the world. Each char is associated with its HTML code."; ?>" />
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400' rel='stylesheet' type='text/css'> <link href="https://fonts.googleapis.com/css?family=Noto+Sans:400,700&subset=cyrillic,cyrillic-ext,devanagari,greek,greek-ext,latin-ext,vietnamese" rel="stylesheet">
<link href='css/emoji.css' rel='stylesheet' type='text/css'>
<link href='css/style.css' rel='stylesheet' type='text/css'> <link href='css/style.css' rel='stylesheet' type='text/css'>
<link rel="shortcut icon" href="favicon.ico"> <link rel="shortcut icon" href="favicon.ico">
<link rel="apple-touch-icon" href="img/icon_128.png" /> <link rel="apple-touch-icon" href="img/icon_128.png" />
@ -14,7 +15,7 @@
</head> </head>
<body> <body>
<div class="char welcome"> <div class="char welcome">
<strong>uuu.tf</strong> <span>uuu.tf</span>
The biggest HTML UTF-8 charmap you can imagine ! The biggest HTML UTF-8 charmap you can imagine !
</div> </div>
<div class="char socials"> <div class="char socials">
@ -29,9 +30,9 @@
</div> </div>
<?php <?php
if ($_GET['page'] > 1) { if ($_GET['page'] > 1) {
echo '<a class="char clear" href="' . ($_GET['page'] - 1) . '"><strong>«</strong>Previous</a>'; echo '<a class="char clear" href="' . ($_GET['page'] - 1) . '"><span>«</span>Previous</a>';
} elseif ($_GET['page'] == 1) { } elseif ($_GET['page'] == 1) {
echo '<a class="char clear" href="/"><strong>«</strong>Previous</a>'; echo '<a class="char clear" href="/"><span>«</span>Previous</a>';
}else{ }else{
echo '<div class="clear"></div>'; echo '<div class="clear"></div>';
} }
@ -71,21 +72,40 @@
"&#9324;", "&#9325;", "&#9326;", "&#9327;", "&#9328;", "&#9329;", "&#9330;", "&#9331;", "&#9352;", "&#9353;", "&#9354;", "&#9355;", "&#9356;", "&#9357;", "&#9358;", "&#9359;", "&#9324;", "&#9325;", "&#9326;", "&#9327;", "&#9328;", "&#9329;", "&#9330;", "&#9331;", "&#9352;", "&#9353;", "&#9354;", "&#9355;", "&#9356;", "&#9357;", "&#9358;", "&#9359;",
"&#9360;", "&#9361;", "&#9362;", "&#9363;", "&#9364;", "&#9365;", "&#9366;", "&#9367;", "&#9368;", "&#9369;", "&#9370;", "&#9371;"); "&#9360;", "&#9361;", "&#9362;", "&#9363;", "&#9364;", "&#9365;", "&#9366;", "&#9367;", "&#9368;", "&#9369;", "&#9370;", "&#9371;");
foreach ($charmap as $char) { foreach ($charmap as $char) {
echo '<div class="char"><strong>' . $char . '</strong>' . htmlentities($char) . '</div>'; echo '<div class="char"><span>' . $char . '</span>' . htmlentities($char) . '</div>';
} }
} else { } else {
for ($i = (($_GET['page'] - 1) * 1000); $i < ($_GET['page'] * 1000); $i++) { for ($i = (($_GET['page'] - 1) * 1000); $i < ($_GET['page'] * 1000); $i++) {
echo '<div class="char"><strong>&#' . $i . ';</strong>&amp;#' . $i . ';</div>'; echo '<div class="char"><a name="chr' . $i . '"></a><span>&#' . $i . ';</span>&amp;#' . $i . ';</div>';
} }
} }
echo '<a class="char" href="' . (is_numeric($_GET['page']) ? $_GET['page'] + 1 : 1) . '"><strong>»</strong>Next</a>'; echo '<a class="char" href="' . (!empty($_GET['page']) && is_numeric($_GET['page']) ? $_GET['page'] + 1 : 1) . '"><span>»</span>Next</a>';
?> ?>
<div class="char footer">
<?php
$blocks = array(
'Most used' => 0,
'European' => 33,
'Middle East' => 1424,
'West Asian' => 2304,
'Native american / Runic' => 5024,
'Symbols' => 8192,
'East Asian' => 11904,
'Games' => 126976,
'Pictographs' => 127744,
'Emoticons' => 128512
);
foreach ($blocks as $name => $block) {
echo '<a href="' . (ceil($block / 1000 )) . '#chr' . $block . '">' . $name . '</a> ';
}
?>
</div>
<div class="char footer clear"> <div class="char footer clear">
Charmap under GPL licence. If you find any interests into this Charmap under GPL licence. For a better result,
humble site, you can use it and its source code as much as you wish : use the <a href="https://github.com/googlei18n/noto-fonts" target="_blank">NoTo font</a>.
<a href="https://github.com/onlinecreation/uuu.tf">Download and fork source code</a>; <a href="https://github.com/onlinecreation/uuu.tf" target="_blank">Download and fork source code</a>;
if you make something great with this code, if you make something great with this code,
<a href="http://www.onlinecreation.pro/#bottom">please let us know</a> ! <a href="http://www.onlinecreation.pro/#bottom" target="_blank">please let us know</a> !
</div> </div>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-51aaf7be7c3d94b2"></script> <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-51aaf7be7c3d94b2"></script>