API tools faq
paste
Advertisement
rdjhiddlestons

Tags Page #2 by bishopkate (formerly rdjhiddlestons)

rdjhiddlestons
Aug 7th, 2015
5,599
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 13.09 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3. <!--
  4. TAGS PAGE #2
  5. by http://thomashiddlestons.co.vu [bishopkate]
  6.  
  7. ·PLEASE DO NOT REMOVE CREDIT
  8. ·DO NOT CLAIM AS YOUR OWN
  9. ·DO NOT USE AS A BASE CODE
  10. ·Edit as much as you want just don't remove the credit
  11.  
  12. Send me any questions or anything regarding problems with the page so I can fix them
  13. -->
  14.  
  15. <title>{Title}</title>
  16. <link rel="shortcut icon" href="{Favicon}">
  17.  
  18. <!--TOOLTIPS-->
  19. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  20. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  21. <script>
  22.    (function($){
  23.        $(document).ready(function(){
  24.            $("[title]").style_my_tooltips({
  25.                tip_follows_cursor:true,
  26.                tip_delay_time:200,
  27.                tip_fade_speed:300
  28.            }
  29.                );
  30.        });
  31.    })(jQuery);
  32. </script>
  33.  
  34. <!-----------------------------------FONTS------------------------------->
  35.  
  36. <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
  37. <link href='http://fonts.googleapis.com/css?family=Exo+2' rel='stylesheet' type='text/css'>
  38. <link href='http://fonts.googleapis.com/css?family=Dosis:500' rel='stylesheet' type='text/css'>
  39.  
  40. <style type="text/css">
  41.  
  42. #s-m-t-tooltip {
  43.     max-width: 300px;
  44.     margin:15px;
  45.     position:absolute;
  46.     padding: 1px 8px 1px 8px;
  47.     z-index: 99999;
  48.     display: inline-block;
  49.     font-family: Pt-sans, sans-serif;
  50.     font-size: 9px;
  51.     text-transform:uppercase;
  52.     color:{color:Links Hover};
  53.     background-color:#fff;
  54.     border: 1px solid #fff;
  55.     box-shadow: 1px 1px 2px #858585;
  56. }
  57.  
  58. /*SCROLLBAR*/
  59.  ::-webkit-scrollbar {
  60.      width: 4px;
  61.      height:auto;
  62.      background:#fff;
  63.      }
  64.     ::-webkit-scrollbar-corner {
  65.         padding:2px;
  66.         background:#fff;
  67.         }
  68.     ::-webkit-scrollbar-button:vertical {
  69.         height:3px;
  70.         display: block;
  71.         background:#000;
  72.         }
  73.     ::-webkit-scrollbar-button:horizontal {
  74.         width: 3px;
  75.         height: 3px;
  76.         display: block;
  77.         background:#000;
  78.         }
  79.     ::-webkit-scrollbar-thumb:vertical {
  80.         background:#000;
  81.        
  82.         }
  83.     ::-webkit-scrollbar-thumb:horizontal {
  84.         background:#fff;
  85.         }
  86.     ::-webkit-scrollbar-thumb {
  87.         background: #000;
  88.         }
  89.  
  90. body {
  91.         font-family: calibri;
  92.         font-size: 12px;
  93.         color: #999999;
  94.         background-color: #fff;
  95. }
  96.  
  97. a {
  98.         text-decoration: none;
  99.         color: #666666;
  100. }
  101.  
  102. a:hover {
  103.         color: #666666;
  104. }
  105.  
  106. /*SIDEBAR*/
  107.  
  108. .sidebar {
  109.         width: 400px;
  110.         position: fixed;
  111.         left: 0;
  112.         top: 0;
  113.         height: 100%;
  114.         background-color: #000;/*CHANGE COLOR OF SIDEBAR*/
  115.         background-image: url("https://31.media.tumblr.com/0da58c4094a43aad2fd19d00b7a20b34/tumblr_inline_nh5w9hWfBg1qhfdx8.jpg"); /*CHANGE SIDEBAR IMAGE 1*/
  116.         background-size: cover;
  117.          -webkit-transition: all 0.5s ease-out;
  118.         -moz-transition: all 0.5s ease-out;
  119.         transition: all 0.5s ease-out;
  120. }
  121.  
  122. .sidebar:hover {
  123.     position:fixed;
  124.     width:400px;
  125.     height:100%;
  126.     background-image: url("https://31.media.tumblr.com/492db697aa61017deb7a3b15573d1537/tumblr_inline_nh5w8wsSS11qhfdx8.jpg"); /*CHANGE SIDEBAR IMAGE 2*/
  127.     background-size:cover;
  128.      -webkit-transition: all 0.5s ease-out;
  129.         -moz-transition: all 0.5s ease-out;
  130.         transition: all 0.5s ease-out;
  131. }
  132.  
  133. /*NAVIGATION LINKS*/
  134.  
  135.  nav {
  136.         text-align: center;
  137.          position:absolute;
  138.         bottom:70px;
  139.         width:400px;
  140.         opacity:0;
  141.          -webkit-transition: all 0.5s ease-out;
  142.         -moz-transition: all 0.5s ease-out;
  143.         transition: all 0.5s ease-out;
  144. }
  145.  
  146. nav a {
  147.     margin-left:auto;
  148.     margin-right:auto;
  149.     width:220px;
  150.     display:block;
  151.     color: #fff; /*CHANGE SIDEBAR LINKS COLOR*/
  152.     font-size:18px;
  153.     font-family: 'Exo 2', sans-serif;
  154.     text-transform:lowercase;
  155.     border-top: inset 1px #fff;
  156.     -webkit-transition: all 0.5s ease-out;
  157.         -moz-transition: all 0.5s ease-out;
  158.         transition: all 0.5s ease-out;
  159. }
  160.  
  161. nav a:last-child {
  162.     border-bottom: inset 1px #fff;
  163. }
  164.  
  165. nav a:hover {
  166.     color: #fff;
  167.     letter-spacing:10px;
  168.     -webkit-transition: all 0.5s ease-out;
  169.         -moz-transition: all 0.5s ease-out;
  170.         transition: all 0.5s ease-out;
  171. }
  172.  
  173. .sidebar:hover nav {
  174.     opacity: 1;
  175.      -webkit-transition: all 0.5s ease-out;
  176.         -moz-transition: all 0.5s ease-out;
  177.         transition: all 0.5s ease-out;
  178. }
  179.  
  180. .container {
  181.     width:700px;
  182.     height:100%;
  183.     margin-left:480px;
  184.     margin-top:10px;
  185. }
  186.  
  187. .title {
  188.     font-family: 'Dosis', sans-serif;
  189.     margin-left:70px;
  190.     text-align:center;
  191.     font-size:28px;
  192.     text-transform:uppercase;
  193.     color:#666; /*CHANGE TITLE COLOR*/
  194.     margin-bottom:30px;
  195.     letter-spacing:10px;
  196. }
  197.  
  198. /*CREDIT. DO NOT REMOVE*/
  199.  
  200. .credit {
  201.     position:fixed;
  202.     bottom:25px;
  203.     right:25px;
  204.     font-size:10px;
  205.     font-family: 'Calibri';
  206.     background: #fff;
  207.     color:#000;
  208.     text-transform:uppercase;
  209. }
  210.  
  211. .credit a {
  212.     color:#000;
  213.     background:#fff;
  214.     padding:4px;
  215.     -webkit-transition: all 0.5s ease-out;
  216.         -moz-transition: all 0.5s ease-out;
  217.         transition: all 0.5s ease-out;
  218. }
  219.  
  220. .credit a:hover {
  221.     color:#fff;
  222.     background:#000;
  223.     padding:4px;
  224.     -webkit-transition: all 0.5s ease-out;
  225.         -moz-transition: all 0.5s ease-out;
  226.         transition: all 0.5s ease-out;
  227. }
  228.  
  229. /*TAGS*/
  230. .box {
  231.     display:inline-block;
  232.     position:auto;
  233.     width:200px;
  234.     height:250px;
  235.     margin-bottom:100px;
  236.     margin-right:30px;
  237. }
  238.  
  239.  
  240. .heading {
  241.     color:#fff;
  242.     background-color:#000; /*CHANGE HEADING BACKGROUND COLOR*/
  243.     width:200px;
  244.     height:auto;
  245.     font-family: 'Dosis', sans-serif;
  246.     font-size:16px;
  247.     text-transform:uppercase;
  248.     text-align:center;
  249. }
  250.  
  251. .tags {
  252.     display:inline-block;
  253.     width:200px;
  254.     height:250px;
  255.     font-family: 'Roboto', sans-serif;
  256.     font-size:11px;
  257.     text-align:left;
  258.     margin-left:7px;
  259.     margin-bottom:7px;
  260.     margin-top:10px;
  261.     overflow-y:auto;
  262.     overflow-x:hidden;
  263. }
  264.  
  265. .tags a {
  266.     display:inline-block;
  267.     width:200px;
  268.     height:auto;
  269.     margin-bottom:5px;
  270.     font-family: 'Roboto', sans-serif;
  271.     font-size:11px;
  272.     text-transform:uppercase;
  273.     text-align:left;
  274.     color:#000; /*CHANGE TAG LINKS COLOR*/
  275.     background-color:transparent; /*CHANGE TAG LINKS BACKGROUND COLOR*/
  276.     text-decoration:none;
  277.     -moz-transition-duration: 0.6s;
  278.         -o-transition-duration: 0.6s;
  279.         -webkit-transition-duration: 0.6s;
  280.         transition-duration: 0.6s;
  281. }
  282.  
  283. .tags a:hover {
  284.     text-indent:20px;
  285.     text-decoration:none;
  286.     -moz-transition-duration: 0.6s;
  287.         -o-transition-duration: 0.6s;
  288.         -webkit-transition-duration: 0.6s;
  289.         transition-duration: 0.6s;
  290. }
  291.  
  292. </style>
  293. </head>
  294.  
  295. <body>
  296. <div class="sidebar">
  297.        <nav>
  298.            <a href="/">home</a>
  299.            <a href="/ask">ASK</a>
  300.            <a href="/submit">SUBMIT</a>
  301.            <a href="http://thomashiddlestons.co.vu">CREDIT</a>
  302.        </nav>
  303.       </div>      
  304.  
  305. <div class="container">
  306.  
  307. <div class="title">Navigation</div><!--CHANGE TITLE NAME-->
  308.  
  309.  <div>
  310. <!--FIRST ROW BEGINS HERE-->
  311. <!--FIRST BOX-->
  312.  
  313. <div class="box">
  314.     <div class="heading">People</div>
  315.     <div class="tags">
  316.             <a href="/tagged/tom-hiddleston">Tom Hiddleston</a>
  317.             <a href="/tagged/robert-downey-jr">Robert Downey Jr</a>
  318.             <a href="/tagged/andrew-garfield">Andrew Garfield</a>
  319.             <a href="/tagged/jimmy-fallon">Jimmy Fallon</a>
  320.             <a href="/tagged/emma-stone">Emma Stone</a>
  321.             <a href="/tagged/sebastian-stan">Sebastian Stan</a>
  322.             <a href="/tagged/paul-rudd">Paul Rudd</a>
  323.             <a href="/tagged/mark-ruffalo">Mark Ruffalo</a>
  324.             <a href="/tagged/karen-gillan">Karen Gillan</a>
  325.             <a href="/tagged/rachel-weisz">Rachel Weisz</a>
  326.             <a href="/tagged/cillian-murphy">Cillian Murphy</a>
  327.             <a href="/tagged/jennifer-lawrence">Jennifer Lawrence</a>
  328.     </div>
  329. </div>
  330.  
  331.     <!--I recommend for you to put your tags as "/tagged/url" instead of the whole url "http://yourusername.tumblr.com/tagged/url" because when you change blog names you don't have to tweak this again-->
  332.        
  333. <!--END OF FIRST BOX-->
  334.  
  335. <!--SECOND BOX-->
  336. <div class="box">
  337.     <div class="heading">Movies</div>
  338.     <div class="tags">
  339.             <a href="/tagged/the-avengers">The Avengers</a>
  340.             <a href="/tagged/m:-thor">Thor</a>
  341.             <a href="/tagged/thor:-the-dark-world">Thor: the dark world</a>
  342.             <a href="/tagged/only-lovers-left-alive">Only Lovers Left Alive</a>
  343.             <a href="/tagged/guardians-of-the-galaxy">Guardians of the Galaxy</a>
  344.             <a href="/tagged/the-hunger-games">The hunger games</a>
  345.             <a href="/tagged/catching-fire">Catching fire</a>
  346.             <a href="/tagged/mockingjay">Mockingjay</a>
  347.             <a href="/tagged/the-amazing-spiderman">The Amazing Spider-man</a>
  348.             <a href="/tagged/m:-XMFC">X-Men: First Class</a>
  349.             <a href="/tagged/captain-america:-the-winter-soldier">Captain America: the winter soldier</a>
  350.             <a href="/tagged/back-to-the-future">Back to the future</a>
  351.             <a href="/tagged/the-lion-king">The Lion King</a>
  352.             <a href="/tagged/frozen">Frozen</a>
  353.             <a href="/tagged/disney">Disney films</a>
  354.     </div>
  355. </div>
  356.  
  357. <!--END OF SECOND BOX-->
  358.  
  359. <!--THIRD BOX-->
  360. <div class="box">
  361.     <div class="heading">TV</div>
  362.     <div class="tags">
  363.              <a href="/tagged/community">Community</a>
  364.             <a href="/tagged/snl">SNL</a>
  365.             <a href="/tagged/OUAT">Once Upon a Time</a>
  366.             <a href="/tagged/brooklyn-nine-nine">Brooklyn Nine-Nine</a>
  367.             <a href="/tagged/arrested-development">Arrested Development</a>
  368.             <a href="/tagged/tssjf">The Tonight Show starring jimmy fallon</a>
  369.             <a href="/tagged/doctor-who">Doctor Who</a>
  370.             <a href="/tagged/agents-of-SHIELD">Agents of Shield</a>
  371.             <a href="/tagged/the-hollow-crown">The Hollow Crown</a>
  372.             <a href="/tagged/suburban-shootout">Suburban Shootout</a>
  373.             <a href="/tagged/avengers:-emh">Avengers: EMH</a>
  374.        
  375.     </div>
  376. </div>
  377.  
  378. <!--END OF THIRD BOX-->    
  379. </div>
  380. <!--END OF FIRST ROW-->
  381.  
  382. <!--If you want to add more rows you can simply copy everything from FIRST ROW BEGINS HERE to END OF FIRST ROW and paste it underneath the other rows-->
  383.  
  384. <!--SECOND ROW BEGINS HERE-->
  385. <div>
  386. <!--FOURTH BOX-->
  387. <div class="box">
  388.     <div class="heading">Comics</div>
  389.     <div class="tags">
  390.             <a href="/tagged/kate-bishop">kate bishop</a>
  391.             <a href="/tagged/janet-van-dyne">janet van dyne</a>
  392.             <a href="/tagged/comic!loki">loki</a>
  393.             <a href="/tagged/c:-hawkeye">hawkeye vol. 4</a>
  394.             <a href="/tagged/amora-the-enchantress">amora the enchantress</a>
  395.             <a href="/tagged/young-avengers">young avengers</a>
  396.             <a href="/tagged/agent-of-asgard">Agent of Asgard</a>
  397.             <a href="/tagged/harley-quinn">Harley Quinn</a>
  398.             <a href="/tagged/cassie-lang">Cassie Lang</a>
  399.             <a href="/tagged/comics">General Comics Tag</a>
  400.     </div>
  401. </div>
  402.  
  403. <!--END OF FOURTH BOX-->
  404.  
  405. <!--FIFTH BOX-->
  406. <div class="box">
  407.     <div class="heading">Others</div>
  408.     <div class="tags">
  409.             <a href="/tagged/avengers-cast">Avengers Cast</a>
  410.             <a href="/tagged/marvel-cast">General marvel cast</a>
  411.             <a href="/tagged/community-cast">Community cast</a>
  412.             <a href="/tagged/filed-under:-favorite-movies">Favorite films</a>
  413.             <a href="/tagged/whoa-lady!">Attractive ladies</a>
  414.             <a href="/tagged/boys-that-make-me-swoon">Cute men</a>
  415.             <a href="/tagged/daniela's-rambles">Shit I say</a>
  416.             <a href="/tagged/same">About Me</a>
  417.             <a href="/tagged/oh-look-that's-me!">My face</a>
  418.             <a href="/tagged/music">Music</a>
  419.             <a href="/tagged/reference">Reference</a>
  420.             <a href="/tagged/resources">resources</a>
  421.     </div>
  422. </div>
  423.  
  424. <!--END OF FIFTH BOX-->
  425.  
  426. <!--SIXTH BOX-->
  427.  
  428. <!--END OF SIXTH BOX-->
  429. <div class="box">
  430.     <div class="heading">Other Blogs/Links</div>
  431.     <div class="tags">
  432.             <a href="/about-me">Really About me</a>
  433.             <a href="/mystuff">My edits and gifs</a>
  434.             <a href="/RPs">RPs</a>
  435.             <a href="/tagged/*themes">Themes & Pages</a>
  436.            <a href="http://dailymcucast.tumblr.com">MCU Cast Sideblog</a>
  437.            <a href="http://twitter.com/danipc28">Twitter</a>
  438.            <a href="/post/81969279138">Follow Forever 2013</a>
  439.    </div>
  440. </div>
  441. <!--END OF SECOND ROW-->
  442.  
  443. </div>
  444.  
  445.  
  446. <!--DO NOT REMOVE CREDIT-->
  447. <div class="credit">
  448.    <a href="http://thomashiddlestons.co.vu" title="themes by daniela">© bishopkate</a>
  449. </div>
  450. <!--DO NOT REMOVE CREDIT-->
  451.          
  452. </div>
  453.  
  454. </body>
  455. </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!