API tools faq
paste
Advertisement
hermionemessi

Theme 05 v1

hermionemessi
Jul 10th, 2015
3,197
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.96 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en" class="no-js">
  3. <!--THEME 05 v1 (Revamp) Square Pegs by hermionegrangcr
  4.  
  5. THEME BLOG: grangersdesigns
  6.  
  7.  
  8. ♛ ♛ ♛
  9. ♛♛♛ ♛♛♛ ♛♛♛
  10. ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛
  11. ♛♛♛ ♥ G♚D ♥ ♛♛♛
  12. ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛
  13. ♛ ♛ ♛ ♛ ♛ ♛ ♛ © hermionegrangcr
  14.  
  15.  
  16. Important:
  17.  
  18. ♚ Basic rules apply (see https://hermionegrangcr.tumblr.com/rules)
  19.  
  20. ♚ This theme is optimised for Google Chrome and laptops of 13~15 in.
  21.  
  22. ♚ Tweak this to your preference as long as the credits remain intact.
  23.  
  24. ♚ If you encounter any issues or have any suggestions, please message me at https://grangersdesigns.tumblr.com/faq
  25.  
  26. -->
  27. <head>
  28. <title>{Title}</title>
  29.  
  30. <meta charset="UTF-8" />
  31. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  32. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  33. <link rel="shortcut icon" href="{Favicon}">
  34.  
  35. {block:Description}
  36. <meta name="description" content="{MetaDescription}"/>
  37. {/block:Description}
  38.  
  39. <meta name="image:sidebar" content="https://i.imgur.com/L7GvW2s.png">
  40. <meta name="image:profile" content="https://i.imgur.com/5MCXyvf.png">
  41. <meta name="color:highlight" content="#C4D0F5">
  42. <meta name="color:grad1" content="#fafafa">
  43. <meta name="color:grad2" content="#cdcdcd">
  44. <meta name="color:bg" content="#000">
  45. <meta name="color:overlay" content="#fafafa">
  46.  
  47. <meta name="if:unnested captions" content="">
  48. <meta name="if:infinite scroll" content="">
  49. <meta name="if:manual load" content="">
  50. <meta name="if:hover tags"content="">
  51. <meta name="if:show blogroll"content="">
  52.  
  53. <meta name="select:background"content="white_bg" title="white">
  54. <meta name="select:background"content="simple_bg" title="simple">
  55. <meta name="select:background"content="grad_bg" title="gradient">
  56.  
  57. <meta name="select:body font" content="Open Sans">
  58. <meta name="select:body font" content="Karla">
  59. <meta name="select:body font" content="Roboto">
  60. <meta name="select:body font" content="Source Sans Pro">
  61. <meta name="select:body font" content="Lato">
  62.  
  63. <meta name="select:font size" content="12px" title="12px">
  64. <meta name="select:font size" content="11px" title="11px">
  65. <meta name="select:font size" content="10px" title="10px">
  66. <meta name="select:font size" content="9px" title="9px">
  67.  
  68. <meta name="select:post width"content="post500"title="500px"/>
  69. <meta name="select:post width"content="post540"title="540px"/>
  70. <meta name="select:post width"content="post450"title="450px"/>
  71. <meta name="select:post width"content="post400"title="400px"/>
  72. <meta name="select:post width"content="post350"title="350px"/>
  73. <meta name="select:post width"content="post300"title="300px"/>
  74.  
  75. <meta name="select:sidebar width"content="sb120"title="120px"/>
  76. <meta name="select:sidebar width"content="sb80" title="80px"/>
  77. <meta name="select:sidebar width"content="sb100"title="100px"/>
  78. <meta name="select:sidebar width"content="sb150"title="150px"/>
  79.  
  80. <meta name="select:post spacing" content="100px">
  81. <meta name="select:post spacing" content="80px">
  82. <meta name="select:post spacing" content="70px">
  83. <meta name="select:post spacing" content="60px">
  84. <meta name="select:post spacing" content="50px">
  85. <meta name="select:post spacing" content="90px">
  86. <meta name="select:post spacing" content="110px">
  87. <meta name="select:post spacing" content="120px">
  88.  
  89.  
  90. <meta name="select:photoset gutter"content="5px"title="5px">
  91. <meta name="select:photoset gutter"content="10px"title="10px">
  92. <meta name="select:photoset gutter"content="2px"title="2px">
  93. <meta name="select:photoset gutter"content="1px"title="1px">
  94. <meta name="select:photoset gutter"content="0px"title="0px">
  95.  
  96. <meta name="select:notes display" content="def_notes" title="default">
  97. <meta name="select:notes display" content="grid_notes" title="grid">
  98.  
  99. <meta name="text:Link1" content="Link1">
  100. <meta name="text:link1 URL" content="/">
  101. <meta name="text:Link2" content="Link2">
  102. <meta name="text:link2 URL" content="/">
  103. <meta name="text:Link3" content="Link3">
  104. <meta name="text:link3 URL" content="/">
  105. <meta name="text:Link4" content="Link4">
  106. <meta name="text:link4 URL" content="/">
  107. <meta name="text:Link5" content="Link5">
  108. <meta name="text:link5 URL" content="/">
  109. <meta name="text:Link6" content="Link6">
  110. <meta name="text:link6 URL" content="/">
  111. <meta name="text:Link7" content="Link7">
  112. <meta name="text:link7 URL" content="/">
  113. <meta name="text:Link8" content="Link8">
  114. <meta name="text:link8 URL" content="/">
  115. <meta name="text:Link9" content="Link9">
  116. <meta name="text:link9 URL" content="/">
  117.  
  118. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  119.  
  120. <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
  121. <link href='https://fonts.googleapis.com/css?family=Karla:400,700' rel='stylesheet' type='text/css'>
  122. <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,700" rel="stylesheet">
  123. <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet">
  124. <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700" rel="stylesheet">
  125.  
  126. <link href="https://fonts.googleapis.com/css?family=Lora:400,400i" rel="stylesheet">
  127.  
  128. <link href='https://static.tumblr.com/xbvpdcx/iSdosrzqp/th5v1stylings.css' rel='stylesheet' type='text/css'>
  129.  
  130. <!--MAIN STYLINGS; DO NOT REMOVE-->
  131. <link href='https://static.tumblr.com/xbvpdcx/CjJossfaz/th5v1main.css' rel='stylesheet' type='text/css'>
  132. <!-- / MAIN STYLINGS; DO NOT REMOVE-->
  133.  
  134.  
  135. <style type="text/css">
  136. /*Tumblr Controls*/
  137. .iframe-controls--desktop{
  138. padding-right:10px !important;
  139. right:-35px !important;
  140. top:-5px !important;
  141. opacity:0;
  142. transform: scale(0.7);
  143. -webkit-transform: scale(0.7);
  144. -moz-transform: scale(0.7);
  145. -o-transform: scale(0.7);
  146. -ms-transform: scale(0.7);
  147. -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%);
  148. -webkit-transition: all 0.3s ease-in-out;
  149. transition:all 0.3s ease-in-out;
  150. box-sizing: content-box;
  151. -webkit-box-sizing: content-box;
  152. -moz-box-sizing: content-box;
  153.  
  154. }
  155. .iframe-controls--desktop:hover {
  156. opacity:0.6;
  157. -webkit-transition: all 0.3s ease-in-out;
  158. transition:all 0.3s ease-in-out;
  159. }
  160.  
  161. {block:permalinkpage}
  162. .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  163. width: 500px!important;
  164. }
  165.  
  166. .iframe-controls--desktop {right:-70px!important;}
  167. {/block:permalinkpage}
  168.  
  169. @-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  170. @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  171. @-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  172. @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  173.  
  174. /*hover controls*/
  175. #controlscog {
  176. z-index:50;
  177. font-size:12px;
  178. position:fixed;
  179. top:15px;
  180. right:5px;
  181. background:transparent!important;
  182. }
  183.  
  184. *,
  185. *::before,
  186. *::after {
  187. box-sizing: inherit;
  188. -webkit-box-sizing: inherit;
  189. -moz-box-sizing: inherit;
  190. }
  191.  
  192. html {
  193. box-sizing: border-box;
  194. -webkit-box-sizing: border-box;
  195. -moz-box-sizing: border-box;
  196. }
  197.  
  198. html, body {height:100%;}
  199.  
  200. body {
  201. color:#5f5f5f;
  202. font-family:'{select:body font}';
  203. font-size: {select:font size};
  204. line-height:160%;
  205. overflow-x:hidden;
  206. background-attachment:fixed;
  207. margin:0;
  208. -webkit-font-smoothing: antialiased;
  209. -moz-osx-font-smoothing: grayscale;
  210. }
  211.  
  212. body.simple_bg, .simple_bg .container {background:#f5f5f5;}
  213. body.white_bg, .white_bg .container {background:#fff;}
  214.  
  215. body.grad_bg, .grad_bg .container {
  216. background: -webkit-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* Chrome 10+, Saf5.1+ */
  217. background: -moz-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* FF3.6+ */
  218. background: -ms-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* IE10 */
  219. background: -o-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* Opera 11.10+ */
  220. background: linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* W3C */
  221. }
  222.  
  223. .container {min-height: 100%;}
  224.  
  225. ::-webkit-scrollbar {
  226. width:11px;
  227. background:inherit;
  228. }
  229.  
  230. ::-webkit-scrollbar:horizontal {display:none;}
  231.  
  232. ::-webkit-scrollbar-thumb { background-color: {color:highlight}; border:5px solid #f5f5f5; }
  233.  
  234. a {
  235. text-decoration:none;
  236. color:#999;
  237. cursor:help;
  238. -webkit-transition: all 0.3s ease-in-out;
  239. transition:all 0.3s ease-in-out;
  240. }
  241.  
  242. a:hover {
  243. color:{color:highlight};
  244. -webkit-transition: all 0.3s ease-in-out;
  245. transition:all 0.3s ease-in-out;
  246. }
  247.  
  248.  
  249. iframe, img:not(.lightbox-image), embed, object, video, pre, li, blockquote {max-width: 100% !important;}
  250.  
  251. pre {
  252. white-space: pre-wrap;
  253. white-space: -moz-pre-wrap;
  254. white-space: -pre-wrap;
  255. white-space: -o-pre-wrap;
  256. word-wrap: break-word;
  257. background:#f5f5f5;
  258. padding:5px;
  259. }
  260.  
  261. #s-m-t-tooltip{
  262. position:absolute;
  263. margin-top: 10px;
  264. z-index:9999999999;
  265. padding:2px 5px 2px 5px;
  266. max-width:500px;
  267. background: #fff;
  268. font-size:{select:font size};
  269. font-size:90%;
  270. letter-spacing:1.1px;
  271. text-transform:uppercase;
  272. box-shadow: 1px 1px 3px #dfdfdf;
  273. border-left:2px solid {color:highlight};
  274. }
  275.  
  276. /*Customisable Modal Stylings*/
  277. .md-perspective body {background:{color:bg};}
  278. .overlay{background: rgba({RGBcolor:overlay}, 0.8);}
  279. div.abtpop {font-size:{select:font size};}
  280.  
  281.  
  282. /*sidebar*/
  283. #desc {margin-top:{select:font size};}
  284. nav.snav {margin-top:{select:font size};}
  285.  
  286. nav.snav a {
  287. display:block;
  288. margin-bottom:calc({select:font size}/3);
  289. }
  290.  
  291.  
  292.  
  293. /*posts*/
  294.  
  295. main {display:block;}
  296.  
  297. .posts {margin:{select:post spacing} auto;}
  298.  
  299.  
  300. {block:ifinfinitescroll}
  301. .posts {
  302. -webkit-animation:fadeIn ease-in 1s;
  303. -o-animation:fadeIn ease-in 1s;
  304. -moz-animation:fadeIn ease-in 1s;
  305. animation:fadeIn ease-in 1s;
  306. }
  307. {/block:ifinfinitescroll}
  308.  
  309. .unnested .posts img.photop, .unnested .posts .tumblr_video_container {margin-bottom:calc({select:font size} * (2/3));}
  310.  
  311. .posts h1:only-child {margin-bottom:calc({select:font size} * 0.8);}
  312.  
  313. .posts h1 {
  314. margin:calc(({select:font size} * 2)/3) 0 calc(({select:font size} * 4)/3) 0;
  315. font-size:calc({select:font size} * 2);
  316. }
  317.  
  318. .posts li {margin-bottom:calc({select:font size} / 2);}
  319.  
  320. .posts ol ol,.posts ol ul, .posts ul ol,.posts ul ul {
  321. margin:{select:font size} 0 {select:font size} 0;
  322. }
  323.  
  324. .defcap blockquote {
  325. border-left: 1px solid #eaeaea;
  326. margin-left: 0;
  327. margin-right: 0;
  328. padding-left: {select:font size};
  329. }
  330.  
  331. .defcap .captions a:hover, .qsource a:hover, span.action a:hover, .tumblr_parent p a:hover, a.append:hover {border-bottom:1px solid {color:highlight};}
  332.  
  333. .tumblr_parent blockquote {
  334. padding: 0 0 0 10px;
  335. margin: 0 0 0 0;
  336. border-left:1px {color:highlight} solid;
  337. }
  338.  
  339. .tumblr_parent blockquote div {margin:{select:font size} 0 {select:font size} 0;}
  340.  
  341. img.tumblr_avatar {border-radius:10%;margin-right:{select:font size};margin-top:calc({select:font size} / 2);margin-bottom:calc({select:font size} / 2);width:36px;height:36px;}
  342.  
  343. /*quotes*/
  344. h1.qmedium {font-size:calc({select:font size} * 1.5);}
  345.  
  346. h1.qlong {font-size:calc({select:font size} * 1.2);}
  347.  
  348. span.qsource {width:100%;padding:{select:font size};display:block;text-align:center;}
  349.  
  350. .divider {margin-top:{select:font size};text-align:center;}
  351.  
  352. .divider::before {background-color:{color:highlight};}
  353.  
  354. /*links*/
  355. .linkp {margin-bottom:calc({select:font size} * (2/3));}
  356.  
  357. .linkp > span {
  358. font-size:calc({select:font size} * 1.5);
  359. margin-right:calc({select:font size});
  360. }
  361.  
  362. .linkp a {max-width:calc(100% - (({select:font size} * 1.5) + ({select:font size}/2)));}
  363.  
  364. .linkp a:hover:after {
  365. width: 100%;
  366. background: {color:highlight};
  367. }
  368.  
  369.  
  370. /*lightbox*/
  371. #tumblr_lightbox,.tmblr-lightbox {background:#f5f5f5!important;backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(2px); }
  372.  
  373.  
  374. #tumblr_lightbox img,.tmblr-lightbox .vignette {
  375. opacity:0;
  376. -webkit-box-shadow:none!important;
  377. box-shadow:none!important;
  378. }
  379.  
  380. #tumblr_lightbox_center_image {
  381. opacity: 1!important;
  382. background-color: #fff!important;
  383. }
  384.  
  385. #tumblr_lightbox_left_image, #tumblr_lightbox_right_image {opacity:0.5!important;
  386. -webkit-transition: all 0.3s ease-in-out;
  387. transition:all 0.3s ease-in-out;
  388. }
  389.  
  390. #tumblr_lightbox_left_image:hover, #tumblr_lightbox_right_image:hover {
  391. opacity:1!important;
  392. -webkit-transition: all 0.3s ease-in-out;
  393. transition:all 0.3s ease-in-out;
  394. }
  395.  
  396.  
  397. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image, .tmblr-lightbox .lightbox-image {
  398. box-shadow: 0 0 0 transparent !important;
  399. }
  400.  
  401. #tumblr_lightbox img, #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image, .tmblr-lightbox .lightbox-image {
  402. border-radius:0!important;
  403. -moz-border-radius: 0!important;
  404. -webkit-border-radius: 0!important;
  405. -o-border-radius: 0!important;
  406. background:#fff !important;
  407. padding:{select:photoset gutter} !important;
  408. }
  409.  
  410.  
  411.  
  412. /* cr: agustd/gukthemes & sughyun/caulfielld; do not take w/o credit. */
  413. .photo-slideshow .count-1 {
  414. margin-bottom:{select:photoset gutter}!important;
  415. }
  416.  
  417.  
  418. .photo-slideshow .count-2 {
  419. margin-left:{select:photoset gutter}!important;
  420. margin-bottom:{select:photoset gutter}!important;
  421. width:calc(50% - ({select:photoset gutter}/2))!important;
  422. }
  423.  
  424. .photo-slideshow .count-2:first-child {
  425. margin-left:0!important;
  426. }
  427.  
  428. .photo-slideshow .count-3 {
  429. margin-left:{select:photoset gutter}!important;
  430. margin-bottom:{select:photoset gutter}!important;
  431. width:calc((100% - (2 * {select:photoset gutter}))/3)!important;
  432. }
  433.  
  434. .photo-slideshow .count-3:first-child {
  435. margin-left:0!important;
  436. }
  437. .photo-slideshow {
  438. display:block!important;
  439. margin-bottom:calc(-({select:photoset gutter} - 3px));
  440. position:relative;
  441. width:100%;
  442. }
  443.  
  444. .defcap .photo-slideshow.processed {margin-bottom:0!important;}
  445.  
  446. .defcap .row:last-of-type .count-1 {margin-bottom:0!important;}
  447.  
  448. .unnested .photo-slideshow.processed {margin-bottom:calc({select:font size} * (2/3)) !important;}
  449.  
  450. .unnested .photo-slideshow.processed .row:last-of-type .count-1 {margin-bottom:0!important;}
  451.  
  452. /* cr: agustd/gukthemes & sughyun/caulfielld; do not take w/o credit. */
  453.  
  454.  
  455. /*audio*/
  456. .unnested .flitwick {margin-bottom:calc({select:font size} * (2/3));}
  457.  
  458.  
  459. /*asks*/
  460. div.ask_cont {
  461. padding-bottom:{select:font size};
  462. margin-bottom:{select:font size};
  463. }
  464.  
  465. .unnested .ask_cont {margin-bottom:calc({select:font size} * (2/3));}
  466.  
  467.  
  468. /*permalink / info*/
  469. .p_info {margin-top:calc({select:font size} * 1.5);}
  470.  
  471. .p_obj {margin-left:calc(1.5 * {select:font size});font-size:90%;}
  472. .p_obj span {margin-right:calc({select:font size}/3);}
  473.  
  474.  
  475. .tags {
  476. width:100%;
  477. position:absolute;
  478. text-align:center;
  479. top: calc(100% + ({select:font size} * 2));
  480. right:0;
  481. left:0;
  482. {block:ifhovertags}
  483. opacity:0;
  484. -webkit-transition: all 0.3s ease-in-out;
  485. transition:all 0.3s ease-in-out;
  486. {/block:ifhovertags}
  487. }
  488.  
  489. .tags a {margin-right:10px; word-break: break-all;}
  490.  
  491. .post500 .tags {max-width:500px;}
  492. .post540 .tags {max-width:540px;}
  493. .post450 .tags {max-width:450px;}
  494. .post400 .tags {max-width:400px;}
  495. .post350 .tags {max-width:350px;}
  496. .post300 .tags {max-width:300px;}
  497.  
  498. /*pagination*/
  499. .pg {
  500. margin:auto;
  501. text-align:center;
  502. {block:ifinfinitescroll}
  503. display:none;
  504. {/block:ifinfinitescroll}
  505. }
  506.  
  507. /*notes*/
  508. h1.notehead {font-size:140%;margin:calc({select:font size}) 0 calc({select:font size} * 2) 0;}
  509.  
  510. .def_notes h1.notehead {margin-left:calc({select:font size}/3);}
  511.  
  512. .def_notes li.more_notes_link_container a:hover, .grid_notes li.more_notes_link_container a:hover{
  513. color:{color:highlight};
  514. border-bottom:1px solid {color:highlight};
  515. -webkit-transition: all 0.3s ease-in-out;
  516. transition:all 0.3s ease-in-out;
  517. }
  518.  
  519.  
  520. </style>
  521.  
  522. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  523. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  524. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  525.  
  526.  
  527.  
  528. <script>
  529. $(document).ready(function() {
  530.  
  531. $('.photo-slideshow').pxuPhotoset({
  532. lightbox: true,
  533. rounded: false,
  534. gutter: '0px',
  535. borderRadius: '0px',
  536. photoset: '.photo-slideshow',
  537. photoWrap: '.photo-data',
  538. photo: '.pxu-photo'
  539. });
  540.  
  541. });
  542.  
  543. </script>
  544.  
  545. <script src="https://static.tumblr.com/wgg6svp/I8Yobwo15/unnest.min.js"></script>
  546.  
  547. <script>
  548.  
  549. $(function(){ $('.unnested .posts').unnest({
  550. yourCaption: ".captions", //your caption selector, the div wrapping
  551. wrapName: ".tumblr_parent", //the name of the captions’ new wrapper
  552. newCaptionUsername: false, //if the user adds a new caption, following a series of captions, show their username above the caption
  553. originalPostCaptionUsername: false, //for the original captions, or a user-added caption that previously didn’t have any, have their username on it
  554. tumblrAvatars: true, //”dashboard style” caption, have the avatar of the blog next to the username
  555. tumblrAvatarClass: ".tumblr_avatar", //class of the avatar next to the username
  556. usernameColon: false //if turned to false, removes the colon at the end of usernames
  557. }); });
  558.  
  559. </script>
  560.  
  561. {block:indexpage}
  562. {block:ifinfinitescroll}
  563. <script src="https://static.tumblr.com/xbvpdcx/9LRo1g4a7/jquery.infinitescroll.min.js"></script>
  564.  
  565. <script>
  566.  
  567. // Infinite Scroll
  568. $(function() {
  569.  
  570. var $container = $('main');
  571. $container.infinitescroll({
  572.  
  573. loading: {
  574. finishedMsg: "<em>No more posts</em>",
  575. img: null,
  576. msg: null,
  577. msgText: "<em>Loading posts...</em>",
  578. {block:ifmanualload}
  579. finished: function () {$('.append').text('Load More'); },
  580. {/block:ifmanualload}
  581.  
  582. },
  583.  
  584. navSelector : '.pg',
  585. nextSelector : '.pg a.nxtpg',
  586. itemSelector : '.posts',
  587. {block:ifmanualload}
  588. errorCallback: function () {$('.append').fadeOut();},
  589. {/block:ifmanualload}
  590. bufferPx : 600,
  591.  
  592. },
  593.  
  594. function( newElements ) {
  595. $( newElements ).find('.photo-slideshow').pxuPhotoset({
  596. lightbox: true,
  597. rounded: true,
  598. gutter: '0px',
  599. borderRadius: '0px',
  600. photoset: '.photo-slideshow',
  601. photoWrap: '.photo-data',
  602. photo: '.pxu-photo'
  603. });
  604.  
  605. var $newElems = $(newElements);
  606.  
  607.  
  608. {block:ifunnestedcaptions}
  609. $newElems.unnest({
  610.  
  611. yourCaption: ".captions",
  612. wrapName: ".tumblr_parent",
  613. newCaptionUsername: false,
  614. originalPostCaptionUsername: false,
  615. tumblrAvatars: true,
  616. tumblrAvatarClass: ".tumblr_avatar",
  617. usernameColon: false
  618.  
  619. });
  620.  
  621. {/block:ifunnestedcaptions}
  622.  
  623.  
  624.  
  625. });
  626.  
  627. {block:ifmanualload}
  628. $container.infinitescroll('unbind');
  629. $('.append').on('click', function(e) {
  630. e.preventDefault();
  631. $container.infinitescroll('retrieve');
  632. });
  633. {/block:ifmanualload}
  634. });
  635. </script>
  636. {/block:ifinfinitescroll}
  637. {/block:indexpage}
  638.  
  639. </head>
  640. <body class="{select:post width} {block:ifnotunnestedcaptions}defcap{/block:ifnotunnestedcaptions} {block:ifunnestedcaptions}unnested{/block:ifunnestedcaptions} {select:background} {select:notes display} {select:sidebar width}">
  641.  
  642. <div id="controlscog">
  643. <span class="lnr lnr-cog"></span>
  644. </div>
  645.  
  646. <!--ASKBOX-->
  647. <div class="voldemort poppy" id="modal-1">
  648. <div class="contenu">
  649. <h3>{AskLabel}</h3>
  650. <div>
  651. <center>
  652. <iframe frameborder="0" scrolling="no" width="500" height="190" src="https://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:auto;" id="ask_form"></iframe>
  653. </center>
  654. <button class="invisibilitycloak">Close</button>
  655. </div>
  656. </div>
  657. </div>
  658. <!--ASKBOX-->
  659.  
  660.  
  661. <!--INFO-->
  662. <div class="voldemort poppy" id="modal-2">
  663. <div class="contenu">
  664. <h3>Info</h3>
  665. <div class="abtpop">
  666.  
  667. <!--Edit here-->
  668. <div id="abtprofile">
  669. <img src="{image:profile}">
  670.  
  671. </div>
  672.  
  673.  
  674. <div id="abttxt">
  675.  
  676. <!--WRITE YOUR INFO HERE: BASIC HTML TAGS INCLUDED-->
  677. <p>
  678. <b>Bold.</b>
  679.  
  680. <i>Italic.</i>
  681.  
  682. <strike>Strike.</strike>
  683.  
  684. <u>Underline.</u> Line break.<br>
  685.  
  686. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.
  687. </p>
  688.  
  689. <blockquote>This is a blockquote</blockquote>
  690.  
  691. <p>This is a new paragraph</p>
  692.  
  693. <!--TO HERE!-->
  694.  
  695. </div>
  696.  
  697. <!--To here-->
  698.  
  699. <button class="invisibilitycloak">Close</button>
  700. </div>
  701. </div>
  702. </div>
  703. <!--INFO-->
  704.  
  705. <!--NAVI-->
  706. <div class="voldemort poppy" id="modal-3">
  707. <div class="contenu">
  708. <h3>Navigation</h3>
  709. <div class="pointme">
  710.  
  711. <a href="{text:Link1 URL}">{text:Link1}</a>
  712. <a href="{text:Link2 URL}">{text:Link2}</a>
  713. <a href="{text:Link3 URL}">{text:Link3}</a>
  714. <a href="{text:Link4 URL}">{text:Link4}</a>
  715. <a href="{text:Link5 URL}">{text:Link5}</a>
  716. <a href="{text:Link6 URL}">{text:Link6}</a>
  717. <a href="{text:Link7 URL}">{text:Link7}</a>
  718. <a href="{text:Link8 URL}">{text:Link8}</a>
  719. <a href="{text:Link9 URL}">{text:Link9}</a>
  720.  
  721. <button class="invisibilitycloak">Close</button>
  722. </div>
  723. </div>
  724. </div>
  725. <!--NAVI-->
  726.  
  727. {block:ifshowblogroll}
  728. {block:following}
  729. <!--BROLL-->
  730. <div class="voldemort poppy" id="modal-4">
  731. <div class="contenu">
  732. <h3>Following</h3>
  733. <div class="broll">
  734.  
  735. {block:Followed}
  736. <a href="{FollowedURL}" title="{FollowedName}"><img class="followed" src="{FollowedPortraitURL-96}"></a>
  737. {/block:Followed}
  738.  
  739. <button class="invisibilitycloak">Close</button>
  740. </div>
  741. </div>
  742. </div>
  743. <!--BROLL-->
  744. {/block:following}
  745. {/block:ifshowblogroll}
  746.  
  747. <!--MAIN CONTAINER-->
  748. <div class="container">
  749. <section id="everything">
  750.  
  751. <!--SIDEBAR-->
  752. <aside>
  753. <div id="sidebar">
  754. <img class="sprof" src="{image:sidebar}">
  755. {block:Description}
  756. <div id="desc">{Description}</div>
  757. {/block:Description}
  758. <nav class="snav">
  759. <a href="/"><span class="lnr lnr-home"></span> Home</a>
  760. {block:AskEnabled}
  761. <a class="md-trigger md-setperspective" data-modal="modal-1">
  762. <span class="lnr lnr-envelope"></span> Mail</a>
  763. {/block:AskEnabled}
  764. <a class="md-trigger md-setperspective" data-modal="modal-2">
  765. <span class="lnr lnr-user"></span> Info
  766. </a>
  767.  
  768. <a class="md-trigger md-setperspective" data-modal="modal-3">
  769. <span class="lnr lnr-menu"></span> Links
  770. </a>
  771. {block:ifshowblogroll}
  772. {block:following}
  773. <a class="md-trigger md-setperspective" data-modal="modal-4">
  774. <span class="lnr lnr-heart"></span> Blogroll
  775. </a>
  776. {/block:following}
  777. {/block:ifshowblogroll}
  778. </nav>
  779. </div>
  780. </aside>
  781. <!--SIDEBAR-->
  782.  
  783. <!--POSTS-->
  784. <main>
  785. {block:posts}
  786. <article class="posts">
  787.  
  788. {block:Text}
  789. {block:Title}<h1>{Title}</h1>{/block:Title}
  790. <div class="captions">
  791. {Body}
  792. </div>
  793. {/block:Text}
  794.  
  795. {block:Photo}
  796. {LinkOpenTag}
  797. <a href="#" 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">
  798. <img class="photop" src="{PhotoURL-500}" width="100%" height="auto">
  799. </a>
  800. {LinkCloseTag}
  801.  
  802. {block:Caption}<div class="captions">{Caption}</div>{/block:Caption}
  803.  
  804. {/block:Photo}
  805.  
  806. {block:Photoset}
  807. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  808.  
  809. {block:Photos}
  810. <div class="photo-data">
  811. <div class="pxu-photo">
  812. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  813. </div>
  814. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  815. </div>
  816. {/block:Photos}
  817.  
  818. </div>
  819.  
  820. {block:Caption}<div class="captions">{Caption}</div>{/block:Caption}
  821. {/block:Photoset}
  822.  
  823. {block:Audio}
  824. <div class="flitwick">
  825.  
  826. <div class="mariah">
  827. <div class="playbox">{AudioPlayerWhite}</div>
  828. </div>
  829.  
  830. <div class="grammy">
  831. <img src="https://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" style="position:absolute;" width="100" height="100" />
  832. {block:AlbumArt}
  833. <img src="{AlbumArtURL}" style="position:absolute;">
  834. {/block:AlbumArt}
  835. </div>
  836.  
  837.  
  838. <div class="taylor">
  839. <div class="swift">
  840. {block:TrackName}
  841. <b>Song:</b> {TrackName}
  842. {/block:TrackName}<br>
  843.  
  844. {block:Artist}
  845. <b>Artist:</b> {Artist}
  846. {/block:Artist}<br>
  847.  
  848. {block:Album}
  849. <b>Album:</b> {Album}
  850. {/block:Album}
  851.  
  852. </div>
  853. </div>
  854.  
  855. </div>
  856. {block:Caption}
  857. <div class="captions">{Caption}</div>
  858. {/block:Caption}
  859. {/block:Audio}
  860.  
  861. {block:Video}
  862. {Video-500}
  863. {block:Caption}<div class="captions">{Caption}</div>{/block:Caption}
  864. {/block:Video}
  865.  
  866. {block:Chat}
  867. {block:Title}<h1>{Title}</h1>{/block:Title}
  868. <div class="captions">
  869. {block:Lines}<p>
  870. {block:Label}<b>{Label}</b>{/block:Label} {Line}
  871. </p>{/block:Lines}
  872.  
  873.  
  874. </div>
  875. {/block:Chat}
  876.  
  877. {block:Link}
  878. <div class="linkp">
  879. <span class="lnr lnr-link"></span>
  880. <a href="{URL}"><h1>{Name}</h1></a></div>
  881. {block:Description}
  882. <div class="captions">
  883. {Description}
  884. </div>
  885. {/block:Description}
  886. {/block:Link}
  887.  
  888. {block:Quote}
  889. <h1 class="q{length}">&ldquo;{Quote}&rdquo;</h1>
  890.  
  891. {block:Source}
  892. <div class="divider"></div>
  893. <span class="qsource">{Source}</span>{/block:Source}
  894. {/block:Quote}
  895.  
  896. {block:Answer}
  897. <div class="ask_cont">
  898. <div class="asker_img">
  899. <img src="{AskerPortraitURL-40}">
  900. </div>
  901. <div class="sender">{Asker}: {Question}</div>
  902. </div>
  903.  
  904. <div class="captions">
  905. {Answer}
  906. </div>
  907. {/block:Answer}
  908.  
  909. {block:date}
  910.  
  911. <div class="p_info">
  912. <div class="p_obj">
  913. <span class="lnr lnr-clock"></span>
  914. <a title="{TimeAgo}" href="{Permalink}">{ShortMonth}. {DayOfMonth}{DayOfMonthSuffix}</a>
  915. </div>
  916. {block:NoteCount}
  917. <div class="p_obj">
  918. <span class="lnr lnr-heart"></span>
  919. <a href="{Permalink}">{NoteCountWithLabel}</a>
  920. </div>
  921. {/block:NoteCount}
  922.  
  923. {block:RebloggedFrom}
  924. <div class="p_obj">
  925. <a href="{ReblogParentURL}" title="{ReblogParentName}"target="_blank">via</a>
  926. {block:ContentSource}
  927. / <a href="{SourceURL}" title="{ReblogRootName}" target="_blank">src</a>
  928. {/block:ContentSource}
  929. </div>
  930. {/block:RebloggedFrom}
  931.  
  932. <div class="p_obj">
  933. <span class="lnr lnr-sync"></span>
  934. <a href="{ReblogURL}">Reblog</a>
  935. </div>
  936. </div>
  937.  
  938. <!-- {block:NoRebloggedFrom}
  939. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  940. {/block:NoRebloggedFrom} -->
  941.  
  942. {block:ContentSource}<!-- {SourceURL}
  943. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  944. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  945. {/block:ContentSource}
  946. {/block:date}
  947.  
  948. {block:HasTags}
  949. <div class="tags">
  950. {block:Tags}
  951. <a href="{TagURL}">#{Tag}</a>
  952. {/block:Tags}
  953. </div>
  954. {/block:HasTags}
  955. </article>
  956.  
  957. {block:permalinkpage}
  958. {block:NoteCount}
  959. <article class="posts postnotes">
  960. <h1 class="notehead">{NoteCountWithLabel}</h1>
  961. {block:PostNotes}{PostNotes-64}{/block:PostNotes}
  962. </article>
  963. {/block:NoteCount}
  964. {/block:permalinkpage}
  965.  
  966. {/block:posts}
  967. </main>
  968. <!--POSTS-->
  969.  
  970. {block:Pagination}
  971. {block:IndexPage}
  972. <!--PAGINATION-->
  973. <div class="pg">
  974. {block:PreviousPage}
  975. <a href="{PreviousPage}">&laquo;</a>
  976. {/block:PreviousPage}
  977.  
  978. {block:JumpPagination length="5"}
  979.  
  980. {block:CurrentPage}
  981. <span class="currentpg">{PageNumber}</span>
  982. {/block:CurrentPage}
  983.  
  984. {block:JumpPage}
  985. <a href="{URL}">{PageNumber}</a>
  986. {/block:JumpPage}
  987.  
  988. {/block:JumpPagination}
  989.  
  990.  
  991. {block:NextPage}
  992. <a class="nxtpg" href="{NextPage}">&raquo;</a>
  993. {/block:NextPage}
  994. </div>
  995. {/block:IndexPage}
  996. {/block:Pagination}
  997.  
  998. {block:IndexPage}
  999.  
  1000. {block:ifinfinitescroll}
  1001. {block:ifmanualload}
  1002. {block:Pagination}
  1003.  
  1004. <div class="manual_cont">
  1005. <a class="append">Load More</a>
  1006. </div>
  1007. {/block:Pagination}
  1008. {/block:ifmanualload}
  1009. {/block:ifinfinitescroll}
  1010.  
  1011. {/block:Indexpage}
  1012.  
  1013. </section>
  1014. </div>
  1015. <!--MAIN CONTAINER-->
  1016.  
  1017. <div class="overlay"></div><!-- the overlay element -->
  1018.  
  1019. <!--PLEASE DO NOT ALTER OR COVER THE CREDIT-->
  1020. <div id="leo">
  1021. <a class="a-link" href="https://hermionegrangcr.tumblr.com">♚</a>
  1022. </div>
  1023. <!--END OF CREDIT-->
  1024.  
  1025. <!--Tooltips. It's placed here bc it's only compatible to jQuery 1.7-->
  1026. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1027.  
  1028. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1029.  
  1030. <script>
  1031. jQuery.noConflict();
  1032. (function($){
  1033.  
  1034. $(document).ready(function(){
  1035.  
  1036. $("a[title],img[title],[title]").style_my_tooltips({
  1037.  
  1038. tip_follows_cursor:true,
  1039.  
  1040. tip_delay_time:30,
  1041.  
  1042. tip_fade_speed:300,
  1043.  
  1044. attribute:"title"
  1045.  
  1046. });
  1047.  
  1048. });
  1049.  
  1050. })(jQuery);
  1051. </script>
  1052. <!--Tooltips-->
  1053.  
  1054. <!--MODAL SCRIPTS-->
  1055. <script src="https://static.tumblr.com/xbvpdcx/8a7nkqvai/classie.js" ></script>
  1056.  
  1057. <script src="https://static.tumblr.com/xbvpdcx/Ppyossfve/th05v1modal.js" ></script>
  1058. <!--MODAL SCRIPTS-->
  1059.  
  1060.  
  1061. </body>
  1062. </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!