Advertisement
pasinoe

liska tweak

Oct 12th, 2018
115
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.77 KB | None | 0 0
  1. <!--
  2.  
  3. THEME: HARMONIA
  4. by acuite
  5.  
  6. - don't steal this pls
  7. - enjoy, ilu (ノ◕ヮ◕)ノ*:・゚✧
  8.  
  9. - @acuite for more themes
  10.  
  11. - reminder: you do not need to edit the popup at all. simply add your description, links & quote in the main Theme Options menu!
  12.  
  13. -->
  14.  
  15. <html>
  16. <head>
  17.  
  18. <!-- popups by noveia / bravethemes ; please don't delete credits --><script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script><script>
  19. $(document).ready(function() {
  20. $('a.poplight[href^=#]').click(function() {
  21. var popID = $(this).attr('rel');
  22. var popURL = $(this).attr('href');
  23. var query= popURL.split('?');
  24. var dim= query[1].split('&');
  25. var popWidth = dim[0].split('=')[1];
  26. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  27. var popMargTop = ($('#' + popID).height() + 80) / 2;
  28. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  29. $('#' + popID).css({
  30. 'margin-top' : -popMargTop,
  31. 'margin-left' : -popMargLeft
  32. });
  33. $('body').append('<div id="fade"></div>');
  34. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
  35. return false;
  36. });
  37. $('a.close, #fade').live('click', function() {
  38. $('#fade, .popup_block').fadeOut(function() {
  39. $('#fade, a.close').remove();
  40. });
  41. return false;
  42. });
  43. });
  44. </script><!-- poppups by noveia / bravetheme -->
  45.  
  46. <title>{Title}</title>
  47. <link rel="shortcut icon" href="https://static1.squarespace.com/static/55a0e13ce4b00afc9ff06220/55d2a2b8e4b05b3ce73ccac5/56f6619d3c44d8fc598f20f6/1458988239249/12806598_10153632224211731_1708103887_n.gif?format=1500w">
  48. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  49. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  50.  
  51. <meta name="color:Background" content="#f0f0f0"/>
  52. <meta name="color:Element" content="#eddedc"/>
  53. <meta name="color:SidebarText" content="#bdbdbd"/>
  54. <meta name="color:Post" content="#fff"/>
  55. <meta name="color:Border" content="#eee"/>
  56. <meta name="color:Text" content="#555"/>
  57. <meta name="color:Link" content="#999"/>
  58. <meta name="color:Hover" content="#f8e2e2"/>
  59.  
  60. <meta name="if:Tags" content=""/>
  61. <meta name="if:Round Edges" content=""/>
  62.  
  63. <meta name="text:title1" content="렌다 me likey"/>
  64. <meta name="text:title2" content="me likey likey 두근두근두근두근 heart heart."/>
  65. <meta name="text:description" content="LOREM IPSUM DOLOR SIT AMET, CONSECTETUR ADIPISICING ELIT, SED DO EIUSMOD TEMPOR INCIDIDUNT UT LABORE ET DOLORE MAGNA ALIQUA. UT ENIM AD MINIM VENIAM, QUIS NOSTRUD EXERCITATION ULLAMCO LABORIS NISI UT ALIQUIP EX EA COMMODO CONSEQUAT. DUIS AUTE IRURE DOLOR IN REPREHENDERIT IN VOLUPTATE VELIT ESSE CILLUM DOLORE EU FUGIAT NULLA PARIATUR. EXCEPTEUR SINT OCCAECAT CUPIDATAT NON PROIDENT, SUNT IN CULPA QUI OFFICIA DESERUNT MOLLIT ANIM ID EST LABORUM."/>
  66. <meta name="text:like" content="SOMMUNGCHI, SPICY FOOD, TAEKWONDO, GAMING, MUSIC, SKINSHIP, ANIMALS, DRAWING."/>
  67. <meta name="text:dislike" content="BEING IGNORED, HOT DAYS, EMPTY FRIDGE, DARKNESS, AEGYO, BOREDOM."/>
  68. <meta name="text:Hover1" content="this is an original character which means there is no affiliation with the real lee taemin or s.m. entertainment."/>
  69. <meta name="text:Hover2" content="semi-literate. however, i shall adapt to any sort of roleplaying according to the partner."/>
  70. <meta name="text:Hover3" content="there's a chance of seeing NSFW material on this blog, but they're tagged accordignly."/>
  71. <meta name="text:Hover4" content="pre-established relationships are welcome, plotting is welcome, spontaneous interactions are welcome."/>
  72. <meta name="text:Link1" content="Link1"/>
  73. <meta name="text:Url1" content="/"/>
  74. <meta name="text:Link2" content="Link2"/>
  75. <meta name="text:Url2" content="/"/>
  76. <meta name="text:Link3" content="Link3"/>
  77. <meta name="text:Url3" content="/"/>
  78. <meta name="text:Link4" content="Link4"/>
  79. <meta name="text:Url4" content="/"/>
  80. <meta name="text:Link5" content="Link5"/>
  81.  
  82. <meta name="text:Post" content="350"/>
  83. <meta name="text:Margin" content="75"/>
  84.  
  85. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  86. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  87. <link href='https://fonts.googleapis.com/css?family=Karla:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
  88. <style>figure{margin:0}.tmblr-iframe{position:absolute}.tmblr-iframe.hide{display:none}</style><link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
  89.  
  90.  
  91.  
  92. <style type="text/css">
  93. @font-face{ font-family:"shorelines"; src: url('https://dl.dropboxusercontent.com/s/gdujrcvp8lg7yvq/Shorelines_Script_Bold%5B1%5D.otf’)'); }
  94.  
  95.  
  96. /* Scroll */
  97.  
  98. ::-webkit-scrollbar {width:11px;height:11px;background:{color:Border};}
  99. ::-webkit-scrollbar-thumb {background:rgba({RGBcolor:Link},0.5);}
  100. ::-webkit-scrollbar,::-webkit-scrollbar-thumb {
  101. border:5px solid {color:Background};
  102. }
  103.  
  104. /** popups by noveia / bravethemes ; please don't delete credits **/
  105. #fade{
  106. display:none;
  107. background:#fff; /* change background */
  108. position:fixed;
  109. left:0;
  110. top:0;
  111. width:100%;
  112. height:100%;
  113. opacity:0.5; /* change how transparent you want the background */
  114. z-index:9999; /* if this happens to go behind the popup, decrease the amount of 9's */
  115. }
  116. .popup_block{ /* the actual popup */
  117. display:none;
  118. background:#fff; /* change background */
  119. border:0.5px solid #f0f0f0;
  120. padding:10px;
  121. float:left;
  122. text-transform:uppercase;
  123. font-style:"Montserrat";
  124. font-size: 6.5px;
  125. line-height:20px;
  126. position:fixed;
  127. top:50%;
  128. left:50%;
  129. border-radius:10px 10px 10px 10px;
  130. z-index:999999999999; /* if this happens to go behind the fade, increase the amount of 9's */
  131. }
  132. *html #fade{
  133. position:absolute;
  134. }
  135. *html .popup_block{
  136. position:absolute;
  137. }
  138. /** popups by noveia / bravethemes ; please don't delete credits **/
  139.  
  140.  
  141. /* Controls */
  142.  
  143. #tumblr_controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop{-webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%);opacity:0.5;}
  144.  
  145. /* General */
  146.  
  147. body {
  148. margin:0;
  149. color:{color:Text};
  150. background:{color:Background};
  151. font-smooth:always;
  152. -webkit-font-smoothing:antialiased;
  153. -moz-osx-font-smoothing: grayscale;
  154. }
  155.  
  156. a:link, a:active, a:visited {text-decoration:none;}
  157. body,p,pre,blockquote,big,small,sub,sup,li {font-size:9.5px;}
  158. body,p,pre,em{font-family:'Karla',Arial,Helvetica,sans-serif;}
  159. a,.tags,.our_button,.like_button,.menu {
  160. transition:0.5s ease;
  161. -o-transition:0.5s ease;
  162. -moz-transition:0.5s ease;
  163. -webkit-transition:0.5s ease;
  164. }
  165.  
  166. b, strong {
  167. color: #9db1d2;
  168. text-shadow: 0px 0px 1px #fff;
  169. font-family: montserrat;
  170. letter-spacing: 0px;
  171. font-size: 9px;
  172. }
  173.  
  174. i, em {
  175. color: #9db1d2;
  176. font-family: shorelines;
  177. font-size: 10px;
  178. font-weight: none;
  179. text-shadow: 1px 1px 2px #eee;
  180. text-transform: lowercase;
  181.  
  182. }
  183.  
  184.  
  185. /* Credit & Scroll to Top */
  186.  
  187. .c,.top{position:fixed;right:-20px;width:180px;}
  188. .c {bottom:20px;}
  189. .top {bottom:50px;display:none;}
  190. .c {font-size:9px;letter-spacing:1px;text-transform:uppercase;}
  191.  
  192. /* Pagination */
  193.  
  194. .cp {font-weight:600;}
  195. .cp,.jp,.pag a{display:inline-block;vertical-align:middle;margin:0 10px;}
  196. .pag a i,.top{font-size:20px;}
  197. .pag {position:relative;}
  198. .load {cursor:pointer;display:block;}
  199. .c,.top,.pag,.load {text-align:center;}
  200. .pag,.load {font-size:9px;letter-spacing:1px;text-transform:uppercase;}
  201. {block:ifnotPaginate}
  202. .pag,#infscr-loading {display:none!important;}
  203. {/block:ifnotPaginate}
  204.  
  205. /* Containers */
  206.  
  207. .center {
  208. position:relative;
  209. margin:{text:Margin}px auto;
  210. width:{text:Post}px;
  211. left:10%;
  212. }
  213.  
  214. .solid_posts .center {width:calc({text:Post}px + 4px);}
  215. .bx,.video {padding-bottom:1px;}
  216. .solid_posts .bx,.solid_posts .video {padding:1px;}
  217. .solid_posts .p {padding:8px 10px;}
  218. .entry {margin:{text:Margin}px 0;background:#fff;padding: 10px;}
  219. .entry img {
  220. max-width:100%;
  221. height:auto;
  222. opacity:1;
  223. -webkit-filter:none;
  224. -moz-transition-duration: 0.5s;
  225. -o-transition-duration: 0.5s;
  226. -webkit-transition-duration: 0.5s;
  227. transition-duration: 0.5s;
  228. -webkit-filter:grayscale(30%);
  229. }
  230.  
  231. .entry img:hover {
  232. opacity:1;
  233. -webkit-filter:none;
  234. -moz-transition-duration: 0.5s;
  235. -o-transition-duration: 0.5s;
  236. -webkit-transition-duration: 0.5s;
  237. transition-duration: 0.5s;
  238. -webkit-filter:grayscale(0%);
  239. }
  240.  
  241. /* Sidebar */
  242.  
  243. #title1 {
  244. font-family: 'shorelines';
  245. font-size: 33px;
  246. line-height: 21px;
  247. color: #a8bbd8;
  248. text-transform: uppercase;
  249. letter-spacing: -1.5px;
  250. position: fixed;
  251. bottom: 350px;
  252. left: 306px;
  253.  
  254. z-index:999999;
  255. }
  256.  
  257. #title2 {
  258. font-family: 'Montserrat';
  259. font-size: 9px;
  260. line-height: 21px;
  261. color: #fff;
  262. text-transform: uppercase;
  263. letter-spacing: -0.3px;
  264. position: fixed;
  265. bottom: 329px;
  266. left: 307px;
  267. color: white;
  268. text-shadow: 2px 2px 4px #000000;
  269. }
  270.  
  271. .description {
  272. position:fixed;
  273. overflow:auto;
  274. bottom: 232px;
  275. text-transform: uppercase;
  276. left: 273px;
  277. width:183px;
  278. height:80px;
  279. line-height: 180%;
  280. font-style:"Montserrat";
  281. font-size: 8.5px;
  282. padding: 5px;
  283. color:{color:SidebarText};
  284. letter-spacing: 0px;
  285. text-align: left;
  286. background: #ffffff;
  287. border-left: 33px solid #fff;
  288. border-top: 5px solid #fff;
  289. border-right: 5px solid #fff;
  290. border-bottom: 5px solid #fff;
  291. }
  292.  
  293. .description::-webkit-scrollbar-thumb:vertical {
  294. background-color: #fff;
  295. height: 50px;
  296. }
  297.  
  298. #link {
  299. position: fixed;
  300. left: 299px;
  301. bottom: 126px;
  302. width: auto;
  303. height: auto;
  304. padding: 3px;
  305. }
  306.  
  307. .link {
  308. width:49px;
  309. font-style:"Montserrat";
  310. font-size: 6.5px;
  311. line-height:18px;
  312. display:inline-block;
  313. color: white;
  314. text-transform: uppercase;
  315. letter-spacing: 1px;
  316. text-align: center;
  317. background: #a8bbd8;
  318. -moz-transition:all linear 0.5s;
  319. -webkit-transition:all linear 0.5s;
  320. -o-transition:all linear 0.5s;
  321. transition:all linear 0.5s;
  322. }
  323.  
  324. .link:hover {
  325. color: #fff;
  326. border-radius:10px 10px 10px 10px;
  327. -moz-transition:all linear 0.5s;
  328. -webkit-transition:all linear 0.5s;
  329. -o-transition:all linear 0.5s;
  330. transition:all linear 0.5s;
  331. }
  332.  
  333.  
  334. .lik {
  335. font-weight:400;
  336. background:#ffffff;
  337. color:{color:SidebarText};
  338. overflow:auto;
  339. padding:7px 14px 2px 10px;
  340. width:115px;
  341. height:29px;
  342. position:fixed;
  343. bottom:191px;
  344. left:280px;
  345. font-family:"Montserrat";
  346. font-size:7px;
  347. line-height:8px;
  348. letter-spacing:0px;
  349. word-spacing:0px;
  350. border-left:15px solid white;
  351. border-right:29px solid white;
  352. text-transform:uppercase;
  353. text-align:left;
  354. }
  355.  
  356. .likicon {
  357. position:fixed;
  358. bottom:199px;
  359. left:427px;
  360. font-size:15px;
  361. line-height:11px;
  362. background:none;
  363. color:{color:Element};
  364. border-left: #ededed solid 1px;
  365. overflow:auto;
  366. padding:2px 0px 0px 10px;
  367. width:22px;
  368. height:20px;
  369. z-index:1;
  370. }
  371.  
  372. .dislik {
  373. font-weight:400;
  374. background:#ffffff;
  375. color:{color:SidebarText};
  376. overflow:auto;
  377. padding:7px 14px 2px 10px;
  378. width:115px;
  379. height:29px;
  380. position:fixed;
  381. bottom:150px;
  382. left:280px;
  383. font-family:"Montserrat";
  384. font-size:7px;
  385. line-height:8px;
  386. letter-spacing:0px;
  387. word-spacing:0px;
  388. border-left:15px solid white;
  389. border-right:29px solid white;
  390. text-transform:uppercase;
  391. text-align:left;
  392. }
  393.  
  394. .dislikicon {
  395. position:fixed;
  396. bottom:158px;
  397. left:427px;
  398. font-size:15px;
  399. line-height:11px;
  400. background:none;
  401. color:{color:Element};
  402. border-left: #ededed solid 1px;
  403. overflow:auto;
  404. padding:2px 0px 0px 12px;
  405. width:22px;
  406. height:20px;
  407. z-index:1;
  408. }
  409.  
  410.  
  411. #pbpics {
  412. position: fixed;
  413. bottom: 120px;
  414. left: 85px;
  415. z-index: 10;
  416. }
  417.  
  418. .block {
  419. position:fixed;
  420. bottom: 150px;
  421. left: 467px;
  422. width:37px;
  423. height:79px;
  424. background:#fff;
  425. }
  426.  
  427. /* Titles */
  428.  
  429. h2 {margin:10px;font-size:12px;font-weight:400;}
  430. h3,h4,h5 {margin:10px;font-size:10px;}
  431.  
  432. /* Permalinks */
  433.  
  434. .p {padding-top:8px;font-size:0;}
  435. .p i {opacity:0.75;font-size:10px;}
  436. .ple i {margin-right:2px;}
  437. .ple {font-weight:700;padding:0 0 1px;}
  438. .ple,.pri {display:inline-block;vertical-align:middle;width:50%;}
  439. .ple,.tags a {font-size:8px;line-height:100%;}
  440. .pri {text-align:right;}
  441. .fa-refresh {margin-left:6px;}
  442.  
  443. .custom-like-button *{cursor:pointer!important;}
  444. .custom-like-button {
  445. position:relative;
  446. display:inline-block;
  447. vertical-align:top;
  448. width:10px;
  449. height:10px;
  450. cursor:pointer;
  451. }
  452.  
  453. .like_button:hover + .our_button {color:#7c8283;}
  454. .like_button.liked + .our_button {color:#7c8283;}
  455. .like_button iframe {width:100%!important;height:100%!important;}
  456. .like_button {z-index:10;opacity:0;}
  457. .our_button {z-index:1;}
  458. .our_button,.like_button {
  459. position:absolute;
  460. top:0;
  461. left:0;
  462. width:100%;
  463. height:100%;
  464. }
  465.  
  466. .tags {margin-top:4px;}
  467. .tags a {
  468. margin-right:5px;
  469. text-transform:none;
  470. display:inline;
  471. }
  472.  
  473. /* Quotes */
  474.  
  475. .qut_hold {padding:20px;}
  476. .src {margin-bottom:10px;}
  477. .qut {font-size:11px;font-style:italic;}
  478.  
  479. /* Audio & Chat */
  480.  
  481. .lines,.chat h2,.audio {padding:10px;}
  482. .lines:first-of-type {border:0;}
  483. .chat h2 {margin:0;}
  484. .lines b{display:block;font-weight:400;}
  485. .play {padding:10px;background:#f2f2f2;height:27px;width:29px;}
  486. .audio {font-size:0;}
  487. .play,.au {display:inline-block;vertical-align:middle;}
  488. .soundcloud_audio_player{padding:15px 0;}
  489. .tn {text-transform:uppercase;letter-spacing:1px;}
  490. .au span {display:block;margin:3px 0;font-size:9px;}
  491. .au {width:calc(100% - 67px);margin-left:17px;}
  492. .tumblr_audio_player {width:27px;height:27px;overflow:hidden;}
  493.  
  494. /* Text */
  495.  
  496. ol,ul {padding:0 0 0 25px;font-size:0;}
  497. li {margin:7px 0;line-height:100%;}
  498. p,blockquote,pre,ul,ol{margin:10px;}
  499. blockquote p{margin:10px 0;}
  500. blockquote p:first-child{margin:0 0 10px;}
  501. blockquote p:last-child{margin:10px 0 0;}
  502. blockquote p:only-child{margin:0;}
  503. blockquote blockquote {margin:0;}
  504. blockquote{padding-left:10px;border-left:1px solid {color:Border};}
  505. pre {
  506. white-space:pre-wrap;
  507. white-space:-moz-pre-wrap;
  508. white-space:-pre-wrap;
  509. white-space:-o-pre-wrap;
  510. word-wrap:break-word;
  511. }
  512.  
  513. /* Captions */
  514.  
  515. .txt iframe,.cap iframe{display:block;max-width:100%;overflow:hidden;}
  516. .solid_posts .txt,.solid_posts .cap{padding:10px;}
  517. .minimal_posts .txt,.minimal_posts .cap{padding:5px 0;}
  518. .solid_posts .cinl{padding:20px;}
  519. .minimal_posts .cinl{padding:15px 10px;}
  520. .chid {display:none;}
  521. .cmin blockquote {border:0;padding:0;}
  522. .cinl *:not(a):not(ul):not(ol):not(li){margin:0;padding:0;display:inline;}
  523. .cinl p:first-of-type {display:inline!important;}
  524. .cinl blockquote {border:0;}
  525. .cinl p,.cinl blockquote p {display:block!important;margin:0!important;}
  526.  
  527. /* Video */
  528.  
  529. .video {overflow:hidden;}
  530. .vine-embed,#youtube_iframe {display:block;}
  531. .instagram-media {border-radius:0!important;box-shadow:none!important;}
  532.  
  533. /* Photosets */
  534.  
  535. #tumblr_lightbox,.tmblr-lightbox {
  536. background:rgba({RGBcolor:Background},0.99)!important;
  537. }
  538.  
  539. #vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{
  540. opacity:0!important;
  541. }
  542.  
  543. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image,
  544. #tumblr_lightbox_right_image, .lightbox-image {
  545. box-shadow:none!important;
  546. border-radius:0px!important;
  547. {block:ifRoundEdges}border-radius:10px!important;{/block:ifRoundEdges}
  548. }
  549.  
  550. /* Ask */
  551.  
  552. .ask {padding:20px;}
  553. .aski {margin:0 0 10px;line-height:20px;font-size:10px;}
  554. .aski img {float:left;width:20px;margin-right:7px;}
  555.  
  556. /* Permalink Page + Postnotes */
  557.  
  558. .solid_posts .perma {padding:15px;}
  559. .minimal_posts .perma {padding:15px 0;}
  560.  
  561. .pph {text-transform:lowercase;}
  562. .perma {line-height:175%;}
  563. .pmt a:after {content:',';}
  564. .pmt a:last-of-type:after {content:'.';}
  565. .pn ol {margin:0;padding:0;list-style-type:none;}
  566. .pn li{margin:10px;font-size:8px;line-height:100%;}
  567. .pn,.pn img{display:none;}
  568. .pn {padding:5px;font-size:0;}
  569. .pnh,.more_notes_link,.notes_loading {display:block;font-weight:600;}
  570. .more_notes_link,.notes_loading {text-align:left!important;}
  571.  
  572. /* Tooltips */
  573.  
  574. #s-m-t-tooltip{
  575. max-width:200px;
  576. margin-top:25px;
  577. margin-left:15px;
  578. padding:5px;
  579. text-align:justify;
  580. letter-spacing:1px;
  581. z-index:9999999;
  582. background:{color:Element};
  583. color:#fff;
  584. font-family:arial;
  585. font-size:7px;
  586. font-style:bold;
  587. text-transform:uppercase;
  588. line-height:100%;
  589. border-radius:5px;
  590. }
  591.  
  592.  
  593. /* Popups */
  594.  
  595. #navi,a.close {cursor:pointer;}
  596. .close i {font-size:12px;float:right;}
  597. .full{top:0;left:0;width:100%;height:100%;position:absolute;}
  598. .solid_posts .popup{background:rgba({RGBcolor:Background},0.9);}
  599. .popup{
  600. position:fixed;
  601. width:100%;
  602. height:100%;
  603. top:0;
  604. left:0;
  605. z-index:999999;
  606. display:none;
  607. }
  608.  
  609. .popup_content {
  610. position:absolute;
  611. top:{text:Margin}px;
  612. width:{text:Post}px;
  613. margin-left:calc((-{text:Post}px + -72px) / 2);
  614. padding:35px;
  615. font-size:0;
  616. left:50%;
  617. }
  618.  
  619. h1 {margin:0;font-weight:400;font-size:13px;text-transform:uppercase;}
  620. .desc {margin:10px 0;font-size:10px;line-height:150%;text-align:justify;}
  621. .popup nav {margin:0;}
  622. .popup nav ul {margin:0;padding:0;list-style-type:none;}
  623. .popup nav li a {font-size:10px;line-height:100%;}
  624. .popup nav li,.popup nav li a{display:inline-block;}
  625. .popup nav li {width:33.33333%;margin:5px 0;padding:0;}
  626. .quote {margin:10px 0 0;font-size:12px;font-style:italic;}
  627.  
  628. /* Common Styles */
  629.  
  630. .ask,p,blockquote,.lines,.pn,.cap{line-height:150%;}
  631. a:hover,a h2:hover{color:#7c8283;}
  632. a,.p,.perma,.src,.chat b,.tn,h1,h2,.ask,.pag{color:{color:Link};}
  633. h2 a i{margin:0 2px;}
  634.  
  635. {block:ifRoundEdges}
  636. .play,.aski img,.entry,.popup_content{border-radius:4px;}
  637. .ph,.entry iframe,.video,#s-m-t-tooltip{border-radius:3px!important;}
  638. {/block:ifRoundEdges}
  639.  
  640. /* Borders */
  641.  
  642. .solid_posts .entry,.solid_posts aside .image,.solid_posts .popup_content,#s-m-t-tooltip {background:{color:Post};border:1px solid {color:Border};}
  643.  
  644. nav li a:hover {border-color:rgba({RGBcolor:Hover},0.5);}
  645. .pn,.lines,.cap,.p,.perma{border-top:1px solid {color:Border};}
  646. .ask,nav li a{border-bottom:1px solid {color:Border};}
  647.  
  648. /* Etc */
  649.  
  650. img {margin:0;display:block;}
  651.  
  652. iframe.tmblr-iframe {
  653. z-index:99999999999999!important;
  654. top:0!important;
  655. right:0!important;
  656. opacity:0.4;
  657. /* delete invert(1) from here */
  658. filter:invert(1) contrast(150%);
  659. -webkit-filter:invert(1) contrast(150%);
  660. -o-filter:invert(1) contrast(150%);
  661. -moz-filter:invert(1) contrast(150%);
  662. -ms-filter:invert(1) contrast(150%);
  663. /* to here if your blog has a dark background */
  664. transform:scale(0.65);
  665. transform-origin:100% 0;
  666. -webkit-transform:scale(0.65);
  667. -webkit-transform-origin:100% 0;
  668. -o-transform:scale(0.65);
  669. -o-transform-origin:100% 0;
  670. -moz-transform:scale(0.65);
  671. -moz-transform-origin:100% 0;
  672. -ms-transform:scale(0.65);
  673. -ms-transform-origin:100% 0;}
  674.  
  675. iframe.tmblr-iframe:hover {
  676. opacity:0.6!important;}
  677.  
  678. /* paste this section between < style > and < /style > */
  679.  
  680. .hot-spot {
  681. background-color:transparent; /* change the circle background color */
  682. border-radius: 20px;
  683. color: #fff;
  684. padding: 5px;
  685. position: fixed;
  686. text-align: center;
  687. font-size:12px;
  688. line-height:10px;
  689. width: 10px;
  690. height: 10px;
  691. } /* change the sthe circle border color */
  692.  
  693. .hot-spot:hover {
  694. color:#eeeeee; /* change the circle hover color */
  695. -webkit-transition: 0.5s linear;
  696. -webkit-transition: all 0.5s linear;
  697. -moz-transition: all 0.5s linear;
  698. -o-transition: all 0.5s linear;}
  699.  
  700. .hot-spot:hover .boxstuff {
  701. display:block;
  702. opacity:0.9;}
  703.  
  704. /* change the 'star' positions here by altering the top and left values, you can add more stars if you like and this is where you would set the position of them */
  705.  
  706. #pops {
  707. position: fixed;
  708. top: 510px;
  709. left: 110px;
  710. font-family: Arial;
  711. font-size: 60px;
  712. color: #fff;
  713. opacity: 10;
  714. z-index: 9999990;
  715. }
  716.  
  717.  
  718.  
  719. .star1 {
  720. bottom:200px;
  721. left:472px;
  722. z-index:3;
  723. font-size: 37px;
  724. text-shadow: 1px 1px #d4d4d4;
  725. }
  726.  
  727. .star2 {
  728. bottom:181px;
  729. left:472px;
  730. z-index:4;
  731. font-size: 37px;
  732. text-shadow: 1px 1px #d4d4d4;
  733. }
  734.  
  735. .star3 {
  736. bottom:163px;
  737. left:472px;
  738. z-index:5;
  739. font-size: 37px;
  740. text-shadow: 1px 1px #d4d4d4;
  741. }
  742.  
  743. .star4 {
  744. bottom:144px;
  745. left:472px;
  746. z-index:5;
  747. font-size: 37px;
  748. text-shadow: 1px 1px #d4d4d4;
  749. }
  750.  
  751. .boxstuff {
  752. background-color:{color:Element};
  753. color: #fff; /* change the hover box text color */
  754. display:none;
  755. padding: 8px;
  756. letter-spacing:1px;
  757. position: absolute;
  758. text-align: left;
  759. font-size:7.5px; /* change the hover box font-size here */
  760. top: 13px;
  761. left:13px;
  762. width: 155px;
  763. text-transform:uppercase;
  764. z-index: 10;
  765. margin-left:6px;
  766. border-top-left-radius:10px;
  767. border-bottom-left-radius:10px;
  768. border-bottom-right-radius:10px;
  769. border-top-right-radius:10px;
  770. }
  771.  
  772. .boxstuff img {
  773. width:50px;
  774. text-align:center;
  775. border-right:0px solid #fff;
  776. -webkit-filter: grayscale(0%);
  777. display:inline-block;
  778. outline-offset:-4px;
  779. -webkit-transition: all 0.8s ease-in-out;
  780. -moz-transition: all 0.8s ease-in-out;
  781. -o-transition: all 0.8s ease-in-out;
  782. -ms-transition: all 0.8s ease-in-out;
  783. transition: all 0.8s ease-in-out;
  784. }
  785.  
  786. .boxstuff img:hover {
  787. cursor:help;
  788. -webkit-transition:all 0.9s ease-out;
  789. -moz-transition:all 0.9s ease-out;
  790. transition:all 0.9s ease-out;
  791. border-bottom-left-radius: 100px;
  792. border-bottom-right-radius: 100px;
  793. border-top-right-radius: 100px;
  794. border-top-left-radius: 100px;
  795. }
  796.  
  797.  
  798. </style>
  799. </head>
  800. <body class="{select:Posts}">
  801. <div class="popup navi">
  802. <a class="close full"></a>
  803. <div class="popup_content">
  804. <a class="close"><i class="fa fa-times"></i></a>
  805.  
  806. </div></div>
  807.  
  808.  
  809. <div id="pbpics"><img src="https://i.imgur.com/P4RlESD.png"></div>
  810.  
  811. <div id="title1">
  812. {text:title1}
  813. </div>
  814.  
  815. <div id="title2">
  816. {text:title2}
  817. </div>
  818.  
  819. <div class="description">
  820. {text:description}
  821. </div>
  822.  
  823. <div id="link">
  824. <a class="link" href="{text:Url1}">{text:Link1}</a>
  825. <a class="link" href="{text:Url2}">{text:Link2}</a>
  826. <a class="link" href="{text:Url3}">{text:Link3}</a>
  827. <a class="link" href="{text:Url4}">{text:Link4}</a>
  828. </div>
  829.  
  830. <div id="pops"><a href="#?w=300" rel="01" class="poplight"><font color="#fff">+</a></font>
  831. </div>
  832.  
  833. <div class="hot-spot star1"><font color="{color:Hover}">*</font>
  834. <div class="boxstuff">
  835. {text:Hover1}
  836. </div></div>
  837.  
  838. <div class="hot-spot star2"><font color="{color:Hover}">*</font>
  839. <div class="boxstuff">
  840. {text:Hover2}
  841. </div></div>
  842.  
  843. <div class="hot-spot star3"><font color="{color:Hover}">*</font>
  844. <div class="boxstuff">
  845. {text:Hover3}
  846. </div></div>
  847.  
  848. <div class="hot-spot star4"><font color="{color:Hover}">*</font>
  849. <div class="boxstuff">
  850. {text:Hover4}
  851. </div></div>
  852.  
  853. <div class="block"></div>
  854.  
  855. <div class="lik"></a>{text:like}</div>
  856.  
  857. <div class="dislik"></a>{text:dislike}</div>
  858.  
  859. <div class="likicon"><i class="fa fa-check" aria-hidden="true"></i></div>
  860.  
  861. <div class="dislikicon"><i class="fa fa-times" aria-hidden="true"></i></div>
  862.  
  863. <div class="center">
  864.  
  865. <div id="content">
  866. {block:Posts}
  867. <div class="entry" id="{PostID}">
  868.  
  869. {block:Text}
  870. <div class="txt">
  871. {block:Title}<h2>{Title}</h2>{/block:Title}
  872. {Body}
  873. </div>
  874. {/block:Text}
  875.  
  876. {block:Link}
  877. <div class="txt">
  878. <h2><a title="{URL}" href="{URL}">{Name} <i class="fa fa-angle-right"></i></a></h2>
  879. {block:Description}{Description}{/block:Description}
  880. </div>
  881. {/block:Link}
  882.  
  883. {block:Photo}
  884. <div class="bx"><a href="{Permalink}"><img class="ph" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/></a></div>
  885. {/block:Photo}
  886.  
  887. {block:Photoset}
  888. <div class="bx"><div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div></div>
  889. {/block:Photoset}
  890.  
  891. {block:Quote}
  892. <div class="qut_hold">
  893. {block:Source}<div class="src">{Source}</div>{/block:Source}
  894. <div class="qut">{Quote}</div>
  895. </div>
  896. {/block:Quote}
  897.  
  898. {block:Chat}
  899. <div class="chat">
  900. {block:Title}<h2>{Title}</h2>{/block:Title}
  901. {block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</div></div>{/block:Lines}
  902. </div>
  903. {/block:Chat}
  904.  
  905. {block:Audio}
  906. <div class="audio">
  907. {block:AudioPlayer}<div class="play">{AudioPlayerGrey}</div>{/block:AudioPlayer}
  908. <div class="au">
  909. {block:TrackName}<span class="tn">{TrackName}</span>{/block:TrackName}
  910. {block:Artist}<span>by {Artist}</span>{/block:Artist}
  911. </div>
  912. </div>
  913. {/block:Audio}
  914.  
  915. {block:Video}
  916. <div class="video">{Video-500}</div>
  917. {/block:Video}
  918.  
  919. {block:Answer}
  920. <div class="ask">
  921. <div class="aski"><img src="{AskerPortraitURL-24}">{Asker} said:</div>
  922. <div class="que">{Question}</div>
  923. </div>
  924. <div class="txt">{Answer}</div>
  925. {/block:Answer}
  926.  
  927. {block:Caption}<div class="cap {select:Captions}">{Caption}</div>{/block:Caption}
  928.  
  929. {block:IndexPage}
  930. <div class="p">
  931. <a class="ple" href="{Permalink}"><i class="fa fa-map-marker"></i> {FormattedNoteCount}</a>
  932.  
  933. <div class="pri">
  934. <div class="custom-like-button">{LikeButton}
  935. <span class="our_button"><i class="fa fa-heart"></i></span>
  936. </div>
  937. <a href="{ReblogURL}"><i class="fa fa-refresh"></i></a>
  938. </div>
  939.  
  940. {block:ifTags}{block:HasTags}<div class="tags">
  941. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  942. </div>{/block:HasTags}{/block:ifTags}
  943. </div>
  944. {/block:IndexPage}
  945.  
  946.  
  947.  
  948. {block:PermalinkPage}
  949. {block:Date}
  950. <div class="pph">
  951. <div class="perma">
  952. posted {TimeAgo} on {DayofMonthWithSuffix} {Month}
  953. {block:RebloggedFrom}<br>
  954. via <a href="{ReblogParentURL}">{ReblogParentName}</a> &nbsp;&nbsp;&nbsp;
  955. source <a href="{ReblogRootURL}">{ReblogRootName}</a>
  956. {/block:RebloggedFrom}
  957.  
  958. {block:HasTags}<div class="pmt">tags: &nbsp;
  959. {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}
  960. </div>{/block:HasTags}
  961. <a href="#" class="pnh">{NoteCountWithLabel}</a>
  962. </div>
  963.  
  964. {block:PostNotes}
  965. <div class="pn">{PostNotes}</div>
  966. {/block:PostNotes}
  967.  
  968. </div>
  969. {/block:Date}
  970. {/block:PermalinkPage}
  971.  
  972. {block:ContentSource}
  973. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  974. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  975. {/block:SourceLogo}
  976. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  977. {/block:ContentSource}
  978.  
  979. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  980.  
  981. </div>
  982. {/block:Posts}
  983.  
  984. {block:ifPaginate}
  985. {block:Pagination}
  986. <div class="pag">
  987. {block:PreviousPage}
  988. <a href="{PreviousPage}"><i class="fa fa-angle-left"></i></a>
  989. {/block:PreviousPage}
  990.  
  991. {block:JumpPagination length="3"}
  992. {block:CurrentPage}
  993. <span class="cp">{PageNumber}</span>
  994. {/block:CurrentPage}
  995. {block:JumpPage}
  996. <a class="jp" href="{URL}">{PageNumber}</a>
  997. {/block:JumpPage}
  998. {/block:JumpPagination}
  999.  
  1000. {block:NextPage}
  1001. <a href="{NextPage}"><i class="fa fa-angle-right"></i></a>
  1002. {/block:NextPage}
  1003. </div>
  1004. {/block:Pagination}
  1005. {/block:ifPaginate}
  1006.  
  1007. </div>
  1008.  
  1009. {block:ifnotPaginate}
  1010. {block:Pagination}
  1011. <div class="pag">
  1012. {block:PreviousPage}
  1013. <a href="{PreviousPage}" class="prev">back</a>
  1014. {/block:PreviousPage}
  1015. {block:NextPage}
  1016. <a href="{NextPage}" class="next">next</a>
  1017. {/block:NextPage}
  1018. </div>
  1019.  
  1020. {block:ifLoadMore}
  1021. <a class="load">Load More</a>
  1022. {/block:ifLoadMore}
  1023. {/block:Pagination}
  1024. {/block:ifnotPaginate}
  1025.  
  1026. </div>
  1027.  
  1028. <a href="#" class="top"><i class="fa fa-angle-up"></i></a>
  1029. <div class="c"><a href="http://acuite.tumblr.com">acuite</a>
  1030. <br>heavily tweaked:<a href="http://afflie.tumblr.com">afflie</a><br>sb pic tweak by mun
  1031. </div>
  1032.  
  1033. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1034. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1035. <script src ="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  1036. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  1037. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1038. <script>
  1039. $(document).ready(function(){
  1040. $('.photo-slideshow').pxuPhotoset({
  1041. lightbox: true,
  1042. gutter: '1px',
  1043. photoset: '.photo-slideshow',
  1044. photoWrap: '.photo-data',
  1045. photo: '.pxu-photo',
  1046. {block:ifnotRoundEdges}
  1047. rounded: false,
  1048. {/block:ifnotRoundEdges}
  1049. {block:ifRoundEdges}
  1050. rounded: 'corners',
  1051. borderRadius: '3px'
  1052. {/block:ifRoundEdges}
  1053. });
  1054. {block:ifnotPaginate}
  1055. var $container = $('#content');
  1056. $container.infinitescroll({
  1057. itemSelector: '.entry',
  1058. navSelector: '.pag',
  1059. nextSelector: '.next',
  1060. loadingImg: ' ',
  1061. loadingText: ' ',
  1062. donetext: 'No more posts' ,
  1063. bufferPx: 2000,
  1064. {block:ifLoadMore}
  1065. errorCallback: function(){
  1066. jQuery('.load').delay(50).fadeOut();
  1067. }
  1068. {/block:ifLoadMore}
  1069. },
  1070. function( newElements ) {
  1071. var $newElems = $( newElements );
  1072. var $newElemsIDs = $newElems.map(function(){
  1073. return this.id;
  1074. }).get();
  1075. $newElems.find('.photo-slideshow').pxuPhotoset({
  1076. lightbox: true,
  1077. gutter: '1px',
  1078. photoset: '.photo-slideshow',
  1079. photoWrap: '.photo-data',
  1080. photo: '.pxu-photo',
  1081. {block:ifnotRoundEdges}
  1082. rounded: false,
  1083. {/block:ifnotRoundEdges}
  1084. {block:ifRoundEdges}
  1085. rounded: 'corners',
  1086. borderRadius: '3px'
  1087. {/block:ifRoundEdges}
  1088. });
  1089. resizeVideos();
  1090. console.log($newElems, $newElemsIDs);
  1091. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1092. });
  1093.  
  1094. {block:ifLoadMore}
  1095. $(window).unbind(".infscr");
  1096. $(".load").click(function(){
  1097. $("#content").infinitescroll("retrieve");
  1098. });
  1099. {/block:ifLoadMore}
  1100.  
  1101. {/block:ifnotPaginate}
  1102. });
  1103.  
  1104.  
  1105.  
  1106. // scroll to top © html-tuts.com
  1107. var amountScrolled = 500;
  1108. $(window).scroll(function() {
  1109. if ($(window).scrollTop() > amountScrolled) {
  1110. $('a.top').fadeIn('slow');
  1111. } else {
  1112. $('a.top').fadeOut('slow');
  1113. }
  1114. });
  1115.  
  1116. $('a.top').click(function() {
  1117. $('body, html').animate({
  1118. scrollTop: 0
  1119. }, 'slow');
  1120. return false;
  1121. });
  1122.  
  1123.  
  1124.  
  1125. // drop links & post notes
  1126. $(document).ready(function(){
  1127. $(".pn").hide();
  1128. $(".pnh").show();$('.pnh').toggle(function(){
  1129. $(".pn").slideDown(function(){});
  1130. },function(){
  1131. $(".pn").slideUp(function(){});
  1132. });
  1133. $(".lb").hide();
  1134. $(".lh").show();$('.lh').toggle(function(){
  1135. $(".lb").slideDown(function(){});
  1136. },function(){
  1137. $(".lb").slideUp(function(){});
  1138. });
  1139. });
  1140.  
  1141.  
  1142. // tooltips
  1143. (function($){
  1144. $(document).ready(function(){
  1145. $("[title]").style_my_tooltips({
  1146. tip_delay_time:200,
  1147. tip_fade_speed:300
  1148. }
  1149. );
  1150. });
  1151. })(jQuery);
  1152.  
  1153.  
  1154. // pop ups © neothm
  1155. $(function(){
  1156. $("#navi").click(function(){ //on click on a navigation link
  1157.  
  1158. //if you have other “regular” links in your navigation they won’t work anymore
  1159. //in this case, change “nav a” to “#askbox, #navigation, #archive”
  1160.  
  1161. id = $(this).attr("id"); //retrieves the link’s name
  1162. $(".popup."+id).fadeIn(); //opens the appropriate popup
  1163. });
  1164. $("a.close").click(function(){
  1165. $(".popup").fadeOut(); //closes the popup
  1166. });
  1167. });
  1168. </script>
  1169. </body>
  1170.  
  1171. <!-- layout by noveia / bravethemes --><div id="01" class="popup_block">
  1172. your popup stuff goes here
  1173. </div></div><!-- layout by noveia / bravethemes -->
  1174.  
  1175. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement