API tools faq
paste
Advertisement
hermionemessi

Theme 05 v2

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