API tools faq
paste
Advertisement
Petra1999

THEME 02 | cloudythms.tumblr.com

Petra1999
Jan 17th, 2016
585
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 12.39 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!----------------------------------------
  4.  
  5.    {  
  6.         cloudythms  
  7.                       }
  8.          
  9.       THEME 02
  10.   https://cloudythms.tumblr.com/
  11.  
  12. - You may move, but not remove the credit
  13. - Leave this comment
  14. - Edit the rest as much as you want
  15. - Do not redistribute without permission
  16. - Do not claim as your own
  17. - Base Code #1 by Incedo (https://incedothemes.tumblr.com)
  18.  
  19. ------------------------------------------>
  20.  
  21. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  22.  
  23. <head>
  24.  
  25. <title>{Title}</title>
  26.  
  27. <!-- ------------------------------------------------------------ -->
  28.  
  29. <!-- Images -->
  30. <meta name="image:Background" content="0"/>
  31. <meta name="image:Corner" content="0"/>
  32.  
  33. <!-- Colors -->
  34. <meta name="color:background" content="#ffffff" />
  35. <meta name="color:title" content="#636363" />
  36. <meta name="color:text" content="#000000" />
  37. <meta name="color:link" content="#000000" />
  38. <meta name="color:link hover" content="#000000" />
  39.  
  40. <meta name="color:post borders" content="#000000" />
  41. <meta name="color:permalink link" content="#000000" />
  42. <meta name="color:permalink link hover" content="#000000" />
  43.  
  44. <!-- Fonts -->
  45. <meta name="font:text" content="helvetica neue" />
  46. <meta name="font:titles" content="helvetica neue" />
  47.  
  48. <!-- Ifs -->
  49. <meta name="if:Repeat background image" content="0"/>
  50. <meta name="if:Fixed background image" content="1"/>
  51. <meta name="if:Bigger posts" content="1"/>
  52. <meta name="if:Show tags" content="1"/>
  53. <meta name="if:Show caption" content="1"/>
  54. <meta name="if:fill post info" content="1"/>
  55. <meta name="if:Post background" content="0"/>
  56. <meta name="if:rounded corners" content="1"/>
  57. <meta name="if:Styled cursor" content="1"/>
  58.  
  59. <!-- Text -->
  60. <meta name="text:Corner Image Width" content="50"/>
  61. <meta name="text:Ask link" content="/ask"/>
  62. <meta name="text:Custom link" content="#"/>
  63. <meta name="text:Custom link text" content="custom link"/>
  64.  
  65.  
  66.  
  67.    
  68. <!-- ------------------------------------------------------------ -->
  69.  
  70. <!-- Leave this as it is -->
  71. <link rel="stylesheet" media="screen" href="https://openfontlibrary.org/face/web-symbols" rel="stylesheet" type="text/css"/>
  72. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  73. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  74. <link rel="shortcut icon" href="{Favicon}"/>
  75. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  76. <style> /* You may move, but not remove my credit. */
  77. #petrapixx{
  78.     position:fixed; right:5px; bottom:5px;
  79.     font-size:11px; font-family:consolas;
  80.     background-color:#585858; padding:3px;
  81.     font-weight:bolder; text-align:center; vertical-align:center;
  82. }
  83. #petrapixx:hover{
  84.     background-color:#D8D8D8;
  85. }
  86. #petrapixx a {
  87.     text-decoration:none; color:#D8D8D8;
  88. }
  89. #petrapixx a:hover{
  90.     color:#585858;
  91. }
  92. </style>
  93.  
  94.  
  95.  
  96.  
  97. <!-- Tooltips -->
  98.  
  99. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  100. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  101. <script>
  102. (function($){
  103. $(document).ready(function(){
  104. $("a[title]").style_my_tooltips({
  105. tip_follows_cursor:true,
  106.  
  107. /* Change your tooltip times here. */
  108. tip_delay_time:30, /* put a higher number for more delay */
  109. tip_fade_speed:400, /* put a higher number for a slower fade */
  110. /* recommened: delay:10-100 fade:200-600 */
  111.  
  112. attribute:"title"
  113. });
  114. });
  115. })(jQuery);
  116. </script>
  117. <style>
  118. .tooltip{
  119. display: inline;
  120. position: relative;
  121. }
  122. #s-m-t-tooltip {
  123. max-width:300px;
  124. border-radius: 0px;
  125. padding:3px 4px 5px 4px;
  126. margin:20px 7px -2px 20px;
  127. background-color:#ffffff;
  128. border:1px solid #E0E0E0;
  129. border-radius: 5px 5px 5px 5px;
  130. -moz-border-radius: 5px 5px 5px 5px;
  131. -webkit-border-radius: 5px 5px 5px 5px;
  132. font-family:{font:text};
  133. font-size:10px;
  134. letter-spacing:1px;
  135. text-transform:uppercase;
  136. color:#000;
  137. z-index:999999999999999999999999999999999999;
  138. }
  139. </style>
  140.  
  141.  
  142.    
  143. <!-- ----------------------- C S S - S T A R T-------------------- -->
  144.  
  145.  
  146.  
  147.  
  148. <style type="text/css">
  149.  
  150.  
  151. /* *************************** BASICS *************************** */
  152.  
  153. ::-webkit-scrollbar {
  154.     width: 9px; height: 3px; background: {color:post borders};
  155. }
  156. ::-webkit-scrollbar-thumb {
  157.     background-color:{color:permalink link}; border: 1px solid black;
  158. }
  159.        
  160. body {
  161. background-color:{color:background};
  162. color:{color:text};  
  163. font-family: {font:text};
  164. font-size:12px;
  165. overflow-y:hidden;
  166.    
  167. /* background image */
  168. background-image:url({image:Background});
  169. background-size:cover;
  170.  
  171. background-repeat: no-repeat;
  172. {block:IfRepeatBackgroundImage}
  173. background-repeat: repeat;
  174. {/block:IfRepeatBackgroundImage}
  175.  
  176. background-attachment:center;
  177. {block:IfFixedBackgroundImage}
  178. background-attachment:fixed;
  179. {/block:IfFixedBackgroundImage}
  180. }
  181.  
  182. #wrapper {
  183. width:650px;
  184. margin-left:auto;
  185. margin-right:auto;}
  186.  
  187. a, a:visited, a:link, a:active{
  188. color:{color:link};
  189. text-decoration:none;
  190.  
  191. -webkit-transition-duration: 0.2s;
  192. transition-duration: 0.2s;
  193. -webkit-transition-timing-function: ease-out;
  194. transition-timing-function: ease-out;
  195. }
  196.  
  197. a:hover{
  198. {block:IfStyledCursor}cursor:help;{/block:IfStyledCursor}
  199. color:{color:link hover};
  200. text-decoration:underline;
  201. }
  202.  
  203. h1{
  204.     font-family: {font:titles};
  205. }
  206.  
  207. h2{
  208.     font-family: {font:titles};
  209. }
  210.  
  211. h3{
  212.     font-family: {font:titles};
  213. }
  214.  
  215. h4{
  216.     font-family: {font:titles};
  217. }
  218.  
  219. h5{
  220.     font-family: {font:titles};
  221. }
  222.  
  223. h6{
  224.     font-family: {font:titles};
  225. }
  226.  
  227. blockquote{
  228.    border-left:2px solid {color:post borders};
  229.    padding-left:5px;
  230. }
  231.  
  232. ol{
  233.    
  234. }
  235.  
  236. ul{
  237.    
  238. }
  239.  
  240. hr{
  241.     border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  242. }
  243.  
  244.  
  245. /* *************************** TOPBAR *************************** */
  246.  
  247.  
  248. #topbar {
  249. position:fixed;
  250. margin: auto;
  251. margin-top:60px;
  252. padding:25px;
  253. padding-top:10px;
  254. padding-bottom:10px;
  255.  
  256. {block:IfBiggerPosts}
  257. width:567px;
  258. {/block:IfBiggerPosts}
  259. {block:IfNotBiggerPosts}
  260. width:467px;
  261. {/block:IfNotBiggerPosts}
  262.  
  263.  
  264. height:50px;
  265. overflow-y:hidden;
  266.  
  267.  
  268. background-color:{color:post borders};
  269.  
  270. {block:IfRoundedCorners}
  271. border-radius: 7px 7px 7px 7px;
  272. -moz-border-radius: 7px 7px 7px 7px;
  273. -webkit-border-radius: 7px 7px 7px 7px;
  274. border: 0px solid #000000;
  275. {/block:IfRoundedCorners}
  276.  
  277.  
  278. }
  279.  
  280. #title{
  281.     font:{font:titles};
  282.     color:{color:permalink link};
  283. }
  284.  
  285. #title a {
  286.     font:{font:titles};
  287.     color:{color:permalink link};
  288.    
  289. }
  290.  
  291. #title a:hover{
  292.     text-decoration:none;
  293.     color:#fff;
  294.     text-shadow:2px 0px 0px #FD435F, -2px 0px 0px #51E3FC;
  295. }
  296.  
  297.  
  298. #links{
  299.     padding-top:30px;
  300. }
  301.  
  302. #links a {
  303.     color:{color:permalink link};
  304. }
  305.  
  306.  
  307. /* *************************** POSTS *************************** */
  308.  
  309.  
  310.  
  311. #entries {
  312. position:fixed;
  313. margin: auto;
  314. margin-top:150px;
  315.  
  316. padding:25px;
  317.  
  318. {block:IfBiggerPosts}
  319. width:567px;
  320. {/block:IfBiggerPosts}
  321. {block:IfNotBiggerPosts}
  322. width:467px;
  323. {/block:IfNotBiggerPosts}
  324.  
  325.  
  326. height:50%;
  327.  
  328. overflow-y:scroll;
  329.  
  330.  
  331.  
  332. {block:IfPostBackground}
  333. border: 0px solid black;
  334. {block:IfRoundedCorners}
  335. border-radius: 20px 0px 0px 20px;
  336. -moz-border-radius: 20px 0px 0px 20px;
  337. -webkit-border-radius: 20px 0px 0px 20px;
  338. {/block:IfRoundedCorners}
  339. background-color:rgba(100%, 100%, 100%, 0.3);
  340. {/block:IfPostBackground}
  341.    
  342.    
  343. }
  344.  
  345. #posts {
  346. border: 3px solid {color:post borders};
  347. overflow:hidden;
  348. margin:10px;
  349. margin-bottom:30px;
  350. padding:0px;
  351.  
  352. {block:IfRoundedCorners}
  353. border-radius: 7px 7px 7px 7px;
  354. -moz-border-radius: 7px 7px 7px 7px;
  355. -webkit-border-radius: 7px 7px 7px 7px;
  356. {/block:IfRoundedCorners}
  357.  
  358. }
  359.  
  360. #postcontent{
  361.     padding:10px;
  362.    
  363. }
  364.  
  365. #permalinks{
  366.     padding:5px;
  367.     border-top: 3px solid {color:post borders};
  368.    
  369.     {block:IfFillPostInfo}
  370.     border: 3px solid {color:post borders};
  371.     background-color:{color:post borders};
  372.     {/block:IfFillPostInfo}
  373. }
  374.  
  375. #permalinks a{
  376.     font-size:10px;
  377.     text-transform:uppercase;
  378.     margin-right:5px;
  379.     color:{color:permalink link};
  380. }
  381.  
  382. #permalinks a:hover{
  383.     color:{color:permalink link hover};
  384. }
  385.  
  386. img, img a {
  387. border:none;
  388. line-height:0;
  389. max-width:100%;
  390.    
  391. }
  392.  
  393. #asker{
  394.     font-size:15px;
  395.     padding-bottom:3px;
  396.     font-family: {font:titles};
  397. }
  398.  
  399. #question {
  400.     font-weight:normal;
  401.     padding-top:0px;
  402.     margin-left:10px;
  403.     padding-left:10px;
  404.     border-left:2px solid {color:sidebar border};
  405. }
  406.  
  407.  
  408. #tag{
  409.     font-size:10px;
  410.     text-transform:uppercase;
  411.     margin-right:5px;
  412. }
  413.  
  414.  
  415. /* *************************** MORE *************************** */
  416.  
  417.  
  418. /* add your own CSS code here */
  419.  
  420. .exampleclass{
  421.     color:black;
  422. }
  423.  
  424. {CustomCSS}
  425.  
  426. </style>
  427. </head>
  428.  
  429. <!-- ----------------------- H T M L - S T A R T-------------------- -->
  430.  
  431. <body>
  432.  
  433. <div id="wrapper">
  434.  
  435.  
  436. <!-- Corner Image -->
  437. {block:IfCornerImage}<img style="position: fixed; right: 10%; bottom: 5%;width:{text:Corner Image Width}px;height:auto;z-index:9999;" src="{image:Corner}">{/block:IfCornerImage}
  438.  
  439. <!-- -------------------------- TOPBAR  ------------------------ -->
  440.  
  441.  
  442.  <div id="topbar">
  443.  
  444.  <span id="title" style="float:left;"><a href="/">» {Title}.</a></span>
  445.  
  446. <span id="links" style="float:right;">
  447.  
  448. {block:Pagination}
  449. {block:PreviousPage}<a href="{PreviousPage}" title="prev">◄</a>{/block:PreviousPage}
  450. {/block:Pagination}
  451.  
  452. <a href="/" title="refresh">001.</a>
  453. <a href="{text:Ask Link}" title="contact">002.</a>
  454. <a href="{text:Custom Link}" title="{text:Custom Link Text}">003.</a>
  455.  
  456. {block:Pagination}
  457. {block:NextPage}<a href="{NextPage}" title="next">►</a>{/block:NextPage}
  458. {/block:Pagination}
  459. </span>
  460.  
  461. <div style="clear: both;"></div>
  462. </div>
  463.  
  464. <!-- -------------------------- POSTS ------------------------ -->
  465.  
  466. <div class = "autopagerize_page_element" >
  467. <div id="entries">
  468.  
  469.  
  470.  
  471. {block:Posts}
  472. <div id="posts">
  473. <div id="postcontent">
  474.  
  475. {block:Text}
  476. {block:Title}<h1 style="font-size:18px;">{Title}</h1>{/block:Title}
  477. {Body}
  478. {/block:Text}
  479.  
  480. {block:Quote}
  481. <span style="font-size:18px;">"{Quote}"</span>
  482. <hspan2 style="font-size:15px;font-weight:normal;">— {Source}</span>
  483. {/block:Quote}
  484.  
  485. {block:Link}
  486. <span style="font-size:18px;"><a href="{URL}">{Name}</a></span>
  487. {/block:Link}
  488.  
  489. {block:Chat}
  490. {block:Lines}{block:Label}<b>{Label}</b> {/block:Label}{Line}<br>{/block:Lines}<br>
  491. {/block:Chat}
  492.  
  493. {block:Answer}
  494. <b id="asker">{Asker}:</b><br><span id="question">"{Question}"</span>
  495. {Answer}
  496. {/block:Answer}
  497.  
  498. {block:Audio}
  499. {AudioPlayer}
  500. {/block:Audio}
  501.  
  502. {block:Video}
  503. {block:IfBiggerPosts}
  504. {Video-500}
  505. {/block:IfBiggerPosts}
  506. {block:IfNotBiggerPosts}
  507. {Video-400}
  508. {/block:IfNotBiggerPosts}
  509. {/block:Video}
  510.  
  511. {block:Photo}
  512. {block:IfBiggerPosts}
  513. <img src="{PhotoURL-500}"/>
  514. {/block:IfBiggerPosts}
  515. {block:IfNotBiggerPosts}
  516. <img src="{PhotoURL-400}"/>
  517. {/block:IfNotBiggerPosts}
  518. {/block:Photo}
  519.  
  520. {block:Photoset}
  521. {block:IfBiggerPosts}
  522. {Photoset-500}
  523. {/block:IfBiggerPosts}
  524. {block:IfNotBiggerPosts}
  525. {Photoset-400}
  526. {/block:IfNotBiggerPosts}
  527. {/block:Photoset}
  528.  
  529. <!-- Caption -->
  530. {block:IfShowCaption}{block:caption}{Caption}{/block:caption}{/block:IfShowCaption}
  531.  
  532. </div>
  533.  
  534. <div id="permalinks">
  535.    
  536.      
  537. <!-- Tags -->
  538. {block:IfShowTags}
  539. {block:HasTags}
  540. <span style="margin-bottom:20px">
  541. {block:Tags}<a href="{TagURL}" id="tag">#{Tag}</a> {/block:Tags}
  542. </span><br>
  543. {/block:HasTags}
  544. {/block:IfShowTags}
  545.  
  546.  
  547. <!-- Links -->
  548.  
  549.  <a href="{Permalink}" title="{block:Date}{DayOfMonthWithZero}/{MonthNumberWithZero}/{ShortYear}{/block:Date}">[ +{NoteCount} ]</a>
  550.  
  551. {block:RebloggedFrom}
  552. <a href="{ReblogParentURL}" title="{ReblogParentName}">[ via ]</a>
  553. <a href="{ReblogRootURL}" title="{ReblogRootName}">[ src ]</a>
  554. {/block:RebloggedFrom}
  555.  
  556. {block:NotReblog}<a title="original content">[ oc ]</a>{/block:NotReblog}
  557.  
  558. <a href="{ReblogURL}" title="reblog this post">[ reblog ]</a>
  559. </div>
  560.  
  561.  
  562. <!-- Permalink Page -->
  563. {block:permalinkpage}
  564. {block:PostNotes}<br>{PostNotes}{/block:PostNotes}
  565. {/block:PermalinkPage}
  566.  
  567. </div>
  568.  
  569. {/block:Posts}
  570.  
  571. </div>
  572. </div>
  573. </div>
  574.  
  575. <div id="DO NOT REMOVE THIS CREDIT - you may move it somewhere else" style="position:fixed;bottom:10px;right:10px;font-size:10px;"><a href="https://cloudythms.tumblr.com/" title="theme by cloudythms" style="text-decoration:none;">☁</a></div>
  576.  
  577. </body>
  578. </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!