Advertisement
ashleyfranqipane

theme 02. young god

Jun 17th, 2015
672
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 12.87 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.     <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <link href='http://fonts.googleapis.com/css?family=Raleway:900&subset=latin,' rel='stylesheet' type='text/css'>
  4. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  5.    
  6.     <head><title>{Title}</title>
  7.     <link rel="shortcut icon" href="{Favicon}">
  8.     <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9.     {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10.    
  11.  
  12.  
  13.  
  14.  
  15.                     <!---
  16.                                
  17.                                
  18.                     a s h l e y f r a n g q a n e
  19.                              @ t u m b l r
  20.                              
  21.                              do not steal or
  22.                       use as a base code, thanks!
  23.                                  
  24.                                  
  25.                                                 --->
  26.  
  27.  
  28.  
  29. <meta name="color:Background" content="#ffffff" />
  30. <meta name="color:Bold" content="#ffffff" />
  31. <meta name="color:italic" content="#ffffff" />
  32. <meta name="color:links" content="#000000" />
  33. <meta name="color:text" content="#000000" />
  34. <meta name="color:border" content=""/>
  35. <meta name="color:scrollbar" content=""/>
  36. <meta name="color:scrollbarbg" content=""/>
  37.  
  38. <meta name="if:coverbg" content="1"/>
  39.  
  40. <meta name="text:link 1" content=""/>
  41. <meta name="text:text link 1" content=""/>
  42. <meta name="text:link 2" content=""/>
  43. <meta name="text:text link 2" content=""/>
  44.  
  45. <meta name="image:sidebar" content=""/>
  46.  
  47.  
  48. <style type="text/css">
  49.  
  50. ::-webkit-scrollbar-thumb {
  51. height:auto;
  52. background-color:{color:Scrollbar};
  53. }
  54.  
  55. ::-webkit-scrollbar {
  56. height:9px;
  57. width:4px;
  58. background-color:{color:ScrollbarBg};
  59. }
  60.  
  61. body {
  62. background:{color:background};
  63. margin:0px;
  64. color:{color:text};
  65. font-family: 'Raleway', sans-serif;
  66. font-size:10px;
  67. line-height:100%;
  68. letter-spacing:0px;
  69. text-align:justify;
  70. }
  71.      
  72. a {
  73. text-decoration:none;
  74. outline:none;
  75. -moz-outline-style:none;
  76. color:{color:Links};
  77. }
  78.  
  79. #tumblr_controls {
  80.     font-family: 'Raleway', sans-serif;
  81.     opacity: 0.5; -webkit-transition: opacity 0.7s linear;  -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
  82.      
  83.  
  84.  
  85. h8 {
  86. width:100%;
  87. font-size:8px;
  88. text-align:center;
  89. line-height:100%;
  90. letter-spacing:0px;
  91. color:{color:text};
  92. background-color:{color:accent};
  93. text-transform:uppercase;
  94. font-weight:normal;
  95. padding:5px;
  96. }
  97.  
  98. h9 {
  99. font-size:8px;
  100. text-align:right;
  101. line-height:100%;
  102. letter-spacing:0px;
  103. color:{color:text};
  104. text-transform:uppercase;
  105. font-weight:normal;
  106. padding:5px;
  107. }
  108.  
  109. #s-m-t-tooltip {
  110.     max-width:300px;
  111.     padding:3px 4px 5px 4px;
  112.     margin:20px 0px 0px 20px;
  113.     background-color:black;
  114. font-family: 'Raleway', sans-serif;
  115.     font-size:9px;
  116.     letter-spacing:2px;
  117.     text-transform:uppercase;
  118.     color:white;
  119.     z-index:999999999999999999999999999999999999;
  120. }
  121.  
  122.  
  123. blockquote {
  124. border-left:1px solid {color:border};
  125. padding:3px;
  126. margin-left:10px;
  127. }
  128. }
  129.  
  130. img {
  131.     height: auto;
  132.     width:auto;
  133.     max-width:100%;
  134. }
  135.  
  136.   pre {
  137.      background:black;
  138.      color:white;
  139.      padding:5px;
  140.      text-align:justify;
  141. text-transform:uppercase;
  142.  white-space: pre-wrap;      
  143.  white-space: -moz-pre-wrap;
  144.  white-space: -pre-wrap;      
  145.  white-space: -o-pre-wrap;    
  146.  word-wrap: break-word;
  147.      
  148.  }
  149.  
  150.  
  151. h1{
  152.     font-size:20px;
  153. font-family: 'Raleway', sans-serif;
  154.     text-transform:uppercase;
  155.     font-style:italic;
  156.     padding:20px;
  157.     background:black;
  158.     color:white;
  159.     font-weight:bold;
  160. }
  161.  
  162. li:before {    
  163. font-family: 'FontAwesome';
  164. content: '\f205';
  165. margin:0 5px 0 -15px;
  166. color: black;
  167. }
  168.      
  169. a:hover {
  170. color:#000000;
  171. -moz-transition-duration:0.3s;
  172. -webkit-transition-duration:0.3s;
  173. -o-transition-duration:0.3s;
  174. }
  175.  
  176.  
  177. /*ENTRIES*/
  178.  
  179. #postcontainer {
  180.     position:static;
  181.     margin-left:36px;
  182.     margin-right:auto;
  183.     width: 520px;
  184.     overflow:hidden;
  185.     text-align:center;
  186.     margin-bottom:0px;
  187.     margin-top:30px;
  188. }
  189.  
  190.  
  191. .container {
  192.     height:100%;
  193.     width:590px;
  194.     overflow:auto;
  195.     margin-left:535px;
  196.     margin-top:0px;
  197.     margin-bottom:0px;
  198.     border-left:1px solid {color:border};
  199.     border-right:1px solid {color:border};
  200.     z-index:-9999;
  201.     background:white;
  202. }
  203. /*SIDEBAR*/
  204.  
  205. #title {
  206.     margin-top:20px;
  207.     margin-left:-40px;
  208.     padding-left:30px;
  209.    
  210.     width:280px;
  211.     font-size:20px;
  212.     padding-bottom:2px;
  213.     line-height:100%;
  214.     text-transform:uppercase;
  215.     text-align:left;
  216. font-family: 'Raleway', sans-serif;
  217.      font-weight:bold;
  218.     color:black;
  219.     letter-spacing:-1px;
  220.     border-bottom:1px solid black;
  221. }
  222.  
  223. #sidebar {
  224. position:fixed;
  225. height:440px;
  226. padding:7px;
  227. margin-top:100px;
  228. margin-left:150px;
  229. background:white;
  230. }
  231.      
  232. #sidebarimage {
  233. width:210px;
  234.  
  235. }
  236.      
  237. #sidebarimage img {
  238. margin-top:10px;
  239. width:120px;
  240. margin-left:-8px;
  241. }
  242.    
  243.  
  244. .links {
  245. width:300px;
  246. font-family: 'Raleway', sans-serif;
  247. padding: 4px;
  248. line-height:160%;
  249. text-align:left;
  250. text-transform:uppercase;
  251. position:fixed;
  252. margin-top:-32px;
  253. margin-left:135px;
  254. z-index:99999999999;
  255.  
  256. }
  257.      
  258. .links a {
  259. width:300px;
  260. padding:7px;
  261.     line-height:100%;
  262. font-size:16px;
  263. letter-spacing:0px;
  264. color:{color:Sidebar Links};
  265. -webkit-transition: all 0.4s ease-in-out;
  266. -moz-transition: all 0.4s ease-in-out;
  267. -o-transition: all 0.4s ease-in-out;
  268. -ms-transition: all 0.4s ease-in-out;
  269. transition: all 0.4s ease-in-out;
  270. }
  271.      
  272. .links a:hover {
  273.     line-height:100%;
  274. -webkit-transition: all 0.4s ease-in-out;
  275. -moz-transition: all 0.4s ease-in-out;
  276. -o-transition: all 0.4s ease-in-out;
  277. -ms-transition: all 0.4s ease-in-out;
  278. transition: all 0.4s ease-in-out;
  279. color:{color:hover};
  280. }  
  281.  
  282. #description {
  283. text-align:justify;
  284. font-family: 'Raleway', sans-serif;
  285. width:110px;
  286. margin-top:-40px;
  287. padding-left:13px;
  288. padding-top:80px;
  289. margin-left:123px;
  290. padding-bottom:30px;
  291. font-size:9px;
  292. position:fixed;
  293. text-transform:none;
  294. color:black;
  295. border-left:1px solid {color:border};
  296. }
  297.  
  298.  
  299.  
  300.  
  301. /*POST INFO*/
  302.  
  303. #container {
  304.     position:fixed;
  305. height:440px;
  306. padding:7px;
  307. margin-left:100px;
  308. margin-top:30px;
  309. margin-left:170px;
  310. border:1px solid {color:border};
  311.    
  312. }
  313.  
  314. article {
  315.     float:left;
  316.     background:{color:posts};
  317.     padding: 10px;
  318.     width: 500px;
  319.     text-align:left;
  320.     margin-bottom:50px;
  321. }
  322.  
  323. .postinfo{
  324.     color:{color:links};
  325.     padding:10px;
  326.     margin-top:10px;
  327.     font-weight:bold;
  328.     border-top:1px solid {color:border};
  329. }
  330.  
  331. ol.notes {
  332.     display:block;
  333.     text-align:left;
  334.     list-style-type:none;
  335.     margin-left:-40px;
  336. }
  337.  
  338. ol.notes li.note{
  339.     margin-bottom:5px;
  340. }
  341.  
  342. .pagenotes {
  343.     text-align:left;
  344.     margin-top:15px;
  345. }
  346.  
  347. .pagenotes img{
  348.     padding-right:5px;
  349.     padding-top:5px;
  350.     margin-bottom:-5px;
  351. }
  352.  
  353.  
  354.  
  355. /*CHAT*/
  356.  
  357. ul.chat{
  358.     list-style:none;
  359.     margin-left:-40px;
  360. }
  361.  
  362. .chat span {
  363.     float: left;
  364. }
  365.  
  366. p.chat {
  367.     padding-left:3px;
  368. }
  369.  
  370. /*QUOTES*/
  371.  
  372. .quote{
  373.     font-size:20px;
  374.     line-height:150%;
  375. }
  376.  
  377. .quotesource{
  378.     text-align:right;
  379.     margin-bottom:10px;
  380. }
  381.  
  382. /*AUDIO*/
  383.  
  384. .songart{
  385.     float:left;
  386.     margin-right:10px;
  387. }
  388.  
  389. .songart img{
  390.     width:80px;
  391.     height:80px;
  392. }
  393.  
  394. .songtitle{
  395.     margin-bottom:10px;
  396.     margin-left:90px;
  397. }
  398.  
  399. .songauthor{
  400.     margin-bottom:10px;
  401.     font-size:8px;
  402.     margin-left:90px;
  403. }
  404.  
  405. .tumblr_audio_player {
  406.     height: 50px;
  407. }
  408.  
  409. /*PAGINATION*/
  410.  
  411. #pagination {
  412.     margin-top:-155px;
  413.     text-align:center;
  414.     margin-left:80px;
  415.     position:fixed;
  416.     background:{color:pagi};
  417.     height:10px;
  418.     width:220px;
  419.     font-size:10px;
  420. font-family: 'Raleway', sans-serif;
  421.     text-transform:uppercase;
  422.     font-style:italic;
  423.     padding:4px;
  424. }
  425.  
  426. /*QUESTION*/
  427.  
  428. #asker {
  429. color:#fcfcfc;
  430. padding:14px;
  431. font-family: 'Raleway', sans-serif;
  432. font-size:11px;
  433. letter-spacing:0px;
  434. text-align:left;
  435. margin-top:0px;
  436. text-transform:lowercase;
  437. line-height:100%;
  438. }
  439.  
  440. /*CREDIT*/
  441.  
  442. #cred {
  443. position:fixed;
  444. font-family: 'Raleway', sans-serif;
  445. text-transform:uppercase;
  446. font-size:8px;
  447. right:9px;
  448. bottom:9px;
  449. padding:4px;
  450. letter-spacing:1px;
  451. }
  452.  
  453. {CustomCSS}</style></head><body>
  454.  
  455.  
  456. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  457. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  458. <script>
  459.  
  460. (function($){
  461.  
  462. $(document).ready(function(){
  463.  
  464. $("a[title]").style_my_tooltips({
  465.  
  466. tip_follows_cursor:true,
  467.  
  468. tip_delay_time:50,
  469.  
  470. tip_fade_speed:600,
  471.  
  472. attribute:"title"
  473.  
  474. });
  475.  
  476. });
  477.  
  478. })(jQuery);
  479.  
  480. </script>  
  481.  
  482. <div id="sidebar">
  483. <div id="title">{Title}
  484.  
  485. <div class="links">
  486. <a href="/" title="refresh"> <i class="fa fa-h-square"></i> </a>
  487. <a href="/ask" title="message"> <i class="fa fa-envelope-square"></i> </a>
  488. <a href="{text:Link 1}" title="{text:link 1 text}"> <i class="fa fa-pencil-square"></i> </a>
  489. <a href="{text:Link 2}" title="{text:link 2 text}"> <i class="fa fa-plus-square"></i></a>
  490.  
  491.  </div></div>
  492.  <div id="description">
  493. {description}
  494.  
  495.  
  496. </div>
  497.  
  498. <div id="sidebarimage">
  499.  
  500. <img src="{image:Sidebar}">
  501.  
  502. </div>
  503.  
  504.  
  505.  
  506. {block:Pagination}
  507. <div id="pagination">
  508. {block:PreviousPage}<a href="{PreviousPage}"><i class="fa fa-chevron-circle-left"></i></a>{/block:PreviousPage} &nbsp; &nbsp; &nbsp; &nbsp;
  509.  {block:NextPage}<a href="{NextPage}"><i class="fa fa-chevron-circle-right"></i></a>{/block:NextPage}
  510. </div>
  511. {/block:Pagination}
  512. </div>
  513.  
  514. <div class="container">
  515. <div id="postcontainer">
  516.        
  517. {block:Posts}
  518. <article>
  519.  
  520. <!--TEXT POST-->
  521. {block:Text}
  522.     {block:Title}
  523.     <h1 class="title">{Title}</h1>
  524.     {/block:Title}
  525.     {Body}
  526. {/block:Text}
  527.  
  528.  
  529. <!--PHOTO POST-->
  530. {block:Photo}
  531.     {block:IndexPage}
  532.     {LinkOpenTag}
  533.     <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  534.     {LinkCloseTag}
  535.     {/block:IndexPage}
  536.     {block:PermalinkPage}
  537.     {LinkOpenTag}
  538.     <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  539.     {LinkCloseTag}{/block:PermalinkPage}
  540. {/block:Photo}
  541.  
  542.  
  543. <!--PHOTOSET POST-->
  544. {block:Photoset}
  545.     {block:IndexPage}{Photoset-500}{/block:IndexPage}
  546.     {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  547. {/block:Photoset}
  548.  
  549.  
  550. <!--QUOTE POST-->
  551. {block:Quote}
  552.     <div class="quote">{Quote}</div>
  553.     {block:Source}
  554.     <div class="quotesource">{Source}</div>
  555.     {/block:Source}
  556. {/block:Quote}
  557.  
  558.  
  559. <!--LINK POST-->
  560. {block:Link}
  561.     <h1 class="title"><a href="{URL}">{Name}</a></h1>
  562.     {block:Description}{Description}{/block:Description}
  563. {/block:Link}
  564.  
  565.  
  566. <!--CHAT POST-->
  567. {block:Chat}
  568.     <ul class="chat">
  569.         {block:Lines}<li class="{Alt}">{block:Label}<span class="label"style="font-weight:bold;text-transform:uppercase;text-decoration:underline;">{Label}</span>{/block:Label}  <p> {Line} </p></li>{/block:Lines}
  570.     </ul>
  571. {/block:Chat}
  572.  
  573.  
  574. <!--AUDIO POST-->
  575. {block:Audio}
  576.     {block:AlbumArt}
  577.     <div class="songart">
  578.         <img src="{AlbumArtURL}">
  579.     </div>
  580.     {/block:AlbumArt}
  581.     <div class="songtitle">
  582.         {block:TrackName}
  583.         {TrackName}
  584.         {/block:TrackName}
  585.     </div>
  586.     <div class="songauthor">
  587.         By
  588.         {block:Artist}
  589.         {Artist}
  590.         {/block:Artist}
  591.     </div>
  592.     {AudioPlayerWhite}
  593. {/block:Audio}
  594.  
  595.  
  596. <!--VIDEO POST-->
  597. {block:Video}
  598. <div class="video">
  599.     <div class="video-player">{Video-500}</div>
  600. {/block:Video}
  601.  
  602.  
  603. <!--ANSWER POST-->
  604. {block:Answer}<b><span style ="background:black;color:white;padding:2px">{Asker} inquired,</span></b> <div id="ask" style="text-align:left;margin-left:0px;margin-top:0px;font-style:italic;padding:15px;font-size:10px;font-color:{color:text};font-family:arial;text-transform:lowercase;letter-spacing:0px;border:1px solid {color:border};margin-top:2px">{Question}</span></div>{Answer}{/block:Answer}
  605.  
  606. <!--CAPTIONS-->
  607.  
  608.  
  609.     {block:Caption}
  610.         {Caption}
  611.     {/block:Caption}
  612.  
  613.  
  614. <!--POST INFORMATION-->
  615. <div class="postinfo">
  616.  
  617.     <!--PERMALINK-->
  618.  
  619.         {block:Date}
  620.         <a href="{Permalink}"> {TimeAgo} </a>
  621.         {/block:Date}
  622.  
  623.    ✕
  624.     <!--NOTES-->
  625.     {block:NoteCount}
  626.         <a href="{Permalink}"> {NoteCount} </a>
  627.     {/block:NoteCount}
  628.    
  629.     ✕  {block:ContentSource} <a href="{SourceURL}">via</a>{/block:ContentSource}
  630.    <br>
  631. <br>{block:Tags}
  632.  <i class="fa fa-tag"></i> {tag}{/block:tags}
  633.        
  634. </div>
  635.  
  636. <!--POST NOTES-->
  637. {block:PostNotes}
  638.     <div class="pagenotes">{PostNotes-16}</div>
  639. {/block:PostNotes}
  640.  
  641.  
  642. </article>
  643. {/block:Posts}
  644. <!--Close of article-->
  645.  
  646.  
  647.  
  648. </div>
  649.  </div>
  650.  
  651.    
  652. <div id="cred">
  653. <a href="http://ashleyfrangqane.tumblr.com">✕</a>  
  654.  
  655. </div>
  656. </div>
  657.  
  658.  
  659.        
  660.     </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement