Advertisement
jojiwoji

fiction

Aug 27th, 2014
7,851
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.37 KB | None | 0 0
  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. <head>
  5.  
  6. <title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  10.  
  11. <meta name="color:background" content="#fff"/>
  12. <meta name="color:text" content="#000"/>
  13. <meta name="color:title" content="#000"/>
  14. <meta name="color:link" content="#000"/>
  15. <meta name="color:hover" content="#eee"/>
  16. <meta name="color:accent 1" content="#000"/>
  17. <meta name="color:accent 2" content="#fff"/>
  18. <meta name="color:shadows" content="#eee"/>
  19.  
  20. <meta name="image:sidebar img" content="">
  21. <meta name="image:info img" content="">
  22.  
  23. <meta name="if:sidebar image" content="1"/>
  24. <meta name="if:info image" content="0"/>
  25.  
  26. <meta name="text:sidebar title" content=""/>
  27.  
  28. <meta name="text:inbox title" content="say something"/>
  29. <meta name="text:info title" content="name. age. mbti."/>
  30. <meta name="text:links title" content="navigate"/>
  31. <meta name="text:url" content=""/>
  32. <meta name="text:link 1" content="link 1"/>
  33. <meta name="text:link 1 url" content="/"/>
  34. <meta name="text:link 2" content="link 2"/>
  35. <meta name="text:link 2 url" content="/"/>
  36. <meta name="text:link 3" content="link 3"/>
  37. <meta name="text:link 3 url" content="/"/>
  38. <meta name="text:link 4" content="link 4"/>
  39. <meta name="text:link 4 url" content="/"/>
  40. <meta name="text:link 5" content="link 5"/>
  41. <meta name="text:link 5 url" content="/"/>
  42. <meta name="text:link 6" content="link 6"/>
  43. <meta name="text:link 6 url" content=""/>
  44. <meta name="text:info content" content="put some information about you here and maybe a cool quote to jazz it up or feel free to use this space for updates etc. go wild! you can fill out your info here or in the html its up to you"/>
  45.  
  46. <!-- TOOLTIPS-->
  47.  
  48. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  49.  
  50. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  51.  
  52. <script>
  53. (function($){
  54. $(document).ready(function(){
  55. $("a[title]").style_my_tooltips({
  56. tip_follows_cursor:true,
  57. tip_delay_time:30,
  58. tip_fade_speed:300,
  59. attribute:"title"
  60. });
  61. });
  62. })(jQuery);
  63.  
  64. </script>
  65.  
  66. <!---DROPDOWNS--->
  67.  
  68. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  69.  
  70. <script>
  71. $(document).ready(function(){
  72. $(".inbox").click(function(){
  73. $(".mail").toggleClass("yo");
  74. $(".info").removeClass("yo");
  75. $(".links").removeClass("yo");
  76. });
  77. });
  78. </script>
  79.  
  80. <script>
  81. $(document).ready(function(){
  82. $(".linkies").click(function(){
  83. $(".links").toggleClass("yo");
  84. $(".mail").removeClass("yo");
  85. $(".info").removeClass("yo");
  86. });
  87. });
  88. </script>
  89.  
  90. <script>
  91. $(document).ready(function(){
  92. $(".about").click(function(){
  93. $(".info").toggleClass("yo");
  94. $(".mail").removeClass("yo");
  95. $(".links").removeClass("yo");
  96. });
  97. });
  98. </script>
  99.  
  100. <style type="text/css">
  101.  
  102. /*GENERAL*/
  103.  
  104. body {
  105. background:{color:background};
  106. font-size:11px;
  107. font-family:helvetica;
  108. text-align:left;
  109. color:{color:text};
  110. }
  111.  
  112. a {
  113. color:{color:link};
  114. text-decoration:none;
  115. transition-duration: 0.4s;
  116. -moz-transition:all ease-in-out 0.4s;
  117. -ms-transition:all ease-in-out 0.4s;
  118. -o-transition:all ease-in-out 0.4s;
  119. transition:all ease-in-out 0.4s;
  120. }
  121.  
  122. a:hover {
  123. color:{color:hover};
  124. transition-duration: 0.4s;
  125. -moz-transition:all ease-in-out 0.4s;
  126. -ms-transition:all ease-in-out 0.4s;
  127. -o-transition:all ease-in-out 0.4s;
  128. transition:all ease-in-out 0.4s;
  129. }
  130.  
  131. h1 {
  132. text-align:center;
  133. text-transform:uppercase;
  134. font-size:16px;
  135. font-weight:bold;
  136. padding:8px;
  137. border-bottom:solid 1px {color:accent 2};
  138. }
  139.  
  140. blockquote {
  141. padding-left:5px;
  142. border-left:1px solid {color:accent 1};
  143. }
  144.  
  145. blockquote blockquote {
  146. padding-left:10px;
  147. border-left:2px solid {color:accent 1};
  148. }
  149.  
  150. /*SIDEBAR*/
  151.  
  152. #sidebar {
  153. margin-left:175px;
  154. position:fixed;
  155. margin-top:20px;
  156. width:150px;
  157. border-left:1px solid {color:accent 1};
  158. {block:IfNotSidebarImage}
  159. padding:15px 0
  160. {/block:IfNotSidebarImage}
  161. {block:IfSidebarImage}
  162. padding:25px 0;
  163. {/block:IfSidebarImage}
  164. }
  165.  
  166. #sidebar img {
  167. height:100px;
  168. width:100px;
  169. margin-left:24px;
  170. box-shadow: 3px 3px 5px {color:shadows};
  171. }
  172.  
  173. /*TITLE*/
  174.  
  175. #blogt {
  176. letter-spacing:4px;
  177. font-size:16px;
  178. {block:IfSidebarImage}
  179. margin-top:15px;
  180. {/block:IfSidebarImage}
  181. margin-left:24px;
  182. text-transform:uppercase;
  183. transition-duration: 0.6s;
  184. -moz-transition:all ease-in-out 0.6s;
  185. -ms-transition:all ease-in-out 0.6s;
  186. -o-transition:all ease-in-out 0.6s;
  187. transition:all ease-in-out 0.6s;
  188. }
  189.  
  190. #blogt a {
  191. color:{color:title};
  192. transition-duration: 0.6s;
  193. -moz-transition:all ease-in-out 0.6s;
  194. -ms-transition:all ease-in-out 0.6s;
  195. -o-transition:all ease-in-out 0.6s;
  196. transition:all ease-in-out 0.6s;
  197. }
  198.  
  199. #blogt a:hover {
  200. text-shadow: 2px 2px 4px {color:shadows};
  201. }
  202.  
  203. /*DESCRIPTION*/
  204.  
  205. #desc {
  206. width:110px;
  207. margin:10px 0px 0px 24px;
  208. font-size:11px;
  209. line-height:120%;
  210. }
  211.  
  212. /*NAVIGATION*/
  213.  
  214. .header {
  215. width:100%;
  216. background:{color:accent 1};
  217. top:0;
  218. left:0;
  219. height:100px;
  220. position:fixed;
  221. margin:0 auto;
  222. letter-spacing:4px;
  223. font-size:11px;
  224. text-transform:uppercase;
  225. text-align:center;
  226. z-index:2;
  227. }
  228.  
  229. #navi {
  230. margin:32px auto 0 -20px;
  231. }
  232.  
  233. #navi a, .inbox, .linkies, .about {
  234. color:{color:accent 2};
  235. border-bottom:solid 1px {color:accent 2};
  236. margin-left:20px;
  237. padding:5px 7px;
  238. display:inline-block;
  239. transition-duration: 0.6s;
  240. -moz-transition:all ease-in-out 0.6s;
  241. -ms-transition:all ease-in-out 0.6s;
  242. -o-transition:all ease-in-out 0.6s;
  243. transition:all ease-in-out 0.6s;
  244. }
  245.  
  246. #navi a:hover, .inbox:hover, .linkies:hover, .about:hover {
  247. cursor:help;
  248. border-bottom:solid 1px {color:accent 1};
  249. transition-duration: 0.6s;
  250. -moz-transition:all ease-in-out 0.6s;
  251. -ms-transition:all ease-in-out 0.6s;
  252. -o-transition:all ease-in-out 0.6s;
  253. transition:all ease-in-out 0.6s;
  254. }
  255.  
  256. .mail {
  257. width:100%;
  258. background:{color:accent 1};
  259. overflow:hidden;
  260. color:{color:accent 2};
  261. top:0;
  262. left:0;
  263. height:0px;
  264. transition-duration: 0.6s;
  265. -moz-transition:all ease-in-out 0.6s;
  266. -ms-transition:all ease-in-out 0.6s;
  267. -o-transition:all ease-in-out 0.6s;
  268. transition:all ease-in-out 0.6s;
  269. }
  270.  
  271. .links {
  272. width:100%;
  273. background:{color:accent 1};
  274. overflow:hidden;
  275. top:0;
  276. left:0;
  277. height:0px;
  278. transition-duration: 0.6s;
  279. -moz-transition:all ease-in-out 0.6s;
  280. -ms-transition:all ease-in-out 0.6s;
  281. -o-transition:all ease-in-out 0.6s;
  282. transition:all ease-in-out 0.6s;
  283. }
  284.  
  285. .info {
  286. width:100%;
  287. background:{color:accent 1};
  288. color:{color:accent 2};
  289. overflow:hidden;
  290. left:0;
  291. height:0px;
  292. transition-duration: 0.6s;
  293. -moz-transition:all ease-in-out 0.6s;
  294. -ms-transition:all ease-in-out 0.6s;
  295. -o-transition:all ease-in-out 0.6s;
  296. transition:all ease-in-out 0.6s;
  297. }
  298.  
  299. .yo {
  300. height:1000%;
  301. }
  302.  
  303. /*INFO*/
  304.  
  305. #info {
  306. width:380px;
  307. text-transform:none;
  308. text-align:center;
  309. letter-spacing:0px;
  310. margin:0 auto;
  311. font-size:12px;
  312. }
  313.  
  314. #info img {
  315. height:100px;
  316. width:100px;
  317. margin:100px auto -60px;
  318. box-shadow: 0px 0px 5px {color:accent 2};
  319. border-radius:100%;
  320. }
  321.  
  322. /*LINKS*/
  323.  
  324. #links {
  325. text-align:center;
  326. margin-top:10px;
  327. display:inline-block;
  328. margin-left:-20px;
  329. transition-duration: 0.4s;
  330. -moz-transition:all ease-in-out 0.4s;
  331. -ms-transition:all ease-in-out 0.4s;
  332. -o-transition:all ease-in-out 0.4s;
  333. transition:all ease-in-out 0.4s;
  334. }
  335.  
  336. #links a {
  337. width:170px;
  338. color:{color:accent 2};
  339. border:solid 1px {color:accent 2};
  340. padding:20px 7px;
  341. margin:15px 0 0 20px;
  342. text-transform:uppercase;
  343. display:inline-block;
  344. transition-duration: 0.4s;
  345. -moz-transition:all ease-in-out 0.4s;
  346. -ms-transition:all ease-in-out 0.4s;
  347. -o-transition:all ease-in-out 0.4s;
  348. transition:all ease-in-out 0.4s;
  349. }
  350.  
  351. #links a:hover {
  352. background:{color:accent 2};
  353. color:{color:accent 1};
  354. transition-duration: 0.4s;
  355. -moz-transition:all ease-in-out 0.4s;
  356. -ms-transition:all ease-in-out 0.4s;
  357. -o-transition:all ease-in-out 0.4s;
  358. transition:all ease-in-out 0.4s;
  359. }
  360.  
  361. #ttt {
  362. text-align:center;
  363. text-transform:uppercase;
  364. font-size:16px;
  365. font-weight:bold;
  366. padding:8px 0;
  367. margin:90px auto 10px auto;
  368. color:{color:accent 2};
  369. border-bottom:solid 1px {color:accent 2};
  370. width:380px;
  371. }
  372.  
  373. /*PAGI*/
  374.  
  375. #pagi {
  376. margin:40px auto 100px auto;
  377. text-align:center;
  378. width:370px;
  379. word-spacing:5px;
  380. font-size:12px;
  381. padding:15px;
  382. border-top:solid 1px {color:accent 1};
  383. }
  384.  
  385. /*POSTS*/
  386.  
  387. #entries {
  388. width:400px;
  389. margin:175px auto 160px auto;
  390. }
  391.  
  392. #posts {
  393. margin-top:130px;
  394. width:400px;
  395. z-index:1;
  396. transition-duration: 0.6s;
  397. -moz-transition:all ease-in-out 0.6s;
  398. -ms-transition:all ease-in-out 0.6s;
  399. -o-transition:all ease-in-out 0.6s;
  400. transition:all ease-in-out 0.6s;
  401. }
  402.  
  403. .caption {
  404. width:100%;
  405. }
  406.  
  407. #posts img, #posts li, #posts blockquote {max-width: 100%; height:auto;}
  408.  
  409. /*QUOTES*/
  410.  
  411. #quote {
  412. text-align:center;
  413. font-size:14px;
  414. padding:8px;
  415. font-weight:bold;
  416. }
  417.  
  418. #source {
  419. text-align:center;
  420. font-size:12px;
  421. padding:8px;
  422. border-top:solid 1px {color:accent 1};
  423. }
  424.  
  425. /*AUDIO*/
  426.  
  427. .audioplayer {
  428. width:200px;
  429. height:30px;
  430. overflow:hidden;
  431. margin:0 auto;
  432. }
  433.  
  434. .audioinfo {
  435. border-top:solid 1px {color:accent 1};
  436. padding:12px 0;
  437. text-align:center;
  438. margin-top:10px;
  439. font-size:12px;
  440. }
  441.  
  442. /*CHAT*/
  443.  
  444. .chat ol {
  445. padding:0;
  446. list-style:none;
  447. }
  448.  
  449. .line {
  450. padding:5px 0;
  451. }
  452.  
  453. /*ASKS*/
  454.  
  455. .asker {
  456. width:100%;
  457. text-align:center;
  458. text-transform:uppercase;
  459. padding:2px 0;
  460. }
  461.  
  462. .question {
  463. font-size:12px;
  464. margin-top:5px;
  465. padding:2px 0 8px 0;
  466. width:100%;
  467. border-bottom:solid 1px {color:accent 1};
  468. text-align:center;
  469. }
  470.  
  471. .reply {
  472. text-align:center;
  473. font-size:12px;
  474. }
  475.  
  476. /*POST INFO*/
  477.  
  478. #permalink {
  479. font-size:9px;
  480. text-align:center;
  481. margin-top:10px;
  482. width:400px;
  483. font-weight:bold;
  484. {block:indexpage}
  485. opacity:0;
  486. {/block:indexpage}
  487. transition-duration: 0.6s;
  488. -moz-transition:all ease-in-out 0.6s;
  489. -ms-transition:all ease-in-out 0.6s;
  490. -o-transition:all ease-in-out 0.6s;
  491. transition:all ease-in-out 0.6s;
  492. }
  493.  
  494. #tags {
  495. text-align:center;
  496. font-size:9px;
  497. font-weight:normal;
  498. width:400px;
  499. margin-top:5px;
  500. }
  501. #tags a {
  502. margin-left:2px;
  503. }
  504.  
  505. #posts:hover #permalink {
  506. opacity:1;
  507. transition-duration: 0.6s;
  508. -moz-transition:all ease-in-out 0.6s;
  509. -ms-transition:all ease-in-out 0.6s;
  510. -o-transition:all ease-in-out 0.6s;
  511. transition:all ease-in-out 0.6s;
  512. }
  513.  
  514. .pagenotes {
  515. {block:IndexPage}
  516. display: none!important;
  517. {/block:IndexPage}
  518. width:400px;
  519. font-size:12px;
  520. text-align:left;
  521. }
  522.  
  523. .pagenotes img {
  524. display:none;
  525. }
  526.  
  527. .pagenotes li {
  528. list-style-type:none;
  529. padding-top:10px;
  530. padding-bottom:10px;
  531. text-align:left;
  532. width:400px;
  533. margin:0 auto;
  534. }
  535.  
  536. /*CREDIT*/
  537.  
  538. #cred {
  539. bottom:10px;
  540. position:fixed;
  541. right:15px;
  542. float:right;
  543. font-weight:bold;
  544. font-size:10px;
  545. }
  546.  
  547. #cred a {
  548. color:{color:text};
  549. }
  550.  
  551. /*TOOLTIP*/
  552.  
  553. #s-m-t-tooltip{
  554. max-width:300px;
  555. margin:10px;
  556. padding:3px 2px;
  557. border:solid 1px {color:accent 2};
  558. background:{color:accent 2};
  559. color:{color:links};
  560. z-index:999999;
  561. font-family:arial;
  562. text-transform:uppercase;
  563. font-size:9px;
  564. }
  565.  
  566. </style>
  567.  
  568. </head>
  569. <body>
  570.  
  571. <div id="sidebar">
  572. {block:IfSidebarImage}
  573. <div id="sidebar img"><img src={image:sidebar img}></div>
  574. {block:IfSidebarImage}
  575. <div id="blogt"><a href="/">{text:sidebar title}</a></div>
  576. <div id="desc">{Description}</div>
  577. </div>
  578.  
  579. <div class="header">
  580. <div id="navi">
  581. <div class="inbox">mail</div>
  582. <div class="linkies">navi</div>
  583. <div class="about">info</div>
  584. <a href="/archive">past</a>
  585. </div>
  586.  
  587. <div class="links">
  588. <div id="ttt">{text:links title}</div>
  589. <div id="links">
  590. <a href="{text:link 1 url}">{text:link 1}</a>
  591. <a href="{text:link 2 url}">{text:link 2}</a><br>
  592. <a href="{text:link 3 url}">{text:link 3}</a>
  593. <a href="{text:link 4 url}">{text:link 4}</a><br>
  594. <a href="{text:link 5 url}">{text:link 5}</a>
  595. <a href="{text:link 6 url}">{text:link 6}</a><br>
  596. </div>
  597. </div>
  598.  
  599. <div class="info">
  600. <div id="info">
  601. {block:IfInfoImage}<img src="{image:info img}">{/block:IfInfoImage}
  602. <div id="ttt">{text:info title}</div>
  603. <p>{text:info content}</p>
  604. </div>
  605. </div>
  606.  
  607. <div class="mail">
  608. <div id="ttt">{text:inbox title}</div>
  609. <p></p><iframe frameborder="0" scrolling="yes" width="400" height="230" src="http://www.tumblr.com/ask_form/{text:url}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe>
  610. </div>
  611.  
  612. </div>
  613.  
  614. <div id="entries">
  615.  
  616. {block:Posts}
  617.  
  618. <div id="posts">
  619.  
  620. <!---QUOTES--->
  621.  
  622. {block:Quote}
  623. <div id="quote">“{Quote}”</div>
  624. <div id="source">{block:Source}{Source}{/block:Source}</div>
  625. {/block:Quote}
  626.  
  627. <!---TEXT--->
  628.  
  629. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  630.  
  631. <!---PHOTOS--->
  632.  
  633. {block:Photo}
  634. {LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}
  635. {/block:Photo}
  636.  
  637. <!---PHOTOSETS--->
  638.  
  639. {block:Photoset}{Photoset-400}{/block:Photoset}
  640.  
  641. <!---VIDEO--->
  642.  
  643. {block:Video}{Video-400}{/block:Video}
  644.  
  645. <!---LINKS--->
  646.  
  647. {block:Link}<h1><a href="{URL}" {Target}>{Name}</h1></a>{block:Description}{Description}{/block:Description}{/block:Link}
  648.  
  649. <!---AUDIO--->
  650.  
  651. {block:Audio}
  652. <div class="audioplayer">{AudioPlayerGrey}</div>
  653. <div class="audioinfo">
  654. {block:TrackName}<b>{TrackName}</b>{/block:TrackName} by {block:Artist}{Artist}{/block:Artist}
  655. </div>
  656. {/block:Audio}
  657.  
  658. <!---CHAT--->
  659.  
  660. {block:Chat}
  661. {block:Title}<h1>{Title}</h1>{/block:Title}
  662. <div class="chat">
  663. <ol>{block:Lines}<li class="line {Alt}">{block:Label}
  664. <span><b>{Label}</b></span>
  665. {/block:Label}{Line}</li>
  666. {/block:Lines}
  667. </ol></div>
  668. {/block:Chat}
  669.  
  670. <!---QUESTIONS--->
  671.  
  672. {block:Answer}
  673. <div class="asker">{Asker} asked</div>
  674. <div class="question">{Question}</div>
  675. <div class="reply">{Answer}</div>
  676. {/block:Answer}
  677.  
  678. <!---CAPTIONS--->
  679.  
  680. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  681.  
  682. <!---PERMALINK--->
  683.  
  684. {block:Date}
  685. <div id="permalink">
  686. <a href="{Permalink}">{block:IndexPage}{24HourWithZero}:{Minutes} {CapitalAmPm}{/block:IndexPage}{block:PermalinkPage}{DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}{/block:PermalinkPage}</a>
  687. {block:NoteCount}| <a href="{Permalink}">+{NoteCount}</a>{/block:NoteCount}
  688. {block:RebloggedFrom}| <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  689. {block:ContentSource}| <a title="by {SourceTitle}" href="{SourceURL}">src</a>{/block:ContentSource}
  690. {/block:Date}
  691.  
  692. {block:HasTags}
  693. <div id="tags">{block:Tags}<a href="{TagUrl}">#{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div>
  694. {block:PostNotes}
  695.  
  696. <div class="pagenotes">
  697. {PostNotes}
  698. </div>
  699.  
  700. {/block:PostNotes}
  701.  
  702. </div>
  703.  
  704. {/block:Posts}
  705.  
  706. </div>
  707.  
  708. {block:Pagination}
  709. <div id="pagi">
  710. {block:PreviousPage}
  711. <a href="{PreviousPage}">BACK</a> | {/block:PreviousPage}
  712. {block:NextPage}<a href="{NextPage}">NEXT</a>{/block:NextPage}
  713. </div>
  714. {/block:Pagination}
  715.  
  716. <div id="cred"><a href="http://sentimentalthemes.tumblr.com">✖</a></div>
  717.  
  718. </body>
  719. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement