API tools faq
paste
Advertisement
jercydee

TTTL #002 by striveattemptfail

jercydee
May 9th, 2015
366
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.22 KB | None | 0 0
raw download clone embed print report
  1. <!--------------------------------------------------------------------------------
  2.  
  3. + - - - THEME 002: TTTL #002
  4.  
  5. + - - - THEME BY: Jercy @ striveattemptfail.tumblr.com
  6.  
  7. + - - - LAST UPDATED: MAY 2015
  8.  
  9. + - - - OTHER CREDITS: Sidebar image made by Jercy (me), default textures by subtlepatterns.com
  10.  
  11. -------------------------------------------------------------------------------->
  12.  
  13. <!DOCTYPE html>
  14. <html>
  15. <head>
  16.  
  17. <title>{Title}</title>
  18. <link rel="shortcut icon" href="{Favicon}">
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20.  
  21. <meta name="image:Sidebar Background" content="https://41.media.tumblr.com/2fcccf425584bd0b52e64e7ff8bab68f/tumblr_nnahx7a8581r422wto2_r1_500.jpg"/>
  22. <meta name="image:Sidebar Circle Image" content="http://static.tumblr.com/efqf52c/kb4no2cdx/for_theme_2.jpg"/>
  23. <meta name="image:Background Image" content="http://subtlepatterns.com/patterns/lightpaperfibers.png"/>
  24.  
  25. <meta name="color:Background" content="#ffffff" />
  26. <meta name="color:Text" content="#444444" />
  27. <meta name="color:Link" content="#5a4954" />
  28. <meta name="color:Link Hover" content="#644b74" />
  29. <meta name="color:Title" content="#2d252a" />
  30. <meta name="color:Title Hover" content="#cccccc" />
  31. <meta name="color:Navigation Title" content="#000000" />
  32. <meta name="color:Navigation Background" content="#ffffff" />
  33. <meta name="color:Navigation Links" content="#43324e" />
  34. <meta name="color:Navigation Hover" content="#eeeeee" />
  35. <meta name="color:Pagination Background" content="#cccccc" />
  36. <meta name="color:Pagination Hover" content="#644b74" />
  37. <meta name="color:Lines" content="#222222" />
  38.  
  39. <meta name="if:Upload Background Image" content="0"/>
  40.  
  41. <meta name="font:Title" content="Typewriter">
  42. <meta name="font:Text" content="Gibson">
  43.  
  44. <style type="text/css">
  45.  
  46. body {
  47. background-color: {color:Background};
  48. {block:IfUploadBackgroundImage}background-image: url('{image:Background Image}');{/block:IfUploadBackgroundImage}
  49. color: {color:Text};
  50. font-size: 14px;
  51. font-family: {font:Text};
  52. word-wrap: break-word;
  53. white-space: normal;
  54. margin: 0;
  55. padding: 0;
  56. }
  57.  
  58. a {
  59. color: {color:Link};
  60. text-decoration: none;
  61. transition: 0.2s ease-in-out;
  62. -webkit-transition: 0.2s ease-in-out;
  63. -moz-transition: 0.2s ease-in-out;
  64. }
  65.  
  66. a:hover {
  67. color: {color:Link Hover};
  68. text-decoration: none;
  69. }
  70.  
  71. h3 {
  72. font-family: {font:Title};
  73. font-size: 20px;
  74. line-height: 1em;
  75. }
  76.  
  77. img { width: 100%; height: 100%; }
  78.  
  79. blockquote {
  80. margin: 0px 10px 10px 10px;
  81. padding: 0px 10px;
  82. border-left: solid 3px {color:Lines};
  83. }
  84.  
  85. blockquote img { max-width: 100%; max-height: 100%; }
  86.  
  87. h2 {
  88. font-size: 20px;
  89. font-weight: none;
  90. margin-top: 0.1em;
  91. margin-bottom: -0.1em;
  92. }
  93.  
  94. hr {
  95. display: block;
  96. margin-top: 1em;
  97. margin-bottom: 1em;
  98. border-width: 1px;
  99. border-color: {color:Lines};
  100. width: 25%;
  101. }
  102.  
  103. /* SIDEBAR */
  104. #sidebar {
  105. background-image: url('{image:Sidebar Background}');
  106. height: 200%;
  107. width: 300px;
  108. position: fixed;
  109. }
  110.  
  111. #sidebar .title {
  112. color: {color:Title};
  113. font-family: {font:Title};
  114. font-size: 30px;
  115. font-weight: bold;
  116. text-align: center;
  117. line-height: 1em;
  118. padding: 100px 10px 0px 10px;
  119. }
  120.  
  121. #sidebar .title a {
  122. color: {color:Title};
  123. text-decoration: none;
  124. transition: 0.2s ease-in-out;
  125. -webkit-transition: 0.2s ease-in-out;
  126. -moz-transition: 0.2s ease-in-out;
  127. }
  128.  
  129. #sidebar .title a:hover {
  130. color: {color:Title Hover};
  131. text-decoration: none;
  132. }
  133.  
  134. #circle {
  135. background-color: {color:Navigation Background};
  136. height: 250px;
  137. width: 250px;
  138. padding: 5px;
  139. margin-top: 20px;
  140. margin-left: auto;
  141. margin-right: auto;
  142. margin-bottom: 20px;
  143. border-radius: 175px;
  144. -webkit-border-radius: 175px;
  145. -moz-border-radius: 175px;
  146. }
  147.  
  148. #circle img {
  149. height: 250px;
  150. width: 250px;
  151. margin-left: auto;
  152. margin-right: auto;
  153. border-radius: 175px;
  154. -webkit-border-radius: 175px;
  155. -moz-border-radius: 175px;
  156. transition: 0.3s ease-in-out;
  157. -webkit-transition: 0.3s ease-in-out;
  158. -moz-transition: 0.3s ease-in-out;
  159. position: absolute;
  160. z-index: 2;
  161. }
  162.  
  163. #circle img:hover {
  164. opacity: 0.06;
  165. transform: rotate(360deg);
  166. -webkit-transform: rotate(360deg);
  167. -moz-transform: rotate(360deg);
  168. -ms-transform: rotate(360deg);
  169. }
  170.  
  171. #circle .text {
  172. color: {color:Text};
  173. text-align: center;
  174. width: 230px;
  175. margin: 10px;
  176. word-wrap: break-word;
  177. position: relative;
  178. top: 50%;
  179. transform: translateY(-50%);
  180. -webkit-transform: translateY(-50%);
  181. -moz-transform: translateY(-50%);
  182. -ms-transform: translateY(-50%);
  183. z-index: 1;
  184. }
  185.  
  186. .navi_title {
  187. color: {color:Navigation Title};
  188. font-family: {font:Title};
  189. font-size: 20px;
  190. text-align: center;
  191. margin-bottom: -10px;
  192. }
  193.  
  194. ul.navi {
  195. background-color: {color:Navigation Background};
  196. color: {color:Navigation Links};
  197. text-align: center;
  198. width: 200px;
  199. margin-left: auto;
  200. margin-right: auto;
  201. padding: 10px;
  202. list-style: none;
  203. }
  204.  
  205. ul.navi a {
  206. color: {color:Navigation Links};
  207. text-decoration: none;
  208. }
  209.  
  210. li.navi {
  211. padding: 5px;
  212. transition: 0.2s ease-in-out;
  213. -webkit-transition: 0.2s ease-in-out;
  214. -moz-transition: 0.2s ease-in-out;
  215. }
  216.  
  217. li.navi a { display: block; }
  218.  
  219. li.navi:hover { background-color: {color:Navigation Hover}; }
  220.  
  221. /* PAGINATION */
  222. #pag {
  223. float: left;
  224. z-index: 5;
  225. margin-left: 300px;
  226. width: 50px;
  227. position: fixed;
  228. }
  229.  
  230. #pag .arrowtop { padding: 200px 0px; }
  231.  
  232. #pag .arrowtop a {
  233. color: {color:Pagination Hover};
  234. background-color: {color:Pagination Background};
  235. padding: 5px 10px;
  236. transition: 0.3s ease-in-out;
  237. -webkit-transition: 0.3s ease-in-out;
  238. -moz-transition: 0.3s ease-in-out;
  239. }
  240.  
  241. #pag .arrowtop a:hover {
  242. color: {color:Pagination Background};
  243. background-color: {color:Pagination Hover};
  244. padding: 5px 20px;
  245. }
  246.  
  247. #pag .arrowbot { margin-top: -180px; }
  248.  
  249. #pag .arrowbot a {
  250. color: {color:Pagination Hover};
  251. background-color: {color:Pagination Background};
  252. padding: 5px 25px;
  253. transition: 0.3s ease-in-out;
  254. -webkit-transition: 0.3s ease-in-out;
  255. -moz-transition: 0.3s ease-in-out;
  256. }
  257.  
  258. #pag .arrowbot a:hover {
  259. color: {color:Pagination Background};
  260. background-color: {color:Pagination Hover};
  261. padding: 5px 35px;
  262. }
  263.  
  264. /* POST INFO *//* CODE BY STRIVEATTEMPTFAIl */
  265. #info {
  266. opacity: 0;
  267. border-left: 2px solid {color:Lines};
  268. margin-right: -150px;
  269. margin-top: 30px;
  270. padding-left: 10px;
  271. padding-right: 30px;
  272. float: right;
  273. transition: 0.2s ease-in-out;
  274. -webkit-transition: 0.2s ease-in-out;
  275. -moz-transition: 0.2s ease-in-out;
  276. }
  277.  
  278. #info .info1 a { color: {color:Link}; }
  279.  
  280. #info .info1 a:hover { color: {color:Link Hover}; }
  281.  
  282. #info .info2 { margin-top: 3px; }
  283.  
  284. #info .info2 a {
  285. font-size: 11px;
  286. font-style: none;
  287. }
  288.  
  289. #info .info2 a:hover {
  290. font-style: italic;
  291. }
  292.  
  293. #info .info3 {
  294. margin-top: 5px;
  295. margin-bottom: 2px;
  296. margin-left: -20px;
  297. opacity: 0.8;
  298. }
  299.  
  300. #info .info3 li {
  301. padding-right: 10px;
  302. float: left;
  303. display: inline;
  304. list-style-type: none;
  305. }
  306.  
  307. /* POSTS */
  308. #container {
  309. width: 550px;
  310. padding-top: 20px;
  311. margin-left: 450px;
  312. }
  313.  
  314. #post {
  315. width: 500px;
  316. z-index: 20;
  317. margin: 20px;
  318. }
  319.  
  320. #post:hover #info { opacity: 1; }
  321.  
  322. .post {
  323. padding: 15px;
  324. border-bottom: 2px solid {color:Lines};
  325. }
  326.  
  327. .photo {
  328. padding: 15px;
  329. border-bottom: 2px solid {color:Lines};
  330. }
  331.  
  332. .post_link {
  333. padding: 15px;
  334. border-bottom: 2px solid {color:Lines};
  335. }
  336.  
  337. .post_link_etc {
  338. font-size: 12px;
  339. font-style: italic;
  340. margin-left: 20px;
  341. padding-left: 10px;
  342. border-left: 1.5px solid {color:Lines};
  343. }
  344.  
  345. .quote {
  346. padding: 15px;
  347. border-bottom: 2px solid {color:Lines};
  348. }
  349.  
  350. .quote .quotation {
  351. opacity: .1;
  352. height: 35px;
  353. font-family: {font:Title};
  354. font-size: 100px;
  355. }
  356.  
  357. .quote h1 {
  358. font-family: {font:Title};
  359. font-size: 25px;
  360. margin: 0px 25px;
  361. line-height: 1em;
  362. }
  363.  
  364. .quote_source { margin: 10px 0px; }
  365.  
  366. .chat {
  367. padding: 15px;
  368. border-bottom: 2px solid {color:Lines};
  369. }
  370.  
  371. .chat ul {
  372. list-style: none;
  373. margin: 0;
  374. padding: 0;
  375. border-bottom: 0px solid;
  376. }
  377.  
  378. .chat li {
  379. padding: 0.5% 2%;
  380. border-left: 1.5px solid {color:Lines};
  381. }
  382.  
  383. /* QUESTION POSTS *//* CODE BY STRIVEATTEMPTFAIl */
  384. #ask_post { border-bottom: 2px solid {color:Lines}; }
  385.  
  386. #ask_post .asker {
  387. background-color: {color:Pagination Background};
  388. padding: 10px 0px 10px 10px;
  389. font-size: 17px;
  390. font-weight: bold;
  391. }
  392.  
  393. #ask_post .asker span {
  394. padding-left: 7px;
  395. font-size: 17px;
  396. }
  397.  
  398. #ask_post .asker a {
  399. font-size: 17px;
  400. font-weight: bold;
  401. }
  402.  
  403. #ask_post .asker_quest {
  404. font-size: 14px;
  405. font-weight: normal;
  406. padding: 10px;
  407. margin-left: 25px;
  408. border-left: 2px solid {color:Lines};
  409. }
  410.  
  411. #ask_post .answer {
  412. background-color: {color:Pagination Background};
  413. padding: 10px 0px 10px 20px;
  414. font-size: 17px;
  415. font-weight: bold;
  416. }
  417.  
  418. #ask_post .answer span {
  419. padding-left: 7px;
  420. font-size: 17px;
  421. }
  422.  
  423. #ask_post .answer a {
  424. font-size: 17px;
  425. font-weight: bold;
  426. }
  427.  
  428. #ask_post .answer_ans {
  429. font-size: 14px;
  430. font-weight: normal;
  431. padding: 1px 10px;
  432. margin-left: 25px;
  433. border-left: 2px solid {color:Lines};
  434. }
  435.  
  436. /* POST FOOTER */
  437. #footer {
  438. margin-top: 6px;
  439. word-wrap: break-word;
  440. }
  441.  
  442. a.footer {
  443. font-size: 11px;
  444. margin-right: 10px;
  445. }
  446.  
  447. /* POST NOTES */
  448. #postnotes {
  449. width: 550px;
  450. z-index: 1;
  451. position: relative;
  452. float: right;
  453. margin-top: -10px;
  454. margin-right: 50px;
  455. margin-bottom: 25px;
  456. }
  457.  
  458. .notecontainer {
  459. margin: 20px auto;
  460. width: 500px;
  461. padding: 15px;
  462. font-size: 11px;
  463. }
  464.  
  465. .notecontainer ol.notes {
  466. list-style-type: none;
  467. margin: 0;
  468. padding: 0;
  469. }
  470.  
  471. .notecontainer img.avatar {
  472. margin-right: 10px;
  473. width: 16px;
  474. height: 16px;
  475. }
  476.  
  477. /* CREDIT *//* CODE BY STRIVEATTEMPTFAIl */
  478. #foo {
  479. position: fixed;
  480. bottom: 5px;
  481. right: 5px;
  482. transition: all 0.75s ease-in-out;
  483. -webkit-transition: all 0.75s ease-in-out;
  484. -moz-transition: all 0.75s ease-in-out;
  485. -o-transition: all 0.75s ease-in-out;
  486. }
  487.  
  488. #foo:hover {
  489. transform: translate(0,-10px);
  490. -webkit-transform: translate(0,-10px);
  491. -o-transform: translate(0,-10px);
  492. -moz-transform: translate(0,-10px);
  493. }
  494.  
  495. /* SCROLLBAR */
  496. body::-webkit-scrollbar {
  497. width: 0.5em;
  498. height: 0.5em;
  499. }
  500.  
  501. body::-webkit-scrollbar-track {
  502. background-color: {color:Pagination Background};
  503. }
  504.  
  505. body::-webkit-scrollbar-thumb {
  506. background-color: {color:Pagination Hover};
  507. }
  508.  
  509. body::-webkit-scrollbar-corner {
  510. background-color: {color:Pagination Hover};
  511. }
  512.  
  513. {CustomCSS}
  514.  
  515. </style>
  516. </head>
  517.  
  518. <body>
  519.  
  520. <div id="sidebar">
  521. <div class="title"><a href="/">{Title}</a></div>
  522. <div id="circle">
  523. <img src="{image:Sidebar Circle Image}">
  524. <div class="text">{Description}</div>
  525. </div>
  526.  
  527. <div class="navi_title">navigation</div>
  528. <div id="navihov">
  529. <ul class="navi">
  530. <li class="navi"><a href="/archive">Archive</a></li>
  531. {block:AskEnabled}<li class="navi"><a href="/ask">{AskLabel}</a></li>
  532. {/block:AskEnabled}
  533. {block:SubmissionsEnabled}<li class="navi"><a href="/submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled}
  534. {block:HasPages}
  535. {block:Pages}<li class="navi"><a href="{URL}">{Label}</a></li>{/block:Pages}
  536. {/block:HasPages}
  537. </ul></div>
  538. </div>
  539.  
  540. <!------------CODE BY STRIVEATTEMPTFAIL, please don't steal------------>
  541.  
  542. {block:Pagination}
  543. <div id="pag">
  544. {block:NextPage}<div class="arrowtop"><a href="{NextPage}">&rarr;</a></div>{/block:NextPage}
  545. {block:PreviousPage}<div class="arrowbot"><a href="{PreviousPage}">&larr;</a></div>{/block:PreviousPage}
  546. </div>
  547. {/block:Pagination}
  548.  
  549. <div id="container">
  550. {block:Posts}
  551. <div id="post">
  552.  
  553. <div id="info">
  554. {block:Date}<div class="info1"><a href="{Permalink}" title="Permalink">{TimeAgo}</a></div>{/block:Date}
  555. {block:NoteCount}
  556. <div class="info2"><a href="{Permalink}#postnotes">{NoteCountWithLabel}</a></a></div>
  557. {/block:NoteCount}
  558. <div class="info3">
  559. <ul class="info3">
  560. <li>{ReblogButton size="15}</li>
  561. <li>{LikeButton size="15"}</li>
  562. </ul></div>
  563. </div>
  564.  
  565. {block:Text}
  566. <div class="post">
  567. {block:Title}
  568. <h3>{Title}</h3>
  569. {/block:Title}
  570. {Body}
  571. </div>
  572. {/block:Text}
  573.  
  574. {block:Photo}
  575. <div class="photo">
  576. <img src="{PhotoURL-500}" alt="{PhotoAlt}">
  577. {block:Caption} {Caption} {/block:Caption}
  578. </div>
  579. {/block:Photo}
  580.  
  581. {block:Panorama}
  582. <div class="photo">
  583. {LinkOpenTag}
  584. <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
  585. {LinkCloseTag}{block:Caption}
  586. <div class="caption">{Caption}</div>
  587. {/block:Caption}
  588. </div>
  589. {/block:Panorama}
  590.  
  591. {block:Photoset}
  592. <div class="photo">
  593. {Photoset-500}{block:Caption}
  594. <div class="caption">{Caption}</div>
  595. {/block:Caption}
  596. </div>
  597. {/block:Photoset}
  598.  
  599. <!------------CODE BY STRIVEATTEMPTFAIL, please don't steal------------>
  600.  
  601. {block:Link}
  602. <div class="post_link">
  603. <h3><a href="{URL}" {Target} target="_blank">{Name} &rarr;</a></h3>
  604. <div class="post_link_etc">{block:Excerpt} {Excerpt} {/block:Excerpt}{block:Author} &harr; (via {Author}) {/block:Author}</div>
  605. {block:Description}
  606. {Description}
  607. {/block:Description}
  608. </div>
  609. {/block:Link}
  610.  
  611. {block:Quote}
  612. <div class="quote">
  613. <div class="quotation">&ldquo;</div>
  614. <h1>{Quote}</h1>
  615. {block:Source}
  616. <div class="quote_source">&mdash;&ensp;{Source}</div>
  617. {/block:Source}
  618. </div>
  619. {/block:Quote}
  620.  
  621. {block:Audio}
  622. <div class="post">
  623. {AudioEmbed}{block:Caption}
  624. {Caption}
  625. {/block:Caption}
  626. </div>
  627. {/block:Audio}
  628.  
  629. {block:Video}
  630. <div class="post">
  631. {Video-500}{block:Caption}
  632. {Caption}
  633. {/block:Caption}
  634. </div>
  635. {/block:Video}
  636.  
  637. {block:Chat}
  638. <div class="chat">
  639. {block:Title}
  640. <h3>{Title}</h3>
  641. {/block:Title}
  642.  
  643. <ul class="chat">
  644. {block:Lines}
  645. <li class="{Alt} user_{UserNumber}">
  646. {block:Label}
  647. <span class="label">{Label}</span>
  648. {/block:Label}{Line}
  649. </li>
  650. {/block:Lines}
  651. </div>
  652. </ul>
  653. {/block:Chat}
  654.  
  655. {block:Answer}
  656. <div id="ask_post">
  657. <div class="asker">{Asker}<span class="asker">asks:</span></div>
  658. <div class="asker_quest">{Question}</div>
  659.  
  660. {block:Answerer}
  661. <div class="answer">{Answerer}<span class="answer">says:</span></div>
  662. <div class="answer_ans">{Answer}</div>
  663. {/block:Answerer}
  664.  
  665. <div class="replies">{Replies}</div>
  666. </div>
  667. {/block:Answer}
  668.  
  669. <div id="footer"></div>
  670. {block:HasTags}{block:Tags}
  671. <a class="footer" href="{TagURL}">#{Tag}</a>
  672. {/block:Tags}{/block:HasTags}
  673.  
  674. <!------------CODE BY STRIVEATTEMPTFAIL, please don't steal------------>
  675.  
  676. </div>
  677. {/block:Posts}
  678.  
  679. {block:PostNotes}
  680. <div id="postnotes">
  681. <div class="notecontainer">{PostNotes-16}</div>
  682. </div>
  683. {/block:PostNotes}
  684.  
  685. </div>
  686.  
  687. <!-----------------THEME CREDIT, please don't remove!----------------->
  688. <div id="foo"><a href="http://striveattemptfail.tumblr.com" title="theme credit" target="_blank">&#9903;</a></div>
  689. </div>
  690.  
  691. </body>
  692. </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!