API tools faq
paste
Advertisement
franzzfu

Theme 15: Circus

franzzfu
Jul 26th, 2014
1,531
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.41 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3. <title>{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  7.  
  8. <!----
  9.  
  10. theme15 by franz @ lestranqe.tumblr.com/
  11. DO NOT REMOVE THE CREDIT OR LE CIRQUE DES RÊVES WILL TURN INTO LE CIRQUE DU CAUCHEMAR
  12.  
  13. --->
  14.  
  15. <meta name="color:Background" content="#ffffff"/>
  16. <meta name="color:Text" content="#838282"/>
  17. <meta name="color:Link" content="#b8b8b8"/>
  18. <meta name="color:Hover" content=""/>
  19. <meta name="color:Topbar links" content="#e6e6e6">
  20. <meta name="color:Title" content="#000000"/>
  21. <meta name="color:Scrollbar" content="#dfdfdf"/>
  22. <meta name="color:Scrollbar bg" content="#f7f7f7"/>
  23.  
  24. <meta name="if:hide caption" content="1"/>
  25. <meta name="if:500px posts" content="1"/>
  26.  
  27. <meta name="text:link 1 title" content="link 1"/>
  28. <meta name="text:link 1" content=""/>
  29. <meta name="text:link 2 title" content="link 2"/>
  30. <meta name="text:link 2" content=""/>
  31. <meta name="text:link 3 title" content="link 3"/>
  32. <meta name="text:link 3" content=""/>
  33. <meta name="text:link 4 title" content="link 4"/>
  34. <meta name="text:link 4" content=""/>
  35. <meta name="text:link 5 title" content="link 5"/>
  36. <meta name="text:link 5" content=""/>
  37. <meta name="text:link 6 title" content="link 6"/>
  38. <meta name="text:link 6" content=""/>
  39. <meta name="text:previous" content="Back"/>
  40. <meta name="text:next" content="Forth"/>
  41.  
  42.  
  43.  
  44. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  45.  
  46. <style>
  47. div#qTip {
  48. padding: 4px;
  49. display: none;
  50. text-align: center;
  51. position: absolute;
  52. font-size:9px;
  53. line-height:10px;
  54. font-family:baskerville;
  55. z-index: 100000;
  56. background-color: {color:background};
  57. color: {color:text};
  58. text-transform:uppercase;
  59. letter-spacing: 2px;
  60. opacity:1;
  61. }
  62. </style>
  63.  
  64.  
  65. <style type="text/css">
  66.  
  67. ::-webkit-scrollbar {width:5px;
  68. height:auto;
  69. background:{color:scrollbar bg};}
  70. ::-webkit-scrollbar-corner {background:{color:scrollbar bg};}
  71. ::-webkit-scrollbar-thumb:vertical {background:{color:scrollbar};}
  72. ::-webkit-scrollbar-thumb:horizontal {background:{color:scrollbar};}
  73.  
  74. #bite
  75. #bite a{
  76. display:block
  77. }
  78. #bite .death {
  79. margin-top:-50px;
  80. filter: alpha(opacity = 0);
  81. opacity:0;
  82. -webkit-transition: all 0.8s ease-out;
  83. -moz-transition: all 0.8s ease-out;
  84. transition: all 0.8s ease-out;
  85. }
  86.  
  87. #bite:hover .death {
  88. margin-top:2px;
  89. -webkit-transition: all 0.8s ease-out;
  90. -moz-transition: all 0.8s ease-out;
  91. transition: all 0.8s ease-out;
  92. filter: alpha(opacity = 100);
  93. filter: alpha(opacity = 100);
  94. opacity:100;
  95. }
  96.  
  97. /*main structure*/
  98.  
  99.  
  100. body {
  101. background:{color:background};
  102. margin:0px;
  103. color:{color:text};
  104. font-family:baskerville;
  105. font-size:11px;
  106. letter-spacing:1px;
  107. line-height:150%;
  108. }
  109.  
  110. a {
  111. text-decoration:none;
  112. outline:none;
  113. -moz-outline-style:none;
  114. color:{color:link};
  115. -webkit-transition:all .5s ease-in-out;
  116. -moz-transition:all .5s ease-in-out;
  117. transition:all .5s ease-in-out;
  118. }
  119.  
  120. a:hover {
  121. color:{color:hover};
  122. -webkit-transition:all .5s ease-in-out;
  123. -moz-transition:all .5s ease-in-out;
  124. transition:all .5s ease-in-out;
  125. }
  126.  
  127. img {
  128. {block:ifnot500pxposts}
  129. max-width:400px;
  130. {/block:ifnot500pxposts}
  131. {block:if500pxposts}
  132. max-width:500px;
  133. {/block:if500pxposts}
  134. }
  135.  
  136. #caption {
  137. {block:ifnot500pxposts}
  138. width:400px;
  139. {/block:ifnot500pxposts}
  140. {block:if500pxposts}
  141. width:500px;
  142. {/block:if500pxposts}
  143. text-align:center;
  144. margin-top:15px;
  145. }
  146.  
  147. blockquote {
  148. border-top:1px dotted {color:text};
  149. border-bottom:1px dotted {color:text};
  150. {block:ifnot500pxposts}
  151. max-width:390px;
  152. {/block:ifnot500pxposts}
  153. {block:if500pxposts}
  154. max-width:490px;
  155. {/block:if500pxposts}
  156. padding:5px;
  157. }
  158.  
  159. blockquote blockquote {
  160. padding:5px;
  161. {block:ifnot500pxposts}
  162. max-width:380px;
  163. {/block:ifnot500pxposts}
  164. {block:if500pxposts}
  165. max-width:480px;
  166. {/block:if500pxposts}
  167. }
  168.  
  169. #posttitle {
  170. {block:ifnot500pxposts}
  171. width:400px;
  172. {/block:ifnot500pxposts}
  173. {block:if500pxposts}
  174. width:500px;
  175. {/block:if500pxposts}
  176. text-align:center;
  177. font-size:12px;
  178. font-weight:bold;
  179. text-transform:uppercase;
  180. letter-spacing:2px;
  181. line-height:130%;
  182. padding:10px 0;
  183. }
  184.  
  185. #container {
  186. width:500px;
  187. margin-left:auto;
  188. margin-right:auto;
  189. }
  190.  
  191. #entries {
  192. {block:ifnot500pxposts}
  193. width:400px;
  194. {/block:ifnot500pxposts}
  195. {block:if500pxposts}
  196. width:500px;
  197. {/block:if500pxposts}
  198. margin-left:auto;
  199. margin-right:auto;
  200. margin-top:320px;
  201. margin-bottom:150px;
  202. text-align:center;
  203. }
  204.  
  205. #post {
  206. {block:ifnot500pxposts}
  207. max-width:400px;
  208. {/block:ifnot500pxposts}
  209. {block:if500pxposts}
  210. max-width:500px;
  211. {/block:if500pxposts}
  212. width:100%;
  213. margin-top:200px;
  214. margin-bottom:75px;
  215. -ms-word-break: break-all;
  216. word-break: break-all;
  217. word-break: break-word;
  218. -webkit-hyphens: auto;
  219. -moz-hyphens: auto;
  220. -ms-hyphens: auto;
  221. hyphens: auto;
  222. }
  223.  
  224. /*topbar*/
  225.  
  226.  
  227. /*topbar*/
  228.  
  229.  
  230. #topbar {
  231. width:500px;
  232. height:250px;
  233. margin-left:auto;
  234. margin-right:auto;
  235. margin-top:-300px;
  236. text-align:center;
  237. position:fixed;
  238. z-index:5000;
  239. }
  240.  
  241. #title {
  242. margin-top:30px;
  243. margin-bottom:5px;
  244. padding:15px;
  245. font-weight:bold;
  246. font-size:11px;
  247. text-transform:uppercase;
  248. text-align:center;
  249. letter-spacing:2px;
  250. display:inline-block;
  251. }
  252.  
  253. #title a {
  254. color:{color:title};
  255. -webkit-transition:all .5s ease-in-out;
  256. -moz-transition:all .5s ease-in-out;
  257. transition:all .5s ease-in-out;
  258. }
  259.  
  260. #title a:hover {
  261. color:{color:hover};
  262. -webkit-transition:all .5s ease-in-out;
  263. -moz-transition:all .5s ease-in-out;
  264. transition:all .5s ease-in-out;
  265. }
  266.  
  267. .links {
  268. display:inline-block;
  269. }
  270.  
  271. .links a {
  272. background:transparent;
  273. border:1px solid {color:topbar links};
  274. width:8px;
  275. height:8px;
  276. border-radius:8px;
  277. margin: 0 18px;
  278. display:inline-block;
  279. }
  280.  
  281. .links a:hover {
  282. background:{color:topbar links};
  283. border:1px solid {color:topbar links};
  284. }
  285.  
  286. #description {
  287. width:400px;
  288. margin-top:10px;
  289. margin-left:auto;
  290. margin-right:auto;
  291. font-style:italic;
  292. }
  293.  
  294.  
  295. /*post info and tags*/
  296.  
  297.  
  298. #info {
  299. margin-top:15px;
  300. {block:ifnot500pxposts}
  301. max-width:400px;
  302. {/block:ifnot500pxposts}
  303. {block:if500pxposts}
  304. max-width:500px;
  305. {/block:if500pxposts}
  306. font-size:9px;
  307. letter-spacing:2px;
  308. text-align:center;
  309. text-transform:uppercase;
  310. padding:8px;
  311. line-height:150%;
  312. }
  313.  
  314. #info a {
  315. background:transparent;
  316. border:1px solid {color:topbar links};
  317. width:8px;
  318. height:8px;
  319. border-radius:8px;
  320. margin: 0 18px;
  321. display:inline-block;
  322. }
  323.  
  324. #info a:hover {
  325. background:{color:topbar links};
  326. border:1px solid {color:topbar links};
  327. }
  328.  
  329. #tags {
  330. position:absolute;
  331. background:{color:background};
  332. {block:ifnot500pxposts}
  333. width:380px;
  334. {/block:ifnot500pxposts}
  335. {block:if500pxposts}
  336. width:480px;
  337. {/block:if500pxposts}
  338. font-size:9px;
  339. letter-spacing:2px;
  340. text-transform:uppercase;
  341. text-align:center;
  342. padding:10px;
  343. border-top:1px dotted {color:text};
  344. border-bottom:1px dotted {color:text};
  345. opacity:0;
  346. -webkit-transition:all .5s ease-in-out;
  347. -moz-transition:all .5s ease-in-out;
  348. transition:all .5s ease-in-out;
  349. }
  350.  
  351. #post:hover #tags {
  352. opacity:.9;
  353. -webkit-transition:all .5s ease-in-out;
  354. -moz-transition:all .5s ease-in-out;
  355. transition:all .5s ease-in-out;
  356. }
  357.  
  358.  
  359. /*quote*/
  360.  
  361.  
  362. .quote {
  363. text-align:center;
  364. font-size:15px;
  365. line-height:135%;
  366. margin-top:15px;
  367. font-family:baskerville;
  368. font-style:italic;
  369. letter-spacing:2px;
  370. padding:10px;
  371. }
  372.  
  373. .source {
  374. text-align:center;
  375. font-size:9px;
  376. text-transform:uppercase;
  377. font-family:times;
  378. letter-spacing:2px;
  379. padding:5px 0;
  380. }
  381.  
  382.  
  383. /*chat*/
  384.  
  385. .chat ol {
  386. padding:5px;
  387. line-height:150%;
  388. list-style:none;
  389. }
  390.  
  391. .line {
  392. border-bottom:1px dotted {color:text};
  393. padding:15px;
  394. }
  395.  
  396. .label {
  397. text-transform:uppercase;
  398. font-family:times;
  399. font-size:10px;
  400. font-weight:bold;
  401. letter-spacing:2px;
  402. }
  403.  
  404.  
  405. /*audio*/
  406.  
  407.  
  408. .cover {
  409. width:150px;
  410. z-index:1;
  411. }
  412.  
  413. .playbutton {
  414. width:20px;
  415. height:30px;
  416. overflow:hidden;
  417. position:relative;
  418. z-index:1000;
  419. margin:10px 19px 8px 11px;
  420. }
  421.  
  422. .playbox {
  423. background-color:#000;
  424. -webkit-border-radius:50px;
  425. -moz-border-radius:50px;
  426. border-radius:50px;
  427. position:absolute;
  428. z-index:1000;
  429. {block:ifnot500pxposts}
  430. margin-left:170px;
  431. {/block:ifnot500pxposts}
  432. {block:if500pxposts}
  433. margin-left:220px;
  434. {/block:if500pxposts}
  435. margin-top:53px;
  436. opacity:.8;
  437. }
  438.  
  439. .audioinfo {
  440. {block:ifnot500pxposts}
  441. width:400px;
  442. {/block:ifnot500pxposts}
  443. {block:if500pxposts}
  444. width:500px;
  445. {/block:if500pxposts}
  446. margin:10px 0;
  447. line-height:250%;
  448. font-size:8px;
  449. text-transform:uppercase;
  450. }
  451.  
  452.  
  453. /*ask*/
  454.  
  455.  
  456. .ask {
  457. text-align:center;
  458. font-size:10px;
  459. font-weight:bold;
  460. text-transform:uppercase;
  461. }
  462.  
  463. .question {
  464. padding:10px;
  465. text-align:center;
  466. font-style:italic;
  467. font-size:13px;
  468. letter-spacing:2px;
  469. }
  470.  
  471. .answer {
  472. padding:10px 15px;
  473. border-top:1px dotted {color:text};
  474. }
  475.  
  476.  
  477. /*permalinks page*/
  478.  
  479.  
  480. ol.notes {
  481. padding-left:6%;
  482. padding-bottom:2%;
  483. width:100%;
  484. text-align:left;
  485. text-transform:uppercase;
  486. font-size:9px;
  487. letter-spacing:2px;
  488. list-style-type:decimal-leading-zero;
  489. }
  490.  
  491. ol.notes li.note{
  492. padding:2%;
  493. }
  494.  
  495. ol.notes li.note img.avatar{
  496. display:none;
  497. }
  498.  
  499.  
  500. /*pagination*/
  501.  
  502.  
  503. #pagi {
  504. {block:ifnot500pxposts}
  505. width:400px;
  506. {/block:ifnot500pxposts}
  507. width:500px;
  508. {block:if500pxposts}
  509. {/block:if500pxposts}
  510. margin-bottom:80px;
  511. font-size:11px;
  512. letter-spacing:2px;
  513. font-family:times;
  514. font-weight:bold;
  515. text-transform:uppercase;
  516. text-align:center;
  517. margin-left:auto;
  518. margin-right:auto;
  519. }
  520.  
  521. #pagi a {
  522. color:{color:link};
  523. }
  524.  
  525. #pagi a:hover {
  526. color:{color:hover};
  527. }
  528.  
  529. /*credit*/
  530.  
  531.  
  532. #credit {
  533. position:fixed;
  534. float:right;
  535. bottom:5px;
  536. right:5px;
  537. background:transparent;
  538. font-size:20px;
  539. text-align:right;
  540. }
  541.  
  542. #credit a {
  543. color:{color:link};
  544. }
  545.  
  546. #logo {
  547. font-size:10px;
  548. font-family:baskerville;
  549. font-style:italic;
  550. opacity:0;
  551. -webkit-transition:all .5s ease-in-out;
  552. -moz-transition:all .5s ease-in-out;
  553. transition:all .5s ease-in-out;
  554. }
  555.  
  556. #credit:hover #logo {
  557. opacity:1;
  558. -webkit-transition:all .5s ease-in-out;
  559. -moz-transition:all .5s ease-in-out;
  560. transition:all .5s ease-in-out;
  561. }
  562.  
  563.  
  564. {CustomCSS}
  565.  
  566. </style>
  567. </head>
  568.  
  569.  
  570. <body>
  571.  
  572. <div id="container">
  573.  
  574. <div id="bite">
  575. <div id="topbar">
  576. <div class="links">
  577. <a href="{text:link 1}" title="{text:link 1 title}"></a>
  578. <a href="{text:link 2}" title="{text:link 2 title}"></a>
  579. <a href="{text:link 3}" title="{text:link 3 title}"></a>
  580. </div>
  581. <div id="title"><a href="/" title="home">{Title}</a></div>
  582. <div class="links">
  583. <a href="{text:link 4}" title="{text:link 4 title}"></a>
  584. <a href="{text:link 5}" title="{text:link 5 title}"></a>
  585. <a href="{text:link 6}" title="{text:link 6 title}"></a>
  586. </div>
  587. <div class="death"><div id="description">{Description}</div></div>
  588. </div>
  589. </div>
  590.  
  591. <div id="entries">
  592.  
  593. {block:Posts}
  594. <div id="post">
  595.  
  596. {block:HasTags}<div id="tags">{block:Tags}<a href="{TagURL}">{Tag}</a>&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}
  597.  
  598. {block:Text}{block:Title}<div id="posttitle">{Title}</div>{/block:Title}<div id="text">{Body}</div>{/block:Text}
  599.  
  600. {block:Photo}
  601. {block:ifnot500pxposts}
  602. {LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}
  603. {block:ifhidecaption}{block:PermalinkPage}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:PermalinkPage}{/block:ifhidecaption}
  604. {block:ifnothidecaption}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnothidecaption}
  605. {/block:ifnot500pxposts}
  606. {block:if500pxposts}
  607. {LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
  608. {block:ifhidecaption}{block:PermalinkPage}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:PermalinkPage}{/block:ifhidecaption}
  609. {block:ifnothidecaption}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnothidecaption}
  610. {/block:if500pxposts}
  611. {/block:Photo}
  612.  
  613. {block:Photoset}
  614. {block:ifnot500pxposts}{Photoset-400}{block:ifhidecaption}{block:PermalinkPage}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:PermalinkPage}{/block:ifhidecaption}{block:ifnothidecaption}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnothidecaption}{/block:ifnot500pxposts}
  615. {block:if500pxposts}{Photoset-500}{block:ifhidecaption}{block:PermalinkPage}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:PermalinkPage}{/block:ifhidecaption}{block:ifnothidecaption}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnothidecaption}{/block:if500pxposts}
  616. {/block:Photoset}
  617.  
  618. {block:Quote}
  619. <div class="quote">{Quote}</div>
  620. {block:Source}<div class="source">- {Source} -</div>{/block:Source}
  621. {/block:Quote}
  622.  
  623. {block:Link}<div id="posttitle"><a href="{URL}" {Target}>{Name}</a></div>{block:Description}{Description}{/block:Description}{/block:Link}
  624.  
  625. {block:Chat}
  626. {block:Title}<div id="posttitle">{Title}</div>{/block:Title}
  627. <div class="chat"><ol>{block:Lines}<li class="line">{block:Label}<span class="label">{Label}<br></span>{/block:Label}{Line}</li>{/block:Lines}</ol></div>
  628. {/block:Chat}
  629.  
  630. {block:Video}
  631. {block:ifnot500pxposts}{Video-400}{block:ifnothidecaption}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnothidecaption}{/block:ifnot500pxposts}
  632. {block:if500pxposts}{Video-500}{block:ifnothidecaption}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnothidecaption}{/block:if500pxposts}
  633. {block:PermalinkPage}<div id="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:PermalinkPage}
  634. {/block:Video}
  635.  
  636. {block:Answer}
  637. <div class="ask">{Asker}</u> mused<br></div>
  638. <div class="question">{Question}</div>
  639. <div class="answer">{Answer}</div>
  640. {/block:Answer}
  641.  
  642. {block:Audio}
  643. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
  644. {block:AlbumArt}
  645. <img src="{AlbumArtURL}" class="cover">
  646. {/block:AlbumArt}
  647. <div class="audioinfo">
  648. {block:TrackName}{TrackName}{/block:TrackName}<br>
  649. {block:Artist}{Artist}{/block:Artist}<br>
  650. </div>
  651. {/block:Audio}
  652.  
  653. <div id="info">
  654. {block:Date}<a href="{Permalink}" title="{DayOfMonth}.{MonthNumber}.{ShortYear}"></a>{/block:Date}{block:NoteCount}<a href="{Permalink}" title="{NoteCount}+"></a>{/block:NoteCount}<a href="{ReblogURL}" title="reblog" target="_blank"></a>{block:RebloggedFrom}<a href="{ReblogParentURL}"title="via: {ReblogParentName}"></a><a href="{ReblogRootURL}" title="source: {ReblogRootName}"></a>{/block:RebloggedFrom}
  655. </div>
  656.  
  657. </div>
  658.  
  659. {block:ContentSource}
  660. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  661. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  662. {/block:SourceLogo}
  663. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  664. {/block:ContentSource}
  665.  
  666. {block:PostNotes}{PostNotes}{/block:PostNotes}
  667. {/block:Posts}
  668.  
  669. {block:Pagination}
  670. <div id="pagi">
  671. {block:PreviousPage} <a href="{PreviousPage}">&larr; {text:previous}</a>
  672. </u>&nbsp;&nbsp;{/block:PreviousPage}
  673. <span style="font-size:9px;font-family:baskerville;font-weight:normal;font-style:normal;">{CurrentPage}&nbsp;of&nbsp;{TotalPages}</span>
  674. {block:NextPage} &nbsp;&nbsp;<a href="{NextPage}">{text:next} &rarr;</a></u>{/block:NextPage}
  675. {/block:Pagination}
  676. </div>
  677. </div>
  678.  
  679. </div>
  680.  
  681. <div id="credit">
  682. <div id="logo">franztheme</div>
  683. <a href="http://lestranqe.tumblr.com">☺</a>
  684. </div>
  685.  
  686. </body>
  687. </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!