Advertisement
themekid

hold on theme

Nov 12th, 2016
5,757
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.93 KB | None | 0 0
  1. <!------------------------------------------
  2.  
  3. (◍•ᴗ•◍)♡ ✧*。
  4.  
  5. Hold On Theme by ThemeKid Chloë | @redivide | @themekid
  6.  
  7. > Do not delete/alter any credit.
  8. > Do not claim as your own.
  9. > Do not copy any code.
  10. > Do not redistribute.
  11.  
  12. ------------------------------------------->
  13. <html>
  14. <head>
  15. {block:Hidden}
  16. <meta name="image:Sidebar" content="//67.media.tumblr.com/0dc8135506f5802fd3992155bbd2bbe0/tumblr_oeepbg35GE1v8yaeco1_1280.jpg"/>
  17.  
  18. <meta name="color:Accent" content="#dfcacc" />
  19. <meta name="color:Dark Accent" content="#c09992" />
  20.  
  21. <meta name="select:Columns" content="ThreeColumns" title="3" />
  22. <meta name="select:Columns" content="TwoColumns" title="2" />
  23.  
  24. <meta name="if:Credit Link" content="" />
  25. <meta name="if:Custom Favicon" content="" />
  26. <meta name="if:Redirect Ask" content="" />
  27.  
  28. <meta name="text:IMPORTANT" content="do not enable the redirect ask if you are using the default /ask page. it will cause your browser to crash! only enable if you are using a custom ask page."/>
  29. <meta name="text:Ask Link" content="/ask" />
  30. <meta name="text:Favicon URL" content="//" />{/block:Hidden}
  31.  
  32. <meta charset="UTF-8" />
  33. <title>{block:TagPage}{Tag} posts | {/block:TagPage}{block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  34. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  35. {block:IfNotCustomFavicon}
  36. <link rel="shortcut icon" href="{Favicon}">
  37. {/block:IfNotCustomFavicon}
  38. {block:IfCustomFavicon}
  39. <link rel="shortcut icon" href="{text:Favicon URL}">
  40. {/block:IfCustomFavicon}
  41. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  42. <link href="https://fonts.googleapis.com/css?family=Anonymous+Pro|Gochi+Hand|Open+Sans:400,400i,700,700i|Sacramento" rel="stylesheet">
  43. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  44. <link rel="stylesheet" href="//static.tumblr.com/8pnyeus/29To2og0o/styles.css">
  45. <script src="https://dl.dropboxusercontent.com/s/7ke33tjjl8rty02/scripts.js"></script>
  46. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  47. <!--there is a reason you can't find this link for outicons when you google, it's because i made it. so leave it the fuck alone and go make your own-->
  48. <link rel="stylesheet" href="https://static.tumblr.com/8pnyeus/D87qcdm0a/oi-icomoon.css">
  49. <script language="JavaScript">var fhs = document.createElement('script');var fhs_id = "5399645";var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;fhs.src = "//s1.freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=&e2=&r="+ref+"&wh="+w_h+"&a=1&pn="+pn+"";document.head.appendChild(fhs);document.write("<span id='o_"+fhs_id+"' style='display:none'></span>");
  50. </script><script>{block:IfRedirectAsk}
  51. if(window.location.pathname == '/ask') location.replace('{text:Ask Link}');{/block:IfRedirectAsk}
  52. (function($){ $(document).ready(function(){ $("[title],a[title],img[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:100, tip_fade_speed:300, attribute:"title" }); }); })(jQuery);
  53. </script>
  54. <style type="text/css">
  55. [class*=" icon-oi_"]:before,[class^=icon-oi_]:before {
  56. line-height:inherit;
  57. vertical-align: middle;
  58. }
  59. @font-face {
  60. font-family: 'icomoon';
  61. src: url('https://dl.dropboxusercontent.com/s/1ohfequ7ws4ejzm/icomoon.eot?5kiojs');
  62. src: url('https://dl.dropboxusercontent.com/s/1ohfequ7ws4ejzm/icomoon.eot?5kiojs#iefix') format('embedded-opentype'),
  63. url('https://dl.dropboxusercontent.com/s/9qmsmnbzj2canp9/icomoon.ttf?5kiojs') format('truetype'),
  64. url('https://dl.dropboxusercontent.com/s/eodx1z60h9yimh0/icomoon.woff?5kiojs') format('woff'),
  65. url('https://dl.dropboxusercontent.com/s/m57uc7hijqbua78/icomoon.svg?5kiojs#icomoon') format('svg');
  66. font-weight: normal;
  67. font-style: normal;
  68. }
  69. #reblogged {
  70. bottom:20px!important;
  71. }
  72. #tumblr_controls, .tmblr-iframe {
  73. top:15px!important;
  74. right:5px!important;
  75. -webkit-filter: invert(90%);
  76. filter: invert(90%);
  77. position:fixed!important;
  78. -webkit-transform:scale(.8, .8);
  79. -moz-transform:scale(.8, .8);
  80. transform:scale(.8, .8);
  81. -webkit-transform-origin: right top;
  82. -moz-transform-origin: right top;
  83. -ms-transform-origin: right top;
  84. -o-transform-origin: right top;
  85. transform-origin: right top;
  86. z-index:999999999999999999!important
  87. }
  88. ::-webkit-scrollbar {
  89. background-color:#ddd;
  90. height: 11px;
  91. width: 11px;
  92. border:5px solid #fff;
  93. }
  94. ::-webkit-scrollbar-thumb {
  95. background-color:#000;
  96. border:5px solid #fff;
  97. }
  98. #desc::-webkit-scrollbar {
  99. background-color:#ddd;
  100. height: 11px;
  101. width: 11px;
  102. border:5px solid #eee;
  103. }
  104. #desc::-webkit-scrollbar-thumb {
  105. background-color:#000;
  106. border:5px solid #eee;
  107. }
  108. ::-moz-selection {
  109. color:{color:Dark Accent};
  110. background:rgba({RGBcolor:Accent},0.1);
  111. }
  112.  
  113. ::selection {
  114. color:{color:Dark Accent};
  115. background:rgba({RGBcolor:Accent},0.1);
  116. }
  117. body {
  118. font-family: 'Open Sans', sans-serif;
  119. font-size:11px;
  120. line-height:1.5em;
  121. word-wrap:break-word;
  122. }
  123. body:before {
  124. content: '';
  125. width: 100%;
  126. height: 10px;
  127. position: fixed;
  128. top: 0;
  129. left: 0;
  130. z-index: 10;
  131. background: #eee;
  132. }
  133. body:after {
  134. content: '';
  135. width: 100%;
  136. height: 10px;
  137. position: fixed;
  138. bottom: 0;
  139. left: 0;
  140. z-index: 10;
  141. background: #eee;
  142. }
  143. * {
  144. margin:0;
  145. padding:0;
  146. }
  147. h1,h2,h3,h4,h5,h6 {
  148. font-family:'Gochi Hand', serif;
  149. font-weight:normal;
  150. }
  151. img:not(.lightbox-image), embed, video, .tumblr_video_container, iframe:not(#ask_form):not(.tumblr_audio_player):not(.instagram-media) {
  152. max-width:100%!important;
  153. height:auto;
  154. }
  155. img:not(.lightbox-image) {
  156. vertical-align:middle;
  157. }
  158. .instagram-media {
  159. max-width:100%!important;
  160. }
  161. .tumblr_video_container {
  162. height:auto!important;
  163. }
  164. .vine-embed {
  165. height:220px!important;
  166. }
  167. #infscr-loading {
  168. position:absolute;
  169. margin-bottom:-40px;
  170. bottom:30px;
  171. width:200px;
  172. margin-left:50%;
  173. left:-100px;
  174. text-align:center;
  175. }
  176. a {
  177. color:#000;
  178. text-decoration:none;
  179. -webkit-transition: all 0.3s ease-in-out;
  180. -moz-transition: all 0.3s ease-in-out;
  181. -o-transition: all 0.3s ease-in-out;
  182. transition: all 0.3s ease-in-out;
  183. }
  184. a:hover {
  185. color:{color:Dark Accent};
  186. -webkit-transition: all 0.3s ease-in-out;
  187. -moz-transition: all 0.3s ease-in-out;
  188. -o-transition: all 0.3s ease-in-out;
  189. transition: all 0.3s ease-in-out;
  190. }
  191. a:focus {
  192. outline:0;
  193. }
  194. li {
  195. position:relative;
  196. }
  197. i, em {
  198. /*font-family: 'Nothing You Could Do', cursive;*/
  199. font-size:1.4em;
  200. }
  201. #s-m-t-tooltip {
  202. max-width:300px;
  203. padding:3px 6px;
  204. margin:20px 10px;
  205. background: #000;
  206. color:#fff;
  207. z-index:999999999999999!important;
  208. font-size:9px;
  209. text-transform:uppercase;
  210. font-family:'Anonymous Pro', monospace;
  211. }
  212.  
  213. .back-to-top {
  214. text-align: center;
  215. bottom: 44px;
  216. left: 45px;
  217. font-size: 15px;
  218. cursor: pointer;
  219. text-transform: uppercase;
  220. position: fixed;
  221. z-index: 99999;
  222. }
  223. .back-to-top i {
  224. width: 21px;
  225. height: 21px;
  226. line-height: 21px;
  227. color: {color:Accent};
  228. border: 1px solid {color:Accent};
  229. background: #fff;
  230. padding: 10px;
  231. border-radius: 50%;
  232. vertical-align: middle;
  233. display:block;
  234. }
  235. #sidebar {
  236. width: 320px;
  237. position: fixed;
  238. left: calc(50% - 550px);
  239. top: 180px;
  240. padding: 30px;
  241. z-index: 10;
  242. background: #fafafa;
  243. border: 5px solid #fff;
  244. outline: 1px solid #eaeaea;
  245. box-sizing: border-box;
  246. }
  247. #sidebar h1 {
  248. position: absolute;
  249. top: -35px;
  250. left: 10px;
  251. line-height: 50px;
  252. font-family: 'Sacramento', cursive;
  253. font-size: 40px;
  254. }
  255. #sidebar img {
  256. padding: 5px;
  257. background: #fff;
  258. border: 1px solid #eaeaea;
  259. outline: 5px solid rgba(255,255,255,0.3);
  260. outline-offset: -11px;
  261. box-sizing: border-box;
  262. width: 125px;
  263. display: inline-block;
  264. float: left;
  265. margin-right:-1px;
  266. height:125px;
  267. }
  268. #sidebar #desc {
  269. display: inline-block;
  270. width: 126px;
  271. vertical-align: top;
  272. box-sizing: border-box;
  273. text-align: center;
  274. height: 125px;
  275. padding: 10px;
  276. line-height: 13px;
  277. font-size: 10px;
  278. background: #eee;
  279. border: 6px solid #fff;
  280. outline: 1px solid #eaeaea;
  281. outline-offset: -1px;
  282. font-family:'Anonymous Pro', monospace;
  283. overflow:auto;
  284. }
  285. ul#link-expands {
  286. list-style: none;
  287. padding: 0;
  288. display: none;
  289. position: fixed;
  290. top: 400px;
  291. width: 300px;
  292. text-align: right;
  293. left: calc(50% - 540px);
  294. font-family: 'Anonymous Pro',monospace;
  295. }
  296. ul#link-expands a {
  297. color:#000;
  298. padding: 0 5px;
  299. }
  300. ul#link-expands li:before, ul#navlinks li:before {
  301. display:none;
  302. }
  303. #squiggle {
  304. width: 350px;
  305. height: 240px;
  306. z-index: 0;
  307. background: url(//media.tumblr.com/5f5f0cb8e5dfca95dde0dcc6fb5ad4eb/tumblr_inline_n87ac5ndov1sgp6cl.png) no-repeat;
  308. background-size: contain;
  309. position: fixed;
  310. left: calc(50% - 713px);
  311. opacity: 0.5;
  312. top: 190px;
  313. transform: rotate(181deg) rotateX(180deg);
  314. }
  315. #content.ThreeColumns {
  316. position:relative;
  317. margin:50px auto;
  318. width:740px;
  319. left:200px;
  320. }
  321. #content.TwoColumns {
  322. position:relative;
  323. margin:80px auto;
  324. width:650px;
  325. left:180px;
  326. }
  327. #posts {
  328. margin-bottom:40px;
  329. }
  330. article {
  331. position:relative;
  332. box-sizing:border-box;
  333. padding:5px;
  334. background:#fff;
  335. border:1px solid #eaeaea;
  336.  
  337. {block:IndexPage}overflow:hidden;{/block:IndexPage}
  338. }
  339. .TwoColumns article {
  340. width:280px;
  341. margin-bottom:90px;
  342. }
  343. .ThreeColumns article {
  344. margin-bottom:40px;
  345. width:220px;
  346. }
  347. article .photo {
  348. outline:8px solid rgba(255,255,255,0.3);
  349. outline-offset:-8px;
  350. -webkit-transition: all 0.3s ease-in-out;
  351. -moz-transition: all 0.3s ease-in-out;
  352. -o-transition: all 0.3s ease-in-out;
  353. transition: all 0.3s ease-in-out;
  354. }
  355. {block:IndexPage}article:hover .photo {
  356. outline:150px solid rgba({RGBcolor:Accent},0.5);
  357. outline-offset:-150px;
  358. -webkit-transition: all 0.3s ease-in-out;
  359. -moz-transition: all 0.3s ease-in-out;
  360. -o-transition: all 0.3s ease-in-out;
  361. transition: all 0.3s ease-in-out;
  362. }{/block:IndexPage}
  363. article ul, article ol {
  364. padding-left:25px;
  365. line-height:175%;
  366. margin:10px 0;
  367. }
  368. article ul {
  369. list-style:circle;
  370. }
  371. article hr {
  372. border:none;
  373. width:75%;
  374. margin:15px auto;
  375. height:1px;
  376. background:rgba({RGBcolor:Accent},0.5);
  377. }
  378. blockquote.tumblr_parent {
  379. padding-left: 5px;
  380. padding-right: 5px;
  381. margin: 10px 0px;
  382. padding-bottom: 10px;
  383. line-height: 140%;
  384. position: relative;
  385. border-bottom:1px solid #eaeaea;
  386. }
  387. blockquote.tumblr_parent:before, .chat .labels:before {
  388. content: '\e974';
  389. font-family: "icomoon" !important;
  390. font-style: normal;
  391. font-weight: normal;
  392. speak: none;
  393. display: inline-block;
  394. text-decoration: inherit;
  395. width: 1em;
  396. text-align: center;
  397. font-variant: normal;
  398. text-transform: none;
  399. line-height: 1em;
  400. font-size: 1em;
  401. vertical-align:middle;
  402. -webkit-font-smoothing: antialiased;
  403. -moz-osx-font-smoothing: grayscale;
  404. margin-right: 5px;
  405. color:{color:Dark Accent};
  406. }
  407. blockquote.tumblr_parent:first-of-type {
  408. margin-top:0;
  409. }
  410. blockquote.tumblr_parent p:first-of-type {
  411. display:inline;
  412. }
  413. blockquote.tumblr_parent:last-of-type {
  414. border-bottom:none;
  415. padding-bottom:5px;
  416. margin-bottom:0px;
  417. }
  418. blockquote.tumblr_parent:last-of-type:after {
  419. content:initial;
  420. }
  421. blockquote.tumblr_parent img {
  422. box-sizing: border-box;
  423. border: 2px solid {color:Accent};
  424. margin: 20px 0;
  425. }
  426. blockquote.tumblr_parent p {
  427. margin:10px 0;
  428. }
  429. blockquote.tumblr_parent p:last-of-type {
  430. margin-bottom:0;
  431. }
  432. blockquote.tumblr_parent p a {
  433. color:{color:Dark Accent};
  434. }
  435. blockquote.tumblr_parent h2 {
  436. margin-top:15px;
  437. }
  438. article h2 {
  439. margin-bottom:15px;
  440. font-size:1.9em;
  441. }
  442. a.tumblr_blog {
  443. font-weight:bold;
  444. margin-right:5px;
  445. color:#000;
  446. }
  447. a.tumblr_blog:after {
  448. content:": ";
  449. }
  450. blockquote.tumblr_parent > blockquote {
  451. border-left:2px solid #eee;
  452. padding-left:10px;
  453. margin:10px 0;
  454. margin-left:5px;
  455. }
  456. a.tumblr_blog + blockquote {
  457. display: inline;
  458. }
  459.  
  460. .quote h2 {
  461. background:none;
  462. }
  463. .quote.short h2 {
  464. font-size:2em;
  465. line-height:120%;
  466. }
  467. .quote.medium h2 {
  468. font-size:1.5em;
  469. line-height:120%;
  470. }
  471. .quote.long h2 {
  472. font-size:1em;
  473. }
  474. .quote cite {
  475. text-align:right;
  476. display:block;
  477. }
  478. .chat ul {
  479. padding:0;
  480. list-style:none;
  481. margin:0;
  482. }
  483. .chat .labels {
  484. font-weight:bold;
  485. }
  486. .link h2 {
  487. text-align:left;
  488. }
  489. .album-art {
  490. height:50px;
  491. margin-bottom:15px;
  492. width:100%;
  493. background:{color:Accent} repeat center center;
  494. background-size:contain;
  495. }
  496. .ThreeColumns .album-art {
  497. height:40px;
  498. }
  499. .audio-info {
  500. list-style:none;
  501. padding:0;
  502. margin:0;
  503. }
  504. .audio-info li {
  505. border-bottom:1px solid #eaeaea;
  506. padding:4px;
  507. text-align:right;
  508. }
  509. .audio-info i, .audio-info b {
  510. float:left;
  511. }
  512. .audio-info i {
  513. color:{color:Dark Accent};
  514. margin-right:4px;
  515. }
  516. .tumblr_audio_player {
  517. width: calc(100% - 50px);
  518. position: absolute;
  519. top: 25px;
  520. height: 50px;
  521. opacity: 0.6;
  522. }
  523. .ThreeColumns .tumblr_audio_player {
  524. width:calc(100% - 40px);
  525. height:40px;
  526. top: 20px;
  527. }
  528. .vid {
  529. padding-bottom:2px;
  530. }
  531. .answer h2 {
  532. text-transform:lowercase;
  533. line-height:24px;
  534. }
  535. .answer h2 a, .link h2 a {
  536. color: #000;
  537. border-bottom:none;
  538. }
  539. .answer h2 a:hover, .link h2 a:hover {
  540. color:{color:Dark Accent};
  541. }
  542. .answer h2 img {
  543. margin-right: 8px;
  544. border-radius: 50%;
  545. }
  546. .response {
  547. position: relative;
  548. margin-top: 41px;
  549. }
  550. .query {
  551. position:relative;
  552. }
  553. .query:after {
  554. content: '';
  555. width:75%;
  556. height:1px;
  557. background:rgba({RGBcolor:Accent},0.5);
  558. left: 12.5%;
  559. bottom: -20px;
  560. position: absolute;
  561. }
  562. .response, .also_query {
  563. max-height:150px;
  564. overflow-y:auto;
  565. }
  566. .response.answererer {
  567. overflow:initial;
  568. }
  569. .answer h2:nth-of-type(2) {
  570. margin-top: 41px;
  571. }
  572. .response:empty {
  573. display:none;
  574. overflow:hidden;
  575. }
  576. .answererer:before {
  577. content: '';
  578. width:75%;
  579. height:1px;
  580. background:rgba({RGBcolor:Dark Accent},0.5);
  581. left: 12.5%;
  582. top: -20px;
  583. position: absolute;
  584. }
  585. .permalinks {
  586. list-style:none;
  587. padding:0;
  588. text-align:center;
  589. margin:0;
  590. }
  591. .non-text-type .custom-like-button {
  592. width: 36.39px;
  593. height: 36px;
  594. }
  595. .like_button {
  596. position: absolute;
  597. top: 0;
  598. left: 0;
  599. right: 0;
  600. bottom: 0;
  601. width: 100%;
  602. height: 100%;
  603. opacity: 0;
  604. z-index: 10;
  605. }
  606. .like_button iframe {
  607. width: 100% !important;
  608. height: 100% !important;
  609. }
  610. .our_toggle {
  611. top: 0;
  612. left: 0;
  613. right: 0;
  614. bottom: 0;
  615. width: 18px;
  616. height: 18px;
  617. z-index: 1;
  618. -webkit-transition: all 0.2s ease-in-out;
  619. -moz-transition: all 0.2s ease-in-out;
  620. -o-transition: all 0.2s ease-in-out;
  621. transition: all 0.2s ease-in-out;
  622. }
  623. .like_button:hover + .our_toggle {
  624. color:{color:Dark Accent};
  625. -webkit-transition: all 0.2s ease-in-out;
  626. -moz-transition: all 0.2s ease-in-out;
  627. -o-transition: all 0.2s ease-in-out;
  628. transition: all 0.2s ease-in-out;
  629. }
  630. .like_button.liked + .our_toggle .icon-oi_heart:before {
  631. content: "\e992";
  632. }
  633. .text-type .permalinks a {
  634. color:{color:Accent};
  635. }
  636. .non-text-type .permalinks a {
  637. color:#fff;
  638. }
  639. .permalinks a:hover {
  640. color:{color:Dark Accent};
  641. }
  642. .permalinks li {
  643. display:inline-block;
  644. margin:0 5px;
  645. }
  646. .text-type .permalinks {
  647. text-align:right;
  648. padding:20px;
  649. }
  650. .ThreeColumns .text-type .permalinks {
  651. padding:15px;
  652. }
  653. .text-type .permalinks li {
  654. color:{color:Accent};
  655. }
  656. .text-type .permalinks li i:before {
  657. vertical-align: middle;
  658. }
  659. .non-text-type .permalinks {
  660. font-size:26px;
  661. line-height:30px;
  662. color:#fff;
  663. position:absolute;
  664. top:calc(50% - 15px);
  665. left:0;
  666. width:100%;
  667. opacity:0;
  668. visibility:hidden;
  669. transform:scale(0);
  670. -webkit-transition: all 0.3s ease-in-out;
  671. -moz-transition: all 0.3s ease-in-out;
  672. -o-transition: all 0.3s ease-in-out;
  673. transition: all 0.3s ease-in-out;
  674. }
  675. article.non-text-type:hover .permalinks {
  676. transform:scale(1);
  677. opacity:1;
  678. visibility:visible;
  679. -webkit-transition: all 0.3s ease-in-out;
  680. -moz-transition: all 0.3s ease-in-out;
  681. -o-transition: all 0.3s ease-in-out;
  682. transition: all 0.3s ease-in-out;
  683. }
  684. .text-type > * {
  685. background:#fafafa;
  686. }
  687. .text-type > div:first-of-type {
  688. padding:20px 20px{block:IndexPage} 0{/block:IndexPage};
  689. }
  690. {block:IndexPage}.ThreeColumns .text-type > div:first-of-type {
  691. padding:15px 15px 0;
  692. }{/block:IndexPage}
  693. .photoset {
  694. padding:0;
  695. }
  696. .non-text-type .caption,
  697. .audio + .caption,
  698. .vid + .caption,
  699. .photoset + .caption {
  700. padding:10px;
  701. background:#fafafa;
  702. margin-top:5px;
  703. }
  704. .text-type blockquote.tumblr_parent {
  705. padding-left:0;
  706. padding-right:0;
  707. }
  708. .caption-audio blockquote.tumblr_parent,
  709. .caption-video blockquote.tumblr_parent,
  710. .caption-photoset blockquote.tumblr_parent {
  711. padding-left:5px;
  712. padding-right:5px;
  713. }
  714. {block:PermalinkPage}
  715. .TwoColumns article, .ThreeColumns article {
  716. width:450px;
  717. }
  718. .audio {
  719. padding:15px;
  720. }
  721. .audio-info li {
  722. padding:4px 0;
  723. }
  724. .ThreeColumns .tumblr_audio_player,
  725. .tumblr_audio_player {
  726. top:25px;
  727. height:80px;
  728. width:calc(100% - 50px);
  729. }
  730. .ThreeColumns .album-art,
  731. .album-art {
  732. height:80px;
  733. }
  734. .extra-info {
  735. line-height: 22px;
  736. margin-top: 5px;
  737. padding: 15px;
  738. background: #fafafa;
  739. margin-bottom: 5px;
  740. }
  741. .extra-info i {
  742. vertical-align: middle;
  743. margin-right: 5px;
  744. font-size:11px;
  745. color:{color:Dark Accent};
  746. }
  747. ol.notes a, .extra-info a {
  748. color:#000;
  749. font-weight:bold;
  750. }
  751. ol.notes {
  752. padding:0;
  753. margin: 0;
  754. list-style-type: none;
  755. padding: 15px;
  756. margin-top:5px;
  757. background:#fafafa;
  758. }
  759. ol.notes li.note {
  760. padding: 3px 0;
  761. margin-bottom:3px;
  762. }
  763. ol.notes li.note img.avatar {
  764. float:right;
  765. border-radius:50%;
  766. margin-top:1px;
  767. }
  768. ol.notes li.note blockquote {
  769. border-left:2px solid #eee;
  770. padding-left:10px;
  771. margin:10px 0;
  772. margin-left:15px;
  773. }
  774. ol.notes li.note blockquote a {
  775. text-decoration: none;
  776. }
  777. li.more_notes_link_container {
  778. font-weight: bold;
  779. text-transform: uppercase;
  780. font-size: 0.85em;
  781. }
  782. li.like:before {
  783. content: '\e993';
  784. font-family: "icomoon" !important;
  785. font-style: normal;
  786. font-weight: normal;
  787. speak: none;
  788. display: inline-block;
  789. text-decoration: inherit;
  790. width: 1em;
  791. text-align: center;
  792. font-variant: normal;
  793. text-transform: none;
  794. line-height: 1em;
  795. font-size: 1em;
  796. vertical-align:middle;
  797. -webkit-font-smoothing: antialiased;
  798. -moz-osx-font-smoothing: grayscale;
  799. margin-right: 5px;
  800. color: #f3719f;
  801. }
  802. li.reblog:before {
  803. content: '\e9ae';
  804. font-family: "icomoon" !important;
  805. font-style: normal;
  806. font-weight: normal;
  807. speak: none;
  808. display: inline-block;
  809. text-decoration: inherit;
  810. width: 1em;
  811. text-align: center;
  812. font-variant: normal;
  813. text-transform: none;
  814. line-height: 1em;
  815. font-size: 1em;
  816. vertical-align:middle;
  817. -webkit-font-smoothing: antialiased;
  818. -moz-osx-font-smoothing: grayscale;
  819. margin-right: 5px;
  820. color:{color:Dark Accent};
  821. }
  822. li.original_post:before {
  823. content:'\e9b8';
  824. }
  825. {block:PermalinkPage}
  826. ul#navlinks {
  827. list-style: none;
  828. position: absolute;
  829. right: 4px;
  830. bottom: -22px;
  831. }
  832. ul#navlinks li {
  833. display: inline-block;
  834. margin: 3px;
  835. background: {color:Accent};
  836. width: 22px;
  837. border: 3px solid #fff;
  838. outline: 1px solid #eaeaea;
  839. height: 22px;
  840. line-height: 22px;
  841. text-align: center;
  842. }
  843. </style>
  844. </head>
  845. <body>
  846. <div id="squiggle"></div>
  847. <div id="sidebar">
  848. <h1><a href="/">{Title}</a></h1>
  849. <img src="{image:Sidebar}"><!--
  850. -->{block:Description}<div id="desc">
  851. {Description}
  852. </div>{/block:Description}
  853. <ul id="navlinks">
  854. <li><a href="/" title="home"><i class="icon-oi_home"></i></a>
  855. {block:AskEnabled}<li><a href="{text:Ask Link}" title="message"><i class="icon-oi_mail"></i></a>{/block:AskEnabled}
  856. {block:HasPages}<li><a id="links" title="links" style="cursor:pointer;"><i class="icon-oi_info"></i></a>{/block:HasPages}
  857. <li><a href="/archive" title="past"><i class="icon-oi_grid"></i></a>
  858. </ul>
  859. </div>
  860. {block:HasPages}<ul id="link-expands">
  861. {block:Pages}<li><a href="{URL}">{Label}</a>{/block:Pages}
  862. </ul>{/block:HasPages}
  863. <div id="content" class="{select:Columns}">
  864. <div id="posts">{block:Posts}
  865. <article id="{PostID}" class="{block:Photo}non-{/block:Photo}text-type">
  866. {block:Text}<div class="text">
  867. {block:Title}<h2>{Title}</h2>{/block:Title}
  868. <div class="caption">{Body}</div>
  869. </div>{/block:Text}{block:Photo}<div class="photo">
  870. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />
  871. </div>{/block:Photo}{block:Photoset}<div class="photoset">
  872. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  873. </div>{/block:Photoset}{block:Quote}<div class="quote {Length}">
  874. <h2>{Quote}</h2>
  875. {block:Source}<cite>&mdash; {Source}</cite>{/block:Source}
  876. </div>{/block:Quote}{block:Chat}<div class="chat">
  877. {block:Title}<h2>{Title}</h2>{/block:Title}
  878. <ul>
  879. {block:Lines}<li>{block:Label}<span class="labels">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}
  880. </ul>
  881. </div>{/block:Chat}{block:Link}<div class="link">
  882. <h2><i class="icon-oi_link"></i> <a href="{URL}">{Name}</a></h2>
  883. {block:Description}{Description}{/block:Description}
  884. </div>{/block:Link}{block:Audio}<div class="audio">
  885. {block:AlbumArt}<div class="album-art" style="background-image:url({AlbumArtURL})"></div>{/block:ALbumArt}
  886. <ul class="audio-info">
  887. <li><i class="icon-oi_mic"></i> <b>Artist:</b> <span {block:Artist}style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br>
  888. <li><i class="icon-oi_playlist"></i> <b>Title:</b> <span {block:TrackName}style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br>
  889. <li><i class="icon-oi_disc"></i> <b>Album:</b> <span {block:Album}style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}<br>
  890. <li><i class="icon-oi_repeat"></i> <b>Plays:</b> {FormattedPlayCount}
  891. </ul>
  892. {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  893. </div>{/block:Audio}{block:Video}<div class="vid">
  894. <div class="video">{Video-500}</div>
  895. </div>{/block:Video}{block:Answer}<div class="answer">
  896. <h2><img src="{AskerPortraitURL-24}">{Asker} asked:</h2>
  897. <div class="question query">{Question}</div>
  898. {block:Answerer}
  899. <h2><img src="{AnswererPortraitURL-24}">{Answerer} replied:</h2>
  900. <div class="question also_query">{Answer}</div>
  901. {/block:Answerer}
  902. <div class="response{block:Answerer} answererer{/block:Answerer}">{Replies}</div>
  903. </div>{/block:Answer}
  904. {block:IndexPage}<ul class="permalinks">
  905. <li class="custom-like-button" title="like">{LikeButton}<div class="our_toggle"><i class="icon-oi_heart"></i></span></div>
  906. <li><a href="{ReblogURL}" target="_blank" title="Reblog?"><i class="icon-oi_refresh"></i></a>
  907. <li><a href="{Permalink}" target="_blank" title="{NoteCount}"><i class="icon-oi_time"></i></a>
  908. </ul>{/block:IndexPage}
  909. {block:PermalinkPage}{block:Caption}<div class="caption caption{block:Audio}-audio{/block:Audio}{block:Video}-video{/block:Video}{block:Photoset}-photoset{/block:Photoset}">
  910. {Caption}
  911. </div>{/block:Caption}
  912. {block:Date}<div class="extra-info">
  913. <i class="icon-oi_time"></i> {DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}
  914. {block:NoteCount}<br><i class="icon-oi_bookmark"></i> {NoteCount}{/block:NoteCount}
  915. {block:RebloggedFrom}<br><i class="icon-oi_chart"></i> <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  916. {block:ContentSource}<br><i class="icon-oi_globe"></i> <a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource}
  917. {block:HasTags}<br><i class="icon-oi_tags"></i> {block:Tags}<a href="/tagged/{Tag}">#{Tag}</a> {/block:Tags}{/block:HasTags}
  918. </div>{/block:Date}
  919. {block:PostNotes}<div id="notes" class="tb">
  920. {PostNotes-16}
  921. </div>{/block:PostNotes}
  922. {/block:PermalinkPage}
  923. </article>
  924. {/block:Posts}</div>
  925. </div>
  926. <div class="back-to-top" title="back to top"><i class="icon-oi_arrow-up"></i></div>
  927. {block:Pagination}
  928. <div class="pagination" style="visibility:hidden;">
  929. {block:NextPage}<a href="{NextPage}" id="next-link">next</a>{/block:NextPage}
  930. </div>
  931. {/block:Pagination}
  932. <script src="//static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  933. <script src="//static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  934. <script src="//static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  935. <link href="//static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  936. <script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  937. <script src="//static.tumblr.com/wgg6svp/I8Yobwo15/unnest.min.js"></script>
  938. <script>
  939. var pxuOptions = {
  940. lightbox: true,
  941. rounded: false,
  942. gutter: '0px',
  943. photoset: '.photo-slideshow',
  944. photoWrap: '.photo-data',
  945. photo: '.pxu-photo'
  946. }, infScrollOptions = {
  947. navSelector : "div.pagination",
  948. nextSelector : ".pagination a#next-link",
  949. itemSelector : "article",
  950. loading: {
  951. finishedMsg: "<p>You've reached the end of the Earth.</p>",
  952. img : "https://res1.nabtrade.com.au/Content/Images/ajax_loader.gif",
  953. msg: null,
  954. msgText: "",
  955. },
  956. }, masonryThreeColumnsOptions = {
  957. itemSelector: 'article',
  958. isAnimated:false,
  959. columnWidth:220,
  960. gutterWidth:40,
  961. }, masonryTwoColumnsOptions = {
  962. itemSelector: 'article',
  963. isAnimated:false,
  964. columnWidth:280,
  965. gutterWidth:90,
  966. }, unnestOptions = {
  967. yourCaption: ".caption",
  968. wrapName: ".tumblr_parent",
  969. newCaptionUsername: true,
  970. originalPostCaptionUsername: true,
  971. tumblrAvatars: false,
  972. tumblrAvatarClass: ".caption_avatar",
  973. usernameColon: false
  974. }
  975. $(function(){
  976. $('#links').click(function(e){
  977. e.preventDefault();
  978. $('#link-expands').slideToggle('slow');
  979. });
  980. // scroll to top © html-tuts.com
  981. var amountScrolled = 300;
  982. $(window).scroll(function() {
  983. if ( $(window).scrollTop() > amountScrolled ) {
  984. $('.back-to-top').fadeIn('slow');
  985. } else {
  986. $('.back-to-top').fadeOut('slow');
  987. }
  988. });
  989. $('.back-to-top').click(function() {
  990. $('html, body').animate({
  991. scrollTop: 0
  992. }, 700);
  993. return false;
  994. });
  995. $('.photo-slideshow').pxuPhotoset(pxuOptions);
  996. $('article').unnest(unnestOptions);
  997. $('.caption p').each(function(index, item) {
  998. if(($.trim($(item).text()) === "")
  999. && !($(item).has("img").length)) {
  1000. $(item).remove();
  1001. }
  1002. });
  1003. $('.label:contains(":")').each(function(){
  1004. $(this).html($(this).html().split(":").join(""));
  1005. });
  1006. {block:IndexPage}
  1007. var $tumblelog = $('#posts');
  1008. $tumblelog.imagesLoaded(function () {
  1009. $tumblelog.masonry(masonry{select:Columns}Options);
  1010. });
  1011. $tumblelog.infinitescroll(
  1012. infScrollOptions, function( newElements ) {
  1013. var $newElems = $( newElements );
  1014. var $newElemsIDs = $newElems.map(function () {
  1015. return this.id;
  1016. }).get();
  1017. $newElems.find('.photo-slideshow').pxuPhotoset(pxuOptions);
  1018. $newElems = $(newElements).css({ opacity: 0, zIndex: -1});
  1019. $newElems.imagesLoaded(function(){
  1020. $newElems.animate({ opacity: 1, zIndex: 1 });
  1021. $tumblelog.masonry( 'appended', $newElems );
  1022. });
  1023. $newElems.unnest(unnestOptions);
  1024. $('.caption p').each(function(index, item) {
  1025. if(($.trim($(item).text()) === "")
  1026. && !($(item).has("img").length)) {
  1027. $(item).remove();
  1028. }
  1029. });
  1030. $('.label:contains(":")').each(function(){
  1031. $(this).html($(this).html().split(":").join(""));
  1032. });
  1033. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1034. });
  1035.  
  1036. {/block:IndexPage}
  1037. })();
  1038. </script>
  1039. <link href="//static.tumblr.com/wupwnyt/1iho27ad1/gkthm.css" rel="stylesheet" type="text/css">
  1040. </body>
  1041. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement