API tools faq
paste
Advertisement
ninapattz

05. Ängie

ninapattz
Jul 1st, 2019
2,385
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 16.28 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4.     <head>
  5.  
  6.     <!----------------------------------------------------------------------
  7.        Ängie by lewispastel
  8.        Please, do not remove the credits.
  9.    ----------------------------------------------------------------------->
  10.  
  11.         <title>{Title}</title>
  12.         <meta charset="utf-8">
  13.         <meta name="viewport" content="width=device-width, initial-scale=1">
  14.         <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  15.         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  16.         <link href="https://fonts.googleapis.com/css?family=Lora&display=swap" rel="stylesheet">
  17.         <link href="https://fonts.googleapis.com/css?family=Dancing+Script&display=swap" rel="stylesheet">
  18.         <link href="https://fonts.googleapis.com/css?family=Catamaran&display=swap" rel="stylesheet">
  19.         <link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet">
  20.         <link rel="shortcurt icon" href="{Favicon}">
  21.         <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  22.         <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  23.         <script>(function($){$(document).ready(function(){$("a[title]").style_my_tooltips({tip_follows_cursor:true,
  24.         tip_delay_time:90, tip_fade_speed:600,attribute:"title"});});})(jQuery);</script>
  25.         <meta name="color:Background" content="#fbfbfb"/>
  26.         <meta name="color:Posts Background" content="#ffffff"/>
  27.         <meta name="color:Sidebar Background" content="#ffffff"/>
  28.         <meta name="color:Title Tumblr" content="#f8003b"/>
  29.         <meta name="color:Menu Background" content="#f2f2f2"/>
  30.         <meta name="color:Menu Text" content="#000000"/>
  31.         <meta name="color:Menu Text Hover" content="#f8003b"/>
  32.         <meta name="color:Title Post" content="#000000"/>
  33.         <meta name="color:Link" content="#f8003b"/>
  34.         <meta name="color:Link Hover" content="#000000"/>
  35.         <meta name="color:Blockquote" content="#f8003b"/>
  36.         <meta name="color:Text Selection" content="#ffffff"/>
  37.         <meta name="color:Selection" content="#f8003b"/>
  38.         <meta name="color:Scrollbar Background" content="#f2f2f2"/>
  39.         <meta name="color:Scrollbar Front" content="#f8003b"/>
  40.         <meta name="color:Question Background" content="#f2f2f2"/>
  41.         <meta name="color:Question Color" content="#000000"/>
  42.         <meta name="color:Asker Background" content="#f8003b"/>
  43.         <meta name="color:Asker Text" content="#ffffff"/>
  44.         <meta name="image:Sidebar" content="https://66.media.tumblr.com/071129e2dde77d50d082e4270da5991f/tumblr_inline_ptvfk6nwmg1tc6nae_540.png"/>
  45.         <meta name="text:Link One" content="/"/>
  46.         <meta name="text:Link One Title" content="Index"/>
  47.         <meta name="text:Link Two" content="/ask"/>
  48.         <meta name="text:Link Two Title" content="Contact"/>
  49.         <meta name="text:Link Three" content="/"/>
  50.         <meta name="text:Link Three Title" content="Navigation"/>
  51.         <meta name="text:Link Four" content="/"/>
  52.         <meta name="text:Link Four Title" content="About Me"/>
  53.         <meta name="text:Link Five" content="/archive"/>
  54.         <meta name="text:Link Five Title" content="History"/>
  55.  
  56.  
  57.         <style type="text/css">
  58.                                                    
  59.             body{
  60.                 background: {color:Background};
  61.                 font-family: 'Montserrat', sans-serif;
  62.                 font-size: 12px;
  63.                 text-align: justify;
  64.             }
  65.  
  66.             #content{
  67.                 width: 800px;
  68.                 margin-left: 40%;
  69.                 background: transparent;
  70.                 margin-top: 50px;
  71.             }
  72.  
  73.             #posts{
  74.                 width: 540px;
  75.             }
  76.  
  77.             .posts{
  78.                 width: 540px;
  79.                 padding: 20px;
  80.                 background: {color:Posts Background};
  81.                 margin-top: 15px;
  82.             }
  83.  
  84.             #sidebar{
  85.                 width: 220px;
  86.                 margin-left: -320px;
  87.                 background: {color:Sidebar Background};
  88.                 padding: 10px;
  89.                 position: fixed;
  90.             }
  91.  
  92.             .imgside{
  93.                 width: 200px;
  94.                 padding: 10px;
  95.             }
  96.  
  97.             .title{
  98.                 font-size: 16pt;
  99.                 text-align: center;
  100.                 font-family: 'Dancing Script', cursive;
  101.                 color: {color:Title Tumblr};
  102.             }
  103.  
  104.             .description{
  105.                 font-size:8pt;
  106.                 text-align:justify;
  107.                 padding:10px;
  108.                 margin-top:-20px;
  109.                 width: 200px;
  110.                 margin-bottom: 5px;
  111.             }  
  112.                                                
  113.             .menu{
  114.                 padding: 10px;
  115.                 font-size: 10px;
  116.                 margin-bottom:-10px;
  117.             }
  118.  
  119.             .menu ul{
  120.                 list-style-type: none;
  121.                 margin: 0;
  122.                 padding: 0;
  123.                 width: 210px;
  124.             }
  125.  
  126.             .menu li{
  127.                 width: 20px;
  128.                 height: 20px;
  129.                 background:{color:Menu Background};
  130.                 display: inline;
  131.                 margin-right: 3px;
  132.                 padding: 10px
  133.             }
  134.  
  135.             .menu a{
  136.                 color: {color:Menu Text};
  137.                 text-decoration:none;
  138.                 text-align: center;
  139.                 -webkit-transition: all 1s ease;
  140.                 -moz-transition:all 1s ease;
  141.                 -o-transition: all 1s ease;
  142.                 transition: all 1s ease;
  143.                 }
  144.  
  145.             .menu a:hover{
  146.                 color: {color:Menu Text Hover};
  147.                 -webkit-transition: all 1s ease;
  148.                 -moz-transition:all 1s ease;
  149.                 -o-transition: all 1s ease;
  150.                 transition: all 1s ease;
  151.                 opacity: 1.0;
  152.             }
  153.  
  154.             .menu i{
  155.                 font-size: 12px;
  156.             }
  157.  
  158.             h2{
  159.                 font-family: 'Dancing Script', cursive;
  160.                 color:{color:Title Post};
  161.             }
  162.  
  163.             a{
  164.                 text-decoration:none;
  165.                 color:{color:Link};
  166.             }
  167.  
  168.             a:hover{
  169.                 -webkit-transition: all 1s ease;
  170.                 -moz-transition:all 1s ease;
  171.                 -o-transition: all 1s ease;
  172.                 transition: all 1s ease;
  173.                 color:{color:Link Hover};
  174.             }
  175.  
  176.             ol{
  177.                 list-style-type: upper-roman;
  178.             }
  179.  
  180.             ul{
  181.                 list-style-type: square;
  182.             }
  183.  
  184.             blockquote{
  185.                 border-left: 2px {color:Blockquote} solid;
  186.                 padding: 10px;
  187.                 font-size: 12px;
  188.             }
  189.  
  190.             ::-moz-selection {
  191.                 color: {color:Text Selection};
  192.                 background: {color:Selection};
  193.             }
  194.  
  195.             ::selection {
  196.                 color: {color:Text Selection};
  197.                 background: {color:Selection};
  198.             }
  199.  
  200.             ::-webkit-scrollbar-track {
  201.                 background-color: {color:Scrollbar Background};
  202.             }
  203.  
  204.             ::-webkit-scrollbar {
  205.                 width: 6px;
  206.                 background: {color:Scrollbar Background};
  207.             }
  208.  
  209.             ::-webkit-scrollbar-thumb {
  210.                 background: {color:Scrollbar Front};
  211.             }
  212.  
  213.             .button{
  214.                 background: {color:Menu Background};
  215.                 width: 26px;
  216.                 height: 26px;
  217.                 text-align: center;
  218.                 border-style: none;
  219.             }
  220.                                                    
  221.             .button:hover{
  222.                 -webkit-transition: all 1s ease;
  223.                 -moz-transition:all 1s ease;
  224.                 -o-transition: all 1s ease;
  225.                 transition: all 1s ease;
  226.                 color:{color:Link};
  227.             }
  228.  
  229.             .barra{
  230.                 height: 25px;
  231.                 width: 145px;
  232.                 margin-left:12px;
  233.                 border: {color:Menu Background} solid 1px;
  234.             }
  235.  
  236.             .quote{
  237.                 font-family: 'Catamaran', sans-serif;
  238.                 font-size: 30px;
  239.             }
  240.  
  241.             .source{
  242.                 text-align: right;
  243.             }
  244.  
  245.             .question{
  246.                 background-color: {color:Question Background};
  247.                 padding: 10px;
  248.                 color: {color:Question Color};
  249.             }
  250.  
  251.             .asker-avatar{
  252.                 border:solid 3px {color:Asker Background};
  253.             }
  254.  
  255.             .asker{
  256.                 padding: 5px;
  257.                 color:{color:Asker Text};
  258.                 background-color: {color:Asker Background};
  259.                 margin-top: -40px;
  260.                 margin-left:0px;
  261.                 text-align: left;
  262.                 width: auto;
  263.             }
  264.  
  265.             .chat .lines{
  266.                 background:{color:Menu Background};
  267.                 padding: 5px;
  268.                 margin-top: 5px;
  269.                 width: 500px;
  270.             }
  271.  
  272.             .page{
  273.                 width: 30px;
  274.                 height: 20px;
  275.                 background-color: {color:Menu Background};
  276.                 color:{color:Menu Text};
  277.                 padding: 5px;
  278.             }
  279.  
  280.             .page:hover{
  281.                 color: {color:Menu Text Hover};
  282.                 -webkit-transition: all 1s ease;
  283.                 -moz-transition:all 1s ease;
  284.                 -o-transition: all 1s ease;
  285.                 transition: all 1s ease;
  286.                 opacity: 1.0;
  287.             }
  288.                                    
  289.             .perma{
  290.                 padding: 8px;
  291.                 background-color: {color:Menu Background};
  292.                 font-size: 8pt;
  293.             }
  294.  
  295.             .perma a{
  296.                 color: {color:Menu Text};
  297.             }
  298.  
  299.             .perma a:hover{
  300.                 color: {color:Menu Text Hover};
  301.                 -webkit-transition: all 1s ease;
  302.                 -moz-transition:all 1s ease;
  303.                 -o-transition: all 1s ease;
  304.                 transition: all 1s ease;
  305.                 opacity: 1.0;
  306.             }
  307.  
  308.             .like{
  309.                 margin-top: -19px;
  310.                 margin-left: 460px;
  311.                 padding: 5px;
  312.             }
  313.  
  314.             .reblog{
  315.                 margin-top: -26px;
  316.                 margin-left: 430px;
  317.                 padding: 5px;
  318.             }
  319.  
  320.             .tags{
  321.                 font-size: 8pt;
  322.                 display: inline;
  323.             }
  324.  
  325.             .tags a{
  326.                 color:{color:Menu Text};
  327.             }
  328.  
  329.             .tags a:hover{
  330.                 color: {color:Menu Text Hover};
  331.                 -webkit-transition: all 1s ease;
  332.                 -moz-transition:all 1s ease;
  333.                 -o-transition: all 1s ease;
  334.                 transition: all 1s ease;
  335.                 opacity: 1.0;
  336.             }
  337.  
  338.             #perma{
  339.                 width:540px;
  340.                 background: {color:Posts Background};
  341.                 padding: 20px;
  342.                 margin-top:15px;
  343.             }
  344.  
  345.             ol.notes{
  346.                 list-style:none;
  347.                 margin-left: -42px;
  348.                 margin-top: -20px;
  349.             }
  350.                        
  351.             ol.notes img{
  352.                 margin-right: 5px;
  353.             }
  354.  
  355.             ol.notes li{
  356.                 margin:3px;
  357.                 width: 500px;
  358.                 padding:3px;
  359.                 background:{color:Menu Background};
  360.                 color:{color:Menu Text};
  361.                 font-size:9pt;
  362.             }
  363.  
  364.             ol.notes a{
  365.                 color:{color:Link};
  366.             }
  367.  
  368.             ol.notes a:hover{
  369.                 color: {color:Link Hover};
  370.                 -webkit-transition: all 1s ease;
  371.                 -moz-transition:all 1s ease;
  372.                 -o-transition: all 1s ease;
  373.                 transition: all 1s ease;
  374.                 opacity: 1.0;
  375.             }
  376.  
  377.             .credits{
  378.                 right: 25px;
  379.                 bottom: 25px;
  380.                 font-weight: bold;
  381.                 position: fixed;
  382.                 text-align: center;
  383.             }
  384.  
  385.             .credits a{
  386.                 color:{color:Link};
  387.             }
  388.  
  389.             .credits a:hover{
  390.                 color: {color:Link Hover};
  391.                 -webkit-transition: all 1s ease;
  392.                 -moz-transition:all 1s ease;
  393.                 -o-transition: all 1s ease;
  394.                 transition: all 1s ease;
  395.                 opacity: 1.0;
  396.             }
  397.  
  398.             #s-m-t-tooltip{
  399.                 background: {color:Menu Background};
  400.                 color:{color:Menu Text};
  401.                 max-width: 300px;
  402.                 padding: 5px;
  403.                 font-size: 9pt;
  404.                 margin:20px 0px 20px 0px;
  405.             }
  406.            
  407.             .more{
  408.                 position: relative;
  409.                 margin:20px;
  410.                 margin-left: auto;
  411.                 margin-right: auto;
  412.                 display: block;
  413.             }
  414.            
  415.             .more a:link{
  416.                 -webkit-transition: all 1s ease;
  417.                 -moz-transition:all 1s ease;
  418.                 -o-transition: all 1s ease;
  419.                 transition: all 1s ease;
  420.                 padding:5px;
  421.                 border-bottom: 1px solid transparent;
  422.                 background: transparent;
  423.                 color: {color:Menu Text};
  424.             }
  425.            
  426.             .more a:hover{
  427.                 color: {color:Menu Text Hover};
  428.                 border-bottom: solid 1px {color:Menu Text Hover};
  429.                 -webkit-transition: all 1s ease;
  430.                 -moz-transition:all 1s ease;
  431.                 -o-transition: all 1s ease;
  432.                 transition: all 1s ease;
  433.             }
  434.            
  435.         </style>
  436.  
  437.     </head>
  438.                                            
  439.     <body>
  440.  
  441.         <div class="credits">
  442.             <center><a href="https://lewispastel.tumblr.com/" title="lewispastel">
  443.                 <i class="fa fa-heart" aria-hidden="true"></i>
  444.             </a></center>
  445.         </div>
  446.  
  447.         <div id="content">
  448.  
  449.             <div id="sidebar">
  450.  
  451.                 <img src="{image:Sidebar}" class="imgside">
  452.  
  453.                 <div class="title">
  454.                     {Title}
  455.                 </div>
  456.  
  457.                 <br>
  458.  
  459.                 <div class="description">
  460.                     {Description}
  461.                 </div>
  462.  
  463.                 <div class="menu">
  464.                     <ul>
  465.                         <li><a href="{text:Link One}" title="{text:Link One Title}"><i class="fa fa-home"></i></a></li>
  466.                         <li><a href="{text:Link Two}" title="{text:Link Two Title}"><i class="fa fa-envelope"></i></a></li>
  467.                         <li><a href="{text:Link Three}" title="{text:Link Three Title}"><i class="fa fa-bars"></i></a></li>
  468.                         <li><a href="{text:Link Four}" title="{text:Link Four Title}"><i class="fa fa-cog"></i></a></li>
  469.                         <li><a href="{text:Link Five}" title="{text:Link Five Title}"><i class="fa fa-archive"></i></a></li>
  470.                     </ul><br><br>
  471.                 </div>
  472.                
  473.                 <form action="/search" method="get">
  474.                     <input type="text" name="q" value="{SearchQuery}" class="barra"/>
  475.                     <button type="submit" class="button"><i class="fa fa-search"></i></button>
  476.                 </form>
  477.  
  478.                 <br><center>
  479.  
  480.                 {block:Pagination}
  481.                     {block:PreviousPage}
  482.                         <a href="{PreviousPage}" class="page"><i class="fa fa-chevron-left"></i></a>
  483.                     {/block:PreviousPage}
  484.                     {block:NextPage}
  485.                         <a href="{NextPage}" class="page"><i class="fa fa-chevron-right"></i></a>
  486.                     {/block:NextPage}
  487.                 {/block:Pagination}
  488.  
  489.                 </center>
  490.  
  491.             </div>
  492.  
  493.             <div id="posts">
  494.                
  495.                 {block:Posts}
  496.                    
  497.                     <div class="posts">
  498.  
  499.                         {block:Text}
  500.                             {block:Title}
  501.                             <center>
  502.                             <h2><a href="{Permalink}">{Title}</a></h2>
  503.                             </center>
  504.                             {/block:Title}
  505.                             {Body} 
  506.                             {block:More}<center>
  507.                             <div class="more">
  508.                             <a href="{Permalink}" class="more-btn">
  509.                             Read More</a>
  510.                             </div></center>
  511.                             {/block:More}
  512.                         {/block:Text}
  513.  
  514.                         {block:Photo}
  515.                             <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  516.                             {block:Caption}
  517.                             {Caption}
  518.                             {block:More}<center>
  519.                             <div class="more">
  520.                             <a href="{Permalink}" class="more-btn">
  521.                             Read More</a>
  522.                             </div></center>
  523.                             {/block:More}
  524.                             {/block:Caption}
  525.                         {/block:Photo}
  526.  
  527.                         {block:Panorama}
  528.                             {LinkOpenTag}
  529.                             <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
  530.                             {LinkCloseTag}
  531.                             {block:Caption}
  532.                             {Caption}
  533.                             {block:More}<center>
  534.                             <div class="more">
  535.                             <a href="{Permalink}" class="more-btn">
  536.                             Read More</a>
  537.                             </div></center>
  538.                             {/block:More}
  539.                             {/block:Caption}
  540.                         {/block:Panorama}
  541.  
  542.                         {block:Photoset}
  543.                             {Photoset-500}
  544.                             {block:Caption}
  545.                             {Caption}
  546.                             {block:More}<center>
  547.                             <div class="more">
  548.                             <a href="{Permalink}" class="more-btn">
  549.                             Read More</a>
  550.                             </div></center>
  551.                             {/block:More}
  552.                             {/block:Caption}
  553.                         {/block:Photoset}
  554.  
  555.                         {block:Quote}
  556.                             <div class="quote">&ldquo;{Quote}&rdquo;</div>
  557.                             {block:Source}
  558.                             <div class="source">&ndash; {Source}</div><br>
  559.                             {/block:Source}
  560.                         {/block:Quote}
  561.  
  562.                         {block:Link}
  563.                             <center><h2><a href="{URL}" class="link" {Target}>{Name}</a></h2></center>
  564.                             {block:Description}
  565.                             {Description}
  566.                             {block:More}<center>
  567.                             <div class="more">
  568.                             <a href="{Permalink}" class="more-btn">
  569.                             Read More</a>
  570.                             </div></center>
  571.                             {/block:More}
  572.                             {/block:Description}
  573.                         {/block:Link}
  574.  
  575.                         {block:Chat}
  576.                             {block:Lines}
  577.                             <div class="chat">
  578.                             <div class="lines">{block:Label}
  579.                             <span><b>{Label}</b></span>
  580.                             {/block:Label}
  581.                             {Line}</div></div>
  582.                             {/block:Lines}
  583.                             <div style="margin-bottom: 15px"></div>
  584.                         {/block:Chat}
  585.  
  586.                         {block:Video}
  587.                             {Video-500}{block:Caption}
  588.                             {Caption}
  589.                             {/block:Caption}
  590.                         {/block:Video}
  591.  
  592.                         {block:Audio}
  593.                             {AudioEmbed}{block:Caption}
  594.                             {Caption}
  595.                             {/block:Caption}
  596.                         {/block:Audio}
  597.  
  598.                         {block:Answer}
  599.                             <div class="question">
  600.                             <img class="asker-avatar" src="{AskerPortraitURL-48}" alt="">
  601.                             <div style="margin-left: 54px;"><div class="asker">{Asker} asked:</div></div><br>
  602.                             {Question}</div>
  603.                             {block:Answerer}
  604.                             {Answer}
  605.                             {/block:Answerer}
  606.                             {Replies}
  607.                         {/block:Answer}
  608.                        
  609.                         <div class="perma">
  610.                             &nbsp;&nbsp;
  611.                             {block:Date}{TimeAgo}{/block:Date}
  612.                             &nbsp;&nbsp;&nbsp;&nbsp;
  613.                             {block:NoteCount}<a href="{Permalink}" title="Permalink">{NoteCount} Notes</a>{/block:NoteCount}
  614.                             <div class="like">
  615.                             {LikeButton size="13"}</div>
  616.                             <div class="reblog">
  617.                             {ReblogButton size="13"}</div>
  618.                         </div>
  619.                    
  620.                        
  621.                         {block:HasTags}{block:Tags}<div class="tags">#<a href="{TagURL}">{Tag}</a>&nbsp;&nbsp;</div>{/block:Tags}{/block:HasTags}
  622.  
  623.                     </div>
  624.                                
  625.                     {block:PermalinkPage}
  626.                         <div id="perma">
  627.                         {block:PostNotes}{PostNotes-16}&nbsp;&nbsp;{PostNotes}{/block:PostNotes}
  628.                         </div> 
  629.                     {/block:PermalinkPage}
  630.                    
  631.  
  632.                 {/block:Posts}
  633.            
  634.             </div>
  635.  
  636.         </div><br><br>
  637.                                            
  638.     </body>
  639.  
  640. </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!