Advertisement
lakeffectkdss

clairvoyant/rebeca, theme 001

Apr 13th, 2016
921
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.57 KB | None | 0 0
  1. <!--
  2. CLAIRVOYANT ; theme 001 by lakeffectkds
  3. this theme was inspired by the cutest lil' (she's legit 4' 11'') venezuelan babe, aka bec or @destinatiia.
  4. base code credit goes to meroku, the ask base goes to shayofrp, and the pop-up code belongs to str-wrs.
  5.  
  6. RULES ; 01- do not steal bits and pieces of this code for your own.
  7. 02- do not edit this theme and claim it as your own or use it as a base code without my permission.
  8. 03- do not redistribute this theme as yours.
  9. 04- feel free to edit it as much as you want for personal use! feel free to show me any changes to make to it, i'll be more than happy to take a look!
  10. 05- actually, just feel free to hmu if you're using the theme, it's the best thing to see people liking it and using it on their blogs.
  11. -->
  12.  
  13. <html>
  14. <head>
  15.  
  16. <script type="text/javascript"
  17. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  18. <script>
  19. $(document).ready(function() {
  20. //
  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. var query= popURL.split('?');
  25. var dim= query[1].split('&');
  26. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  27. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  28. var popMargTop = ($('#' + popID).height() + 80) / 2;
  29. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  30. //Apply Margin to Popup
  31. $('#' + popID).css({
  32. 'margin-top' : -popMargTop,
  33. 'margin-left' : -popMargLeft
  34. });
  35. $('body').append('<div id="fade"></div>');
  36. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  37. return false;
  38. });
  39. $('a.close, #fade').live('click', function() {
  40. $('#fade , .popup_block').fadeOut(function() {
  41. $('#fade, a.close').remove(); //fade them both out
  42. });
  43. return false;
  44. });
  45. });
  46. </script>
  47.  
  48. <script src="https://use.fonticons.com/fc066471.js"></script>
  49.  
  50.  
  51.  
  52.  
  53. <link rel="shortcut icon" href="{Favicon}" />
  54. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  55. <title>{Title}</title>
  56. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  57.  
  58.  
  59. <meta name="color:background" content="#ffffff">
  60. <meta name="color:Scrollbar" content="#DDD"/>
  61. <meta name="color:text" content="#c0bdb8" />
  62. <meta name="color:link hover" content="#fdfdfd" />
  63.  
  64. <meta name="color:sbar border" content="#fdfdfd" />
  65.  
  66. <meta name="color:post bg" content="#fdfdfd" />
  67.  
  68. <meta name="color:shadow" content="#fdfdfd" />
  69. <meta name="color:borders" content="#fdfdfd" />
  70.  
  71. <meta name="color:nav box" content="#fdfdfd" />
  72. <meta name="color:link" content="#c0bdb8" />
  73. <meta name="color:Bold" content="#777777" />
  74. <meta name="color:Italic" content="#bbbbbb"/>
  75.  
  76. <meta name="color:bold shadow" content="#777777" />
  77. <meta name="color:Italic" content="#bbbbbb"/>
  78.  
  79. <meta name="image:sidebar 1" content=""/>
  80. <meta name="image:sidebar 2" content=""/>
  81. <meta name="image:sidebar 3" content=""/>
  82. <meta name="image:sidebar 4" content=""/>
  83. <meta name="image:background image" content=""/>
  84.  
  85.  
  86. <meta name="image:nav pic 1" content=""/>
  87. <meta name="image:nav pic 2" content=""/>
  88.  
  89.  
  90. <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
  91.  
  92. </head>
  93.  
  94.  
  95. <style type="text/css">
  96.  
  97. #ask {
  98. color:{color:text};
  99. padding:5px;
  100. font-family:'arial';
  101. font-size:10px;
  102. letter-spacing:0px;
  103. text-align:left;
  104. text-transform:lowercase;
  105. line-height:150%;
  106. background-color:{color:sbar border};
  107.  
  108. box-shadow: 0px 3px 0px {color:link};
  109. }
  110.  
  111. #ask a{color:{color:link};}
  112.  
  113.  
  114. -transition-duration:1s;
  115. }
  116.  
  117.  
  118. .cover {position: relative; z-index: 1}
  119.  
  120.  
  121. .boxed {
  122. background: {color:nav box} ;
  123. box-shadow: 1px 1px 6px {color:shadow};
  124. }
  125. .popup_block{
  126. display:none;
  127. background:{color:post bg};
  128. padding:20px;
  129. border:1px solid #eee; /* if you want a solid white pop-up, delete this */
  130. float:left;
  131. position:fixed;
  132. top:50%;left:50%;
  133. z-index: 99999;
  134. }
  135.  
  136.  
  137. *html #fade {position: absolute;}
  138. *html .popup_block {position: absolute;}
  139. #fade {
  140. display:none;
  141. position:fixed;
  142. left:0px;
  143. top:0px;
  144. width:100%;
  145. height:100%;
  146. z-index:9999;
  147. background:#000; /* change to #fff for solid white */
  148. opacity:0.5; /* change to opacity:1; */
  149. }
  150.  
  151. ::-webkit-scrollbar-thumb:vertical {background-color: {color:Scrollbar}; height:auto; border: 0px solid #000; border-radius:6px;}
  152. ::-webkit-scrollbar-thumb:horizontal {background-color: #565758; height:10px !important;}
  153. ::-webkit-scrollbar {height:7px; width:3px ; background-color:{color:background};}
  154.  
  155.  
  156.  
  157. body {color:{color:text}; background-color:{color:background}; font-family:arial; font-size:11px; line-height:13px; text-align:justify;
  158. background-image:url('{image:background image}'); background-position:center;}
  159.  
  160. a:link, a:active, a:visited{color: {color:link}; text-decoration:none; font-family: 'montserrat';}
  161.  
  162. a:hover {
  163. color:{color:link hover};-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; }
  164.  
  165. small{font-size:auto}
  166.  
  167. big{font-size:auto; font-family: 'Montserrat', sans-serif;}
  168.  
  169. b, strong{color:{color:bold}; text-shadow: 0px 0px 4px {color:bold shadow};font-family: 'Montserrat', sans-serif;}
  170.  
  171. h1 {font-size:20px; font-family: 'Montserrat', sans-serif; text-shadow: 1px 1px 1px 1px color: {color:shadow};}
  172. h2 {font-size:15px; font-family: 'Montserrat', sans-serif; COLOR: {color:Bold} ; text-shadow: 1px 1px 1px 1px color: {color:shadow};}
  173.  
  174. h3 {font-size:13px; font-family: 'Montserrat', sans-serif;; text-shadow: 1px 1px 1px 1px color: {color:shadow};}
  175.  
  176. i, em {color:{color:italic}}
  177.  
  178. p{margin-top:6px; margin-bottom:6px}
  179.  
  180. blockquote {padding:0px; padding-left:10px; margin:8px; border-left:2px solid {color:text}}
  181.  
  182. img a{border:none; width:100%;}
  183.  
  184. /*box thingy*/
  185. #foo {
  186. POSITION: absolute;
  187. float: LEFT;
  188. width: 800px;
  189. height: 560px;
  190. margin-left: 100px;
  191. margin-top: -40px;
  192. opacity:0.2;
  193. color:#000;
  194. z-index:-1;
  195.  
  196. }
  197.  
  198. #nav {
  199. POSITION: absolute;
  200. float: center;
  201. width: 190px;
  202. height: 50px;
  203. margin-left: 460px;
  204. margin-top: 460px;
  205. text-align:center;
  206. background-color:{color:post bg};
  207.  
  208. }
  209.  
  210.  
  211.  
  212. #entries {margin-left:400px; max-height:500px; height: 450px; width: 450px;text-align: justify; margin-top:100px; overflow:auto;}
  213.  
  214.  
  215.  
  216. #posts {
  217. width:400px;
  218. float: center;
  219. margin: 15px 15px 15px 13px;
  220. box-shadow: 1px 1px 5px {color:Links};
  221. padding:10px;
  222. margin-top:10px;
  223. border:1px solid {color:Borders};
  224. Z-INDEX:99999999999999999999999999;
  225. background-color:{color:post bg};
  226.  
  227.  
  228. }
  229.  
  230. #posts img {max-width:10 0%;}
  231.  
  232. #sidebar{ position:fixed; width:200px; background:{color:post bg}; padding:7px; overflow:hidden;left:150px; top:140px;
  233. ;
  234. }
  235.  
  236.  
  237.  
  238.  
  239. #pagination {font-family:arial; text-align:center; font-size:24px; margin-bottom:2px;}
  240.  
  241.  
  242.  
  243. #info{height:auto ;padding-top:5px; display:block; padding-bottom:0px; width:auto; font-size:10px; font-family:arial; text-transform:uppercase;border-top:1px solid {color:Borders}; text-align:left; }
  244.  
  245.  
  246.  
  247. .audioplayer{background-color:{color:link}; display:block: border-radius: 20px;}
  248.  
  249. .user_1 .label {color:{color:link}; font-weight:bold}
  250. .user_2 .label {color:{color:link}; font-weight:bold}
  251. .user_3 .label {color:{color:link}; font-weight:bold}
  252.  
  253.  
  254.  
  255.  
  256.  
  257. </style>
  258.  
  259.  
  260. </style>
  261.  
  262. <!-- this is the area where everything comes to life and you have to code all the stuff you stylized. so i already got you like 10% started. or something, maybe more. i was never good at math anyway. -->
  263.  
  264. <body>
  265. <div id="foo" style="background-color:#fff;"></div>
  266.  
  267.  
  268.  
  269.  
  270. <div id="sidebar">
  271.  
  272. <img src="{image:sidebar 1}" style="width :75px;position:inline;
  273. box-shadow: 3px 3px 0px {color:link}; margin-left: 10px; border: 5px solid {color:sbar border};">
  274. <img src="{image:sidebar 2}" style="width :75px;position:inline;
  275. box-shadow: 3px 3px 0px {color:link};margin-left: 10px; border: 5px solid {color:sbar border}"><p>
  276. <img src="{image:sidebar 3}" style="width :75px;position:inline;
  277. box-shadow: 3px 3px 0px {color:link}; margin-left:10px; border: 5px solid {color:sbar border}">
  278. <img src="{image:sidebar 4}" style="width :75px;position:inline;
  279. box-shadow: 3px 3px 0px {color:link};margin-left: 10px; border: 5px solid {color:sbar border}"></a>
  280.  
  281. {description}<p>
  282. <div id="pagination">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}"><small><small>before</small></small></a>{/block:PreviousPage}<small><small> / </small></small>{block:NextPage}<a href="{NextPage}"><small><small>after</small></small></a><br />{/block:NextPage}{/block:Pagination}</div>
  283. </div>
  284. </center>
  285. <div id= nav style="text-align:center ;"><p>
  286. <a href="/"><i class="fa fa-spinner fa-3x fa-fw fa-spin" style=" text-shadow: 1px 1px 1px {color:link}"></i></a>
  287. <a href="/ask"><i class="fa fa-envelope fa-3x fa-fw"style=" text-shadow: 1px 1px 1px {color:link}"></i></a>
  288. <a href="#?w=150" rel="box1" class="poplight"><i class="fa fa-bars fa-3x fa-fw"style=" text-shadow: 1px 1px 1px {color:link}"></i></a><a href="http://lakeffectkds.tumblr.com/" title="coded by alex"><i class="fa fa-hand-peace-o fa-3x fa-fw "style=" text-shadow: 1px 1px 1px {color:link}"></i></a>
  289.  
  290.  
  291.  
  292.  
  293. </div>
  294.  
  295.  
  296. <div id="entries" style="background-color:#fff; margin-top:80px;">
  297. {block:posts}
  298. <div id="posts">
  299.  
  300. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  301.  
  302.  
  303. {block:Quote}<h1><span class="fa fa-quote-left fa-3x pull-left"> </span> {Quote} </h1><p> <TEXT-ALIGN:"right";>— {Source}<br>{/block:Quote}
  304.  
  305. {block:Link}<a href="{URL}"><h1>{Name}</h1></a>
  306. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  307.  
  308. {block:Photo}<center><img src="{PhotoURL-400}"/></center>
  309. {/block:Photo}
  310.  
  311. {block:Photoset}<center>{Photoset-400}</center>
  312. {/block:Photoset}
  313.  
  314. {block:Chat}<ul class="chat">{block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>{/block:Chat}
  315.  
  316.  
  317.  
  318. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  319.  
  320. {block:Answer}<div id="ask"><span class="fa fa-quote-left fa-3x pull-left"> </span><h3><b>{Asker} whispered: </b>{Question}</h3></div>{Answer}{/block:Answer}
  321.  
  322.  
  323.  
  324. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerwHITE}{/block:AudioPlayer}</div></div>
  325.  
  326. {block:Caption}{Caption}{/block:Caption}
  327.  
  328. <center><div id="info">{block:Date}<a href="{Permalink}"> <a href="{ReblogURL}" target="_blank" class="details"> <b><span class= "fa fa-refresh"></span> reblog </b></a> / <a href="{Permalink}"> posted {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {12Hour}:{Minutes}{AmPm}</a{/block:Date}<i class= "fa fa-calendar " ></i>{block:RebloggedFrom} ( <a href="{ReblogParentURL}">Via</a>{/block:RebloggedFrom}{block:ContentSource} &nbsp; <a href="{SourceURL}">Source</a> {/block:ContentSource}{block:RebloggedFrom} ){/block:RebloggedFrom}{block:NoteCount} <i>with</i> <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</center><p>
  329.  
  330. <center>{block:HasTags}{block:Tags} <i class="fa fa-tags"></i> <a href="{TagURL}">{Tag} </a> {/block:Tags}{/block:HasTags}
  331. <br /></div>
  332.  
  333. {/block:Posts}
  334.  
  335.  
  336. {block:PostNotes}{PostNotes}{/block:PostNotes}<br />
  337. </div>
  338. </div>
  339. </body>
  340.  
  341. <div id="box1" class="popup_block" style="text-align:center;">
  342. <img src="{image:nav pic 1}" style="width:60px;position:inline;
  343. box-shadow: 3px 3px 0px {color:link}; border: 3px solid {color:sbar border};">
  344. <img src="{image:nav pic 2}" style="width:60px;position:inline;
  345. box-shadow: 3px 3px 0px {color:link}; border: 3px solid {color:sbar border};"> <p>
  346. <box style= "width">
  347. <div class="boxed">
  348.  
  349.  
  350. </div>
  351. <div class="boxed">
  352.  
  353. <a href="/"> link title </a>
  354.  
  355. </div><p>
  356. <div class="boxed">
  357. <a href="/"> link title </a>
  358. </div><p>
  359. <div class="boxed">
  360. <a href="/"> link title </a>
  361. </div> <p>
  362. <div class="boxed">
  363. <a href="/"> link title </a>
  364. </div> <p>
  365. <div class="boxed">
  366. <a href="/"> link title </a>
  367. </div>
  368. </div>
  369.  
  370. </div></div></div></div></div></div></div></div></div></div>
  371.  
  372. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement