API tools faq
paste
Advertisement
Guest User

«bakovia» theme by Felinium ::LITE::

a guest
Jan 18th, 2018
138
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 45.92 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7.  
  8. Theme «bakovia» by felinum
  9.  
  10.  
  11. Rules:
  12.  
  13. 1. Don't implement parts of my code into your themes w/o permission.
  14. 2. Don't claim any part of the code as your own.
  15. 3. Don't redistribute it on other sites.
  16. 4. Leave the credit intact and visible (don't move it to secondary pages).
  17. 5. You may edit the theme, but not beyond recognition.
  18.  
  19.  
  20. Credits:
  21.  
  22. - Unnest Tumblr Captions: @neothm & @magnusthemes (http://neothm.com/post/148902138319/)
  23. - Pixel Union Photoset: Pixel Union (https://github.com/PixelUnion/Extended-Tumblr-Photoset)
  24. - Infinite Scroll: Paul Irish (https://github.com/infinite-scroll/infinite-scroll)
  25. - Video Resizing: @ shythemes (http://shythemes.tumblr.com/post/134536748863/)
  26. - Photo Lightbox: @ shythemes (http://shythemes.tumblr.com/post/140444996328/)
  27. - Styled Tooltips: Manos Malihutsakis (http://manos.malihu.gr/tuts/style-my-tooltips.html)
  28. - Masonry: David DeSandro (http://masonry.desandro.com/)
  29. - Like Button with infinite scroll: @magnusthemes (http://magnusthemes.tumblr.com/post/132530444620)
  30. - Icons: elegantthemes (https://www.elegantthemes.com/blog/resources/how-to-use-and-embed-an-icon-font-on-your-website)
  31.  
  32.  
  33. -->
  34.  
  35.  
  36. <title>{Title}</title>
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  38. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  39. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  40.  
  41. <link href='https://fonts.googleapis.com/css?family=Chivo:400,400i,700,700i|Work+Sans:400,700|Karla:400,400i,700,700i|Roboto:400,400i,700,700i|Hind:400,700|Lato:400,400i,700,700i|Muli:400,400i,700,700i|Fira+Sans:400,400i,700,700i|Space+Mono|Inconsolata:400,700|Source+Code+Pro:400,700|Eczar:400,700|PT+Serif:400,400i,700,700i|Merriweather:400,400i,700,700i|Playfair+Display:400,400i,700,700i|Cardo:400,400i,700' rel='stylesheet' type='text/css'>
  42.  
  43. <link rel="stylesheet" href="http://static.tumblr.com/0cdn90j/6tsok76o0/stylefel.css"><link rel="stylesheet" href="http://static.tumblr.com/0cdn90j/Sk9o7br1a/micaelis.css"><link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  44.  
  45. <meta name="image:Background" content=""/>
  46. <meta name="image:Sidebar Img" content="http://static.tumblr.com/96ca88e16d3d23cc748e23cfee426867/0cdn90j/DL4oljehv/tumblr_static_3evshrlqj9c00wogs4gw4sskw.png"/>
  47.  
  48. <meta name="color:Background" content="#fff"/>
  49. <meta name="color:Text" content="#6d6d6d"/>
  50. <meta name="color:Link" content="#000"/>
  51. <meta name="color:Link Hover" content="#b8a6ac"/>
  52. <meta name="color:Post Background" content="#fff"/>
  53. <meta name="color:Sidebar Background" content="#fff"/>
  54.  
  55. <meta name="color:Title" content="#000"/>
  56. <meta name="color:Title Hover" content="#333333"/>
  57. <meta name="color:Subtitle" content="#df728a"/>
  58. <meta name="color:Nav Icons" content="#000"/>
  59. <meta name="color:Nav Icons Hover" content="#e997c1"/>
  60. <meta name="color:Nav Links" content="#000"/>
  61. <meta name="color:Nav Links Hover" content="#000"/>
  62.  
  63. <meta name="color:Post Border" content="#e5e5e5"/>
  64. <meta name="color:Blockquote Border" content="#fff"/>
  65. <meta name="color:Post Info" content="#b0b0b0"/>
  66. <meta name="color:Post Info Hover" content="#ebbad6"/>
  67. <meta name="color:Tags" content="#e7dde0"/>
  68. <meta name="color:Tags Hover" content="#2b2b2b"/>
  69. <meta name="color:Like Reblog Buttons" content="#a5a5a5"/>
  70. <meta name="color:Like Reblog Buttons Hover" content="#f1bad9"/>
  71. <meta name="color:Like Button Liked" content="#e997c8"/>
  72.  
  73. <meta name="color:Selection Text" content="#000"/>
  74. <meta name="color:Selection Background" content="#f8dced"/>
  75. <meta name="color:Search Box Background" content="#f8f8f8"/>
  76. <meta name="color:Search Box Border" content="#f4f4f4"/>
  77. <meta name="color:Search Box Placeholder" content="#b0b0b0"/>
  78. <meta name="color:Tooltip Text" content="#7e7e7e"/>
  79. <meta name="color:Tooltip Background" content="#fff"/>
  80. <meta name="color:Tooltip Border" content="#f6f6f6"/>
  81. <meta name="color:Back to Top Icon" content="#575757"/>
  82. <meta name="color:Back to Top Icon Hover" content="#e997bf"/>
  83.  
  84. <meta name="color:Post Accent 1" content="#272727"/>
  85. <meta name="color:Post Accent 2" content="#696969"/>
  86.  
  87.  
  88. <meta name="select:Body Font Size" content="10" title="10px"/>
  89. <meta name="select:Body Font Size" content="11" title="11px"/>
  90. <meta name="select:Body Font Size" content="12" title="12px"/>
  91. <meta name="select:Body Font Size" content="13" title="13px"/>
  92.  
  93. <meta name="select:Body Font Family" content="Chivo" title="Chivo"/>
  94. <meta name="select:Body Font Family" content="Work Sans" title="Work Sans"/>
  95. <meta name="select:Body Font Family" content="Karla" title="Karla">
  96. <meta name="select:Body Font Family" content="Roboto" title="Roboto"/>
  97. <meta name="select:Body Font Family" content="Hind" title="Hind"/>
  98. <meta name="select:Body Font Family" content="Lato" title="Lato"/>
  99. <meta name="select:Body Font Family" content="Muli" title="Muli"/>
  100. <meta name="select:Body Font Family" content="Fira Sans" title="Fira Sans"/>
  101. <meta name="select:Body Font Family" content="Space Mono" title="Space Mono"/>
  102. <meta name="select:Body Font Family" content="Inconsolata" title="Inconsolata"/>
  103. <meta name="select:Body Font Family" content="Source Code Pro" title="Source Code Pro"/>
  104. <meta name="select:Body Font Family" content="Eczar" title="Eczar"/>
  105. <meta name="select:Body Font Family" content="PT Serif" title="PT Serif"/>
  106. <meta name="select:Body Font Family" content="Merriweather" title="Merriweather"/>
  107. <meta name="select:Body Font Family" content="Cardo" title="Cardo"/>
  108. <meta name="select:Body Font Family" content="Playfair Display" title="Playfair Display">
  109.  
  110. <meta name="select:Sidebar Icon Shape" content="4" title="rounded corners"/>
  111. <meta name="select:Sidebar Icon Shape" content="30" title="round"/>
  112. <meta name="select:Sidebar Icon Shape" content="0" title="square"/>
  113.  
  114. <meta name="select:Post Icon Shape" content="9" title="rounded corners"/>
  115. <meta name="select:Post Icon Shape" content="50" title="round"/>
  116. <meta name="select:Post Icon Shape" content="0" title="square"/>
  117.  
  118. <meta name="select:Post Icon Size" content="24" title="24px"/>
  119. <meta name="select:Post Icon Size" content="18" title="18px"/>
  120. <meta name="select:Post Icon Size" content="30" title="30px"/>
  121.  
  122. <meta name="select:Audio Image Shape" content="4" title="rounded corners"/>
  123. <meta name="select:Audio Image Shape" content="25" title="round"/>
  124. <meta name="select:Audio Image Shape" content="0" title="square"/>
  125.  
  126. <meta name="select:Photoset Gutter" content="2" title="2px"/>
  127. <meta name="select:Photoset Gutter" content="0" title="0px"/>
  128. <meta name="select:Photoset Gutter" content="1" title="1px"/>
  129. <meta name="select:Photoset Gutter" content="3" title="3px"/>
  130. <meta name="select:Photoset Gutter" content="4" title="4px"/>
  131.  
  132. <meta name="select:Search Bar" content="top" title="top"/>
  133. <meta name="select:Search Bar" content="bottom" title="bottom"/>
  134.  
  135. <meta name="select:Controls" content=".4" title="gray"/>
  136. <meta name="select:Controls" content="1" title="black"/>
  137.  
  138. <meta name="if:Infinite Scroll" content="0"/>
  139. <meta name="if:Rounded Post Corners" content="0"/>
  140. <meta name="if:Post Shadow" content="0"/>
  141. <meta name="if:Post Shadow on Hover" content="1"/>
  142. <meta name="if:Post Border" content="0"/>
  143. <meta name="if:Subtitle" content="1"/>
  144. <meta name="if:Subtitle Animation" content="1"/>
  145. <meta name="if:Top Caption" content="1"/>
  146. <meta name="if:Top Tags" content="1"/>
  147. <meta name="if:Fade In On Refresh" content="1"/>
  148.  
  149. <meta name="text:Subtitle" content="subtitle must be shorter than title"/>
  150. <meta name="text:Post Size" content="300"/>
  151. <meta name="text:Permalink Post Size" content="540"/>
  152. <meta name="text:Number of Columns" content="1"/>
  153. <meta name="text:Post Side Margin" content="20"/>
  154. <meta name="text:Post Padding" content="0"/>
  155. <meta name="text:Post Bottom Margin" content="100"/>
  156.  
  157. <meta name="text:Link Icons Help" content="elegantthemes.com/blog/resources/how-to-use-and-embed-an-icon-font-on-your-website"/>
  158.  
  159. <meta name="text:Link 1 Text" content="link 1"/>
  160. <meta name="text:Link 1 URL" content="/"/>
  161. <meta name="text:Link 1 Icon" content="attachment"/>
  162. <meta name="text:Link 2 Text" content="link 2"/>
  163. <meta name="text:Link 2 URL" content="/url"/>
  164. <meta name="text:Link 2 Icon" content="attachment"/>
  165. <meta name="text:Link 3 Text" content="link 3"/>
  166. <meta name="text:Link 3 URL" content="/url"/>
  167. <meta name="text:Link 3 Icon" content="attachment"/>
  168. <meta name="text:Link 4 Text" content="link 4"/>
  169. <meta name="text:Link 4 URL" content="/url"/>
  170. <meta name="text:Link 4 Icon" content="attachment"/>
  171. <meta name="text:Link 5 Text" content="link 5"/>
  172. <meta name="text:Link 5 URL" content="/url"/>
  173. <meta name="text:Link 5 Icon" content="attachment"/>
  174. <meta name="text:Link 6 Text" content="link 6"/>
  175. <meta name="text:Link 6 URL" content="/url"/>
  176. <meta name="text:Link 6 Icon" content="attachment"/>
  177.  
  178.  
  179.  
  180. <style type="text/css">
  181.  
  182. /* general */
  183.  
  184. *, *:hover {transition:.2s;}
  185.  
  186. body {
  187. opacity:1;
  188. transition:.5s opacity;
  189. font:{select:Body Font Size}px {select:Body Font Family}, sans-serif;
  190. color:{color:Text};
  191. background:{color:Background} url('{image:Background}') repeat fixed center;
  192. }
  193.  
  194. body.fade-out {opacity:0; transition:none;}
  195.  
  196. ::-webkit-scrollbar {width:11px; height:11px;}
  197. ::-webkit-scrollbar-track {border:5px solid #f8f8f8; background-color:#eee;}
  198. ::-webkit-scrollbar-thumb {
  199. border:5px solid rgba(245, 246, 248, 0);
  200. background-clip:padding-box;
  201. background-color:rgba(0, 0, 0, 1);
  202. }
  203.  
  204. #s-m-t-tooltip {
  205. max-width:300px;
  206. margin:7px 14px 7px 12px;
  207. padding:5px;
  208. z-index:999999999999999999;
  209. background-color:{color:Tooltip Background};
  210. color:{color:Tooltip Text};
  211. border:1px solid {color:Tooltip Border};
  212. border-radius:3px;
  213. }
  214.  
  215. .tmblr-iframe, #tumblr_controls {
  216. position:fixed;
  217. top:10px!important;
  218. opacity:{select:Controls};
  219. -webkit-filter: invert(100%);
  220. -moz-filter:invert(100%);
  221. -ms-filter:invert(100%);
  222. -o-filter:invert(100%);
  223. filter:invert(100%);
  224. }
  225.  
  226. .tmblr-iframe:hover {opacity:.7;}
  227.  
  228. ::selection {background-color:{color:Selection Background}; color:{color:Selection Text};}
  229. ::-moz-selection {background-color:{color:Selection Background}; color:{color:Selection Text};}
  230.  
  231. a {color:{color:Link}; text-decoration:none;}
  232. a:hover {color:{color:Link Hover}; text-decoration:none;}
  233.  
  234. pre {
  235. font-family:inherit !important;
  236. white-space:pre-wrap;
  237. white-space:-moz-pre-wrap;
  238. white-space:-pre-wrap;
  239. white-space:-o-pre-wrap;
  240. word-wrap:break-word;
  241. }
  242.  
  243. h6, small, sup, sub {font-size:1em;}
  244. h4, h5, h6 {margin:6px 0;}
  245. h5 {font-size:1.1em;}
  246. h4, big {font-size:1.2em;}
  247. h3 {font-size:1.3em;}
  248. h2 {font-size:1.4em;}
  249. h1 {font-size:1.5em;}
  250.  
  251. blockquote {
  252. margin:0;
  253. padding:0 10px;
  254. border-left:1px solid {color:Blockquote Border};
  255. }
  256.  
  257. hr {border:1px solid {color:Blockquote Border};}
  258.  
  259. ul {list-style-type:none; margin:0 0 0 -30px;}
  260. ul > li:not(.like):not(.reblog):not(.line):before {content:'>'; margin-right:10px;}
  261. ul > li li:before {margin-left:10px;}
  262. ol {margin-left:-20px;}
  263. ol li {padding-left:5px;}
  264.  
  265. img {max-width:100%; height:auto;}
  266.  
  267. /* posts */
  268.  
  269. #posts_container {
  270. margin-left:320px;
  271. margin-top:50px;
  272. {block:Permalink}margin-top:60px;{/block:Permalink}
  273. {block:IndexPage}width:calc(({text:Post Size}px - 4px + 2 * ({text:Post Padding}px + {text:Post Side Margin}px {block:ifPostBorder}+ 1px{/block:ifPostBorder})) * {text:Number of Columns});{/block:IndexPage}
  274. {block:Permalink}width:calc({text:Permalink Post Size}px + {text:Post Padding}px * 2 - 4px {block:ifPostBorder}+ 2px{/block:ifPostBorder});{/block:Permalink}
  275. }
  276.  
  277. .posts {
  278. {block:IndexPage}
  279. margin-left:{text:Post Side Margin}px;
  280. margin-right:{text:Post Side Margin}px;
  281. {/block:IndexPage}
  282. margin-bottom:{text:Post Bottom Margin}px;
  283. {block:Permalink}margin-bottom:100px;{/block:Permalink}
  284. padding:0 {text:Post Padding}px;
  285. padding-bottom:{text:Post Padding}px;
  286. overflow-wrap:break-word;
  287. word-wrap:break-word;
  288. background-color:{color:Post Background};
  289. {block:ifPostShadow}
  290. -webkit-box-shadow:-2px 2px 11px 0px rgba(227,227,227,.7);
  291. -moz-box-shadow:-2px 2px 11px 0px rgba(227,227,227,.7);
  292. box-shadow:-2px 2px 11px 0px rgba(227,227,227,.7);
  293. {/block:ifPostShadow}
  294. {block:ifPostBorder}border:1px solid {color:Post Border};{/block:ifPostBorder}
  295. {block:ifRoundedPostCorners}border-radius:5px;{/block:ifRoundedPostCorners}
  296. }
  297.  
  298. .posts:hover {
  299. {block:ifPostShadowonHover}
  300. -webkit-box-shadow:-2px 2px 11px 0px rgba(227,227,227,.7);
  301. -moz-box-shadow:-2px 2px 11px 0px rgba(227,227,227,.7);
  302. box-shadow:-2px 2px 11px 0px rgba(227,227,227,.7);
  303. {/block:ifPostShadowonHover}
  304. }
  305.  
  306. .vertebrae {
  307. margin:auto;
  308. overflow:hidden;
  309. {block:Permalink}width:calc({text:Permalink Post Size}px - 4px);{/block:Permalink}
  310. {block:IndexPage}width:calc({text:Post Size}px - 4px);{/block:IndexPage}
  311. {block:ifRoundedPostCorners}border-radius:5px;border-top-left-radius:0px;border-top-right-radius:0px;{/block:ifRoundedPostCorners}
  312. }
  313.  
  314. .photo-slideshow .count-1, .pancake {
  315. {block:Permalink}width:{text:Permalink Post Size}px;{/block:Permalink}
  316. {block:IndexPage}width:{text:Post Size}px;{/block:IndexPage}
  317. }
  318.  
  319. .pancake a.dont {position:relative; top:5px;}
  320.  
  321. .photo-slideshow {position:relative;}
  322. .photo-slideshow .count-3 {max-width:177px; margin-bottom:calc({select:Photoset Gutter}px + 2px);}
  323. .photo-slideshow .row:last-of-type .count-3 {margin-bottom:0 !important;}
  324. .photo-slideshow .count-3:last-child {float:right;}
  325. .photo-slideshow .count-3:nth-child(2) {
  326. max-width:178px;
  327. position:absolute;
  328. left:50%;
  329. transform:translateX(-50%);
  330. -webkit-transform:translateX(-50%)
  331. }
  332.  
  333. .vignette, #vignette {opacity:0;}
  334.  
  335. .lightbox-image, #tumblr_lightbox img {
  336. box-shadow:none!important;
  337. max-width:none;
  338. padding:4px;
  339. border:1px solid #eee!important;
  340. border-radius:4px;
  341. }
  342.  
  343. .tmblr-lightbox, #tumblr_lightbox {
  344. position:absolute;
  345. z-index:99999999999999999999999999999!important;
  346. background-color:rgba(255,255,255,.9)!important;
  347. }
  348.  
  349. /* caption / text */
  350.  
  351. .caption {margin:0 5px; line-height:2em;}
  352.  
  353. a.read_more, .caption a {border-bottom:1px dotted {color:tags};}
  354. a.read_more:hover, .caption a:hover {border-bottom:1px dotted {color:tags};}
  355.  
  356. img.tumblr_avatar {
  357. vertical-align:middle;
  358. width:{select:Post Icon Size}px;
  359. border-radius:{select:Post Icon Shape}%;
  360. }
  361.  
  362. .caption a.tumblr_blog, .caption a.tumblr_blog:hover {margin-left:7px; border:none;}
  363.  
  364. .tumblr_parent p {padding-left:2px;}
  365.  
  366. blockquote.tumblr_parent {padding:3px 3px 0px 3px; {block:ifnotTopCaption}padding-top:10px;{/block:ifnotTopCaption}border:none;}
  367.  
  368. hr {border-top:1px solid #f6f6f6;}
  369.  
  370. /* text / link post */
  371.  
  372. .text_post_title, h1 {
  373. margin:5px 10px;
  374. font-size:1.5em;
  375. font-weight:bold;
  376. color:{color:Post Accent 1};
  377. }
  378.  
  379. .text_post_title a {color:{color:Text Post Title};}
  380. .text_post_title a:hover {color:{color:Link Hover};}
  381.  
  382. /* question */
  383.  
  384. .quest1 {padding-bottom:10px;}
  385.  
  386. .let {
  387. text-align:center;
  388. font-weight:bold;
  389. font-size:18px;
  390. color:{color:Text Post Title};
  391. }
  392.  
  393. .let:first-of-type {padding-bottom:10px;}
  394. .let:before {margin-left:-60px;}
  395. .let:after {margin-left:10px;}
  396. .let:before, .let:after {
  397. position:absolute;
  398. content:'';
  399. width:50px;
  400. margin-top:10px;
  401. border-bottom:1px dotted {color:tags};
  402. }
  403.  
  404. .question, .answer {line-height:2em; padding:0 10px;}
  405.  
  406. .asker {text-align:right; margin:5px 15px 0 0;}
  407. .asker a {color:{color:Post Accent 2};}
  408. .asker a:hover {color:{color:Link Hover};}
  409.  
  410. .answer p {margin-top:-5px;}
  411. .answer blockquote {
  412. background:#f7f7f7;
  413. border-left:5px solid {color:Post Info};
  414. }
  415.  
  416. /* quote */
  417.  
  418. .quote {color:{color:Post Accent 1}; padding:3px;}
  419.  
  420. .quote::first-letter {
  421. float:left;
  422. padding:0 6px;
  423. vertical-align:top;
  424. font-weight:bold;
  425. font-size:22px;
  426. }
  427.  
  428. .source {
  429. padding:8px;
  430. font-size:.9em;
  431. font-weight:bold;
  432. color:{color:Post Accent 2};
  433. }
  434.  
  435. /* chat */
  436.  
  437. .chat {margin-bottom:5px;}
  438.  
  439. .label {color:{color:Post Accent 1}; font-size:1.1em;}
  440.  
  441. .lin {margin-top:3px; padding:5px;}
  442.  
  443. /* audio player */
  444.  
  445. .audio_player_container {margin:1px; padding:7px;}
  446.  
  447. .album_art {
  448. position:absolute;
  449. width:50px;
  450. height:50px;
  451. z-index:1;
  452. background-color:{color:Post Background};
  453. }
  454.  
  455. .album_art img {max-width:100%;}
  456. .album_art, .album_art img {border-radius:{select:Audio Image Shape}px;}
  457.  
  458. .audio_player_bg_container {
  459. position:absolute;
  460. width:48px;
  461. height:48px;
  462. margin-top:1px;
  463. margin-left:1px;
  464. z-index:9;
  465. overflow:hidden;
  466. opacity:0;
  467. background-color:white;
  468. border-radius:calc({select:Audio Image Shape}px - 1px);
  469. }
  470.  
  471. .audio_player_container:hover .audio_player_bg_container {opacity:1;}
  472.  
  473. .audio_player_bg {
  474. margin-top:14px;
  475. margin-left:-4px;
  476. }
  477.  
  478. .track_details_container {
  479. display:table;
  480. margin-left:60px;
  481. padding:0 5px;
  482. height:48px;
  483. font-weight:bold;
  484. }
  485.  
  486. .track_details {display:table-cell; vertical-align:middle;}
  487.  
  488. .track_name {
  489. text-transform:lowercase;
  490. font-size:14px;
  491. color:{color:Post Accent 1};
  492. }
  493.  
  494. .artist_name {
  495. text-transform:uppercase;
  496. letter-spacing:1px;
  497. font-size:7px;
  498. color:{color:Track Info};
  499. }
  500.  
  501. .tumblr_audio_player {
  502. height:130px;
  503. width:1000px;
  504. -moz-transform:scale(0.70, 0.70);
  505. -webkit-transform:scale(0.70, 0.70);
  506. -o-transform:scale(0.70, 0.70);
  507. -ms-transform:scale(0.70, 0.70);
  508. transform:scale(0.70, 0.70);
  509. -moz-transform-origin:top left;
  510. -webkit-transform-origin:top left;
  511. -o-transform-origin:top left;
  512. -ms-transform-origin:top left;
  513. transform-origin:top left;
  514. }
  515.  
  516. /* post notes */
  517.  
  518. #n {
  519. background-color:{color:Post Background};
  520. padding:10px;
  521. margin-top:-50px;
  522. margin-bottom:50px;
  523. -webkit-box-shadow:0px 2px 9px 0px rgba(227,227,227,.7);
  524. -moz-box-shadow:0px 2px 9px 0px rgba(227,227,227,.7);
  525. box-shadow:0px 2px 9px 0px rgba(227,227,227,.7);
  526. }
  527.  
  528. #nn {position:relative; height:140px; overflow:hidden;}
  529.  
  530. #fade-out {
  531. position: relative;
  532. bottom: 120px;
  533. height: 120px;
  534. margin-bottom: -120px;
  535. background:-webkit-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
  536. background:linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
  537. }
  538.  
  539. #btn {float:right; margin:8px; color:{color:Text Post Title};}
  540.  
  541. .notes {overflow-wrap:break-word; word-wrap:break-word;}
  542.  
  543. .nott {
  544. display:inline-block;
  545. margin:5px;
  546. font-size:1.5em;
  547. font-weight:bold;
  548. color:{color:Text Post Title};
  549. }
  550.  
  551. ol.notes {padding:2px 25px; list-style-type:none;}
  552.  
  553. li.note {padding:6px 0;}
  554.  
  555. ol.notes img.avatar {vertical-align:middle; border-radius:3px;}
  556.  
  557. span.action {padding-left:7px;}
  558.  
  559. #nn .retags, #nn .retags.error {
  560. margin:2px 0 5px 0;
  561. font-weight:bold;
  562. font-size:.7em;
  563. text-transform:uppercase;
  564. letter-spacing:2px;
  565. }
  566.  
  567. #nn .retags a:hover, #nn .retags.error {color:{color:Link Hover}!important;}
  568.  
  569. ol.notes li.note .answer_content {font-style:italic; color:{color:Italic};}
  570.  
  571. ol.notes li.note blockquote {
  572. border-color:{color:Blockquote Border};
  573. padding:0px 10px;
  574. margin:7px 0px 0px 15px;
  575. }
  576.  
  577. ol.notes li.note blockquote a {text-decoration:none;}
  578.  
  579. li.more_notes_link_container {
  580. margin:10px 0;
  581. list-style-type:none;
  582. text-align:left;
  583. font-size:1.4em;
  584. border-bottom:1px dotted {color:tags};
  585. }
  586.  
  587. /* post info */
  588.  
  589. .post_info_container {
  590. margin:10px;
  591. {block:Permalink}padding-top:10px;{/block:Permalink}
  592. padding-bottom:6px;
  593.  
  594. font-weight:bold;
  595. font-size:9px;
  596. letter-spacing:1px;
  597. border-bottom:1px dotted {color:Post Border};
  598. }
  599.  
  600. .date {
  601. display:inline-block;
  602. {block:Permalink}width:calc({text:Permalink Post Size}px - 65px){/block:Permalink}
  603. {block:IndexPage}width:calc({text:Post Size}px - 65px); white-space:nowrap; overflow:hidden;{/block:IndexPage}
  604. }
  605.  
  606. .date a {color:{color:Post Info};}
  607. .date a:hover {color:{color:Post Info Hover};}
  608.  
  609. .tags {margin-top:7px; color:{color:Tags};{block:Permalink}padding-bottom:5px;{/block:Permalink}}
  610. .tags a {color:{color:Tags};}
  611.  
  612. .tags a:after {content:", ";}
  613. .tags a:last-child:after {content:"";}
  614.  
  615. .tags a:hover {color:{color:Tags Hover};}
  616.  
  617. .like_reblog {width:25px; float:right;}
  618.  
  619. .control {
  620. display:inline-block;
  621. position:relative;
  622. font-size:10px;
  623. color:{color:Like Reblog Buttons};
  624. }
  625.  
  626. .control a {color:{color:Like Reblog Buttons};}
  627.  
  628. .control .like_button:hover,
  629. .control .reblog_button:hover {color:{color:Like Reblog Buttons Hover};}
  630.  
  631. .control .like_button::before,
  632. .control .reblog_button::before {display:block; line-height:1;}
  633.  
  634. .like_button.liked {color:{color:Like Button Liked};}
  635.  
  636. .like_button.liked:hover {color:{color:Like Button Liked};}
  637.  
  638. .like_button iframe {
  639. display:block;
  640. position:absolute;
  641. top:0;
  642. right:0;
  643. bottom:0;
  644. left:0;
  645. margin:0;
  646. opacity:0;
  647. }
  648.  
  649. /* sidebar */
  650.  
  651. aside {
  652. width:280px;
  653. height:100%;
  654. position:fixed;
  655. display:table;
  656. top:0;
  657. left:0;
  658. text-align:center;
  659. background:{color:Sidebar Background};
  660. border-right:1px solid {color:Post Border};
  661. }
  662.  
  663. #sidebar {
  664. display:table-cell;
  665. vertical-align:middle;
  666. padding:20px;
  667. }
  668.  
  669. /* icon */
  670.  
  671. #sbimg {
  672. margin:auto;
  673. width:60px;
  674. height:60px;
  675. border-radius:{select:Sidebar Icon Shape}px;
  676. border:2px solid {color:Post Background};
  677. overflow:hidden;
  678. }
  679.  
  680. #sbimg img {
  681. max-width:100%;
  682. border-radius:{select:Sidebar Icon Shape}px;
  683. -webkit-transition:opacity 1s, -webkit-transform 1s;
  684. transition:opacity 1s, transform 1s
  685. }
  686.  
  687. #sbimg:hover img {
  688. opacity:.8;
  689. -webkit-transform:scale3d(1.2,1.2,1);
  690. transform:scale3d(1.2,1.2,1);
  691. }
  692.  
  693. /* title */
  694.  
  695. #sbtitle {padding-top:10px; {block:ifSubtitle}padding-bottom:10px;{/block:ifSubtitle}}
  696.  
  697. .hoveff {position:relative; line-height:1;}
  698.  
  699. .title {
  700. {block:ifSubtitleAnimation}padding:0 10px 20px;{/block:ifSubtitleAnimation}
  701. font-size:17px;
  702. -webkit-transition:color 0.5s;
  703. transition:color 0.5s;
  704. }
  705.  
  706. a.title {color:{color:Title};}
  707.  
  708. .title:hover {color:{color:Title Hover};}
  709.  
  710. {block:ifSubtitleAnimation}
  711. .title::before, .link::before {
  712. content:'';
  713. position:absolute;
  714. height:24px;
  715. top:50%;
  716. z-index:-1;
  717. -webkit-transition:-webkit-transform 0.5s;
  718. transition:transform 0.5s;
  719. }
  720.  
  721. .title::before {
  722. width:45%;
  723. margin-top:-22px;
  724. left:28%;
  725. -webkit-transform:rotate3d(0,0,1,45deg) scale3d(1,1,1);
  726. transform:rotate3d(0,0,1,45deg) scale3d(1,1,1);
  727. }
  728.  
  729. .link::before {
  730. width:10px;
  731. margin-top:-12px;
  732. left:35%;
  733. -webkit-transform:rotate3d(0,0,1,45deg) scale3d(0,1,1);
  734. transform:rotate3d(0,0,1,45deg) scale3d(0,1,1);
  735. }
  736.  
  737. #sidebar:hover .title::before, .link:hover::before {
  738. -webkit-transform:rotate3d(0,0,1,45deg) scale3d(1,1,1);
  739. transform:rotate3d(0,0,1,45deg) scale3d(1,1,1);
  740. }
  741.  
  742. .title h4 {
  743. position:absolute;
  744. right:10px;
  745. bottom:3px;
  746. font-weight:400;
  747. opacity:1;
  748. -webkit-transform:translate3d(0,0,0);
  749. transform:translate3d(0,0,0);
  750. -webkit-transition:-webkit-transform 0.5s, opacity 0.5s;
  751. transition:transform 0.5s, opacity 0.5s;
  752. }
  753.  
  754. #sidebar:hover h4 {
  755. opacity:1;
  756. -webkit-transform:translate3d(0,0,0);
  757. transform:translate3d(0,0,0);
  758. }
  759. {/block:ifSubtitleAnimation}
  760.  
  761. .title h4 {font-size:13px; color:{color:Subtitle};}
  762.  
  763. #desc {padding:10px 0;}
  764.  
  765. /* navigation */
  766.  
  767. #nav {padding-top:15px;}
  768.  
  769. .icon1 {padding-top:5px; }
  770. .icon1:hover .icon3 span {color:{color:Nav Icons Hover};}
  771.  
  772. .icon2 {
  773. display:inline-block;
  774. padding-right:5px;
  775. width:45%;
  776. vertical-align:middle;
  777. text-align:right;
  778. }
  779.  
  780. .icon3 {display:inline-block; width:30px; text-align:center;}
  781.  
  782. .icon {font-size:20px; color:{color:Nav Icons};}
  783.  
  784. .linkcon {
  785. display:inline-block;
  786. margin-left:5px;
  787. width:45%;
  788. text-align:left;
  789. }
  790.  
  791. a.link {color:{color:Nav Links};}
  792. a.link:hover {color:{color:Nav Links Hover};}
  793.  
  794. /* search box */
  795.  
  796. #search {
  797. width:35%;
  798. position:absolute;
  799. {select:Search Bar}:22px;
  800. margin:0 auto;
  801. left:0;
  802. right:0;
  803. padding:2px 0 2px 6px;
  804. text-align:left;
  805. border:1px solid {color:Search Box Border};
  806. border-radius:10px;
  807. background:{color:Search Box Background};
  808. }
  809.  
  810. #sfm input {
  811. width:90%;
  812. border:none;
  813. outline:none;
  814. font-family:inherit;
  815. font-size:9px;
  816. background:{color:Search Box Background};
  817. }
  818.  
  819. ::-webkit-input-placeholder {color:{color:Search Box Placeholder};}
  820. :-moz-placeholder {color:{color:Search Box Placeholder}; opacity:1;}
  821. ::-moz-placeholder {color:{color:Search Box Placeholder}; opacity:1;}
  822. :-ms-input-placeholder {color:{color:Search Box Placeholder};}
  823.  
  824. /* pagination */
  825.  
  826. #pagination {
  827. position:absolute;
  828. bottom:57px;
  829. width:40%;
  830. margin:0 auto;
  831. left:0;
  832. right:0;
  833. text-align:center;
  834. }
  835.  
  836. #prev, #next, #top {display:inline-block;}
  837. #prev a, #next a, #top a {
  838. width:5px;
  839. height:5px;
  840. padding:3px 5px;
  841. }
  842.  
  843. .fa {font-size:9px; color:{color:Back to Top Icon};}
  844. .fa:hover {color:{color:Back to Top Icon Hover};}
  845. .icon-chevron-right, .icon-chevron-left {vertical-align:middle;}
  846. .icon-chevron-down {color:black;}
  847.  
  848. .fa:hover, a, a:hover, .control .like_button, .control .like_button:hover, .control .reblog_button:hover, .audio_player_bg_container, .audio_player_container:hover .audio_player_bg_container {transition-duration:.5s;}
  849. .posts, .posts:hover, .tmblr-iframe, .tmblr-iframe:hover, .icon, .icon:hover, #n, #n:hover {transition:.3s;}
  850.  
  851. #fel {
  852. position:fixed;
  853. right:10px;
  854. bottom:10px;
  855. width:30px;
  856. z-index:999999999999999999999999999999999999999999;
  857. }
  858.  
  859. </style>
  860.  
  861. </head>
  862.  
  863. <body>
  864.  
  865. {block:ifFadeInOnRefresh}<script>document.body.className += ' fade-out';</script>{/block:ifFadeInOnRefresh}
  866.  
  867. <!-- sidebar -->
  868.  
  869. <aside>
  870. <div id="sidebar">
  871. <div id="sbimg"><a href="/"><img src="{image:Sidebar Img}"></a></div>
  872. <div id="sbtitle"><h3><a class="hoveff title" href="/">{Title}{block:ifSubtitle}<h4>{text:Subtitle}</h4>{/block:ifSubtitle}</a></h3></div>
  873. <div id="desc">{Description}</div>
  874. <div id="nav">
  875.  
  876. <!--
  877. Use this list to add/change icons: elegantthemes.com/blog/resources/how-to-use-and-embed-an-icon-font-on-your-website
  878. -->
  879.  
  880.  
  881. <div class="icon1"><div class="icon2"><div class="icon3">
  882. <span class="icon-{text:Link 1 Icon} icon"></span>
  883. </div></div><div class="linkcon"><a class="hoveff link" href="{text:Link 1 URL}">{text:Link 1 Text}</a></div>
  884. </div>
  885.  
  886.  
  887. <div class="icon1"><div class="icon2"><div class="icon3">
  888. <span class="icon-{text:Link 2 Icon} icon"></span>
  889. </div></div><div class="linkcon"><a class="hoveff link" href="{text:Link 2 URL}">{text:Link 2 Text}</a></div>
  890. </div>
  891.  
  892.  
  893. <div class="icon1"><div class="icon2"><div class="icon3">
  894. <span class="icon-{text:Link 3 Icon} icon"></span>
  895. </div></div><div class="linkcon"><a class="hoveff link" href="{text:Link 3 URL}">{text:Link 3 Text}</a></div>
  896. </div>
  897.  
  898.  
  899. <div class="icon1"><div class="icon2"><div class="icon3">
  900. <span class="icon-{text:Link 4 Icon} icon"></span>
  901. </div></div><div class="linkcon"><a class="hoveff link" href="{text:Link 4 URL}">{text:Link 4 Text}</a></div>
  902. </div>
  903.  
  904.  
  905. <div class="icon1"><div class="icon2"><div class="icon3">
  906. <span class="icon-{text:Link 5 Icon} icon"></span>
  907. </div></div><div class="linkcon"><a class="hoveff link" href="{text:Link 5 URL}">{text:Link 5 Text}</a></div>
  908. </div>
  909.  
  910. <div class="icon1"><div class="icon2"><div class="icon3">
  911. <span class="icon-{text:Link 6 Icon} icon"></span>
  912. </div></div><div class="linkcon"><a class="hoveff link" href="{text:Link 6 URL}">{text:Link 6 Text}</a></div>
  913. </div>
  914.  
  915.  
  916. <div id="search"><script language="javascript">function send(){document.searchf.submit()}</script><form action="/search" method="get" id="sfm" name="searchf icon"><input type="text" placeholder="enter keyword..." name="q" value=""/></form></div>
  917.  
  918. </div>
  919.  
  920. {block:IfNotInfiniteScroll}
  921. <div id="pagination">
  922. {block:Pagination}
  923. <div id="prev">{block:PreviousPage}<a href="{PreviousPage}" title="previous"><span class="icon-chevron-left fa"></span></a>{/block:PreviousPage}</div>
  924. <div id="top"><a href="#" id="toTop" title="top"><span class="icon-chevron-up fa"></span></a></div>
  925. <div id="next">{block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage" title="next"><span class="icon-chevron-right fa"></span></a>{/block:NextPage}</div>
  926. {/block:Pagination}
  927. </div>
  928. {/block:IfNotInfiniteScroll}
  929.  
  930. {block:ifInfiniteScroll}
  931. <div class="navigation" id="navigation">
  932. {block:Pagination}
  933. {block:PreviousPage}<a href="{PreviousPage}" class="navigate">{/block:PreviousPage}{block:PreviousPage}</a>{/block:PreviousPage}
  934. {block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage">{/block:NextPage}{block:NextPage}</a>{/block:NextPage}
  935. {/block:Pagination}
  936. </div>
  937. <div id="pagination"><div id="top"><a href="#" id="toTop"><span class="icon-chevron-up fa"></span></a></div></div>
  938. {/block:ifInfiniteScroll}
  939.  
  940. </div>
  941. </aside>
  942.  
  943. <!-- posts -->
  944.  
  945.  
  946.  
  947. <div id="posts_container">
  948.  
  949. {block:Posts}
  950. <div class="posts" id="{PostID}">
  951. {block:ifTopTags}{block:Date}
  952. <div class="post_info_container">
  953. <div class="date">
  954. <a href="{Permalink}" title="{TimeAgo}">{ShortMonth} {DayOfMonth},{Year}</a>
  955.  
  956.  
  957. {block:RebloggedFrom}
  958. / By <a href="{ReblogRootURL}" title="{ReblogRootTitle}">{ReblogRootName}</a>
  959. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}<!--<a href="{ReblogParentURL}">{ReblogParentName}</a>}-->
  960. {/block:RebloggedFrom}
  961. {block:NoteCount}/ {NoteCount}{/block:NoteCount}
  962. </div>
  963.  
  964. <div class="like_reblog">
  965. {block:IndexPage}<div class="control reblog-control">{ReblogButton size="10" color="black"}</div>{/block:IndexPage}
  966. <div class="control like-control">{LikeButton size="10" color="black"}</div></div>
  967.  
  968. <div class="tags">{block:HasTags}<span class="icon-pricetags"></span>&nbsp;{block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}</div>
  969.  
  970. </div>
  971. {/block:Date}{/block:ifTopTags}
  972.  
  973.  
  974. {block:Text}
  975. <div class="vertebrae">
  976. {block:Title}
  977. <div class="text_post_title"><a href="{Permalink}">{Title}</a></div>
  978. {/block:Title}
  979. <div class="caption" style="padding:0 5px;">{Body}</div>
  980. </div>
  981. {/block:Text}
  982.  
  983.  
  984. {block:Link}
  985. <div class="vertebrae">
  986. <div class="text_post_title"><a href="{URL}">{Name}</a></div>
  987. <div class="caption">{block:Description}{Description}{/block:Description}</div>
  988. </div>
  989. {/block:Link}
  990.  
  991.  
  992. {block:Quote}
  993. <div class="vertebrae">
  994. <div class="quote">{Quote}</div>
  995. {block:Source}<div class="source">{Source}</div>{/block:Source}
  996. </div>
  997. {/block:Quote}
  998.  
  999.  
  1000. {block:Chat}
  1001. <div class="vertebrae">
  1002. {block:Title}<div class="text_post_title">{Title}</div>{/block:Title}
  1003. <ul class="chat">
  1004. {block:Lines}
  1005. <li class="line">
  1006. {block:Label}<span class="label">{Label}</span>{/block:Label}
  1007. <div class="lin">{Line}</div>
  1008. </li>
  1009. {/block:Lines}
  1010. </ul>
  1011. </div>
  1012. {/block:Chat}
  1013.  
  1014.  
  1015. {block:Answer}
  1016. <div class="vertebrae">
  1017. <div class="quest1">
  1018. <div class="let">Q</div>
  1019. <div class="question">{Question}</div>
  1020. <div class="asker">— {Asker}</div>
  1021. </div>
  1022. <div class="quest2">
  1023. <div class="let">A</div>
  1024. <div class="answer">{Answer}</div>
  1025. </div>
  1026. <div class="caption">{block:Caption}{Caption}{/block:Caption}</div>
  1027. </div>
  1028. {/block:Answer}
  1029.  
  1030.  
  1031. {block:AudioPlayer}
  1032. <div class="vertebrae">
  1033. {block:ifTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifTopCaption}
  1034. <div class="audio_player_container">
  1035. <div class="album_art">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1036. <div class="audio_player_bg_container"><div class="audio_player_bg">{AudioPlayer}</div></div>
  1037. <div class="track_details_container">
  1038. <div class="track_details">
  1039. {block:TrackName}<span class="track_name">{TrackName}</span>{/block:TrackName}<br />
  1040. {block:Artist}<span class="artist_name">{Artist}</span>{/block:Artist}<br />
  1041. </div>
  1042. </div>
  1043. </div>
  1044. {block:ifnotTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnotTopCaption}
  1045. </div>
  1046. {/block:AudioPlayer}
  1047.  
  1048.  
  1049. {block:Photo}
  1050. <div class="vertebrae">
  1051. <div class="pancake">
  1052. {block:ifTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifTopCaption}
  1053. {LinkOpenTag}<a href="#" class="dont" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>{LinkCloseTag}
  1054. {block:ifnotTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnotTopCaption}
  1055. </div>
  1056. </div>
  1057. {/block:Photo}
  1058.  
  1059.  
  1060. {block:Photoset}
  1061. <div class="vertebrae">
  1062. {block:ifTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifTopCaption}
  1063. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1064. {block:Photos}
  1065. <div class="photo-data">
  1066. <div class="pxu-photo">
  1067. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  1068. </div>
  1069. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1070. </div>
  1071. {/block:Photos}
  1072. </div>
  1073. {block:ifnotTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnotTopCaption}
  1074. </div>
  1075. {/block:Photoset}
  1076.  
  1077.  
  1078. {block:Video}
  1079. <div class="vertebrae">
  1080. {block:ifTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifTopCaption}
  1081. <div class="video">{Video-500}</div>
  1082. {block:ifnotTopCaption}<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>{/block:ifnotTopCaption}
  1083. </div>
  1084. {/block:Video}
  1085.  
  1086. {block:ifnotTopTags}{block:Date}
  1087. <div class="post_info_container">
  1088. <div class="date">
  1089. <a href="{Permalink}" title="{TimeAgo}">{ShortMonth} {DayOfMonth},{Year}</a>
  1090.  
  1091. {block:RebloggedFrom}
  1092. / By <a href="{ReblogRootURL}" title="{ReblogRootTitle}">{ReblogRootName}</a>
  1093. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}<!--<a href="{ReblogParentURL}">{ReblogParentName}</a>}-->
  1094. {/block:RebloggedFrom}
  1095. {block:NoteCount}/ {NoteCount}{/block:NoteCount}
  1096. </div>
  1097.  
  1098. <div class="like_reblog">
  1099. {block:IndexPage}<div class="control reblog-control">{ReblogButton size="10" color="black"}</div>{/block:IndexPage}
  1100. <div class="control like-control">{LikeButton size="10" color="black"}</div></div>
  1101.  
  1102. <div class="tags">{block:HasTags}<span class="icon-pricetags"></span>&nbsp;{block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}</div>
  1103.  
  1104. </div>
  1105. {/block:Date}{/block:ifnotTopTags}
  1106.  
  1107. </div>
  1108.  
  1109. <!-- end posts -->
  1110.  
  1111. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}
  1112.  
  1113. {block:Permalink}{block:Date}
  1114. <div id="n">
  1115. <div class="nott">Notes</div>
  1116. <div id="btn"><a id="reveal"><span class="icon-chevron-down fa"></span></a></div>
  1117. <div id="nn">{PostNotes}</div>
  1118. <div id="fade-out"></div>
  1119. </div>
  1120. {/block:Date}{/block:Permalink}
  1121.  
  1122. {/block:Posts}
  1123. </div>
  1124. <!-- end posts container -->
  1125.  
  1126. <!-- scripts -->
  1127. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script><script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script><script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>{block:IndexPage}{block:ifInfiniteScroll}<script src="http://static.tumblr.com/0cdn90j/vsOo9wcfa/infinitescroll.js"></script>{/block:ifInfiniteScroll}<script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/3.1.8/imagesloaded.pkgd.min.js"></script>{/block:IndexPage}<div id="fel"><a href="http://felinum.tumblr.com" title="theme by felinum"><img src="http://static.tumblr.com/0cdn90j/0Xook74au/feli.svg"/></a></div><script src="http://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/fgfmpgh/Qqfkzalyi/jquery.scroll.pack.js"></script><script type="text/javascript" src="http://static.tumblr.com/fgfmpgh/7xukzalz8/jquery.easing.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.4/SmoothScroll.js"></script>
  1128.  
  1129. <script>
  1130. $(document).ready(function(){
  1131. $('.photo-slideshow').pxuPhotoset({
  1132. lightbox:true,
  1133. rounded:false,
  1134. gutter:'{select:Photoset Gutter}px',
  1135. photoset:'.photo-slideshow',
  1136. photoWrap:'.photo-data',
  1137. photo:'.pxu-photo'
  1138. });
  1139. $('.posts').unnest({
  1140. yourCaption:'.caption',
  1141. newCaptionUsername:false,
  1142. originalPostCaptionUsername:false,
  1143. tumblrAvatars:true,
  1144. tumblrAvatarClass:'.tumblr_avatar',
  1145. usernameColon:false
  1146. });
  1147. {block:IndexPage}
  1148. var $container = $('#posts_container');
  1149. $container.imagesLoaded(function() {
  1150. $container.masonry({
  1151. itemSelector:'.posts',
  1152. });
  1153. });
  1154. {block:ifInfiniteScroll}
  1155. $container.infinitescroll({
  1156. navSelector:'#navigation',
  1157. nextSelector:'#navigation a#nextPage',
  1158. itemSelector:'.posts',
  1159. loadingImg:'',
  1160. loadingText:'<em></em>',
  1161. bufferPx:2000
  1162. },
  1163. function(newElements){
  1164. var $newElems = $(newElements).css({opacity:0});
  1165. resizeVideos();
  1166. var $newElemsIDs = $newElems.map(function(){
  1167. return this.id;
  1168. }).get();
  1169. $newElems.find('.photo-slideshow').pxuPhotoset({
  1170. lightbox:true,
  1171. rounded:false,
  1172. gutter:'{select:Photoset Gutter}px',
  1173. photoset:'.photo-slideshow',
  1174. photoWrap:'.photo-data',
  1175. photo:'.pxu-photo'
  1176. });
  1177. $newElems.unnest({
  1178. yourCaption:'.caption',
  1179. newCaptionUsername:false,
  1180. originalPostCaptionUsername:false,
  1181. tumblrAvatars:true,
  1182. tumblrAvatarClass:'.tumblr_avatar',
  1183. usernameColon:false
  1184. });
  1185. $newElems.imagesLoaded(function(){
  1186. $newElems.animate({opacity:1});
  1187. $container.masonry('appended', $newElems, true);
  1188. console.log($newElems, $newElemsIDs);
  1189. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1190. });
  1191. }
  1192. );
  1193. {/block:ifInfiniteScroll}
  1194. {/block:IndexPage}
  1195. });
  1196. </script>
  1197. <script>
  1198. $(function() {
  1199. $('body').removeClass('fade-out');
  1200. $('#toTop').scrollToTop({speed:1000,start:700});
  1201. $('#btn').click(function(){
  1202. $('#nn').animate({height: $('#nn').get(0).scrollHeight}, 100, function(){$(this).height('auto');});
  1203. $('#fade-out').fadeOut();
  1204. $('#btn').fadeOut();
  1205. });
  1206. });
  1207. </script>
  1208. <script src="http://static.tumblr.com/0cdn90j/glvnidntk/jquery.style-my-tooltips.js"></script>
  1209. <script>
  1210. (function($){
  1211. $(document).ready(function(){
  1212. $("[title]").style_my_tooltips({
  1213. tip_follows_cursor:true,
  1214. tip_delay_time:0,
  1215. tip_fade_speed:0,
  1216. attribute:"title"
  1217. });
  1218. });
  1219. })(jQuery);
  1220. </script>
  1221.  
  1222. </body>
  1223.  
  1224. </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!