API tools faq
paste
thehiddenwill-themes

Theme 6. (two columned)

thehiddenwill-themes
May 29th, 2013
571
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.41 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <!-----------------------------------------------------------------------
  4.  
  5. THEME 06. V2
  6. @the-hidden-will.tumblr.com
  7.  
  8. ------------------------------------------------------------------------->
  9. <html xmlns="http://www.w3.org/1999/xhtml">
  10. <head>
  11. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  12. <title>{Title}{block:PostTitle} - {PostTitle}{/block:PostTitle}</title>
  13. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. <meta name="if:Show Title" content="1"/>
  17. <meta name="if:Show Tags" content="0"/>
  18. <meta name="if:Show Captions" content="0"/>
  19. <meta name="if:Show Tags" content="0"/>
  20. <meta name="image:Background" content=""/>
  21. <meta name="image:Sidebar" content=""/>
  22. <script type="text/javascript" src="http://static.tumblr.com/uiqhh9x/jkEm9tb4p/jquery-1.8.1.min.js"></script>
  23. <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/cpaytv3/2V1m9r58l/reset.css">
  24. <script type="text/javascript" src="http://static.tumblr.com/tpqedpr/vnzmibpqr/minified.js"></script>
  25. <style type="text/css">
  26.  
  27.  
  28.  
  29. ::-webkit-scrollbar {background-color:#fff; height:8px; width:4px}
  30. ::-webkit-scrollbar-thumb:vertical {background-color:#000; height:50px}
  31. ::-webkit-scrollbar-thumb:horizontal {background-color:#000; height:8px!important}
  32.  
  33. .photo {
  34. filter: url("data:image/svg+xml;utf8,<svg xmlns=’http://www.w3.org/2000/svg’><filter id=’grayscale’><feColorMatrix type=’matrix’ values=’0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0’/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  35. filter: gray; /* IE6-9 */
  36. -webkit-filter: grayscale(1);
  37. -webkit-transition: all 0.5s ease-in-out;
  38. -moz-transition: all 0.5s ease-in-out;
  39. -o-transition: all 0.5s ease-in-out;
  40. -ms-transition: all 0.5s ease-in-out;
  41. transition: all 0.5s ease-in-out;
  42. }
  43.  
  44. .photo:hover{
  45. filter: none;
  46. -webkit-filter: grayscale(0.7);
  47. -webkit-transition: all 0.7s ease-in-out;
  48. -moz-transition: all 0.7s ease-in-out;
  49. -o-transition: all 0.7s ease-in-out;
  50. }
  51.  
  52.  
  53. iframe.photoset{
  54. max-width:180px!important;
  55. }
  56.  
  57. iframe#tumblr_controls {position: fixed !important;z-index: 9999;opacity:1;-webkit-filter: invert(100%);-webkit-transition:opacity 0.4s linear;-webkit-transition:all 0.4s linear; -moz-transition:all 0.4s linear; transition:all 0.4s linear}
  58. iframe#tumblr_controls:hover {opacity:1;-webkit-transition:opacity 0.4s linear;-webkit-transition:all 0.4s linear; -moz-transition:all 0.4s linear; transition:all 0.4s linear}
  59.  
  60. :-moz-selection {
  61. background: #eee;
  62. color: #000;
  63. }
  64.  
  65. ::selection {
  66. background: #eee;
  67. color: #000;
  68. }
  69.  
  70. body {
  71. color: #000000;background: #ffffff url({image:Background});
  72. font-family: consolas;
  73. font-size: 8px;
  74. line-height: 1.5em;
  75. }
  76.  
  77. p {margin:0 0 .75em 0} p:last-child {margin:0}
  78.  
  79.  
  80. a {
  81. cursor:help;
  82. color: #000;
  83. text-decoration:none;
  84. }
  85.  
  86.  
  87. a:hover {color: #000;
  88. }
  89.  
  90.  
  91. blockquote {quotes: "" "" "'" "'"; margin: 0.75em 0 .75em .75em;padding-left: 1.5em;
  92. line-height: 100%;border-left: solid 4px #eee;
  93. }
  94.  
  95. h1 {
  96. font-family: default;
  97. text-transform:uppercase;
  98. font-size: 8px;
  99. line-height: 1.5em;font-weight: normal;
  100. }
  101.  
  102.  
  103. ul {
  104. margin: 0px 1.5em .75em;
  105. }
  106.  
  107.  
  108. li {
  109. margin: .75em 0;
  110. list-style-type: hiragana;
  111. }
  112.  
  113. .box img {
  114. display: block;
  115. max-width: 100%;}
  116.  
  117. .m-i {
  118. display: block;
  119. line-height: 1px!important;
  120. }
  121.  
  122. .menu-picture {
  123. line-height: 100%;
  124. display: inline-block;
  125. line-height: 0px!important;
  126. }
  127.  
  128. .post-link{
  129. font-family: consolas;
  130. font-size: 8px;
  131. line-height: 8px;
  132. }
  133.  
  134. p.source{text-align: center;}
  135.  
  136. .menu-picture {
  137. line-height: 100%;display: inline-block;
  138. }
  139.  
  140. p.source{text-align: center;}
  141.  
  142.  
  143. h3 {
  144. font-size: 8px; font-weight: normal; text-transform:uppercase;
  145. }
  146.  
  147. .tagged { text-align: center; line-height: 8px;font-size: 8px;}
  148.  
  149. .text { padding: 10px;}
  150.  
  151.  
  152. p.question {
  153. margin-bottom: .375em;
  154. }
  155.  
  156. p.words {
  157. padding: 6px;
  158. line-height: 1.5em;
  159. color: #333333;
  160. background: #ffffff;
  161. }
  162.  
  163. .response {
  164. background: #fafafa;
  165. padding: 5px;
  166. margin-bottom: .75em;
  167. }
  168.  
  169. .answer {
  170. text-align: center;
  171. }
  172.  
  173.  
  174. .post {
  175. position: relative;
  176. {block:IndexPage}
  177. width:180px;
  178. {/block:IndexPage}
  179. {block:PermalinkPage}
  180. width:400px;
  181. {/block:PermalinkPage}
  182. float:left;
  183.  
  184. background: transparent
  185. padding:5px;
  186. margin:20px;
  187. }
  188.  
  189. .box {position: relative;}
  190.  
  191. #side {
  192. text-align: center;
  193. margin-top: 50px;
  194. width:95px;
  195. margin-bottom:10%;
  196. margin-left:-265px;
  197. padding:5px;
  198. position: fixed;
  199. background: #000;
  200. }
  201.  
  202. #description {
  203. font-family:cambria;
  204. font-size:7px;
  205. letter-spacing:1px;
  206. font-style:italic;
  207. color:#fff;
  208. margin-top:15px;
  209. width:120px;
  210. margin-left:-15px;
  211.  
  212. }
  213.  
  214. #side img {
  215. opacity:1;
  216. border: 1px solid #191919;
  217. padding:10px;
  218. max-width: 100px;
  219. margin-left:-15px;
  220. }
  221.  
  222. #description a {
  223. color: #fff;
  224. text-decoration: none;
  225. }
  226.  
  227.  
  228. ul {margin-bottom: .75em;}
  229.  
  230.  
  231. #contain {
  232. width:456px;
  233. margin: 30px auto 0;
  234.  
  235. }
  236.  
  237.  
  238. #contain {
  239. width:456px;
  240. margin: 0px auto 0;
  241. margin-left:325px;
  242. margin-bottom:30px;
  243. }
  244.  
  245.  
  246. #musicart {
  247. position: absolute;
  248. height: 40px;
  249. width: 40px;
  250. }
  251.  
  252. #musicart img {
  253. height: 40px;
  254. width: 40px;
  255. -moz-border-radius: 35px;
  256. -webkit-border-radius: 35px;
  257. border-radius: 35px;
  258. }
  259.  
  260. #player {
  261.  
  262. opacity: 1;
  263. -webkit-transition: all 0.6s ease-in-out;
  264. -moz-transition: all 0.6s ease-in-out;
  265. -o-transition: all 0.6s ease-in-out;
  266. }
  267.  
  268. #entry:hover #player {
  269. opacity: 1;
  270. }
  271.  
  272.  
  273.  
  274.  
  275. #infscr-loading{position:absolute!important;width:16px!important;height:11px!important;margin-bottom:-16px!important;top:auto!important;bottom:0;left:50%!important}.perma-a { text-align: right; text-transform: uppercase; }p.menu-m {margin: .375em;} .menu-link {margin: 0 3px;}.text img {max-width: 100%;}img {display: block;}.box img {display: block;}
  276. .post-info-data{text-align:center}.notes img{display:block;float:left;margin-right:.75em}ol.notes li{margin:.375em 0;list-style-type:none;line-height:16px}
  277.  
  278. #s-m-t-tooltip {
  279. z-index:9999;
  280. background:#000;
  281. line-height:11px;
  282. font:8px consolas;
  283. letter-spacing:1px;
  284. color:#fff;
  285. max-width:150px;
  286. word-wrap:break-word;
  287. padding:1px 3px 1px 3px;
  288. display:block;
  289. margin:25px 0 0 15px;
  290. -webkit-border-radius: 50px;
  291. -moz-border-radius: 50px;
  292. border-radius: 50px;
  293. }
  294.  
  295. #border {
  296. position: fixed;
  297. top: -50px;
  298. margin-left: 295px;
  299. }
  300.  
  301. #bottom {
  302. height:18px;
  303. width: 100%;
  304. position:fixed;bottom:-2px;
  305. left: 0px;
  306. opacity:1;
  307. background-color:#000;
  308. z-index:9;
  309. }
  310.  
  311. #bottom3 {
  312. height:12px;
  313. width: 100%;
  314. position:fixed;bottom:19px;
  315. left: 0px;
  316. opacity:1;
  317. background-color:#000000;
  318. z-index:9;
  319. }
  320.  
  321. #pagi{
  322. margin-right:-20px;
  323. font-family:cambria;
  324. font-size:7px;
  325. font-style:italic;
  326. letter-spacing:3px;
  327. text-transform:lowercase;
  328. color:#fff;
  329.  
  330. }
  331.  
  332. #pagi a{
  333. color:#fff;
  334. }
  335.  
  336.  
  337. #cred{
  338. position:fixed;
  339. bottom:35px;
  340. right:5px;
  341. width:10px;
  342. height:10px;}
  343.  
  344. #cred a{
  345. color:#aaa;
  346. font: 8px consolas;
  347. text-align:center;
  348. padding:3px;
  349. display:block;
  350. text-transform:uppercase;
  351. text-decoration:none;}
  352.  
  353. </style>
  354. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  355. <script>
  356. (function($){
  357. $(document).ready(function(){
  358. $("[title]").style_my_tooltips();
  359. });
  360. })(jQuery);
  361. </script>
  362.  
  363.  
  364. </head>
  365. <body>
  366.  
  367. <div id="cred"><a title="credit" href="http://thehiddenwill-themes.tumblr.com">C</a></div>
  368.  
  369. <a style="position:fixed; margin-left:0px; border:124px solid #000000; top:-1px; bottom:-1px; left:0px;"></a>
  370.  
  371. <div id="border">
  372. <div style="width:px;height:2000px;border:2px solid #000; "></div></div>
  373.  
  374. <a style="position:fixed; margin-left: 260px; border:15px solid #000000; top:-1px; bottom:-1px; left:0px;"></a>
  375.  
  376. <a style="position:fixed; margin-left: 800px; border:15px solid #000000; top:-1px; bottom:-1px; left:0px;"></a>
  377.  
  378.  
  379. <div id="bottom"></div>
  380. <div id="bottom2"></div>
  381. <div id="bottom3"></div>
  382. <div id="bottom4"></div>
  383. <div id="bottom5"></div>
  384.  
  385. <div id="contain" class="clearfix">
  386. <div id="side">
  387. <div class="text">
  388. {block:IfShowTitle}<h1><a href="/">{Title}</a></h1>{/block:IfShowTitle}<a href="/" class="m-i"><img class="menu-picture" src="{image:sidebar}"/></a><div id="description">{Description}</div>
  389. {block:Pagination}<div id="pagi"><p class="previous-next text">{block:PreviousPage}<a href="{PreviousPage}" class="next"><</a>{/block:PreviousPage}<span id="pages"> {CurrentPage} of {TotalPages} </span>{block:NextPage}<a href="{NextPage}" class="previous">></a>{/block:NextPage}</p></div>{/block:Pagination}
  390.  
  391. </div>
  392. </div>
  393. <div id="content">
  394. {block:Posts}
  395. <div class="post">
  396.  
  397. {block:Text}
  398. <div class="text">
  399. {block:Title}<h3>{Title}</h3>{/block:Title}
  400. {Body}
  401. <!-- permalink --> {block:IndexPage}
  402. <p class="post-link perma-a">{timeago} with <a href="{Permalink}">{NoteCountWithLabel}</a></p>
  403. <!-- /permalink --> {/block:IndexPage}
  404. </div>
  405. {/block:Text}
  406.  
  407. {block:Quote}
  408. <div style="color: #000; font-size: 20px; line-height: 30px; float: left; font-family: consolas;">
  409. ❝</div>
  410. <div style="font-size:12px; letter-spacing: 1px; line-height:120%; font-family: georgia; font-style: italic; margin-left: 30px; padding-left: 10px;">
  411. {Quote}
  412. </div>
  413. {block:Source}
  414. <div style="text-align: right; margin-top: 10px; font-size: 8px; text-transform: lowercase; font-family: consolas; line-height: 10px; letter-spacing: 1px;"> {Source}</div>
  415. {/block:Source}
  416.  
  417.  
  418.  
  419. <!-- permalink --> {block:IndexPage}
  420. <p><p class="post-link perma-a">{timeago} . <a href="{Permalink}">{NoteCountWithLabel}</a> . <a href={ReblogURL} target="_blank" class="details">スキ?</a></p></p>
  421. <!-- /permalink --> {/block:IndexPage}
  422. {/block:Quote}
  423.  
  424. {block:Link}
  425. <div class="text link">
  426. <h3><a href="{URL}" {Target}>{Name}</a></h3>
  427. {block:Description}{Description}{/block:Description}
  428. <!-- permalink --> {block:IndexPage}
  429. <p class="post-link perma-a">{timeago} with <a href="{Permalink}">{NoteCountWithLabel}</a></p>
  430. <!-- /permalink --> {/block:IndexPage}
  431. </div>
  432. {/block:Link}
  433.  
  434. {block:Chat}
  435. <div class="text chat">
  436. <ul class="conversation">
  437. {block:Lines}
  438. <li class="line {Alt}">
  439. {block:Label}<span class="person">{Label}</span>{/block:Label}
  440. <span class="person-said">{Line}</span>
  441. </li>
  442. {/block:Lines}
  443. </ul>
  444. <!-- permalink --> {block:IndexPage}
  445. <p class="post-link perma-a">{timeago} with <a href="{Permalink}">{NoteCountWithLabel}</a></p>
  446. <!-- /permalink --> {/block:IndexPage}
  447. </div>
  448. {/block:Chat}
  449.  
  450. {block:Audio}
  451.  
  452. <div id="musicart">
  453. {block:AlbumArt}
  454. <img src="{AlbumArtURL}">
  455. {/block:AlbumArt}
  456. </div>
  457.  
  458.  
  459. <div id="player"><div style="position: absolute; margin-top: -5px; margin-left: -5px; padding: 12px 11px 11px 12px; background: #FFF; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px;">
  460. <div style="width: 27px; height: 27px; overflow: hidden;">
  461. {AudioPlayerWhite}
  462. </div></div></div>
  463.  
  464. <div style="margin-left: 52px; line-height: 10px;">
  465. <b>Track:</b> {block:TrackName}{TrackName}{/block:TrackName}
  466. <br>
  467. <b>Artist:</b> {block:Artist}{Artist}{/block:Artist}<br>
  468. <b>Album:</b> {block:Album}{Album}{/block:Album}<br>
  469. {PlayCountWithLabel}<br>
  470. </div>
  471.  
  472. <!-- permalink --> {block:IndexPage}
  473. <p><p class="post-link perma-a">{timeago} . <a href="{Permalink}">{NoteCountWithLabel}</a> . <a href={ReblogURL} target="_blank" class="details">スキ?</a></p></p>
  474. <!-- /permalink --> {/block:IndexPage}
  475.  
  476. {/block:Audio}
  477.  
  478. {block:Answer}
  479. <div class="text answer">
  480. <div class="response">
  481. <p class="question">{Question}</p>
  482. <p>@{Asker}</p></div>
  483. {Answer}
  484. <!-- permalink --> {block:IndexPage}
  485. <p class="post-link perma-a">{timeago} with <a href="{Permalink}">{NoteCountWithLabel}</a></p>
  486. <!-- /permalink --> {/block:IndexPage}
  487. </div>
  488. {/block:Answer}
  489.  
  490. {block:Photoset}
  491. <div class="photoset">
  492. <div class="box">
  493. <!-- permalink --> {block:IndexPage}
  494. <p class="post-link perma-a">{timeago} . <a href="{Permalink}">{NoteCountWithLabel}</a> . <a href={ReblogURL} target="_blank" class="details">スキ?</a> </p>
  495. <!-- /permalink --> {/block:IndexPage}
  496. <center><div class="photo"{Photoset-250}</center>
  497. </div>
  498. {block:IndexPage}{block:IfShowCaptions}
  499. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  500. {/block:IfShowCaptions}{/block:IndexPage}
  501. </div>
  502. {/block:Photoset}
  503.  
  504. {block:Video}
  505. <div class="video">
  506. <div class="box">
  507. <!-- permalink --> {block:IndexPage}
  508.  
  509. <!-- /permalink --> {/block:IndexPage}
  510. {block:IndexPage}<center>{Video-250}</center>{/block:IndexPage}
  511. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  512. </div>
  513. {block:IndexPage}{block:IfShowCaptions}
  514. {block:Caption}<div class="caption text">{Caption}</div>{/block:Caption}
  515. {/block:IfShowCaptions}{/block:IndexPage}
  516. </div>
  517. {/block:Video}
  518.  
  519. {block:Photo}
  520.  
  521. {LinkOpenTag}<a href="{Permalink}"><img src="{PhotoURL-400}" width="100%"title="{NoteCountWithLabel}" <div class="photo"></a>{LinkCloseTag}
  522.  
  523. {/block:Photo}
  524.  
  525. {block:IfShowTags}{block:IndexPage}{block:HasTags}
  526. <div class="tagged"><p>{lang:Tagged}: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}</p></div>
  527. {/block:HasTags}{/block:IndexPage}{/block:IfShowTags}
  528.  
  529. {block:PermalinkPage}
  530. <div id="post-info" class="text">
  531. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  532. {block:HasTags}
  533. <p class="tagged">{lang:Tagged}: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}</p>
  534. {/block:HasTags}
  535. <p class="post-info-data">
  536. {block:Date}{12Hour}:{Minutes}:{Seconds} @ {MonthNumber}/{DayOfMonth}/{Year}<br/>{/block:Date}
  537. {block:NoteCount}{NoteCountWithLabel}<br />{/block:NoteCount}{block:RebloggedFrom}
  538. Reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br/>Posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>{block:RebloggedFrom}</p>
  539. {block:PostNotes}
  540. {PostNotes}
  541. {/block:PostNotes}
  542. </div>
  543. {/block:PermalinkPage}
  544.  
  545. </div> <!-- end single post -->
  546. {block:ContentSource}
  547. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> {/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  548. {/block:ContentSource}
  549. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  550. {/block:Posts}
  551. </div> <!-- end content -->
  552.  
  553. {block:IndexPage}
  554. <script type="text/javascript">
  555. $(window).load(function () {
  556. $('#content').masonry(),
  557. $('.masonryWrap').infinitescroll({
  558. navSelector : '#pagination',
  559. nextSelector : '#pagination a#nextPage',
  560. itemSelector : ".post, .loading",
  561. bufferPx : 40,
  562. loadingImg : "http://static.tumblr.com/uiqhh9x/38Em68qk4/loading.gif",
  563. loadingText : "<em></em>",
  564. },
  565. function() { $('#content').masonry({ appendedContent: $(this) }); }
  566. );
  567. });
  568. </script>
  569. {/block:IndexPage}
  570.  
  571. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!