Advertisement
fakehelper

Idle Worship - Dark + Links

Jun 10th, 2019 (edited)
128
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.75 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <!--
  5.  
  6. idle worship (gif pack page #1) by fakehelper
  7.  
  8. credits
  9. - google fonts
  10. - honeybee font by suiomi
  11. - rhesmanisa by dharmas (hosted by me)
  12. - gradient background by shudesigns
  13. - pop-up tutorial by billiondays
  14. - tumblr controls by cyantists
  15.  
  16. #ffcece is the pink color, ctrl+f to change all pink to whatever color you want!
  17.  
  18. #ffcece,#dbc5e0,#ceecff is the gradient, so just change it to the three colors you like instead.
  19.  
  20. -->
  21.  
  22. <title>{Title}</title>
  23. <link rel="shortcut icon" href="{Favicon}">
  24.  
  25. <link href="https://static.tumblr.com/51fnf0s/BCoprzst5/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  26. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  27. <script src="https://static.tumblr.com/51fnf0s/lKGprzsse/jquery.style-my-tooltips.js"></script>
  28. <script>
  29. (function($){
  30. $(document).ready(function(){
  31. $("[title]").style_my_tooltips({
  32. tip_follows_cursor:true,
  33. tip_delay_time:300,
  34. tip_fade_speed:300,
  35. attribute:"title"
  36. });
  37. });
  38. })(jQuery);
  39. </script>
  40.  
  41. <!--- pop up --->
  42. <script type="text/javascript" src="https://static.tumblr.com/iuggpng/bGqm4yfv9/jquery-1.7.2.js"></script>
  43. <script type="text/javascript"
  44. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  45. <script>
  46. $(document).ready(function() {
  47. //
  48. $('a.poplight[href^=#]').click(function() {
  49. var popID = $(this).attr('rel'); //Get Popup Name
  50. var popURL = $(this).attr('href'); //Get Popup href to define size
  51. var query= popURL.split('?');
  52. var dim= query[1].split('&');
  53. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  54. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('');
  55. var popMargTop = ($('#' + popID).height() + 80) / 2;
  56. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  57. //Apply Margin to Popup
  58. $('#' + popID).css({
  59. 'margin-top' : -popMargTop,
  60. 'margin-left' : -popMargLeft
  61. });
  62. $('body').append('<div id="fade"></div>');
  63. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  64. return false;
  65. });
  66. $('a.close, #fade').live('click', function() {
  67. $('#fade , .popup_block').fadeOut(function() {
  68. $('#fade, a.close').remove(); //fade them both out
  69. });
  70. return false;
  71. });
  72. });
  73. </script>
  74.  
  75.  
  76. <!--- fonts --->
  77. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  78.  
  79. <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Karla:400,700|Lato:400,700|Open+Sans:400,700|Roboto:400,700" />
  80.  
  81. <style type="text/css">
  82.  
  83. @font-face {font-family: 'rhesmanisaregular'; src: url('https://dl.dropboxusercontent.com/s/c7urv114bk2vm1n/rhesmanisa.ttf'); font-weight: normal; font-style: normal;} /*hosted by me */
  84.  
  85.  
  86. /* tumblr controls by cyantists */
  87. iframe.tmblr-iframe {
  88. z-index:99999999999999!important;
  89. top:0!important;
  90. right:0!important;
  91. opacity:0.4;
  92. /* delete invert(1) from here
  93. filter:invert(1) contrast(150%);
  94. -webkit-filter:invert(1) contrast(150%);
  95. -o-filter:invert(1) contrast(150%);
  96. -moz-filter:invert(1) contrast(150%);
  97. -ms-filter:invert(1) contrast(150%);
  98. /* to here if your blog has a dark background */
  99. transform:scale(0.65);
  100. transform-origin:100% 0;
  101. -webkit-transform:scale(0.65);
  102. -webkit-transform-origin:100% 0;
  103. -o-transform:scale(0.65);
  104. -o-transform-origin:100% 0;
  105. -moz-transform:scale(0.65);
  106. -moz-transform-origin:100% 0;
  107. -ms-transform:scale(0.65);
  108. -ms-transform-origin:100% 0;}
  109.  
  110. iframe.tmblr-iframe:hover {
  111. opacity:0.6!important;}
  112.  
  113. #s-m-t-tooltip{
  114. /* basic */
  115. max-width:300px;
  116. z-index:10;
  117. padding:5px;
  118. background:#222;
  119. font-family:'karla';
  120. font-size:11px;
  121. text-transform:uppercase;
  122. color:#fff;
  123. border:none;
  124. box-shadow:none;
  125. }
  126.  
  127. /* Scrollbar styles */
  128. ::-webkit-scrollbar {
  129. width: 5px;
  130. height: 5px;
  131. }
  132.  
  133. ::-webkit-scrollbar-track {
  134. border-radius: 5px;
  135. width: 2px;
  136. border: 1px dotted #000;
  137. background:#222;
  138. }
  139.  
  140. ::-webkit-scrollbar-thumb {
  141. background: #dbc5e0;
  142. border-radius: 10px;
  143. }
  144.  
  145. ::-webkit-scrollbar-thumb:hover {
  146. background: #fafafa;
  147. }
  148.  
  149.  
  150. body {
  151. color:#fff;
  152. background-color: #222;
  153. }
  154.  
  155. p {
  156. color:#fff;
  157. font-family:'karla';
  158. font-size:12px;}
  159.  
  160.  
  161. a {
  162. color:#dbc5e0;
  163. text-decoration:none;
  164. font-weight:bold;}
  165.  
  166. #treetop {
  167. top:-30px;
  168. padding-bottom:40px;
  169. width:100%;
  170. height:210px;
  171. text-align;center;
  172. position:relative;
  173. z-index:1;
  174. }
  175.  
  176. #treetop p {
  177. width:800px;
  178. }
  179.  
  180. #treetop h2 {
  181. font-family:'rhesmanisaregular';
  182. font-size:50px;
  183. font-weight:normal;
  184. margin-bottom:-26px;
  185. color:#dbc5e0;
  186. }
  187.  
  188. #trunk {
  189. margin-top:-150px;
  190. padding:10px;
  191. text-align;center;
  192. display:inline-block;
  193. position:relative;
  194. }
  195.  
  196. #trunk img {
  197. padding-right:4px;
  198. padding-bottom:2px;
  199. }
  200.  
  201. .branch {
  202. width:300px;
  203. height:25px;
  204. background: #000;
  205. background: -webkit-linear-gradient(left, #ffcece,#dbc5e0,#ceecff); /* change gradient here! on all of these guys tho bc they're for diff browsers */
  206. background: -o-linear-gradient(right, #ffcece,#dbc5e0,#ceecff);
  207. background: -moz-linear-gradient(right, #ffcece,#dbc5e0,#ceecff);
  208. background: linear-gradient(to right, #ffcece,#dbc5e0,#ceecff);
  209. transform: skew(-30deg);
  210. margin-bottom:20px;
  211.  
  212. }
  213.  
  214. .branch h3{
  215. color:#222;
  216. padding-top:2px;
  217. font-family:'karla';
  218. font-size:13px;
  219. line-height:20px;
  220. font-weight:bold;
  221. text-transform:uppercase;
  222. transform: skew(30deg);
  223.  
  224. }
  225.  
  226. .branch h3:before {
  227. content:'\e941';
  228. font-family:'honeybee';
  229. font-size:12px;
  230. line-height:12px;
  231. font-weight:normal;
  232. padding-right:10px;
  233.  
  234. }
  235.  
  236. #leaves{
  237. margin-top:-16px;
  238. width:300px;
  239. display:inline-block;
  240. padding-bottom:30px;
  241. }
  242.  
  243.  
  244. #leaves a:hover {
  245. color:#dbc5e0;
  246. -webkit-transition: color 1s ease-out;
  247. -moz-transition: color 1s ease-out;
  248. -o-transition: color 1s ease-out;
  249. transition: color 1s ease-out;
  250. }
  251.  
  252. #leaves a {
  253. color:#222;
  254. font-family:'honeybee';
  255. font-size:16px;
  256. padding-top:4px;
  257. width:26px;
  258. height:21px;
  259. background-color:#fafafa;
  260. border-radius:100%;
  261. text-align:center;
  262. z-index:2;
  263. display:inline-block;
  264. }
  265.  
  266. .credit {
  267. font:'honeybee';
  268. font-size:16px;
  269. bottom:6px;
  270. right:6px;
  271. position:fixed;
  272. z-index:111
  273. }
  274.  
  275. .credit a {
  276. color:#fafafa;
  277. opacity:0.2;
  278. }
  279.  
  280. .credit a:hover {
  281. color:#dbc5e0;
  282. -webkit-transition: all .3s;
  283. -moz-transition: all .3s;
  284. -o-transition: all .3s;
  285. -ms-transition: all .3s;
  286. transition: all .3s;
  287. opacity:1;
  288. }
  289.  
  290. #fade {
  291. display: none;
  292. background: #000;
  293. position: fixed; left: 0; top: 0;
  294. width: 100%; height: 100%;
  295. opacity: .80;
  296. z-index: 9999;
  297. }
  298. .popup_block{
  299. display: none;
  300. background: #000;
  301. background: -webkit-linear-gradient(left, #ffcece,#dbc5e0,#ceecff);
  302. background: -o-linear-gradient(right, #ffcece,#dbc5e0,#ceecff);
  303. background: -moz-linear-gradient(right, #ffcece,#dbc5e0,#ceecff);
  304. background: linear-gradient(to right, #ffcece,#dbc5e0,#ceecff);
  305. padding-top:0px;
  306. padding: 20px;
  307. border: none;
  308. float: left;
  309. position: fixed;
  310. top: 50%; left: 50%;
  311. z-index: 99999999999999999999999999999999;
  312. }
  313.  
  314. *html #fade {
  315. position: absolute;
  316. }
  317. *html .popup_block {
  318. position: absolute;
  319. }
  320.  
  321. #fruit {
  322. padding:0px;
  323. }
  324.  
  325. #fruit p {
  326. padding-left:20px;
  327. color:#222;
  328. font-family:'karla';
  329. font-size:12px;
  330. line-height:20px;
  331. }
  332.  
  333. #fruit img {
  334. padding-left:0px;
  335. padding-right:14px;
  336. float:left;
  337. width:245px;
  338. display:inline-block;
  339. }
  340.  
  341. #fruit b {
  342. color:#fafafa;
  343. font-weight:bold;
  344. }
  345.  
  346. #fruit h5 {
  347. color: #fafafa;
  348. font-family:'karla';
  349. font-size: 11px;
  350. font-weight:bold;
  351. text-align: center;
  352. text-transform: uppercase
  353. }
  354.  
  355. .twig {
  356. margin-left:10px; /* change to margin-left:140px; if removing the image! */
  357. width:220px;
  358. height:25px;
  359. color:#222;
  360. background-color:#fff;
  361. transform: skew(-30deg);
  362. margin-bottom:20px;
  363. position:fixed;
  364. display:inline-block;
  365. }
  366.  
  367.  
  368. .twig h4{
  369. color:#222;
  370. margin-top:3px;
  371. font-family:'karla';
  372. font-size:13px;
  373. line-height:20px;
  374. font-weight:bold;
  375. text-transform:uppercase;
  376. text-align:center;
  377. transform: skew(30deg);
  378.  
  379. }
  380.  
  381. .twig h4:before {
  382. content:'\ea13'; /* change honeybee icon here for pop up title */
  383. font-family:'honeybee';
  384. font-size:12px;
  385. line-height:12px;
  386. font-weight:normal;
  387. padding-right:10px;
  388.  
  389. }
  390.  
  391. </style>
  392. </head>
  393. <body>
  394.  
  395. <div id="treetop">
  396. <center><h2>Faceclaim in Source</h2>
  397. <p>Do not repost, remove my watermark, claim as your own, edit in any way, or include in gif hunts.<br>Please like <a href="#">this post</a> if using or saving any gifs. Trigger warnings are in the pop up link below.</p>
  398. <div id="leaves">
  399.  
  400. <a href="#?w=500" rel="01" class="poplight" title="fc info + trigger warnings"><span class="th th-power-o"></span></a>&nbsp<!--link to the pop-up! delete if u don't need it-->
  401. <a class="th th-plus-1-o" title="all (FC NAME) packs" href="https://yoururl.tumblr.com/tagged/(FC NAME)"></a>&nbsp<!--link to all packs of that fc-->
  402. <a class="th th-cloud-2-o" title="download this pack" href="#"></a>&nbsp<!--link to download if u do that-->
  403. <a class="th th-reblog" title="like or reblog the post" href="#"></a>&nbsp<!--link the original post-->
  404. <a class="th th-heart-1-o" title="tip jar" href="#"></a><!--your kofi or paypal idk get that paper tbh--->
  405.  
  406. </div></div>
  407.  
  408. <div id="trunk"><center>
  409. <div class="branch"><h3>FOOTAGE (SEASON/EPS/YEAR): ### gifs</h3></div>
  410. <p>
  411.  
  412. [ COPY PASTE UR IMG URLS HERE ]
  413.  
  414. </p>
  415.  
  416. <div class="branch"><h3>FOOTAGE (SEASON/EPS/YEAR): ### gifs</h3></div>
  417. <p>
  418.  
  419. [ COPY PASTE UR IMG URLS HERE ]
  420.  
  421. </p>
  422.  
  423.  
  424. </center>
  425. </div>
  426. <div class="credit"><a class="th th-leaf-1-o" title="page theme by fakehelper" href="https://fakehelper.tumblr.com/"></a></div>
  427.  
  428. <div id="01" class="popup_block">
  429. <div class="pops" style="margin-top:-10px">
  430. <div id="fruit">
  431. <img src="https://via.placeholder.com/245x180">
  432. <div class="twig"><h4>FC INFORMATION</h4></div>
  433. <h5 style="padding-top:40px">TRIGGER WARNINGS: you can get about three lines worth of trigger warnings in here omg </h5>
  434. <p>
  435. <b>Name:</b> FC<br>
  436. <b>Gender:</b> Gender<br>
  437. <b>Ethnicity:</b> Ethnicity<br>
  438. <b>Birth Year:</b> Year
  439. </p>
  440.  
  441. </div>
  442. </div></div>
  443.  
  444. </div></div></div></div></div></div></div></div></div></div>
  445. </body>
  446. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement