the49thname

Theme 09: Moonlight Kissed

Oct 11th, 2016
3,150
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 24.40 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <head>
  4.  
  5. <!-- theme 09: moonlight kissed / version 1.3 (edited 03/09/19)
  6.  
  7. themes by ro (the49thname) / the49ththeme.tumblr.com
  8. tumblr controls fix by cyantists @ tumblr
  9. don't remove the credit, use as a base code, or claim as your own work.
  10. edit as much as you want, and feel free to send me any queries/problems.
  11.  
  12. -->
  13.  
  14. <html xlmns="//www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  15.  
  16. <title>{Title}</title>
  17.  
  18. <link rel="shortcut icon" href="{Favicon}">
  19.  
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21.  
  22. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  23.  
  24. <!-- colour options -->
  25.  
  26. <meta name="color:bold" content="#000"/>
  27. <meta name="color:italic" content="#ccc"/>
  28. <meta name="color:underline" content="#888"/>
  29. <meta name="color:background" content="#f6f6f6"/>
  30. <meta name="color:scrollbar" content="#ccc"/>
  31. <meta name="color:text" content="#888"/>
  32. <meta name="color:link" content="#ccc"/>
  33. <meta name="color:link hover" content="#888"/>
  34. <meta name="color:perma link" content="#ccc"/>
  35. <meta name="color:perma link hover" content="#888"/>
  36. <meta name="color:tags" content="#ccc"/>
  37. <meta name="color:tags hover" content="#888"/>
  38. <meta name="color:border" content="#eee"/>
  39. <meta name="color:h1 text" content="#888"/>
  40. <meta name="color:tooltip text" content="#fff"/>
  41. <meta name="color:tooltip bg" content="#888"/>
  42. <meta name="color:selection text" content="#fff"/>
  43. <meta name="color:selection bg" content="#888"/>
  44.  
  45. <!-- image options -->
  46.  
  47. <meta name="image:bg" content=""/>
  48. <meta name="image:popup icon" content="https://68.media.tumblr.com/6d422141bec15e51c81f8de19ee35ea7/tumblr_inline_o12anwk1sv1rrt3vb_540.png"/>
  49.  
  50. <!-- text options -->
  51.  
  52. <meta name="text:tumblr username" content=""/>
  53.  
  54. <meta name="text:Link 1" content="Link 1"/>
  55. <meta name="text:Link 1 URL" content=""/>
  56. <meta name="text:Link 2" content="Link 2"/>
  57. <meta name="text:Link 2 URL" content=""/>
  58. <meta name="text:Link 3" content="Link 3"/>
  59. <meta name="text:Link 3 URL" content=""/>
  60. <meta name="text:Link 4" content="Link 4"/>
  61. <meta name="text:Link 4 URL" content=""/>
  62. <meta name="text:Link 5" content="Link 5"/>
  63. <meta name="text:Link 5 URL" content=""/>
  64. <meta name="text:Link 6" content="Link 6"/>
  65. <meta name="text:Link 6 URL" content=""/>
  66. <meta name="text:Link 7" content="Link 7"/>
  67. <meta name="text:Link 7 URL" content=""/>
  68. <meta name="text:Link 8" content="Link 8"/>
  69. <meta name="text:Link 8 URL" content=""/>
  70.  
  71. <!-- toggle options -->
  72.  
  73. <meta name="if:popup links" content="1"/>
  74. <meta name="if:400px posts" content="0"/>
  75. <meta name="if:show caption" content="1"/>
  76. <meta name="if:hover perma" content="0"/>
  77. <meta name="if:show tags" content="1"/>
  78.  
  79. <!-- fonts -->
  80.  
  81. <link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed" rel="stylesheet">
  82.  
  83. <!-- font awesome script -->
  84.  
  85. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  86.  
  87. <!-- jquery scripts -->
  88.  
  89. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  90.  
  91. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  92.  
  93. <!-- tooltip scripts -->
  94.  
  95. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  96.  
  97. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  98.  
  99. <script>
  100. (function($){
  101. $(document).ready(function(){
  102. $("a[title]").style_my_tooltips({
  103. tip_follows_cursor:true,
  104. tip_delay_time:90,
  105. tip_fade_speed:600,
  106. attribute:"title"
  107. });
  108. });
  109. })(jQuery);
  110. </script>
  111.  
  112. <style type="text/css">
  113.  
  114. iframe.tmblr-iframe {
  115. z-index:99999999999999!important;
  116. top:3px!important;
  117. right:0!important;
  118. opacity:0.4;
  119. filter:invert(1);
  120. -webkit-filter:invert(1);
  121. -o-filter:invert(1);
  122. -moz-filter:invert(1);
  123. -ms-filter:invert(1);
  124. transform:scale(0.6);
  125. transform-origin:100% 0;
  126. -webkit-transform:scale(0.8);
  127. -webkit-transform-origin:100% 0;
  128. -o-transform:scale(0.8);
  129. -o-transform-origin:100% 0;
  130. -moz-transform:scale(0.8);
  131. -moz-transform-origin:100% 0;
  132. -ms-transform:scale(0.8);
  133. -ms-transform-origin:100% 0;
  134. }
  135.  
  136. iframe.tmblr-iframe:hover {opacity:0.6!important;}
  137.  
  138. ::-webkit-scrollbar-thumb {
  139. z-index:9999;
  140. position:relative;
  141. height:auto;
  142. background-color:{color:scrollbar};
  143. }
  144.  
  145. ::-webkit-scrollbar {
  146. height:5px;
  147. width:5px;
  148. background-color:{color:background};
  149. }
  150.  
  151. /* basics */
  152.  
  153. body {
  154. color:{color:text};
  155. background-color:{color:background};
  156. font-family:'Roboto', sans-serif;
  157. font-size:10px;
  158. margin:0;
  159. line-height:14px;
  160. letter-spacing:1px;
  161. text-align:justify;
  162. word-wrap:break-word;
  163. background-image:url('{image:bg}');
  164. background-position:left top;
  165. background-attachment:fixed;
  166. background-repeat:repeat;
  167. }
  168.  
  169. small {font-size:9px;}
  170.  
  171. pre {
  172. word-wrap:break-word;
  173. padding:5px;
  174. margin:0px 10px;
  175. border:1px solid {color:border};
  176. white-space:pre-wrap;
  177. white-space:-moz-pre-wrap;
  178. white-space:-pre-wrap;
  179. white-space:-o-pre-wrap;
  180. }
  181.  
  182. blockquote {
  183. margin:0px 0px 0px 20px;
  184. padding:2px 0px 2px 5px;
  185. border-left:1px solid {color:border};
  186. }
  187.  
  188. b, strong {color:{color:bold};}
  189.  
  190. i, em {color:{color:italic};}
  191.  
  192. u {color:{color:underline};text-transform:none;}
  193.  
  194. a {
  195. color:{color:link};
  196. text-transform:uppercase;
  197. text-decoration:none;
  198. -moz-transition-duration:1s;
  199. -webkit-transition-duration:1s;
  200. -o-transition-duration:1s;
  201. }
  202.  
  203. a:hover {
  204. color:{color:link hover};
  205. -moz-transition-duration:1s;
  206. -webkit-transition-duration:1s;
  207. -o-transition-duration:1s;
  208. }
  209.  
  210. p {margin:10px;}
  211.  
  212. hr {width:200px;border-top:1px solid {color:border};}
  213.  
  214. h1 {
  215. font-size:14px;
  216. font-family:'Roboto', sans-serif;
  217. text-align:center;
  218. text-transform:uppercase;
  219. letter-spacing:1px;
  220. color:{color:h1 text};
  221. border-bottom:1px solid {color:border};
  222. padding:10px;
  223. margin-top:0px;
  224. }
  225.  
  226. h1 a {
  227. color:{color:h1 text};
  228. -moz-transition-duration:1s;
  229. -webkit-transition-duration:1s;
  230. -o-transition-duration:1s;
  231. }
  232.  
  233. h1 a:hover {
  234. color:{color:link};
  235. -moz-transition-duration:1s;
  236. -webkit-transition-duration:1s;
  237. -o-transition-duration:1s;
  238. }
  239.  
  240. h2 {
  241. text-align:center;
  242. font-size:14px;
  243. word-spacing:2px;
  244. line-height:17px;
  245. padding:10px 0px;
  246. text-transform:uppercase;
  247. font-family:'Roboto', sans-serif;
  248. }
  249.  
  250. /* header */
  251.  
  252. #headercont {
  253. position:fixed;
  254. width:100%;
  255. background-color:{color:background};
  256. border-bottom:1px solid {color:border};
  257. padding:20px 0px;
  258. text-align:center;
  259. z-index:9999;
  260. }
  261.  
  262. .header {
  263. height:80px;
  264. -moz-transition-duration:all 0.5s ease-in-out;
  265. -webkit-transition-duration:all 0.5s ease-in-out;
  266. -o-transition-duration:all 0.5s ease-in-out;
  267. transition:all 0.5s ease-in-out;
  268. }
  269.  
  270. .header2 {
  271. height:30px;
  272. overflow:hidden;
  273. -moz-transition-duration:all 0.5s ease-in-out;
  274. -webkit-transition-duration:all 0.5s ease-in-out;
  275. -o-transition-duration:all 0.5s ease-in-out;
  276. transition:all 0.5s ease-in-out;
  277. }
  278.  
  279. #title {
  280. text-transform:uppercase;
  281. font-size:20px;
  282. font-weight:700;
  283. margin-top:10px;
  284. }
  285.  
  286. #title a {
  287. color:{color:text};
  288. letter-spacing:5px;
  289. -moz-transition-duration:all 0.5s ease-in-out;
  290. -webkit-transition-duration:all 0.5s ease-in-out;
  291. -o-transition-duration:all 0.5s ease-in-out;
  292. transition:all 0.5s ease-in-out;
  293. }
  294.  
  295. #title a:hover {
  296. color:{color:link};
  297. letter-spacing:6px;
  298. -moz-transition-duration:all 0.5s ease-in-out;
  299. -webkit-transition-duration:all 0.5s ease-in-out;
  300. -o-transition-duration:all 0.5s ease-in-out;
  301. transition:all 0.5s ease-in-out;
  302. }
  303.  
  304. #desc {margin-top:20px;}
  305.  
  306. #nav {margin-top:20px;}
  307.  
  308. #nav a {
  309. display:inline-block;
  310. padding:0px 10px;
  311. font-size:12px;
  312. }
  313.  
  314. /* top icons */
  315.  
  316. .sidebarcont {
  317. top:60px;
  318. opacity:0;
  319. -moz-transition-duration:all 0.5s ease-in-out;
  320. -webkit-transition-duration:all 0.5s ease-in-out;
  321. -o-transition-duration:all 0.5s ease-in-out;
  322. transition:all 0.5s ease-in-out;
  323. }
  324.  
  325. .sidebarcont2 {
  326. top:27px;
  327. opacity:1;
  328. -moz-transition-duration:all 0.5s ease-in-out;
  329. -webkit-transition-duration:all 0.5s ease-in-out;
  330. -o-transition-duration:all 0.5s ease-in-out;
  331. transition:all 0.5s ease-in-out;
  332. }
  333.  
  334. #leftsidebar, #rightsidebar {position:fixed;z-index:99999999;}
  335.  
  336. #leftsidebar {left:20px;}
  337.  
  338. #rightsidebar {right:20px;}
  339.  
  340. .sidebaricons {font-size:20px;}
  341.  
  342. .sidebaricons c {display:inline-block;margin:0px 5px;}
  343.  
  344. .sidebaricons a {color:{color:text};}
  345.  
  346. .sidebaricons a:hover {color:{color:link};}
  347.  
  348. /* pop-up pages */
  349.  
  350. #fade {
  351. display:none;
  352. background:{color:background};
  353. position:fixed;
  354. left:0;
  355. top:0;
  356. width:100%;
  357. height:100%;
  358. z-index:99;
  359. }
  360.  
  361. .popupcont {
  362. {block:IndexPage}top:210px;{/block:IndexPage}
  363. {block:PermalinkPage}top:170px;{/block:PermalinkPage}
  364. }
  365.  
  366. .popupcont2 {top:120px;}
  367.  
  368. .popup_block {
  369. display:none;
  370. padding:10px;
  371. position:fixed;
  372. left:50%;
  373. margin-left:-250px;
  374. z-index:99999;
  375. }
  376.  
  377. img.btn_close {
  378. position:absolute;
  379. top:-20px;
  380. right:-20px;
  381. width:20px;
  382. height:20px;
  383. z-index:999999999999;
  384. }
  385.  
  386. #popupicon {
  387. width:100px;
  388. height:100px;
  389. margin:10px auto;
  390. }
  391.  
  392. #popupicon img {
  393. width:100px;
  394. height:100px;
  395. border-radius:50%;
  396. }
  397.  
  398. #popuptags {text-align:center;}
  399.  
  400. #popuptags a {
  401. width:142px;
  402. overflow:hidden;
  403. display:inline-block;
  404. border-bottom:1px solid {color:border};
  405. padding:10px 5px;
  406. margin:0px 5px;
  407. letter-spacing:1px;
  408. -moz-transition-duration:1s;
  409. -webkit-transition-duration:1s;
  410. -o-transition-duration:1s;
  411. }
  412.  
  413. #popuptags a:hover {
  414. letter-spacing:3px;
  415. -moz-transition-duration:1s;
  416. -webkit-transition-duration:1s;
  417. -o-transition-duration:1s;
  418. }
  419.  
  420. /* posts */
  421.  
  422. #themecontainer {
  423. position:relative;
  424. width:100%;
  425. top:130px;
  426. overflow:hidden;
  427. }
  428.  
  429. #container {
  430. {block:if400pxposts}width:500px;{/block:if400pxposts}
  431. {block:ifnot400pxposts}width:600px;{/block:ifnot400pxposts}
  432. {block:IndexPage}margin:80px auto;{/block:IndexPage}
  433. {block:PermalinkPage}margin:40px auto;{/block:PermalinkPage}
  434. }
  435.  
  436. #posts {
  437. {block:if400pxposts}width:400px;{/block:if400pxposts}
  438. {block:ifnot400pxposts}width:500px;{/block:ifnot400pxposts}
  439. {block:IndexPage}margin:0px auto 80px auto;{/block:IndexPage}
  440. {block:PermalinkPage}margin:0px auto 40px auto;{/block:PermalinkPage}
  441. }
  442.  
  443. #pagination {
  444. font-size:20px;
  445. letter-spacing:2px;
  446. text-align:center;
  447. }
  448.  
  449. #pagination a {
  450. display:inline-block;
  451. padding:0px 10px;
  452. color:{color:text};
  453. }
  454.  
  455. #pagination a:hover {color:{color:link};}
  456.  
  457. #posts ul, ol {margin-left:15px;padding:0px!important;}
  458.  
  459. #posts li {margin:0px 10px;}
  460.  
  461. #posts img {
  462. {block:if400pxposts}max-width:400px;{/block:if400pxposts}
  463. {block:ifnot400pxposts}max-width:500px;{/block:ifnot400pxposts}
  464. }
  465.  
  466. #posts p img {margin:0px;}
  467.  
  468. #posts blockquote img {max-width:100%;height:auto;}
  469.  
  470. #posts iframe, #posts video {max-width:100%;}
  471.  
  472. #source {margin-bottom:20px;text-align:center;}
  473.  
  474. .caption {
  475. {block:ifnotshowcaption}
  476. {block:IndexPage}display:none;{/block:IndexPage}
  477. {/block:ifnotshowcaption}
  478. }
  479.  
  480. #audio {
  481. font-family:'Roboto Condensed', sans-serif;
  482. font-size:10px;
  483. line-height:25px;
  484. text-align:center;
  485. margin-bottom:10px;
  486. }
  487.  
  488. .audiocaption {border-top:1px solid {color:border};}
  489.  
  490. .audiocaption:empty {display:none;}
  491.  
  492. #audio b {color:{color:bold};}
  493.  
  494. #audioplayerbg {
  495. background:#fff;
  496. width:80px;
  497. height:80px;
  498. padding:10px;
  499. overflow:hidden;
  500. position:absolute;
  501. {block:if400pxposts}margin-left:150px;{/block:if400pxposts}
  502. {block:ifnot400pxposts}margin-left:200px;{/block:ifnot400pxposts}
  503. border-radius:50%;
  504. opacity:0.4;
  505. -moz-transition-duration:1s;
  506. -webkit-transition-duration:1s;
  507. -o-transition-duration:1s;
  508. }
  509.  
  510. #audioplayerbg:hover {
  511. opacity:0.7;
  512. -moz-transition-duration:1s;
  513. -webkit-transition-duration:1s;
  514. -o-transition-duration:1s;
  515. }
  516.  
  517. #audioplayer {
  518. width:30px;
  519. height:30px;
  520. overflow:hidden;
  521. margin-top:25px;
  522. margin-left:25px;
  523. }
  524.  
  525. #albumart {}
  526.  
  527. #albumart img {border-radius:50%;}
  528.  
  529. #audioinfo {margin-top:10px;text-transform:uppercase;}
  530.  
  531. .chat ol {margin:0px!important;list-style:none;}
  532.  
  533. .line {list-style:none;padding:5px 0px;}
  534.  
  535. .label {text-decoration:bold;}
  536.  
  537. .askericon {
  538. width:64px;
  539. height:64px;
  540. margin:0px auto 10px auto;
  541. }
  542.  
  543. .askericon img {border-radius:50%;}
  544.  
  545. .asker {
  546. text-align:center;
  547. font-size:15px;
  548. font-family:'Roboto', sans-serif;
  549. text-transform:uppercase;
  550. margin-bottom:10px;
  551. }
  552.  
  553. .ask {
  554. text-align:center;
  555. padding:10px 10px 20px 10px;
  556. border-bottom:1px solid {color:border};
  557. }
  558.  
  559. .answer {padding:10px 0px 2px 0px;}
  560.  
  561. #posts .answer img {max-width:100%;height:auto;}
  562.  
  563. .replier {
  564. text-align:center;
  565. font-size:15px;
  566. font-family:'Roboto', sans-serif;
  567. text-transform:uppercase;
  568. margin:10px 0px;
  569. }
  570.  
  571. .replies {margin-top:10px;border-top:1px solid {color:border};}
  572.  
  573. .replies:empty {display:none;}
  574.  
  575. #perma {
  576. padding:10px;
  577. letter-spacing:2px;
  578. text-align:center;
  579. border-top:1px solid {color:border};
  580. {block:PermalinkPage}
  581. border-bottom:1px solid {color:border};
  582. {/block:PermalinkPage}
  583. margin-top:10px;
  584. {block:ifhoverperma}
  585. {block:IndexPage}opacity:0;{/block:IndexPage}
  586. -moz-transition-duration:1s;
  587. -webkit-transition-duration:1s;
  588. -o-transition-duration:1s;
  589. transition-duration:1s;
  590. {/block:ifhoverperma}
  591. }
  592.  
  593. {block:ifhoverperma}
  594. #posts:hover #perma {
  595. opacity:1;
  596. -moz-transition-duration:1s;
  597. -webkit-transition-duration:1s;
  598. -o-transition-duration:1s;
  599. transition-duration:1s;
  600. }
  601. {/block:ifhoverperma}
  602.  
  603. #perma a {
  604. color:{color:perma link};
  605. font-size:9px;
  606. padding:5px;
  607. -moz-transition-duration:1s;
  608. -webkit-transition-duration:1s;
  609. -o-transition-duration:1s;
  610. }
  611.  
  612. #perma a:hover {
  613. color:{color:perma link hover};
  614. -moz-transition-duration:1s;
  615. -webkit-transition-duration:1s;
  616. -o-transition-duration:1s;
  617. }
  618.  
  619. #tags {
  620. text-align:center;
  621. word-wrap:break-word;
  622. margin-top:5px;
  623. {block:ifnotshowtags}
  624. {block:IndexPage}display:none;{/block:IndexPage}
  625. {/block:ifnotshowtags}
  626. }
  627.  
  628. #tags a {
  629. padding:0px 5px;
  630. font-size:8px;
  631. text-transform:none;
  632. color:{color:tags};
  633. -moz-transition-duration:1s;
  634. -webkit-transition-duration:1s;
  635. -o-transition-duration:1s;
  636. }
  637.  
  638. #tags a:hover {
  639. color:{color:tags hover};
  640. -moz-transition-duration:1s;
  641. -webkit-transition-duration:1s;
  642. -o-transition-duration:1s;
  643. }
  644.  
  645. ol.notes {
  646. margin-top:10px;
  647. list-style-type:none;
  648. padding:10px 25px;
  649. text-align:center;
  650. }
  651.  
  652. ol.notes li.note {
  653. padding:10px;
  654. text-align:center;
  655. line-height:140%;
  656. margin-top:10px;
  657. }
  658.  
  659. ol.notes li.note img.avatar {display:none!important;}
  660.  
  661. ol.notes li.note blockquote {padding:2px 5px;margin:5px 0px 0px 35px;}
  662.  
  663. /* extras */
  664.  
  665. #s-m-t-tooltip {
  666. z-index:9999999999;
  667. color:{color:tooltip text};
  668. background:{color:tooltip bg};
  669. font-size:9px;
  670. line-height:11px;
  671. font-family:'Roboto Condensed', sans-serif;
  672. text-align:left;
  673. text-transform:uppercase;
  674. max-width:150px;
  675. word-wrap:break-word;
  676. padding:2px 5px 2px 5px;
  677. display:block;
  678. margin:24px 14px 7px 12px;
  679. }
  680.  
  681. ::selection {color:{color:selection text};background:{color:selection bg};}
  682.  
  683. /* credit - do not remove, alter, or move to another page */
  684.  
  685. #credit {
  686. position:fixed;
  687. bottom:14px;
  688. right:10px;
  689. text-align:center;
  690. z-index:9999;
  691. }
  692.  
  693. #credit a {
  694. font-size:10px;
  695. color:{color:background};
  696. background-color:{color:scrollbar};
  697. padding:4px;
  698. -moz-transition-duration:1s;
  699. -webkit-transition-duration:1s;
  700. -o-transition-duration:1s;
  701. }
  702.  
  703. #credit a:hover {
  704. color:{color:scrollbar};
  705. background-color:{color:background};
  706. -moz-transition-duration:1s;
  707. -webkit-transition-duration:1s;
  708. -o-transition-duration:1s;
  709. }
  710.  
  711. </style>
  712. </head>
  713. <body>
  714.  
  715. <div id="headercont">
  716. <div class="header">
  717. <div id="title"><a href="/" title="return home">{Title}</a></div>
  718. <div id="desc">{Description}</div>
  719. <div id="nav">
  720. <a href="/">Home</a>
  721. {block:ifpopuplinks}
  722. <a href="#?w=500" rel="02" class="poplight">Ask</a>
  723. <a href="#?w=500" rel="03" class="poplight">About</a>
  724. <a href="#?w=500" rel="04" class="poplight">Nav</a>
  725. {/block:ifpopuplinks}
  726. {block:ifnotpopuplinks}
  727. <a href="/ask">Ask</a>
  728. <a href="/submit">Submit</a>
  729. {/block:ifnotpopuplinks}
  730. <a href="/archive">Past</a>
  731. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  732. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  733. </div>
  734. </div>
  735. </div>
  736.  
  737. {block:ifpopuplinks}
  738. <div id="02" class="popupcont popup_block">
  739. <h1>Ask</h1>
  740. <p><iframe frameborder="0" height="190" id="ask_form" scrolling="no" src="//www.tumblr.com/ask_form/{text:tumblr username}.tumblr.com" width="100%" style="background-color: transparent; overflow: hidden;"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></p>
  741. </div>
  742.  
  743. <div id="03" class="popupcont popup_block">
  744. <h1>About</h1>
  745. <div id="popupicon"><img src="{image:popup icon}"></div>
  746. <!-- your about goes here. it comes with a small icon 100x100px in size and room to give a short summary of yourself and/or your blog. use regular html styling (i.e. p / b / i / etc.) -->
  747. </div>
  748.  
  749. <div id="04" class="popupcont popup_block">
  750. <h1>Navigation</h1>
  751. <div id="popuptags">
  752. <a href="{text:Link 3 URL}">{text:Link 3}</a>
  753. <a href="{text:Link 4 URL}">{text:Link 4}</a>
  754. <a href="{text:Link 5 URL}">{text:Link 5}</a>
  755. <a href="{text:Link 6 URL}">{text:Link 6}</a>
  756. <a href="{text:Link 7 URL}">{text:Link 7}</a>
  757. <a href="{text:Link 8 URL}">{text:Link 8}</a>
  758. </div>
  759. </div>
  760. {/block:ifpopuplinks}
  761.  
  762. <div id="leftsidebar" class="sidebarcont">
  763. <div class="sidebaricons">
  764. {block:ifpopuplinks}
  765. <a href="#?w=500" rel="02" class="poplight" title="send a message"><c class="fa fa-envelope"></c></a>
  766. <a href="#?w=500" rel="03" class="poplight" title="about"><c class="fa fa-user"></c></a>
  767. <a href="#?w=500" rel="04" class="poplight" title="navigation"><c class="fa fa-bars"></c></a>
  768. {/block:ifpopuplinks}
  769. {block:ifnotpopuplinks}
  770. <a href="/ask" title="send a message"><c class="fa fa-envelope"></c></a>
  771. <a href="/submit" title="submit"><c class="fa fa-paper-plane"></c></a>
  772. <a href="/archive" title="past"><c class="fa fa-calendar"></c></a>
  773. {/block:ifnotpopuplinks}
  774. </div>
  775. </div>
  776.  
  777. <div id="rightsidebar" class="sidebarcont">
  778. <div class="sidebaricons">
  779. {block:ifpopuplinks}
  780. <a href="/archive" title="past"><c class="fa fa-calendar"></c></a>
  781. {/block:ifpopuplinks}
  782. {block:ifnotpopuplinks}
  783. <a href="//the49thname.tumblr.com" title="theme"><c class="fa fa-code"></c></a>
  784. {/block:ifnotpopuplinks}
  785. <a href="{text:Link 1 URL}" title="{text:Link 1}"><c class="fa fa-star"></c></a>
  786. <a href="{text:Link 2 URL}" title="{text:Link 2}"><c class="fa fa-star-o"></c></a>
  787. </div>
  788. </div>
  789.  
  790. <div id="themecontainer">
  791. <div id="container">
  792. {block:Posts}
  793. <div id="posts">
  794.  
  795. {block:Text}
  796. {block:Title}<h1>{Title}</h1>{/block:Title}
  797. {Body}
  798. {/block:Text}
  799.  
  800. {block:Quote}
  801. <h2>{Quote}</h2>
  802. {block:Source}<div id="source">{Source}</div>{/block:Source}
  803. {/block:Quote}
  804.  
  805. {block:Link}
  806. <h1><a href="{URL}"><< {Name} >></a></h1>
  807. {block:Description}{Description}{/block:Description}
  808. {/block:Link}
  809.  
  810. {block:Chat}
  811. {block:Title}
  812. <h1>{Title}</h1>
  813. {/block:Title}
  814. <div class="chat">
  815. <ol>{block:Lines}
  816. <li class="line {Alt}">
  817. {block:Label}
  818. <span class="label">
  819. <b>{Label}</b></span>
  820. {/block:Label}{Line}</li>
  821. {/block:Lines}
  822. </ol></div>
  823. {/block:Chat}
  824.  
  825. {block:Photo}
  826. {LinkOpenTag}<center>{block:if400pxposts}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{/block:if400pxposts}{block:ifnot400pxposts}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{/block:ifnot400pxposts}</center>{LinkCloseTag}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  827. {/block:Photo}
  828.  
  829. {block:Photoset}
  830. <center>{block:if400pxposts}{Photoset-400}{/block:if400pxposts}{block:ifnot400pxposts}{Photoset-500}{/block:ifnot400pxposts}</center>{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  831. {/block:Photoset}
  832.  
  833. {block:Video}
  834. <center>{block:if400pxposts}{Video-400}{/block:if400pxposts}{block:ifnot400pxposts}{Video-500}{/block:ifnot400pxposts}</center>{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  835. {/block:Video}
  836.  
  837. {block:Audio}
  838. <div id="audio">
  839. <div id="audioplayerbg"><div id="audioplayer">{AudioPlayerWhite}</div></div>
  840. <div id="albumart"><span{block:AlbumArt} style="display:none;"{block:AlbumArt}><img src="https://41.media.tumblr.com/9b78d1e07567414cae86f9e454b1e9f7/tumblr_inline_o39hgzRFff1rrt3vb_540.png" width="100"></span>{block:AlbumArt}<img src="{AlbumArtURL}" width="100">{/block:AlbumArt}</div>
  841. <div id="audioinfo">
  842. <span{block:TrackName} style="display:none;"{block:TrackName}><b>Song:</b> unknown</span>{block:TrackName}<b>Song:</b> {TrackName}{/block:TrackName}
  843. <br><span{block:Artist} style="display:none;"{block:Artist}><b>Artist:</b> unknown</span>{block:Artist}<b>Artist:</b> {Artist}{/block:Artist}
  844. <br><span{block:Album} style="display:none;"{block:Album}><b>Album:</b> unknown</span>{block:Album}<b>Album:</b> {Album}{/block:Album}
  845. <br>{block:PlayCount}<b>Play count:</b> {PlayCount}{/block:PlayCount}
  846. </div></div>
  847. {block:Caption}<div class="caption audiocaption">{Caption}</div>{/block:Caption}
  848. {/block:Audio}
  849.  
  850. {block:Answer}
  851. <div class="askericon"><img src="{AskerPortraitURL-64}"></div>
  852. <div class="ask"><div class="asker">{Asker} asked:</div>{Question}</div>
  853. <div class="answer">{block:Answerer}<div class="replier">{Answerer} replied:</div>{/block:Answerer}{Answer}</div>
  854. {block:Answerer}<div class="replies">{Replies}</div>{/block:Answerer}
  855. {/block:Answer}
  856.  
  857. {block:Date}
  858.  
  859. {block:IndexPage}<div id="perma">
  860. <a href="{Permalink}" title="{DayofMonth}{DayofMonthSuffix} {Month} {Year}">{block:Date}{TimeAgo}{/block:Date}</a>
  861. <a href="{Permalink}">{NoteCountwithLabel}</a>
  862. {block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
  863. {block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}">©</a>{/block:ContentSource}
  864. <br>{block:HasTags}<div id="tags">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  865. </div>{/block:IndexPage}
  866.  
  867. {block:PermalinkPage}<div id="perma">
  868. <a href="{Permalink}">{block:Date}{TimeAgo}{/block:Date}</a>
  869. <a href="{Permalink}">{NoteCountwithLabel}</a>
  870. {block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
  871. {block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}">©</a>{/block:ContentSource}
  872. <br>{block:HasTags}<div id="tags">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  873. </div>{/block:PermalinkPage}
  874.  
  875. {/block:Date}
  876.  
  877. {block:PostNotes}{PostNotes}{/block:PostNotes}
  878.  
  879. </div>
  880. {/block:Posts}
  881.  
  882. {block:Pagination}
  883. <div id="pagination">
  884. {block:PreviousPage}| <a href="{PreviousPage}">Back</a>{/block:PreviousPage} | {block:NextPage}<a href="{NextPage}">Forth</a> |{/block:NextPage}
  885. </div>
  886. {/block:Pagination}
  887.  
  888. </div>
  889. </div>
  890.  
  891. <!-- pop up page jquery -->
  892.  
  893. <script>
  894. $(document).ready(function() {
  895. //
  896. $('a.poplight[href^=#]').click(function() {
  897. var popID = $(this).attr('rel'); //Get Popup Name
  898. var popURL = $(this).attr('href'); //Get Popup href to define size
  899. var query= popURL.split('?');
  900. var dim= query[1].split('&');
  901. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  902. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="https://68.media.tumblr.com/35fc8f8e1c10951f98fead1dedc8a93d/tumblr_inline_o57nyeIyod1rrt3vb_540.png" class="btn_close"/></a>');
  903. // var popMargTop = ($('#' + popID).height() + 80) / 2;
  904. // var popMargLeft = ($('#' + popID).width() + 80) / 2;
  905. //Apply Margin to Popup
  906. // $('#' + popID).css({
  907. // 'margin-top' : -popMargTop,
  908. // 'margin-left' : -popMargLeft
  909. // });
  910. $('body').append('<div id="fade"></div>');
  911. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  912. return false;
  913. });
  914. $('a.close, #fade').live('click', function() {
  915. $('#fade , .popup_block').fadeOut(function() {
  916. $('#fade, a.close').remove(); //fade them both out
  917. });
  918. return false;
  919. });
  920. });
  921. </script>
  922.  
  923. <!-- sticky div jquery -->
  924.  
  925. <script>
  926. $(document).ready(function(){
  927. $(window).bind('scroll', function(){
  928. if($(window).scrollTop() > 500){
  929. $('.header').addClass('header2');
  930. }
  931.  
  932. else{
  933. $('.header').removeClass('header2');
  934. }
  935. });
  936. });
  937. </script>
  938.  
  939. <script>
  940. $(document).ready(function(){
  941. $(window).bind('scroll', function(){
  942. if($(window).scrollTop() > 500){
  943. $('.sidebarcont').addClass('sidebarcont2');
  944. }
  945.  
  946. else{
  947. $('.sidebarcont').removeClass('sidebarcont2');
  948. }
  949. });
  950. });
  951. </script>
  952.  
  953. <script>
  954. $(document).ready(function(){
  955. $(window).bind('scroll', function(){
  956. if($(window).scrollTop() > 500){
  957. $('.popupcont').addClass('popupcont2');
  958. }
  959.  
  960. else{
  961. $('.popupcont').removeClass('popupcont2');
  962. }
  963. });
  964. });
  965. </script>
  966.  
  967. <div id="credit"><a href="//the49thname.tumblr.com/" title="made by the49thname">49</a>
  968. </div>
  969.  
  970. </body>
  971. </html>
Advertisement
Add Comment
Please, Sign In to add comment