API tools faq
paste
Advertisement
cloudstrifes

TUMBLR PAGE RP001. Aesthetic and simplistic

cloudstrifes
Aug 27th, 2014
12,629
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.13 KB | None | 0 0
raw download clone embed print report
  1. <!------------------------------------------------------------------------
  2. A tumblr theme created by Monika from noctislucisscaelum.tumblr.com
  3. Theme code name: RP001. Aesthetic and simplistic
  4.  
  5. The idea and the code belongs to the author.
  6.  
  7. TERMS OF USAGE
  8. 1. Don't use this code as a base for your own themes
  9. 2. Don't delete any credits.
  10. 3. Don't redistribute as your own.
  11.  
  12. IMPORTANT:
  13. If you want to change colors to fit your needs disable the 'redirect' option in the menu it will make the theme static so you can customize the theme. And remember to enable it after you are finished!
  14. ------------------------------------------------------------------------->
  15.  
  16. <html>
  17. <head>
  18. <title>{Title}</title>
  19. <link rel="shortcut icon" href="{Favicon}">
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  22.  
  23. {block:Hidden}
  24. <meta name="color:background" content="#a8a0d0"/>
  25. <meta name="color:border" content="#ffffff"/>
  26. <meta name="color:credit border" content="#b7b0dd"/>
  27. <meta name="color:credit color" content="#d0cbee"/>
  28.  
  29. <meta name="color:urls" content="#ede9ff"/>
  30. <meta name="color:text" content="#ffffff"/>
  31. <meta name="color:text shadow" content="#746e95"/>
  32.  
  33. <meta name="text:old url" content="your previous url"/>
  34. <meta name="text:New url" content="your current url"/>
  35.  
  36. <meta name="if:redirect" content="1"/>
  37. {/block:Hidden}
  38.  
  39. {block:ifredirect}
  40. <script>
  41.  setTimeout( sendto, 5000 );
  42.  
  43.  function sendto() {
  44.    window.location.replace('http://{text:New url}.tumblr.com' + window.location.pathname);
  45.  }
  46. </script>
  47. {/block:ifredirect}
  48.  
  49.  
  50. <link href='http://fonts.googleapis.com/css?family=Raleway:800' rel='stylesheet' type='text/css'>
  51.  
  52. <!------------------------------------------------------------------------
  53. ------------------------------ CSS SECTION -------------------------------
  54. ------------------------------------------------------------------------->
  55. <style type="text/css">
  56. /*------------------------------------------------------------------------
  57. ----------------------------- GENERAL CODES ------------------------------
  58. ------------------------------------------------------------------------*/
  59. html, body {
  60.     background: {color:background};
  61.     font-family: Arial, Helvetica, sans-serif;
  62.     color: {color: text};
  63. }
  64.  
  65. iframe#tumblr_controls {
  66.     display:none;
  67.     top:5px;
  68.     right:10px!important;
  69.     position:fixed!important;
  70.     opacity:0;
  71.     z-index: 1;
  72.     filter:alpha(opacity=0);
  73.     -moz-opacity:0;
  74. }
  75.  
  76.  
  77. /*------------------- CREDIT CODES !!! DO NOT DELETE -------------------*/
  78. .credit {
  79.         position: fixed;
  80.         z-index: 2;
  81.         bottom: 20px;
  82.         right: 20px;
  83.         padding: 7px;
  84.         border: 1px solid {color:credit border};
  85. }
  86.  
  87. .nlc {
  88.         border-bottom: 1px solid {color:credit border};
  89.         font-family: Georgia;
  90. }
  91.  
  92. .credit a {
  93.     color: {color:credit color};
  94.     text-decoration:none;
  95. }
  96.  
  97. .themes {
  98.        
  99.         font-family: Calibri, sans-serif;
  100.         font-size: 9px;
  101.         text-transform: uppercase;
  102. }
  103.  
  104. /*------------------------------------------------------------------------
  105. ------------------------------ MAIN CONTENT ------------------------------
  106. ------------------------------------------------------------------------*/
  107. #content {
  108.     width: 100%;
  109.     height: 100%;
  110.     position:fixed;
  111.     display:table;
  112. }
  113. .wrap {
  114.     display:table-cell;
  115.     vertical-align:middle;
  116.    
  117. }
  118. .content {
  119.     position:relative;
  120.     margin: auto;
  121.     width: 425px;
  122. }
  123.  
  124. .oldurl {
  125.     min-width: 270px;
  126.     border-top:2px solid {color:border};
  127.     text-align:right;
  128.     position:absolute;
  129.     top: 9px;
  130.     right: 155px;
  131.     font-family: 'Raleway', sans-serif;
  132.     text-transform: uppercase;
  133.     font-size: 17px;
  134. }
  135.  
  136. .oldurl h2 {
  137.     font-family: 'Raleway', sans-serif;
  138.     text-transform: uppercase;
  139.     font-size: 17px;
  140.     display:inline-block;
  141.     position:relative;
  142.     color: {color:urls};
  143.     background: {color:background} ;
  144.     padding: 0 0 0 10px;
  145.     top: -25px;
  146. }
  147.  
  148.  
  149. .movedto {
  150.     position: relative;
  151.     top: -22px;
  152.     color: {color:text};
  153. }
  154. .moved {
  155.     font-family: 'Raleway', sans-serif;
  156.     text-transform: uppercase;
  157.     font-size: 47px;
  158. }
  159.  
  160. .to {
  161.     font-family: 'Raleway', sans-serif;
  162.     text-transform: uppercase;
  163.     font-size: 90px;
  164. }
  165.  
  166. .newurl {
  167.     position: relative;
  168.     top: -20px;
  169.     width: 400px;
  170.     border-top:2px solid {color:border};
  171. }
  172.  
  173. .newurl h1 {
  174.     font-family: 'Raleway', sans-serif;
  175.     text-transform: uppercase;
  176.     font-size: 30px;
  177.     display:inline-block;
  178.     position:relative;
  179.     color: {color:urls};
  180.     background: {color:background} ;
  181.     padding: 0 10px 0 0px;
  182.     top: -40px;
  183. }
  184.  
  185. .wait {
  186.     margin-top: -80px;
  187.     clear: both;
  188.     position: relative;
  189.     font-style: oblique;
  190.     font-family: Arial, Helvetica, sans-serif;
  191.     font-size: 12px;
  192.     color: {color:text};
  193. }
  194.  
  195. /*--------------------------- LOADING CIRCLES --------------------------*/
  196. .spinner {
  197.     margin: 60px auto;
  198.     margin-bottom: -100px;
  199.     width: 70px;
  200.     text-align: center;
  201. }
  202.  
  203. .spinner > div {
  204.     width: 18px;
  205.     height: 18px;
  206.     background-color: {color:border};
  207.     border-radius: 100%;
  208.     display: inline-block;
  209.     -webkit-animation: bouncedelay 1.4s infinite ease-in-out;
  210.     animation: bouncedelay 1.4s infinite ease-in-out;
  211.     -webkit-animation-fill-mode: both;
  212.     animation-fill-mode: both;
  213. }
  214.  
  215. .spinner .bounce1 {
  216.     -webkit-animation-delay: -0.32s;
  217.     animation-delay: -0.32s;
  218. }
  219.  
  220. .spinner .bounce2 {
  221.     -webkit-animation-delay: -0.16s;
  222.     animation-delay: -0.16s;
  223. }
  224.  
  225. @-webkit-keyframes bouncedelay {
  226.     0%, 80%, 100% { -webkit-transform: scale(0.0) }
  227.     40% { -webkit-transform: scale(1.0) }
  228. }
  229.  
  230. @keyframes bouncedelay {
  231.     0%, 80%, 100% {
  232.         transform: scale(0.0);
  233.         -webkit-transform: scale(0.0);
  234.     }
  235.     40% {
  236.         transform: scale(1.0);
  237.         -webkit-transform: scale(1.0);
  238.     }
  239. }
  240. </style>
  241. </head>
  242. <body>
  243. <!------------------------------------------------------------------------
  244. ------------------------ CREDIT !!! DO NOT DELETE ------------------------
  245. ------------------------------------------------------------------------->
  246. <div class="credit"><a href="http://noctislucisscaelum.tumblr.com"> <div class="nlc">NLC</div> <div class="themes">themes</div> </a></div>
  247.  
  248. <!------------------------------------------------------------------------
  249. -------------------------- CONTENT OF THE PAGE ---------------------------
  250. ------------------------------------------------------------------------->
  251. <div id="content">
  252. <div class="wrap">
  253. <div class="content">
  254. <div class="adresses">
  255. <div class="oldurl"><h2>{text:old url}</h2></div>
  256. <div class="movedto"><span class="moved">has moved</span> <span class="to">to</span></div>
  257. <div class="newurl"><h1>{text:new url}</h1></div>
  258. <div class="wait">wait a few seconds to be redirected to the requested page</div></div>
  259. <div class="spinner">
  260.   <div class="bounce1"></div>
  261.   <div class="bounce2"></div>
  262.   <div class="bounce3"></div>
  263. </div>
  264. </div></div>
  265. </body>
  266. </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!