Advertisement
EllenMaty

Caspar Tumblr Theme

Apr 15th, 2014
347
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.19 KB | None | 0 0
  1.  
  2. <!--
  3. Base code por elly - http://thelittledanger.tumblr.com/
  4. Não redistribua sem minha autoria!
  5. -->
  6.  
  7. <html lang="en">
  8.  
  9. <head>
  10.  
  11. <meta name="color:Background" content="#fff">
  12. <meta name="color:Text" content="#4b4b4b">
  13. <meta name="color:Link" content="#aaaaaa">
  14. <meta name="color:Hover" content="#cccccc">
  15. <meta name="color:Sidelink" content="#3b3b3b">
  16. <meta name="color:Borders" content="#aaaaaa">
  17.  
  18. <meta name="image:Avatar" content="https://31.media.tumblr.com/9ec59555399133304c73838d641561a0/tumblr_inline_n3y64jX4Ck1r1ib23.png">
  19. <meta name="image:Background" content=" ">
  20. <meta name="image:Favicon" content="http://media.tumblr.com/tumblr_lkl6u2Pii71qfamg6.gif">
  21. <meta name="image:Cursor" content="http://i.imgur.com/2qleX.jpg">
  22. <meta name="image:CursorHover" content="http://i.imgur.com/IepP2.jpg">
  23. <meta name="image:SidebarDivisor" content="http://i61.tinypic.com/8xkhav.png">
  24.  
  25. <meta name="text:Link 1" content="Home">
  26. <meta name="text:Link 1 URL" content="/">
  27. <meta name="text:Link 2" content="Message">
  28. <meta name="text:Link 2 URL" content="/ask">
  29. <meta name="text:Link 3" content="Archive">
  30. <meta name="text:Link 3 URL" content="/">
  31. <meta name="text:Link 4" content="Blank">
  32. <meta name="text:Link 4 URL" content="#">
  33. <meta name="text:Link 5" content="Blank">
  34. <meta name="text:Link 5 URL" content="#">
  35. <meta name="text:Link 6" content="Blank">
  36. <meta name="text:Link 6 URL" content="#">
  37. <meta name="text:SidebarMarginTop" content="200">
  38. <meta name="text:SidebarMarginLeft" content="480">
  39.  
  40. <meta name="if:Description" content="1">
  41. <meta name="if:Avatar" content="1">
  42. <meta name="if:SidebarDivisor" content="1">
  43. <meta name="if:UnderlineLinks" content="1">
  44.  
  45. <title>{title}</title>
  46.  
  47. <link href="http://static.tumblr.com/3l2jcs4/s2Un1fe9u/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  48. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  49. <script src="http://static.tumblr.com/3l2jcs4/209n1fe9k/jquery.style-my-tooltips.js"></script>
  50. <script>
  51. (function($){
  52. $(document).ready(function(){
  53. $("[title]").style_my_tooltips({
  54. tip_follows_cursor:true,
  55. tip_delay_time:100,
  56. tip_fade_speed:100,
  57. attribute:"title"
  58. });
  59. });
  60. })(jQuery);
  61. </script>
  62.  
  63. <link rel="shortcut icon" href="{image:Favicon}">
  64.  
  65. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  66.  
  67. {block:IndexPage}
  68. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  69. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  70.  
  71. <script type="text/javascript">
  72. $(window).load(function(){
  73. var $wall = $('#entry');
  74. $wall.imagesLoaded(function(){
  75. $wall.masonry({
  76. itemSelector: '#post, #post_photo',
  77. isAnimated : false
  78. });
  79. });
  80.  
  81. $wall.infinitescroll({
  82. navSelector : '#pagination',
  83. nextSelector : '#pagination a',
  84. itemSelector : '#post, #post_photo',
  85. bufferPx : 2000,
  86. debug : false,
  87. errorCallback: function() {
  88. $('#scroll').fadeOut('normal');
  89. }},
  90. function( newElements ) {
  91. var $newElems = $( newElements );
  92. $newElems.hide();
  93. $newElems.imagesLoaded(function(){
  94. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  95. });
  96. }); $('#entry').show(500);
  97. });
  98. </script>
  99. {/block:IndexPage}
  100.  
  101. <style type="text/css">
  102.  
  103. body {
  104. background-color: {color:Background};
  105. background-attachment: fixed;
  106. background-image: url('{image:Background}');
  107. font-family: consolas;
  108. text-transform: uppercase;
  109. letter-spacing: 1px;
  110. font-size: 8px;
  111. color: {color:Text};
  112. }
  113.  
  114. a {
  115. color: {color:Link};
  116. text-decoration: none;
  117. -webkit-transition: all 0.4s ease-in-out;
  118. -moz-transition: all 0.4s ease-in-out;
  119. -o-transition: all 0.4s ease-in-out;
  120. }
  121.  
  122. a:hover {
  123. color: {color:Hover};
  124. -webkit-transition: all 0.4s ease-in-out;
  125. -moz-transition: all 0.4s ease-in-out;
  126. -o-transition: all 0.4s ease-in-out;
  127. }
  128.  
  129. #container {
  130. margin: auto;
  131. width: 400px;
  132. }
  133.  
  134. #entry {
  135. width: 400px;
  136. margin-left: 0px;
  137. margin-top: 20px;
  138. }
  139.  
  140. #post {
  141. width: 400px;
  142. margin-bottom: 50px;
  143.  
  144. }
  145.  
  146. #post a{
  147. text-decoration: {block:IfUnderlineLinks}underline;{/block:IfUnderlineLinks}{block:IfNotUnderlineLinks}none;{/block:IfNotUnderlineLinks}
  148. }
  149.  
  150. #post img {
  151. max-width: 100%;
  152. }
  153.  
  154. #posttitle {
  155. text-align: center;
  156. font-size: 12px;
  157. color: {color:Text};
  158. }
  159.  
  160. #posttitle a {
  161. text-decoration: none;
  162. color: {color:Text};
  163. }
  164.  
  165. #posttitle a:hover {
  166. color: {color:Link};
  167. }
  168.  
  169. #permalink {
  170. text-align: center;
  171. margin-top: 10px;
  172. padding-top: 5px;
  173. color: {color:Sidelink};
  174. z-index: 9;
  175. }
  176.  
  177. #permalink a {
  178. text-decoration: none;
  179. color: {color:Sidelink};
  180. background-color: #fff;
  181. padding-left: 5px; padding-right: 5px; border-left: 1px solid {color:Borders}; border-right: 1px solid {color:Borders};}
  182.  
  183. #permalink a:hover { color: {color:Link}; }
  184.  
  185. .permaline {
  186. position: absolute;
  187. background-color: {color:Borders};
  188. margin-top: -5px;
  189. overflow: hidden;
  190. height: 1px;
  191. width: 400px;
  192. z-index: -1;
  193. }
  194.  
  195. #sidebar {
  196. width: 85px;
  197. position: fixed;
  198. text-align: center;
  199. margin-top: {text:SidebarMarginTop}px;
  200. margin-left: {text:SidebarMarginLeft}px;
  201. }
  202.  
  203. #sidebar img {
  204. max-width: 100%;
  205. }
  206.  
  207. .sidetitle {
  208. font-size: 12px;
  209. color: {color:Text};
  210. }
  211.  
  212. .links {
  213. height: 0px;
  214. margin-top: 6px;
  215. overflow: hidden;
  216. font-style: italic;
  217. -webkit-transition: all 1s ease-in-out;
  218. -moz-transition: all 1s ease-in-out;
  219. -o-transition: all 1s ease-in-out;
  220. }
  221.  
  222. #sidebar:hover .links {
  223. height: 92px;
  224. -webkit-transition: all 1s ease-in-out;
  225. -moz-transition: all 1s ease-in-out;
  226. -o-transition: all 1s ease-in-out;
  227. }
  228.  
  229. .linkmage {
  230. max-width: 85px;
  231. opacity: 1;
  232. }
  233.  
  234. .links a {
  235. font-style: normal;
  236. display: block;
  237. border-bottom: 1px solid {color:Borders};
  238. padding-top: 2px; padding-bottom: 2px;
  239. color: {color:Sidelink};
  240. }
  241.  
  242. .links a:hover {
  243. color: {color:Link};
  244. }
  245.  
  246. .source {
  247. margin-top: 5px;
  248. text-align: right;
  249. }
  250.  
  251. #scroll{
  252. bottom:-20px;
  253. position: absolute;
  254. left: 50%;
  255. width:10px;
  256. height:5px;
  257. overflow:hidden;
  258. margin-bottom:80px;}
  259.  
  260. ol.notes li.note {
  261. padding-bottom: 3px;
  262. }
  263.  
  264. ol.notes {
  265. padding-top: 10px;
  266. margin-left: -40px;
  267. list-style-type: none;
  268. }
  269.  
  270. ol.notes li.note img.avatar {
  271. vertical-align: -4px;
  272. margin-right: 10px;
  273. width: 16px;
  274. height: 16px;
  275. }
  276.  
  277. #tags {
  278. text-align: center;
  279. margin-top: 4px;
  280. }
  281.  
  282. #tags a {
  283. text-decoration: none;
  284. color: {color:Sidelink};
  285. }
  286.  
  287. #tags a:hover {
  288. color: {color:Link};
  289. }
  290.  
  291. blockquote {
  292. border-left: 1px solid {color:Borders}; padding-left: 10px; margin-left: 10px;
  293. }
  294.  
  295. ::-moz-selection {
  296. background: {color:Link}; /*Cor do fundo*/
  297. color: {color:Background}; /*Cor da fonte*/
  298. }
  299. ::selection {
  300. background: {color:Link};/*Cor do fundo*/
  301. color: {color:Background}; /*Cor da fonte*/
  302. }
  303.  
  304. body, a, a:hover { cursor: url('{image:Cursor}'), progress;} /*Cursor Normal*/
  305.  
  306. a:link, a:visited, a:active { cursor: url('{image:CursorHover}'), progress; } /*Cursor Hover*/
  307.  
  308. .ask {
  309. background-color: rgba({RGBcolor:Borders},0.2);
  310. padding: 5px;
  311. text-align: left;
  312. }
  313.  
  314. #credit {
  315. position: fixed;
  316. top: 25px;
  317. left: 25px;
  318. background-color: {color:Background}; padding: 5px; font-size: 8px; font-family: consolas; z-index: 999; border: 1px solid {color:Borders};
  319. }
  320.  
  321. #credit a { color: {color:Sidelink}; }
  322.  
  323. #s-m-t-tooltip{
  324. margin-top: 13px;
  325. margin-left: 5px; font-family: consolas; font-size: 8px;
  326. background-color: rgba({RGBcolor:Borders},0.2); color: {color:Text}; padding: 5px;
  327. }
  328.  
  329. ::-webkit-scrollbar-thumb:vertical {
  330. background: {color:Borders}; /*Cor da barrinha que se move*/ border-left: 2px solid {color:Background}; border-right: 2px solid {color:Background}; }
  331.  
  332. ::-webkit-scrollbar-thumb:horizontal {
  333. background-color: {color:Borders}; /*Cor da barrinha que se move*/ border-top: 2px solid {color:Background}; border-bottom: 2px solid {color:Background};}
  334.  
  335. ::-webkit-scrollbar-corner { background-color: {color:Background}; }
  336.  
  337. ::-webkit-scrollbar {
  338. width:6px; height: 6px; /*Largura da barra de rolagem*/
  339. background: {color:Background}; /*Cor da parte fixa, que fica no mundo*/
  340. }
  341.  
  342.  
  343. </style>
  344.  
  345. </head>
  346.  
  347. <body>
  348. <div id="container">
  349.  
  350. <div id="sidebar">
  351.  
  352. <div class="sidetitle">{Title}</div></p>
  353.  
  354. {block:IfAvatar}<img src="{image:Avatar}"></p>{/block:IfAvatar}
  355.  
  356. {block:IfDescription}{block:Description}{Description}{/block:Description}<br>{/block:IfDescription}
  357. <div class="links">
  358. <div style="overflow: hidden; height: 1px; background-color: #aaa"></div>
  359. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  360. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  361. <a href="{text:Link 3 URL}">{text:Link 3}</a>
  362. <a href="{text:Link 4 URL}">{text:Link 4}</a>
  363. <a href="{text:Link 5 URL}">{text:Link 5}</a>
  364. <a href="{text:Link 6 URL}">{text:Link 6}</a>
  365. </div>
  366.  
  367. {block:IfSidebarDivisor}<center><img src="{image:SidebarDivisor}" class="linkmage"></center>{/block:IfSidebarDivisor}
  368.  
  369. </div>
  370.  
  371. <div id="entry">
  372.  
  373. {block:Posts}
  374.  
  375. {block:ContentSource}
  376. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  377. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  378. {/block:SourceLogo}
  379. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  380. {/block:ContentSource}
  381.  
  382. <div id="post">
  383.  
  384. {block:Text}
  385. <div id="posttitle">{block:Title}{Title}{/block:Title}</div>
  386. {Body}
  387. {/block:Text}
  388.  
  389. {block:Quote}
  390. <div style="font-size: 12px;">"{Quote}"</div><br>
  391. <div style="text-align:right; margin-bottom: -5px">— {Source}</div>
  392. {/block:Quote}
  393.  
  394. {block:Link}
  395. <div id="posttitle"><a href="{URL}">{Name}</a> →</div>
  396. {/block:Link}
  397.  
  398. {block:Chat}
  399. {block:Lines}{block:Label}{Label} {/block:Label}{Line}<br>{/block:Lines}
  400. {block:Caption}{Caption}{/block:Caption}
  401. {/block:Chat}
  402.  
  403. {block:Answer}
  404. <div class="ask">{Asker}: {Question}</div>
  405. {Answer}
  406. {/block:Answer}
  407.  
  408. {block:Audio}
  409. <center>{AudioPlayer}{block:Caption}{Caption}{/block:Caption}</center>
  410. {/block:Audio}
  411.  
  412. {block:Video}
  413. {Video-400}
  414. {block:Caption}{Caption}{/block:Caption}
  415. {/block:Video}
  416.  
  417. {block:Photo}
  418. <img src="{PhotoURL-500}"/>
  419. {block:Caption}{Caption}{/block:Caption}
  420. {/block:Photo}
  421.  
  422. {block:Photoset}
  423. {Photoset-400}
  424. {block:Caption}{Caption}{/block:Caption}
  425. {/block:Photoset}
  426.  
  427. {block:IndexPage}
  428. <div id="permalink"><a href="{ReblogURL}">Reblog</a>&nbsp;&nbsp;&nbsp;<a href="{Permalink}">{NoteCountWithLabel}</a>&nbsp;&nbsp;&nbsp;<a href="##">{block:Date}{TimeAgo}{/block:Date}</a></div><div class="permaline"></div>{block:HasTags}<div id="tags">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}</div>{/block:HasTags}{/block:IndexPage}
  429.  
  430. {block:PermalinkPage}
  431. <center><p>{block:Date} {Month} {DayofMonthWithSuffix}, {Year}{/block:Date} {block:NoteCount}, {NoteCountWithLabel}{/block:NoteCount} {block:RebloggedFrom}, (via <a href="{ReblogParentURL}">{ReblogParentName}</a>){/block:RebloggedFrom}</center>
  432. {block:PostNotes}{PostNotes}{/block:PostNotes}{/block:PermalinkPage}
  433.  
  434. </div>
  435. {/block:Posts}
  436. </div>
  437.  
  438. {block:IndexPage}
  439. {block:Pagination}
  440. <div id="pagination">
  441. {block:NextPage}
  442. <a id="nextPage" href="{NextPage}"></a>
  443. {/block:NextPage}
  444. {block:PreviousPage}
  445. <a href="{PreviousPage}"></a>
  446. {/block:PreviousPage}
  447. </div>
  448. {/block:Pagination}
  449. {/block:IndexPage}
  450.  
  451. <div id="credit"><a href="http://thelittledanger.tumblr.com" title="Theme: Elly">CREDIT</a></div>
  452.  
  453.  
  454. </body>
  455.  
  456. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement