mirror of
https://github.com/lrsjng/h5ai.git
synced 2025-05-25 12:34:47 -04:00
Refactored info page assets.
This commit is contained in:
Lars Jung
parent
764bc0034c
commit
908848bfc7
8 changed files with 184 additions and 174 deletions
140
src/_h5ai/css/inc/splash.less
Normal file
140
src/_h5ai/css/inc/splash.less
Normal file
|
|
@ -0,0 +1,140 @@
|
||||||
|
|
||||||
|
|
||||||
|
html.h5ai-splash {
|
||||||
|
body {
|
||||||
|
position: relative;
|
||||||
|
font-family: Ubuntu, Arial, sans;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 142px;
|
||||||
|
font-size: 20px;
|
||||||
|
color: #555;
|
||||||
|
max-width: 600px;
|
||||||
|
|
||||||
|
a, a:visited, a:active {
|
||||||
|
color: #2080ff;
|
||||||
|
text-decoration: none;
|
||||||
|
.transition(all 0.2s ease-in-out);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #68A9ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
color: #333;
|
||||||
|
text-align: center;
|
||||||
|
margin: 32px 0;
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 100px;
|
||||||
|
font-weight: normal;
|
||||||
|
height: 150px;
|
||||||
|
line-height: 150px;
|
||||||
|
font-family: 'Miltonian Tattoo';
|
||||||
|
font-size: 160px;
|
||||||
|
letter-spacing: -5px;
|
||||||
|
.logo-5 {
|
||||||
|
position: relative;
|
||||||
|
top: -14px;
|
||||||
|
img {
|
||||||
|
width: 128px;
|
||||||
|
height: 128px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.logo-a {
|
||||||
|
margin-left: -9px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
margin: 16px 0 0 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 26px;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
section {
|
||||||
|
margin: 48px 0;
|
||||||
|
|
||||||
|
.h5ai {
|
||||||
|
font-family: 'Miltonian Tattoo';
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
font-size: 1.5em;
|
||||||
|
margin-top: 1.5em;
|
||||||
|
margin-bottom: 0.4em;
|
||||||
|
color: #555;
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
font-size: 1.15em;
|
||||||
|
margin-top: 1.8em;
|
||||||
|
margin-bottom: 0.6em;
|
||||||
|
color: #555;
|
||||||
|
}
|
||||||
|
h4 {
|
||||||
|
font-size: 0.85em;
|
||||||
|
margin-top: 1.8em;
|
||||||
|
margin-bottom: 0.1em;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
line-height: 1.6em;
|
||||||
|
}
|
||||||
|
p + p {
|
||||||
|
margin-top: 1.2em;
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
margin-top: 0.6em;
|
||||||
|
line-height: 1.4em;
|
||||||
|
}
|
||||||
|
pre.prettyprint.nice, code.prettyprint.nice {
|
||||||
|
font-family: "Ubuntu Mono", Ubuntu, Arial, sans;
|
||||||
|
font-size: 0.95em;
|
||||||
|
a {
|
||||||
|
background-color: rgba(255,241,0,0.3);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: rgba(255,241,0,0.7);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.com {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
.since .com {
|
||||||
|
&:before {
|
||||||
|
content: "@since ";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.since.new .com {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #17b31c;
|
||||||
|
&:after {
|
||||||
|
content: " NEW!";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
pre.prettyprint {
|
||||||
|
border: none;
|
||||||
|
margin: 1em 0 1em 0.3em;
|
||||||
|
padding-left: 0.6em;
|
||||||
|
border-left: 2px solid rgba(0,0,0,0.15);
|
||||||
|
}
|
||||||
|
code.prettyprint {
|
||||||
|
border: 1px solid rgba(0,0,0,0.15);
|
||||||
|
padding: 2px 4px 2px 4px;
|
||||||
|
}
|
||||||
|
img.gravatar {
|
||||||
|
float: left;
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
margin: 8px 12px 20px 2px;
|
||||||
|
padding: 2px;
|
||||||
|
background-color: #ddd;
|
||||||
|
border: 1px solid #bbb;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -1,141 +0,0 @@
|
||||||
|
|
||||||
@import "inc/h5bp-norm";
|
|
||||||
@import "inc/mixins";
|
|
||||||
|
|
||||||
|
|
||||||
body {
|
|
||||||
position: relative;
|
|
||||||
font-family: Ubuntu, Arial, sans;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 0 142px;
|
|
||||||
font-size: 20px;
|
|
||||||
color: #555;
|
|
||||||
max-width: 600px;
|
|
||||||
|
|
||||||
a, a:visited, a:active {
|
|
||||||
color: #2080ff;
|
|
||||||
text-decoration: none;
|
|
||||||
.transition(all 0.2s ease-in-out);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: #68A9ff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
header {
|
|
||||||
color: #333;
|
|
||||||
text-align: center;
|
|
||||||
margin: 32px 0;
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
font-size: 100px;
|
|
||||||
font-weight: normal;
|
|
||||||
height: 150px;
|
|
||||||
line-height: 150px;
|
|
||||||
font-family: 'Miltonian Tattoo';
|
|
||||||
font-size: 160px;
|
|
||||||
letter-spacing: -5px;
|
|
||||||
.logo-5 {
|
|
||||||
position: relative;
|
|
||||||
top: -14px;
|
|
||||||
img {
|
|
||||||
width: 128px;
|
|
||||||
height: 128px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.logo-a {
|
|
||||||
margin-left: -9px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
h2 {
|
|
||||||
margin: 16px 0 0 0;
|
|
||||||
padding: 0;
|
|
||||||
font-size: 26px;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
section {
|
|
||||||
margin: 48px 0;
|
|
||||||
|
|
||||||
.h5ai {
|
|
||||||
font-family: 'Miltonian Tattoo';
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
h2 {
|
|
||||||
font-size: 1.5em;
|
|
||||||
margin-top: 1.5em;
|
|
||||||
margin-bottom: 0.4em;
|
|
||||||
color: #555;
|
|
||||||
}
|
|
||||||
h3 {
|
|
||||||
font-size: 1.15em;
|
|
||||||
margin-top: 1.8em;
|
|
||||||
margin-bottom: 0.6em;
|
|
||||||
color: #555;
|
|
||||||
}
|
|
||||||
h4 {
|
|
||||||
font-size: 0.85em;
|
|
||||||
margin-top: 1.8em;
|
|
||||||
margin-bottom: 0.1em;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
p {
|
|
||||||
line-height: 1.6em;
|
|
||||||
}
|
|
||||||
p + p {
|
|
||||||
margin-top: 1.2em;
|
|
||||||
}
|
|
||||||
li {
|
|
||||||
margin-top: 0.6em;
|
|
||||||
line-height: 1.4em;
|
|
||||||
}
|
|
||||||
pre.prettyprint.nice, code.prettyprint.nice {
|
|
||||||
font-family: "Ubuntu Mono", Ubuntu, Arial, sans;
|
|
||||||
font-size: 0.95em;
|
|
||||||
a {
|
|
||||||
background-color: rgba(255,241,0,0.3);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: rgba(255,241,0,0.7);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.com {
|
|
||||||
color: #aaa;
|
|
||||||
}
|
|
||||||
.since .com {
|
|
||||||
&:before {
|
|
||||||
content: "@since ";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.since.new .com {
|
|
||||||
font-weight: bold;
|
|
||||||
color: #17b31c;
|
|
||||||
&:after {
|
|
||||||
content: " NEW!";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
pre.prettyprint {
|
|
||||||
border: none;
|
|
||||||
margin: 1em 0 1em 0.3em;
|
|
||||||
padding-left: 0.6em;
|
|
||||||
border-left: 2px solid rgba(0,0,0,0.15);
|
|
||||||
}
|
|
||||||
code.prettyprint {
|
|
||||||
border: 1px solid rgba(0,0,0,0.15);
|
|
||||||
padding: 2px 4px 2px 4px;
|
|
||||||
}
|
|
||||||
img.gravatar {
|
|
||||||
float: left;
|
|
||||||
width: 80px;
|
|
||||||
height: 80px;
|
|
||||||
margin: 8px 12px 20px 2px;
|
|
||||||
padding: 2px;
|
|
||||||
background-color: #ddd;
|
|
||||||
border: 1px solid #bbb;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -64,3 +64,7 @@ html.oldie {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@import "inc/splash";
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
|
<!--[if lt IE 7]> <html class="h5ai-splash no-js ie6 oldie" lang="en"> <![endif]-->
|
||||||
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
|
<!--[if IE 7]> <html class="h5ai-splash no-js ie7 oldie" lang="en"> <![endif]-->
|
||||||
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
|
<!--[if IE 8]> <html class="h5ai-splash no-js ie8 oldie" lang="en"> <![endif]-->
|
||||||
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
|
<!--[if gt IE 8]><!--> <html class="h5ai-splash no-js" lang="en"> <!--<![endif]-->
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
|
|
@ -14,7 +14,7 @@
|
||||||
<link rel="apple-touch-icon" type="image/png" href="/_h5ai/images/h5ai-48x48.png">
|
<link rel="apple-touch-icon" type="image/png" href="/_h5ai/images/h5ai-48x48.png">
|
||||||
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Ubuntu:regular,italic,bold">
|
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Ubuntu:regular,italic,bold">
|
||||||
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Miltonian+Tattoo:regular">
|
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Miltonian+Tattoo:regular">
|
||||||
<link rel="stylesheet" href="/_h5ai/css/splash.css">
|
<link rel="stylesheet" href="/_h5ai/css/styles.css">
|
||||||
<script src="/_h5ai/js/modernizr.min.js"></script>
|
<script src="/_h5ai/js/modernizr.min.js"></script>
|
||||||
<!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
|
<!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
|
||||||
</head>
|
</head>
|
||||||
|
|
@ -43,6 +43,7 @@
|
||||||
<a target="_blank" href="http://twitter.com/lrsjng">@lrsjng</a>
|
<a target="_blank" href="http://twitter.com/lrsjng">@lrsjng</a>
|
||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
<script src="/_h5ai/js/splash.js"></script>
|
<script src="/_h5ai/config.js"></script>
|
||||||
|
<script src="/_h5ai/js/scripts.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -48,6 +48,10 @@
|
||||||
h5ai.isJs = $html.hasClass('h5ai-js');
|
h5ai.isJs = $html.hasClass('h5ai-js');
|
||||||
h5ai.isPhp = $html.hasClass('h5ai-php');
|
h5ai.isPhp = $html.hasClass('h5ai-php');
|
||||||
|
|
||||||
|
if (!h5ai.isJs && !h5ai.isPhp) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if (h5ai.isJs) {
|
if (h5ai.isJs) {
|
||||||
h5ai.extended.init();
|
h5ai.extended.init();
|
||||||
}
|
}
|
||||||
|
|
|
||||||
25
src/_h5ai/js/inc/splash.js
Normal file
25
src/_h5ai/js/inc/splash.js
Normal file
|
|
@ -0,0 +1,25 @@
|
||||||
|
|
||||||
|
(function (window, $) {
|
||||||
|
'use strict';
|
||||||
|
/*jslint browser: true, confusion: true, white: true */
|
||||||
|
/*global jQuery */
|
||||||
|
|
||||||
|
var deobfuscate = function () {
|
||||||
|
|
||||||
|
$('.obfusma').each(function () {
|
||||||
|
|
||||||
|
var $this = $(this),
|
||||||
|
add = $this.text().replace(/\s*/g, '').replace(/\[at\]/gi, '@').replace(/\[dot\]/gi, '.'),
|
||||||
|
$a = $('<a/>').attr('href', 'mailto:' + add).text(add).addClass('deobfusma');
|
||||||
|
|
||||||
|
$this.replaceWith($a);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
init = function () {
|
||||||
|
|
||||||
|
deobfuscate();
|
||||||
|
};
|
||||||
|
|
||||||
|
$(init);
|
||||||
|
|
||||||
|
}(window, jQuery));
|
||||||
|
|
@ -17,3 +17,7 @@
|
||||||
// h5ai
|
// h5ai
|
||||||
// ----
|
// ----
|
||||||
// @include "inc/H5ai.js"
|
// @include "inc/H5ai.js"
|
||||||
|
|
||||||
|
// info
|
||||||
|
// ----
|
||||||
|
// @include "inc/splash.js"
|
||||||
|
|
|
||||||
|
|
@ -1,27 +0,0 @@
|
||||||
|
|
||||||
// @include "inc/lib/jquery-1.7.1.min.js"
|
|
||||||
|
|
||||||
(function (window, $) {
|
|
||||||
'use strict';
|
|
||||||
/*jslint browser: true, confusion: true, white: true */
|
|
||||||
/*global jQuery */
|
|
||||||
|
|
||||||
var deobfuscate = function () {
|
|
||||||
|
|
||||||
$(".obfusma").each(function () {
|
|
||||||
|
|
||||||
var $this = $(this),
|
|
||||||
add = $this.text().replace(/\s*/g, "").replace(/\[at\]/gi, "@").replace(/\[dot\]/gi, "."),
|
|
||||||
$a = $("<a/>").attr("href", "mailto:" + add).text(add).addClass("deobfusma");
|
|
||||||
|
|
||||||
$this.replaceWith($a);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
init = function () {
|
|
||||||
|
|
||||||
deobfuscate();
|
|
||||||
};
|
|
||||||
|
|
||||||
$(init);
|
|
||||||
|
|
||||||
}(window, jQuery));
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue