Advertisement
celestialthemes

Theme #01: Dark Version

Jul 31st, 2012
2,574
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.91 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <head>
  6.  
  7. <!--theme #01 by celestialthemes.tumblr.com DO NOT REMOVE CREDITS-->
  8.  
  9. <title>{Title}</title>
  10.  
  11. <link rel="shortcut icon" href="{Favicon}">
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  13.  
  14. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  15.  
  16. <meta name="color:Background Color" content="#000000"/>
  17. <meta name="color:Font Color" content="#f6c798"/>
  18.  
  19. <meta name="color:Link Color" content="#ffffff"/>
  20. <meta name="color:Link Hover" content="#dadada"/>
  21.  
  22. <meta name="color:Title Color" content="#f6c798"/>
  23. <meta name="color:Descrip Background" content="#5f2439"/>
  24. <meta name="color:Descrip Text" content="#f6c798"/>
  25.  
  26. <meta name="if:ShowLink1" content="1"/>
  27. <meta name="if:ShowLink2" content="0"/>
  28. <meta name="if:ShowLink3" content="0"/>
  29. <meta name="if:ShowLink4" content="0"/>
  30. <meta name="if:ShowLink5" content="0"/>
  31. <meta name="if:ShowLink6" content="0"/>
  32. <meta name="if:ShowArchive" content="1"/>
  33. <meta name="if:ShowRandom" content="1"/>
  34.  
  35. <meta name="text:AskText" content="Message"/>
  36. <meta name="text:Link1 URL" content=""/>
  37. <meta name="text:Link1" content="Link1"/>
  38. <meta name="text:Link2 URL" content=""/>
  39. <meta name="text:Link2" content="Link2"/>
  40. <meta name="text:Link3 URL" content=""/>
  41. <meta name="text:Link3" content="Link3"/>
  42. <meta name="text:Link4 URL" content=""/>
  43. <meta name="text:Link4" content="Link4"/>
  44. <meta name="text:Link5 URL" content=""/>
  45. <meta name="text:Link5" content="Link5"/>
  46. <meta name="text:Link6 URL" content=""/>
  47. <meta name="text:Link6" content="Link6"/>
  48.  
  49. <meta name="image:Sidebar" content="http://i.imgur.com/MAZs3.gif"/>
  50.  
  51. <meta name="color:Post Color" content="#5f2439">
  52. <meta name="color:Tag Background" content="#7a3e54">
  53. <meta name="color:Chat1 Color" content="#7a3e54">
  54. <meta name="color:Chat2 Color" content="#5f2439">
  55.  
  56. <meta name="if:ShowTags" content="1"/>
  57. <meta name="if:ShowLike" content="1"/>
  58. <meta name="if:ShowReblog" content="1"/>
  59. <meta name="if:ShowNotes" content="1"/>
  60.  
  61. <style type="text/css">
  62.  
  63. body{
  64. background:{color:Background Color};
  65. margin:0px;
  66. color:{color:Font Color};
  67. font-family:arial;
  68. font-size:10px;
  69. line-height:100%;
  70. scrollbar-arrow-color:{color:Post Color};
  71. scrollbar-face-color:{color:Post Color};
  72. scrollbar-track-color:{color:Background Color};
  73. }
  74.  
  75. a{
  76. text-decoration:none;
  77. outline:none;
  78. color:{color:Link Color};
  79. }
  80.  
  81. a:hover{
  82. -webkit-transition:all 0.5s ease-in-out;
  83. -moz-transition:all 0.5s ease-in-out;
  84. -o-transition:all 0.5s ease-in-out;
  85. -ms-transition:all 0.5s ease-in-out;
  86. transition:all 0.5s ease-in-out;
  87.  
  88. color:{color:Link Hover};
  89. }
  90.  
  91. a.button{
  92. -webkit-transition:-webkit-transform 1s,opacity 1s,background 1s,width 1s,height 1s,font-size 1s;
  93.  
  94. -o-transition-property:width,height,-o-transform,background,font-size,opacity,color;
  95. -o-transition-duration:1s,1s,1s,1s,1s,1s,1s;
  96.  
  97. -moz-transition-property:width, height, -moz-transform, background, font-size, opacity, color;
  98. -moz-transition-duration:1s,1s,1s,1s,1s,1s,1s;
  99.  
  100. transition-property:width,height,transform,background,font-size,opacity;
  101. transition-duration:1s,1s,1s,1s,1s,1s;
  102.  
  103. display:inline-block;
  104. font-family:arial;
  105. font-size:10px;
  106. text-align:center;
  107. width:80px;
  108. height:35px;
  109. margin-bottom:5px;
  110. padding:15px 0px 0px 0px;
  111. line-height:200%;
  112. color:{color:Descrip Text};
  113. background:{color:Descrip Background};
  114. }
  115.  
  116. a.button:hover{
  117. -moz-transform: rotate(360deg);
  118. -webkit-transform: rotate(360deg);
  119. -o-transform: rotate(360deg);
  120. transform: rotate(360deg);
  121. -ms-transform: rotate(360deg);
  122.  
  123. color:{color:Descrip Hover};
  124. }
  125.  
  126. a.title{
  127. color:{color:Title Color};
  128. }
  129.  
  130. a.title:hover{
  131. -webkit-transition:all 0.5s ease-in-out;
  132. -moz-transition:all 0.5s ease-in-out;
  133. -o-transition:all 0.5s ease-in-out;
  134. -ms-transition:all 0.5s ease-in-out;
  135. transition:all 0.5s ease-in-out;
  136.  
  137. color:{color:Link Hover};
  138. }
  139.  
  140. a.credit{
  141. color:{color:Title Color};
  142. font-size:24px;
  143. font-family:Georgia;
  144. letter-spacing:2px;
  145. }
  146.  
  147. a.credit:hover{
  148. -webkit-transition:all 0.5s ease-in-out;
  149. -moz-transition:all 0.5s ease-in-out;
  150. -o-transition:all 0.5s ease-in-out;
  151. -ms-transition:all 0.5s ease-in-out;
  152. transition:all 0.5s ease-in-out;
  153.  
  154. color:{color:Link Hover};
  155. }
  156.  
  157. a.dos{
  158. color:{color:Title Color};
  159. }
  160.  
  161. a.dos:hover{
  162. -webkit-transition:all 0.5s ease-in-out;
  163. -moz-transition:all 0.5s ease-in-out;
  164. -o-transition:all 0.5s ease-in-out;
  165. -ms-transition:all 0.5s ease-in-out;
  166. transition:all 0.5s ease-in-out;
  167.  
  168. color:{color:Link Hover};
  169. }
  170.  
  171. h1{
  172. line-height:100%;
  173. padding: 1em 2em;
  174. }
  175.  
  176. h2{
  177. line-height:100%;
  178. padding: 1em 2em;
  179. }
  180.  
  181. img{
  182. border:none;
  183. }
  184.  
  185. blockquote{
  186. padding-left:2px;
  187. border-left:2px solid {color:Font Color};
  188. }
  189.  
  190. blockquote blockquote{
  191. padding-left:2px;
  192. border-left:2px solid {color:Font Color};
  193. }
  194.  
  195. #izquierda{
  196. margin-top:60px;
  197. margin-left:100px;
  198. width:400px;
  199. position:fixed;
  200. z-index:0;
  201. width:80px;
  202. height:10px;
  203. }
  204.  
  205. #title{
  206. position:fixed;
  207. margin-top:30px;
  208. margin-left:100px;
  209. text-align:right;
  210. width:400px;
  211. height:100%;
  212. color:{color:Title Color};
  213. font-family:Georgia;
  214. font-size:30px;
  215. }
  216.  
  217. #descrip{
  218. position:fixed;
  219. margin-top:60px;
  220. margin-left:185px;
  221. padding:10px;
  222. width:300px;
  223. background:{color:Descrip Background};
  224. color:{color:Descrip Text};
  225. }
  226.  
  227. #pagedos{
  228. font-size:60px;
  229. font-weight:bold;
  230. font-family: 'Georgia', serif;
  231. line-height:100%;
  232. text-align:right;
  233. }
  234.  
  235. #nani{
  236. float:left;
  237. margin-left:550px;
  238. margin-top:60px;
  239. padding:0px 30px 100px 0px;
  240. width:500px;
  241. z-index:100;
  242. }
  243.  
  244. #entry{
  245. position:relative;
  246. width:500px;
  247. padding:10px;
  248. margin-bottom:5px;
  249. background:{color:Post Color};
  250. }
  251.  
  252. #titulo{
  253. font-family:Georgia;
  254. font-weight:bold;
  255. font-size:24px;
  256. line-height:100%;
  257. margin-bottom:5px;
  258. }
  259.  
  260. #quotetitulo{
  261. font-family:Georgia;
  262. font-weight:bold;
  263. font-size:60px;
  264. float:left;
  265. padding-top:15px;
  266. padding-right:5px;
  267. }
  268.  
  269. .chat1{
  270. background:{color:Chat1 Color};
  271. color:{color:Font Color};
  272. padding:4px;
  273. margin-bottom:1px;
  274. }
  275.  
  276. .chat2{
  277. background:{color:Chat2 Color};
  278. color:{color:Font Color};
  279. padding:4px;
  280. margin-bottom:1px;
  281. }
  282.  
  283. .chat3{
  284. background:{color:Chat1 Color};
  285. color:{color:Font Color};
  286. padding:4px;
  287. margin-bottom:1px;
  288. }
  289.  
  290. .chat4{
  291. background:{color:Chat2 Color};
  292. color:{color:Font Color};
  293. padding:4px;
  294. margin-bottom:1px;
  295. }
  296.  
  297. .chat5{
  298. background:{color:Chat1 Color};
  299. color:{color:Font Color};
  300. padding:4px;
  301. margin-bottom:1px;
  302. }
  303.  
  304. .chat6{
  305. background:{color:Chat2 Color};
  306. color:{color:Font Color};
  307. padding:4px;
  308. margin-bottom:1px;
  309. }
  310.  
  311. #rey{
  312. position:relative;
  313. margin-top:0px;
  314. }
  315.  
  316. #reina{
  317. position:absolute;
  318. width:17px;
  319. height:30px;
  320. overflow-x:hidden;
  321. z-index:99;
  322. margin-left:0px;
  323. }
  324.  
  325. #silverray{
  326. -webkit-transition:all 0.5s ease-in-out;
  327. -moz-transition:all 0.5s ease-in-out;
  328. -o-transition:all 0.5s ease-in-out;
  329. -ms-transition:all 0.5s ease-in-out;
  330. transition:all 0.5s ease-in-out;
  331.  
  332. background:#000000;
  333. position:absolute;
  334. width:25px;
  335. height:25px;
  336. z-index:99;
  337. padding:5px;
  338. margin-top:45px;
  339. margin-left:45px;
  340. opacity:0.5;
  341. }
  342.  
  343. #silverray:hover{
  344. -webkit-transition:all 0.5s ease-in-out;
  345. -moz-transition:all 0.5s ease-in-out;
  346. -o-transition:all 0.5s ease-in-out;
  347. -ms-transition:all 0.5s ease-in-out;
  348. transition:all 0.5s ease-in-out;
  349.  
  350. opacity:1;
  351. }
  352.  
  353. img.reina{
  354. position:relative;
  355. margin-top:-125px;
  356. margin-left:-125px;
  357. z-index:1;
  358. width:125px;
  359. height:125px;
  360. }
  361.  
  362. img.default{
  363. position:relative;
  364. margin-top:0px;
  365. width:125px;
  366. height:125px;
  367. z-index:0;
  368. }
  369.  
  370. #moopie{
  371. float:right;
  372. position:absolute;
  373. {block:If500pxPost}width:365px;{/block:If500pxPost}
  374. {block:If400pxPost}width:265px;{/block:If400pxPost}
  375. {block:If250pxPost}width:115px;{/block:If250pxPost}
  376. padding-top:0px;
  377. padding-left:135px;
  378. line-height:100%;
  379. }
  380.  
  381. #quotesource{
  382. text-align:right;
  383. }
  384.  
  385. #question{
  386. padding:5px 0px 5px 5px;
  387. font-size:18px;
  388. font-family:'Times New Roman';
  389. font-weight:bold;
  390. line-height:100%;
  391. margin-bottom:5px;
  392. background:{color:Tag Background};
  393. }
  394.  
  395. #tagsie{
  396. padding:5px;
  397. margin-top:5px;
  398. background:{color:Tag Background};
  399. }
  400.  
  401. ol.notes{
  402. padding:0px;
  403. list-style-type:none;
  404. }
  405.  
  406. li.note{
  407. padding:5px;
  408. list-style-position:inside;
  409. }
  410.  
  411. li.note.more_notes_link_container{
  412. list-style-type:none;
  413. }
  414.  
  415. img.avatar{
  416. width:8px;
  417. height:8px;
  418. }
  419.  
  420. #credit{
  421. position:fixed;
  422. bottom:5px;
  423. right:5px;
  424. padding:3px;
  425. }
  426.  
  427. ::-webkit-scrollbar {
  428. width: 8px;
  429. height: 8px;
  430. }
  431.  
  432. ::-webkit-scrollbar-track {
  433. -webkit-border-radius: 0px;
  434. border-radius: 0px;
  435. background: {color:Background Color};
  436. }
  437.  
  438. ::-webkit-scrollbar-thumb {
  439. -webkit-border-radius: 0px;
  440. border-radius: 0px;
  441. background: {color:Post Color};
  442. }
  443.  
  444. ::-webkit-scrollbar-thumb:window-inactive {
  445. background: {color:Post Color};
  446. }
  447.  
  448. .my-like {
  449. background-image: url(http://static.tumblr.com/cxtftev/JJvm8xwot/heart-8px_white.png) !important;
  450. background-repeat:no-repeat;
  451. background-position:center bottom;
  452. height:10px;
  453. width:10px;
  454. cursor:pointer;
  455. display:inline-block;
  456. }
  457.  
  458. .my-liked, .my-like:hover {
  459. background-image: url(http://static.tumblr.com/cxtftev/J8qm8vkgt/heart_copy-8px.png) !important;
  460. background-repeat:no-repeat;
  461. background-position:center bottom;
  462. height:10px;
  463. width:10px;
  464. cursor:pointer;
  465. display:inline-block;
  466. }
  467.  
  468. </style>
  469.  
  470. <script> window.onload = function () { document.body.insertAdjacentHTML( 'beforeEnd', '<iframe id="my-like-frame" style="display:none;"></iframe>' ); document.addEventListener( 'click', function ( event ) { var myLike = event.target; if( myLike.className.indexOf( 'my-like' ) > -1 ) { var frame = document.getElementById( 'my-like-frame' ), liked = ( myLike.className == 'my-liked' ), command = liked ? 'unlike' : 'like', reblog = myLike.getAttribute( 'data-reblog' ), id = myLike.getAttribute( 'data-id' ), oauth = reblog.slice( -8 ); frame.src = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + id; liked ? myLike.className = 'my-like' : myLike.className = 'my-liked'; }; }, false ); }; </script>
  471.  
  472. </head>
  473.  
  474. <!--theme by celestialthemes.tumblr.com-->
  475.  
  476. <body>
  477.  
  478. <div id="title"><a href="/" class="title">{Title}</a></div>
  479.  
  480. <div id="izquierda">
  481.  
  482. <a href="/" class="button">Home</a>
  483. <a href="/ask" class="button">{text:AskText}</a>
  484. {block:IfShowArchive}<a href="/archive" class="button">Archive</a>{/block:IfShowArchive}
  485. {block:IfShowRandom}<a href="/random" class="button">Random</a>{/block:IfShowRandom}
  486. {block:IfShowLink1}<div class="button"><a href="{text:Link1 URL}" class="button">{text:Link1}</a></div>{/block:IfShowLink1}
  487. {block:IfShowLink2}<div class="button"><a href="{text:Link2 URL}" class="button">{text:Link2}</a></div>{/block:IfShowLink2}
  488. {block:IfShowLink3}<div class="button"><a href="{text:Link3 URL}" class="button">{text:Link3}</a></div>{/block:IfShowLink3}
  489. {block:IfShowLink4}<div class="button"><a href="{text:Link4 URL}" class="button">{text:Link4}</a></div>{/block:IfShowLink4}
  490. {block:IfShowLink5}<div class="button"><a href="{text:Link5 URL}" class="button">{text:Link5}</a></div>{/block:IfShowLink5}
  491. {block:IfShowLink6}<div class="button"><a href="{text:Link6 URL}" class="button">{text:Link6}</a></div>{/block:IfShowLink6}
  492.  
  493. </div>
  494.  
  495. {block:Description}<div id="descrip"><img src="{image:Sidebar}" width="300px"><br/><br/>{Description}{block:Pagination}<div id="pagedos">{block:PreviousPage}<a href="{PreviousPage}" class="dos">«</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}" class="dos">»</a>{/block:NextPage}</div>{/block:Pagination}</div>{/block:Description}
  496.  
  497. <div id="nani">{block:Posts}
  498.  
  499. <div id="entry">
  500.  
  501. {block:Text}{block:Title}<div id="titulo">{Title}</div>{/block:Title}{Body}{/block:Text}
  502.  
  503. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  504.  
  505. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  506.  
  507. {block:Quote}<div id="quotetitulo">“</div>{Quote}{block:Source}<br/> <div id="quotesource">—{Source}</div>{/block:Source}{/block:Quote}
  508.  
  509. {block:Link}<div id="titulo"><a href="{URL}" {Target}>{Name}</a></div>{block:Description}{Description}{/block:Description}{/block:Link}
  510.  
  511. {block:Chat}{block:Title}<div id="titulo">{Title}</div>{/block:Title}{block:Lines}<div class="chat{UserNumber}">{block:Label}<b>{Label}</b>{/block:Label} {Line}</div>{/block:Lines}{/block:Chat}
  512.  
  513. {block:Audio}
  514. <div id="moopie">
  515. <strong>Track:</strong> {block:TrackName}{TrackName}{/block:TrackName}<br/><br/>
  516. <strong>Artist:</strong> {block:Artist}{Artist}{/block:Artist}<br/><br/>
  517. <strong>Album:</strong> {block:Album}{Album}{/block:Album}
  518. </div>
  519. <div id="silverray"><div id="reina">{AudioPlayerBlack}</div></div><img src="http://static.tumblr.com/cxtftev/Ib8m8s0kd/defaultalbumart2.png" class="default">{block:AlbumArt}<img src="{AlbumArtURL}" class="reina">{/block:AlbumArt}
  520. {block:Caption}<div id="rey">{Caption}</div>{/block:Caption}
  521. {/block:Audio}
  522.  
  523. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  524.  
  525. {block:Answer}<div id="question"><img src="{AskerPortraitURL-16}">&nbsp;&nbsp;{Asker}: {Question}</div>{Answer}{/block:Answer}
  526.  
  527. {block:IndexPage}
  528.  
  529. <div id="tagsie">{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}{block:RebloggedFrom} · reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a> · originally <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}{block:IfShowNotes}{block:NoteCount} · <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}{/block:IfShowNotes}{block:IfShowLike} · <div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like"></div>{/block:IfShowLike}{block:IfShowReblog} · <a href="{ReblogURL}">reblog</a>{/block:IfShowReblog}</div>
  530.  
  531. {block:IfShowTags}{block:HasTags}<div id="tagsie">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}{/block:IfShowTags}
  532.  
  533. {/block:IndexPage}
  534.  
  535. {block:PermalinkPage}
  536.  
  537. <div id="tagsie">{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}
  538. {block:RebloggedFrom} · reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a>
  539. · originally <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  540. {block:NoteCount} · <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  541. </div>
  542.  
  543. {block:HasTags}<div id="tagsie">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}
  544.  
  545. {block:PostNotes}<div id="tagsie">{PostNotes}</div>{/block:PostNotes}
  546.  
  547. {/block:PermalinkPage}
  548.  
  549. </div>
  550.  
  551. {/block:Posts}
  552.  
  553. </div>
  554.  
  555. <div id="credit"><a href="http://www.celestialthemes.tumblr.com" class="credit">CT</a></div>
  556.  
  557. <!--theme #01 by celestialthemes.tumblr.com DO NOT REMOVE CREDITS-->
  558.  
  559. </body>
  560.  
  561. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement