Advertisement
crimical

C4 -- keep you

Mar 24th, 2015
3,612
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.75 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!-- CODE 4 BY CRIMICAL; KEEP YOU
  5.  
  6. DO NOT CLAIM AS YOUR OWN, DO NOT REMOVE CREDIT
  7. thank you for using my theme :)
  8.  
  9. -->
  10.  
  11. <title>{block:TagPage}#{Tag} &mdash;{/block:TagPage} {Title} {block:PostSummary}&mdash; {PostSummary}{/block:PostSummary}</title>
  12.  
  13. <link rel="shortcut icon" href="{Favicon}">
  14. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  15.  
  16. <!-- fonts -->
  17.  
  18. <script src="//use.edgefonts.net/yeseva-one;vidaloka;averia-serif-libre:n4,i4,n7.js"></script>
  19. <link href='http://fonts.googleapis.com/css?family=Inconsolata:400,700' rel='stylesheet' type='text/css'>
  20. <link href='https://fonts.googleapis.com/css?family=Karla:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
  21.  
  22. <!-- customizable tooltip -->
  23.  
  24. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
  25.  
  26. <script src="http://static.tumblr.com/xgofl0y/O7Fm1ufj3/jquery.style-my-tooltips.js" type="text/javascript"></script>
  27.  
  28. <script>
  29. $().ready(function() {
  30. $("[title]").style_my_tooltips({
  31. tip_follows_cursor: "on", //on/off
  32. tip_delay_time: 300 //milliseconds
  33. });
  34. });
  35. </script>
  36.  
  37. <!-- masonry -->
  38.  
  39. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  40.  
  41. <script>
  42. $(function(){
  43. var $container = $('#main');
  44. $container.imagesLoaded(function(){
  45. $container.masonry({
  46. itemSelector: '.post',
  47. });
  48. });
  49. $container.infinitescroll({
  50. itemSelector : ".post",
  51. loadingImg : "",
  52. loadingText : "<em></em>",
  53. bufferPx : 10000,
  54. extraScrollPx: 12000,
  55. },
  56. // trigger Masonry as a callback
  57. function( newElements ) {
  58. var $newElems = $( newElements ).css({ opacity: 0 });
  59. // ensure that images load before adding to masonry layout
  60. $newElems.imagesLoaded(function(){
  61. $newElems.animate({ opacity: 1 });
  62. $container.masonry( 'appended', $newElems, true );
  63. });
  64. }
  65. );
  66. });
  67. </script>
  68.  
  69.  
  70. <!-- custom -->
  71.  
  72. <meta name="color:links" content=""/>
  73. <meta name="image:image" content=""/>
  74. <meta name="image:background" content=""/>
  75.  
  76. <meta name="text:link1title" content=""/>
  77. <meta name="text:link1url" content="/"/>
  78. <meta name="text:link2title" content=""/>
  79. <meta name="text:link2url" content="/"/>
  80. <meta name="text:link3title" content=""/>
  81. <meta name="text:link3url" content="/"/>
  82.  
  83. <style type="text/css">
  84.  
  85. /* basic */
  86.  
  87. body{
  88. margin:0px;
  89. padding:0px;
  90. background-color:#f9f9f9;
  91. background-image:url('{image:background}');
  92. color:#222;
  93. font-family:'karla', arial;
  94. font-size:10px;
  95. line-height:180%;
  96. }
  97.  
  98. a{
  99. text-decoration:none;
  100. color:{color:links};
  101. -webkit-transition:0.7s ease-in-out;
  102. }
  103.  
  104. a:hover{ color:#333; }
  105.  
  106. u{ border-bottom:1px solid; text-decoration:none; }
  107.  
  108. blockquote{
  109. margin-left:20px;
  110. border-left:3px solid #f7f7f7;
  111. padding-left:17px;
  112. }
  113.  
  114. img{ display:block; max-width:100%; }
  115.  
  116. ul{ list-style-type:none; }
  117. ul li{ margin-bottom:3px; position:relative; }
  118. ul li:before{ content:'\25B8'; position:absolute; left:-20px; }
  119.  
  120. #s-m-t-tooltip{
  121. position:absolute;
  122. font-size:10px;
  123. font-family:'karla', arial;
  124. z-index:5000;
  125. background-color:white;
  126. color:#333;
  127. padding:5px 8px 4px 9px;
  128. border:1px solid #f7f7f7;
  129. }
  130.  
  131. #tumblr_controls{
  132. position:fixed !important;
  133. opacity:0.5;
  134. -webkit-transition:0.5s ease-in;
  135. -webkit-filter:invert(1);
  136. -webkit-filter:blur(3);
  137. }
  138.  
  139. #tumblr_controls:hover{ opacity:1; }
  140.  
  141. /* main */
  142.  
  143. h1{
  144. font-size:12px;
  145. text-transform:uppercase;
  146. margin:0 0 10px 0;
  147. text-align:right;
  148. }
  149.  
  150. #main{
  151. {block:indexpage} width:924px; {block:indexpage}
  152. {block:permalinkpage} width:532px; {block:permalinkpage}
  153. margin:100px auto 100px;
  154. }
  155.  
  156. .post{
  157. margin:15px;
  158. padding:15px;
  159. border:1px solid #f0f0f0;
  160. {block:indexpage} width:400px; {block:indexpage}
  161. {block:permalinkpage} width:500px; {block:permalinkpage}
  162. background:white;
  163. float:left;
  164. }
  165.  
  166. /* topbar */
  167.  
  168. .topbar{
  169. text-align:center;
  170. {block:permalinkpage} margin-bottom:50px; {/block:permalinkpage}
  171. }
  172.  
  173. .topbar img{
  174. width:150px;
  175. margin:-3px -2px 0 25px;
  176. float:right;
  177. }
  178.  
  179. .topbar h1{
  180. text-align:center;
  181. margin:3px 0 6px;
  182. }
  183.  
  184. .topbar .links{
  185. margin-top:6px;
  186. font-size:9px;
  187. text-transform:uppercase;
  188. }
  189.  
  190. .topbar .links a{
  191. display:inline-block;
  192. color:#222;
  193. margin:0 8px 0;
  194. }
  195.  
  196. .topbar .links a:hover{
  197. color:{color:links};
  198. }
  199.  
  200. .topbar .pagination{
  201. margin-top:4px;
  202. font-size:9px;
  203. text-transform:uppercase;
  204. }
  205.  
  206. .topbar .pagination a{ color:#333; }
  207.  
  208. /* posts */
  209.  
  210. .post h1.quote{
  211. margin:0 auto 0;
  212. text-align:justify;
  213. }
  214.  
  215. .post .qsource{
  216. margin-top:10px;
  217. text-align:center;
  218. }
  219.  
  220. .chat ol{
  221. line-height:120%;
  222. list-style:none;
  223. padding:0px;
  224. margin:0px;
  225. }
  226.  
  227. .chat li.line{
  228. border-top:1px solid #f3f3f3;
  229. padding:3% 0 3%;
  230. }
  231.  
  232. .chat li.line:nth-of-type(1){ border-top:0; }
  233.  
  234. .player{
  235. overflow:hidden;
  236. width:22px;
  237. }
  238.  
  239. .play{
  240. padding:37px 43px 32px 37px;
  241. margin:20px;
  242. background-color:white;
  243. opacity:0.4;
  244. position:absolute;
  245. z-index:1000;
  246. -webkit-border-radius:100px;
  247. -webkit-transition:0.7s ease-in-out;
  248. }
  249.  
  250. .play:hover{ -webkit-border-radius:2px; }
  251.  
  252. .cover{
  253. float:left;
  254. height:140px;
  255. width:140px;
  256. }
  257.  
  258. .cover img{
  259. max-width:140px;
  260. position:absolute;
  261. }
  262.  
  263. img.ask{
  264. margin:-2px 7px 0 0;
  265. padding-top:5px;
  266. height:40px;
  267. float:left;
  268. }
  269.  
  270. /* info */
  271.  
  272. .info{
  273. margin-top:15px;
  274. }
  275.  
  276. .info a{ color:#333; }
  277.  
  278. .info span.dat{
  279. font-size:8px;
  280. text-transform:uppercase;
  281. border-top:3px solid #f0f0f0;
  282. padding:5px 0 0 0;
  283. }
  284.  
  285. .info span.src{
  286. float:right;
  287. font-size:8px;
  288. text-transform:uppercase;
  289. height:11px;
  290. border-top:3px solid #f0f0f0;
  291. padding:1px 0 0 1px;
  292. margin:-3px 0 0 0;
  293. }
  294.  
  295. .tags{
  296. word-wrap:break-word;
  297. font-family:arial;
  298. font-size:8px;
  299. letter-spacing:1px;
  300. }
  301.  
  302. span.tag2{ display:none; }
  303.  
  304. a.tag + span.tag2{
  305. display:inline;
  306. margin:0 5px 0 4px;
  307. }
  308.  
  309. /* permalink */
  310.  
  311. .postnotes{
  312. margin:50px 0 0 15px;
  313. }
  314.  
  315. .postnotes ol.notes{
  316. list-style-type:none;
  317. width:500px;
  318. margin-left:-40px;
  319. text-align:center;
  320. }
  321.  
  322. .postnotes li.note{
  323. padding:2%;
  324. border-bottom:1px solid #f7f7f7;
  325. }
  326.  
  327. .postnotes li.note img.avatar{ display:none; }
  328.  
  329. .postnotes li.note .answer_content{ border-bottom:1px solid {color:links}; }
  330.  
  331. /* */
  332.  
  333. .credit{
  334. position:fixed;
  335. bottom:20px;
  336. right:20px;
  337. }
  338.  
  339. .credit a{
  340. border:1px solid #f4f4f4;
  341. padding:5px;
  342. height:10px;
  343. width:10px;
  344. text-transform:uppercase;
  345. font-size:8px;
  346. font-family:arial;
  347. color:gray;
  348. }
  349. </style>
  350. </head>
  351.  
  352. <body>
  353.  
  354. {block:ContentSource}
  355. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  356. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  357. {/block:SourceLogo}
  358. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  359. {/block:ContentSource}
  360.  
  361. <div class="credit">
  362. <a href="http://crimicalthemes.tumblr.com/">cr</a>
  363. </div>
  364.  
  365. <div id="main">
  366.  
  367. <!-- topbar -->
  368.  
  369. <div class="post topbar"> <table><tr>
  370.  
  371. <td style="min-width:{block:indexpage}250px{/block:indexpage}{block:permalinkpage}350px{/block:permalinkpage}">
  372. <h1>{title}</h1>
  373. {description}
  374. <div class="links">
  375. <a href="/ask">message</a>
  376. {block:iflink1title}<a href="{text:link1url}">{text:link1title}</a>{/block:iflink1title}
  377. {block:iflink2title}<a href="{text:link2url}">{text:link2title}</a>{/block:iflink2title}
  378. {block:iflink3title}<a href="{text:link3url}">{text:link3title}</a>{/block:iflink3title}
  379. </div>
  380. {block:pagination} <div class="pagination">
  381. {block:PreviousPage}<a style="margin-right:5px" href="{PreviousPage}">&#9666;</a>{/block:PreviousPage} {CurrentPage} / {TotalPages} {block:NextPage}<a style="margin-left:5px" href="{NextPage}">&#9656;</a>{/block:NextPage}
  382. </div> {/block:pagination}
  383. </td>
  384.  
  385. <td>
  386. <a href="/"> <img src="{image:image}" /> </a>
  387. </td>
  388.  
  389. </tr> </table> </div>
  390.  
  391. <!-- posts -->
  392.  
  393. {block:posts}
  394.  
  395. <div class="post">
  396.  
  397. {block:quote}
  398. <h1 class="quote">❝ {quote}</h1>
  399. {block:source}<div class="qsource">{source}</div>{/block:source}
  400. {/block:quote}
  401.  
  402. {block:photo}
  403. {block:indexpage} <a href="{permalink}"><img src="{PhotoURL-500}" width="400px" /></a> {/block:indexpage}
  404. {block:permalinkpage} <a href="{PhotoURL-HighRes}"><img src="{PhotoURL-500}" width="500px" /></a> {/block:permalinkpage}
  405. {caption}
  406. {/block:photo}
  407.  
  408. {block:photoset}
  409. {block:indexpage} {photoset-400} {/block:indexpage}
  410. {block:permalinkpage} {photoset-500} {/block:permalinkpage}
  411. {caption}
  412. {/block:photoset}
  413.  
  414. {block:text}
  415. {block:title}<h1>{title}</h1>{/block:title}
  416. {body}
  417. {/block:text}
  418.  
  419. {block:video}
  420. {block:indexpage} {video-400} {/block:indexpage}
  421. {block:permalinkpage} {video-500} {/block:permalinkpage}
  422. {caption}
  423. {/block:video}
  424.  
  425. {block:link}
  426. <h1><a href="{URL}">{name}</a></h1>
  427. {block:description}{description}{/block:description}
  428. {/block:link}
  429.  
  430. {block:chat}
  431. {block:title}<h1>{title}</h1>{/block:title}
  432. <div class="chat"><ol>{block:lines}
  433. <li class="line">{block:label}<b style="margin-right:8px; text-transform:uppercase;">{label}</b>{/block:label}{line}</li>
  434. {/block:lines}</ol></div>
  435. {/block:chat}
  436.  
  437. {block:Answer}
  438. <div style="min-height:45px; padding-bottom:10px; border-bottom:1px solid #f7f7f7; margin-bottom:10px; line-height:15px">
  439. <img class="ask" src="{AskerPortraitURL-40}" />
  440. <b style="margin-top:3px; text-transform:uppercase;">{Asker}</b><br>
  441. {Question}</div>
  442. {Replies}
  443. {/block:Answer}
  444.  
  445. {block:audio}
  446. <table class="aud"><tr>
  447.  
  448. <td width="{block:indexpage}260px{/block:indexpage}{block:permalinkpage}360px{/block:permalinkpage}">
  449. {block:trackname}<h1 style="text-align:center; margin:0 0 2px">{trackname}</h1>{/block:trackname}
  450. <center>{block:artist}{artist}<br>{/block:artist}
  451. {playcountwithlabel}</center>
  452. </td>
  453.  
  454. <td width="140px">
  455. <div class="play"><div class="player">{audioplayerwhite}</div></div>
  456. <div class="cover"> <img src="http://static.tumblr.com/yijh2c3/zt3n7blzj/unbenannt-5.jpg"> {block:AlbumArt} <img src="{AlbumArtURL}"> {/block:AlbumArt} </div>
  457. </td>
  458.  
  459. </tr> </table>
  460. {Caption}
  461. {/block:audio}
  462.  
  463. <!-- info -->
  464.  
  465. {block:Date} <div class="info">
  466.  
  467. <span class="dat">
  468. <a href="{permalink}" title="{Month} {DayofMonth}{DayofMonthSuffix}, {Year}&nbsp; &#9656; &nbsp;{12Hour}:{Minutes}{AmPm}">{TimeAgo}{block:NoteCount}&nbsp; &#9656; &nbsp;{NoteCountWithLabel}{/block:NoteCount}</a>
  469. </span>
  470.  
  471. {block:RebloggedFrom} <span class="src">
  472. <a href="{ReblogParentURL}" title="{ReblogParentName}">v</a>&nbsp; &#9656; &nbsp;<a href="{ReblogRootURL}" title="{ReblogRootName}">s</a>
  473. </span> {block:RebloggedFrom}
  474.  
  475. {block:HasTags} <div class="tags">
  476. {block:Tags}<span class="tag2" style="margin-left:6px"> &#9656; </span> <a class="tag" href="{TagURL}">{Tag}</a>{/block:Tags}
  477. </div> {/block:HasTags}
  478.  
  479. </div> {/block:Date}
  480.  
  481. </div>
  482.  
  483. <!-- permalink -->
  484.  
  485. {block:permalinkpage} {block:Date}
  486. {block:PostNotes}
  487. <div class="post postnotes">{PostNotes}</div>
  488. {/block:PostNotes}
  489. {/block:Date} {/block:permalinkpage}
  490.  
  491. {/block:posts}
  492.  
  493. </div>
  494. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement