Advertisement
krphappyplace

aishiteru

Jan 31st, 2016
262
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 16.37 KB | None | 0 0
  1. <html>
  2. <head>
  3.  
  4. <title>{title}</title>
  5.     <link rel="shortcut icon" href="{favicon}">
  6.    
  7. <!---------
  8. ᴄᴏᴅᴇs ʙᴇʟᴏɴɢ ᴛᴏ krphappyplace.
  9.         ᴅᴏ ɴᴏᴛ ʀᴇᴅɪsᴛʀɪʙᴜᴛᴇ.
  10.         ᴅᴏ ɴᴏᴛ ᴄʟᴀɪᴍ ᴀs ʏᴏᴜʀ ᴏᴡɴ ᴡᴏʀᴋ.
  11.         ᴅᴏ ɴᴏᴛ ʀᴇᴍᴏᴠᴇ ᴀɴʏ ᴄʀᴇᴅɪᴛ ᴀᴅᴅᴇᴅ ʙʏ ᴍᴇ.
  12.         ᴅᴏ ɴᴏᴛ ᴜsᴇ ᴍʏ ᴄᴏᴅᴇs ᴀs ᴀ ʙᴀsᴇ ᴡɪᴛʜᴏᴜᴛ ᴘᴇʀᴍɪssɪᴏɴ.
  13. ---------->    
  14.  
  15. <script type="text/javascript"
  16. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  17. <script>
  18. $(document).ready(function() {
  19.     //
  20. //When you click on a link with class of poplight and the href starts with a #
  21. $('a.poplight[href^=#]').click(function() {
  22.     var popID = $(this).attr('rel'); //Get Popup Name
  23.     var popURL = $(this).attr('href'); //Get Popup href to define size
  24.     //Pull Query & Variables from href URL
  25.    var query= popURL.split('?');
  26.     var dim= query[1].split('&');
  27.     var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  28.  
  29.     //Fade in the Popup and add close button
  30.     $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('');
  31.     //Define margin for center alignment (vertical   horizontal) - we add 80px to the height/width to accomodate for the padding  and border width defined in the css
  32.     var popMargTop = ($('#' + popID).height() + 80) / 2;
  33.     var popMargLeft = ($('#' + popID).width() + 80) / 2;
  34.  
  35.     //Apply Margin to Popup
  36.     $('#' + popID).css({
  37.         'margin-top' : -popMargTop,
  38.         'margin-left' : -popMargLeft
  39.     });
  40.  
  41.     //Fade in Background
  42.     $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
  43.     $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies
  44.     return false;
  45. });
  46.  
  47. //Close Popups and Fade Layer
  48. $('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
  49.     $('#fade , .popup_block').fadeOut(function() {
  50.         $('#fade, a.close').remove();  //fade them both out
  51.     });
  52.     return false;
  53. });
  54. });
  55. </script>
  56.  
  57. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  58. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  59. <script>
  60. (function($){
  61. $(document).ready(function(){
  62. $("[title],a[title],img[title]").style_my_tooltips({
  63.     tip_follows_cursor:true,
  64.     tip_delay_time:100,
  65.     tip_fade_speed:300,
  66.     attribute:"title"
  67. });
  68. });
  69. })(jQuery);
  70. </script>
  71.  
  72. <!---- ** meta tags ** ---->
  73.  
  74. <meta name="text:yourURL" content="put your url here: ex. krphappyplace">
  75.    
  76. <meta name="color:background" content="#fefefe">
  77. <meta name="color:posts" content="#fff">
  78. <meta name="color:font" content="#555">
  79. <meta name="color:blockquote" content="#333">
  80.  
  81. <meta name="select:font" content="calibri" title="calibri">
  82. <meta name="select:font" content="consolas" title="consolas">
  83. <meta name="select:font" content="courier" title="courier">
  84.  
  85.  
  86. <meta name="text:biography link" content="biography link">
  87.  
  88.  
  89.  
  90. <meta name="text:link 1 url" content="link one url">
  91. <meta name="text:link 1 title" content="link one title">
  92.  
  93. <meta name="text:link 2 url" content="link two url">
  94. <meta name="text:link 2 title" content="link two title">
  95.  
  96. <meta name="text:link 3 url" content="link three url">
  97. <meta name="text:link 3 title" content="link three title">
  98.  
  99. <meta name="text:link 4 url" content="link four url">
  100. <meta name="text:link 4 title" content="link four title">
  101.  
  102. <meta name="text:link 5 url" content="link five url">
  103. <meta name="text:link 5 title" content="link five title">
  104.    
  105. <meta name="text:link 6 url" content="link six url">
  106. <meta name="text:link 6 title" content="link six title">
  107.    
  108.  
  109.  
  110. <style type="text/css">
  111. #s-m-t-tooltip { max-width:250px; margin-top:25px; margin-left:15px; padding: 10px; text-transform: uppercase; font-style: italic; font-size: 8px; font-family: {select:font}; background-color: #fff; border: solid 1px #f0f0f0; color: #666; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; z-index: 9999999999;}
  112.  
  113. ::-webkit-scrollbar-thumb{ background-color: #fff; border: solid 1px #eee; padding: 1px; height:auto;}
  114. ::-webkit-scrollbar { height:auto; width:10px; background-color: #f9f9f9; }
  115.  
  116. ::selection { background: #000; color: #fff;}
  117. ::-moz-selection {background: #000; color: #fff;}
  118. ::-webkit-selection { background: #000; color: #fff; }
  119.  
  120. iframe#tumblr_controls { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%); opacity:.2;transition: .8s ease-in-out; -webkit-transition: .8s ease-in-out;-moz-transition: .8s ease-in-out;-o-transition: .8s ease-in-out; }
  121. iframe#tumblr_controls:hover { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%); opacity:1; }
  122.  
  123. body { background-color: {color:background}; overflow: auto; overflow-x: hidden; margin: 0px; font-family: {select:font}; font-size: 9px; color: {color:font}; cursor: crosshair;}
  124.  
  125. a {color: #666; text-decoration: none; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  126. a:hover{ color: #000; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  127.  
  128. h1 { color:#444; font-size: 10px; text-transform: uppercase; font-weight: 700;  margin: 1px;}
  129. h2 { color:#888; font-size: 9px; text-transform: uppercase; font-weight: 400; margin: 1px;}
  130. p, small, sub { font-family: {select:font}; font-size: inherit;}
  131. pre { font-family: {select:font}; white-space: pre-wrap; padding: 10px; line-height: 10px; display: block; background-color: #fafafa; text-align: center;}
  132. blockquote { margin: 0px; margin-left: 10px; padding-left: 5px; border-left: solid 1px #f0f0f0; text-align: justify; font-size: 8px; font-color: {color:blockquote};}
  133.  
  134. #sidebar { position: fixed; top: 0%; left: 0%; margin-top: 50px; margin-left: 430px; width: 150px; height: auto; padding: 0px; background-color: #fff; border: solid 1px #f0f0f0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; z-index: 3; }
  135. #sidebar_link { margin: 0px; }
  136. #sidebar_link a { font-size: 8px; letter-spacing: 2px; text-transform: uppercase; color: {color:font}; background-color: transparent; padding: 5px; display: block; margin-left: 0px; border-top: solid 1px #f0f0f0; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  137. #sidebar_link a:hover { color: #000; letter-spacing: 3px; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  138. #sidebar h1 { font-size: 8px; letter-spacing: 2px; text-align: center; text-transform: uppercase; color: {color:font}; background-color: transparent; padding: 5px; display: block; margin-left: 0px; border-bottom: solid 1px #f0f0f0;}
  139. #sidebar_description { padding: 5px; }
  140.  
  141. #sidebar_explore { height: 10px; font-size: 8px; letter-spacing: 2px; text-transform: uppercase; color: {color:font}; background-color: transparent; padding: 5px; display: block; margin-left: 0px; overflow: hidden; border-top: solid 1px #f0f0f0; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  142. #sidebar_explore:hover { height: 130px; color: #000; letter-spacing: 3px; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  143. #explore_links { margin: 0px; margin-top: 5px;}
  144. #explore_links a { padding: 5px; font-size: 7px; letter-spacing: 1px; text-align: left; display: block; border-bottom: solid 1px #f8f8f8; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  145. #explore_links a:hover { color: #000; background-color: #fafafa; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  146.  
  147. #container { width: 280px; height: 100%; top: 0%; left: 0%; margin-top: 10px; margin-left: 110px; position: relative; overflow-x: hidden; z-index: 2; }
  148. .post { width: 250px; margin-top: 10px; margin-bottom: 0px; margin-left: 0px; background-color: {color:posts}; padding:10px; text-align: justify; position: relative; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: solid 1px #f0f0f0; z-index: 4;}
  149. .post blockquote {max-width: 100%;}
  150. .post caption, .post li, { max-width: 100%;}
  151. .post img { max-width: 100%; height: auto;}
  152. .post li {list-style: square;}
  153.  
  154. .convo { list-style-type: none; }
  155. .convo li{ list-style-type: none;}
  156. .convo ul{ list-style-type: none; }
  157. .convo .label { text-transform: none; font-style: bold; list-style-type: none; }
  158.  
  159. .line_odd { background-color: #fff; padding: 3px; text-align: justify; list-style-type: none; margin-top: 2.5px; margin-bottom: 2.5;}
  160. .line_even { margin-top: 2.5px; margin-bottom: 2.5px; background-color: #fff; padding: 3px; text-align: justify; list-style-type: none; }
  161.  
  162. #portrait { float: left; margin-top: 12px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;}
  163. #portrait img { -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
  164.     .bubble { background: #fafafa; margin:3px 0px 5px 30px; padding:10px; position: relative;}
  165.     .bubble p {margin:1px 0px;}
  166.     .bubble span {display: inline-block; position:absolute; width:1px;height:1px; font-size: 0;line-height: 1px; left:-10px; top:10px; border-top:7px solid transparent; border-bottom:7px solid transparent; border-right:10px solid #fafafa; float: left;}
  167.     .bubble a { border-bottom: solid 1px #888; text-transform: uppercase; color: #333; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  168.     .bubble a:hover { color: #000; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  169.  
  170. #etc {background-color: transparent; font-size: 7px; color: #555; padding: 10px; text-decoration: none; text-transform: uppercase; text-align: left; margin-bottom: 50px;}
  171. #etc a {font-size: 7px; color: #555; text-decoration: none; text-transform: uppercase; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; }
  172. #etc a:hover { color: #000; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;}
  173.  
  174.    
  175. .quote { color:#444; font-size: 10px; text-transform: uppercase; font-weight: 700; text-align: justify; margin: 1px;}
  176.  
  177. .audioplayer { width: 26px; height: 26px; opacity: 0.5; overflow: hidden;}
  178. .audio { float: left; width: 26px; height: 26px; background-color: #fafafa;}
  179. .audioinfo { margin-left: 31px; height: 26px; padding: 5px; overflow: hidden; width:200px; }
  180.  
  181. #fade {
  182.     display: none;
  183.     background: #111;
  184.     position: fixed;
  185.     left: 0;
  186.     top: 0;
  187.     width: 100%;
  188.     height: 100%;
  189.     opacity: 0.8;
  190.     z-index: 9999;
  191. }
  192.  
  193. .popup_block{
  194.     display: none;
  195.     background: transparent;
  196.     padding: 20px;
  197.     float: left;
  198.     position: fixed;
  199.     top: 50%;
  200.     left: 50%;
  201.     z-index: 99999;
  202. }
  203.  
  204. *html #fade {position: absolute;}
  205. *html .popup_block { position: absolute;}
  206.  
  207. ol.notes { list-style: none; font-size: 7px; color: #555; text-align: justify; text-transform: uppercase; margin-left: -40px;}
  208. ol.notes li.note { border-top: solid 1px #fafafa; background-color: #fff; padding: 10px;}
  209. ol.notes li.note img.avatar { vertical-align: -4px; margin-right: 10px; width: 16px; height: 16px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;}
  210. ol.notes li.note span.action {font-weight: 100;}
  211. ol.notes li.note .answer_content { font-weight: normal;}
  212. ol.notes li.note blockquote { padding: 4px 10px; margin: 0px;}
  213. ol.notes li.note blockquote a {text-decoration: none;}
  214.  
  215. .crdt {position: fixed; bottom: 0%; right: 0%; margin-bottom:35px; margin-right:15px; padding: 5px; height: auto; width: auto; background-color: transparent; overflow: hidden; z-index: 99999;}
  216.  
  217. </style>
  218. </head>
  219.  
  220.  
  221. <body>
  222.  
  223. <div id="sidebar">
  224. <h1>{title}</h1>
  225. <div id="sidebar_description">
  226. {description}
  227. </div>
  228. <div id="sidebar_link">
  229. <a href="/"><img src="http://static.tumblr.com/ap7kizz/C0Qnyl94d/home-outline.png" style="float: left; padding-right: 5px; height: 10px;">home</a>
  230. <a href="#?w=500" rel="asking" class="poplight"><img src="http://static.tumblr.com/ap7kizz/lmVnyl94k/mail.png" style="float: left; padding-right: 5px; height: 10px;">message</a>
  231. <a href="{text:biography link}" rel="profile" class="poplight"><img src="http://static.tumblr.com/ap7kizz/01anyl94u/clipboard.png" style="float: left; padding-right: 5px; height: 10px;">profile</a>
  232. </div>
  233. <div id="sidebar_explore">
  234. <img src="http://static.tumblr.com/ap7kizz/mYynyl95k/cog-outline.png" style="float: left; padding-right: 5px; height: 10px;">explore
  235. <div id="explore_links">
  236. <a href="{text:link 1 url}">{text:link 1 title}</a>
  237. <a href="{text:link 2 url}">{text:link 2 title}</a>
  238. <a href="{text:link 3 url}">{text:link 3 title}</a>
  239. <a href="{text:link 4 url}">{text:link 4 title}</a>
  240. <a href="{text:link 5 url}">{text:link 5 title}</a>
  241. <a href="{text:link 6 url}">{text:link 6 title}</a>
  242. </div>
  243. </div>
  244. </div>
  245.  
  246. <div id="asking" class="popup_block">
  247. <iframe frameborder="0"
  248. height="200"
  249. id="ask_form"
  250. scrolling="no"
  251. src="http://www.tumblr.com/ask_form/{text:yourURL}.tumblr.com/"
  252. width="100%">  
  253. </iframe>
  254. </div>
  255.  
  256.  
  257.  
  258. <div ID="container">
  259.  
  260. {block:posts}
  261. <div class="post">
  262.  
  263. {block:Text}
  264. {block:Title}
  265. <h1>{Title}</h1>
  266. {/block:Title}
  267. {Body}
  268. {/block:Text}
  269.  
  270. <!--------
  271. ASK BUBBLE TUTORIAL FOUND AT TIPPING-TUTORIALS.TUMBLR.COM
  272. -------->
  273. {block:Answer}<div id="portrait"><img src="{AskerPortraitURL-16}"></div><div class="bubble"><span></span>{Asker}: {Question}&nbsp;</div>{Answer}{/block:Answer}
  274.  
  275. {block:Quote}
  276. <div class="quote">
  277. {Quote}
  278. <p style="font-size: 7px; text-align: center; border-top: solid 1px #f0f0f0; width: 270px; margin-left: -11px; padding-top: 5px; padding-bottom: -10px;">{source}</p>
  279. </div>
  280. {/block:Quote}
  281.  
  282. {block:Link}
  283. <a href="{URL}">{Name}</a>
  284. {block:Description}
  285. {Description}
  286. {/block:Description}    
  287. {/block:Link}
  288.  
  289. {block:Chat}
  290. {block:title}
  291. <h1>{Title}</h1>
  292. {/block:Title}
  293. <div class="convo">
  294. {block:Lines}
  295. <li class="line_{Alt}">
  296. {block:Label}
  297. <span class="label">{Label}</span>
  298. {/block:Label}
  299. {Line}</li>
  300. {/block:Lines}
  301. </div>
  302. {/block:Chat}
  303.  
  304. {block:Photo}
  305. <img src="{PhotoURL-250}">
  306. {block:Caption}
  307. {Caption}
  308. {/block:Caption}
  309. {/block:Photo}
  310.  
  311. {block:Photoset}
  312. {Photoset}
  313. {block:Caption}
  314. {Caption}
  315. {/block:Caption}
  316. {/block:Photoset}
  317.  
  318. {block:Panorama}
  319. {LinkOpenTag}
  320. <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" />
  321. {LinkCloseTag}
  322. {block:Caption}
  323. {Caption}
  324. {/block:Caption}
  325. {/block:Panorama}
  326.  
  327. {block:Video}
  328. <center>
  329. {Video-250}
  330. </center>
  331. {block:ifShowCaptionsOnIndex}
  332. {block:Caption}
  333. {Caption}
  334. {/block:Caption}
  335. {/block:ifShowCaptionsOnIndex}
  336. {block:Caption}
  337. {Caption}
  338. {/block:Caption}
  339. {/block:Video}
  340.  
  341.  
  342. {block:Audio}
  343. <div class="audio"><center><div class="audioplayer">{AudioPlayerWhite}</div></center></div>
  344. <div class="audioinfo">
  345. {block:TrackName}<b>{TrackName}</b>{/block:TrackName}
  346. {block:Artist}<i>{Artist}</i>{/block:Artist} <br>
  347. {block:PlayCount}{FormattedPlayCount} plays{/block:PlayCount}
  348. </div>
  349. {block:permalinkpage}
  350. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:permalinkpage}
  351. {/block:Audio}
  352.  
  353.  
  354.  
  355. </div>
  356.  
  357. <div id="etc">
  358. <img src="http://static.tumblr.com/ap7kizz/ynynyl97q/tags.png" style="float: left; height: 9px;">
  359. {block:Date}
  360. <a href="{permalink}" title="{TimeAgo}"><strong>{DayOfWeek}</strong></a>  
  361. {/block:Date}
  362. {block:NoteCount}
  363. <a href="{permalink}"><strong>{NoteCount} N</strong></a>
  364. {/block:NoteCount}
  365. <a href="{ReblogURL}"><strong>reblog</strong></a>
  366. {block:permalinkpage}
  367. {block:ContentSource}
  368. <a href="{SourceURL}"><strong>source</strong></a>  
  369. {/block:ContentSource}
  370. {block:RebloggedFrom}
  371. <a href="{ReblogParentURL}"><strong>via</strong></a>
  372. {/block:RebloggedFrom}
  373. {/block:permalinkpage}
  374. <br>
  375.     {block:HasTags}{block:Tags}
  376. #<a href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}
  377. </div>
  378.  
  379.  
  380. {block:PostNotes}
  381. {PostNotes}
  382. {/block:PostNotes}
  383.  
  384.  
  385. {/block:Posts}
  386.  
  387.  
  388. {block:Pagination}
  389. <p style="padding: 10px; text-align: center;">
  390. {block:PreviousPage}<a href="{PreviousPage}">previous</a>{/block:PreviousPage}
  391. {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}</p>
  392. {/block:Pagination}
  393.  
  394.  
  395. </div>
  396. </div>
  397.  
  398. <div class="crdt">
  399. <a href="http://krphappyplace.tumblr.com/" title="made with love"><img src="http://38.media.tumblr.com/tumblr_mexmflLMdS1r52dl9.gif"></a>
  400. </div>
  401.  
  402.  
  403. </body>
  404. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement