API tools faq
paste
Advertisement
jmaha19

Tumblr Dopest Theme

jmaha19
Mar 19th, 2012
3,869
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
ALGOL 68 36.32 KB | None | 0 0
raw download clone embed print report
  1. <!doctype html>
  2. <html lang="en">'
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta name="color:Body Background" content="#eee"/>
  6. <meta name="color:Posts Background" content="#FFFFFF"/>
  7. <meta name="color:Posts Title" content="#333"/>
  8. <meta name="color:Posts Text" content="#777"/>
  9. <meta name="color:Posts Links" content="#555"/>
  10. <meta name="color:Posts Hovers" content="#000"/>
  11. <meta name="color:Header Title" content="#333"/>
  12. <meta name="color:Header Description" content="#777"/>
  13. <meta name="color:Header Links" content="#555"/>
  14.  
  15. <meta name="image:Background" content="" />
  16. <meta name="image:Header" content="" />
  17.  
  18. <meta name="if:Post width 150px" content="0" />
  19. <meta name="if:Post width 250px" content="1" />
  20. <meta name="if:Post width 300px" content="0" />
  21. <meta name="if:Post width 400px" content="0" />
  22. <meta name="if:Post width 500px" content="0" />
  23.  
  24. <meta name="if:Post Shadow" content="0" />
  25. <meta name="if:Post Round Borders" content="0" />
  26. <meta name="if:Post Hide Permalinks" content="0" />
  27. <meta name="if:Post Hide Caption" content="1" />
  28. <meta name="if:Header Text Center" content="0" />
  29. <meta name="if:Header Hide Description" content="0" />
  30. <meta name="if:Header BlogRoll" content="0" />
  31. <meta name="if:Full Page Background Image" content="0" />
  32.  
  33. <meta name="text:Post Reblog Title" content="Reblog This" />
  34. <meta name="text:Ask Title" content="Ask" />
  35. <meta name="text:Link 1" content="" />
  36. <meta name="text:Link 1 Title" content="" />
  37. <meta name="text:Link 2" content="" />
  38. <meta name="text:Link 2 Title" content="" />
  39. <meta name="text:Link 3" content="" />
  40. <meta name="text:Link 3 Title" content="" />
  41. <meta name="text:Link 4" content="" />
  42. <meta name="text:Link 4 Title" content="" />
  43. <meta name="text:Link 5" content="" />
  44. <meta name="text:Link 5 Title" content="" />
  45.  
  46. <title>{Title}</title>
  47. <link rel="shortcut icon" href="{Favicon}">
  48. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  49. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  50.  
  51. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  52.  
  53. <link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Open+Sans' type='text/css'>
  54. <link href='http://fonts.googleapis.com/css?family=Dancing+Script:400,700' rel='stylesheet' type='text/css'>
  55. <script type="text/javascript" src="http://static.tumblr.com/8jq17g7/0zflstyxu/cufon-yui.js"></script> <script type="text/javascript" src="http://static.tumblr.com/8jq17g7/Ybtlstytu/bebas_400.font.js"></script> <script type="text/javascript"> Cufon.replace('#header h1, .entry h1');</script><script src="http://static.tumblr.com/8jq17g7/PuRlsuvit/modernizr-transitions.js"></script><script src="http://themes.themaxdavis.com/JS-scripts/ultimate/jquery-1.6.2.js"></script>
  56.  
  57. <style type="text/css">
  58.  
  59. /**** Basic styles ****/
  60. html {
  61.     {block:iffullpagebackgroundimage}
  62.     background:{color:Body Background} url({image:Background}) no-repeat center center fixed;
  63.     -webkit-background-size: cover;
  64.     -moz-background-size: cover;
  65.     -o-background-size: cover;
  66.     background-size: cover;
  67.     {/block:iffullpagebackgroundimage}}
  68. a   {
  69.     color:{color:Posts Links};
  70.     text-decoration:none;
  71.     -webkit-transition: all 0.2s linear;
  72.     -moz-transition: all 0.2s linear;
  73.     transition: all 0.2s linear;}
  74. a:hover{
  75.     color:{color:Posts Hover};
  76.     -webkit-transition: all 0.2s linear;
  77.     -moz-transition: all 0.2s linear;
  78.     transition: all 0.2s linear;}
  79.    
  80. a:active{outline: none;}
  81. a:focus{-moz-outline-style: none;}
  82. :-moz-any-link:focus{outline: none;}
  83. img{border:none;}
  84.  
  85. body {
  86.   font: 11px 'Open Sans', Arial, sans-serif;
  87.   {block:ifNotfullpagebackgroundimage}
  88.   background:{color:Body Background} url({image:Background}) repeat center top;
  89.   {/block:ifNotfullpagebackgroundimage}
  90.   color:{color:Posts Text};}
  91.  
  92.  
  93. /**** Content ****/
  94.  
  95. #content {
  96.   padding: 10px;}
  97.  
  98.  
  99. /**** Blog ****/
  100.  
  101. #container {
  102.   background-color:transparent;
  103.   margin-bottom: 20px;
  104.   clear: both;
  105.   {block:PermalinkPage}
  106.   width:900px;
  107.   margin:auto;
  108.   {/block:PermalinkPage}}
  109.  
  110. .centered { margin: 0 auto; }
  111.  
  112. #header{
  113.     max-width:900px;
  114.     margin:0 auto 20px;
  115.     padding:10px 0;
  116.     color:{color:Header description};
  117.     border-bottom:solid 1px rgba(0,0,0,0.1);}
  118. #header .header_image{
  119.     max-width:1000px;
  120.     max-height:300px;}
  121. #header h1{
  122.     font-size:100px;
  123.     line-height:30px;
  124.     color:{color:Header Title};
  125.     margin:0 auto;
  126.     padding:2;
  127.     word-spacing:20px;
  128.     {block:ifHeaderTextCenter}
  129.     text-align:center;
  130.     {/block:ifHeaderTextCenter}}
  131. #header .description{
  132.     max-width:900px;
  133.     color:{color:HeaderDescription};
  134.     {block:ifHeaderTextCenter}
  135.     text-align:center;
  136.     {/block:ifHeaderTextCenter}
  137.     {block:ifHeaderimage}
  138.     text-align:center;
  139.     {/block:ifHeaderimage}
  140.     {block:ifHeaderHideDescription}
  141.     display:none;
  142.     padding:0 0 10px;
  143.     {/block:ifHeaderHideDescription} }
  144. #header .description_button{
  145.     cursor:help;}
  146. #header .links{
  147.     max-width:1000px;
  148.     padding: 15px 0 0;
  149.     clear: both;
  150.     {block:ifHeaderTextCenter}
  151.     text-align:center;
  152.     {/block:ifHeaderTextCenter}}    
  153. #header .links a{
  154.     padding:0 20px;
  155.     text-transform:uppercase;
  156.     color:{color:HeaderLinks};}
  157. #header .links a:hover{
  158.     color:{color:HeaderDescription};}
  159.    
  160. /**** Blogroll ****/
  161.  
  162. #header .blogroll{
  163.     max-width:500px;
  164.     margin:0 auto;
  165.     display:none;
  166.     {block:ifHeaderTextCenter}
  167.     text-align:center;
  168.     {/block:ifHeaderTextCenter}
  169.     {block:ifHeaderimage}
  170.     text-align:center;
  171.     {/block:ifHeaderimage}
  172.     {block:ifHeaderHideDescription}
  173.     padding:10px 0 0;
  174.     {/block:ifHeaderHideDescription} }
  175. #header .blogroll_button{
  176.     cursor:help;}
  177. #header ul.blogroll_img{
  178.     margin:0;
  179.     padding:0;
  180.     list-style:none;}
  181. #header ul.blogroll_img li{
  182.     float:left;
  183.     height: 22px;}
  184. #header ul.blogroll_img li img{
  185.     width:20px;
  186.     height:20px;
  187.     margin:1px;}
  188.    
  189. /**** Posts ****/
  190.  
  191. .entry {
  192.     background:{color:Posts Background};
  193.     overflow:hidden;
  194.     {block:IndexPage}
  195.     {block:ifpostwidth150px}margin: 5px;{/block:ifpostwidth150px}
  196.     {block:ifpostwidth250px}margin: 5px;{/block:ifpostwidth250px}
  197.     {block:ifpostwidth300px}margin: 5px;{/block:ifpostwidth300px}
  198.     {block:ifpostwidth400px}margin: 10px;{/block:ifpostwidth400px}    
  199.     {block:ifpostwidth500px}margin: 10px;{/block:ifpostwidth500px}
  200.     width:250px;
  201.     padding: 10px;
  202.     float: left;
  203.     {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px}
  204.     {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px}
  205.     {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px}
  206.     {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px}    
  207.     {block:ifpostwidth500px}width:480px;{/block:ifpostwidth500px}
  208.     {/block:IndexPage}
  209.     {block:PermalinkPage}
  210.     width:860px;
  211.     padding: 20px;
  212.     margin-bottom:5px;
  213.     float: left;
  214.     {/block:PermalinkPage}
  215.     {block:ifPostRoundBorders}
  216.     border-radius: 4px;
  217.     {/block:ifPostRoundBorders}
  218.     {block:ifPostShadow}
  219.     box-shadow: 0px 0px 5px rgba(0,0,0,0.1),
  220.                 0px 0px 30px rgba(100, 100, 100, 0.1) inset;
  221.     {/block:ifPostShadow}}
  222. .photo {
  223.     {block:IndexPage}
  224.     padding:0px;background:transparent;
  225.     {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px}
  226.     {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px}
  227.     {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px}
  228.     {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px}    
  229.     {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px}
  230.     {/block:IndexPage}
  231.     {block:PermalinkPage}
  232.     background-color:black;
  233.     float: left;
  234.     width:900px;
  235.     padding:0px;
  236.     {/block:PermalinkPage}}
  237. .video {
  238.     padding:0;
  239.     background-color:black;
  240.     {block:IndexPage}
  241.     {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px}
  242.     {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px}
  243.     {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px}
  244.     {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px}    
  245.     {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px}
  246.     {/block:IndexPage}
  247.     {block:PermalinkPage}
  248.     width:900px;
  249.     float: left;
  250.     {/block:PermalinkPage}}
  251. .audio {
  252.     padding:0;
  253.     background-color:black;
  254.     {block:IndexPage}
  255.     {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px}
  256.     {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px}
  257.     {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px}
  258.     {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px}    
  259.     {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px}
  260.     {/block:IndexPage}
  261.     {block:PermalinkPage}
  262.     width:900px;
  263.     float: left;
  264.     {/block:PermalinkPage}}
  265. .post img{
  266.     height:auto;
  267.     {block:ifpostwidth150px}max-width:140px;{/block:ifpostwidth150px}
  268.     {block:ifpostwidth250px}max-width:240px;{/block:ifpostwidth250px}
  269.     {block:ifpostwidth300px}max-width:290px;{/block:ifpostwidth300px}
  270.     {block:ifpostwidth400px}max-width:390px;{/block:ifpostwidth400px}    
  271.     {block:ifpostwidth500px}max-width:470px;{/block:ifpostwidth500px}}
  272. .container_load {
  273.     margin:10px auto;
  274.     padding: 10px;
  275.     {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px}
  276.     {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px}
  277.     {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px}
  278.     {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px}    
  279.     {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px}
  280.     text-align:center;
  281.     border-top:solid 1px rgba(0,0,0,0.1);}
  282. .entry h1{
  283.     font-size:20px;
  284.     {block:ifpostwidth150px}
  285.     font-size:15px;
  286.     letter-spacing:-0.5px;
  287.     {/block:ifpostwidth150px}
  288.     line-height:30px;
  289.     color:{color:Posts Title};
  290.     margin:0 auto;
  291.     padding:0;}
  292.  
  293. #permalink{
  294.     padding:0;
  295.     margin:15px 0 0;
  296.     text-align:center;
  297.     {block:ifPostHidePermalinks}
  298.     display:none;
  299.     {/block:ifPostHidePermalinks}}
  300. #permalink .notes{float:left;}
  301. #permalink .date{text-align:center;
  302. {block:ifpostwidth150px}display:none;{/block:ifpostwidth150px}
  303. {block:ifpostwidth250px}display:none;{/block:ifpostwidth250px}
  304. {block:ifpostwidth300px}display:none;{/block:ifpostwidth300px}}
  305. #permalink .permalink{float:right;}
  306.  
  307. /**** Posts: Photos ****/
  308.  
  309. #photo {
  310.     overflow:hidden;
  311.     {block:IndexPage}
  312.     max-width:500px;
  313.     {block:ifpostwidth150px}max-width:170px;{/block:ifpostwidth150px}
  314.     {block:ifpostwidth250px}max-width:270px;{/block:ifpostwidth250px}
  315.     {block:ifpostwidth300px}max-width:320px;{/block:ifpostwidth300px}
  316.     {block:ifpostwidth400px}max-width:420px;{/block:ifpostwidth400px}    
  317.     {block:ifpostwidth500px}max-width:500px;{/block:ifpostwidth500px}
  318.     {/block:IndexPage}
  319.     {block:ifPostRoundBorders}
  320.     {block:ifPostHideCaption}
  321.     border-radius: 4px;
  322.     {/block:ifPostHideCaption}
  323.     {block:ifNotPostHideCaption}
  324.     border-top-right-radius: 4px;
  325.     border-top-left-radius: 4px;
  326.     {/block:ifNotPostHideCaption}
  327.     {/block:ifPostRoundBorders}
  328.     {block:PermalinkPage}
  329.     width: 900px;
  330.     {/block:PermalinkPage}}
  331. #photo a{
  332.     color:white;}
  333. #photo a:hover{
  334.     color:white;}
  335. #photo img {
  336.     {block:IndexPage}
  337.     {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px}
  338.     {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px}
  339.     {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px}
  340.     {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px}    
  341.     {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px}
  342.     {/block:IndexPage}
  343.     display:block;}
  344. div#photo div#picture {
  345.     position:relative;}
  346. div#photo div#picture div#info_2 {
  347.      position:absolute;
  348.      top:0;
  349.      left:0;
  350.      opacity:0;
  351.      width:250px;
  352.      {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px}
  353.      {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px}
  354.      {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px}
  355.      {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px}    
  356.      {block:ifpostwidth500px}width:480px;{/block:ifpostwidth500px}
  357.      margin-top:-50px;
  358.      height:auto;
  359.      padding:15px 10px;
  360.      {block:ifpostwidth150px}
  361.      padding:10px;
  362.      {/block:ifpostwidth150px}
  363.      background-color:rgba(0,0,0,0.7);
  364.      visibility:hidden;
  365.      z-index:998;
  366.      -webkit-transition: all 0.5s ease;
  367.      -moz-transition: all 0.5s ease;
  368.      transition: all 0.5s ease;}
  369. div#photo:hover div#picture div#info_2 {
  370.      opacity:1;
  371.      margin-top:0px;
  372.      -webkit-transition: all 0.5s ease;
  373.      -moz-transition: all 0.5s ease;
  374.      transition: all 0.5s ease;}
  375. div#photo div#picture div#info_2 div#holder {
  376.      {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px}
  377.      {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px}
  378.      {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px}
  379.      {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px}    
  380.      {block:ifpostwidth500px}width:480px;{/block:ifpostwidth500px}
  381.      height:auto;
  382.      z-index:999;
  383.      -webkit-transition: all 0.2s linear;
  384.      -moz-transition: all 0.2s linear;
  385.      transition: all 0.2s linear;}
  386. div#photo div#picture div#info_2 div#holder #month {
  387.      font-size:8px;
  388.      {block:ifNotpostwidth150px}
  389.      float:right;
  390.      text-align:right;
  391.      {/block:ifNotpostwidth150px}
  392.      color:white;
  393.      text-transform:uppercase;
  394.      -webkit-transition: all 0.4s linear;
  395.      -moz-transition: all 0.4s linear;
  396.      transition: all 0.4s linear;}
  397. div#photo div#picture div#info_2 div#holder #note_count {
  398.      font-family:arial;
  399.      text-transform:uppercase;
  400.      color:white;
  401.      letter-spacing:-1px;
  402.      {block:ifNotpostwidth150px}
  403.      float:left;
  404.      font-size:25px;
  405.      line-height:25px;
  406.      {/block:ifNotpostwidth150px}
  407.      {block:ifpostwidth150px}
  408.      display:block;
  409.      font-size:20px;
  410.      line-height:20px;
  411.      {/block:ifpostwidth150px}
  412.      font-weight:bold;
  413.      -webkit-transition: all 0.2s linear;
  414.      -moz-transition: all 0.2s linear;
  415.      transition: all 0.2s linear;}
  416. div#photo div#picture:hover div#info_2 {visibility:visible;}
  417. #reblog {
  418.     background-color:rgba(0,0,0,0.7);
  419.     position:absolute;
  420.     color:#FFFFFF;
  421.     font-family:dancing script;
  422.     text-align:center;
  423.     text-transform:capitalize;
  424.     {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px}
  425.     {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px}
  426.     {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px}
  427.     {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px}    
  428.     {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px}
  429.     {block:ifNotpostwidth150px}
  430.     font-size:25px;
  431.     padding:15px 0px;
  432.     {/block:ifNotpostwidth150px}
  433.     {block:ifpostwidth150px}
  434.     font-size:20px;
  435.     padding:10px 0px;
  436.     {/block:ifpostwidth150px}
  437.     line-height:10px;
  438.     opacity:0;
  439.     -webkit-transition: all 0.5s ease;
  440.     -moz-transition: all 0.5s ease;
  441.     transition: all 0.5s ease;}
  442. .entry:hover #reblog {
  443.     {block:ifNotpostwidth150px}
  444.     margin-top:-40px;
  445.     {/block:ifNotpostwidth150px}
  446.     {block:ifpostwidth150px}
  447.     margin-top:-30px;
  448.     {/block:ifpostwidth150px}
  449.     opacity:1;
  450.     -webkit-transition: all 0.5s ease;
  451.     -moz-transition: all 0.5s ease;
  452.     transition: all 0.5s ease;}  
  453. .caption{
  454.     padding:5px 10px;
  455.     background:white;
  456.     {block:ifPostRoundBorders}
  457.     border-bottom-left-radius: 3px;
  458.     border-bottom-right-radius: 3px;
  459.     {/block:ifPostRoundBorders}
  460.     {block:ifPostShadow}
  461.     box-shadow: 0px 0px 30px rgba(100, 100, 100, 0.1) inset;
  462.     {/block:ifPostShadow}}
  463. .caption img{
  464.     height:auto;
  465.     {block:IndexPage}
  466.     {block:ifpostwidth150px}max-width:150px;{/block:ifpostwidth150px}
  467.     {block:ifpostwidth250px}max-width:230px;{/block:ifpostwidth250px}
  468.     {block:ifpostwidth300px}max-width:280px;{/block:ifpostwidth300px}
  469.     {block:ifpostwidth400px}max-width:380px;{/block:ifpostwidth400px}    
  470.     {block:ifpostwidth500px}max-width:460px;{/block:ifpostwidth500px}
  471.     {/block:IndexPage}
  472.     {block:PermalinkPage}max-width:840px;{/block:PermalinkPage}}
  473. #permalink_image{
  474.     margin:10px auto;
  475.     -webkit-box-shadow: inset 0 0 50px rgba(0,0,0,1);
  476.     -moz-box-shadow: inset 0 0 50px rgba(0,0,0,1);
  477.     -o-box-shadow: inset 0 0 50px rgba(0,0,0,1);
  478.     box-shadow: inset 0 0 50px rgba(0,0,0,1);}
  479.  
  480. /**** Posts: Text ****/
  481.  
  482. #text blockquote {
  483.     margin:5px 10px;
  484.     padding:0;}
  485. #text li {
  486.     list-style:none;
  487.     margin:0;
  488.     padding:0;}
  489. #text img{
  490.     height:auto;
  491.     {block:IndexPage}
  492.     {block:ifpostwidth150px}max-width:150px;{/block:ifpostwidth150px}
  493.     {block:ifpostwidth250px}max-width:230px;{/block:ifpostwidth250px}
  494.     {block:ifpostwidth300px}max-width:280px;{/block:ifpostwidth300px}
  495.     {block:ifpostwidth400px}max-width:380px;{/block:ifpostwidth400px}    
  496.     {block:ifpostwidth500px}max-width:460px;{/block:ifpostwidth500px}
  497.     {/block:IndexPage}
  498.     {block:PermalinkPage}max-width:840px;{/block:PermalinkPage}}
  499.  
  500. /**** Posts: Videos ****/
  501.  
  502. #video{
  503.     margin:5px;}
  504. .caption{
  505.     padding:5px 10px;
  506.     background:white;
  507.     {block:ifPostRoundBorders}
  508.     border-bottom-left-radius: 3px;
  509.     border-bottom-right-radius: 3px;
  510.     {/block:ifPostRoundBorders}
  511.     {block:ifPostShadow}
  512.     box-shadow: 0px 0px 30px rgba(100, 100, 100, 0.1) inset;
  513.     {/block:ifPostShadow}}
  514.  
  515. /**** Posts: Audio ****/
  516.  
  517. #audio{
  518.     margin:5px;
  519.     {block:ifpostwidth150px}margin:5px 70px;{/block:ifpostwidth150px}}
  520. .caption{
  521.     padding:5px 10px;
  522.     background:white;
  523.     {block:ifPostRoundBorders}
  524.     border-bottom-left-radius: 3px;
  525.     border-bottom-right-radius: 3px;
  526.     {/block:ifPostRoundBorders}
  527.     {block:ifPostShadow}
  528.     box-shadow: 0px 0px 30px rgba(100, 100, 100, 0.1) inset;
  529.     {/block:ifPostShadow}}
  530. .playcount{
  531.     float:right;
  532.     margin-top:-26px;
  533.     font-family:dancing script;
  534.     color:white;
  535.     font-size:16px;
  536.     margin-right:10px;
  537.     {block:ifpostwidth150px}display:none;{/block:ifpostwidth150px}
  538.     {block:ifpostwidth250px}display:none;{/block:ifpostwidth250px}
  539.     {block:ifpostwidth300px}display:none;{/block:ifpostwidth300px}}
  540.  
  541. /**** Posts: Chat ****/
  542.  
  543. .entry ul.chat{
  544.     margin:0;
  545.     padding:0;
  546.     list-style:none;}
  547. .entry ul.chat li{
  548.     padding:7px 10px;
  549.     border-top:1px solid rgba(0,0,0,0.1);
  550.     margin:5px 0;}
  551. .entry ul.chat li:nth-child(1){
  552.     border:0}
  553.    
  554. /**** Posts: Questions ****/
  555.  
  556. .entry .asker_portrait{
  557.     float:left;
  558.     width:30px;
  559.     height:30px;
  560.     margin-right:5px;
  561.     margin-bottom:5px;}
  562. .entry .question{
  563.     float:left;
  564.     line-height:11px;
  565.     margin-bottom:10px;
  566.     {block:IndexPage}
  567.     {block:ifpostwidth150px}max-width:110px;{/block:ifpostwidth150px}
  568.     {block:ifpostwidth250px}max-width:190px;{/block:ifpostwidth250px}
  569.     {block:ifpostwidth300px}max-width:240px;{/block:ifpostwidth300px}
  570.     {block:ifpostwidth400px}max-width:340px;{/block:ifpostwidth400px}    
  571.     {block:ifpostwidth500px}max-width:420px;{/block:ifpostwidth500px}
  572.     {/block:IndexPage}
  573.     {block:PermalinkPage}
  574.     width:840px;
  575.     {/block:PermalinkPage}}
  576. .entry .answer{
  577.     margin-top:5px;
  578.     line-height:11px;
  579.     clear:both;
  580.     display:block;
  581.     font-style:italic;
  582.     {block:IndexPage}
  583.     {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px}
  584.     {block:ifpostwidth250px}width:230px;{/block:ifpostwidth250px}
  585.     {block:ifpostwidth300px}width:280px;{/block:ifpostwidth300px}
  586.     {block:ifpostwidth400px}width:380px;{/block:ifpostwidth400px}    
  587.     {block:ifpostwidth500px}width:460px;{/block:ifpostwidth500px}
  588.     {/block:IndexPage}
  589.     {block:PermalinkPage}
  590.     width:870px;
  591.     {/block:PermalinkPage}}
  592.  
  593. /**** Posts: Notes ****/
  594.  
  595. #notes {
  596.     float: left;
  597.     margin: 15px 0;
  598.     padding: 10px;
  599.     width: 880px;
  600.     background-color:{color:Posts Background};
  601.     {block:ifPostRoundBorders}
  602.     border-radius: 4px;
  603.     {/block:ifPostRoundBorders}
  604.     {block:ifPostShadow}
  605.     box-shadow: 0px 0px 5px rgba(0,0,0,0.1),
  606.                 0px 0px 30px rgba(100, 100, 100, 0.1) inset;
  607.     {/block:ifPostShadow}}
  608.    
  609. .notes_button{
  610.     color:{color:Posts Links}
  611.     cursor:help;}
  612. ol.notes {
  613.     padding: 0;
  614.     margin: 0;
  615.     list-style-type: none;
  616.     display:none;}
  617. ol.notes li.note {
  618.     padding: 1px;
  619.     float:left;}
  620. ol.notes li.note img.avatar {
  621.     vertical-align: -4px;
  622.     width: 20px;
  623.     height: 20px;}
  624. ol.notes li.note span.action {
  625.     font-weight:normal;
  626.     display:none;}
  627. ol.notes li.note .answer_content {
  628.     font-weight: normal;
  629.     display:none;}
  630. ol.notes li.note blockquote {
  631.     padding: 4px 10px;
  632.     margin: 10px 0px 0px 25px;
  633.     display:none;}
  634. ol.notes li.note blockquote a {
  635.     text-decoration: none;
  636.     display:none;}
  637. ol.notes more_notes_link_container{
  638.     text-align:center;
  639.     height:14px;
  640.     padding:3px;
  641.     width:104px;
  642.     margin:1px;
  643.     background-color:rgba(0,0,0,0.1);}
  644. ol.notes more_notes_link_container:hover{
  645.     background-color:rgba(0,0,0,0);}  
  646.    
  647. /**** Posts: Permalink Post Info ****/
  648.    
  649. #post_info{
  650.     float: left;
  651.     margin: 15px 0 0;
  652.     padding: 10px;
  653.     width: 880px;
  654.     background-color:{color:Posts Background};
  655.     {block:ifPostRoundBorders}
  656.     border-radius: 4px;
  657.     {/block:ifPostRoundBorders}
  658.     {block:ifPostShadow}
  659.     box-shadow: 0px 0px 5px rgba(0,0,0,0.1),
  660.                 0px 0px 30px rgba(100, 100, 100, 0.1) inset;
  661.     {/block:ifPostShadow}}
  662.  
  663. /**** Transitions ****/
  664.  
  665. .transitions-enabled.masonry,
  666. .transitions-enabled.masonry .masonry-brick {
  667.   -webkit-transition-duration: 0.7s;
  668.      -moz-transition-duration: 0.7s;
  669.        -o-transition-duration: 0.7s;
  670.           transition-duration: 0.7s;}
  671. .transitions-enabled.masonry {
  672.   -webkit-transition-property: height, width;
  673.      -moz-transition-property: height, width;
  674.        -o-transition-property: height, width;
  675.           transition-property: height, width;}
  676. .transitions-enabled.masonry  .masonry-brick {
  677.   -webkit-transition-property: left, right, top;
  678.      -moz-transition-property: left, right, top;
  679.        -o-transition-property: left, right, top;
  680.           transition-property: left, right, top;}
  681.  
  682. </style>
  683. </head>
  684. <body>
  685. {block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}
  686. <div id="content">
  687. <div id="header">
  688.   {block:ifHeaderimage}
  689.   <center><a href="/" title="Home"><img src="{image:Header}" class="header_image" /></a></center>
  690.   {/block:ifHeaderimage}
  691.   {block:ifNotHeaderimage}<a href="/" title="Home"><h1>{title}</h1></a>{/block:ifNotHeaderimage}
  692.   {block:Description}
  693.      <div class="description">{Description}</div>
  694.   {/block:Description}
  695.   {block:Following}
  696.       <div class="blogroll">
  697.       <ul class="blogroll_img">{block:Followed}
  698.         <li>
  699.         <a href="{FollowedURL}" title="{FollowedName}" target="_blank">
  700.         <img src="{FollowedPortraitURL-24}"/></a>
  701.         </li>
  702.       {/block:Followed}</ul>
  703.       </div>
  704.   {/block:Following}
  705.   <div class="links">
  706.      {block:AskEnabled}
  707.         <a href="/ask">
  708.            {block:ifasktitle}{text:Ask Title}{/block:ifasktitle}
  709.            {block:ifnotasktitle}{AskLabel}{/block:ifnotasktitle}
  710.         </a>
  711.      {/block:AskEnabled}
  712.      {block:ifHeaderHideDescription}
  713.         <a class="description_button" title="Description">
  714.         Description</a>
  715.      {/block:ifHeaderHideDescription}
  716.      {block:ifHeaderBlogRoll}
  717.         <a class="blogroll_button" title="Blogs I follow">
  718.         Blogroll</a>
  719.      {/block:ifHeaderBlogRoll}
  720.      {block:ifLink1Title}
  721.         <a href="{text:Link 1}" title="{text:Link 1 Title}">
  722.         {text:Link 1 Title}</a>
  723.      {/block:ifLink1Title}
  724.      {block:ifLink2Title}
  725.         <a href="{text:Link 2}" title="{text:Link 2 Title}">
  726.         {text:Link 2 Title}</a>
  727.      {/block:ifLink2Title}
  728.      {block:ifLink3Title}
  729.         <a href="{text:Link 3}" title="{text:Link 3 Title}">
  730.         {text:Link 3 Title}</a>
  731.      {/block:ifLink3Title}
  732.      {block:ifLink4Title}
  733.         <a href="{text:Link 4}" title="{text:Link 4 Title}">
  734.         {text:Link 4 Title}</a>
  735.      {/block:ifLink4Title}
  736.      {block:ifLink5Title}
  737.         <a href="{text:Link 5}" title="{text:Link 5 Title}">
  738.         {text:Link 5 Title}</a>
  739.      {/block:ifLink5Title}
  740.      {block:HasPages}
  741.         {block:Pages}
  742.         <a href="{URL}" title="{Label}">{Label}</a>
  743.         {/block:Pages}
  744.      {/block:HasPages}
  745.   </div>
  746.   {block:ifHeaderHideDescription}
  747.   <script>
  748.   $('.description_button').click(function() {
  749.     $('#header .description').slideToggle('medium', function() {
  750.     });
  751.   });
  752.   </script>
  753.   {/block:ifHeaderHideDescription}
  754.   <script>
  755.     $('.blogroll_button').click(function() {
  756.     $('#header .blogroll').slideToggle('medium', function() {
  757.     });
  758.   });
  759.   </script>
  760. </div>
  761.  
  762. <div id="container" class="transitions-enabled centered clearfix">
  763.   {block:Posts}
  764.   <div class="entry{block:Photo} photo{/block:Photo}{block:Video} video{/block:Video}{block:Audio} audio{/block:Audio}">
  765.       {block:Text}
  766.               {block:Title}
  767.                   <a href="{Permalink}"><h1>{Title}</h1></a>
  768.               {/block:Title}
  769.               <div id="text">{Body}</div>
  770.       {block:IndexPage}
  771.        {block:Date}
  772.          <div id="permalink">
  773.             {block:NoteCount}
  774.             <a href="{Permalink}" class="notes">{NoteCountWithLabel}</a>
  775.             {/block:NoteCount}
  776.             <a href="{Permalink}" class="permalink">
  777.               Permalink</a>
  778.             <a href="{Permalink}" class="date">
  779.                {TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
  780.         </div>
  781.       {/block:Date}
  782.       {/block:IndexPage}
  783.       {/block:Text}
  784.  
  785.      {block:Photo}
  786.           <div id="photo">
  787.              <div id="picture">
  788.              {block:IndexPage}
  789.              {block:Date}
  790.                <div id="info_2">
  791.                <div id="holder">
  792.                  <div id="note_count">
  793.                    <a href="{Permalink}">{block:NoteCount} {NoteCountWithLabel}{/block:NoteCount} </a>
  794.                  </div>
  795.                  <div id="month"><a href="{Permalink}">
  796.                    {block:ifNotpostwidth150px}Posted on {DayOfWeek},
  797.                    <br> {DayOfMonth} {Month} {Year}.
  798.                    {/block:ifNotpostwidth150px}
  799.                    {block:ifpostwidth150px}
  800.                    {TimeAgo}
  801.                    {/block:ifpostwidth150px}</a>
  802.                  </div>
  803.               </div>
  804.               </div>
  805.             {/block:Date}
  806.             <img src="{block:ifNotpostwidth150px}{PhotoURL-HighRes}{/block:ifNotpostwidth150px}{block:ifpostwidth150px}{PhotoURL-250}{/block:ifpostwidth150px}"
  807. {block:ifpostwidth150px}width="170"{/block:ifpostwidth150px}
  808. {block:ifpostwidth250px}width="270"{/block:ifpostwidth250px}
  809. {block:ifpostwidth300px}width="320"{/block:ifpostwidth300px}
  810. {block:ifpostwidth400px}width="420"{/block:ifpostwidth400px}
  811. {block:ifpostwidth500px}width="500"{/block:ifpostwidth500px}
  812.  />{/block:IndexPage}
  813.             {block:PermalinkPage}
  814.             <div id="permalink_image" align="center">
  815.             <img src="{PhotoURL-500}" max-width="500"/>
  816.             </div>{/block:PermalinkPage}
  817.  
  818. {block:IndexPage}{block:IfPostReblogTitle}<a href="{ReblogURL}" target="_blank"><div id="reblog">{text:Post Reblog Title}</div></a>{/block:ifPostReblogTitle}{/block:IndexPage}
  819.             </div>
  820.             </div>
  821.             {block:IndexPage}
  822.             {block:ifNotPostHideCaption}{block:Caption}
  823.             <a href="{Permalink}"><div class="caption">{Caption}
  824.             </div></a>
  825.             {/block:Caption}{/block:ifNotPostHideCaption}
  826.             {/block:IndexPage}
  827.             {block:PermalinkPage}
  828.             {block:Caption}
  829.             <div class="caption">{Caption}</div>
  830.             {/block:Caption}
  831.             {/block:PermalinkPage}
  832.       {/block:Photo}
  833.            
  834.       {block:Photoset}
  835.       <center>
  836.       {block:IndexPage}
  837.       {block:ifpostwidth150px}{Photoset-250}{/block:ifpostwidth150px}
  838.       {block:ifpostwidth250px}{Photoset-250}{/block:ifpostwidth250px}
  839.       {block:ifpostwidth300px}{Photoset-250}{/block:ifpostwidth300px}
  840.       {block:ifpostwidth400px}{Photoset-400}{/block:ifpostwidth400px}    
  841.       {block:ifpostwidth500px}{Photoset-500}{/block:ifpostwidth500px}
  842.       {/block:IndexPage}
  843.       {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  844.       </center>
  845.               {block:Caption}
  846.                   <div class="caption">{Caption}</div>
  847.               {/block:Caption}
  848.       {block:IndexPage}
  849.        {block:Date}
  850.          <div id="permalink">
  851.             {block:NoteCount}
  852.             <a href="{Permalink}" class="notes">{NoteCountWithLabel}</a>
  853.             {/block:NoteCount}
  854.             <a href="{Permalink}" class="permalink">
  855.               Permalink</a>
  856.             <a href="{Permalink}" class="date">
  857.                {TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
  858.         </div>
  859.       {/block:Date}
  860.       {/block:IndexPage}
  861.       {/block:Photoset}
  862.  
  863.       {block:Quote}
  864.               <center>
  865.               <a href="{Permalink}"><h1>"{Quote}"</h1></a>
  866.               </center>
  867.               {block:Source}
  868.                   <div class="source" align="center">{Source}</div>
  869.               {/block:Source}
  870.       {block:IndexPage}
  871.        {block:Date}
  872.          <div id="permalink">
  873.             {block:NoteCount}
  874.             <a href="{Permalink}" class="notes">{NoteCountWithLabel}</a>
  875.             {/block:NoteCount}
  876.             <a href="{Permalink}" class="permalink">
  877.               Permalink</a>
  878.             <a href="{Permalink}" class="date">
  879.                {TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
  880.         </div>
  881.       {/block:Date}
  882.       {/block:IndexPage}
  883.       {/block:Quote}
  884.  
  885.       {block:Link}
  886.               <a href="{URL}" class="link" {Target}><h1>{Name}</h1></a>
  887.               {block:Description}
  888.                   <div class="description">{Description}</div>
  889.               {/block:Description}
  890.       {block:IndexPage}
  891.        {block:Date}
  892.          <div id="permalink">
  893.             {block:NoteCount}
  894.             <a href="{Permalink}" class="notes">{NoteCountWithLabel}</a>
  895.             {/block:NoteCount}
  896.             <a href="{Permalink}" target="_blank" class="permalink">
  897.               Permalink</a>
  898.             <a href="{Permalink}" class="date">
  899.                {TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
  900.         </div>
  901.       {/block:Date}
  902.       {/block:IndexPage}
  903.       {/block:Link}
  904.  
  905.       {block:Audio}
  906.               <div id="audio">{AudioPlayerBlack}
  907.               <div class="playcount">{PlayCountWithLabel}</div></div>
  908.               {block:Caption}
  909.                   <div class="caption">{Caption}</div>
  910.               {/block:Caption}
  911.       {/block:Audio}
  912.  
  913.  
  914.       {block:Answer}
  915.               <img class="asker_portrait" src="{AskerPortraitURL-30}"/>
  916.               <div class="question">
  917.                 {Asker} asked:<br>
  918.                 {Question}
  919.               </div>
  920.               <div class="answer">{Answer}</div>
  921.       {block:IndexPage}
  922.        {block:Date}
  923.          <div id="permalink">
  924.             {block:NoteCount}
  925.             <a href="{Permalink}" class="notes">{NoteCountWithLabel}</a>
  926.             {/block:NoteCount}
  927.             <a href="{Permalink}" class="permalink">
  928.               Permalink</a>
  929.             <a href="{Permalink}" class="date">
  930.                {TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
  931.         </div>
  932.       {/block:Date}
  933.       {/block:IndexPage}
  934.       {/block:Answer}
  935.                
  936.       {block:Chat}
  937.               {block:Title}
  938.                   <a href="{Permalink}"><h1>{Title}</h1></a>
  939.               {/block:Title}
  940.               <ul class="chat">
  941.                   {block:Lines}
  942.                       <li class="{Alt} user_{UserNumber}">
  943.                           {block:Label}
  944.                               <span class="label">{Label}</span>
  945.                           {/block:Label}
  946.  
  947.                           {Line}
  948.                       </li>
  949.                   {/block:Lines}
  950.               </ul>
  951.       {block:IndexPage}
  952.        {block:Date}
  953.          <div id="permalink">
  954.             {block:NoteCount}
  955.             <a href="{Permalink}" class="notes">{NoteCountWithLabel}</a>
  956.             {/block:NoteCount}
  957.             <a href="{Permalink}" class="permalink">
  958.               Permalink</a>
  959.             <a href="{Permalink}" class="date">
  960.                {TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
  961.         </div>
  962.       {/block:Date}
  963.       {/block:IndexPage}
  964.       {/block:Chat}
  965.  
  966.       {block:Video}
  967.       <center><div id="video">
  968.       {block:IndexPage}
  969.       {block:ifpostwidth150px}{Video-250}{/block:ifpostwidth150px}
  970.       {block:ifpostwidth250px}{Video-250}{/block:ifpostwidth250px}
  971.       {block:ifpostwidth300px}{Video-250}{/block:ifpostwidth300px}
  972.       {block:ifpostwidth400px}{Video-400}{/block:ifpostwidth400px}    
  973.       {block:ifpostwidth500px}{Video-500}{/block:ifpostwidth500px}
  974.       {/block:IndexPage}
  975.       {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  976.       </div></center>
  977.           {block:Caption}
  978.           <a href="{Permalink}"><div class="caption">{Caption}</div></a>
  979.           {/block:Caption}
  980.       {/block:Video}
  981.      
  982.   </div>
  983.  
  984.   {block:PermalinkPage}
  985.       {block:Date}
  986.       <div id="post_info">
  987.       This post is posted on {DayOfWeek} {DayOfMonth} {Month} {Year}.<br>
  988.       {block:NoteCount}
  989.       Currently has {NoteCountWithLabel}<br>
  990.       {/block:NoteCount}
  991.       {block:HasTags}
  992.       Tagged as: {block:Tags}
  993.       <a href="{TagURL}" style="text-decoration:underline;">{Tag}</a>
  994.       &nbsp;&nbsp; {/block:Tags}<br>
  995.       {/block:HasTags}
  996.       </div>
  997.       {/block:Date}
  998.   {/block:PermalinkPage}
  999.   {block:PostNotes}
  1000.       <div id="notes">
  1001.           {NoteCountWithLabel} &nbsp;&nbsp;-&nbsp;&nbsp;
  1002.           <span class="notes_button">Show notes</span>
  1003.           {PostNotes}
  1004.       <script>
  1005.       $('.notes_button').click(function() {
  1006.         $('ol.notes').slideToggle('slow', function() {
  1007.         });
  1008.       });
  1009.       </script>
  1010.       </div>
  1011.   {/block:PostNotes}
  1012.  
  1013.   {/block:Posts}
  1014. </div> <!-- #container -->
  1015. {block:IndexPage}<div class="container_load">
  1016.    <a href="#" id="load">Want More? :P</a><br>
  1017.   Theme made by <a href="http://www.facebook.com/geestyle01/" title="Get theme here" target="_blank">Gee Styles</a><br> powered by <a href="http://www.facebook.com/geestyle01/">Gee Styles</a>
  1018. </div>{/block:IndexPage}
  1019. {block:IndexPage} <script src="http://static.tumblr.com/twte3d7/0pellzh2t/infinitescroll.js"></script>
  1020. <script src="http://static.tumblr.com/me5sfsd/12Qlmj66n/script.js"></script>
  1021. <script>
  1022. $(window).load(function(){
  1023.    var $wall = $('#container');
  1024.    $wall.masonry({
  1025.      itemSelector: '.entry, .entry_load',
  1026.      {block:ifpostwidth150px}columnWidth: 180,{/block:ifpostwidth150px}
  1027.      {block:ifpostwidth250px}columnWidth: 280,{/block:ifpostwidth250px}
  1028.      {block:ifpostwidth300px}columnWidth: 330,{/block:ifpostwidth300px}
  1029.      {block:ifpostwidth400px}columnWidth: 440,{/block:ifpostwidth400px}    
  1030.      {block:ifpostwidth500px}columnWidth: 520,{/block:ifpostwidth500px}
  1031.      isAnimated: !Modernizr.csstransitions,
  1032.      isFitWidth: true
  1033.    });
  1034.    
  1035.    $wall.infinitescroll({
  1036.    navSelector    : '#page-nav',  
  1037.    nextSelector   : '#page-nav a',
  1038.    itemSelector   : '.entry',
  1039.    donetext       : 'The End.',
  1040.    loadingText    : 'Loading...',
  1041.    extraScrollPx  : 0,
  1042.    bufferPx       : 20000,
  1043.    behavior       : 'twitter',
  1044.    debug          : false,
  1045.    errorCallback: function() {
  1046.      $('#infscr-loading').animate({opacity: .8},2000).fadeOut('normal');  
  1047.    }},
  1048.    function( newElements ) {
  1049.      var $newElems = $( newElements );
  1050.    $newElems.hide();
  1051.      $newElems.imagesLoaded(function(){
  1052.        $wall.masonry( 'appended', $newElems, {isAnimated: true, animationOptions: {duration: 750, easing: 'linear', queue: false}}, function(){$newElems.fadeIn();} );
  1053.      });
  1054.    }); $wall.show(500);
  1055.    
  1056.        $('#load').click(function(e){
  1057.        
  1058.        e.preventDefault();
  1059.        $wall.infinitescroll('retrieve');
  1060.    
  1061.        // the plugin currently sets 'display:none' on your nav selector
  1062.        // this is probably going to change, but for the moment, just do this.
  1063.        $(this).css('display','block');
  1064.        
  1065.    });
  1066.  });
  1067.  
  1068. </script>{/block:IndexPage}
  1069. </div>
  1070. </body>
  1071. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!