API tools faq
paste
Advertisement
TitanJelly

theme #03 - by titanjelly

TitanJelly
Oct 26th, 2013
3,057
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.63 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. ╱╭╮╱╭╮
  3. ╭╯╰┳╯╰╮
  4. ╰╮╭╋╮╭╋━━┳━╮
  5. ╱┃┃┣┫┃┃╭╮┃╭╮╮
  6. ╱┃╰┫┃╰┫╭╮┃┃┃┃
  7. ╱╰━┻┻━┻╯╰┻╯╰╯
  8. ↳ http://titanjelly.tumblr.com
  9. ↳ DO NOT Claim/Repost as your own or Remove the theme credit!
  10. ↳ DO NOT Use as a theme base or Make heavy modifications!
  11. -->
  12.  
  13. <head>
  14. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  15.  
  16. <title>{title}</title>
  17.  
  18. <meta name="image:Background" content="http://static.tumblr.com/6f796086eee28a1a53572a351781433a/9hiqgmd/nJumvaite/tumblr_static_groovepaper.png" />
  19. <meta name="image:Post Area" content="" />
  20. <meta name="image:Sidebar" content="http://static.tumblr.com/b973d0da851b08dabc57cd8dff45255d/9hiqgmd/039mvakyr/tumblr_static_tumblr_mpofrdivud1rddxplo1_r1_500.png" />
  21. <meta name="image:Hover Icon" content="http://static.tumblr.com/a70755de5ad246d4429a06f6bf8e7443/9hiqgmd/KSCmvajty/tumblr_static_tumblr_static_tumblr_ms8tfhvcqb1qevqlro1_500.png" />
  22.  
  23. <meta name="text:Icon Size" content="200px" />
  24. <meta name="text:Icon Position Top" content="-125px" />
  25. <meta name="text:Icon Position Left" content="130px" />
  26.  
  27.  
  28. <meta name="text:Link01" content="Link01" />
  29. <meta name="text:Link01URL" content="url" />
  30. <meta name="text:Link02" content="Link02" />
  31. <meta name="text:Link02URL" content="url" />
  32. <meta name="text:Link03" content="Link03" />
  33. <meta name="text:Link03URL" content="url" />
  34. <meta name="text:Link04" content="Link04" />
  35. <meta name="text:Link04URL" content="url" />
  36. <meta name="text:Link05" content="Link05" />
  37. <meta name="text:Link05URL" content="url" />
  38. <meta name="text:Link06" content="Link06" />
  39. <meta name="text:Link06URL" content="url" />
  40. <meta name="text:Link07" content="Link07" />
  41. <meta name="text:Link07URL" content="url" />
  42. <meta name="text:Link08" content="Link08" />
  43. <meta name="text:Link08URL" content="url" />
  44. <meta name="text:Link09" content="Link09" />
  45. <meta name="text:Link09URL" content="url" />
  46. <meta name="text:Link10" content="Link10" />
  47. <meta name="text:Link10URL" content="url" />
  48.  
  49. <meta name="if:Infinite Scroll" content="0"/>
  50. <meta name="if:MoreLinks" content="1" />
  51. <meta name="if:Captions" content="1" />
  52.  
  53. <meta name="color:Base" content="#b0d5e3"/>
  54.  
  55. <link rel="shortcut icon" href="{Favicon}" />
  56.  
  57. <style type="text/css">
  58.  
  59. iframe#tumblr_controls {
  60. white-space:nowrap;
  61. -webkit-filter: invert(100%);
  62. -moz-filter: invert(100%);
  63. -o-filter: invert(100%);
  64. -ms-filter: invert(100%);
  65. filter: invert(100%);
  66. opacity:0.4;
  67. }
  68.  
  69. body {
  70. font-size: 10px; /* font size */
  71. font-family: Calibri, Candara, Segoe; /* font */
  72. color: #000; /* font color */
  73. background: #f9f9f9 url('{image:Background}') fixed repeat;
  74. }
  75.  
  76. .sbg {
  77. width:480px;
  78. background: #f9f9f9 url('{image:Post Area}') fixed repeat;
  79. position:fixed;
  80. left:0;
  81. top:0;
  82. bottom:0;
  83. z-index:-5;
  84. }
  85.  
  86. ::-webkit-scrollbar-thumb:vertical {
  87. background: {color:Base};}
  88. ::-webkit-scrollbar-thumb:horizontal {
  89. background: {color:Base};
  90. height:10px!important;}
  91. ::-webkit-scrollbar {
  92. background: url('{image:Background}');
  93. height:10px;
  94. width: 10px;}
  95.  
  96. a {
  97. color: {color:Base};
  98. text-decoration: none;
  99. -moz-transition-duration: 0.5s;
  100. -o-transition-duration: 0.5s;
  101. -webkit-transition-duration: 0.5s;
  102. transition-duration: 0.5s;
  103. }
  104.  
  105. a:hover {
  106. color: #9b291a;
  107. -moz-transition-duration: 0.5s;
  108. -o-transition-duration: 0.5s;
  109. -webkit-transition-duration: 0.5s;
  110. transition-duration: 0.5s;
  111. }
  112.  
  113. .container {
  114. width: 800px;
  115. margin: 10px 0px 0px 50px;
  116. }
  117.  
  118. .sidebar {
  119. width: 230px;
  120. position:fixed;
  121. top:0;
  122. bottom:0;
  123. margin-left: 475px;
  124. }
  125.  
  126. .sidebox {
  127. width: 230px;
  128. margin-top: -10px;
  129. position: fixed;
  130. }
  131.  
  132. .sideboximage {
  133. width:210px;
  134. max-width: 210px;
  135. border:10px solid {color:Base};
  136. background: #f9f9f9;
  137. -moz-transition-duration: 0.5s;
  138. -o-transition-duration: 0.5s;
  139. -webkit-transition-duration: 0.5s;
  140. transition-duration: 0.5s;
  141. }
  142.  
  143. .sideboximage:hover {
  144. background:{color:Base};
  145. border:10px solid #fff;
  146. }
  147.  
  148. .hovericon {
  149. max-width:{text:Icon Size};
  150. position:fixed;
  151. margin-top:{text:Icon Position Top};
  152. margin-left:{text:Icon Position Left};
  153. pointer-events:none;
  154. }
  155.  
  156. .hometitle a{
  157. display:block;
  158. width:200px;
  159. line-height:20px;
  160. color:{color:Base};
  161. background-color: #fff;
  162. font-family:'Libre Baskerville', serif;
  163. font-size:16px;
  164. font-style:italic;
  165. text-align:center;
  166. text-transform:lowercase;
  167. letter-spacing:3px;
  168. margin:auto;
  169. margin-top:10px;
  170. border:10px solid {color:Base};
  171. }
  172.  
  173. .hometitle a:hover {
  174. color:#fff;
  175. background:{color:Base};
  176. border:10px solid #fff;
  177. }
  178.  
  179. .homelinks {
  180. width:200px;
  181. text-align: center;
  182. text-transform: uppercase;
  183. margin:auto;
  184. margin-top:10px;
  185. }
  186.  
  187. .homelinks a {
  188. width:50px;
  189. background-color: #fff;
  190. color:{color:Base};
  191. display:inline-block;
  192. padding: 2px 5px;
  193. margin:5px;
  194. border:7px solid {color:Base};
  195. -moz-transition-duration: 0.5s;
  196. -o-transition-duration: 0.5s;
  197. -webkit-transition-duration: 0.5s;
  198. transition-duration: 0.5s;
  199. }
  200.  
  201. .homelinks a:hover {
  202. color:#fff;
  203. background:{color:Base};
  204. border:7px solid #fff;
  205. }
  206.  
  207. .clinks {
  208. height:200px;
  209. width:100px;
  210. position:fixed;
  211. margin-top:20px;
  212. margin-left:704px;
  213. }
  214.  
  215. .clinks a {
  216. color:#fff;
  217. width:50px;
  218. background:{color:Base};
  219. display:block;
  220. padding: 2px 5px;
  221. margin:1px;
  222. }
  223.  
  224. .clinks a:hover {
  225. color:{color:Base};
  226. width:50px;
  227. background:#fff;
  228. padding-left:10px;
  229. }
  230.  
  231. .mclink {margin-top:10px;}
  232. .mclink a {opacity:0.6;}
  233. .mclink a:hover {opacity:1;}
  234.  
  235. .description {
  236. max-width:200px;
  237. line-height:20px;
  238. background-color: #fff;
  239. text-align:left;
  240. text-transform:lowercase;
  241. margin:auto;
  242. margin-top:10px;
  243. padding:5px;
  244. border:5px solid {color:Base};
  245. -moz-transition-duration: 0.5s;
  246. -o-transition-duration: 0.5s;
  247. -webkit-transition-duration: 0.5s;
  248. transition-duration: 0.5s;
  249. z-index:10;
  250. }
  251.  
  252. .description:hover {
  253. border:5px solid #fff;
  254. }
  255.  
  256. .nav {
  257. width:230px;
  258. font-size:25px;
  259. text-align: center;
  260. text-transform: uppercase;
  261. word-spacing:25px;
  262. position: fixed;
  263. margin:auto;
  264. margin-top:10px;
  265. }
  266.  
  267. /* border construction */
  268.  
  269. .h01, .h02 {position:fixed;}
  270. .h01 {
  271. height:50px;width:10px;background:{color:Base};
  272. margin-top:-10px;margin-left:170px;z-index:-1;}
  273. .h02 {
  274. height:50px;width:5px;background:{color:Base};
  275. margin-top:-10px;margin-left:40px;z-index:-1;}
  276.  
  277. .b01, .b02, .b03, .b04 {position:fixed;top:0;bottom:0;}
  278. .b01 {
  279. width:10px;background:{color:Base};margin-left:420px;}
  280. .b02 {
  281. width:10px;background:{color:Base};margin-left:431px;opacity:0.5;}
  282. .b03 {
  283. width:10px;background:{color:Base};margin-left:442px;opacity:0.2;}
  284. .b04 {
  285. width:10px;background:{color:Base};left:0px;}
  286.  
  287. .posts {
  288. width: 400px;
  289. background-color: #fff;
  290. margin-left: -20px;
  291. margin-bottom: 20px;
  292. padding: 5px;
  293. overflow: hidden;
  294. border:5px solid {color:Base};
  295. }
  296.  
  297. .posts h2 {
  298. font-size: 12px;
  299. color: {color:Base};
  300. font-weight: normal;
  301. margin: 0px;
  302. }
  303.  
  304. .posts h2 a {
  305. font-size: 12px;
  306. color: {color:Base};
  307. font-weight: normal;
  308. margin: 0px;
  309. }
  310.  
  311. .posts li {
  312. list-style: square;
  313. }
  314.  
  315. .posts blockquote {
  316. border-left: 1px solid #000;
  317. padding-left: 5px;
  318. }
  319.  
  320. .posts img, .posts li, .posts blockquote {max-width: 100%;}
  321.  
  322. .question {
  323. background-color: #fcfcfc;
  324. padding: 20px;
  325. min-height: 50px;
  326. }
  327.  
  328. .question img {
  329. border: 5px solid #fff;
  330. float: left;
  331. margin-right: 10px;
  332. }
  333.  
  334. .askr {
  335. color: #cf2d85;
  336. }
  337.  
  338. .quote {
  339. width: 80%;
  340. margin: auto;
  341. }
  342.  
  343. .quotetext_short {font-size: 18px;}
  344. .quotetext_medium {font-size: 14px;}
  345. .quotetext_long {font-size: 11px;}
  346.  
  347. .source {text-align: right;}
  348.  
  349. .convo li {list-style: none; margin-left:-40px;}
  350.  
  351. .convo .label {text-transform: uppercase;}
  352.  
  353. .line_odd .label {color: {color:Base};}
  354. .line_even .label {color: {color:Base};}
  355.  
  356. .cover {
  357. position: relative;
  358. margin-bottom: 10px;
  359. color:#000;
  360. height: 58px;
  361. width: 58px;
  362. z-index: 1
  363. }
  364.  
  365. .cover img {
  366. height: 58px;
  367. z-index: 1
  368. }
  369.  
  370. .playbutton {
  371. width: 18px;
  372. height: 30px;
  373. overflow: hidden;
  374. position: relative;
  375. z-index: 1000;
  376. margin: 15px 24px 13px 16px;
  377. }
  378.  
  379. .playbox {
  380. background-color: #000;
  381. position: absolute;
  382. margin-top: -68px;
  383. z-index: 1000;
  384. opacity: 0.5;
  385. }
  386.  
  387. .audioinfo {
  388. height: 30px;
  389. position: absolute;
  390. margin-top: -70px;
  391. margin-left: 70px;
  392. }
  393.  
  394. .audiotrack {
  395. font-size: 14px;
  396. font-weight: bold;
  397. }
  398.  
  399. .audiocap {
  400. position: relative;
  401. margin-top: 0px;
  402. }
  403.  
  404. .postinfo {
  405. padding-left: 5px;
  406. font-size: 9px;
  407. text-transform: uppercase;
  408. letter-spacing: 1px;
  409. border-top: 2px solid {color:Base};
  410. }
  411.  
  412. .noteinfo {float: right;}
  413. .noteinfo a {color:#000;}
  414.  
  415.  
  416. /* NOTE CSS */
  417.  
  418. .sources {filter:alpha(opacity=0);opacity:0;display:none;}
  419.  
  420. .credit a {
  421. color:#22231E;
  422. position:fixed;
  423. right:5px;
  424. bottom:5px;
  425. opacity:0.5;}
  426.  
  427. .credit a:hover{color:{color:Base};}
  428.  
  429. </style>
  430.  
  431. {block:ifInfiniteScroll}
  432. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
  433. {/block:ifInfiniteScroll}
  434.  
  435. </head>
  436. <body>
  437.  
  438. <div class="container">
  439.  
  440. <div class="sidebar">
  441. <div class="sidebox">
  442.  
  443. <a href="/"><img src="{image:Sidebar}" class="sideboximage"></a>
  444.  
  445. <div class="h01"></div>
  446. <div class="hometitle"><a href="/">{title}</a></div>
  447.  
  448. <img src="{image:Hover Icon}" class="hovericon">
  449.  
  450. <div class="h02"></div>
  451. <div class="description">{Description}</div>
  452.  
  453. <div class="homelinks">
  454. <a href="/">index</a>
  455. <a href="/ask">ask</a>
  456. <a href="/faq">about</a>
  457. <a href="/archive">archive</a>
  458. </div>
  459.  
  460. {block:ifnotInfiniteScroll}
  461. {block:Pagination}
  462. <div class="nav">
  463. {block:PreviousPage}<a href="{PreviousPage}"> < </a>{/block:PreviousPage}
  464. {block:NextPage}<a href="{NextPage}"> > </a>{/block:NextPage}
  465. </div>
  466. {/block:Pagination}
  467. {/block:ifnotInfiniteScroll}
  468.  
  469. </div>
  470. </div>
  471.  
  472. <div class="clinks">
  473. <a href="{text:Link01URL}">{text:Link01}</a>
  474. <a href="{text:Link02URL}">{text:Link02}</a>
  475. <a href="{text:Link03URL}">{text:Link03}</a>
  476. <a href="{text:Link04URL}">{text:Link04}</a>
  477. <a href="{text:Link05URL}">{text:Link05}</a>
  478. <a href="{text:Link06URL}">{text:Link06}</a>
  479. {block:IfMoreLinks}
  480. <div class="mclink">
  481. <a href="{text:Link07URL}">{text:Link07}</a>
  482. <a href="{text:Link08URL}">{text:Link08}</a>
  483. <a href="{text:Link09URL}">{text:Link09}</a>
  484. <a href="{text:Link10URL}">{text:Link10}</a>
  485. </div>
  486. {/block:IfMoreLinks}
  487. </div>
  488.  
  489. <div class="b00">
  490. <div class="b01"></div>
  491. <div class="b02"></div>
  492. <div class="b03"></div>
  493. <div class="b04"></div>
  494. </div>
  495.  
  496. <div class="sbg"></div>
  497.  
  498. <div class="postcol">
  499. <div class="autopagerize_page_element">
  500. {block:Posts}
  501. <div class="posts">
  502.  
  503. {block:ContentSource}<div class="sources">
  504. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  505. {/block:SourceLogo}
  506. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  507. </div>{/block:ContentSource}
  508.  
  509. {block:Text}
  510. {block:Title}<h2>{Title}</h2>{/block:Title}
  511. {Body}
  512. {/block:Text}
  513.  
  514. {block:Answer}
  515. <div class="question">
  516. <img src="{AskerPortraitURL-40}"> {Asker} asked: {Question}
  517. </div>
  518. {Answer}
  519. {/block:Answer}
  520.  
  521. {block:Quote}
  522. <div class="quote">
  523. <div class="quotetext_{Length}">"{Quote}"</div>
  524. {block:Source}<div class="source">{Source}</div>{/block:Source}
  525. </div>
  526. {/block:Quote}
  527.  
  528. {block:Link}
  529. <h2><a href="{URL}">{Name}</a></h2>
  530. {block:Description}{Description}{/block:Description}
  531. {/block:Link}
  532.  
  533. {block:Chat}
  534. {block:Title}<h2>{Title}</h2>{/block:Title}
  535. <ul class="convo">
  536. {block:Lines}<li class="line_{Alt}">{block:Label}
  537. <span class="label">{Label}</span>
  538. {/block:Label}{Line}</li>{/block:Lines}</ul>
  539. {/block:Chat}
  540.  
  541. {block:Photo}
  542. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="400px">
  543. {LinkCloseTag}
  544. {block:IfCaptions}
  545. {block:IndexPage}
  546. {block:Caption}{Caption}{/block:Caption}
  547. {/block:IndexPage}
  548. {/block:IfCaptions}
  549. {block:PermalinkPage}
  550. {block:Caption}{Caption}{/block:Caption}
  551. {/block:PermalinkPage}
  552. {/block:Photo}
  553.  
  554. {block:Photoset}
  555. {Photoset-400}
  556. {block:IfCaptions}
  557. {block:IndexPage}
  558. {block:Caption}{Caption}{/block:Caption}
  559. {/block:IndexPage}
  560. {/block:IfCaptions}
  561. {block:PermalinkPage}
  562. {block:Caption}{Caption}{/block:Caption}
  563. {/block:PermalinkPage}
  564. {/block:Photoset}
  565.  
  566. {block:Audio}
  567. <div class="cover">{block:AlbumArt}
  568. <img src="{AlbumArtURL}" height="58px">
  569. {/block:AlbumArt}</div>
  570. <div class="audioinfo">
  571. <div class="audiotrack">
  572. {block:TrackName}{TrackName}{/block:TrackName}</div>
  573. <div class="audioartist">
  574. {block:Artist}{Artist}{/block:Artist}</div>
  575. {block:PlayCount}{PlayCountWithLabel}{/block:PlayCount}
  576. </div>
  577. <div class="playbox">
  578. <div class="playbutton">
  579. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
  580. </div></div>
  581. <div class="audiocap">
  582. {block:Caption}{Caption} {/block:Caption}
  583. </div>
  584. {/block:Audio}
  585.  
  586. {block:Video}
  587. {Video-400}
  588. {block:Caption}{Caption}{/block:Caption}
  589. {/block:Video}
  590.  
  591.  
  592. <!-- Post Information -->
  593.  
  594. {block:Date}
  595. <div class="postinfo"><a href="{Permalink}">{TimeAgo}</a>
  596. {block:Notecount}
  597. <div class="noteinfo"><a href="{Permalink}">{NoteCountWithLabel}</a>
  598. </div>{/block:Notecount}
  599. </div>{/block:Date}
  600.  
  601. {block:PermalinkPage}
  602. {block:RebloggedFrom}<a href="{ReblogParentURL}">VIA {ReblogParentName} </a> / <a href="{ReblogRootURL}">SOURCE {ReblogRootName} </a>{/block:RebloggedFrom}
  603. {/block:PermalinkPage}
  604.  
  605. {block:PostNotes} {PostNotes} {/block:PostNotes}
  606.  
  607. </div>
  608. {/block:Posts}
  609. </div>
  610. </div>
  611.  
  612. </div>
  613.  
  614.  
  615. <!-- Credit / Copyright Information - DO NOT REMOVE -->
  616.  
  617. <div class="credit"><a href="http://titanjelly.tumblr.com/themes">theme</a></div>
  618.  
  619. </body>
  620. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!