Advertisement
basilone

Theme 13

Oct 2nd, 2012
1,047
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.68 KB | None | 0 0
  1. <!---
  2.  
  3. theme 13 by mcpoyles
  4.  
  5. ---!>
  6.  
  7. <html>
  8. <head>
  9.  
  10. <!-- DEFAULT VARIABLES -->
  11. <meta name="font:body" content="Helvetica, Arial, sans-serif" />
  12. <meta name="font:link" content="arial" />
  13. <meta name="font:nav" content="arial" />
  14.  
  15. <meta name="color:background" content="#ffffff" />
  16. <meta name="color:header" content="#f2f2f2" />
  17. <meta name="color:nav" content="#111111" />
  18. <meta name="color:body" content="#BBBBBB" />
  19. <meta name="color:links" content="#888888" />
  20. <meta name="color:hover" content="#666666" />
  21. <meta name="color:title" content="#f9f9f9" />
  22. <meta name="color:entry" content="#ffffff" />
  23. <meta name="color:icons" content="#ffffff" />
  24. <meta name="color:border" content="#DDDDDD" />
  25. <meta name="image:sidebar" content=""/>
  26.  
  27. <meta name="text:Link1" content=""/>
  28. <meta name="text:Link1 URL" content=""/>
  29. <meta name="text:Link2" content=""/>
  30. <meta name="text:Link2 URL" content=""/>
  31. <meta name="text:Link3" content=""/>
  32. <meta name="text:Link3 URL" content=""/>
  33. <meta name="text:Link4" content=""/>
  34. <meta name="text:Link4 URL" content=""/>
  35.  
  36. <title>{Title}</title>
  37. <link rel="shortcut icon" href="{Favicon}">
  38. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  39. {block:Description}
  40. <meta name="description" content="{MetaDescription}" />
  41. {/block:Description}
  42. </head>
  43.  
  44. <style type="text/css">
  45. body {
  46. text-align:left;
  47. line-height:14px;
  48. color:{color:body};
  49. background-color:{color:background};
  50. font-family:{font:body};
  51. font-size:11px;
  52. margin:0px;}
  53.  
  54. b, em, bold, .question a {
  55. font-weight:bold;
  56. color:{color:titles};}
  57.  
  58. a {
  59. text-decoration: none;
  60. color:{color:links};
  61. text-decoration:none;
  62. -moz-transition:0.3s ease-in;
  63. -webkit-transition: 0.3s ease-in;
  64. -o-transition:0.3s ease-in;
  65. transition:0.3s ease-in; }
  66.  
  67. a:hover {
  68. color: {color:hover};
  69. text-decoration:none;}
  70.  
  71. body > header { min-width:500px;top:0px; margin:0px;margin:0 auto; }
  72. header #container {margin:0 auto;background-color:{color:header}; }
  73.  
  74. .head-inside { padding:10px; overflow:auto; text-transform:lowercase;font-size:10px; }
  75.  
  76. #container{ width:500px; }
  77. #container2{ width:500px; }
  78.  
  79. #container .gl { float:left; }
  80. #container .gr { float:right; }
  81.  
  82. #wrap { margin-top:40px; }
  83. #wrap .center-center { margin:0 auto;position:relative;width:500px;}
  84.  
  85. #wrap #gl { float:left; width:200px; background-color:{color:side};line-height:20px; }
  86. #wrap #gr { float:right; width:500px; margin-top:-5px;background-color:{color:entry bg};line-height:20px; }
  87. #wrap #inside { }
  88. #wrap #entry { overflow: hidden; background-color:{color:entry}; }
  89. #wrap #entry .in-inside { text-align:center; }
  90.  
  91. #wrap #gl .side { padding:10px;}
  92.  
  93. .space {margin-bottom:40px;}
  94.  
  95. blockquote {margin: 0.5em 0; padding: 0 0 0 9px; border-left: 1px solid {color:border};}
  96. .audio blockquote, .quote blockquote {padding: 0; border: 0;}
  97. blockquote img {width: auto;}
  98.  
  99. .quote {
  100. color: #333;
  101. display: block;
  102. background: url() no-repeat 0 10px;
  103. font-style: italic;
  104. padding: 16px 18px 10px 10px;}
  105.  
  106. .quote .medium {
  107. font-size: 15px;
  108. line-height: 1.4;
  109. font-family:HelveticaNeue-CondensedBold; }
  110.  
  111. .title {
  112. color:#AAAAAA;
  113. font-size:10px;
  114. letter-spacing:1px;
  115. padding:0px 0px 10px 0px;
  116. text-transform:uppercase;
  117. border-bottom:1px solid {color:border}; }
  118.  
  119. .titles {
  120. color:#AAAAAA;
  121. font-size:10px;
  122. letter-spacing:1px;
  123. padding:10px 0px 10px 0px;
  124. text-transform:uppercase; }
  125.  
  126. ul.chat, .chat ol, .chat li {
  127. list-style:none;
  128. margin:0px;
  129. padding:5px;}
  130.  
  131. .label {
  132. letter-spacing:0px;
  133. font-weight:bold; }
  134.  
  135. .quote-source { text-align:right;padding:10px; }
  136.  
  137. #gr:hover #info{
  138. opacity:1;
  139. display:block;}
  140.  
  141. #info {
  142. width:500px;
  143. padding:5px;
  144. font-size:11px;
  145. position:relative;
  146. opacity:0;
  147. -webkit-transition:0.3s linear; }
  148.  
  149. ol {
  150. list-style-type: none;
  151. margin: 0; }
  152.  
  153. ol.notes li {
  154. width: 500px;
  155. padding: 5px 0;
  156. margin: 0 0 3px -50px;
  157. border-bottom: 1px solid #f5f5f5; }
  158.  
  159. ol.notes li:hover {
  160. border-bottom: 1px solid #f5f5f5; }
  161.  
  162. ol.notes li img {
  163. width:16px;
  164. padding-right: 10px;
  165. margin-bottom: -5px;
  166. opacity: 0.85;
  167. filter:alpha(opacity=85); }
  168.  
  169. ol.notes li img:hover {
  170. opacity: 1;
  171. filter:alpha(opacity=100); }
  172.  
  173. #footer {
  174. clear:both;
  175. padding:10px; }
  176. color:{color:body};}
  177.  
  178. #pagination {
  179. width:500px;
  180. font-size:10px;
  181. word-spacing:7px;
  182. text-align:center;}
  183.  
  184. #pagination a {
  185. color:#888888;}
  186.  
  187. .jump_page {
  188. padding:3px;
  189. color:#888888;
  190. border:1px solid #BFBFBF;}
  191.  
  192. .view {
  193. width: 500px;
  194. float: left;
  195. overflow: hidden;
  196. position: relative;
  197. box-shadow: 1px 1px 2px #e6e6e6;
  198. cursor: default;
  199. background: #000000;
  200. }
  201. .view .mask, .view .content {
  202. width: 500px;
  203. height:40px;
  204. position: absolute;
  205. overflow: hidden;
  206. bottom: 0;
  207. left: 0
  208. }
  209. .view img {
  210. display: block;
  211. position: relative
  212. }
  213. .view p {
  214. font-family: {font:body};
  215. font-size: 11px;
  216. position: relative;
  217. color: #fff;
  218. padding: 0px 0px 10px 10px;
  219. }
  220. .view a.info:hover {
  221. box-shadow: 0 0 5px #000;
  222. }
  223.  
  224. .view-first img {
  225. transition: all 0.2s linear;
  226. }
  227. .view-first .mask {
  228. opacity: 0;
  229. background-color: #000000;
  230. transition: all 0.4s ease-in-out;
  231. }
  232. .view-first h2 {
  233. transform: translateY(-100px);
  234. opacity: 0;
  235. transition: all 0.2s ease-in-out;
  236. }
  237. .view-first p {
  238. transform: translateY(100px);
  239. opacity: 0;
  240. transition: all 0.2s linear;
  241. }
  242. .view-first a.info{
  243. opacity: 0;
  244. transition: all 0.2s ease-in-out;
  245. }
  246.  
  247. .view-first:hover img {
  248. transform: scale(1.1);
  249. }
  250. .view-first:hover .mask {
  251. opacity: 0.8;
  252. }
  253. .view-first:hover h2,
  254. .view-first:hover p,
  255. .view-first:hover a.info {
  256. opacity: 0.6;
  257. transform: translateY(0px);
  258. }
  259. .view-first:hover p {
  260. transition-delay: 0.1s;
  261. }
  262. .view-first:hover a.info {
  263. transition-delay: 0.2s;
  264. }
  265.  
  266. .audio {
  267. height:60px;
  268. padding:5px;
  269. margin-bottom:5px; }
  270.  
  271. .audio-album {
  272. position:absolute;
  273. width:60px; }
  274.  
  275. .audio-player {
  276. opacity:0.6;
  277. filter:alpha(opacity=60);
  278. border:2px solid #f2f2f2;
  279. width:25px;
  280. height:25px;
  281. overflow:hidden;
  282. position:absolute;
  283. z-index:2;
  284. margin-left:15px;
  285. margin-top:15px; }
  286.  
  287. .audio-info {
  288. margin-top:-10px;
  289. position:relative;
  290. margin-left:70px;
  291. padding:5px; }
  292. {CustomCSS}
  293. </style>
  294.  
  295. <body>
  296. <header>
  297. <div id="container">
  298. <div class="head-inside">
  299. <p>{Description}</p>
  300. <center>{block:ifLink1}<a href="{text:Link1 URL}">{text:Link1}</a>&emsp;{/block:ifLink1}
  301. {block:ifLink2}<a href="{text:Link2 URL}">{text:Link2}</a>&emsp;{/block:ifLink2}
  302. {block:ifLink3}<a href="{text:Link3 URL}">{text:Link3}</a>&emsp;{/block:ifLink3}
  303. {block:ifLink4}<a href="{text:Link4 URL}">{text:Link4}</a>&emsp;{/block:ifLink4}
  304. <a href="">code</a> &emsp;
  305. <a href="http://mcpoyles.tumblr.com">Theme</a>
  306. </center>
  307. </div>
  308. </div>
  309. </header>
  310.  
  311. <div id="wrap">
  312. <div class="center-center">
  313.  
  314. <div id="gr">
  315. <div id="inside">
  316. {block:Posts}
  317.  
  318. <div id="entry">
  319. {block:Text}
  320. {block:Title}
  321. <div class="titles"><a href="{Permalink}">{Title}</a></div>{/block:Title}
  322. {Body}
  323.  
  324.  
  325. {/block:Text}
  326.  
  327. {block:Photo}
  328. <div class="view view-first">
  329. <a href="{Permalink}"><img src="{PhotoURL-500}"></a>
  330. <div class="mask">
  331. <p>{block:Date}<big><big><a href="{Permalink}">{Month} {DayOfMonth}{DayOfMonthSuffix}</a></big></big>{/block:Date}</p>
  332. </div>
  333. </div>
  334. {block:PermalinkPage}<p>{block:Caption}{Caption}{/block:Caption}</p>{/block:PermalinkPage}
  335. {/block:Photo}
  336.  
  337. {block:Photoset}
  338. <div style="padding:10px 0px 10px 0px;">
  339. {Photoset-500}
  340. {block:PermalinkPage}<p>{block:Caption}{Caption}{/block:Caption}</p> {/block:PermalinkPage}
  341. </div>
  342. {/block:Photoset}
  343.  
  344.  
  345. {block:Quote}
  346. <div class="quote"><div class="medium">
  347. <i><big>{Quote}</big></i></div></div>
  348. {/block:Quote}
  349.  
  350.  
  351. {block:Link}
  352. <div class="titles"><a href="{URL}" {Target}>{Name}</a></div>
  353. {block:Description}{Description}{/block:Description}
  354. {/block:Link}
  355.  
  356.  
  357. {block:Chat}
  358. <ul class="chat">{block:Lines}<li class="user_{UserNumber}">
  359. {block:Label}<span class="label">{Label}</span>{/block:Label}
  360. {Line}</li>{/block:Lines}</ul>
  361. {/block:Chat}
  362.  
  363.  
  364. {block:Video}
  365. {Video-500}
  366. {block:Caption}{Caption}{/block:Caption}
  367. {/block:Video}
  368.  
  369.  
  370. {block:Audio}
  371. <div class="audio">
  372. {block:AlbumArt}<img class="audio-album" src="{AlbumArtURL}">{/block:AlbumArt}
  373. <div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div>
  374.  
  375. <div class="audio-info">
  376. {block:TrackName}<b>Title:</b> {TrackName}<BR>{/block:TrackName}
  377. {block:Artist}<b>Artist:</b> {Artist}<BR>{/block:Artist}
  378. {block:Album}<b>Album:</b> {Album}<BR>{/block:Album}
  379. {block:PlayCount}<b>Plays:</b> {PlayCount}<BR>{/block:PlayCount}
  380. </div></div>
  381. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  382. {/block:Audio}
  383.  
  384.  
  385. {block:Answer}
  386. <div style="padding:10px 0px 10px 0px;">
  387. <div style="font-family:georgia;font-style:italic;font-size:11px;padding:5px;">{Asker} asked:</div>
  388. <div style="background-color:#f9f9f9;padding:10px;">{Question}</div> </div>
  389. {Answer}
  390. {/block:Answer}
  391. </div>
  392.  
  393. {block:HasTags}
  394. <div id="info" style="width:490px;"> {block:Tags} <text style="text-transform:lowercase;font-size:9px;">#<a href="{TagURL}">{Tag}</a> &nbsp;&nbsp;</text>{/block:Tags}<BR>
  395. {block:ContentSource} <text style="text-transform:lowercase;font-size:9px;">Source: <a href="{SourceURL}">{SourceTitle}</a></text>&emsp; {/block:ContentSource} {block:NoteCount}<text style="text-transform:lowercase;font-size:9px;">with <a href="{Permalink}">{NoteCountWithLabel}</a> </text>&emsp; {/block:NoteCount} <a href="{Permalink}">&rarr;</a>
  396. </div>
  397. {/block:HasTags}
  398.  
  399. <div class="space"> </div>
  400.  
  401. {/block:Posts}
  402. {block:PostNotes}
  403. <div class="entry">
  404. {PostNotes}
  405. </div>
  406. {/block:PostNotes}
  407. </div>
  408.  
  409. <center>
  410. {block:Pagination}
  411. {block:PreviousPage}
  412. <a href="{PreviousPage}">Newest</a> /
  413. {/block:PreviousPage}
  414.  
  415. {block:NextPage}
  416. <a href="{NextPage}">Older</a> {/block:NextPage}
  417. {/block:Pagination}</center>
  418.  
  419. </div>
  420.  
  421.  
  422. </div>
  423. </div>
  424.  
  425. <div id="footer"> </div>
  426. </body>
  427. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement