Skip to content

Instantly share code, notes, and snippets.

@debloper

debloper/theme.html

Last active October 13, 2015 23:08
Show Gist options
  • Save debloper/4270752 to your computer and use it in GitHub Desktop.
Save debloper/4270752 to your computer and use it in GitHub Desktop.
Download ZIP
Mozilla India Events Page Theme: http://events.mozillaindia.org
Raw
theme.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<title>{Title} - Mozilla India</title>
<!-- Base theme "Clarus" by Benjamin Nathan <benjamin@benjaminnathan.nl> -->
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<meta name='description' content='{Description}' />
<meta name="text:Google Analytics ID" content="">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800' rel='stylesheet' type='text/css'>
<style type='text/css'>
/* Base, Background*/
html {height:100%;}
body {
min-height:100%;
line-height:180%;
position:relative;
color: rgba(255,255,255,0.7);
-webkit-font-smoothing: antialiased;
text-shadow: 0px 1px 1px rgba(0,0,0,0.1);
font:1rem 'Helvetica Neue', Helvetica, sans-serif;
background: #051733; /* Old browsers */
background: -webkit-linear-gradient(top, #002147 0%, #000 100%); /* Chrome10+,Safari5.1+ */
background: -moz-linear-gradient(top, #002147 0%, #000 100%); /* FF3.6+ */
background: -o-linear-gradient(top, #002147 0%, #000 100%); /* Opera 11.10+ */
background: linear-gradient(to bottom, #002147 0%, #000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#002147',endColorstr='#000',GradientType=0); /* IE6-9 */
background-attachment:fixed;
background-size:100%;
}
a {font-weight:600; color: #fff; text-decoration:none;}
a:hover{text-shadow:0 0 4px #fff;}
/* Fonts*/
h1, h2, h3, h4 {
margin: 1rem;
text-align:center;
font-family:'Open Sans', Helvetica;
}
h1 {font-size:3rem; font-weight:800; letter-spacing:-1px;}
h3 {font-weight:700; font-size:2rem;}
h4 {font-weight:600; font-size:1.5rem;}
/* Space texture */
#faux{
width:100%;
height:100%;
position:absolute;
background: url('http://static.tumblr.com/nlywmlg/YHgm9rlsx/bg_pattern.png') repeat;
}
/* Content*/
#wrapper {position:relative; width:630px; margin:0 auto; padding-bottom:2rem;}
/* Posts */
p.quote {
color: #fff;
padding:20px;
font-size:1.2em;
font-weight:300;
border-radius:5px;
background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.1);
}
.chat td {
padding:4px 8px;
border-radius: 3px;
border: 1px solid rgba(255,255,255,0.1);
}
.chat td.label {text-align:right; font-weight:bold;}
.chat tr.odd td {background: rgba(255,255,255,0.05);}
.chat tr.even td {background: rgba(255,255,255,0.1);}
.audio {
border-radius:5px;
border:2px solid rgba(255,255,255,0.2);
background: rgba(255,255,255,0.05);
}
.audioplay {
margin:5px;
border-radius:3px;
padding:15px 15px 5px;
border:1px solid rgba(255,255,255,0.2);
background:rgba(255,255,255,0.2);
}
.audioplaycount {float:right;}
iframe#tumblr_controls {display:none;}
.imagepost img{display:block; margin:auto;}
{CustomCSS}
</style>
{block:ifGoogleAnalyticsID}
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', '{text:Google Analytics ID}']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script');
ga.type = 'text/javascript'; ga.async = true;
ga.src = 'http://www.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);
})();
</script>
{/block:ifGoogleAnalyticsID}
</head>
<body>
<div id="faux"></div> <!--used for background texture-->
<div id="container">
<div id='wrapper'>
<div id='posts'>
{block:Posts}
<div class='postcontainer'>
<div class='post'>
{block:Text}
{block:Title}<h3>{Title}</h3>{/block:Title}
{/block:Text}
<!--<div class='date'>
<a href='{Permalink}'>
{ShortMonth} {DayOfMonth} &middot; <span> {Year}</span>
</a>
</div>-->
{Body}
{block:Answer}
<div class="questioncontainer">
<div class="asker"> {Asker} <span> Asked: </span></div>
<div class="question"> {Question}</div></div>
{Answer}
{/block:Answer}
{block:Photo}
<div class="imagepost">
<!--{LinkOpenTag}<img src='{PhotoURL-500}' alt='{PhotoAlt}'/>{LinkCloseTag}-->
<img src='{PhotoURL-400}' alt='{PhotoAlt}'/>
</div>
{block:Caption}<p>{Caption}</p>{/block:Caption}
{/block:Photo}
{block:Photoset}
{Photoset-400}
{block:Caption}<p>{Caption}</p>{/block:Caption}
{/block:Photoset}
{block:Quote}
<p class='quote'>"{Quote}"</p>
{block:Source}<p>{Source}</p>{/block:Source}
{/block:Quote}
{block:Link}
<a href='{URL}' class='link' {Target}>{Name}</a>
{block:Description}<p>{Description}</p>{/block:Description}
{/block:Link}
{block:Chat}
{block:Title}<h3>{Title}</h3>{/block:Title}
<table cellpadding='0' cellspacing='10px' width='100%' border='0' class='chat'>
{block:Lines}
<tr class='{Alt}'>
{block:Label}<td class='label'>{Label}</td>{/block:Label}
<td>{Line}</td>
</tr>
{/block:Lines}
</table>
{/block:Chat}
{block:Audio}
<div class='audio'>
<div class='audioplay'>
<div class='audioplaycount'>{FormattedPlayCount} Plays</div>
{AudioPlayerWhite}
</div>
</div>
{block:Caption}<p>{Caption}</p>{/block:Caption}
{/block:Audio}
{block:Video}
{Video-500}
{block:Caption}<p>{Caption}</p>{/block:Caption}
{/block:Video}
</div>
</div>
{/block:Posts}
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment