Juan_Melo

Theme 04 by: locomtor

Sep 6th, 2013
211
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.95 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head><title>{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  7.  
  8. <head>
  9. <meta name="color:hover" content="#454545">
  10. <meta name="color:background" content="#ffffff" />
  11. <meta name="color:sidebar" content="#ffffff" />
  12. <meta name="color:scrollbar" content="#dfdfdf" />
  13. <meta name="color:text" content="#9b9b9b" />
  14. <meta name="color:title" content="#9b9b9b" />
  15. <meta name="color:link" content="#9b9b9b" />
  16. <meta name="color:nav" content="#575656" />
  17. <meta name="image:sidebar" content=""/>
  18.  
  19.  
  20. <meta name="text:link 1" content="Link 2"/>
  21. <meta name="text:link 1 url" content="/"/>
  22. <meta name="text:link 2" content="Link 3"/>
  23. <meta name="text:link 2 url" content="/"/>
  24. <meta name="text:link 3" content="Link 4"/>
  25. <meta name="text:link 3 url" content="/"/>
  26. <meta name="text:link 4" content="Link 5"/>
  27. <meta name="text:link 4 url" content="/"/>
  28.  
  29.  
  30. <!--ASK-->
  31.  
  32. <script type="text/javascript"
  33. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  34. <script>
  35. $(document).ready(function() {
  36. //
  37. $('a.poplight[href^=#]').click(function() {
  38. var popID = $(this).attr('rel'); //Get Popup Name
  39. var popURL = $(this).attr('href'); //Get Popup href to define size
  40. var query= popURL.split('?');
  41. var dim= query[1].split('&');
  42. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  43. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://static.tumblr.com/iddq6cw/Atplvofrt/tooltip-closebutton.png" class="btn_close" title="Close" alt="Close" /></a>');
  44. var popMargTop = ($('#' + popID).height() + 80) / 2;
  45. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  46. //Apply Margin to Popup
  47. $('#' + popID).css({
  48. 'margin-top' : -popMargTop,
  49. 'margin-left' : -popMargLeft
  50. });
  51. $('body').append('<div id="fade"></div>');
  52. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  53. return false;
  54. });
  55. $('a.close, #fade').live('click', function() {
  56. $('#fade , .popup_block').fadeOut(function() {
  57. $('#fade, a.close').remove(); //fade them both out
  58. });
  59. return false;
  60. });
  61. });
  62. </script>
  63.  
  64.  
  65. <style type="text/css">
  66.  
  67.  
  68. a {
  69. text-decoration:none;
  70. outline:none;
  71. -moz-outline-style:none;
  72. color:#9e9e9e;
  73. -moz-transition-duration:0.5s;
  74. -webkit-transition-duration:0.5s;
  75. -o-transition-duration:0.5s;
  76. }
  77.  
  78. a:hover {
  79. text-decoration:none;
  80. outline:none;
  81. -moz-outline-style:none;
  82. color:#eeeeee;
  83. }
  84.  
  85. ::-webkit-scrollbar {width: 5px; height:5px; background:{color:background};}
  86. ::-webkit-scrollbar-corner {background:{color:scrollbar};}
  87. ::-webkit-scrollbar-thumb:vertical {background:{color:scrollbar};}
  88. ::-webkit-scrollbar-thumb:horizontal {background:{color:scrollbar};}
  89.  
  90.  
  91. body {
  92. color:#999999;
  93. text-transform:none;
  94. background-color:{color:background};
  95. font-family:trebuchet ms;
  96. font-size:8px;
  97. line-height:100%;
  98. font-style:none;
  99. font-weight:normal;
  100. }
  101.  
  102.  
  103.  
  104.  
  105. #qTip {
  106. font-family:trebuchet ms;
  107. display: none;
  108. text-align:left;
  109. position:absolute;
  110. letter-spacing:1px;
  111. text-transform:uppercase;
  112. font-weight:normal;
  113. z-index:99;
  114. font-size:7px;
  115. padding:1px 4px;
  116. line-height:13px;
  117. color:#828282;
  118. background:#ffffff;
  119. border: 1px solid #e8e8e8;
  120. border-radius:2px;
  121. }
  122.  
  123.  
  124. h1 {
  125. font-weight:normal;
  126. font-size:10px;
  127. text-align:center;
  128. font-style:normal;
  129. line-height:80%;
  130. letter-spacing:1px;
  131. text-transform:uppercase;
  132. color:{color:text};
  133. }
  134.  
  135. h2 {
  136. font-size:15px;
  137. text-align:center;
  138. line-height:100%;
  139. letter-spacing:-0.5px;
  140. color:{color:text};
  141. font-weight:normal;
  142. padding:5px;
  143. padding-bottom:2px;
  144. }
  145.  
  146. h3 {
  147. font-family:trebuchet ms;
  148. border-left:3px solid #999;
  149. padding:8px;
  150. background-color:#fafafa;
  151. font-size:10px;
  152. text-transform:none;
  153. font-weight:normal;
  154. }
  155.  
  156.  
  157. blockquote {
  158. font-family:trebuchet ms;
  159. border-left:2px solid #e6cec8;
  160. padding-left:5px;
  161. margin:5px;
  162. color:{color:text};
  163. }
  164.  
  165.  
  166. #theme {
  167. width:700px;
  168. margin: 0 auto -12px -12px;
  169. text-align: center;
  170. }
  171.  
  172. #sidebar {
  173. color:#838383;
  174. position:fixed;
  175. width:90px;
  176. height:auto;
  177. margin-top:-40px;
  178. margin-left:200px;
  179. text-align:left;
  180. height:100%;
  181. border-right: 1px solid #e3e3e3;
  182. padding-right:40px;
  183.  
  184. }
  185.  
  186. #sidebar img {
  187. padding:4px;
  188. width:70px;
  189. height:auto;
  190. margin-top:200px;
  191. margin-left:15px;
  192. border:1px solid; border-color: #eee;
  193. }
  194. .popup_block{
  195. display: none;
  196. background: #fff;
  197. background-image: url();
  198. padding: 10px;
  199. font-family: caimbra;
  200.  
  201. float: left;
  202. font-size: 9px;
  203. position: fixed;
  204. top: 50%; left: 57%;
  205. z-index: 999999999999;
  206. border: 1px solid #333333;
  207. -moz-box-shadow: 0 0 5px #CFCFCF;
  208. -webkit-box-shadow: 0 0 5px #CFCFCF;
  209. -webkit-border: 10px;
  210. -moz-border: 10px;
  211. border: 10px;
  212. }
  213. img.btn_close {
  214. float: right;
  215. margin: -25px -25px 0 0;
  216. }
  217. *html .popup_block {
  218. position: absolute;
  219. }
  220.  
  221. .desc {
  222. padding:30px;
  223. margin-left:-40px;
  224. margin-top:-10px;
  225. width:130px;
  226. text-align:justify;
  227. font-size:9px;
  228. font-family:cambria;
  229. font-style:normal;
  230. letter-spacing:0px;
  231. line-height:150%;
  232. color:{color:text};
  233. }
  234.  
  235. .desc a {
  236. color:{color:link};
  237. }
  238.  
  239. .desc:first-letter {
  240. font-family:cambria;
  241. font-size:14px;
  242. font-style:NORMAL;
  243. text-transform:uppercase;
  244. padding:5px 13px 5px 13px;
  245. border:3px double;
  246.  
  247. float:left;
  248. line-height:150%;
  249. margin-right:1px;
  250. margin-top:1px;
  251. color:#ffffff;
  252. background-color:{color:hover};
  253. }
  254.  
  255.  
  256. .pagination {
  257. position:fixed;
  258. padding:10px;
  259. width:80px;
  260. text-align:center;
  261. margin-top:100px;
  262. border-top: 1px solid #e8e8e8;
  263. margin-left:20px;
  264. font-family:trebuchet ms;
  265. font-size:7px;
  266. letter-spacing:4px;
  267. text-transform:uppercase;
  268. font-style:normal;
  269. z-index:100;
  270. }
  271.  
  272. .pagination a {
  273. color:#999999;
  274. }
  275.  
  276.  
  277.  
  278.  
  279.  
  280.  
  281.  
  282. #links {
  283. position:fixed;
  284. font-family:cambria;
  285. width:350px;
  286. background-color:#eee;
  287. margin-top:1px;
  288. margin-left:490px;
  289. font-size:8px;
  290. text-transform:uppercase;
  291. text-align:center;
  292. border-bottom:2px solid {color:#fff};
  293. padding-left:100px;
  294. padding-right:55px;
  295. padding-top:0px;
  296. padding-bottom:1px;
  297. line-height:100%;
  298. }
  299.  
  300. #links a{
  301. line-height:400%;
  302. margin-top:2px;
  303. word-spacing:1px;
  304. letter-spacing:1px;
  305. padding-right:10px;
  306. margin-left:9px;
  307. margin-right:17px;
  308. color:{color:link};
  309. text-decoration:none;
  310. -moz-transition-duration:.2s;
  311. -webkit-transition-duration:.2s;
  312. -o-transition-duration:.2s;
  313. }
  314.  
  315. #links a:hover {
  316. text-decoration:underline;
  317. color: {color:link hover};
  318. -moz-transition-duration:0.2s;
  319. -webkit-transition-duration:0.2s;
  320. -o-transition-duration:0.2s;
  321. }
  322.  
  323.  
  324. #container {
  325. float:left;
  326. margin-left:480px;
  327. margin-top:35px;
  328. text-align:justify;
  329. background-color:{color:background};
  330. color:{color:text};
  331. margin-bottom: 35px;
  332. }
  333.  
  334.  
  335. #post {
  336. width:500px;
  337. margin-top:15px;
  338. text-align:justify;
  339. padding:10px;
  340. margin-bottom:20px;
  341. font-size:9px;
  342. line-height:90%;
  343. letter-spacing:0px;
  344. color:{color:text};
  345. background-color:{color:post};
  346. }
  347.  
  348.  
  349. #post:hover .musicplayer{
  350. opacity:1;
  351. -webkit-transition: all 0.7s ease-in-out;
  352. -moz-transition: all 0.7s ease-in-out;
  353. -o-transition: all 0.7s ease-in-out;
  354. }
  355.  
  356.  
  357. .caption {
  358. width:500px;
  359. text-align:justify;
  360. line-height:120%;
  361. }
  362.  
  363. .question {
  364. padding:10px;
  365. text-align:justify;
  366. font-style:italic;
  367. background-color:{color:ask};
  368. }
  369.  
  370. .asker {
  371. font-size:8px;
  372. font-weight:bold;
  373. text-transform:uppercase;
  374. text-align:right;
  375. margin-right:10px;
  376. margin-top:-2px;
  377. font-family:calibri;
  378. }
  379.  
  380. .musicplayer{
  381. background-color:#fff;
  382. padding: 38px 38px 35px 35px;
  383. position:absolute;
  384. opacity:0;
  385. filter:alpha(opacity=70);
  386. width:27px;
  387. height:27px;
  388. overflow:hidden;
  389. position:absolute;
  390. z-index:2;
  391. -webkit-transition: all 0.7s ease-in-out;
  392. -moz-transition: all 0.7s ease-in-out;
  393. -o-transition: all 0.7s ease-in-out;
  394. }
  395.  
  396.  
  397. .audio{
  398. position:absolute;
  399. width:40px;
  400. height:40px;
  401. }
  402.  
  403. .audioimg{
  404. width:100px;
  405. height:100px;
  406. position:absolute;
  407. }
  408.  
  409. .audioimg img{
  410. float:left;
  411. opacity:1;
  412. width:100px;
  413. }
  414.  
  415. .audioinfo{
  416. font-size:13px;
  417. font-style:italic;
  418. font-family:'playfair display';
  419. color:#9a9a9a;
  420. margin-bottom: 1px;
  421. margin-left:101px;
  422. height:65px;
  423. display:block;
  424. width:399px;
  425. text-align:center;
  426. background-color:#fafafa;
  427. padding-top:35px;
  428. }
  429.  
  430. .note {
  431. text-transform:uppercase;
  432. font-style:normal;
  433. letter-spacing:0px;
  434. font-size: 9px;
  435. text-align:left;
  436. line-height:90%;
  437. margin-left:-40px;
  438. }
  439.  
  440. .note li {
  441. list-style-type:none;
  442. font-size:7px;
  443. border-bottom:1px solid {color:border};
  444. padding:10px 25px 10px 25px;
  445. text-align:left;
  446. margin:0px;
  447. -moz-transition-duration:0.5s;
  448. -webkit-transition-duration:0.5s;
  449. -o-transition-duration:0.5s;
  450.  
  451. }
  452.  
  453.  
  454.  
  455. .tagS {
  456. font-style:normal;
  457. width:500px;
  458. color:{color:tags};
  459. text-transform:uppercase;
  460. font-style:normal;
  461. letter-spacing:1px;
  462. font-size:7px;
  463. line-height:100%;
  464. text-align:right;
  465. padding:1px;
  466. -moz-transition-duration:0.5s;
  467. -webkit-transition-duration:0.5s;
  468. -o-transition-duration:0.5s;
  469. }
  470.  
  471. .tagS a{
  472. display:inline;
  473. background-color:{color:tags};
  474. padding:-3px;
  475. text-align:left;}
  476.  
  477. .tagS a:hover {
  478. color:#000;
  479. }
  480.  
  481.  
  482.  
  483. .bottomline {
  484. margin-top:10px;
  485. padding:5px;
  486. border-top:1px solid #f1f1f1;
  487. }
  488.  
  489. .doubleline {
  490. padding-top:5px;
  491. border-bottom:3px double #f1f1f1;
  492. }
  493.  
  494. .date {
  495. text-transform:none;
  496. font-family:trebuchet ms;
  497. font-size:10px;
  498. color:#fff;
  499. padding:5px 10px 5px 10px;
  500. background:{color:hover}; }
  501.  
  502. .box, .box a {
  503. font-family:trebuchet ms;
  504. text-transform:uppercase;
  505. font-size:7px;
  506. margin-top:9px;
  507. margin-bottom:-3px;}
  508.  
  509. .chat {
  510. font-size:8px;
  511. line-height:12px;
  512. text-transform:uppercase;
  513. list-style:none
  514. font-family:calibri;
  515. }
  516. .chat ul {
  517. line-height:15px;
  518. list-style:none;
  519. padding:0px;
  520. line-height:20px;
  521. }
  522. .person1 {
  523. background-color:{color:chat};
  524. padding-left:6px;
  525. padding-right:6px;
  526. font-family:calibri;
  527. }
  528. .person1 .label {
  529. font-weight:bold;
  530. font-family:calibri;
  531. }
  532. .person2 {
  533. background-color:{color:entries};
  534. padding-left:6px;
  535. padding-right:6px;
  536. font-family:calibri;}
  537. .person2 .label {
  538. font-weight:bold;
  539. font-family:calibri;
  540. }
  541. .person3 {
  542. background-color:{color:chat};
  543. padding-left:6px;
  544. padding-right:6px;
  545. font-family:calibri; }
  546. .person3 .label {
  547. font-weight:bold;
  548. font-family:calibri;
  549. }
  550. .person4 {
  551. background-color:{color:entries};
  552. padding-left:6px;
  553. padding-right:6px;
  554. font-family:calibri;
  555. }
  556. .person4 .label {
  557. font-weight:bold;
  558. font-family:calibri;
  559. }
  560. .person5 {
  561. background-color:{color:chat};
  562. padding-left:6px;
  563. padding-right:6px;
  564. font-family:calibri;
  565. }
  566. .person5 .label {
  567. font-weight:bold;
  568. font-family:calibri;
  569. }
  570. .person6 {
  571. background-color:{color:entries};
  572. padding-left:6px;
  573. padding-right:6px;
  574. }
  575. .person6 .label {
  576. font-weight:bold;
  577. }
  578. #credit{position:fixed; bottom:10px; right:10px; font-size:9px; font-family:calibri;color:{color:text}; text-transform:uppercase;letter-spacing: 0px; font-style:normal;}
  579.  
  580. #cred a {
  581. padding:3px;
  582. -moz-transition-duration:0.5s;
  583. -webkit-transition-duration:0.5s;
  584. -o-transition-duration:0.5s;
  585. color:{color:text};
  586. }
  587.  
  588.  
  589. {CustomCSS}</style></head><body>
  590. <div id="sidebar">
  591. <div id="sidebarimg"><a href="/"><img src="{image:sidebar}"></a></div>
  592. <div class="desc">
  593. {Description}
  594. <br><br>
  595. <div class="pagination">
  596. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">←</a>
  597. {/block:PreviousPage}{block:JumpPagination length="4"}
  598. {block:CurrentPage}<span class="current_page" style="color:#aaaaaa;">{PageNumber}</span>{/block:CurrentPage}{block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}
  599. {/block:JumpPagination}{block:NextPage}<a href="{NextPage}">→</a>
  600. {/block:NextPage}</div>{/block:Pagination}
  601.  
  602. </div>
  603. </div></div>
  604.  
  605.  
  606. <div class="links">
  607.  
  608. <div id="links">
  609. <a href="#?w=500" rel="02" class="poplight">ask</a>
  610. <a href="{text:link 1 url}">{text:link 1}</a>
  611. <a href="{text:link 2 url}">{text:link 2}</a>
  612. <a href="{text:link 3 url}">{text:link 3}</a>
  613. <a href="{text:link 4 url}">{text:link 4}</a>
  614. </div>
  615.  
  616. <div id="container">
  617. {block:Posts}
  618.  
  619. <div id="post">
  620. {block:Text}{block:Title}<h2>{Title}</h2>{/block:Title}{Body}{/block:Text}
  621.  
  622. {block:Quote}<h2>“{Quote}”</h2><h1>{Source}</h1>{/block:Quote}
  623.  
  624. {block:Link}<a href="{URL}"><h2>{Name}</h2></a>
  625. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  626.  
  627. {block:ContentSource}
  628. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  629. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  630. {/block:SourceLogo}
  631. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  632. {/block:ContentSource}
  633.  
  634. {block:Photo}
  635. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}<br>{block:Caption}<h3>{Caption}</h3>{/block:Caption}
  636. {/block:Photo}
  637.  
  638. {block:Photoset}
  639. {Photoset-500}{block:Caption}<h3>{Caption}</h3>{/block:Caption}
  640. {/block:Photoset}
  641.  
  642.  
  643.  
  644. {block:Chat}
  645. {block:Title}<a href="{Permalink}"><h1>{Title}</h1></a>{/block:Title}
  646. <div class="chat"><ul>{block:Lines}
  647. <li class="person{UserNumber}">{block:Label}
  648. <span class="label"><u>{Label}</u></span>{/block:Label} {Line}</li>{/block:Lines}</ul></div>
  649. {/block:Chat}
  650.  
  651.  
  652. {block:Video}{Video-500}{block:Caption}<h3>{Caption}</h3>{/block:Caption}{/block:Video}
  653.  
  654. {block:Answer}<div class="question">{Question}</div><div class="asker"><span style="font-size:20px;color:{color:ask};">◥</span> {Asker}</div>{Answer}{/block:Answer}
  655.  
  656. {block:Audio}
  657. <div class="audio"><div class="musicplayer">{AudioPlayer}</div>
  658. <div class="audioimg"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>{block:AlbumArt}<div class="audioimg"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  659. <div class="audioinfo">{block:TrackName}{TrackName}{/block:TrackName}<br>
  660. <div style="font-size:8px;font-family:calibri;letter-spacing:1px;margin-top:5px;text-transform:uppercase;font-style:normal;">{block:Artist}{Artist}{/block:Artist}{block:Album} - {Album}{/block:Album}</div></div>
  661. {block:Caption}<div class="postbody">{Caption}</div>{/block:Caption}{/block:Audio}
  662.  
  663. <div class="doubleline"> </div>{block:Date}
  664. <div class="box"><span class="date"><a href="{Permalink}">{TimeAgo}</a></span> &nbsp;&nbsp;<a href="{ReblogURL}" target="_blank"> reblog</a> &emsp; at {24Hour}:{Minutes} &nbsp;&nbsp; {block:NoteCount}<a href="{Permalink}"><font color="fc0707">&hearts;</font></span> {NoteCount} NOTES</a> {/block:NoteCount}{block:RebloggedFrom}&nbsp; &nbsp;via <a href="{ReblogParentURL}">{ReblogParentName}</a> &nbsp; © <a href="{ReblogRootURL}">{ReblogRootName}</a> {/block:RebloggedFrom}</div>
  665. {/block:Date}
  666.  
  667. <div class="bottomline"></div><div class="tagS">{block:HasTags}<span style="text-transform:uppercase;font-size:7px;color:{color:text}">tagged as:</span> {block:Tags} <a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}{/block:HasTags}</div></div>
  668.  
  669. {/block:Posts}
  670.  
  671. <div class="note">
  672. {block:PostNotes}{PostNotes}{/block:PostNotes}
  673. </div>
  674. </div>
  675. {/block:Posts}
  676.  
  677. <div id="credit"><a href="http://locomoto-r.tumblr.com/">©LOCOMOTO-R</a></div>
  678.  
  679.  
  680.  
  681. </body>
  682.  
  683.  
  684.  
  685. </div>
  686. </div>
  687. </div>
  688. </div>
  689. </body>
  690.  
  691. <div id="02" class="popup_block">
  692. <Center><font size="5" color="#1C1C1C"></font><iframe frameborder="0" scrolling="yes" width="100%" height="150" src="http://www.tumblr.com/ask_form/locomtor04.tumblr.com/" style="background-color:transparent; overflow:hidden;" id="ask_form">
  693. </center></div>
  694. </html>
Advertisement
Add Comment
Please, Sign In to add comment