API tools faq
paste
Advertisement
jhxy

theme 001; memento mori

jhxy
Aug 8th, 2014
1,836
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 19.16 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  4. <title>{Title}</title>
  5. <!-- variables -->
  6. <meta name="color:Background" content="#ffffff"/>
  7. <meta name="color:Text" content="#000000"/>
  8. <meta name="color:Link" content="#eeeeee"/>
  9. <meta name="color:Borders" content="#cccccc"/>
  10. <meta name="color:Accent 1" content="#888888"/>
  11. <meta name="color:Accent 2" content="#cccccc"/>
  12. <meta name="color:Accent 3" content="#8ED8D8"/>
  13. <meta name="color:Accent 4" content="#888888"/>
  14. <meta name="text:blog URL" content="/"/>
  15. <meta name="text:Link 1" content="any"/>
  16. <meta name="text:Link 2" content="moment"/>
  17. <meta name="text:Link 3" content="could"/>
  18. <meta name="text:Link 4" content="be"/>
  19. <meta name="text:Link 5" content="our"/>
  20. <meta name="text:Link 6" content="last"/>
  21. <meta name="text:Link 1 URL" content="/"/>
  22. <meta name="text:Link 2 URL" content="/"/>
  23. <meta name="text:Link 3 URL" content="/"/>
  24. <meta name="text:Link 4 URL" content="/"/>
  25. <meta name="text:Link 5 URL" content="/"/>
  26. <meta name="text:Link 6 URL" content="/"/>
  27. <meta name="color:Header" content="#f6f6f6"/>
  28. <meta name="color:Title" content="#ccc"/>
  29.  
  30. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  31. <link href='http://fonts.googleapis.com/css?family=Dosis:200,400,600|Quicksand:300|Montserrat+Alternates|Reenie+Beanie|Meddon|Carme:100|Maven+Pro|Carme' rel='stylesheet' type='text/css'>
  32.  
  33.  
  34.  
  35. <script type="text/javascript"
  36. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  37.  
  38. <style type="text/css">
  39.  
  40. body {
  41. font-family: Quicksand;
  42. font-weight:100;
  43. font-size: 12px;
  44. color: {color:Text};
  45. background-color: {color:Background};
  46. }
  47. h1 {
  48. color:{color:Accent 3};
  49. font-size:14px;
  50. letter-spacing:2px;
  51. }
  52. h3 {
  53. color:{color:Accent 1};
  54. font-size:13px;
  55. text-transform:uppercase;
  56. }
  57. h4 {
  58. color:{color:Accent 1};
  59. font-size:13px;
  60. padding:8px;
  61. border:1px solid {color:Accent 1};
  62. display:inline-block;
  63. text-align:center;
  64. }
  65. h2 {
  66. color: {color:Accent 4};
  67. letter-spacing:2px;
  68. font-family: Quicksand;
  69. background-color:{color:Accent 2};
  70. padding:10px;
  71. text-transform: uppercase;
  72. display:inline-block;
  73. }
  74. a {
  75. text-decoration: none;
  76. color: {color:Accent 1};
  77. -moz-transition-duration: 0.5s;
  78. -o-transition-duration: 0.5s;
  79. -webkit-transition-duration: 0.5s;
  80. transition-duration: 0.5s;
  81. }
  82. a:hover {
  83. text-decoration: none;
  84. color: #444444;
  85. -moz-transition-duration: 0.5s;
  86. -o-transition-duration: 0.5s;
  87. -webkit-transition-duration: 0.5s;
  88. transition-duration: 0.5s;
  89. }
  90. .posts a {
  91. color:{color:Link};
  92. -moz-transition-duration: 0.5s;
  93. -o-transition-duration: 0.5s;
  94. -webkit-transition-duration: 0.5s;
  95. transition-duration: 0.5s;
  96. }
  97. .posts a:hover {
  98. text-decoration:none;
  99. color: {color:Accent 3}
  100. -moz-transition-duration: 0.5s;
  101. -o-transition-duration: 0.5s;
  102. -webkit-transition-duration: 0.5s;
  103. transition-duration: 0.5s;
  104. }
  105. li {
  106. list-style: square;
  107. text-align:left;
  108. }
  109. .posts blockquote {
  110. color:{color:Accent 2};
  111. letter-spacing: 2px;
  112. text-size: 15px;
  113. border:1px solid {color:Borders};
  114. padding:10px;
  115. margin-left:auto;
  116. margin-right:auto;
  117. max-width:400px;
  118. }
  119.  
  120. .block {
  121. text-align: center;
  122. width: 100%;
  123. height: 700px;
  124. }
  125.  
  126. /* The ghost, nudged to maintain perfect centering */
  127. .block:before {
  128. content: '';
  129. display: inline-block;
  130. height: 100%;
  131. vertical-align: middle;
  132. margin-right: -0.25em; /* Adjusts for spacing */
  133. }
  134. .container {
  135. margin-top: 175px;
  136. display: inline-block;
  137. vertical-align: middle;
  138. width: 600px;
  139. }
  140. .header {
  141. width: 100%;
  142. height: 200px;
  143. z-index: 10;
  144. position: absolute;
  145. background-color: {color:Header};
  146. top:0px;
  147. left:0px;
  148. text-align:center;
  149. font-family: Quicksand;
  150. }
  151. .posts {
  152. width: 600px;
  153. margin-top:50px;
  154. padding-top:50px;
  155. padding-bottom:50px;
  156. max-width:600px;
  157. }
  158. #title {
  159. color:{color:Title};
  160. font-size:30px;
  161. letter-spacing:3px;
  162. text-transform:uppercase;
  163. padding-top:50px;
  164. -moz-transition-duration: 0.5s;
  165. -o-transition-duration: 0.5s;
  166. -webkit-transition-duration: 0.5s;
  167. transition-duration: 0.5s;
  168. }
  169. #title a:hover {
  170. color: transparent;
  171. text-shadow: {color:Accent 3} 0 0 5px;
  172. text-decoration:none;
  173. -moz-transition-duration: 0.5s;
  174. -o-transition-duration: 0.5s;
  175. -webkit-transition-duration: 0.5s;
  176. transition-duration: 0.5s;
  177. }
  178. #links {
  179. color:{color:Accent 1};
  180. font-size:30px;
  181. letter-spacing:3px;
  182. word-spacing:10px;
  183. text-transform:uppercase;
  184. z-index:10;
  185. padding-top:0px;
  186. -moz-transition-duration: 0.5s;
  187. -o-transition-duration: 0.5s;
  188. -webkit-transition-duration: 0.5s;
  189. transition-duration: 0.5s;
  190. }
  191. #links a:hover {
  192. color: transparent;
  193. text-shadow: {color:Accent 3}; 0 0 5px;
  194. text-decoration:none;
  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. #description {
  201. color:{color:Accent 2};
  202. letter-spacing:2px;
  203. padding:15px;
  204. font-family:Quicksand;
  205. }
  206. .sub, .sub1 {
  207. margin-top:200px;
  208. padding:10px;
  209. width: 200px;
  210. height:200px;
  211. background-color: {color:Header};
  212. position: fixed;
  213. color: {color:Accent 2};
  214. font-size:12px;
  215. text-transform: lowercase;
  216. letter-spacing:2px;
  217. word-spacing: 3px;
  218. z-index:1;
  219.  
  220. }
  221. .sub {
  222. margin-left:10px;
  223. }
  224. .sub1 {
  225. right:20px;
  226. margin-top:100px;
  227. width:500px;
  228. height:250px;
  229. padding:15px;
  230. }
  231. .sub2 {
  232. margin-top:0;
  233. width:100%;
  234. height:auto;
  235. margin-left:auto;
  236. margin-right:auto;
  237. background-color: {color:Header};
  238. position: absolute;
  239. }
  240. .container .posts .postinfo {
  241. {block:IndexPage}
  242. opacity: 0.0;
  243. position: absolute;
  244. margin-left:500px;
  245. margin-top:-300px;
  246. {/block:IndexPage}
  247. padding: 10px 20px;
  248. width: 200px;
  249. max-width: 300px;
  250. height:auto;
  251. background-color: {color:Background};
  252. -moz-transition-duration: 0.5s;
  253. -o-transition-duration: 0.5s;
  254. -webkit-transition-duration: 0.5s;
  255. transition-duration: 0.5s;}
  256. {block:IndexPage}
  257.  
  258. .container .posts:hover .postinfo {
  259. opacity:1;
  260. position:absolute;
  261. -moz-transition-duration: 0.5s;
  262. -o-transition-duration: 0.5s;
  263. -webkit-transition-duration: 0.5s;
  264. transition-duration: 0.5s;
  265. }
  266. {/block:IndexPage}
  267. .likebu, .reblogbu {
  268. display:inline-block;
  269. padding:7px;
  270. }
  271. .quest {
  272. border: 1px solid {color:Borders};
  273. width:400px;
  274. margin-left:auto;
  275. margin-right:auto;
  276. }
  277. .question a {
  278. color: {color:Link};
  279. -moz-transition-duration: 0.5s;
  280. -o-transition-duration: 0.5s;
  281. -webkit-transition-duration: 0.5s;
  282. transition-duration: 0.5s;
  283. }
  284. .question a:hover {
  285. color: {color:Accent 3};
  286. -moz-transition-duration: 0.5s;
  287. -o-transition-duration: 0.5s;
  288. -webkit-transition-duration: 0.5s;
  289. transition-duration: 0.5s;
  290. }
  291. .question {
  292. width:400px;
  293. margin-left:auto;
  294. margin-right:auto;
  295. }
  296. .quote {
  297. width:400px;
  298. }
  299. .tags {
  300. border:1px {color:Borders} solid;
  301. padding:10px;
  302. max-width:400px;
  303. margin-left:auto;
  304. margin-right:auto;
  305. margin-top:20px;
  306. }
  307. .nav a{
  308. display:inline-block;
  309. color: {color:Accent 3};
  310. font-size:15px;
  311. letter-spacing:3px;
  312. text-transform:uppercase;
  313. padding:5px;
  314. margin-bottom:50px;
  315. margin-top:20px;
  316. -moz-transition-duration: 0.5s;
  317. -o-transition-duration: 0.5s;
  318. -webkit-transition-duration: 0.5s;
  319. transition-duration: 0.5s;
  320. }
  321. .nav a:hover {
  322. color: transparent;
  323. text-shadow: {color:Accent 3} 0 0 5px;
  324. text-decoration:none;
  325. -moz-transition-duration: 0.5s;
  326. -o-transition-duration: 0.5s;
  327. -webkit-transition-duration: 0.5s;
  328. transition-duration: 0.5s;
  329. }
  330.  
  331. .notes li:nth-child(odd) {
  332. background-color:#F6F6F6;
  333. color:#222;
  334. padding:5px;
  335. list-style:upper-roman;
  336. }
  337. .notes li:nth-child(even) {
  338. background-color: {color:Background} ;
  339. color:#888;
  340. padding:5px;
  341. list-style:upper-roman;
  342. }
  343.  
  344. ol {
  345. list-style:decimal-leading-zero;
  346. text-align:left;
  347. }
  348. ul {
  349. list-style:square;
  350. text-align:left;
  351. }
  352. .notes li: {
  353. list-style:upper-roman;
  354. padding:10px;
  355. }
  356. .audioinfo {
  357. text-align:center;
  358. background:{color:Background};
  359. color:#000;
  360. width:220px;
  361. left:50%;
  362. margin-left:-120px;
  363. margin-top:-65px;
  364. z-index:9999999999;
  365. opacity:0.5;
  366. position:absolute;
  367. padding:10px;
  368. overflow:hidden;
  369. }
  370. .pcount {
  371. margin-top:10px;
  372. }
  373. .cover {
  374. width:220px;
  375. position:relative;
  376. z-index:1;
  377. margin-right:auto;
  378. margin-left:auto;
  379. }
  380. .playbutton {
  381. width:20px;
  382. height:30px;
  383. overflow:hidden;
  384. position:relative;
  385. z-index:5;
  386. margin: 15px 24px 13px 16px;
  387. }
  388. .playbox {
  389. background-color:{color:Background};
  390. position:absolute;
  391. z-index:5;
  392. width:55px;
  393. margin-left:188px;
  394. opacity:0.5;
  395.  
  396. }
  397. .credit {
  398. padding-top:100px;
  399. position:fixed;
  400. height:5px;
  401. width:5px;
  402. }
  403. </style>
  404. </head>
  405.  
  406. <body>
  407. <script type="text/javascript">
  408. jQuery(document).ready(function() {
  409. jQuery(".sub").hide();
  410. //toggle the componenet with class msg_body
  411. jQuery(".cthrough").click(function()
  412. {
  413. jQuery(this).next(".sub").slideToggle(600);
  414. });});
  415. </script>
  416. <script type="text/javascript">
  417. jQuery(document).ready(function() {
  418. jQuery(".sub1").hide();
  419. //toggle the componenet with class msg_body
  420. jQuery(".cthrough1").click(function()
  421. {
  422. jQuery(this).next(".sub1").slideToggle(600);
  423. });});
  424. </script>
  425. <script type="text/javascript">
  426. jQuery(document).ready(function() {
  427. jQuery(".sub2").hide();
  428. //toggle the componenet with class msg_body
  429. jQuery(".cthrough2").click(function()
  430. {
  431. jQuery(this).next(".sub2").slideToggle(600);
  432. });});
  433. </script>
  434.  
  435. <div class="header">
  436. <div id="title"><a href="/">{Title}</a></div>
  437. <div id="description">{Description}</div>
  438. <div id="links">
  439. <a href="#" class="cthrough" title="updates">I</a>
  440. <div class="sub">
  441.  
  442. <!-- enter your updates here -->
  443.  
  444. <h1 style="text-transform:uppercase;">UPDATES</h1>
  445. <h3 style="text-align:left">watching:</h3> vikings</br>
  446. <h3 style="text-align:left">listening:</h3> chet faker</br>
  447. <h3 style="text-align:left">reading:</h3>the horse and his boy </br>
  448.  
  449. <!-- end updates -->
  450. </div>
  451.  
  452. {block:AskEnabled}<a href="#" class="cthrough1" title="ask">II</a>
  453. <div class="sub1">
  454. <h3>they envy us because we are mortal</h3>
  455. <iframe frameborder="0"
  456. height="200"
  457. id="ask_form"
  458. scrolling="no"
  459. src="http://www.tumblr.com/ask_form/{text:blog URL}.tumblr.com"
  460. width="100%">
  461. </iframe>
  462. </div>{/block:AskEnabled}
  463. <a href="#" class="cthrough2" title="links">III</a>
  464. <div class="sub2" style="text-align:center;">
  465. <h4><a href="{text:Link 1 URL}">{text:Link 1}</a></h4>
  466. <h4><a href="{text:Link 2 URL}">{text:Link 2}</a></h4>
  467. <h4><a href="{text:Link 3 URL}">{text:Link 3}</a></h4>
  468. <h4><a href="{text:Link 4 URL}">{text:Link 4}</a></h4>
  469. <h4><a href="{text:Link 5 URL}">{text:Link 5}</a></h4>
  470. <h4><a href="{text:Link 6 URL}">{text:Link 6}</a></h4>
  471. </div>
  472. <a href="/archive"> IV</a>
  473. </div>
  474. </div>
  475.  
  476. <div class="block">
  477. <div class="container">
  478. <div class="postcol">
  479. {block:Posts}
  480. <div class="posts">
  481.  
  482. {block:Text}
  483. {block:Title}<h2>{Title}</h2>{/block:Title}
  484. {Body}
  485. {block:HasTags}
  486. <div class="tags">
  487. {block:Tags}
  488. <a href="{TagURL}">#{Tag}</a>
  489. {/block:Tags}
  490. </div>
  491. {/block:HasTags}</p>
  492. <a href="{Permalink}">{block:Date} {MonthNumberWithZero} {DayOfMonthWithZero} {Year}{/block:Date}</a>
  493. {/block:Text}
  494.  
  495. {block:Link}
  496. <a href="{URL}"><div class="linkname">{Name} &rarr;</div></a>
  497. {block:Description}
  498. <div class="linkdesc">
  499. {Description}
  500. </div>
  501. {/block:Description}
  502. <a class="date" style="margin-top:10px" href="{Permalink}">{block:Date} {MonthNumberWithZero} {DayOfMonthWithZero} {Year}{/block:Date}</a>
  503. {/block:Link}
  504.  
  505. {block:Answer}
  506. <div class="question">
  507. <h2>{Asker} whispered: {Question}</h2>
  508. </div>
  509. <div class="quest">
  510. {Answer}
  511. </div>
  512. {block:HasTags}
  513. <div class="tags">
  514. {block:Tags}
  515. <a href="{TagURL}">#{Tag}</a>
  516. {/block:Tags}
  517. </div>
  518. {/block:HasTags}</p>
  519. <a href="{Permalink}">{block:Date} {MonthNumberWithZero} {DayOfMonthWithZero} {Year}{/block:Date}</a>
  520. {/block:Answer}
  521.  
  522. {block:Quote}
  523. <div class="quote" style="margin-top:60px; border:1px solid {color:Borders}; padding:20px; width:400px; margin-left:auto; margin-right:auto;">
  524. <div class="quotetext_{Length}"><h1>"{Quote}"</h1></div>
  525. {block:Source}<div class="source"> - {Source}</div>{/block:Source}
  526. </div>
  527. {block:HasTags}
  528. <div class="tags">
  529. {block:Tags}
  530. <a href="{TagURL}">#{Tag}</a>
  531. {/block:Tags}
  532. </div>
  533. {/block:HasTags}</p>
  534. <a href="{Permalink}">{block:Date} {MonthNumberWithZero} {DayOfMonthWithZero} {Year}{/block:Date}</a>
  535. {/block:Quote}
  536.  
  537. {block:Photoset}
  538. {Photoset-400}
  539. {block:Caption}<div class="postinfo"><div class="photocap">{Caption}</div>
  540. {block:HasTags}
  541. <div class="tags">
  542. {block:Tags}
  543. <a href="{TagURL}">#{Tag}</a>
  544. {/block:Tags}
  545. </div>
  546. {/block:HasTags}
  547. <div class="likebu">{LikeButton}</div><div class="reblogbu">{ReblogButton}</div></div>
  548. <a href="{Permalink}">{block:Date} {MonthNumberWithZero} {DayOfMonthWithZero} {Year}{/block:Date}</a>{/block:Caption}
  549. {/block:Photoset}
  550.  
  551. {block:Photo}
  552. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="400px">{LinkCloseTag}
  553. {block:Caption}<div class="postinfo"><div class="photocap">{Caption}</div>
  554. {block:HasTags}
  555. <div class="tags">
  556. {block:Tags}
  557. <a href="{TagURL}">#{Tag}</a>
  558. {/block:Tags}
  559. </div>
  560. {/block:HasTags}
  561. <div id="buttons">
  562. <div class="likebu">{LikeButton}</div><div class="reblogbu" >{ReblogButton}</div>
  563. </p>
  564. <a href="{Permalink}">{block:Date} {MonthNumberWithZero} {DayOfMonthWithZero} {Year}{/block:Date}</a>
  565. </div>
  566. </div>{/block:Caption}
  567. {/block:Photo}
  568.  
  569. {block:Audio}
  570. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerWhite} {/block:AudioPlayer}</div></div>
  571. {block:AlbumArt}
  572. <img src="{AlbumArtURL}" class="cover">
  573. {/block:AlbumArt}
  574. <div class="audioinfo">
  575. {block:TrackName}{TrackName}</br>{/block:TrackName}
  576. {block:Artist}Artist: {Artist}</br>{/block:Artist}
  577. {block:Album}Album: {Album}</br>{/block:Album}
  578. </div>
  579. {block:Caption}<div class="postinfo"><div class="photocap">{Caption}</div>
  580. {block:HasTags}
  581. <div class="tags">
  582. {block:Tags}
  583. <a href="{TagURL}">#{Tag}</a>
  584. {/block:Tags}
  585. </div>
  586. {/block:HasTags}
  587. </div></br>
  588. <a class="date" href="{Permalink}">{block:Date} {MonthNumberWithZero} {DayOfMonthWithZero} {Year}{/block:Date}</a>{/block:Caption}
  589. {/block:Audio}
  590.  
  591. {block:Video}
  592. {Video-400}
  593. {block:Caption}{Caption}{/block:Caption}
  594. {/block:Video}
  595.  
  596. </div>
  597. {/block:Posts}
  598.  
  599. <div class="permalink">
  600. {block:PermalinkPage}
  601. {Post}
  602. <div class="ncount">
  603. {NoteCount}
  604. </div>
  605. {block:PostNotes}
  606. <div class"notes">
  607. {PostNotes}
  608. </div>
  609. {/block:PostNotes}
  610.  
  611. {/block:PermalinkPage}
  612.  
  613. </div>
  614.  
  615. <div class="nav">
  616. {block:PreviousPage}<a href="{PreviousPage}">aft</a>{/block:PreviousPage}
  617. {block:NextPage}<a href="{NextPage}">fore</a>{/block:NextPage}
  618. </div>
  619. {/block:Pagination}
  620. </div>
  621. </div>
  622.  
  623. </div>
  624.  
  625. <div class="credit">
  626. <a href="http://jhxythemes.tumblr.com"><img style="height:50px; width:50px;"src="https://38.media.tumblr.com/690d59d5b30ad0628ab75ac7794c6ab9/tumblr_n9vk8a9IHR1r1bumeo1_100.png"></a></div>
  627.  
  628. </body>
  629.  
  630.  
  631. </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!