Advertisement
hellmouths

THEME #008: RADIOACTIVE

Nov 8th, 2012
3,898
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.33 KB | None | 0 0
  1. <!--
  2.  
  3. THEME #008: RADIOACTIVE
  4. by hellmouths.tumblr.com
  5.  
  6. · DON'T REDISTRIBUTE
  7. · DON'T USE AS BASE
  8. · DON'T REMOVE CREDIT
  9.  
  10. Contact me if there are any complications.
  11. -->
  12.  
  13. <html>
  14. <head>
  15.  
  16. <title>{Title}</title>
  17. <link rel="shortcut icon" href="{Favicon}"/>
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  19. {block:Description} <meta name="description" content="{MetaDescription}"/> {/block:Description}
  20.  
  21. <meta name="color:bg" content="#f8f8f8" />
  22. <meta name="color:border" content="#f5f5f5" />
  23. <meta name="color:desc" content="#f8f8f8" />
  24. <meta name="color:hover" content="#a4b6bd" />
  25. <meta name="color:info" content="#fafafa" />
  26. <meta name="color:infoborder" content="#f3f3f3" />
  27. <meta name="color:infolink" content="#adadad" />
  28. <meta name="color:link" content="#9fa0a0" />
  29. <meta name="color:menuhover" content="#eeeceb" />
  30. <meta name="color:menuitem" content="#ffffff" />
  31. <meta name="color:posts" content="#ffffff" />
  32. <meta name="color:sidebar" content="#ffffff" />
  33. <meta name="color:text" content="#aaaaaa" />
  34.  
  35. <meta name="image:sidebar" content="" />
  36. <meta name="image:icon1" content="http://static.tumblr.com/royfsat/tUFmd0i43/home_copy.gif" />
  37. <meta name="image:icon2" content="http://static.tumblr.com/royfsat/YSfmd0i49/mail_back_copy.gif" />
  38. <meta name="image:icon3" content="http://static.tumblr.com/royfsat/hASmd0i4d/calendar_day_copy.gif" />
  39. <meta name="image:icon4" content="http://static.tumblr.com/royfsat/fZOmd0i4h/bookmark_copy.gif" />
  40.  
  41. <meta name="text:icon1url" content="/"/>
  42. <meta name="text:icon2url" content="/"/>
  43. <meta name="text:icon3url" content="/"/>
  44. <meta name="text:icon4url" content="/"/>
  45.  
  46. <meta name="text:link1" content="link 1"/>
  47. <meta name="text:link1url" content="/"/>
  48.  
  49. <meta name="text:link2" content="link 2"/>
  50. <meta name="text:link2url" content="/"/>
  51.  
  52. <meta name="text:link3" content="link 3"/>
  53. <meta name="text:link3url" content="/"/>
  54.  
  55. <meta name="text:link4" content="link 4"/>
  56. <meta name="text:link4url" content="/"/>
  57.  
  58. <meta name="text:link5" content="link 5"/>
  59. <meta name="text:link5url" content="/"/>
  60.  
  61. <meta name="if:Show Post Border" content="1"/>
  62. <meta name="if:Show Sidebar Border" content="1"/>
  63. <meta name="if:Show Description Box" content="1"/>
  64. <meta name="if:Show Sidebar Hover" content="1"/>
  65.  
  66. <meta name="if:Show Link 1" content="1"/>
  67. <meta name="if:Show Link 2" content="1"/>
  68. <meta name="if:Show Link 3" content="1"/>
  69. <meta name="if:Show Link 4" content="1"/>
  70. <meta name="if:Show Link 5" content="1"/>
  71.  
  72.  
  73.  
  74. <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,800,700,600' rel='stylesheet' type='text/css'>
  75.  
  76. <link href='http://fonts.googleapis.com/css?family=Anaheim' rel='stylesheet' type='text/css'>
  77.  
  78.  
  79.  
  80. <style type="text/css">
  81.  
  82.  
  83. /* SCROLLBAR */
  84.  
  85. ::-webkit-scrollbar-thumb:vertical {
  86. background-color:{color:hover};
  87. border-top:2px solid {color:hover};
  88. border-bottom:2px solid {color:hover};
  89. height:auto;}
  90. ::-webkit-scrollbar-thumb:vertical:hover{
  91. background-color:{color:hover};}
  92. ::-webkit-scrollbar-thumb:horizontal{
  93. background-color:{color:hover};
  94. height:auto;}
  95. ::-webkit-scrollbar-thumb:horizontal:hover{
  96. background-color:{color:hover};}
  97. ::-webkit-scrollbar{
  98. height:10px;
  99. width:5px;
  100. background-color: {color:posts};}
  101.  
  102.  
  103. /* BODY */
  104.  
  105. body {
  106. font: 9px Arial;
  107. line-height:150%;
  108. background-color: {color:bg};
  109. color: {color:text}; }
  110.  
  111. a, a:active, a:visited{
  112. text-decoration: none;
  113. color: {color:link}; }
  114.  
  115. a:hover{
  116. color: {color:hover}; }
  117.  
  118.  
  119. /* POSTS */
  120.  
  121. #container {
  122. margin:60px auto 40px 150px;
  123. width:900px;}
  124.  
  125. .post {
  126. width:500px;
  127. padding:10px;
  128. margin-bottom:20px;
  129. {block:IfShowPostBorder}
  130. border:1px solid {color:border};
  131. {/block:IfShowPostBorder}
  132. background: {color:posts}; }
  133.  
  134. .title {
  135. font:25px 'Anaheim';
  136. letter-spacing:-1;
  137. margin-top:-5px;}
  138. .title a { color:{color:hover}; }
  139.  
  140. .quote {
  141. font:25px 'Anaheim';
  142. line-height:100%;
  143. letter-spacing:-1;
  144. padding:10px;
  145. color:{color:hover}; }
  146.  
  147. .source {
  148. font-size:10px;
  149. padding-top:5px;
  150. text-align:right; }
  151.  
  152.  
  153. /* DATE / SOURCES */
  154.  
  155. .info {
  156. width:490px;
  157. padding:3px 5px;
  158. margin-top:15px;
  159. font-size:7px;
  160. text-transform:uppercase;
  161. letter-spacing:1px;
  162. background-color:{color:info};
  163. border-bottom:1px solid {color:infoborder}; }
  164. .info:hover {
  165. background-color:{color:bg};
  166. border-bottom:1px solid {color:infoborder}; }
  167. .info a { color:{color:infolink}; }
  168.  
  169.  
  170.  
  171. /* AUDIO */
  172.  
  173. .audio {
  174. height:60px;
  175. padding:5px;
  176. margin-bottom:5px; }
  177.  
  178. .audio-album {
  179. position:absolute;
  180. width:60px; }
  181.  
  182. .audio-player {
  183. opacity:0.6;
  184. filter:alpha(opacity=60);
  185. border:2px solid {color:border};
  186. width:25px;
  187. height:25px;
  188. overflow:hidden;
  189. position:absolute;
  190. z-index:2;
  191. margin-left:15px;
  192. margin-top:15px; }
  193.  
  194. .audio-info {
  195. margin-top:-5px;
  196. position:relative;
  197. margin-left:70px;
  198. line-height:170%;
  199. padding:5px; }
  200.  
  201.  
  202.  
  203. /* TAGS */
  204.  
  205. .right {
  206. position:absolute;
  207. margin-left:-110px;
  208. opacity:0; 
  209. -webkit-transition: all 0.4s ease-out;
  210. -o-transition: all 0.4s ease-out;
  211. -webkit-transition: all 0.4s ease-out;
  212. -moz-transition: all 0.4s ease-out;}
  213.  
  214. .post:hover .right {
  215. margin-left:-121px;
  216. opacity:1;
  217. -webkit-transition: all 0.4s ease-out;
  218. -o-transition: all 0.4s ease-out;
  219. -webkit-transition: all 0.4s ease-out;
  220. -moz-transition: all 0.4s ease-out;}
  221.  
  222. .tags a {
  223. display:block;
  224. padding:3px 5px;
  225. width:100px;
  226. overflow:hidden;
  227. margin-bottom:5px;
  228. background-color:{color:posts};
  229. border-bottom:1px solid {color:border};}
  230.  
  231.  
  232. /* SIDEBAR */
  233.  
  234. #sidebar {
  235. padding:20px;
  236. margin-left:765px;
  237. margin-top:250px;
  238. position:fixed;
  239. background-color:{color:sidebar};
  240. {block:IfShowSidebarBorder}
  241. border:1px solid {color:border};
  242. {/block:IfShowSidebarBorder}}
  243.  
  244. #desc {
  245. padding:4px 2px 4px 3px;
  246. width:240px;
  247. opacity:0;
  248. height:255px;
  249. margin-top:-267px;
  250. text-align:center;
  251. position:absolute;
  252. background-color:{color:desc};
  253. -webkit-transition: all 0.4s ease-out;
  254. -o-transition: all 0.4s ease-out;
  255. -webkit-transition: all 0.4s ease-out;
  256. -moz-transition: all 0.4s ease-out;
  257.  
  258. }
  259.  
  260. #sbarimg img {
  261. width:245px;
  262. opacity:0.8;
  263. -webkit-transition: all 0.4s ease-out;
  264. -o-transition: all 0.4s ease-out;
  265. -webkit-transition: all 0.4s ease-out;
  266. -moz-transition: all 0.4s ease-out;
  267. }
  268.  
  269. #sidebar:hover #desc {
  270. opacity:1;
  271. -webkit-transition: all 0.4s ease-out;
  272. -o-transition: all 0.4s ease-out;
  273. -webkit-transition: all 0.4s ease-out;
  274. -moz-transition: all 0.4s ease-out;}
  275.  
  276.  
  277.  
  278.  
  279.  
  280. /* MENU */
  281.  
  282. #menu {
  283. width:260px;
  284. text-align:center;
  285. margin-top:228px;
  286. margin-left:776px;
  287. position:fixed;}
  288.  
  289. .menuitem {
  290. width:25px;
  291. padding:6px 5px;
  292. display:inline-block;
  293. color:white;
  294. margin:0px 5px;
  295. position:relative;
  296. height:auto;
  297. -webkit-border-top-left-radius: 10px;
  298. -webkit-border-top-right-radius: 10px;
  299. -moz-border-radius-topleft: 10px;
  300. -moz-border-radius-topright: 10px;
  301. border-top-left-radius: 10px;
  302. border-top-right-radius: 10px;
  303.  
  304. -webkit-transition: all 0.4s ease-out;
  305. -o-transition: all 0.4s ease-out;
  306. -webkit-transition: all 0.4s ease-out;
  307. -moz-transition: all 0.4s ease-out;
  308. border:1px solid {color:border};
  309. background-color:{color:menuitem}; }
  310.  
  311. .menuitem:hover {
  312. background-color:{color:menuhover};
  313. color:white;
  314. border:1px solid white;
  315. -webkit-transition: all 0.4s ease-out;
  316. -o-transition: all 0.4s ease-out;
  317. -webkit-transition: all 0.4s ease-out;
  318. -moz-transition: all 0.4s ease-out;}
  319.  
  320. .menuitem img { opacity:0.6; }
  321.  
  322.  
  323. /* LINKS */
  324.  
  325. #links { width:auto; float:center; margin-top:12px; }
  326. #links a {
  327. padding:3px 1px 3px 1px;
  328. font-size:13px;
  329. margin:auto;
  330. margin-top:5px;
  331. font-family:'anaheim';
  332. text-transform:uppercase;
  333. width:90%;
  334. border-bottom:1px solid {color:posts};
  335. display:block;
  336. text-align:center; }
  337.  
  338.  
  339.  
  340. /* PAGINATION */
  341.  
  342. #pagination {
  343. margin-top:570px;
  344. width:270px;
  345. height:50px;
  346. opacity:0.4;
  347. margin-left:770px;
  348. position:fixed;
  349. line-height:20px;
  350. font-family:'open sans';
  351. font-size:20px;
  352. font-weight: 800;
  353. }
  354.  
  355. .page1 { width:130px; float:left; height:45px; display:inline-block; }
  356. .page2 { width:130px; text-align:right; float:right; height:45px; display:inline-block; }
  357.  
  358.  
  359.  
  360. /* NOTES */
  361.  
  362. ol.notes{
  363. padding: 10px;
  364. margin-top: 0px;
  365. background-color:{color:posts};
  366. text-align:left;
  367. list-style-type: none;
  368. width:500px;
  369. border: solid 1px {color:infoborder}; }
  370.  
  371. ol.notes li.note{ border-top: solid 1px {color:infoborder}; padding: 4px; }
  372. ol.notes li.note img.avatar { display:none; }
  373. ol.notes li.note span.action { font-weight: normal; }
  374. ol.notes li.note .answer_content { font-weight: normal; }
  375. ol.notes li.note blockquote{
  376. padding: 0px 0px 0px 5px;
  377. margin: 0px 0px 2px 25px;
  378. border-left: 2px solid {color:infoborder};}
  379. ol.notes li.note blockquote a { color:{color:link}; text-decoration: none; font-size:10px; }
  380.  
  381.  
  382.  
  383. /* CREDIT */
  384.  
  385. .cred { font-family:calibri; letter-spacing:1px; font-size:10px; bottom:2px; right:4px; position:fixed; padding:10px; text-align:right; font-weight:bold; }
  386.  
  387. .cred:hover #name { margin-bottom:0;
  388. -webkit-transition: all 0.2s ease-out;
  389. -o-transition: all 0.2s ease-out;
  390. -webkit-transition: all 0.2s ease-out;
  391. -moz-transition: all 0.2s ease-out;}
  392.  
  393. .cred:hover #star { opacity:0;
  394. -webkit-transition: all 0.2s ease-out;
  395. -o-transition: all 0.2s ease-out;
  396. -webkit-transition: all 0.2s ease-out;
  397. -moz-transition: all 0.2s ease-out;}
  398.  
  399. #star { font-size:20px; padding-bottom:10px; }
  400. #name { margin-bottom:-36px;
  401. -webkit-transition: all 0.2s ease-out;
  402. -o-transition: all 0.2s ease-out;
  403. -webkit-transition: all 0.2s ease-out;
  404. -moz-transition: all 0.2s ease-out;}
  405. #name a { color:{color:hover}; }
  406.  
  407.  
  408. </style>
  409. </head>
  410. <body>
  411.  
  412. <div class="cred"><div id="star">★</div>
  413. <div id="name"><i>theme by</i> <br /><a href="http://hellmouths.tumblr.com">HELLMOUTHS</a></div>
  414. </div>
  415.  
  416.  
  417.  
  418.  
  419. <div id="menu">
  420. <div class="menuitem"><a href="{text:icon1url}">
  421. <img src="{image:icon1}"></a></div>
  422. <div class="menuitem"><a href="{text:icon2url}">
  423. <img src="{image:icon2}"></a></div>
  424. <div class="menuitem"><a href="{text:icon3url}">
  425. <img src="{image:icon3}"></a></div>
  426. <div class="menuitem"><a href="{text:icon4url}">
  427. <img src="{image:icon4}"></a></div>
  428. </div>
  429.  
  430. <div id="sidebar">
  431. <div id="sbarimg"><img src="{image:Sidebar}">
  432.  
  433. {block:IfShowSidebarHover}
  434. <div id="desc"> {block:IfShowDescriptionBox}<div style=" width:180px; float:center; margin:auto; margin-top:20px; padding:10px; background-color:{color:posts}; opacity:1;">{Description}</div>{/block:IfShowDescriptionBox}
  435.  
  436. <div id="links">
  437. {block:IfShowLink1}
  438. <a href="{text:link1url}">{text:link1}</a>{/block:IfShowLink1}
  439. {block:IfShowLink2}
  440. <a href="{text:link2url}">{text:link2}</a>{/block:IfShowLink2}
  441. {block:IfShowLink3}
  442. <a href="{text:link3url}">{text:link3}</a>{/block:IfShowLink3}
  443. {block:IfShowLink4}
  444. <a href="{text:link4url}">{text:link4}</a>{/block:IfShowLink4}
  445. {block:IfShowLink5}
  446. <a href="{text:link5url}">{text:link5}</a>{/block:IfShowLink5}
  447. </div>
  448.  
  449. </div>{/block:IfShowSidebarHover}
  450.  
  451. </div>
  452. </div>
  453.  
  454. <div id="pagination">{block:Pagination}
  455.  
  456. <div class="page1">{block:PreviousPage}<a href="{PreviousPage}">back</a>{/block:PreviousPage}</div>
  457.  
  458. <div class="page2">{block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}</div>
  459.  
  460. {/block:Pagination} </div>
  461.  
  462. <div id="container">
  463.  
  464.  
  465. {block:Posts}
  466.  
  467. <div class="post">
  468.  
  469. <div class="right">
  470. <div class="tags">
  471. {block:HasTags}
  472. {block:Tags}<a href="{TagURL}"># {Tag}</a>{/block:Tags}{/block:HasTags}</div>
  473. </div>
  474.  
  475.  
  476. {block:Text}
  477. {block:Title}
  478. <div class="title"><a href="{Permalink}">{Title}</a></div>
  479. {/block:Title}
  480. {Body}
  481. {/block:Text}
  482.  
  483. {block:Photo}
  484. <center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>
  485. {block:Caption}
  486. <div class="caption">{Caption}</div>
  487. {/block:Caption}
  488. {/block:Photo}
  489.  
  490. {block:Photoset}
  491. <center>{Photoset-500}</center>
  492. {block:Caption}
  493. <div class="caption">{Caption}</div>
  494. {/block:Caption}
  495. {/block:Photoset}
  496.  
  497. {block:Quote}
  498. <div class="quote">"{Quote}"</div>
  499. {block:Source}
  500. <div class="source">- {Source}</div>
  501. {/block:Source}
  502. {/block:Quote}
  503.  
  504. {block:Link}
  505. <center><div class="title"><a href="{URL}" class="link" {Target}>{Name}</a></div></center>
  506. {block:Description}
  507. {Description}
  508. {/block:Description}
  509. {/block:Link}
  510.  
  511. {block:Chat}{block:Title}<div class="title">{Title}</div>{/block:Title}<p>
  512. <div style="margin:-10px 0px;">
  513. {block:Lines}<div style="padding:7px 3px; border-bottom: 1px solid {color:border}; ">{block:Label}<span style="color: {color:link}; text-transform: uppercase; letter-spacing: 1px">{Label}</span>{/block:Label}&nbsp;{Line}<br></div>{/block:Lines}</div><br />{/block:Chat}
  514.  
  515. {block:Video}
  516. <center>{Video-500}</center>
  517. {block:Caption}
  518. {Caption}
  519. {/block:Caption}
  520. {/block:Video}
  521.  
  522. {block:Answer}<div style="color: {color:text}; background: {color:bg}; padding: 15px">{Asker}: {Question}</div><br><p>{Answer}{/block:answer}
  523.  
  524. {block:Audio}
  525. <div class="audio">
  526. {block:AlbumArt}<img class="audio-album" src="{AlbumArtURL}">{/block:AlbumArt}
  527. <div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div>
  528.  
  529. <div class="audio-info">
  530. {block:TrackName}<b>Title:</b> {TrackName}<BR>{/block:TrackName}
  531. {block:Artist}<b>Artist:</b> {Artist}<BR>{/block:Artist}
  532. {block:Album}<b>Album:</b> {Album}<BR>{/block:Album}
  533. {block:PlayCount}<b>Plays:</b> {PlayCount}<BR>{/block:PlayCount}
  534. </div></div>
  535. {block:Caption}{Caption}{/block:Caption}
  536. {/block:Audio}
  537.  
  538.  
  539. <div class="info">{block:Date}posted <a href="{Permalink}">{TimeAgo}</a> with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:Date} <div style="float:right;">{block:RebloggedFrom}via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom} {block:ContentSource}/ source: <a href="{SourceURL}">{SourceLink}</a>
  540. {/block:ContentSource}</div></div>
  541.  
  542. </div>
  543.  
  544. {block:PermalinkPage}{block:PostNotes}{PostNotes}{/block:PostNotes}{/block:PermalinkPage}
  545. {/block:Posts}
  546.  
  547. </div>
  548.  
  549. </body>
  550. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement