API tools faq
paste
Advertisement
annasthms

thm 07 - the gay agenda

annasthms
Jun 10th, 2018 (edited)
7,368
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 41.71 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!----------------------------------------------------
  5.  
  6. credits:
  7.  
  8. - icon font by saturnthms
  9. - minimal soundcloud player by shythemes
  10. - (modified) pxu photosets by bychloethemes
  11. - infinite scroll by Paul Irish
  12. - smoothscroll by Balazs Galambosi
  13.  
  14. - the gay agenda by annasthms (june 8, 2018)
  15.  a theme in made celebration of lgbt pride month
  16.  more info @ https://annasthms.tumblr.com/more/thm/07
  17.  
  18.  
  19. rules:
  20.  
  21. 1. don't remove the credit
  22. 2. don't steal/claim as yours
  23. 3. don't use as a base code
  24.  
  25. thank you!! ♡♡♡
  26.  
  27. ----------------------------------------------------->
  28.  
  29. <head>
  30.  
  31.   <title>{block:PostSummary}{PostSummary} :: {/block:PostSummary}{block:TagPage}#{Tag} :: {/block:TagPage}{block:SearchPage}{SearchQuery} :: {/block:SearchPage}{block:DayPage}{DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear} :: {/block:DayPage}{Title}</title>
  32.   <link rel="shortcut icon" href="{Favicon}">
  33.   <link rel="alternate" type="application/rss+xml" href="{RSS}">
  34.   <meta name="viewport" content="width=device-width, initial-scale=1">
  35.   {block:Description}
  36.   <meta name="description" content="{MetaDescription}" />
  37.   {/block:Description}
  38.  
  39.   <link href="https://fonts.googleapis.com/css?family={text:google font}" rel="stylesheet">
  40.   <link href="https://solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet">
  41.   <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  42.  
  43.   <meta name="image:background" content="" />
  44.   <meta name="image:sidebar" content="" />
  45.   <meta name="image:pride flag" content="" />
  46.  
  47.   <meta name="color:color 1" content="#ff6767" />
  48.   <meta name="color:color 2" content="#cc3434" />
  49.   <meta name="color:font" content="#000000" />
  50.   <meta name="color:background" content="#ffffff" />
  51.   <meta name="color:sidebar background" content="#ffffff" />
  52.   <meta name="color:red" content="#ff7f7f" />
  53.   <meta name="color:orange" content="#ffd27f" />
  54.   <meta name="color:yellow" content="#ffff7f" />
  55.   <meta name="color:green" content="#7fbf7f" />
  56.   <meta name="color:blue" content="#7f7fff" />
  57.   <meta name="color:purple" content="#bf7fbf" />
  58.   <meta name="color:gray" content="#222222" />
  59.   <meta name="color:rainbow clouds" content="#f2f2f2" />
  60.   <meta name="color:topbar" content="#dddddd" />
  61.   <meta name="color:blog title" content="#ff6767" />
  62.   <meta name="color:blog title hover" content="#cc3434" />
  63.   <meta name="color:blog links" content="#ff6767" />
  64.   <meta name="color:blog links hover" content="#cc3434" />
  65.   <meta name="color:search bar" content="#cc3434" />
  66.   <meta name="color:post background" content="#ffffff" />
  67.   <meta name="color:post date" content="#000000" />
  68.   <meta name="color:text shadow" content="#cccccc" />
  69.   <meta name="color:chat label underline" content="#000000" />
  70.   <meta name="color:quotes" content="#222222" />
  71.   <meta name="color:quote sources" content="#555555" />
  72.   <meta name="color:reblogger" content="#888888" />
  73.   <meta name="color:reblogger hover" content="#444444" />
  74.   <meta name="color:post types" content="#000000" />
  75.   <meta name="color:like and reblog buttons" content="#444444" />
  76.   <meta name="color:like and reblog buttons hover" content="#ff4141" />
  77.   <meta name="color:like button liked" content="#992727" />
  78.  
  79.   <meta name="font:font" content="Avalon" />
  80.  
  81.   <meta name="select:topbar" content="gradient" title="rainbow" />
  82.   <meta name="select:topbar" content="solid" title="solid" />
  83.   <meta name="select:topbar" content="none" title="none" />
  84.   <meta name="select:post type decorations" content="quotes" title='"quotes"' />
  85.   <meta name="select:post type decorations" content="question" title="question?" />
  86.   <meta name="select:post type decorations" content="pound" title="#hashtag" />
  87.   <meta name="select:post type decorations" content="" title="none" />
  88.   <meta name="select:pagination type" content="simple" title="simple" />
  89.   <meta name="select:pagination type" content="jump" title="jump pagination" />
  90.   <meta name="select:pagination type" content="infinite" title="infinite scroll" />
  91.   <meta name="select:pagination type" content="loadmore" title="load more" />
  92.  
  93.   <meta name="if:rainbow sidebar icon" content="1" />
  94.   <meta name="if:rainbow bullet points" content="1" />
  95.   <meta name="if:rainbow quotes" content="1" />
  96.   <meta name="if:rainbow chat label underline" content="1" />
  97.   <meta name="if:rainbow post types" content="1" />
  98.   <meta name="if:dark tumblr controls" content="1" />
  99.  
  100.   <meta name="text:google font" content="Karla" />
  101.   <meta name="text:font size" content="" />
  102.   <meta name="text:sidebar icon size" content="105px" />
  103.   <meta name="text:description" content="" />
  104.   <meta name="text:search font size" content="0.8em" />
  105.   <meta name="text:post width" content="500px" />
  106.   <meta name="text:photoset gutter" content="0.5em" />
  107.   <meta name="text:tags prefix" content="." />
  108.   <meta name="text:blog link one name" content="" />
  109.   <meta name="text:blog link one url" content="" />
  110.   <meta name="text:blog link two name" content="" />
  111.   <meta name="text:blog link two url" content="" />
  112.   <meta name="text:blog link three name" content="" />
  113.   <meta name="text:blog link three url" content="" />
  114.   <meta name="text:blog link four name" content="" />
  115.   <meta name="text:blog link four url" content="" />
  116.   <meta name="text:blog link five name" content="" />
  117.   <meta name="text:blog link five url" content="" />
  118.  
  119.   <style>
  120.   * {
  121.     position: relative;
  122.   }
  123.   body {
  124.     background: {color:background} url('{image:background}') no-repeat fixed center;
  125.     background-size: cover;
  126.     color: {color:font};
  127.     font-family: {block:Ifgooglefont}'{text:google font}', {/block:Ifgooglefont}{font:font};
  128.     font-size: {text:font size};
  129.     line-height: 1.45em;
  130.   }
  131.   a {
  132.     color: {color:color 1};
  133.   }
  134.   a:hover {
  135.     color: {color:color 2};
  136.   }
  137.   p:first-child {
  138.     margin-top: 0;
  139.   }
  140.   p:last-child {
  141.     margin-bottom: 0;
  142.   }
  143.   img {
  144.     max-width: 100%;
  145.     height: auto;
  146.   }
  147.   blockquote {
  148.     margin: 0;
  149.     padding: 0 0 0 1em;
  150.     border-left: 1px solid;
  151.   }
  152.   hr {
  153.     height: 1px;
  154.     width: 75%;
  155.     margin: 0.75em auto;
  156.     border: none;
  157.     background: {color:font};
  158.   }
  159.   pre {
  160.     white-space: pre-wrap;
  161.     background: rgba(0,0,0,0.03);
  162.     padding: 0.5em 1em;
  163.     border-left: 1px solid;
  164.   }
  165.  
  166.   ul, ol {
  167.     margin: 0;
  168.     list-style: none;
  169.     padding: 0 0 0 1.75em;
  170.   }
  171.   ol {
  172.     counter-reset: lists;
  173.   }
  174.   ul li::before {
  175.     content: '\e1e9'; /* change this if you want a different icon for lists */
  176.     position: absolute;
  177.     font-family: 'saturnicons';
  178.     top: 0.1em;
  179.     left: -2em;
  180.     color: {color:color 2};
  181.     font-size: 0.8em;
  182.     -webkit-transform: rotate(-10deg);
  183.             transform: rotate(-10deg);
  184.     {block:Ifrainbowbulletpoints}
  185.     text-shadow: 1px 1px {color:text shadow};
  186.     {/block:Ifrainbowbulletpoints}
  187.   }
  188.   ol li:before {
  189.     counter-increment: lists;
  190.     content: counter(lists) ".";
  191.     position: absolute;
  192.     left: -1.6em;
  193.     color: {color:color 2};
  194.     {block:Ifrainbowbulletpoints}
  195.     text-shadow: 1px 1px #cccccc;
  196.     {/block:Ifrainbowbulletpoints}
  197.   }
  198.   {block:Ifrainbowbulletpoints}
  199.   li:nth-child(6n - 5)::before {
  200.     color: {color:red};
  201.   }
  202.   li:nth-child(6n - 4)::before {
  203.     color: {color:orange};
  204.   }
  205.   li:nth-child(6n - 3)::before {
  206.     color: {color:yellow};
  207.   }
  208.   li:nth-child(6n - 2)::before {
  209.     color: {color:green};
  210.   }
  211.   li:nth-child(6n - 1)::before {
  212.     color: {color:blue};
  213.   }
  214.   li:nth-child(6n)::before {
  215.     color: {color:purple};
  216.   }
  217.   {/block:Ifrainbowbulletpoints}
  218.  
  219.   /* topbar */
  220.   div#hbar {
  221.     position: fixed;
  222.     height: 0.5em;
  223.     width: 100%;
  224.     top: 0;
  225.     left: 0;
  226.     background: {color:topbar};
  227.     z-index: 1;
  228.   }
  229.   div#hbar.gradient {
  230.     background: repeating-linear-gradient(90deg,rgba({RGBcolor:red}, 0.5),rgba({RGBcolor:orange}, 0.5),rgba({RGBcolor:yellow}, 0.5),rgba({RGBcolor:green}, 0.5),rgba({RGBcolor:blue}, 0.5),rgba({RGBcolor:purple}, 0.5),rgba({RGBcolor:red}, 0.5) 750px);
  231.   }
  232.   div#hbar.none {
  233.     display: none;
  234.   }
  235.  
  236.   /* post + sidebar container */
  237.   div#container {
  238.     width: calc(250px + 4em + {text:post width});
  239.     max-width: calc(250px + 4em + 500px);
  240.     min-width: calc(250px + 4em + 350px);
  241.     margin: 0 auto;
  242.   }
  243.  
  244.   /* sidebar */
  245.   aside#sidebar, section#posts {
  246.     display: inline-block;
  247.     vertical-align: top;
  248.   }
  249.   aside#sidebar {
  250.     position: fixed;
  251.     width: 250px;
  252.     margin-top: 125px;
  253.     margin-right: 4em;
  254.     background: {color:sidebar background};
  255.     padding: 1em;
  256.     -webkit-box-sizing: border-box;
  257.             box-sizing: border-box;
  258.   }
  259.   {block:Ifrainbowsidebaricon}
  260.   div#blog-info .rainbow, div#blog-title {
  261.     display: inline-block;
  262.     {block:Ifsidebarimage}vertical-align: bottom;{/block:Ifsidebarimage}
  263.     {block:IfNotsidebarimage}vertical-align: top;{/block:IfNotsidebarimage}
  264.   }
  265.   div#blog-info .rainbow {
  266.     {block:Ifsidebarimage}margin: calc(-1 * ({text:sidebar icon size} / 2)) 0 0 calc(-1 * ({text:sidebar icon size} / 2));{/block:Ifsidebarimage}
  267.     {block:IfNotsidebarimage}margin: calc(-1 * ({text:sidebar icon size} / 4)) 0 0 calc(-1 * ({text:sidebar icon size} / 4));{/block:IfNotsidebarimage}
  268.   }
  269.   .rainbow {
  270.     height: 105px;
  271.     width: 105px;
  272.     min-height: 50px;
  273.     min-width: 50px;
  274.     max-height: 150px;
  275.     max-width: 150px;
  276.     height: {text:sidebar icon size};
  277.     width: {text:sidebar icon size};
  278.     -webkit-transform: rotate(15deg);
  279.             transform: rotate(15deg);
  280.   }
  281.   .rainbow .rainbow-color {
  282.     -webkit-box-sizing: border-box;
  283.             box-sizing: border-box;
  284.     border-width: 5px;
  285.     border-style: solid;
  286.     border-right-color: transparent !important;
  287.     border-bottom-color: transparent !important;
  288.     border-radius: 100%;
  289.     position: absolute;
  290.   }
  291.   .rainbow-red {
  292.     width: 100%;
  293.     height: 100%;
  294.     border-color: red;
  295.     border-color: {color:red};
  296.     top: 0;
  297.     left: 0;
  298.   }
  299.   .rainbow-orange {
  300.     width: calc(100% - 5px);
  301.     height: calc(100% - 5px);
  302.     border-color: orange;
  303.     border-color: {color:orange};
  304.     top: 4px;
  305.     left: 4px;
  306.   }
  307.   .rainbow-yellow {
  308.     width: calc(100% - (2 * 5px));
  309.     height: calc(100% - (2 * 5px));
  310.     border-color: yellow;
  311.     border-color: {color:yellow};
  312.     top: calc(2 * 4px);
  313.     left: calc(2 * 4px);
  314.   }
  315.   .rainbow-green {
  316.     width: calc(100% - (3 * 5px));
  317.     height: calc(100% - (3 * 5px));
  318.     border-color: green;
  319.     border-color: {color:green};
  320.     top: calc(3 * 4px);
  321.     left: calc(3 * 4px);
  322.   }
  323.   .rainbow-blue {
  324.     width: calc(100% - (4 * 5px));
  325.     height: calc(100% - (4 * 5px));
  326.     border-color: blue;
  327.     border-color: {color:blue};
  328.     top: calc(4 * 4px);
  329.     left: calc(4 * 4px);
  330.   }
  331.   .rainbow-purple {
  332.     width: calc(100% - (5 * 5px));
  333.     height: calc(100% - (5 * 5px));
  334.     border-color: purple;
  335.     border-color: {color:purple};
  336.     top: calc(5 * 4px);
  337.     left: calc(5 * 4px);
  338.   }
  339.   .rainbow-cloud-left {
  340.     position: absolute;
  341.     bottom: 0;
  342.     left: 13%;
  343.     -webkit-transform: rotate(-45deg);
  344.             transform: rotate(-45deg);
  345.     z-index: 1;
  346.   }
  347.   .rainbow-cloud-left div:first-child {
  348.     height: 30px;
  349.     width: 30px;
  350.     left: 10px;
  351.   }
  352.   .rainbow-cloud-left div:nth-child(2) {
  353.     height: 20px;
  354.     width: 20px;
  355.     left: 0;
  356.   }
  357.   .rainbow-cloud-left div {
  358.     border-radius: 100%;
  359.     background: {color:rainbow clouds};
  360.     position: absolute;
  361.     top: 50%;
  362.     -webkit-transform: translateY(-50%);
  363.             transform: translateY(-50%);
  364.   }
  365.   .rainbow-cloud-left div:last-child {
  366.     height: 15px;
  367.     width: 15px;
  368.     left: 35px;
  369.   }
  370.   .rainbow-cloud-right {
  371.     position: absolute;
  372.     top: 13%;
  373.     right: 0;
  374.     -webkit-transform: rotate(135deg);
  375.             transform: rotate(135deg);
  376.   }
  377.   .rainbow-cloud-right div:first-child {
  378.     height: 30px;
  379.     width: 30px;
  380.     left: 10px;
  381.   }
  382.   .rainbow-cloud-right div:nth-child(2) {
  383.     height: 20px;
  384.     width: 20px;
  385.     left: 0;
  386.   }
  387.   .rainbow-cloud-right div {
  388.     border-radius: 100%;
  389.     background: {color:rainbow clouds};
  390.     position: absolute;
  391.     top: 50%;
  392.     -webkit-transform: translateY(-50%);
  393.             transform: translateY(-50%);
  394.   }
  395.   .rainbow-cloud-right div:last-child {
  396.     height: 15px;
  397.     width: 15px;
  398.     left: 35px;
  399.   }
  400.   {block:Ifsidebarimage}
  401.   img#sidebar-avatar {
  402.     position: absolute;
  403.     width: calc(100% - (6 * 5px));
  404.     height: calc(100% - (6 * 5px));
  405.     top: calc(6 * 4px);
  406.     left: calc(6 * 4px);
  407.     -webkit-transform: rotate(-15deg);
  408.             transform: rotate(-15deg);
  409.     border-radius: 100%;
  410.     border: 5px solid {color:sidebar background};
  411.     -webkit-box-sizing: border-box;
  412.             box-sizing: border-box;
  413.   }
  414.   .rainbow-dot {
  415.     height: 1em;
  416.     width: 1em;
  417.     background-image: url('{image:pride flag}');
  418.     background-size: cover;
  419.     background-repeat: no-repeat;
  420.     border-radius: 100%;
  421.     -webkit-transform: rotate(-15deg);
  422.             transform: rotate(-15deg);
  423.     position: absolute;
  424.     bottom: 15%;
  425.     right: 7%;
  426.   }
  427.   div#blog-title {
  428.     margin-left: 1em;
  429.     max-width: calc(100% - ({text:sidebar icon size} / 2) - 2em);
  430.   }
  431.   {/block:Ifsidebarimage}
  432.   {block:IfNotsidebarimage}
  433.   div#blog-title {
  434.     margin-left: calc(-2 * ({text:sidebar icon size} / 4));
  435.     margin-top: calc(1.5 * ({text:sidebar icon size} / 4));
  436.     max-width: calc(100% - ({text:sidebar icon size} / 4) - 2em);
  437.   }
  438.   {/block:IfNotsidebarimage}
  439.   {/block:Ifrainbowsidebaricon}
  440.   {block:IfNotrainbowsidebaricon}
  441.   div#blog-avatar, div#blog-title {
  442.     display: inline-block;
  443.     vertical-align: middle;
  444.     margin-bottom: 1em;
  445.   }
  446.   div#blog-avatar {
  447.     height: {text:sidebar icon size};
  448.     width: {text:sidebar icon size};
  449.     border-radius: 100%;
  450.     margin: calc(-1 * {text:sidebar icon size} / 2) 0 1em calc(-1 * {text:sidebar icon size} / 2);
  451.     background-image: url('{image:pride flag}');
  452.     background-size: cover;
  453.     background-repeat: no-repeat;
  454.     padding: 0.4em;
  455.     -webkit-box-sizing: border-box;
  456.             box-sizing: border-box;
  457.   }
  458.   div#blog-avatar img {
  459.     height: 100%;
  460.     width: 100%;
  461.     border-radius: 100%;
  462.   }
  463.   div#blog-title {
  464.     max-width: calc(100% - ({text:sidebar icon size} / 2) - 1.25em);
  465.     margin-left: 1em;
  466.   }
  467.   {/block:IfNotrainbowsidebaricon}
  468.   div#blog-title a {
  469.     color: {color:blog title};
  470.     font-size: 1.5em;
  471.     text-decoration: none;
  472.     font-weight: bold;
  473.   }
  474.   div#blog-title a:hover {
  475.     color: {color:blog title hover};
  476.   }
  477.   {block:Ifrainbowsidebaricon}
  478.   div#blog-desc {
  479.     {block:Ifsidebarimage}margin-top: 1.5em;{/block:Ifsidebarimage}
  480.     {block:IfNotsidebarimage}margin-top: 1em;{/block:IfNotsidebarimage}
  481.   }
  482.   {/block:Ifrainbowsidebaricon}
  483.   div#blog-desc p {
  484.     margin: 0.5em 0;
  485.   }
  486.   div#blog-desc p:first-child {
  487.     margin-top: 0;
  488.   }
  489.   div#blog-desc p:last-child {
  490.     margin-bottom: 0;
  491.   }
  492.   div#blog-links {
  493.     margin-top: 1em;
  494.   }
  495.   div#blog-links a {
  496.     color: {color:blog links};
  497.     text-decoration: none;
  498.     text-transform: lowercase;
  499.     display: inline-block;
  500.   }
  501.   div#blog-links a:not(:last-child) {
  502.     margin-right: 0.5em;
  503.   }
  504.   div#blog-links a:hover {
  505.     color: {color:blog links hover};
  506.   }
  507.   div#search {
  508.     margin-top: 0.75em;
  509.   }
  510.   div#search input {
  511.     outline: none;
  512.     border: none;
  513.     background: transparent;
  514.     color: {color:search bar};
  515.     width: 100%;
  516.     font-size: {text:search font size};
  517.     font-family: {block:Ifgooglefont}'{text:google font}', {/block:Ifgooglefont}{font:font};
  518.     text-transform: lowercase;
  519.   }
  520.  
  521.   /* post container */
  522.   section#posts {
  523.     margin-left: calc(250px + 4em);
  524.     margin-bottom: 3em;
  525.     padding-bottom: 3em;
  526.   }
  527.  
  528.   /* all posts */
  529.   .post {
  530.     margin: 3em 0;
  531.     width: {text:post width};
  532.     max-width: 500px;
  533.     min-width: 350px;
  534.     background: {color:post background};
  535.     word-wrap: break-word;
  536.     padding: 2em;
  537.     -webkit-box-sizing: border-box;
  538.             box-sizing: border-box;
  539.   }
  540.   @-webkit-keyframes fade {
  541.     from {opacity:0;}
  542.     top {opacity:1;}
  543.   }
  544.   @keyframes fade {
  545.     from {opacity:0;}
  546.     top {opacity:1;}
  547.   }
  548.   .post.new {
  549.     -webkit-animation: fade 2s;
  550.             animation: fade 2s;
  551.   }
  552.  
  553.   /* post date + time */
  554.   .new-post-date {
  555.     margin: 3em 0 2em;
  556.     font-size: 1.5em;
  557.     font-weight: bold;
  558.     color: {color:post date};
  559.     background: {color:post background};
  560.     padding: 1.3em;
  561.   }
  562.   .new-post-date a {
  563.     text-decoration: none;
  564.     color: {color:post date};
  565.   }
  566.   .post-time {
  567.     margin-bottom: 1em;
  568.   }
  569.   .post-time a {
  570.     color: {color:post date};
  571.     text-decoration: none;
  572.     text-shadow: 1px 1px {color:text shadow};
  573.     font-size: 1.25em;
  574.   }
  575.  
  576.   /* post titles */
  577.   a.title, a.path.has-desc {
  578.     text-decoration: none;
  579.     font-size: 1.5em;
  580.     margin-bottom: 1em;
  581.     display: inline-block;
  582.   }
  583.   a.path {
  584.     text-decoration: none;
  585.     font-size: 1.5em;
  586.     display: inline-block;
  587.   }
  588.  
  589.   /* text posts */
  590.   figure:not(:last-child) {
  591.     margin: 0.75em 0;
  592.   }
  593.   p.tmblr-attribution {
  594.     margin-top: 0;
  595.   }
  596.   p.tmblr-attribution a {
  597.     text-transform: lowercase;
  598.     font-size: 0.8em;
  599.     color: {color:font};
  600.   }
  601.  
  602.   /* photo/photoset posts */
  603.   .tmblr-lightbox {
  604.     background: #fff !important;
  605.     background: rgba(255,255,255,1) !important;
  606.   }
  607.   .tmblr-lightbox .vignette {
  608.     opacity: 0;
  609.   }
  610.   .tmblr-lightbox .lightbox-image {
  611.     -webkit-box-shadow: none !important;
  612.     box-shadow: none !important;
  613.     border-radius: 0 !important;
  614.   }
  615.   .lightbox-caption {
  616.     color: #000 !important;
  617.     text-shadow: none !important;
  618.   }
  619.  
  620.   /* quote posts */
  621.   .quote .words, .quote .words-shadow {
  622.     font-size: 2em;
  623.     line-height: 1.25em;
  624.     font-weight: bold;
  625.   }
  626.   .quote .words {
  627.     {block:Ifrainbowquotes}
  628.     background: {color:quotes};
  629.     background: -webkit-gradient(linear,left top, right top,{color:red}, {color:orange}, {color:yellow}, {color:green}, {color:blue}, {color:purple}, {color:red});
  630.     background: linear-gradient(to right,{color:red},{color:orange},{color:yellow},{color:green},{color:blue},{color:purple},{color:red});
  631.     -webkit-background-clip: text;
  632.     -webkit-text-fill-color: transparent;
  633.     z-index: 1;
  634.     {/block:Ifrainbowquotes}
  635.     {block:IfNotrainbowquotes}
  636.     color: {color:quotes};
  637.     {/block:IfNotrainbowquotes}
  638.   }
  639.   {block:Ifrainbowquotes}
  640.   .quote .words-shadow {
  641.     color: {color:post background};
  642.     position: absolute;
  643.     max-width: 100%;
  644.     top: 0;
  645.     left: 0;
  646.     text-shadow: 1px 1px {color:text shadow};
  647.   }
  648.   {/block:Ifrainbowquotes}
  649.   .source {
  650.     margin-top: 1em;
  651.     color: {color:quote sources};
  652.   }
  653.  
  654.   /* chat posts */
  655.   .chat-line:not(:first-child) {
  656.     margin-top: 1em;
  657.   }
  658.   .chat-line .label {
  659.     font-weight: bold;
  660.     display: inline-block;
  661.     z-index: 1;
  662.   }
  663.   .chat-line .label::before {
  664.     content: '';
  665.     position: absolute;
  666.     height: 0.15em;
  667.     width: 100%;
  668.     bottom: 0.15em;
  669.     left: 0;
  670.     background: {color:chat label underline};
  671.     box-shadow: 1px 1px {color:text shadow};
  672.     z-index: -1;
  673.   }
  674.   {block:Ifrainbowchatlabelunderline}
  675.   .chat-line:nth-child(6n - 5) .label::before {
  676.     background: {color:red};
  677.   }
  678.   .chat-line:nth-child(6n - 4) .label::before {
  679.     background: {color:orange};
  680.   }
  681.   .chat-line:nth-child(6n - 3) .label::before {
  682.     background: {color:yellow};
  683.   }
  684.   .chat-line:nth-child(6n - 2) .label::before {
  685.     background: {color:green};
  686.   }
  687.   .chat-line:nth-child(6n - 1) .label::before {
  688.     background: {color:blue};
  689.   }
  690.   .chat-line:nth-child(6n) .label::before {
  691.     background: {color:purple};
  692.   }
  693.   {/block:Ifrainbowchatlabelunderline}
  694.  
  695.   /* audio posts */
  696.   .audio iframe {
  697.     width: 100%;
  698.   }
  699.   iframe.tumblr_audio_player {
  700.     height: 85px;
  701.   }
  702.   iframe.spotify_audio_player {
  703.     height: 80px;
  704.   }
  705.  
  706.   /* captions */
  707.   .caption {
  708.     margin-top: 0.75em;
  709.   }
  710.  
  711.   /* reblogger */
  712.   .reblogged:not(:last-of-type), .qna:not(:last-of-type) {
  713.     margin-bottom: 1.5em;
  714.   }
  715.   .blog {
  716.     margin-bottom: 0.75em;
  717.   }
  718.   .blog span {
  719.     font-weight: bold;
  720.     display: inline-block;
  721.     color: {color:reblogger hover};
  722.   }
  723.   .blog.deactivated span::after {
  724.     content: "deactivated";
  725.     position: absolute;
  726.     color: #aaa;
  727.     font-weight: normal;
  728.     left: calc(100% + 0.75em);
  729.     opacity: 0;
  730.     -webkit-transition: 0.25s all ease-in-out;
  731.     transition: 0.25s all ease-in-out;
  732.   }
  733.   .blog.deactivated span {
  734.     cursor: help;
  735.   }
  736.   .blog.deactivated span:hover::after {
  737.     opacity: 1;
  738.   }
  739.   .blog a {
  740.     text-decoration: none;
  741.     color: {color:reblogger};
  742.   }
  743.   .blog a:hover {
  744.     color: {color:reblogger hover};
  745.   }
  746.   .reblogged p {
  747.     margin: 0.75em 0;
  748.   }
  749.   .reblogged p:last-child {
  750.     margin-bottom: 0;
  751.   }
  752.  
  753.   /* post info */
  754.   .info {
  755.     text-transform: lowercase;
  756.   }
  757.   .reblogged + .info, .qna + .info {
  758.     margin-top: -0.5em;
  759.   }
  760.   :not(.reblogged):not(.qna) + .info {
  761.     margin-top: 1em;
  762.   }
  763.   a.path.has-desc + .info {
  764.     margin-top: -0.5em !important;
  765.   }
  766.   .info a {
  767.     text-decoration: none;
  768.   }
  769.   .post-info a {
  770.     display: inline-block;
  771.   }
  772.   .post-info a:not(:last-child) {
  773.     margin-right: 1em;
  774.   }
  775.   .post-info a:not(:first-child) {
  776.     {block:IndexPage}
  777.     margin-left: 2.5em;
  778.     opacity: 0;
  779.     {/block:IndexPage}
  780.     -webkit-transition-duration: 0.75s;
  781.             transition-duration: 0.75s;
  782.     -webkit-transition-property: margin, opacity;
  783.     transition-property: margin, opacity;
  784.     -webkit-transition-timing-function: ease-in-out;
  785.             transition-timing-function: ease-in-out;
  786.   }
  787.   {block:IndexPage}
  788.   .post:hover .post-info a:not(:first-child) {
  789.     margin-left: 0;
  790.     opacity: 1;
  791.   }
  792.   {/block:IndexPage}
  793.   a.post-type {
  794.     padding: 0.05em 0.5em;
  795.     border-radius: 5px;
  796.     border: 1px solid;
  797.     color: {color:post types};
  798.     text-shadow: 1px 1px {color:text shadow};
  799.     box-shadow: 1px 1px {color:text shadow};
  800.   }
  801.   {block:Ifrainbowposttypes}
  802.   .text a.post-type {
  803.     color: {color:red};
  804.   }
  805.   .photo a.post-type {
  806.     color: {color:orange};
  807.   }
  808.   .quote a.post-type {
  809.     color: {color:yellow};
  810.   }
  811.   .link a.post-type {
  812.     color: {color:green};
  813.   }
  814.   .chat a.post-type {
  815.     color: {color:blue};
  816.   }
  817.   .audio a.post-type {
  818.     color: {color:purple};
  819.   }
  820.   .video a.post-type {
  821.     color: {color:purple};
  822.   }
  823.   .answer a.post-type {
  824.     color: {color:gray};
  825.   }
  826.   {/block:Ifrainbowposttypes}
  827.   a.post-type.quotes::before, a.post-type.quotes::after {
  828.     content: '"';
  829.   }
  830.   a.post-type.question::after {
  831.     content: "?";
  832.   }
  833.   a.post-type.pound::before {
  834.     content: "#";
  835.   }
  836.   .buttons, .reblog-button, .like-button {
  837.     display: inline-block;
  838.   }
  839.   .buttons {
  840.     text-align: right;
  841.     position: absolute;
  842.     right: 0;
  843.     top: 0;
  844.     float: right;
  845.     padding-top: 0.2em;
  846.     color: {color:like and reblog buttons};
  847.   }
  848.   .buttons span {
  849.     -webkit-transition: 0.1s all ease-in-out;
  850.     transition: 0.1s all ease-in-out;
  851.   }
  852.   .reblog-button a {
  853.     color: {color:like and reblog buttons};
  854.   }
  855.   .reblog-button a:hover {
  856.     text-decoration: none;
  857.     color: {color:like and reblog buttons hover};
  858.   }
  859.   .like-button {
  860.     width: 1em;
  861.     height: 1em;
  862.     cursor: pointer;
  863.     margin-right: 0.5em;
  864.   }
  865.   .like_button {
  866.     position: absolute;
  867.     top: 0;
  868.     left: 0;
  869.     right: 0;
  870.     bottom: 0;
  871.     width: 100%;
  872.     height: 100%;
  873.     opacity: 0;
  874.     z-index: 10;
  875.   }
  876.   .like_button iframe {
  877.     width: 100% !important;
  878.     height: 100% !important;
  879.   }
  880.   .new-like-button {
  881.     width: 100%;
  882.     height: 100%;
  883.     z-index: 1;
  884.   }
  885.   .like_button:hover + .new-like-button > span {
  886.     color: {color:like and reblog buttons hover};
  887.   }
  888.   .like_button.liked + .new-like-button > span {
  889.     color: {color:like button liked};
  890.   }
  891.   .tags, .cont-source {
  892.     margin-top: 0.5em;
  893.   }
  894.   .tags a:not(:last-child) {
  895.     margin-right: 0.65em;
  896.   }
  897.   .tags a::before {
  898.     content: "{text:tags prefix}";
  899.   }
  900.   .cont-source {
  901.     text-transform: lowercase;
  902.   }
  903.  
  904.   /* post notes */
  905.   div#notes {
  906.     margin-top: 2em;
  907.   }
  908.   ol.notes {
  909.     margin: 0;
  910.     padding: 0;
  911.     list-style: none;
  912.   }
  913.   li.note {
  914.     margin: 0.25em 0;
  915.   }
  916.   li.note::before {
  917.     display: none;
  918.   }
  919.   ol.notes a {
  920.     text-decoration: none;
  921.   }
  922.   ol.notes img {
  923.     display: none;
  924.   }
  925.   li.note blockquote {
  926.     margin-top: 0.5em;
  927.   }
  928.  
  929.   /* pagination, load more button */
  930.   div#pagination {
  931.     position: absolute;
  932.     bottom: 0;
  933.     text-align: center;
  934.     background: {color:pagination background};
  935.     padding: 0.75em;
  936.     text-transform: lowercase;
  937.     width: 100%;
  938.     -webkit-box-sizing: border-box;
  939.             box-sizing: border-box;
  940.   }
  941.   div#pagination.infinite, div#pagination.loadmore, span#load-more:not(.loadmore) {
  942.     display: none;
  943.   }
  944.   div#pagination * {
  945.     margin: 0 0.35em;
  946.     display: inline-block;
  947.   }
  948.   div#pagination span {
  949.     color: {color:color 2};
  950.     font-weight: bold;
  951.     font-size: 1.1em;
  952.   }
  953.   div#pagination.simple .page {
  954.     display: none;
  955.   }
  956.   span#load-more {
  957.     display: block;
  958.     position: absolute;
  959.     bottom: 1em;
  960.     width: 100%;
  961.     text-align: center;
  962.     text-decoration: underline;
  963.     text-transform: lowercase;
  964.     margin-top: 1em;
  965.     color: {color:color 1};
  966.     cursor: help;
  967.   }
  968.   span#load-more:hover {
  969.     color: {color:color 2};
  970.   }
  971.  
  972.   div#infscr-loading {
  973.     display: none !important;
  974.   }
  975.  
  976.   /* tumblr controls */
  977.   iframe.tmblr-iframe {
  978.     -webkit-transform: scale(0.75);
  979.             transform: scale(0.75);
  980.     -webkit-transform-origin: right;
  981.             transform-origin: right;
  982.     {block:Ifdarktumblrcontrols}
  983.     -webkit-filter: invert(100%) hue-rotate(180deg);
  984.     filter: invert(100%) hue-rotate(180deg);
  985.     {/block:Ifdarktumblrcontrols}
  986.     opacity: 0.75;
  987.     -webkit-transition: 0.2s all ease-in-out;
  988.     transition: 0.2s all ease-in-out;
  989.   }
  990.   iframe.tmblr-iframe:hover {
  991.     opacity: 1;
  992.   }
  993.  
  994.   /* scroll buttons */
  995.   a#scroll-up {
  996.     position: fixed;
  997.     bottom: 31px;
  998.     bottom: calc(20px + 1em);
  999.     right: 5px;
  1000.     background: #fff;
  1001.     padding: 6px 2.5px 2px;
  1002.     color: #000;
  1003.     font-size: 0.8em;
  1004.     text-decoration: none;
  1005.   }
  1006.   a#scroll-down {
  1007.     position: fixed;
  1008.     bottom: 31px;
  1009.     bottom: calc(20px + 1em);
  1010.     right: 23px;
  1011.     right: calc(10px + 1em);
  1012.     background: #fff;
  1013.     padding: 6px 2.5px 2px;
  1014.     color: #000;
  1015.     font-size: 0.8em;
  1016.     text-decoration: none;
  1017.     display: none;
  1018.   }
  1019.   a#cred {
  1020.     position: fixed;
  1021.     bottom: 5px;
  1022.     right: 5px;
  1023.     background: #fff;
  1024.     padding: 3px 6px;
  1025.     color: #000;
  1026.     font-size: 0.8em;
  1027.     text-decoration: none;
  1028.   }
  1029.  
  1030.   /* responsiveness */
  1031.   @media screen and (min-width: 850px) {
  1032.     .post-info {
  1033.       height: 1.625em;
  1034.     }
  1035.   }
  1036.   @media screen and (max-width: 850px) {
  1037.     div#container {
  1038.       width: {text:post width};
  1039.       min-width: 0;
  1040.     }
  1041.     aside#sidebar, section#posts {
  1042.       display: block;
  1043.       position: relative;
  1044.     }
  1045.     aside#sidebar {
  1046.       margin-top: 125px;
  1047.       width: 100%;
  1048.     }
  1049.     section#posts {
  1050.       margin: 1em auto 3em;
  1051.     }
  1052.   }
  1053.   @media screen and (max-width: 500px) {
  1054.     div#container {
  1055.       padding: 1em;
  1056.       -webkit-box-sizing: border-box;
  1057.               box-sizing: border-box;
  1058.       width: 100%;
  1059.     }
  1060.     aside#sidebar {
  1061.       margin-top: 0px;
  1062.     }
  1063.     div#blog-info .rainbow {
  1064.       display: block;
  1065.       margin: 0 0 1em;
  1066.       {block:IfNotsidebarimage}margin-bottom: calc(-1 * 125px / 5);{/block:IfNotsidebarimage}
  1067.       -webkit-transform: rotate(45deg);
  1068.               transform: rotate(45deg);
  1069.     }
  1070.     div#blog-info .rainbow img {
  1071.       -webkit-transform: rotate(-45deg);
  1072.               transform: rotate(-45deg);
  1073.     }
  1074.     div#blog-info div#blog-title {
  1075.       margin-left: 0;
  1076.       margin-top: 1em;
  1077.       max-width: 100%;
  1078.     }
  1079.     .post {
  1080.       width: 100%;
  1081.       min-width: 0;
  1082.     }
  1083.     .blog.deactivated span::after {
  1084.       opacity: 1;
  1085.     }
  1086.     .post-info {
  1087.       padding-right: 3.25em;
  1088.       opacity: 1;
  1089.       margin-left: 0;
  1090.     }
  1091.     .post-info a {
  1092.       opacity: 1 !important;
  1093.       margin-left: 0 !important;
  1094.     }
  1095.     a.post-type {
  1096.       margin-bottom: 0.5em;
  1097.     }
  1098.     iframe.tmblr-iframe {
  1099.       -webkit-transform: none;
  1100.               transform: none;
  1101.       -webkit-filter: none;
  1102.       filter: none;
  1103.       top: 0.5em;
  1104.     }
  1105.     iframe.tmblr-iframe--app-cta-button {
  1106.       display: none !important;
  1107.     }
  1108.   }
  1109.  
  1110.   {CustomCSS}
  1111. </style>
  1112.  
  1113. </head>
  1114. <body>
  1115.  
  1116.   <div id="hbar" class="{select:topbar}"></div>
  1117.  
  1118.   <div id="container">
  1119.  
  1120.     <aside id="sidebar">
  1121.       <div id="blog-info">
  1122.         {block:Ifrainbowsidebaricon}
  1123.         <div class="rainbow">
  1124.           <div class="rainbow-color rainbow-red"></div>
  1125.           <div class="rainbow-color rainbow-orange"></div>
  1126.           <div class="rainbow-color rainbow-yellow"></div>
  1127.           <div class="rainbow-color rainbow-green"></div>
  1128.           <div class="rainbow-color rainbow-blue"></div>
  1129.           <div class="rainbow-color rainbow-purple"></div>
  1130.           <div class="rainbow-cloud-left"><div></div><div></div><div></div></div>
  1131.           <div class="rainbow-cloud-right"><div></div><div></div><div></div></div>
  1132.           {block:Ifsidebarimage}<img src="{image:sidebar}" id="sidebar-avatar" />
  1133.           {block:Ifprideflagimage}<div class="rainbow-dot"></div>{/block:Ifprideflagimage}{/block:Ifsidebarimage}
  1134.         </div>
  1135.         {/block:Ifrainbowsidebaricon}
  1136.         {block:IfNotrainbowsidebaricon}
  1137.         <div id="blog-avatar">
  1138.           <img src="{image:sidebar}" />
  1139.         </div>
  1140.         {/block:IfNotrainbowsidebaricon}
  1141.         <div id="blog-title"><a href="{BlogURL}">{Title}</a></div>
  1142.         {block:Ifdescription}<div id="blog-desc">{text:description}</div>{/block:Ifdescription}
  1143.       </div>
  1144.       <div id="blog-links">
  1145.         <a href="{BlogURL}">{lang:Home}</a><a href="/ask">ask</a>{block:Ifbloglinkoneurl}<a href="{text:blog link one url}">{text:blog link one name}</a>{/block:Ifbloglinkoneurl}{block:Ifbloglinktwourl}<a href="{text:blog link two url}">{text:blog link two name}</a>{/block:Ifbloglinktwourl}{block:Ifbloglinkthreeurl}<a href="{text:blog link three url}">{text:blog link three name}</a>{/block:Ifbloglinkthreeurl}{block:Ifbloglinkfoururl}<a href="{text:blog link four url}">{text:blog link four name}</a>{/block:Ifbloglinkfoururl}{block:Ifbloglinkfiveurl}<a href="{text:blog link five url}">{text:blog link five name}</a>{/block:Ifbloglinkfiveurl}<a href="/archive">{lang:Archive}</a>
  1146.       </div>
  1147.       <div id="search"><form action="/search" method="get"><input type="text" name="q" value="{SearchQuery}" placeholder="{lang:Search}"/></form></div>
  1148.     </aside>
  1149.  
  1150.     <section id="posts">
  1151.       {block:Posts}
  1152.  
  1153.       {block:NewDayDate}<div class="new-post-date"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}">{Month} {DayOfMonth}, {Year}</a></div>{/block:NewDayDate}
  1154.  
  1155.       <article class="post {PostType}" id="{PostID}">
  1156.  
  1157.         {block:Date}<div class="post-time"><a href="{Permalink}">{12Hour}:{Minutes} {AmPm}</a></div>{/block:Date}
  1158.  
  1159.         {block:Title}<a href="{Permalink}" class="title">{Title}</a>{/block:Title}
  1160.  
  1161.         {block:Text}{block:NotReblog}<div class="body">{Body}</div>{/block:NotReblog}{block:RebloggedFrom}{block:Reblogs}<div class="reblogged"><div class="blog{block:IsDeactivated} deactivated{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:Reblogs}{/block:RebloggedFrom}{/block:Text}
  1162.  
  1163.         {block:Photo}<a href="#" class="pic" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>{/block:Photo}
  1164.  
  1165.         {block:Photoset}<div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>{/block:Photoset}
  1166.  
  1167.         {block:Quote}<div><div class="words">{Quote}</div>{block:Ifrainbowquotes}<div class="words-shadow">{Quote}</div>{block:Ifrainbowquotes}</div>{block:Source}<div class="source">{Source}</div>{/block:Source}{/block:Quote}
  1168.  
  1169.         {block:Link}<a href="{URL}" class="path{block:Description} has-desc{/block:Description}" {Target}>{Name}</a>
  1170.         {block:Description}{block:NotReblog}<div class="desc">{Description}</div>{/block:NotReblog}{block:RebloggedFrom}{block:Reblogs}<div class="reblogged"><div class="blog{block:IsDeactivated} deactivated{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:Reblogs}{/block:RebloggedFrom}{/block:Description}{/block:Link}
  1171.  
  1172.         {block:Chat}<div>{block:Lines}<div class="chat-line">{block:Label}<div class="label">{Label}</div>{/block:Label}<div>{Line}</div></div>{/block:Lines}</div>{/block:Chat}
  1173.  
  1174.         {block:Audio}{block:AudioEmbed}{AudioEmbed}{/block:AudioEmbed}{/block:Audio}
  1175.  
  1176.         {block:Video}{VideoEmbed-500}{/block:Video}
  1177.  
  1178.         {block:Answer}<div class="qna"><div class="blog"><span>{Asker}</span></div><span class="speech">{Question}</span></div>
  1179.         {block:Answerer}<div class="qna"><div class="blog"><span>{Answerer}</span></div><span class="speech">{Answer}</span></div>{block:Reblogs}<div class="qna"><div class="blog{block:IsDeactivated} deactivated{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div><span class="speech">{Body}</span></div>{/block:Reblogs}{/block:Answerer}
  1180.         {block:NotReblog}<div class="qna"><div class="blog{block:IsDeactivated} deactivated{/block:IsDeactivated}"><span><a href="{Permalink}">{Name}</a></span></div><span class="speech">{Answer}</span></div>{/block:NotReblog}{/block:Answer}
  1181.  
  1182.         {block:Caption}<div class="caption">{block:NotReblog}{Caption}{/block:NotReblog}{block:RebloggedFrom}{block:Reblogs}<div class="reblogged"><div class="blog{block:IsDeactivated} deactivated{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:Reblogs}{/block:RebloggedFrom}</div>{/block:Caption}
  1183.  
  1184.         {block:Date}<div class="info">
  1185.           <div>
  1186.             <div class="post-info"><a href="{Permalink}" class="post-type {select:post type decorations}">{block:Text}{lang:Text}{/block:Text}{block:Photo}{lang:Photo}{/block:Photo}{block:Photoset}{lang:Photoset}{/block:Photoset}{block:Quote}{lang:Quote}{/block:Quote}{block:Link}{lang:Link}{/block:Link}{block:Chat}{lang:Chat}{/block:Chat}{block:Audio}{lang:Audio}{/block:Audio}{block:Video}{lang:Video}{/block:Video}{block:Answer}{lang:Answer}{/block:Answer}</a><a href="{Permalink}" class="notecount">{NoteCountWithLabel}</a>{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}" {Target}>{lang:Via}</a><a href="{ReblogRootURL}" title="{ReblogRootName}" {Target}>{lang:Source}</a>{/block:RebloggedFrom}</div>
  1187.             <div class="buttons">
  1188.               <div class="like-button">{LikeButton}<span class="new-like-button"><span class="sf sf-heart-2-o"></span></span></div>
  1189.               <div class="reblog-button"><a href="{ReblogURL}" {Target}><span class="sf sf-reblog-o"></span></a></div>
  1190.             </div>
  1191.           </div>
  1192.           {block:HasTags}<div class="tags">
  1193.             {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
  1194.           </div>{/block:HasTags}
  1195.           {block:PermalinkPage}{block:ContentSource}<div class="cont-source">{lang:Source}: <a href="{SourceURL}" {Target}>{SourceTitle}</a></div>{/block:ContentSource}{/block:PermalinkPage}
  1196.         </div>{/block:Date}
  1197.  
  1198.         {block:PostNotes}<div id="notes">
  1199.           {PostNotes}
  1200.         </div>{/block:PostNotes}
  1201.  
  1202.       </article>
  1203.       {/block:Posts}
  1204.  
  1205.       {block:Pagination}
  1206.       <div id="pagination" class="{select:pagination type}">
  1207.         {block:PreviousPage}<a href="{PreviousPage}" class="prev">{lang:Prev}</a>{/block:PreviousPage}
  1208.         {block:JumpPagination length="3"}{block:CurrentPage}<span class="page">{PageNumber}</span>{/block:CurrentPage}{block:JumpPage}<a href="{URL}" class="jump page">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1209.         {block:NextPage}<a href="{NextPage}" class="next">{lang:Next}</a>{/block:NextPage}
  1210.       </div>
  1211.       <span id="load-more" class="{select:pagination type}">{lang:Load more posts}</span>
  1212.       {/block:Pagination}
  1213.  
  1214.     </section>
  1215.  
  1216.     <a href="#" id="scroll-up"><span class="sf sf-arrow-up"></span></a>
  1217.     <a href="#" id="scroll-down"><span class="sf sf-arrow-down"></span></a>
  1218.     <a href="https://annasthms.tumblr.com/" id="cred" title="theme by annasthms" {Target}>a</a>
  1219.  
  1220.   </div>
  1221.  
  1222.   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1223.   <script src="//static.tumblr.com/yfztp0u/brUohnb4m/infinitescroll.js"></script>
  1224.   <script src="//static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  1225.   <script src="//dl.dropbox.com/s/r1lcsrj2ofap7n5/videoResize.min.js?dl=0"></script>
  1226.   <script src="//cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  1227.  
  1228.   <script>
  1229.   function pagination(pag) {
  1230.     switch (pag) {
  1231.       case 'infinite':
  1232.       $container = $('section#posts');
  1233.       $container.infinitescroll({
  1234.         navSelector: 'div#pagination',
  1235.         nextSelector: 'a.next',
  1236.         itemSelector: '.post',
  1237.         loading: {
  1238.           img: '',
  1239.           msgText: '',
  1240.         },
  1241.         debug: true,
  1242.         bufferPx: 0
  1243.       }, function(items) {
  1244.         var $items = $(items);
  1245.         $items.addClass('new');
  1246.         $items.find('.photo-slideshow').pxuPhotoset({lightbox: true, rounded: false, gutter: '{text:photoset gutter}', borderRadius: '0px', photoset: '.photo-slideshow', photoWrap: '.photo-data', photo: '.pxu-photo'});
  1247.         $('.new.video iframe, .new .body iframe, .new .caption iframe, .new .reblogged iframe').videoResize();
  1248.         $itemsIDs = $items.map(function(){
  1249.           return this.id;
  1250.         }).get();
  1251.         Tumblr.LikeButton.get_status_by_post_ids($itemsIDs);
  1252.         $items.removeClass('new');
  1253.       });
  1254.       break;
  1255.       case 'loadmore':
  1256.       $container = $('section#posts');
  1257.       $container.infinitescroll({
  1258.         navSelector: 'div#pagination',
  1259.         nextSelector: 'a.next',
  1260.         itemSelector: '.post',
  1261.         loading: {
  1262.           img: '',
  1263.           msgText: '',
  1264.         },
  1265.         debug: true,
  1266.         errorCallback: function(){$('#load-more').hide();}
  1267.       }, function(items) {
  1268.         var $items = $(items);
  1269.         $items.addClass('new');
  1270.         $items.find('.photo-slideshow').pxuPhotoset({lightbox: true, rounded: false, gutter: '{text:photoset gutter}', borderRadius: '0px', photoset: '.photo-slideshow', photoWrap: '.photo-data', photo: '.pxu-photo'});
  1271.         $('.new.video iframe, .new .body iframe, .new .caption iframe, .new .reblogged iframe').videoResize();
  1272.         $itemsIDs = $items.map(function(){
  1273.           return this.id;
  1274.         }).get();
  1275.         Tumblr.LikeButton.get_status_by_post_ids($itemsIDs);
  1276.         $items.removeClass('new');
  1277.       });
  1278.       $(window).unbind('.infscr');
  1279.       $('#load-more').click(function(){
  1280.         $container.infinitescroll('retrieve');
  1281.         return false;
  1282.       });
  1283.       break;
  1284.       default:
  1285.     }
  1286.     (0==$("a#cred").length||$("a#cred:empty").length>0)&&window.location.replace("https://annasthms.tumblr.com");
  1287.   }
  1288.  
  1289.   $(document).ready(function(){
  1290.     // minimal soundcloud player © shythemes.tumblr
  1291.     var color = '{color:color 1}'; // color of play button (hex)
  1292.     $('.soundcloud_audio_player').each(function(){
  1293.       $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=false&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 116, width: '100%' });
  1294.     });
  1295.  
  1296.     $('.photo-slideshow').pxuPhotoset({
  1297.       lightbox: true,
  1298.       rounded: false,
  1299.       gutter: '{text:photoset gutter}',
  1300.       borderRadius: '0px',
  1301.       photoset: '.photo-slideshow',
  1302.       photoWrap: '.photo-data',
  1303.       photo: '.pxu-photo'
  1304.     });
  1305.  
  1306.     $('.video iframe, .body iframe, .caption iframe, .reblogged iframe').videoResize();
  1307.     $(window).resize(function(){
  1308.       $('.video iframe, .body iframe, .caption iframe, .reblogged iframe').videoResize();
  1309.     });
  1310.  
  1311.     $('.chat-line .label').each(function(){
  1312.       $(this).text($(this).text().split(":")[0]);
  1313.     });
  1314.  
  1315.     $('.quote .source').each(function(){
  1316.       $(this).html($(this).html().split('(via')[0].trim());
  1317.       if($(this).is(':empty'))
  1318.       $(this).remove();
  1319.     });
  1320.  
  1321.     var scrolltop = 0;
  1322.     $('a#scroll-up').click(function(){
  1323.       scrolltop = $(window).scrollTop();
  1324.       $('html, body').animate({ scrollTop: 0 }, 1500);
  1325.       $('a#scroll-down').fadeIn();
  1326.       return false;
  1327.     });
  1328.     $('a#scroll-down').click(function(){
  1329.       $('html, body').animate({scrollTop: scrolltop}, 1500);
  1330.       $('a#scroll-down').fadeOut();
  1331.       return false;
  1332.     });
  1333.  
  1334.     {block:IndexPage}
  1335.     pagination('{select:pagination type}');
  1336.     {/block:IndexPage}
  1337.   });
  1338.   </script>
  1339.  
  1340. </body>
  1341. </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!