SHARE
TWEET

plot

a guest Oct 21st, 2019 107 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!--
  5.  
  6.     ABOUT I (updated 8/1/19)
  7.         by alydae
  8.        
  9.             - do not steal any part of this code
  10.             - do not even TOUCH the credit
  11.             - direct questions to enchantedthemes.tumblr.com
  12.            
  13.     thank you for using!!!
  14.  
  15. -->
  16.  
  17. <title>about</title>
  18. <link rel="shortcut icon" href="{Favicon}">
  19.  
  20. <!-- scripts - DO NOT TOUCH -->
  21.  
  22. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  23.  
  24. <script src="https://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  25. <script>
  26.    (function($){
  27.        $(document).ready(function(){
  28.            $("[title]").style_my_tooltips({
  29.                tip_follows_cursor:true,
  30.                tip_delay_time:200,
  31.                tip_fade_speed:300
  32.            }
  33.                );
  34.        });
  35.    })(jQuery);
  36. </script>
  37.  
  38. <!-- custom font -->
  39.  
  40. <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'>
  41.  
  42. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
  43.  
  44.  
  45. <style type="text/css">
  46.  
  47. @keyframes fadein {
  48.     from { opacity:0; }
  49.     to   { opacity:1; }
  50. }
  51.  
  52. @-moz-keyframes fadein {
  53.     from { opacity:0; }
  54.     to   { opacity:1; }
  55. }
  56.  
  57. @-webkit-keyframes fadein {
  58.     from { opacity:0; }
  59.     to   { opacity:1; }
  60. }
  61.  
  62. @-ms-keyframes fadein {
  63.     from { opacity:0; }
  64.     to   { opacity:1; }
  65. }
  66.  
  67. @-o-keyframes fadein {
  68.     from { opacity:0; }
  69.     to   { opacity:1; }
  70. }
  71.  
  72. /*-- selection --*/
  73.  
  74. ::-moz-selection { background:#eee; color:#222; }
  75. ::selection { background:#eee; color:#222; }
  76.  
  77. /*-- scrollbar --*/
  78.  
  79. ::-webkit-scrollbar {  
  80.     width:1px;  
  81.     height:2px;
  82. }  
  83.    
  84. ::-webkit-scrollbar-thumb { background-color:#aaa; } /* scrollbar colour */
  85.  
  86. /*-- tooltips --*/
  87.  
  88. #s-m-t-tooltip {
  89.     color:#666;
  90.     background-color:#fff;
  91.     font-size:8px;
  92.     font-family:'Open Sans', helvetica, sans-serif;
  93.     letter-spacing:1px;
  94.     text-transform:uppercase;
  95.     text-align:center;
  96.     position:absolute;
  97.     padding:0px 5px 0px 5px;
  98.     margin-top:30px;
  99.     border:1px solid #eee;
  100.     z-index:9999;
  101. }
  102.  
  103. /*-- tumblr controls --*/
  104.  
  105. .tmblr-iframe, .iframe-controls–desktop {
  106.     display:none !important;
  107. }
  108.  
  109. /*-- general customisation --*/
  110.  
  111. body {
  112.     color:#666; /* text colour */
  113.     background-color:#fafafa; /* background colour */
  114.     font-style:normal;
  115.     font-family:'Open Sans', helvetica, sans-serif;
  116.     font-size:10px;
  117.     background-image: url('https://66.media.tumblr.com/04d9c45d7d583fa99be382755d7f0038/tumblr_pzm0h2qaA81y80i20o1_1280.png');
  118.     font-weight:400;
  119.     text-decoration:none;
  120.     line-height:180%;
  121.     -moz-osx-font-smoothing: grayscale;
  122.     -webkit-font-smoothing: antialiased;
  123.     font-smoothing: antialiased;
  124.     -webkit-animation: fadein 1.5s;
  125.     -moz-animation: fadein 1.5s;
  126.     -o-animation: fadein 1.5s;
  127.     animation: fadein 1.5s;
  128. }
  129.  
  130. a {
  131.     text-decoration:none;
  132.     text-transform:uppercase;
  133.     font-size:9px;
  134.     font-weight:600;
  135.     letter-spacing:0.75px;
  136.     color:#222; /* links colour */
  137.     transition-duration: 0.6s;  
  138.     -moz-transition-duration: 0.6s;  
  139.     -webkit-transition-duration: 0.6s;  
  140.     -o-transition-duration: 0.6s;
  141. }  
  142.    
  143. a:hover {
  144.     color:#bad0f1; /* links hover colour */
  145.     cursor:pointer;
  146.     transition-duration: 0.6s;  
  147.     -moz-transition-duration: 0.6s;  
  148.     -webkit-transition-duration: 0.6s;  
  149.     -o-transition-duration: 0.6s;
  150. }
  151.  
  152. b, strong { font-weight:600; color:#444; }
  153. i, em { font-style:italic; }
  154.  
  155. h1, h2, h3, h4, h5, h6 {
  156.     color:#000;
  157.     text-transform:uppercase!important;
  158.     text-align:left;
  159.     font-weight:bold;
  160.     font-size:12px;
  161.     letter-spacing:1px;
  162. }
  163.  
  164. blockquote {
  165.     padding-left:10px;
  166.     margin:0;
  167.     border-left:1px solid #eee;
  168. }
  169.  
  170. h1 {
  171.     text-transform:uppercase;
  172.     font-weight:bold;
  173.     font-size:11px;
  174.     text-align:center;
  175. }
  176.  
  177. /*-- container --*/
  178.  
  179. #container {
  180.     position:fixed;
  181.     width:700px;
  182.     height:550px;
  183.     top:50%;
  184.     left:50%;
  185.     transform:translate(-50%, -50%);
  186. }
  187.  
  188. /*-- header --*/
  189.  
  190. #header {
  191.     background:#fff; /* background colour */
  192.     height:50px;
  193.     margin:auto;
  194.     border:10px solid #eee; /* border colour */
  195. }
  196.  
  197. .title {
  198.     margin-left:16px;
  199.     float:left;
  200.     text-transform:uppercase;
  201.     font-size:12px;
  202.     line-height:50px;
  203.     font-weight:bold;
  204.     letter-spacing:1px;
  205.     color:#222; /* title colour */
  206. }
  207.  
  208. .links {
  209.     margin-right:16px;
  210.     float:right;
  211.     position:relative;
  212.     line-height:50px;
  213. }
  214.  
  215. .links a { margin-left:7.5px; }
  216.  
  217. /*-- third section --*/
  218.  
  219. #about {
  220.     position:relative;
  221.     background:#fff; /* background colour */
  222.     margin-top:15px;
  223.     padding:130px;
  224.     border:10px solid #eee; /* border colour */
  225. }
  226.  
  227. .atext {
  228.     padding-right:10px;
  229.     max-height:178px;
  230.     overflow-Y:scroll;
  231.     margin-top: 15px;
  232. }
  233.  
  234. /*-- credit - DO NOT TOUCH --*/
  235.  
  236. .credit a {
  237.     font-size:10px;
  238.     bottom:15px;
  239.     right:20px;
  240.     position:fixed;
  241. }
  242.  
  243. </style>
  244. </head>
  245.  
  246.  
  247. <body>
  248.  
  249. <div id="container">
  250.  
  251. <div id="header">
  252.     <div class="title">about</div> <!-- title -->
  253.     <div class="links">
  254.     <!-- feel free to add more! -->
  255.         <a href="/">home.</a>
  256.         <a href="/ask">ask.</a>
  257.         <a href="/">link.</a>
  258.         <a href="/archive">archive.</a>
  259.     </div>
  260. </div>
  261.    
  262. <div id="info">
  263.     <!-- the default is your icon. if you want to change it, remove {PortraitURL-128} and replace it with the image url of the one you want. -->
  264.    
  265.    
  266.     <!-- this is where the basic info goes. there's only space for four. -->
  267.    
  268.    
  269.     <div class="social">
  270.     <!-- between the "" is where you put a link to your account. to change the icon, go to https://fontawesome.com/icons. leave the 'fa-fw' there. there's only space for four. -->
  271.    
  272.    
  273. <div id="about">
  274.     <div class="atext">
  275.     <!-- this is where you about text goes -->
  276.     this is where you put the body of your about. you can use <b>bold</b>, <i>italics</i>, <big>big</big>, <small>small</small>, <s>strikethroughs</s>, <a href="/">links</a> as well as
  277.     <blockquote>blockquotes</blockquote>
  278.  
  279.     <p><h1>there's a subtitle style for you as well</h1></p>
  280.  
  281.     <p>there is no limit as it will scroll automatically. remember to close paragraphs! <s>and now for some dummy text</s> </p>
  282.  
  283.     <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. nulla condimentum vel tellus vitae volutpat. aliquam ut quam ac elit congue luctus. nam a lacus sed odio iaculis luctus a in turpis. aenean erat libero, dapibus at porttitor in, auctor sed urna. aenean a molestie est. sed rhoncus justo sit amet felis sodales maximus. etiam pharetra nibh dolor, nec imperdiet enim hendrerit a. pellentesque et dolor sed ligula bibendum dignissim sit amet quis lectus. praesent ornare sem dolor, ut tristique massa tincidunt eget. morbi viverra id mi sed efficitur. integer id maximus enim, nec placerat nisi. ut consequat augue enim, a eleifend mauris tristique et.</p>
  284.     </div>
  285. </div>
  286.  
  287. </div>
  288.  
  289.  
  290. <!-- credit - DO NOT TOUCH -->
  291.  
  292. <div class="credit">
  293.     <a href="https://enchantedthemes.tumblr.com" title="alydae">A.</a>
  294. </div>
  295.  
  296.  
  297. </body>
  298. </html>
RAW Paste Data
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
 
Top