chellescodes

STARBORNE tumblr theme

Jun 17th, 2017
874
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 29.50 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4.  
  5. =========DMMMM============DDDMMMMD=====M
  6. =====IMM====MMMN=========+MMMMMMMM=====M
  7. ===NM======MMMMM=======MMMMM==?MMMDD===M
  8. =+D~=======MM=NMM====MMMMM====MMM8==DD=M
  9. OD========MMN==MMM=MMMMM=====MMMM====NDM
  10. DD=======MMM===MMMMMMM======+MMM======DM
  11. D=======MMM=====MMMM========MMM=======DD
  12. D8=====MMM======MM==========MM========DM
  13. DD====MMM=======D===========MM=======DDM
  14. =$D==MMD====================M=======DD=M
  15. ===NMM======================M=====ND===M
  16. ===M=ODD=======================MDN=====M
  17. =========DDNN=============IDDD=========M
  18. ================7MDDDD8================M
  19.                    
  20.     CODE BY CHELLE, AKA @THE-JEDI
  21.        PLEASE LEAVE THE CREDIT
  22.  DO NOT STEAL THE ENTIRE/BIG CHUNKS
  23.    OF THE CODE AND DISTRIBUTE IT
  24.        AS IF IT WERE YOUR OWN
  25.  
  26.  
  27. NOTES ON THIS THEME:
  28.  
  29. DISCLAIMER: I DO NOT OWN STAR WARS OR ANYTHING ASSOCIATED WITH IT. BUT I DID MAKE THIS CODE.
  30. Special thanks to @shythemes for the video resizing and custom like/reblog tutorials.
  31.  
  32. Please consult the-jedi.tumblr.com/my+theme for tips on how to best utilize this theme.
  33. For help, first consult the-jedi.tumblr.com/tagged/theme+help, or the-jedi.tumblr.com/tagged/starbornetheme.
  34. If you don't find an answer to your query, go to the-jedi.tumblr.com/ask with your question.
  35.  
  36. -->
  37.  
  38. <!DOCTYPE html>
  39.  
  40. <head>
  41. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  42. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.6/SmoothScroll.min.js"></script>
  43. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  44. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  45. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  46. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  47. <script type="text/javascript" src="http://static.tumblr.com/iuggpng/bGqm4yfv9/jquery-1.7.2.js"></script>
  48. <link href="https://fonts.googleapis.com/css?family=Alegreya+Sans|Alegreya+Sans+SC" rel="stylesheet">
  49.  
  50.  
  51.     <meta name="color:background" content="#fbfbfb">
  52.     <meta name="color:posts background" content="#ffffff">
  53.     <meta name="color:links" content="#b6abab">
  54.     <meta name="color:links hover" content="#e2e2e2">
  55.     <meta name="color:text" content="#8b8b8b">
  56.     <meta name="color:ask and link post background" content="#f4f4f4">
  57.     <meta name="color:topbar" content="#ffffff">
  58.     <meta name="color:title" content="#606060">
  59.     <meta name="color:border" content="#f0f0f0">
  60.     <meta name="color:updates stars" content="#f0f0f0">
  61.    
  62.     <meta name="text:post width" content="500" />
  63.     <meta name="text:to pick new link icons, go to this site" content="https://linearicons.com/free">
  64.     <meta name="text:about link" content="/about" />
  65.     <meta name="text:about link title" content="about" />
  66.     <meta name="text:link 1 URL" content="/" />
  67.     <meta name="text:link 1 icon" content="tag"/>
  68.     <meta name="text:link 1" content="link 1" />
  69.     <meta name="text:link 2 URL" content="/" />
  70.     <meta name="text:link 2 icon" content="cog"/>
  71.     <meta name="text:link 2" content="link 2" />
  72.     <meta name="text:link 3 URL" content="/" />
  73.     <meta name="text:link 3 icon" content="book"/>
  74.     <meta name="text:link 3" content="link 3" />
  75.     <meta name="text:link 4 URL" content="/" />
  76.     <meta name="text:link 4 icon" content="pencil"/>
  77.     <meta name="text:link 4" content="link 4" />
  78.     <meta name="text:updates tab 1 title" content="Tab 1" />
  79.     <meta name="text:updates tab 1 content" content="updates here" />
  80.     <meta name="text:updates tab 2 title" content="Tab 2" />
  81.     <meta name="text:updates tab 2 content" content="updates here" />
  82.     <meta name="text:updates tab 3 title" content="Tab 3" />
  83.     <meta name="text:updates tab 3 content" content="updates here" />
  84.  
  85.     <meta name="if:webkit scroll bar" content="1">
  86.     <meta name="if:hover tags" content="1">
  87.     <meta name="if:updates tab" content="1">
  88.     <meta name="if:extra links" content="1">
  89.     <meta name="if:lazy load" content="1">
  90.     <meta name="if:show submit link" content="0">
  91.  
  92.     <meta name="image:topbar" content="">
  93.     <meta name="image:background" content="">
  94.  
  95. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  96.  
  97. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  98.  
  99. {block:ifLazyLoad}
  100. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  101. <script type="text/javascript" charset="utf-8">
  102. var $j = jQuery.noConflict();
  103. $j(function() {
  104. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  105. $j("img").lazyload({
  106. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  107. effect: "fadeIn",
  108. });
  109. });
  110. </script>
  111. {/block:ifLazyLoad}
  112.  
  113.  
  114.  
  115. <script>
  116. (function($){$(document).ready(function(){
  117. $("a[title]").style_my_tooltips({tip_follows_cursor:true,
  118. tip_delay_time:75, tip_fade_speed:600,attribute:"title"});});})(jQuery);
  119.  
  120. </script>
  121.  
  122.  
  123.  
  124.  
  125.  
  126. <script>
  127.     $(document).ready(function(){
  128.         $(".controloptions").click(function(){
  129.             $("#controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls, .tmblr-iframe-compact .tmblr-iframe--unified-controls").fadeToggle();
  130.         });
  131.     });
  132.    
  133. </script>
  134.  
  135. <script>
  136.     $(document).ready(function(){
  137.         $("#xlink").click(function(){
  138.         $("#extralinks").fadeToggle("linear");
  139.            
  140.         });
  141.     });
  142. </script>
  143.  
  144.  
  145.  
  146.  
  147.  
  148. <title>{Title}{block:PostSummary} | {PostSummary}{/block:PostSummary}{block:TagPage} | {Tag}{/block:TagPage}</title>
  149. <link rel="shortcut icon" href="{Favicon}" />
  150. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  151. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  152.  
  153.  
  154. <style type="text/css">
  155.  
  156. #s-m-t-tooltip {
  157. max-width:300px;
  158. background-color:{color:posts background};
  159. font-size:10px;
  160. font-family:'Alegreya Sans', sans-serif;
  161. padding:3px 3px 3px 3px;
  162. text-transform: lowercase;
  163. color:{color:text};
  164. letter-spacing:1px;
  165. margin:10px 0px 0px 20px;
  166. z-index:9999999999999999999999;
  167. border:1px solid {color:border};
  168.  
  169. }
  170.  
  171. body {
  172. background-color:{color:background};
  173. font-size:10px;
  174. font-family:'Alegreya Sans', sans-serif;
  175. font-weight:normal;
  176. margin:0px;
  177. top:0;
  178. left:0;
  179. word-wrap:break-word;
  180. }
  181.  
  182.  
  183. {block:IfWebkitScrollBar}
  184.  ::-webkit-scrollbar-thumb {
  185.     height:auto;
  186.     background-color: {color:topbar};
  187.     border:2px solid {color:border};
  188.     }
  189.     ::-webkit-scrollbar {
  190.     height:9px;
  191.     width:9px;
  192.     background-color: {color:background};
  193.     }  
  194. {/block:IfWebkitScrollBar}
  195.  
  196.  
  197.     a {
  198.     color:{color:links};
  199.     text-decoration:none;
  200.     -moz-transition-duration:0.5s;
  201.     -webkit-transition-duration:0.5s;
  202.     -o-transition-duration:0.5s;
  203.     }
  204.     a:hover {
  205.     color:{color:links hover};
  206.     text-decoration:none;
  207.     -moz-transition-duration:0.5s;
  208.     -webkit-transition-duration:0.5s;
  209.     -o-transition-duration:0.5s;
  210.     }
  211.  
  212.  
  213. h1 {
  214.     font-size:16px;
  215.     font-weight:normal;
  216.     letter-spacing:0px;
  217.     line-height:120%;
  218. }
  219.  
  220. h1 a{
  221.     color:{color:text};
  222. }
  223.  
  224. h1 a:hover {
  225.     color:{color:links};
  226. }
  227.  
  228. h2 {
  229.     text-decoration:none;
  230.     font-size:16px;
  231.     text-align:center;
  232.     line-height:110%;
  233.     color:{color:text};
  234.     padding:5px;
  235.     padding-bottom:2px;
  236.     font-weight:normal;
  237.     letter-spacing:0px;
  238. }
  239.  
  240. h3 {
  241.     font-weight:normal;
  242.     font-size:17px;
  243.     text-align:center;
  244.     font-style:normal;
  245.     color:{color:text};
  246. }
  247.  
  248. blockquote {
  249. border-left:2px solid {color:text};
  250. padding-left:5px;
  251. margin:5px;
  252. padding-top:2px;
  253. padding-bottom:2px;
  254. }
  255.  
  256.  
  257. #theme {
  258.     margin:auto;
  259.     width:875px;
  260.     padding:0;
  261.     width:100%;
  262.     text-align: center;
  263.     background:{color:background};
  264.     z-index:5;
  265.     position:relative;
  266. }
  267.  
  268. #bg {
  269.     width:100%;
  270.     height:100%;
  271.     margin-top:-20px;
  272.     z-index:-1;
  273.     position:fixed;
  274. }
  275.  
  276.  
  277. #top {
  278.     width:100%;
  279.     height:40px;
  280.  
  281.     position:fixed;
  282.     top:0;
  283.     left:0;
  284.     float:right;
  285.     border-bottom:1px solid {color:border};
  286.     z-index:99998;
  287.     background:{color:topbar};
  288. }
  289.  
  290. #other_controls {
  291.     float:right;
  292.     width:100%;
  293.     position:fixed;
  294.     margin-top:-80px;
  295.     z-index:9999999999999;
  296. }
  297.  
  298. #toplinks {
  299.  
  300.     font-size:12px;
  301.     color:{color:title};
  302.     float:right;
  303.  
  304. margin-right:15px;
  305. display:fixed;
  306.     margin-top:93px;
  307.     font-family:Hind;
  308.     cursor:pointer;
  309.     -moz-transition-duration:0.4s;
  310.     -webkit-transition-duration:0.4s;
  311.     -o-transition-duration:0.4s;
  312.     text-decoration:none;
  313.     z-index:999999999999999999;
  314. }
  315.  
  316. #toplinks:hover  {
  317.     color:{color:links hover};
  318.     float:right;    
  319.  
  320.     -moz-transition-duration:0.4s;
  321.     -webkit-transition-duration:0.4s;
  322.     -o-transition-duration:0.4s;
  323.  
  324. }
  325.  
  326. #toplinks a {
  327.     color:{color:title};
  328. }
  329.  
  330.  
  331.  
  332.  
  333. #controls, .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls, .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  334.   animation: fadin 2s;
  335.  margin-top:7px;
  336.     opacity:.5!important;
  337.     position:fixed!important;
  338.     right:60px!important;
  339.     z-index:999999999999999!important;
  340.     display:none;
  341. -webkit-animation: fadein 2s;
  342. -moz-animation: fadein 2s;
  343. -ms-animation: fadein 2s;
  344.  -o-animation: fadein 2s;
  345. }
  346.  
  347. @keyframes fadein {
  348.     from { opacity: 0; }
  349.     to   { opacity: 1; }
  350. }
  351.  
  352. @-moz-keyframes fadein {
  353.     from { opacity: 0; }
  354.     to   { opacity: 1; }
  355. }
  356.  
  357. @-webkit-keyframes fadein {
  358.     from { opacity: 0; }
  359.     to   { opacity: 1; }
  360. }
  361.  
  362. @-ms-keyframes fadein {
  363.     from { opacity: 0; }
  364.     to   { opacity: 1; }
  365. }
  366.  
  367. @-o-keyframes fadein {
  368.     from { opacity: 0; }
  369.     to   { opacity: 1; }
  370. }
  371.  
  372.  
  373.  
  374.  
  375. #topimg {
  376.     float:left;
  377.     display:block;
  378.     margin-top:80px;
  379.     margin-left:205px;
  380.     position:fixed;
  381.     z-index:999999999999999;
  382.    
  383. }
  384.  
  385. #topimg img {
  386.     float:left;
  387.     display:inline-block;
  388.     margin-top:-85px;
  389.     width:80px;
  390.     height:80px;
  391.     border-radius:100px;
  392.     border: 10px solid {color:topbar};
  393.     z-index:-1;
  394.     position:fixed;
  395. }
  396.  
  397. #top2 {
  398.     width:100%;
  399. }
  400. #topimgb {
  401.     width:100px;
  402.     background: #fff;
  403.     height:100px;
  404.     border:1px solid {color:border};
  405.     z-index:1000;
  406.     position:fixed;
  407.         float:left;
  408.  
  409.     border-radius:100px;
  410.     margin-left:204px;
  411.     margin-top:-6px
  412. }
  413.  
  414.  
  415. #blogtitle {
  416.     display: inline-block;
  417.     float: left;
  418.     margin-top: 18px;
  419.     padding-right: 4px;
  420.     color: white;
  421.     font-size: 20px;
  422.     text-transform: lowercase;
  423.     font-style: italic;
  424.     z-index:0;
  425.     text-align: right;
  426.     width: 200px;
  427.     height: 20px;
  428.     overflow: hidden;
  429.     padding-bottom: 5px;
  430.    
  431. }
  432.  
  433.  
  434. #blogtitle a{
  435.     color:{color:title};
  436.     -webkit-transition: letter-spacing 2s;
  437.     -webkit-transform 2s;
  438.  
  439. }
  440.  
  441. #blogtitle a:hover{
  442.     letter-spacing: 2px;
  443.     border-top:1px solid {color:text};
  444.     -webkit-transition: letter-spacing 2s;
  445.     -webkit-transform 2s;
  446.    
  447. }
  448.  
  449. #desc {
  450.     width:100px;
  451.     padding-top:5px;
  452.     line-height:10px;
  453.     margin-left:98px;
  454.     text-align:right;
  455.     display:absolute;
  456.     font-size:10px;
  457.     color:{color:text};
  458. }
  459.  
  460. #mainlinks {
  461.     width:110px;
  462.     padding-top:1px;
  463.     padding-bottom:3px;
  464.     font-size:12px;
  465.     position:relative;
  466.     float:right;
  467.     margin-left:22px;
  468. }
  469.  
  470. #mainlinks a:hover {
  471.     color:{color:text};
  472.     font-weight:900;
  473.     border-bottom:1px solid {color:text};
  474. }
  475.  
  476. #homeicon a {
  477.  
  478.     font-size:22px;
  479. }
  480.  
  481. #homeicon a:hover {
  482.     color:{color:text};
  483. }
  484.  
  485. #extralinks {
  486.     display:none;
  487.     z-index:999999999999999999999999;
  488.     float:left;
  489.     margin-left:205px;
  490.     background:{color:topbar};
  491.     margin-top:-5px;
  492.     width:80px;
  493.     height:80px;
  494.     border-radius:100px;
  495.     border: 10px solid {color:topbar};
  496.     position:fixed;
  497.    
  498. }
  499.  
  500.  
  501.  
  502. #thelinks {
  503.     background:{color:topbar};
  504.     position:fixed;
  505.     border-left:2px solid {color:border};
  506.     border-right:2px solid {color:border};
  507.  
  508.     margin-top:14px;
  509.     margin-left:8px;
  510.     border-radius:7px;
  511. }
  512.  
  513.  
  514.  
  515. #alink {
  516.     width:45px;
  517.    
  518.     height:14px;
  519.     padding-right:7px;
  520.     padding-left:7px;
  521.  
  522. text-align:right;
  523.     font-size: 12px;
  524.     color: #000;
  525.     line-height: 12px;
  526.  
  527.    
  528. }
  529.  
  530. #alink a{
  531.     color: {color:title};
  532.      font-size: 10px;
  533.      
  534.    
  535. }
  536.  
  537.  
  538. #alink:hover {
  539.     background:{color:background};
  540.      
  541. }
  542. #alink a:hover{
  543.     color: {color:text};
  544.     font-weight:900;
  545.    border-bottom:1px solid {color:text};
  546.    
  547. }
  548.  
  549. #pagi {
  550.     font-size:16px;
  551.     width:{text:post size}px;
  552.     font-weight:normal;
  553.     font-style:normal;
  554.     text-align:center;
  555.     margin-bottom:50px;
  556.     color:{color:links};
  557.     letter-spacing:0px;
  558. }
  559.    
  560. #pagi a {
  561.     display:inline-block;
  562.     color:{color:links};
  563.     }
  564.    
  565. #pagi a:hover {
  566.     color:{color:links hover};  
  567.     }
  568.  
  569. #postscontainer {
  570.     margin-left:400px;
  571.     margin-top:50px;
  572.     top:20px;
  573.     padding:10px;
  574.     position:absolute;
  575.     text-align:justify;
  576.     color:{color:text};
  577.     z-index:999;
  578.    -webkit-animation: fadein 2s;
  579. -moz-animation: fadein 2s;
  580. -ms-animation: fadein 2s;
  581.  -o-animation: fadein 2s;
  582.     animation: fadein 2s;
  583. }
  584.  
  585. @keyframes fadein {
  586.     from { opacity: 0; }
  587.     to   { opacity: 1; }
  588. }
  589.  
  590. @-moz-keyframes fadein {
  591.     from { opacity: 0; }
  592.     to   { opacity: 1; }
  593. }
  594.  
  595. @-webkit-keyframes fadein {
  596.     from { opacity: 0; }
  597.     to   { opacity: 1; }
  598. }
  599.  
  600. @-ms-keyframes fadein {
  601.     from { opacity: 0; }
  602.     to   { opacity: 1; }
  603. }
  604.  
  605. @-o-keyframes fadein {
  606.     from { opacity: 0; }
  607.     to   { opacity: 1; }
  608. }
  609.  
  610.  
  611. .posts {
  612.     background-color:{color:posts background};
  613.     padding:15px 15px 15px 15px;
  614.     width:{text:post width}px;
  615.     margin-bottom:70px;
  616.     text-align:justify;
  617.     font-size:11px;
  618.     line-height:100%;
  619.     letter-spacing:0px;
  620.     color:{color:text};
  621.     border:1px solid {color:border};
  622.  
  623. }
  624.  
  625.  
  626. .caption {  
  627.     width:{text:post size}px;
  628.     text-align:justify;
  629.     line-height:120%;
  630. }
  631.  
  632. {block:ifHoverTags}
  633. .postinfo {
  634.  height:0px;
  635.  padding:0px;
  636.     opacity:0;
  637.             -moz-transition-duration:0.5s;
  638. -webkit-transition-duration:0.5s;
  639. -o-transition-duration:0.5s;
  640. }
  641.  
  642.     .postinfo a {
  643.     font-style:normal;
  644. }
  645.    
  646.     .postinfo a:hover {
  647.     color:{color:links hover};
  648. }
  649.  
  650.  
  651. .posts:hover .postinfo {
  652.      width:{text:post width}px;
  653.     margin-top:8px;
  654.     left:-10px;
  655.     padding:0px -5px 5px 10px;
  656.     text-align:left;
  657.     line-height:100%;
  658.  
  659.     display:inline-block;
  660.     opacity:1;
  661.     -moz-transition-duration:0.5s;
  662. -webkit-transition-duration:0.5s;
  663. -o-transition-duration:0.5s;
  664.    
  665. }
  666. {/block:ifHoverTags}
  667.  
  668.  
  669. {block:ifNotHoverTags}
  670. .postinfo {
  671.      width:{text:post width}px;
  672.     margin-top:8px;
  673.     left:-10px;
  674.     padding:0px -5px 5px 10px;
  675.     text-align:left;
  676.     line-height:100%;
  677.  
  678.     display:inline-block;
  679.     opacity:1;
  680.     -moz-transition-duration:0.5s;
  681. -webkit-transition-duration:0.5s;
  682. -o-transition-duration:0.5s;
  683.    
  684. }
  685. {/block:ifNotHoverTags}
  686.  
  687. .dates {
  688.     padding-top:5px;
  689.     display:inline-block;
  690.     font-size:11px;
  691.     text-transform:none;
  692.     font-weight:normal;
  693.     letter-spacing:0px;
  694. }
  695.  
  696. .notesetc {
  697.     display:inline-block;
  698.     }
  699.  
  700. .tags {
  701.     text-transform:none;
  702.     font-size:10px;
  703.     text-align:left;
  704.     margin-top:2px;
  705.     }
  706.  
  707.  
  708.  
  709. .chat ol {
  710.     line-height:170%;
  711.     list-style:none;
  712.     width:{text:post size}px;
  713.     margin-left:-40px;
  714. }
  715.  
  716. .line.odd {
  717.     background:#f6f6f6;
  718.     margin-bottom:0px;
  719.     padding:4px;
  720. }
  721.  
  722. .line.even {
  723.     background:#fafafa;
  724.     margin-bottom:0px;
  725.     padding:4px;
  726. }
  727.  
  728. .label {
  729.     padding-right:2px;
  730.     text-transform:normal;
  731.     font-weight:bold;
  732.     color:{color:link};
  733. }
  734.  
  735. .note {
  736.     text-transform:uppercase;
  737.     font-style:normal;
  738.     letter-spacing:0px;
  739.     font-size: 9px;
  740.     text-align:left;
  741.     line-height:90%;
  742.     margin-left:-40px;
  743. }
  744.  
  745. .note li {
  746.     list-style-type:none;
  747.     padding:10px 25px 10px 25px;
  748.     text-align:left;
  749.     margin:0px;
  750.     -moz-transition-duration:0.5s;
  751.     -webkit-transition-duration:0.5s;
  752.     -o-transition-duration:0.5s;
  753. }
  754.  
  755. .note img {
  756.    border-radius:100px;
  757.    padding:0px 2px 0px 2px;
  758. }
  759.  
  760.  
  761.  
  762. /** this is the styling for the ask posts **/
  763. .question {
  764.     margin-top:10px;
  765.     background-color: {color:ask and link post background};
  766.     padding:10px;
  767.     padding-bottom:10px;
  768. }
  769.  
  770. #asker {
  771.     height:10px;
  772.     margin-left:60px;
  773.     padding-bottom:0px;
  774. }
  775.  
  776.  
  777. .question a {
  778.     color:{color:title};
  779. }
  780.  
  781. #answer {
  782.     padding-top:20px;
  783.     position:inline;
  784.  
  785.    
  786. }
  787.  
  788. #askpic {
  789.     position:relative;
  790.    
  791.     width:30px;
  792.     padding-left:30px;
  793.     float:left;
  794.  
  795.     display:inline;
  796.    margin-left:-25px;
  797.     top:-10px
  798.     border-radius:100px;
  799. }
  800.  
  801. #askpic img{
  802.     border-radius:100px;
  803.     border:5px solid {color:ask and link post background};
  804. }
  805.  
  806.  
  807.  
  808. #infoabove {
  809.     text-transform:lowercase;
  810.     padding-bottom:10px;
  811.     margin-top:-5px;
  812. }
  813.  
  814. #date {
  815.     float:right;
  816.     margin-right:5px;
  817.     margin-top:3px;
  818.     text-transform:lowercase;
  819. }
  820.  
  821.  
  822.  
  823. #topurl {
  824.    font-size:12px
  825.    left:10px;
  826.    font-weight:bold;
  827. }
  828. /** CUSTOM LIKE AND REBLOG TUTORIAL FROM SHYTHEMES **/
  829.  
  830. svg {
  831.    width:10px;
  832.    height:auto;
  833.    opacity:.5;
  834.    padding:1px;
  835.    display:block;
  836.    overflow:visible;
  837. }
  838.  
  839.  
  840. svg:hover {
  841.         fill:{color:links hover};
  842. }
  843.  
  844. .controls {
  845.  
  846.     float:right;
  847.     margin-top:-5px;
  848. }
  849. .controls a {
  850.    
  851.    position:relative;
  852.    color:{color:link};
  853.    display:inline-block;
  854.    overflow:hidden;
  855.    padding:5px;
  856.    width:12px;
  857.    height:12px;
  858. }
  859. .controls .reblog {
  860.    opacity:.93;
  861. }
  862. .controls .reblog svg {
  863.    width:9px;
  864.    margin-top:1px;
  865. }
  866. .controls .like .liked + svg {
  867.    opacity:1;
  868. }
  869. .controls .like .liked + svg path {
  870.    fill:#ec5a5a;
  871. }
  872. .controls .like .like_button {
  873.    position:relative;
  874. }
  875. .controls .like .like_button iframe {
  876.    position:absolute;
  877.    top:0;
  878.    left:0;
  879.    bottom:0;
  880.    right:0;
  881.    z-index:2;
  882.    opacity:0;
  883. }
  884.  
  885. .like:hover {
  886.         color:{color:link};
  887. }
  888.  
  889.  
  890. .reblog:hover {
  891.         color:{color:link};
  892. }
  893. .controls a:hover {
  894.  color:{color:link};
  895. }
  896.  
  897. .controls:hover {
  898.      color:{color:link};
  899. }
  900.  
  901.  
  902. #updates {
  903.     position:fixed;
  904.     float:left;
  905.     bottom:10px;
  906.     text-align:left;
  907.    
  908.    
  909. }
  910. #tab1, #tab2, #tab3 {
  911.     width:10px;
  912.     height:10px;
  913.       -moz-transition-duration:0.5s;
  914. -webkit-transition-duration:0.5s;
  915. -o-transition-duration:0.5s;
  916.    
  917. }
  918. #star1 {
  919.     cursor:pointer;
  920.     position:absolute;
  921.     margin-top:5px;
  922.     margin-left:20px;
  923.     font-size:17px;
  924.     color:{color:updates stars};
  925. }
  926.  
  927. #star1 a, #star2 a, #star3 a {
  928. color:{color:updates stars}!important;
  929. }
  930.  
  931.  
  932. #tab1:hover #star1_content {
  933.     opacity:1;
  934.       -moz-transition-duration:0.5s;
  935. -webkit-transition-duration:0.5s;
  936. -o-transition-duration:0.5s;
  937. }
  938.  
  939. #tab2:hover #star2_content {
  940.     opacity:1;
  941.       -moz-transition-duration:0.5s;
  942. -webkit-transition-duration:0.5s;
  943. -o-transition-duration:0.5s;
  944. }
  945.  
  946. #tab3:hover #star3_content {
  947.     opacity:1;
  948.       -moz-transition-duration:0.5s;
  949. -webkit-transition-duration:0.5s;
  950. -o-transition-duration:0.5s;
  951. }
  952.  
  953. #star2{
  954.     cursor:pointer;
  955.     position:absolute;
  956.     margin-left:36px;
  957.      margin-top:10px;
  958.     font-size:14px;
  959.     color:{color:updates stars};
  960. }
  961.  
  962. #star3 {
  963.     cursor:pointer;
  964.  position:absolute;
  965.     font-size:12px;
  966.     margin-top:-11px;
  967.     margin-left:50px;
  968.     color:{color:updates stars};
  969. }
  970.  
  971. #updates_content {
  972.     position:fixed;
  973.      background:{color:post background};
  974.     margin-top:-100px;
  975.    
  976. }
  977.  
  978.  
  979. #star1_content {
  980.     opacity:0;
  981.     padding-left:3px;
  982.     position:fixed;
  983.     margin-top:-90px;
  984.     margin-left:27px;
  985.     color:{color:text};
  986.     border-left:1px solid {color:text};
  987.     overflow: scroll;
  988.     width:175px;
  989.     height:100px;
  990.  
  991.  
  992.    
  993. }
  994.  
  995.  
  996. #star2_content  {
  997.      opacity:0;
  998.     padding-left:3px;
  999.     position:fixed;
  1000.     margin-top:-87px;
  1001.     color:{color:text};
  1002.     margin-left:43px;
  1003.     border-left:1px solid {color:text};
  1004.     overflow: scroll;
  1005.     width:175px;
  1006.     height:100px;
  1007.    
  1008.  
  1009.    
  1010. }
  1011.  
  1012.  
  1013. #star3_content {
  1014.      opacity:0;
  1015.     padding-left:3px;
  1016.     color:{color:text};
  1017.     position:fixed;
  1018.     margin-top:-110px;
  1019.     margin-left:55px;
  1020.     border-left:1px solid {color:text};
  1021.     overflow: scroll;
  1022.     width:175px;
  1023.     height:100px;
  1024.  
  1025.  
  1026.    
  1027. }
  1028. #credit {
  1029.     width:20px;
  1030.     position:fixed;
  1031.     bottom:0;
  1032.     right:10px;
  1033.     float:right;
  1034.     z-index:999998;
  1035.     filter: grayscale(100%);
  1036. }
  1037.  
  1038. #video {
  1039.     width:{text:post width}px;
  1040. }
  1041.  
  1042.     {CustomCSS}
  1043.  
  1044.     </style></head>
  1045. <body>
  1046.  
  1047. <div id="theme">
  1048. <div id="bg"><img src="{image:background}"/></div>
  1049.  
  1050. <div id="topimg"><a href="/"><img src="{image:topbar}"/></a></div>
  1051.  
  1052. <div id="extralinks">
  1053. <div id="thelinks">
  1054.    
  1055.     {block:IfLink1}
  1056.     <div id="alink">
  1057.     <a title="{text:link 1}" href="{text:link 1 URL}"><span style="float:left;" class="lnr lnr-{text:link 1 icon}"></span>&nbsp;{text:link 1}</a>
  1058.     </div>
  1059.    {/block:IfLink1}
  1060.    
  1061.    
  1062.    {block:IfLink2}
  1063.    <div id="alink">
  1064.     <a title="{text:link 2}" href="{text:link 2 URL}"><span style="float:left;" class="lnr lnr-{text:link 2 icon}"></span>&nbsp;{text:link 2}</a>
  1065.     </div>
  1066.    
  1067.    {/block:IfLink2}
  1068.    
  1069.    {block:IfLink3}
  1070.    <div id="alink">
  1071.     <a title="{text:link 3}" href="{text:link 3 URL}"><span style="float:left;" class="lnr lnr-{text:link 3 icon}"></span>&nbsp;{text:link 3}</a>
  1072.     </div>
  1073.    {/block:IfLink3}    
  1074.    
  1075.     {block:IfLink4}
  1076.     <div id="alink">
  1077.     <a title="{text:link 4}" href="{text:link 4 URL}"><span style="float:left;" class="lnr lnr-{text:link 4 icon}"></span>&nbsp;{text:link 4}</a>
  1078.      </div>
  1079.  
  1080.     {/block:IfLink4}
  1081.    
  1082.  
  1083.     </div>
  1084.  
  1085.    
  1086. </div>
  1087.  
  1088. <div id="other_controls" style="z-index:9999999999999999">
  1089. <div class="controloptions"><a title="controls"><div id="toplinks"><span class="lnr lnr-menu-circle"></span></a></div></div>
  1090.  
  1091.  
  1092.  
  1093. <a title="follow" href="http://www.tumblr.com/follow/{Name}/">
  1094. <div id="toplinks" style="margin-right:10px;"><span class="lnr lnr-plus-circle"></span></div>
  1095.  
  1096. </a>
  1097. </div>  
  1098. <div id= "top">
  1099.  
  1100. <div id="blogtitle"><a href="/">{Title}</a></div><div id="desc">
  1101. <div id="mainlinks">
  1102. <a id="homeicon" title="home" href="/"><span class="lnr lnr-home"></span></a>&nbsp;
  1103.     <a title="ask" href="/ask"><span class="lnr lnr-bubble"></span></a>&nbsp;
  1104.     <a title="{text:about link title}" href="{text:about link}"><span class="lnr lnr-user"><//span></a>&nbsp;
  1105.     <a title="archive" href="/archive"><span class="lnr lnr-history"></span></a>&nbsp;
  1106.    
  1107.     {block:ifExtraLinks}
  1108.     <a title="more links" id="xlink" ><span class="lnr lnr-list"></span></a>&nbsp;
  1109.     {/block:ifExtraLinks}
  1110. </div>
  1111. <br>
  1112.     {Description}
  1113. </div></div>
  1114.  
  1115.  
  1116.  
  1117.  
  1118.  
  1119.  
  1120. <div id="top2">
  1121. <div id="topimgb"></div> </div>
  1122.  
  1123. <div id="other_controls" style="z-index:9999999999;">
  1124. <div class="controloptions"><a title="controls"><div id="toplinks"><span class="lnr lnr-menu-circle"></span></a></div></div>
  1125.  
  1126.  
  1127.  
  1128. <a title="follow" href="http://www.tumblr.com/follow/{Name}/">
  1129. <div id="toplinks" style="margin-right:10px;"><span class="lnr lnr-plus-circle"></span></div></div>
  1130.  
  1131. <div id="postscontainer">
  1132.  
  1133. {block:TagPage}<h2 style="width:{text:post size}px; padding:10px 0px 30px 0px;">posts tagged with <a href="{TagURL}">{Tag}</a></h2>{/block:TagPage}
  1134.  
  1135.  
  1136.  
  1137. {block:Posts}
  1138. <div class="posts" id="{PostID}" >
  1139.  
  1140. <div id="infoabove">
  1141.    
  1142.  <div id= "date"><a href="{Permalink}">{ShortMonth} {DayofMonth}, {Year}</a></div>
  1143.  
  1144. {block:NotReblog}
  1145.  
  1146. <div id="topurl"><span  class="lnr lnr-star"> &nbsp;</span><a style="top:-5px;" href="/">{Name}</a></div>
  1147. {/block:NotReblog}
  1148.  
  1149. {block:RebloggedFrom}
  1150. <div id="topurl"><span  class="lnr lnr-redo"></span>&nbsp; REBLOGGED FROM <a title="{ReblogParentTitle}"  href="{ReblogParentURL}">{ReblogParentName}</a></div>
  1151. {/block:RebloggedFrom}  
  1152.  
  1153.    
  1154.    
  1155.    
  1156. </div>
  1157.  
  1158. {block:Text}{block:Title}<h2>{Title}</h2>{/block:Title}{Body}{/block:Text}
  1159.  
  1160. {block:Quote}<h2 padding:10px;><b></b>{Quote}<b>”</b></h2><h3>— {Source}</h3>{/block:Quote}
  1161.  
  1162. {block:Link}<a href="{URL}"><h2 style="padding:18px; background-color:{color:ask and link post background}">{Name} →</h2></a>
  1163. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  1164.  
  1165. {block:Photo}<center>{LinkOpenTag}<img style="width:{text:post width}px;
  1166. " src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  1167.  
  1168.  
  1169.  
  1170. {block:Photoset}<center><div id="photoset" style="width:{text:post width}px;" width="{text:post width}">{Photoset}</div></center>
  1171. {block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  1172.  
  1173.  
  1174. {block:Chat}{block:Title}<h2>{Title}</h2>{/block:Title}<div class="chat"><ol> {block:Lines}<li class="line {Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ol></div>{/block:Chat}
  1175.  
  1176. {block:Video}<div id="video">{Video-500}</div>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  1177.  
  1178. {block:Answer}
  1179. <div id= "askpic"><img src="{AskerPortraitURL-40}"></div>
  1180. <div class="question"><div id="asker"><span style="margin-left:-10px;"><b><span style="text-transform:lowercase;">{Asker} </span>asked:</b> {Question}</span></div></div>
  1181. <div id="answer">{Answer}</div>
  1182. {/block:Answer}
  1183.  
  1184. {block:Audio}
  1185. {block:AudioEmbed}{AudioEmbed}{/block:AudioEmbed}
  1186. {block:Caption}{Caption}{/block:Caption}{/block:Audio}
  1187. {block:date}
  1188. <div class="postinfo"><div class="controls">
  1189. <a href="{ReblogURL}" target="_blank" class="reblog">
  1190. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 361.095 361.095" style="enable-background:new 0 0 361.095 361.095;" xml:space="preserve"><g><g><path d="M182.595,325.678c-63.183,0-120.133-42.217-138.267-102.567c-2.833-9.067-12.183-14.167-21.25-11.333    c-9.067,2.833-14.167,12.183-11.333,21.25c22.95,75.933,91.517,126.65,170.85,126.65c98.317,0,178.5-80.183,178.5-178.5    s-80.183-178.5-178.5-178.5c-55.817,0-108.233,26.633-141.667,69.7l-7.083-56.1c-1.133-9.35-9.633-15.867-18.983-14.733    C5.511,2.678-1.005,11.178,0.128,20.528l13.317,103.7c1.133,8.5,8.5,14.733,16.717,14.733c0.567,0,1.417,0,1.983,0l102.567-11.617    c9.35-1.133,16.15-9.35,15.017-18.7s-9.35-16.15-18.7-15.017l-68.85,7.65c26.633-39.95,71.683-64.6,120.417-64.6    c79.617,0,144.5,64.883,144.5,144.5S262.211,325.678,182.595,325.678z"/></g></g></svg>
  1191. </a>
  1192. <a href="#" class="like">{LikeButton}
  1193. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 442.403 442.403" style="enable-background:new 0 0 442.403 442.403;" xml:space="preserve"><g><g><path d="M213.05,422.652c2.833,1.7,5.95,2.833,9.35,2.833c3.117,0,6.517-0.85,9.35-2.833c7.65-5.1,187.283-123.533,207.683-243.95    c10.483-62.333-8.783-100.867-26.633-122.117c-20.967-24.933-52.133-39.667-83.017-39.667c-10.2,0-20.117,1.7-28.9,5.1    c-43.067,16.15-72.25,44.767-88.117,64.317c-15.583-19.267-42.217-47.033-74.517-58.083c-9.917-3.4-20.683-5.1-32.017-5.1    c-28.9,0-56.383,11.9-75.367,32.867c-16.717,18.417-35.7,53.55-29.75,114.75C13.016,291.185,204.833,417.268,213.05,422.652z     M56.083,78.685c17.283-18.983,38.817-21.817,50.15-21.817c7.367,0,14.45,1.133,20.967,3.4    c39.383,13.317,70.833,63.467,71.4,63.75c3.117,5.1,8.783,8.217,14.733,7.933c5.95,0,11.333-3.4,14.45-8.5    c0.283-0.567,28.617-48.733,85.283-69.983c4.817-1.7,10.767-2.833,16.717-2.833c20.967,0,42.217,10.483,56.95,27.767    c19.267,22.667,25.783,55.533,18.983,94.633c-7.367,43.067-42.5,94.633-101.717,149.317c-33.433,30.883-66.3,54.683-81.6,65.45    c-16.15-11.05-51-36.55-86.417-68.85C74.216,262.285,39.366,209.868,35.116,167.368C31.433,128.552,38.516,97.952,56.083,78.685z"/></g></g></svg>
  1194. </a>
  1195. </div>
  1196. {block:ContentSource}<a title="SOURCE: {SourceTitle}" href="{SourceURL}" ><i>&copy;</i></a>{/block:ContentSource}&nbsp;
  1197. {block:NoteCount}<a href="{Permalink}" style="margin-left:0px;"><i class="lnr lnr-thumbs-up" style="font-size:10px;"></i> {NoteCount}</a>{/block:NoteCount}
  1198. {block:HasTags}<div class="tags">
  1199. {block:Tags}<a href="{TagURL}">#{Tag} </a> {/block:Tags}</div>
  1200. {/block:HasTags}
  1201.  
  1202. </div>
  1203. {/block:date}
  1204.  
  1205.  
  1206.  
  1207.  
  1208.  
  1209. {block:PostNotes}<div class="note">
  1210. {PostNotes}</div>{/block:PostNotes}
  1211.  
  1212. </div>
  1213. {/block:posts}
  1214.  
  1215. {block:Pagination}
  1216. <div id="pagi">
  1217. {block:PreviousPage}<a href="{PreviousPage}"><span class="lnr lnr-chevron-left"></span>&nbsp;</a>
  1218. {/block:PreviousPage}
  1219. {block:NextPage}<a href="{NextPage}">&nbsp;<span class="lnr lnr-chevron-right"></span></a>
  1220. {/block:NextPage}
  1221. </div>
  1222. {/block:Pagination}
  1223.  
  1224.  
  1225. </div>
  1226.  
  1227. {block:ifUpdatesTab}
  1228. <div id="updates">
  1229.  
  1230. <div id="tab1"><div id="star1"><a style="color:{color:text};"><span class="lnr lnr-star"></span></a></div>
  1231. <div id="star1_content"><u>{text:updates tab 1 title}</u><br>{text:updates tab 1 content}</div></div>
  1232. <div id="tab2"><div id="star2"><a style="color:{color:text};"><span class="lnr lnr-star"></span></a></div>
  1233. <div id="star2_content"><u>{text:updates tab 2 title}</u><br>{text:updates tab 2 content}</div></div>
  1234. <div id="tab3"><div id="star3"><a style="color:{color:text};"><span class="lnr lnr-star"></span></a></div>
  1235. <div id="star3_content"><u>{text:updates tab 3 title}</u><br>{text:updates tab 3 content}</div></div></div>
  1236.  
  1237. {/block:ifUpdatesTab}
  1238. </div>
  1239.  
  1240.  
  1241.  
  1242. <div id="credit"><a title="THEME BY CHELLE" href="https://the-jedi.tumblr.com/"><img src="https://68.media.tumblr.com/62496251ce73eb90b955cdfa12c0ac83/tumblr_op9av3V2XR1tbtydxo2_r1_75sq.png"/></a></div>
  1243.  
  1244. </div>
  1245. </div>
  1246.  
  1247.  
  1248. </body>
  1249. </html>
Advertisement
Add Comment
Please, Sign In to add comment