chellescodes

STARBORNE color tumblr theme

Jun 17th, 2017
1,080
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 29.49 KB | None | 0 0
  1. <!--
  2.  
  3. =========DMMMM============DDDMMMMD=====M
  4. =====IMM====MMMN=========+MMMMMMMM=====M
  5. ===NM======MMMMM=======MMMMM==?MMMDD===M
  6. =+D~=======MM=NMM====MMMMM====MMM8==DD=M
  7. OD========MMN==MMM=MMMMM=====MMMM====NDM
  8. DD=======MMM===MMMMMMM======+MMM======DM
  9. D=======MMM=====MMMM========MMM=======DD
  10. D8=====MMM======MM==========MM========DM
  11. DD====MMM=======D===========MM=======DDM
  12. =$D==MMD====================M=======DD=M
  13. ===NMM======================M=====ND===M
  14. ===M=ODD=======================MDN=====M
  15. =========DDNN=============IDDD=========M
  16. ================7MDDDD8================M
  17.                    
  18.     CODE BY CHELLE, AKA @THE-JEDI
  19.        PLEASE LEAVE THE CREDIT
  20.  DO NOT STEAL THE ENTIRE/BIG CHUNKS
  21.    OF THE CODE AND DISTRIBUTE IT
  22.        AS IF IT WERE YOUR OWN
  23.  
  24.  
  25. NOTES ON THIS THEME:
  26.  
  27. DISCLAIMER: I DO NOT OWN STAR WARS OR ANYTHING ASSOCIATED WITH IT. BUT I DID MAKE THIS CODE.
  28.  
  29. Special thanks to @shythemes for the video resizing and custom like/reblog tutorials.
  30.  
  31. Please consult the-jedi.tumblr.com/my+theme for tips on how to best utilize this theme.
  32. For help, first consult the-jedi.tumblr.com/tagged/theme+help, or the-jedi.tumblr.com/tagged/starbornetheme.
  33. If you don't find an answer to your query, go to the-jedi.tumblr.com/ask with your question.
  34.  
  35. -->
  36.  
  37. <!DOCTYPE html>
  38.  
  39. <head>
  40. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  41. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.6/SmoothScroll.min.js"></script>
  42. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  43. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  44. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  45. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  46. <script type="text/javascript" src="http://static.tumblr.com/iuggpng/bGqm4yfv9/jquery-1.7.2.js"></script>
  47. <link href="https://fonts.googleapis.com/css?family=Alegreya+Sans|Alegreya+Sans+SC" rel="stylesheet">
  48.  
  49.  
  50.     <meta name="color:background" content="#f8f8f8">
  51.     <meta name="color:posts background" content="#ffffff">
  52.     <meta name="color:links" content="#94c5e7">
  53.     <meta name="color:links hover" content="#e2e2e2">
  54.     <meta name="color:text" content="#929292">
  55.     <meta name="color:ask and link post background" content="#9fd7ff">
  56.     <meta name="color:topbar" content="#96d3ff">
  57.     <meta name="color:title" content="#ffffff">
  58.     <meta name="color:border" content="#eaeaea">
  59.     <meta name="color:updates stars" content="#82b2d4">
  60.    
  61.     <meta name="text:post width" content="500" />
  62.     <meta name="text:to pick new link icons, go to this site" content="https://linearicons.com/free">
  63.     <meta name="text:about link" content="/about" />
  64.     <meta name="text:about link title" content="about" />
  65.     <meta name="text:link 1 URL" content="/" />
  66.     <meta name="text:link 1 icon" content="tag"/>
  67.     <meta name="text:link 1" content="link 1" />
  68.     <meta name="text:link 2 URL" content="/" />
  69.     <meta name="text:link 2 icon" content="cog"/>
  70.     <meta name="text:link 2" content="link 2" />
  71.     <meta name="text:link 3 URL" content="/" />
  72.     <meta name="text:link 3 icon" content="book"/>
  73.     <meta name="text:link 3" content="link 3" />
  74.     <meta name="text:link 4 URL" content="/" />
  75.     <meta name="text:link 4 icon" content="pencil"/>
  76.     <meta name="text:link 4" content="link 4" />
  77.     <meta name="text:updates tab 1 title" content="Tab 1" />
  78.     <meta name="text:updates tab 1 content" content="updates here" />
  79.     <meta name="text:updates tab 2 title" content="Tab 2" />
  80.     <meta name="text:updates tab 2 content" content="updates here" />
  81.     <meta name="text:updates tab 3 title" content="Tab 3" />
  82.     <meta name="text:updates tab 3 content" content="updates here" />
  83.  
  84.     <meta name="if:webkit scroll bar" content="1">
  85.     <meta name="if:hover tags" content="1">
  86.     <meta name="if:updates tab" content="1">
  87.     <meta name="if:extra links" content="1">
  88.     <meta name="if:lazy load" content="1">
  89.     <meta name="if:show submit link" content="0">
  90.  
  91.     <meta name="image:topbar" content="">
  92.     <meta name="image:background" content="">
  93.  
  94. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  95.  
  96. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  97.  
  98. {block:ifLazyLoad}
  99. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  100. <script type="text/javascript" charset="utf-8">
  101. var $j = jQuery.noConflict();
  102. $j(function() {
  103. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  104. $j("img").lazyload({
  105. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  106. effect: "fadeIn",
  107. });
  108. });
  109. </script>
  110. {/block:ifLazyLoad}
  111.  
  112.  
  113.  
  114. <script>
  115. (function($){$(document).ready(function(){
  116. $("a[title]").style_my_tooltips({tip_follows_cursor:true,
  117. tip_delay_time:75, tip_fade_speed:600,attribute:"title"});});})(jQuery);
  118.  
  119. </script>
  120.  
  121.  
  122.  
  123.  
  124.  
  125. <script>
  126.     $(document).ready(function(){
  127.         $(".controloptions").click(function(){
  128.             $("#controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls, .tmblr-iframe-compact .tmblr-iframe--unified-controls").fadeToggle();
  129.         });
  130.     });
  131.    
  132. </script>
  133.  
  134. <script>
  135.     $(document).ready(function(){
  136.         $("#xlink").click(function(){
  137.         $("#extralinks").fadeToggle("linear");
  138.            
  139.         });
  140.     });
  141. </script>
  142.  
  143.  
  144.  
  145.  
  146.  
  147. <title>{Title}{block:PostSummary} | {PostSummary}{/block:PostSummary}{block:TagPage} | {Tag}{/block:TagPage}</title>
  148. <link rel="shortcut icon" href="{Favicon}" />
  149. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  150. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  151.  
  152.  
  153. <style type="text/css">
  154.  
  155. #s-m-t-tooltip {
  156. max-width:300px;
  157. background-color:{color:posts background};
  158. font-size:10px;
  159. font-family:'Alegreya Sans', sans-serif;
  160. padding:3px 3px 3px 3px;
  161. text-transform: lowercase;
  162. color:{color:text};
  163. letter-spacing:1px;
  164. margin:10px 0px 0px 20px;
  165. z-index:9999999999999999999999;
  166. border:1px solid {color:border};
  167.  
  168. }
  169.  
  170. body {
  171. background-color:{color:background};
  172. font-size:10px;
  173. font-family:'Alegreya Sans', sans-serif;
  174. font-weight:normal;
  175. margin:0px;
  176. top:0;
  177. left:0;
  178. word-wrap:break-word;
  179. }
  180.  
  181.  
  182. {block:IfWebkitScrollBar}
  183.  ::-webkit-scrollbar-thumb {
  184.     height:auto;
  185.     background-color: {color:topbar};
  186.     border:2px solid {color:border};
  187.     }
  188.     ::-webkit-scrollbar {
  189.     height:9px;
  190.     width:9px;
  191.     background-color: {color:background};
  192.     }  
  193. {/block:IfWebkitScrollBar}
  194.  
  195.  
  196.     a {
  197.     color:{color:links};
  198.     text-decoration:none;
  199.     -moz-transition-duration:0.5s;
  200.     -webkit-transition-duration:0.5s;
  201.     -o-transition-duration:0.5s;
  202.     }
  203.     a:hover {
  204.     color:{color:links hover};
  205.     text-decoration:none;
  206.     -moz-transition-duration:0.5s;
  207.     -webkit-transition-duration:0.5s;
  208.     -o-transition-duration:0.5s;
  209.     }
  210.  
  211.  
  212. h1 {
  213.     font-size:16px;
  214.     font-weight:normal;
  215.     letter-spacing:0px;
  216.     line-height:120%;
  217. }
  218.  
  219. h1 a{
  220.     color:{color:text};
  221. }
  222.  
  223. h1 a:hover {
  224.     color:{color:links};
  225. }
  226.  
  227. h2 {
  228.     text-decoration:none;
  229.     font-size:16px;
  230.     text-align:center;
  231.     line-height:110%;
  232.     color:{color:text};
  233.     padding:5px;
  234.     padding-bottom:2px;
  235.     font-weight:normal;
  236.     letter-spacing:0px;
  237. }
  238.  
  239. h3 {
  240.     font-weight:normal;
  241.     font-size:17px;
  242.     text-align:center;
  243.     font-style:normal;
  244.     color:{color:text};
  245. }
  246.  
  247. blockquote {
  248. border-left:2px solid {color:text};
  249. padding-left:5px;
  250. margin:5px;
  251. padding-top:2px;
  252. padding-bottom:2px;
  253. }
  254.  
  255.  
  256. #theme {
  257.     margin:auto;
  258.     width:875px;
  259.     padding:0;
  260.     width:100%;
  261.     text-align: center;
  262.     background:{color:background};
  263.     z-index:5;
  264.     position:relative;
  265. }
  266.  
  267. #bg {
  268.     width:100%;
  269.     height:100%;
  270.     margin-top:-20px;
  271.     z-index:-1;
  272.     position:fixed;
  273. }
  274.  
  275.  
  276. #top {
  277.     width:100%;
  278.     height:40px;
  279.  
  280.     position:fixed;
  281.     top:0;
  282.     left:0;
  283.     float:right;
  284.     border-bottom:1px solid {color:border};
  285.     z-index:99998;
  286.     background:{color:topbar};
  287. }
  288.  
  289. #other_controls {
  290.     float:right;
  291.     width:100%;
  292.     position:fixed;
  293.     margin-top:-80px;
  294.     z-index:9999999999999;
  295. }
  296.  
  297. #toplinks {
  298.  
  299.     font-size:12px;
  300.     color:{color:title};
  301.     float:right;
  302.  
  303. margin-right:15px;
  304. display:fixed;
  305.     margin-top:93px;
  306.     font-family:Hind;
  307.     cursor:pointer;
  308.     -moz-transition-duration:0.4s;
  309.     -webkit-transition-duration:0.4s;
  310.     -o-transition-duration:0.4s;
  311.     text-decoration:none;
  312.     z-index:999999999999999999;
  313. }
  314.  
  315. #toplinks:hover  {
  316.     color:{color:links hover};
  317.     float:right;    
  318.  
  319.     -moz-transition-duration:0.4s;
  320.     -webkit-transition-duration:0.4s;
  321.     -o-transition-duration:0.4s;
  322.  
  323. }
  324.  
  325. #toplinks a {
  326.     color:{color:title};
  327. }
  328.  
  329.  
  330.  
  331.  
  332. #controls, .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls, .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  333.   animation: fadin 2s;
  334.  margin-top:7px;
  335.     opacity:.5!important;
  336.     position:fixed!important;
  337.     right:60px!important;
  338.     z-index:999999999999999!important;
  339.     display:none;
  340. -webkit-animation: fadein 2s;
  341. -moz-animation: fadein 2s;
  342. -ms-animation: fadein 2s;
  343.  -o-animation: fadein 2s;
  344. }
  345.  
  346. @keyframes fadein {
  347.     from { opacity: 0; }
  348.     to   { opacity: 1; }
  349. }
  350.  
  351. @-moz-keyframes fadein {
  352.     from { opacity: 0; }
  353.     to   { opacity: 1; }
  354. }
  355.  
  356. @-webkit-keyframes fadein {
  357.     from { opacity: 0; }
  358.     to   { opacity: 1; }
  359. }
  360.  
  361. @-ms-keyframes fadein {
  362.     from { opacity: 0; }
  363.     to   { opacity: 1; }
  364. }
  365.  
  366. @-o-keyframes fadein {
  367.     from { opacity: 0; }
  368.     to   { opacity: 1; }
  369. }
  370.  
  371.  
  372.  
  373.  
  374. #topimg {
  375.     float:left;
  376.     display:block;
  377.     margin-top:80px;
  378.     margin-left:205px;
  379.     position:fixed;
  380.     z-index:999999999999999;
  381.    
  382. }
  383.  
  384. #topimg img {
  385.     float:left;
  386.     display:inline-block;
  387.     margin-top:-85px;
  388.     width:80px;
  389.     height:80px;
  390.     border-radius:100px;
  391.     border: 10px solid {color:topbar};
  392.     z-index:-1;
  393.     position:fixed;
  394. }
  395.  
  396. #top2 {
  397.     width:100%;
  398. }
  399. #topimgb {
  400.     width:100px;
  401.     background: #fff;
  402.     height:100px;
  403.     border:1px solid {color:border};
  404.     z-index:1000;
  405.     position:fixed;
  406.         float:left;
  407.  
  408.     border-radius:100px;
  409.     margin-left:204px;
  410.     margin-top:-6px
  411. }
  412.  
  413.  
  414. #blogtitle {
  415.     display: inline-block;
  416.     float: left;
  417.     margin-top: 18px;
  418.     padding-right: 4px;
  419.     color: white;
  420.     font-size: 20px;
  421.     text-transform: lowercase;
  422.     font-style: italic;
  423.     z-index:0;
  424.     text-align: right;
  425.     width: 200px;
  426.     height: 20px;
  427.     overflow: hidden;
  428.     padding-bottom: 5px;
  429.    
  430. }
  431.  
  432.  
  433. #blogtitle a{
  434.     color:{color:title};
  435.     -webkit-transition: letter-spacing 2s;
  436.     -webkit-transform 2s;
  437.  
  438. }
  439.  
  440. #blogtitle a:hover{
  441.     letter-spacing: 2px;
  442.     border-top:1px solid {color:text};
  443.     -webkit-transition: letter-spacing 2s;
  444.     -webkit-transform 2s;
  445.    
  446. }
  447.  
  448. #desc {
  449.     width:100px;
  450.     padding-top:5px;
  451.     line-height:10px;
  452.     margin-left:98px;
  453.     text-align:right;
  454.     display:absolute;
  455.     font-size:10px;
  456.     color:{color:text};
  457. }
  458.  
  459. #mainlinks {
  460.     width:110px;
  461.     padding-top:1px;
  462.     padding-bottom:3px;
  463.     font-size:12px;
  464.     position:relative;
  465.     float:right;
  466.     margin-left:22px;
  467. }
  468.  
  469. #mainlinks a:hover {
  470.     color:{color:text};
  471.     font-weight:900;
  472.     border-bottom:1px solid {color:text};
  473. }
  474.  
  475. #homeicon a {
  476.  
  477.     font-size:22px;
  478. }
  479.  
  480. #homeicon a:hover {
  481.     color:{color:text};
  482. }
  483.  
  484. #extralinks {
  485.     display:none;
  486.     z-index:999999999999999999999999;
  487.     float:left;
  488.     margin-left:205px;
  489.     background:{color:topbar};
  490.     margin-top:-5px;
  491.     width:80px;
  492.     height:80px;
  493.     border-radius:100px;
  494.     border: 10px solid {color:topbar};
  495.     position:fixed;
  496.    
  497. }
  498.  
  499.  
  500.  
  501. #thelinks {
  502.     background:{color:topbar};
  503.     position:fixed;
  504.     border-left:2px solid {color:border};
  505.     border-right:2px solid {color:border};
  506.  
  507.     margin-top:14px;
  508.     margin-left:8px;
  509.     border-radius:7px;
  510. }
  511.  
  512.  
  513.  
  514. #alink {
  515.     width:45px;
  516.    
  517.     height:14px;
  518.     padding-right:7px;
  519.     padding-left:7px;
  520.  
  521. text-align:right;
  522.     font-size: 12px;
  523.     color: #000;
  524.     line-height: 12px;
  525.  
  526.    
  527. }
  528.  
  529. #alink a{
  530.     color: {color:title};
  531.      font-size: 10px;
  532.      
  533.    
  534. }
  535.  
  536.  
  537. #alink:hover {
  538.     background:{color:background};
  539.      
  540. }
  541. #alink a:hover{
  542.     color: {color:text};
  543.     font-weight:900;
  544.    border-bottom:1px solid {color:text};
  545.    
  546. }
  547.  
  548. #pagi {
  549.     font-size:16px;
  550.     width:{text:post size}px;
  551.     font-weight:normal;
  552.     font-style:normal;
  553.     text-align:center;
  554.     margin-bottom:50px;
  555.     color:{color:links};
  556.     letter-spacing:0px;
  557. }
  558.    
  559. #pagi a {
  560.     display:inline-block;
  561.     color:{color:links};
  562.     }
  563.    
  564. #pagi a:hover {
  565.     color:{color:links hover};  
  566.     }
  567.  
  568. #postscontainer {
  569.     margin-left:400px;
  570.     margin-top:50px;
  571.     top:20px;
  572.     padding:10px;
  573.     position:absolute;
  574.     text-align:justify;
  575.     color:{color:text};
  576.     z-index:999;
  577.    -webkit-animation: fadein 2s;
  578. -moz-animation: fadein 2s;
  579. -ms-animation: fadein 2s;
  580.  -o-animation: fadein 2s;
  581.     animation: fadein 2s;
  582. }
  583.  
  584. @keyframes fadein {
  585.     from { opacity: 0; }
  586.     to   { opacity: 1; }
  587. }
  588.  
  589. @-moz-keyframes fadein {
  590.     from { opacity: 0; }
  591.     to   { opacity: 1; }
  592. }
  593.  
  594. @-webkit-keyframes fadein {
  595.     from { opacity: 0; }
  596.     to   { opacity: 1; }
  597. }
  598.  
  599. @-ms-keyframes fadein {
  600.     from { opacity: 0; }
  601.     to   { opacity: 1; }
  602. }
  603.  
  604. @-o-keyframes fadein {
  605.     from { opacity: 0; }
  606.     to   { opacity: 1; }
  607. }
  608.  
  609.  
  610. .posts {
  611.     background-color:{color:posts background};
  612.     padding:15px 15px 15px 15px;
  613.     width:{text:post width}px;
  614.     margin-bottom:70px;
  615.     text-align:justify;
  616.     font-size:11px;
  617.     line-height:100%;
  618.     letter-spacing:0px;
  619.     color:{color:text};
  620.     border:1px solid {color:border};
  621.  
  622. }
  623.  
  624.  
  625. .caption {  
  626.     width:{text:post size}px;
  627.     text-align:justify;
  628.     line-height:120%;
  629. }
  630.  
  631. {block:ifHoverTags}
  632. .postinfo {
  633.  height:0px;
  634.  padding:0px;
  635.     opacity:0;
  636.             -moz-transition-duration:0.5s;
  637. -webkit-transition-duration:0.5s;
  638. -o-transition-duration:0.5s;
  639. }
  640.  
  641.     .postinfo a {
  642.     font-style:normal;
  643. }
  644.    
  645.     .postinfo a:hover {
  646.     color:{color:links hover};
  647. }
  648.  
  649.  
  650. .posts:hover .postinfo {
  651.      width:{text:post width}px;
  652.     margin-top:8px;
  653.     left:-10px;
  654.     padding:0px -5px 5px 10px;
  655.     text-align:left;
  656.     line-height:100%;
  657.  
  658.     display:inline-block;
  659.     opacity:1;
  660.     -moz-transition-duration:0.5s;
  661. -webkit-transition-duration:0.5s;
  662. -o-transition-duration:0.5s;
  663.    
  664. }
  665. {/block:ifHoverTags}
  666.  
  667.  
  668. {block:ifNotHoverTags}
  669. .postinfo {
  670.      width:{text:post width}px;
  671.     margin-top:8px;
  672.     left:-10px;
  673.     padding:0px -5px 5px 10px;
  674.     text-align:left;
  675.     line-height:100%;
  676.  
  677.     display:inline-block;
  678.     opacity:1;
  679.     -moz-transition-duration:0.5s;
  680. -webkit-transition-duration:0.5s;
  681. -o-transition-duration:0.5s;
  682.    
  683. }
  684. {/block:ifNotHoverTags}
  685.  
  686. .dates {
  687.     padding-top:5px;
  688.     display:inline-block;
  689.     font-size:11px;
  690.     text-transform:none;
  691.     font-weight:normal;
  692.     letter-spacing:0px;
  693. }
  694.  
  695. .notesetc {
  696.     display:inline-block;
  697.     }
  698.  
  699. .tags {
  700.     text-transform:none;
  701.     font-size:10px;
  702.     text-align:left;
  703.     margin-top:2px;
  704.     }
  705.  
  706.  
  707.  
  708. .chat ol {
  709.     line-height:170%;
  710.     list-style:none;
  711.     width:{text:post size}px;
  712.     margin-left:-40px;
  713. }
  714.  
  715. .line.odd {
  716.     background:#f6f6f6;
  717.     margin-bottom:0px;
  718.     padding:4px;
  719. }
  720.  
  721. .line.even {
  722.     background:#fafafa;
  723.     margin-bottom:0px;
  724.     padding:4px;
  725. }
  726.  
  727. .label {
  728.     padding-right:2px;
  729.     text-transform:normal;
  730.     font-weight:bold;
  731.     color:{color:link};
  732. }
  733.  
  734. .note {
  735.     text-transform:uppercase;
  736.     font-style:normal;
  737.     letter-spacing:0px;
  738.     font-size: 9px;
  739.     text-align:left;
  740.     line-height:90%;
  741.     margin-left:-40px;
  742. }
  743.  
  744. .note li {
  745.     list-style-type:none;
  746.     padding:10px 25px 10px 25px;
  747.     text-align:left;
  748.     margin:0px;
  749.     -moz-transition-duration:0.5s;
  750.     -webkit-transition-duration:0.5s;
  751.     -o-transition-duration:0.5s;
  752. }
  753.  
  754. .note img {
  755.    border-radius:100px;
  756.    padding:0px 2px 0px 2px;
  757. }
  758.  
  759.  
  760.  
  761. /** this is the styling for the ask posts **/
  762. .question {
  763.     margin-top:10px;
  764.     background-color: {color:ask and link post background};
  765.     padding:10px;
  766.     padding-bottom:10px;
  767. }
  768.  
  769. #asker {
  770.     height:10px;
  771.     margin-left:60px;
  772.     padding-bottom:0px;
  773. }
  774.  
  775.  
  776. .question a {
  777.     color:{color:title};
  778. }
  779.  
  780. #answer {
  781.     padding-top:20px;
  782.     position:inline;
  783.  
  784.    
  785. }
  786.  
  787. #askpic {
  788.     position:relative;
  789.    
  790.     width:30px;
  791.     padding-left:30px;
  792.     float:left;
  793.  
  794.     display:inline;
  795.    margin-left:-25px;
  796.     top:-10px
  797.     border-radius:100px;
  798. }
  799.  
  800. #askpic img{
  801.     border-radius:100px;
  802.     border:5px solid {color:ask and link post background};
  803. }
  804.  
  805.  
  806.  
  807. #infoabove {
  808.     text-transform:lowercase;
  809.     padding-bottom:10px;
  810.     margin-top:-5px;
  811. }
  812.  
  813. #date {
  814.     float:right;
  815.     margin-right:5px;
  816.     margin-top:3px;
  817.     text-transform:lowercase;
  818. }
  819.  
  820.  
  821.  
  822. #topurl {
  823.    font-size:12px
  824.    left:10px;
  825.    font-weight:bold;
  826. }
  827. /** CUSTOM LIKE AND REBLOG TUTORIAL FROM SHYTHEMES **/
  828.  
  829. svg {
  830.    width:10px;
  831.    height:auto;
  832.    opacity:.5;
  833.    padding:1px;
  834.    display:block;
  835.    overflow:visible;
  836. }
  837.  
  838.  
  839. svg:hover {
  840.         fill:{color:links hover};
  841. }
  842.  
  843. .controls {
  844.  
  845.     float:right;
  846.     margin-top:-5px;
  847. }
  848. .controls a {
  849.    
  850.    position:relative;
  851.    color:{color:link};
  852.    display:inline-block;
  853.    overflow:hidden;
  854.    padding:5px;
  855.    width:12px;
  856.    height:12px;
  857. }
  858. .controls .reblog {
  859.    opacity:.93;
  860. }
  861. .controls .reblog svg {
  862.    width:9px;
  863.    margin-top:1px;
  864. }
  865. .controls .like .liked + svg {
  866.    opacity:1;
  867. }
  868. .controls .like .liked + svg path {
  869.    fill:#ec5a5a;
  870. }
  871. .controls .like .like_button {
  872.    position:relative;
  873. }
  874. .controls .like .like_button iframe {
  875.    position:absolute;
  876.    top:0;
  877.    left:0;
  878.    bottom:0;
  879.    right:0;
  880.    z-index:2;
  881.    opacity:0;
  882. }
  883.  
  884. .like:hover {
  885.         color:{color:link};
  886. }
  887.  
  888.  
  889. .reblog:hover {
  890.         color:{color:link};
  891. }
  892. .controls a:hover {
  893.  color:{color:link};
  894. }
  895.  
  896. .controls:hover {
  897.      color:{color:link};
  898. }
  899.  
  900.  
  901. #updates {
  902.     position:fixed;
  903.     float:left;
  904.     bottom:10px;
  905.     text-align:left;
  906.    
  907.    
  908. }
  909. #tab1, #tab2, #tab3 {
  910.     width:10px;
  911.     height:10px;
  912.       -moz-transition-duration:0.5s;
  913. -webkit-transition-duration:0.5s;
  914. -o-transition-duration:0.5s;
  915.    
  916. }
  917. #star1 {
  918.     cursor:pointer;
  919.     position:absolute;
  920.     margin-top:5px;
  921.     margin-left:20px;
  922.     font-size:17px;
  923.     color:{color:updates stars};
  924. }
  925.  
  926. #star1 a, #star2 a, #star3 a {
  927. color:{color:updates stars}!important;
  928. }
  929.  
  930.  
  931. #tab1:hover #star1_content {
  932.     opacity:1;
  933.       -moz-transition-duration:0.5s;
  934. -webkit-transition-duration:0.5s;
  935. -o-transition-duration:0.5s;
  936. }
  937.  
  938. #tab2:hover #star2_content {
  939.     opacity:1;
  940.       -moz-transition-duration:0.5s;
  941. -webkit-transition-duration:0.5s;
  942. -o-transition-duration:0.5s;
  943. }
  944.  
  945. #tab3:hover #star3_content {
  946.     opacity:1;
  947.       -moz-transition-duration:0.5s;
  948. -webkit-transition-duration:0.5s;
  949. -o-transition-duration:0.5s;
  950. }
  951.  
  952. #star2{
  953.     cursor:pointer;
  954.     position:absolute;
  955.     margin-left:36px;
  956.      margin-top:10px;
  957.     font-size:14px;
  958.     color:{color:updates stars};
  959. }
  960.  
  961. #star3 {
  962.     cursor:pointer;
  963.  position:absolute;
  964.     font-size:12px;
  965.     margin-top:-11px;
  966.     margin-left:50px;
  967.     color:{color:updates stars};
  968. }
  969.  
  970. #updates_content {
  971.     position:fixed;
  972.      background:{color:post background};
  973.     margin-top:-100px;
  974.    
  975. }
  976.  
  977.  
  978. #star1_content {
  979.     opacity:0;
  980.     padding-left:3px;
  981.     position:fixed;
  982.     margin-top:-90px;
  983.     margin-left:27px;
  984.     color:{color:text};
  985.     border-left:1px solid {color:text};
  986.     overflow: scroll;
  987.     width:175px;
  988.     height:100px;
  989.  
  990.  
  991.    
  992. }
  993.  
  994.  
  995. #star2_content  {
  996.      opacity:0;
  997.     padding-left:3px;
  998.     position:fixed;
  999.     margin-top:-87px;
  1000.     color:{color:text};
  1001.     margin-left:43px;
  1002.     border-left:1px solid {color:text};
  1003.     overflow: scroll;
  1004.     width:175px;
  1005.     height:100px;
  1006.    
  1007.  
  1008.    
  1009. }
  1010.  
  1011.  
  1012. #star3_content {
  1013.      opacity:0;
  1014.     padding-left:3px;
  1015.     color:{color:text};
  1016.     position:fixed;
  1017.     margin-top:-110px;
  1018.     margin-left:55px;
  1019.     border-left:1px solid {color:text};
  1020.     overflow: scroll;
  1021.     width:175px;
  1022.     height:100px;
  1023.  
  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. </div>
  1225.  
  1226. {block:ifUpdatesTab}
  1227. <div id="updates">
  1228.  
  1229. <div id="tab1"><div id="star1"><a style="color:{color:text};"><span class="lnr lnr-star"></span></a></div>
  1230. <div id="star1_content"><u>{text:updates tab 1 title}</u><br>{text:updates tab 1 content}</div></div>
  1231. <div id="tab2"><div id="star2"><a style="color:{color:text};"><span class="lnr lnr-star"></span></a></div>
  1232. <div id="star2_content"><u>{text:updates tab 2 title}</u><br>{text:updates tab 2 content}</div></div>
  1233. <div id="tab3"><div id="star3"><a style="color:{color:text};"><span class="lnr lnr-star"></span></a></div>
  1234. <div id="star3_content"><u>{text:updates tab 3 title}</u><br>{text:updates tab 3 content}</div></div></div>
  1235.  
  1236. {/block:ifUpdatesTab}
  1237. </div>
  1238.  
  1239.  
  1240.  
  1241. <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>
  1242.  
  1243. </div>
  1244. </div>
  1245.  
  1246.  
  1247. </body>
  1248. </html>
Advertisement
Add Comment
Please, Sign In to add comment