API tools faq
paste
ninpen

phase 2

ninpen
Feb 16th, 2016
2,165
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.61 KB | None | 0 0
raw download clone embed print report
  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.  
  4.  
  5.  
  6.  
  7.  
  8.  
  9.  
  10.  
  11. <!-------------------------------
  12.  
  13. PHASE 2 BY NINPEN.TUMBLR.COM
  14. DO NOT REMOVE THE CREDIT.
  15.  
  16. --------------------------------->
  17.  
  18.  
  19.  
  20.  
  21.  
  22.  
  23.  
  24.  
  25. <head>
  26. <title>{Title}</title>
  27. <link rel="shortcut icon" href="{FavIcon}" />
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  29.  
  30. <meta name="if:Columns" content="" />
  31. <meta name="if:Borders" content="" />
  32. <meta name="if:Roundedges" content="" />
  33. <meta name="if:hexagonportrait" content="" />
  34.  
  35.  
  36. <meta name="text:post margins" content="40" />
  37. <meta name="text:post size" content="225" />
  38. <meta name="text:fontsize" content="11" />
  39. <meta name="text:lineheight" content="17" />
  40.  
  41. <meta name="select:font" content="open sans" title="Open Sans"/>
  42. <meta name="select:font" content="courier new" title="Courier New"/>
  43. <meta name="select:font" content="arial" title="Arial"/>
  44. <meta name="select:font" content="calibri" title="Calibri"/>
  45. <meta name="select:font" content="trebuchet ms" title="Trebuchet Ms"/>
  46.  
  47. <meta name="image:background image" content=""/>
  48. <meta name="image:portrait" content=""/>
  49.  
  50. <meta name="color:scrollbg" content="#ffffff" />
  51. <meta name="color:scrolltrack" content="#b6e5ef" />
  52. <meta name="color:thmlink" content="#cccccc"/>
  53.  
  54. <meta name="color:background" content="#f0f0f0" />
  55. <meta name="color:text" content="#aaaaaa" />
  56. <meta name="color:bold" content="#e2feaf" />
  57. <meta name="color:italic" content="#b6e5ef" />
  58. <meta name="color:underline" content="#f6f6bb" />
  59. <meta name="color:h1" content="#ffe561" />
  60. <meta name="color:h1 bg" content="#ffffff" />
  61. <meta name="color:h2" content="#bfef67" />
  62.  
  63. <meta name="color:link" content="#bbbbbb" />
  64. <meta name="color:linkhover" content="#FABFBE" />
  65.  
  66. <meta name="color:post border" content="#fafafa" />
  67. <meta name="color:datebg" content="#f0f0f0" />
  68.  
  69. <meta name="color:post bg" content="#ffffff" />
  70. <meta name="color:counter bg" content="#c8f8f8" />
  71. <meta name="color:counter" content="#54b8bb" />
  72.  
  73. <meta name="color:accent1" content="#ffe561" />
  74. <meta name="color:accent2" content="#c8f8f8" />
  75. <meta name="color:accent3" content="#fcbdbd" />
  76. <meta name="color:accent4" content="#9bff96" />
  77. <meta name="color:accent5" content="#26ffff" />
  78.  
  79. <meta name="color:tagsbg" content="#eeeeee" />
  80. <meta name="color:tagstext" content="#a0a0a0" />
  81.  
  82. <meta name="color:caption bg" content="#ffffff" />
  83. <meta name="color:question bg" content="#f1f1f1" />
  84. <meta name="color:chat line 1" content="#ffffff"/>
  85. <meta name="color:chat line 2" content="#fafafa"/>
  86.  
  87. <meta name="text:Custom Link One" content=""/>
  88. <meta name="text:Custom Link One URL" content=""/>
  89. <meta name="text:Custom Link Two" content=""/>
  90. <meta name="text:Custom Link Two URL" content=""/>
  91. <meta name="text:Custom Link Three" content=""/>
  92. <meta name="text:Custom Link Three URL" content=""/>
  93. <meta name="text:Custom Link Four" content=""/>
  94. <meta name="text:Custom Link Four URL" content=""/>
  95. <meta name="text:Custom Link Five" content=""/>
  96. <meta name="text:Custom Link Five URL" content=""/>
  97. <div class="cred"><a href="http://ninpen.tumblr.com/">thm.</a></div>
  98. <style type="text/css">
  99. @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800);
  100.  
  101. html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, a, abbr, acronym, address, big, cite,hr, code,del, dfn,img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd,ol,ul, fieldset, form, label, legend, tbody, tfoot, thead, tr, th, td, article, canvas, details, embed, figure, figcaption, footer, hgroup, menu, output, ruby, summary,time, mark, audio, video {
  102. margin: 0;
  103. padding: 0;
  104. border: 0;
  105. font-size: 100%;
  106. font: inherit;
  107. vertical-align: baseline;
  108. }
  109.  
  110. article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  111. display: block;
  112. }
  113.  
  114. body {
  115. line-height: 1;
  116. }
  117.  
  118. ul {
  119. list-style: none;
  120. }
  121.  
  122. table {
  123. border-collapse: collapse;
  124. border-spacing: 0;
  125. }
  126.  
  127. ::-webkit-scrollbar {width: 3px; height: 3px; background:{color:scrollbg}; }
  128. ::-webkit-scrollbar-thumb { background-color:{color:scrolltrack};}
  129.  
  130. body,html{
  131. width:100%;
  132. height:100%;
  133. padding:0;
  134. margin:0;
  135. }
  136.  
  137. body{
  138. word-wrap: break-word;
  139. font:{text:fontsize}px/{text:lineheight}px {select:font};
  140. color: {color:text};
  141. background:{color:Background} url() repeat right top fixed;
  142. }
  143.  
  144. a{
  145. text-decoration:none;
  146. color:{color:link};
  147. }
  148.  
  149. a:hover {
  150. color:{color:linkhover};
  151. }
  152.  
  153. b,strong{
  154. color:{color:bold};
  155. }
  156.  
  157. i,em{
  158. color:{color:italic};
  159. }
  160.  
  161. u{
  162. color:{color:underline};
  163. }
  164.  
  165. .cred{font:700 italic 8px/8px 'lato';letter-spacing:1px;position:Fixed;bottom:5%;right:5%;}
  166.  
  167. .cred a{color:{color:thmlink};}
  168. .cred a:hover{color:{color:bold};}
  169.  
  170. h1{
  171. margin:0;
  172. font:800 12px/16px 'open sans';
  173. padding:2px;
  174. background-color:{color:h1 BG};
  175. color:{color:h1};
  176. }
  177.  
  178. h1 a{color:{color:h1};}
  179.  
  180. h2{
  181. font:italic 300 26px/30px 'open sans';
  182. letter-spacing:-1px;
  183. color: {color:h2};
  184. }
  185.  
  186. .source{
  187. font:italic 7px/8px trebuchet ms;
  188. text-transform:uppercase;
  189. letter-spacing:1px;
  190. color:{color:text};
  191. }
  192.  
  193. img{
  194. max-width:100%;
  195. }
  196.  
  197. #center{
  198. width:100%;
  199. height:100%;
  200. position:relative;
  201. }
  202.  
  203. aside{
  204. width:100%;
  205. height:100%;
  206. top:0;
  207. left:0;
  208. position:fixed;
  209. z-index:99999;
  210. background:{color:Background} url()no-repeat center center;
  211. display:none;
  212. }
  213.  
  214. #desc{
  215. width:800px;
  216. height:500px;
  217. background:{color:post bg};
  218. border:1px solid {color:post border};
  219. position:Relative;
  220. transform: translateY(-50%);
  221. top: 50%;
  222. margin:0 auto;
  223. color:{color:text};
  224. }
  225.  
  226. #desc a{color:{color:link};font-size:10px;}
  227.  
  228. .portrait{
  229. width:93px;
  230. height:93px;
  231. margin-left:-3px;
  232. padding:20px;
  233. display:inline-block;
  234. border-right:1px solid {color:post border};
  235. border-bottom:1px solid {color:post border};
  236. overflow:hidden;
  237. }
  238.  
  239. .portrait img{
  240. {block:ifNothexagonportrait}
  241. width:93px;
  242. {/block:ifNothexagonportrait}
  243. {block:ifhexagonportrait}
  244. height:93px;
  245. mask-image: url(http://static.tumblr.com/hczaopr/84vo2evhn/ninpenportraitmask.png);
  246. -webkit-mask-image: url(http://static.tumblr.com/hczaopr/84vo2evhn/ninpenportraitmask.png);
  247. -webkit-mask-position: center center;
  248. mask-position: center center;
  249. -webkit-mask-repeat: no-repeat;
  250. mask-repeat: no-repeat;
  251.  
  252. {/block:ifhexagonportrait}
  253. }
  254.  
  255. #mainav{
  256. display:inline-block;
  257. background:{color:post bg};
  258. width:120px;
  259. padding:0 20px;
  260. height:100%;
  261. border-right:1px solid {color:post border};
  262. vertical-align:top;
  263. }
  264.  
  265. #mainav span{
  266. display:block;
  267. transform: translateY(-50%);
  268. top: 50%;
  269. position:relative;
  270. }
  271.  
  272. .subnav{
  273. font-size:10px;
  274. background:{color:post bg};
  275. width: 440px;
  276. height: 366px;
  277. position: absolute;
  278. top: 134px;
  279. left: 161px;
  280. }
  281.  
  282. .subnav a{
  283. display:inline-block;
  284. padding:2px 10px;
  285. margin:5px;
  286. z-index:1;
  287. letter-spacing:2px;
  288. position:relative;
  289. }
  290.  
  291. .subnav a:hover:after{opacity:1;}
  292.  
  293. .subnav a:after{
  294. z-index:-1;
  295. content:"";
  296. opacity:0;
  297. width:80%;
  298. height:5px;
  299. position:absolute;
  300. bottom:5px;
  301. left:10%;
  302. background:{color:bold};
  303. }
  304.  
  305. #mainav a{
  306. display:block;
  307. letter-spacing:2px;
  308. text-transform:lowercase;
  309. position:relative;
  310. padding:10px 0 10px 15px;
  311. }
  312.  
  313. #mainav a:hover{
  314. padding:10px 0 10px 25px;
  315. }
  316.  
  317. #mainav a:hover:before{
  318. left:10px;
  319. }
  320.  
  321. #mainav a:before{
  322. content:"";
  323. width:4px;
  324. height:5px;
  325. position:absolute;
  326. top:14px;
  327. left:0;
  328. opacity:.5;
  329. background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAFCAYAAACAcVaiAAAAIUlEQVQIW2NkYGD4z8DAwMgAI2ACYBEo+A/jgJWCOHA9AJ/ZBQUxwIh3AAAAAElFTkSuQmCC)no-repeat;
  330. }
  331.  
  332. .desc{
  333. overflow:auto;
  334. width:266px;
  335. height:93px;
  336. padding:20px;
  337. margin-left:-3px;
  338. vertical-align:top;
  339. display:inline-block;
  340. letter-spacing:1px;
  341. background:{color:post bg};
  342. border-bottom:1px solid {color:post border};
  343. }
  344.  
  345. .tracked{
  346. padding:20px;
  347. width:calc(50% - 43px);
  348. height:calc(100% - 40px);
  349. background:{color:post bg};
  350. display:inline-block;
  351. vertical-align:top;
  352. overflow:auto;
  353. }
  354.  
  355. .tracked h1{
  356. margin-bottom:5px;
  357. }
  358.  
  359. .tracked:nth-of-type(2){
  360. margin-left:-2px;
  361. border-left:1px solid {color:post border};
  362. }
  363.  
  364. #todo {
  365. background: {color:post bg};
  366. position: absolute;
  367. letter-spacing:1px;
  368. right: 0;
  369. top: 0;
  370. overflow:auto;
  371. height: calc(100% - 30px);
  372. width: 168px;
  373. padding: 15px;
  374. border-left: 1px solid {color:post border};
  375. }
  376.  
  377. #todo h1{margin-bottom:10px;}
  378.  
  379. input:checked {
  380. height: 10px;
  381. width: 10px;
  382. }
  383.  
  384. input[type="checkbox"]{
  385. margin-bottom:10px;
  386. margin-right:10px;
  387. height: 10px;
  388. width: 10px;
  389. }
  390.  
  391. label{
  392. position:Relative;
  393. top:-3px;
  394. }
  395.  
  396. #plus{
  397. z-index:99999;
  398. width:11px;
  399. height:13px;
  400. cursor:pointer;
  401. padding:10px;
  402. border-radius:5px;
  403. background:{color:bold} url(http://static.tumblr.com/hczaopr/yfYo2nlpe/plus.png)no-repeat center center;
  404. position:fixed;
  405. {block:IndexPage}top:5%;margin-left:-35px; {/block:IndexPage}
  406. {block:PermalinkPage}margin-left:-100px;top:50px;{/block:PermalinkPage}
  407. }
  408.  
  409. #content{
  410. {block:IndexPage}
  411. width:75%;
  412. counter-reset: ninpen-count;
  413. text-align:center;
  414. {/block:IndexPage}
  415. {block:PermalinkPage}
  416. width:950px;
  417. {/block:PermalinkPage}
  418. margin:50px auto 0 auto;
  419. }
  420.  
  421. .entry{
  422. position:relative;
  423. {block:IndexPage}
  424. background:{color:post bg};
  425. margin-left:20px;
  426. width:{text:post size}px;
  427. max-height:{text:post size}px;
  428. overflow:hidden;
  429. {block:ifRoundedges}border-radius:5px;{/block:ifRoundedges}
  430. {block:ifborders}border:1px solid {color:post border};{/block:ifborders}
  431. {/block:IndexPage}
  432. {block:PermalinkPage}
  433. display:inline-block;
  434. width:500px;
  435. {/block:PermalinkPage}
  436. }
  437.  
  438. .ent{
  439. text-align:left;
  440. {block:IndexPage}
  441. counter-increment: ninpen-count;
  442. position:relative;
  443. {block:ifColumns}
  444. display:inline-block;
  445. margin:0 0 {text:post margins}px {text:post margins}px;
  446. {/block:ifColumns}
  447. {block:ifNotColumns}
  448. display:block;
  449. margin:{text:post margins}px auto;
  450. {/block:ifNotColumns}
  451. vertical-align:middle;
  452. width:calc({text:post size}px + 42px);
  453. max-height:{text:post size}px;
  454. {/block:IndexPage}
  455. }
  456.  
  457. {block:IndexPage}
  458. .ent:before{
  459. content: counter(ninpen-count, decimal-leading-zero);
  460. background:{color:counter bg};
  461. font:800 9px/9px 'open sans';
  462. left:0;
  463. color:{color:counter};
  464. position:Absolute;
  465. }
  466. {/block:IndexPage}
  467.  
  468. .txt{
  469. background:{color:post bg};
  470. min-height:100px;
  471. padding:0 5px;
  472. width:calc({text:post size}px - 10px);
  473. position:Relative;
  474. }
  475.  
  476. .ccap{
  477. width:calc({text:post size}px + 20px);
  478. position:Absolute;
  479. top:80px;
  480. display:none;
  481. left:calc({text:post size}px - 50px);
  482. z-index:2;
  483. background:{color:post bg};
  484. border-radius:5px;
  485. }
  486.  
  487. .cap{
  488. background:{color:caption bg};
  489. {block:IndexPage}
  490. max-height:250px;
  491. {/block:IndexPage}
  492. padding:5px;
  493. overflow:auto;
  494. border-radius: 0 0 5px 5px;
  495. {block:PermalinkPage}
  496. max-height:400px;
  497. margin-top:30px;
  498. {/block:PermalinkPage}
  499. }
  500.  
  501. .tumblr_blog{
  502. background:{color:counter bg};
  503. font:800 8px/8px 'open sans';
  504. letter-spacing:3px;
  505. text-transform:uppercase;
  506. }
  507.  
  508. a.tumblr_blog{color:{color:counter};}
  509.  
  510. .img{
  511. {block:ifRoundedges}border-radius:5px;{/block:ifRoundedges}
  512. {block:IndexPage}
  513. line-height:0;
  514. margin:-40px 0 0 -60px;
  515. width:150%!important;
  516. {/block:IndexPage}
  517. }
  518.  
  519. .img img{{block:ifRoundedges}border-radius:5px;{/block:ifRoundedges}}
  520.  
  521. blockquote{
  522. padding-left:5px;
  523. border-left:3px solid {color:post border}!important;
  524. }
  525.  
  526. pre{
  527. white-space: pre-wrap;
  528. white-space: -moz-pre-wrap !important;
  529. white-space: -pre-wrap;
  530. white-space: -o-pre-wrap;
  531. word-wrap: break-word;
  532. background:{color:post border};
  533. font:11px/15px courier;
  534. }
  535.  
  536. .ent:hover .eye{
  537. opacity:1;
  538. -webkit-transition: opacity ease 0.4s;
  539. -moz-transition: opacity ease 0.4s;
  540. -o-transition: opacity ease 0.4s;
  541. -ms-transition: opacity ease 0.4s;
  542. transition: opacity ease 0.4s;
  543. }
  544.  
  545. .eye{
  546. background:{color:accent1} url(http://static.tumblr.com/hczaopr/Jg3o208lz/eye.png)no-repeat center center;
  547. position:absolute;
  548. cursor:pointer;
  549. top:0;
  550. left:20px;
  551. width:{text:post size}px;
  552. height:100%;
  553. text-align:center;
  554. z-index:1;
  555. padding:1px;
  556. opacity:0;
  557. {block:ifRoundedges}border-radius:5px;{/block:ifRoundedges}
  558. -webkit-transition: opacity ease 0.4s;
  559. -moz-transition: opacity ease 0.4s;
  560. -o-transition: opacity ease 0.4s;
  561. -ms-transition: opacity ease 0.4s;
  562. transition: opacity ease 0.4s;
  563. }
  564.  
  565. .ent:nth-child(3n) .eye{
  566. background-color:{color:accent2};
  567. }
  568.  
  569. .ent:nth-child(3n+1) .eye{
  570. background-color:{color:accent3};
  571. }
  572.  
  573. .ent:nth-child(3n+2) .eye{
  574. background-color:{color:accent4};
  575. }
  576.  
  577. .close {
  578. background:aqua;
  579. width:5px;
  580. padding:3px;
  581. height:5px;
  582. position:absolute;
  583. cursor:pointer;
  584. border-radius:3px;
  585. right:-20px;
  586. top:0;
  587. }
  588.  
  589. .perma{
  590. border-radius:5px 5px 0 0;
  591. font:9px/9px 'open sans';
  592. letter-spacing:3px;
  593. background:{color:post bg};
  594. border-bottom:1px solid {color:post border};
  595. text-transform:uppercase;
  596. }
  597.  
  598. .dts{
  599. padding:5px 10px;
  600. font-weight:800;
  601. background:{color:datebg};
  602. display:inline-block;
  603. border-radius:5px 0 0 0;
  604. }
  605.  
  606. .nts{
  607. font-weight:600;
  608. font-size:8px;
  609. letter-spacing:1px;
  610. display:inline-block;
  611. padding:5px;
  612. }
  613.  
  614. .rblg{
  615. font-weight:600;
  616. font-size:8px;
  617. padding:5px 0px;
  618. display:inline-block;
  619. float:right;
  620. }
  621.  
  622. .tags{
  623. background:{color:tagsbg};
  624. padding:5px;
  625. font:600 8px/12px 'open sans';
  626. letter-spacing:1px;
  627. text-transform:uppercase;
  628. text-align:Center;
  629. border-radius: 0 0 5px 5px;
  630. }
  631.  
  632. .tags a{color:{color:tagstext};}
  633.  
  634. #perma {
  635. font:600 8px/11px 'open sans';
  636. letter-spacing:1px;
  637. text-transform:uppercase;
  638. position: absolute;
  639. right:-450px;
  640. width:400px;
  641. {block:ifpadding}top:20px;{/block:ifpadding}
  642. {block:ifNotpadding}top:0;{/block:ifNotpadding}
  643. background:{color:post bg};
  644. }
  645.  
  646. #perma b{font-size:8px;font-weight:800;color:{color:counter};background:{color:counter bg};}
  647.  
  648. #vias{
  649. margin-top:10px;
  650. }
  651.  
  652. .tagss{
  653. font:600 8px/12px 'open sans';
  654. margin-top:20px;
  655. letter-spacing:2px;
  656. padding:5px;
  657. background:{color:tags bg};
  658. }
  659.  
  660. .tagss b{display:inline-block;margin-bottom:10px;}
  661.  
  662. .askr h2{
  663. margin:0 0 5px 0;
  664. padding:5px;
  665. font-size:22px;
  666. line-height:24px;
  667. }
  668.  
  669. .quest{
  670. padding:5px;
  671. background:{color:question bg};
  672. }
  673.  
  674. .quest img{float:left;margin:3px 5px 0 0;border-radius:5px;}
  675.  
  676. ul, ol{
  677. list-style:none;
  678. margin:0px;
  679. padding:0px;
  680. list-style-position:inside;
  681. }
  682.  
  683. ul.chat {
  684. margin: 0;
  685. padding: 0;
  686. }
  687.  
  688. .chat li {
  689. list-style-type: none;
  690. margin-left: 0px;
  691. padding: 10px;
  692. font:7px trebuchet ms;
  693. letter-spacing:1px;
  694. text-transform:uppercase;
  695. }
  696.  
  697. .chat li.odd {
  698. margin-bottom: 3px;
  699. background-color:{color:chat line 1};
  700. color: {color:text};
  701. }
  702.  
  703. .chat li.even {
  704. margin-bottom: 3px;
  705. background-color:{color:chat line 2};
  706. color: {color:text};
  707. }
  708.  
  709. li{
  710. list-style-type:square;
  711. font-family:calibri;
  712. }
  713.  
  714. iframe#tumblr_controls{
  715. position:fixed !important;
  716. }
  717.  
  718. ol,ul{margin:0;padding:0;}
  719.  
  720. ol.notes {
  721. overflow:auto;
  722. background:{color:post bg};
  723. position:Absolute;
  724. {block:ifpadding}top:20px;{/block:ifpadding}
  725. top:0;
  726. padding:20px;
  727. width: 400px;
  728. height:calc(88% - 40px);
  729. min-height: 400px;
  730. margin-left: 520px;
  731. }
  732.  
  733. ol.notes li.note {
  734. border-top: solid 1px {color:post border};
  735. padding: 10px;
  736. list-style-type: none;
  737. }
  738.  
  739. ol.notes li.note img.avatar {
  740. display:none;
  741. }
  742.  
  743. ol.notes li.note span.action {
  744. font-weight:800;
  745. letter-spacing:3px;
  746. }
  747.  
  748. ol.notes li.note .answer_content {
  749. font-weight: normal;
  750. }
  751.  
  752. ol.notes li.note blockquote {
  753. border-color: #eee;
  754. padding: 4px 10px;
  755. margin: 10px 0px 0px 25px;
  756. }
  757.  
  758. ol.notes li.note blockquote a {
  759. text-decoration: none;
  760. }
  761.  
  762. a.notes-hide {
  763. position: absolute;
  764. background:{color:post bg};
  765. color:{color:link};
  766. top: -15px;
  767. margin-left:880px;
  768. text-transform: uppercase;
  769. font: 800 9px/9px 'open sans';
  770. letter-spacing: 2px;
  771. width: 75px;
  772. text-align: center;
  773. padding: 2px;
  774. }
  775.  
  776. .notes-button{
  777. background:{color:counter bg};
  778. font:800 8px/8px 'open sans';
  779. letter-spacing:4px;
  780. text-transform:uppercase;
  781. display:inline-block;
  782. padding:1px;
  783. margin-top:20px;
  784. float:right;
  785. }
  786.  
  787. .notes-button a{color:{color:counter};}
  788.  
  789. .notes-container { display:none;}
  790.  
  791. .videoWrapper {
  792. position: relative;
  793. padding-bottom: 56.25%;
  794. height: 0;
  795. }
  796.  
  797. .videoWrapper iframe{
  798. position: absolute;
  799. width: 100%;
  800. height: 100%;
  801. left: 0;
  802. top: 0;
  803. }
  804.  
  805. .fourthirds {
  806. padding-bottom: 75%;
  807. }
  808.  
  809. #pagination{
  810. font-size:8px;
  811. text-transform:uppercase;
  812. letter-spacing:2px;
  813. background:{color:post bg};
  814. position:fixed;
  815. color:{color:text};
  816. bottom:10%;
  817. text-align:center;
  818. width:150px;
  819. }
  820.  
  821. #pagination span{display:block;margin-top:10px;}
  822. #pagination a:hover{color:{color:bold};}
  823. #pagination a{color:{color:link};display:inline-block;margin-left:10px;}
  824. </style>
  825. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  826. <script type="text/javascript" src="http://theme.matthewbuchanan.name/tumblr/tools/notes/notes.js"></script>
  827.  
  828. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
  829. <script type="text/javascript">
  830.  
  831. $(document).ready(function(){
  832. $('.eye').click(function() {
  833. $('.ccap').hide();
  834. $(this).parent('.ent').find('.ccap').show('slow');
  835. });
  836.  
  837. $('#plus').click(function() {
  838. $( "aside" ).fadeToggle( "slow", "linear" );
  839. });
  840.  
  841. $('.close').on('click', function(c){
  842. $(this).parent().fadeOut('slow', function(c){
  843. });
  844. });
  845.  
  846. });
  847. </script>
  848.  
  849.  
  850. </head>
  851. <body>
  852.  
  853.  
  854.  
  855.  
  856. <aside>
  857. <div id="desc">
  858.  
  859.  
  860. <div id="mainav">
  861. <span>
  862. <a href="/">Start</a>
  863. <a href="/ask">inquire</a>
  864. <a href="/archive">calendar</a>
  865. {block:IfCustomLinkOne}<a href="{block:IfCustomLinkOneURL}{text:Custom Link One URL}{/block:IfCustomLinkOneURL}">{text:Custom Link One}</a>{/block:IfCustomLinkOne}
  866.  
  867. {block:IfCustomLinkTwo}<a href="{block:IfCustomLinkTwoURL}{text:Custom Link Two URL}{/block:IfCustomLinkTwoURL}">{text:Custom Link Two}</a>{/block:IfCustomLinkTwo}
  868.  
  869. {block:IfCustomLinkThree}<a href="{block:IfCustomLinkThreeURL}{text:Custom Link Three URL}{/block:IfCustomLinkThreeURL}">{text:Custom Link Three}</a>{/block:IfCustomLinkThree}
  870.  
  871. {block:IfCustomLinkFour}<a href="{block:IfCustomLinkFourURL}{text:Custom Link Four URL}{/block:IfCustomLinkFourURL}">{text:Custom Link Four}</a>{/block:IfCustomLinkFour}
  872.  
  873. {block:IfCustomLinkFive}<a href="{block:IfCustomLinkFiveURL}{text:Custom Link Five URL}{/block:IfCustomLinkFiveURL}">{text:Custom Link Five}</a>{/block:IfCustomLinkFive}
  874. </span>
  875. </div>
  876.  
  877.  
  878. <div class="portrait"><img src="{image:portrait}"></div>
  879.  
  880. <div class="desc">
  881. {description}</div>
  882.  
  883.  
  884.  
  885. <div class="subnav">
  886. <div class="tracked">
  887. <h1>tracked tags</h1>
  888.  
  889. /****************** YOU CAN ADD AS MANY LINKS AS YOU WANT. THE LIMIT IS THE MOON ******************/
  890.  
  891. <a href="">link</a>
  892. <a href="">link</a>
  893. <a href="">link</a>
  894. <a href="">link</a>
  895. <a href="">link</a>
  896. <a href="">link</a>
  897. <a href="">link</a>
  898. <a href="">link</a>
  899. <a href="">link</a>
  900. <a href="">link</a>
  901. <a href="">link</a>
  902. <a href="">link</a>
  903. <a href="">link</a>
  904. <a href="">link</a>
  905. <a href="">link</a>
  906. <a href="">link</a>
  907. <a href="">link</a>
  908. <a href="">link</a>
  909. </div>
  910.  
  911. <div class="tracked">
  912. <h1>important links</h1>
  913. <a href="">link</a>
  914. <a href="">link</a>
  915. <a href="">link</a>
  916. <a href="">link</a>
  917. <a href="">link</a>
  918. <a href="">link</a>
  919. <a href="">link</a>
  920. <a href="">link</a>
  921. <a href="">link</a>
  922. <a href="">link</a>
  923. <a href="">link</a>
  924. <a href="">link</a>
  925. <a href="">link</a>
  926. </div>
  927. </div>
  928.  
  929. <div id="todo">
  930. <h1>to do list</h1>
  931.  
  932.  
  933. /************************************************************************************************************
  934. FOR CHECKED BOX: <input type="checkbox" checked="checked"><label>PUT YOUR TEXT HERE</label><br>
  935. FOR UNCHECKED BOX: <input type="checkbox"><label>PUT YOUR TEXT HERE</label><br>
  936. ************************************************************************************************************/
  937.  
  938. <input type="checkbox" checked="checked"><label>wake up</label><br>
  939. <input type="checkbox" checked="checked"><label>shower</label><br>
  940. <input type="checkbox" checked="checked"><label>eat</label><br>
  941. <input type="checkbox" checked="checked"><label>go to school</label><br>
  942. <input type="checkbox" checked="checked"><label>acquire sugar daddy</label><br>
  943. <input type="checkbox" checked="checked"><label>sugar daddy pays for tuition</label><br>
  944. <input type="checkbox" checked="checked"><label>get rich</label><br>
  945. <input type="checkbox"><label>fuck bitches</label><br>
  946. <input type="checkbox"><label>become even more awesome</label><br>
  947. <input type="checkbox"><label>Go to sugar daddy's funeral</label>
  948. </div>
  949.  
  950. </div>
  951. </aside>
  952.  
  953.  
  954.  
  955. <main id="center">
  956. <section id="content">
  957. <div id="plus"></div>
  958.  
  959. {block:Posts}
  960. <div class="ent">
  961.  
  962.  
  963. {block:IndexPage}
  964.  
  965. <div class="eye"></div>
  966.  
  967.  
  968.  
  969.  
  970.  
  971. <div class="ccap">
  972. <div class="close"></div>
  973.  
  974.  
  975. <div class="perma">
  976. <span class="dts">{block:Date}<a href="{permalink}">{12HourWithZero}:{Minutes} {CapitalAmPm}</a>{/block:Date}</span>
  977. <span class="nts">{Notecount}</span> -
  978. <span class="rblg"><a href="{ReblogURL}">reblog</a></span>
  979. </div>
  980.  
  981. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  982.  
  983. {block:HasTags}
  984. <div class="tags">{block:Tags}<a href="{TagURL}">{Tag}</a> · {/block:Tags} </div>
  985. {/block:HasTags}
  986. </div>
  987.  
  988. {/block:IndexPage}
  989.  
  990.  
  991.  
  992. <div class="entry">
  993.  
  994. {block:PermalinkPage}
  995. <div id="perma">
  996. {block:Date}<b>Created on</b> {TimeAgo} &nbsp;&nbsp;&nbsp;— &nbsp;&nbsp;&nbsp;{NoteCount}
  997. {/block:Date}
  998.  
  999. {block:RebloggedFrom}
  1000. <div id="vias">
  1001. <b>Originally created by</b> &nbsp;&nbsp;&nbsp;— &nbsp;&nbsp;&nbsp; <a href="{ReblogRootURL}">{ReblogRootName}</a><br><br>
  1002. <b>Replicated by</b> &nbsp;&nbsp;&nbsp;— &nbsp;&nbsp;&nbsp; <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1003. </div>
  1004. {/block:RebloggedFrom}
  1005.  
  1006. {block:HasTags}
  1007. <div class="tagss">
  1008. <b>Filed under</b> &nbsp;— <br>
  1009. <center>{block:Tags}<a href="{TagURL}">{Tag}</a> · {/block:Tags}</center>
  1010. </div>
  1011. {/block:HasTags}
  1012.  
  1013. {block:caption}
  1014. <div class="cap">{caption}
  1015. </div> {/block:caption}
  1016.  
  1017.  
  1018.  
  1019. {block:NoteCount}
  1020. <a href="{postNotesURL}" rel="{postID}" class="notes-button">Show the notes</a>
  1021. {/block:NoteCount}
  1022.  
  1023. </div>
  1024. {/block:PermalinkPage}
  1025.  
  1026.  
  1027.  
  1028.  
  1029.  
  1030. {block:Text}
  1031. <div class="txt">
  1032. {block:Title}
  1033. <h1><a href="{permalink}">{Title}</a></h1>{/block:Title}
  1034. {Body}
  1035. </div>
  1036. {/block:Text}
  1037.  
  1038.  
  1039.  
  1040.  
  1041. {block:Link}
  1042. <div class="txt">
  1043. <div class="span">
  1044. <h1><a href="{URL}">{Name}</a></h1>
  1045. {block:Description}{Description}{/block:Description}
  1046. </div></div>
  1047. {block:Link}
  1048.  
  1049.  
  1050.  
  1051.  
  1052. {block:Photo}
  1053. {block:IndexPage}
  1054. <div class="img"><a href="{permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a></div>
  1055. {/block:IndexPage}
  1056.  
  1057. {block:PermalinkPage}
  1058. <div class="img"><a href="{permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a></div>
  1059. {block:PermalinkPage}
  1060.  
  1061. {/block:Photo}
  1062.  
  1063.  
  1064.  
  1065.  
  1066. {block:Photoset}
  1067. {block:IndexPage}<div class="img">{Photoset}</div>{/block:IndexPage}
  1068. {block:PermalinkPage}{Photoset}{/block:PermalinkPage}
  1069. {/block:Photoset}
  1070.  
  1071.  
  1072.  
  1073. {block:Chat}
  1074. <div class="txt">
  1075. <ul class="chat">
  1076. {block:Lines}
  1077. <li class="{Alt} user_{UserNumber}">
  1078. {block:Label}
  1079. <span class="label">{Label}</span>
  1080. {/block:Label}
  1081. {Line}
  1082. </li>
  1083. {/block:Lines}
  1084. </ul>
  1085. </div>
  1086. {block:Title}
  1087. <div class="titled">
  1088. <div class="twrap"><div class="ticon"><img src="http://static.tumblr.com/hczaopr/xk2nxgsa3/chat.png"></div><h1><a href="{Permalink}">{Title}</a></h1></div>
  1089. </div>
  1090. {/block:Title}
  1091. {/block:Chat}
  1092.  
  1093.  
  1094. {block:Audio}
  1095. {block:TrackName}<h1>{TrackName}</h1>{/block:TrackName}
  1096. {block:Artist} by — <b>{Artist}</b>{/block:Artist}
  1097. {AudioPlayerBlack}
  1098. {/block:Audio}
  1099.  
  1100.  
  1101. {block:Quote}
  1102. <div class="txt">
  1103. <h2>{Quote}</h2>
  1104. {block:Source}<div class="source">- {Source}</div>{/block:Source}
  1105. </div>
  1106. {/block:Quote}
  1107.  
  1108.  
  1109.  
  1110.  
  1111.  
  1112. {block:Answer}
  1113.  
  1114. <div class="askr">
  1115. <a href="{permalink}"><h2>{Asker}</h2></a>
  1116. </div>
  1117.  
  1118. <div class="quest">
  1119. <span><img src="{AskerPortraitURL-30}"></span>
  1120. {Question}
  1121. </div>
  1122.  
  1123. {Answer}
  1124.  
  1125. {/block:Answer}
  1126.  
  1127.  
  1128.  
  1129.  
  1130. {block:Video}
  1131. <div class="img">
  1132. <div class="videoWrapper {TagsAsClasses}">{VideoEmbed-500}</div>
  1133. </div>
  1134. {/block:Video}
  1135.  
  1136.  
  1137.  
  1138.  
  1139.  
  1140. </div>
  1141. <div class="notes-container" id="notes-{postID}">
  1142. <p class="loading">Loading...</p>
  1143. <div class="notes-loader"></div>
  1144. </div>
  1145.  
  1146. </div>
  1147.  
  1148.  
  1149. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1150. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{block:NoSourceLogo}{/block:NoSourceLogo}{/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  1151.  
  1152.  
  1153.  
  1154.  
  1155. {/block:Posts}
  1156. <!--POSTS SECTION ENDS-->
  1157. </section>
  1158.  
  1159. {block:Pagination}
  1160. <section id="pagination">
  1161. Phase {CurrentPage} of {TotalPages}
  1162. <span>
  1163. {block:PreviousPage}<a href="{PreviousPage}">Before</a>{/block:PreviousPage}
  1164. {block:NextPage}<a href="{NextPage}">After</a>{/block:NextPage}
  1165. </span>
  1166. </section>
  1167. {/block:Pagination}
  1168.  
  1169. </main>
  1170.  
  1171.  
  1172.  
  1173.  
  1174.  
  1175.  
  1176.  
  1177. </body>
  1178. </html>
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!