Advertisement
theme_bean

Theme #22

Nov 24th, 2012
44
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.26 KB | None | 0 0
  1. <!--
  2. theme by slutteen
  3. don't remove the credit
  4. unless you wear sweatpants on monday then well i just feel bad for you
  5. love ya
  6. -->
  7.  
  8. <head>
  9.  
  10. <meta name="color:Body font" content="#000000"/>
  11. <meta name="color:Links" content="#50aad6"/>
  12. <meta name="color:Background" content=""/>
  13. <meta name="image:Background image" content="http://bamfbackgrounds.com/upload/48r0kwtc-ParisNajd_5726.jpg"/>
  14. <meta name="if:show title" content="1"/>
  15. <meta name="text:Custom Link One Title" content= "custom">
  16. <meta name="text:Custom Link One" content="/" />
  17. <meta name="text:Custom Link Two Title" content= "links" >
  18. <meta name="text:Custom Link Two" content="/" />
  19. <meta name="text:Custom Link Three Title" content= "here" >
  20. <meta name="text:Custom Link Three" content="/" />
  21. <meta name="text:Custom Link Four Title" content= "here" >
  22. <meta name="text:Custom Link Four" content="/" />
  23. <meta name="text:Custom Link Five Title" content= "and here" >
  24. <meta name="text:Custom Link Five" content="/" />
  25.  
  26. <link href='http://fonts.googleapis.com/css?family=Ruthie|Economica' rel='stylesheet' type='text/css'>
  27.  
  28. <link href='http://fonts.googleapis.com/css?family=Ubuntu:300' rel='stylesheet' type='text/css'>
  29.  
  30. <title>{title}</title>
  31.  
  32. <link rel="stylesheet" href="http://static.tumblr.com/tak5d5w/raDlsuinn/quicksandfonts.css" type="text/css" charset="utf-8">
  33.  
  34.  
  35. <link rel="shortcut icon" href="{Favicon}">
  36.  
  37. <meta name="description" content="{MetaDescription}"/>
  38.  
  39.  
  40. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
  41.  
  42. <link rel="stylesheet" type="text/css"href="http://static.tumblr.com/cpaytv3/nKOlyumhg/reset.css">
  43.  
  44. <link href="http://static.tumblr.com/z0cd8ty/aJjm6uyej/meffects.css" rel="stylesheet">
  45.  
  46. <style type="text/css">
  47.  
  48. iframe#tumblr_controls {
  49. right:3px !important;
  50. position: fixed !important;
  51. -webkit-transition: opacity 0.7s linear;
  52. opacity: 0.5;
  53. -webkit-transition: all 0.8s ease-out;
  54. -moz-transition: all 0.8s ease-out;
  55. transition: all 0.8s ease-out;
  56. }
  57.  
  58. body {
  59. color: {color:Body font};
  60. background-color:{color:Background};
  61. background-image:url('{image:Background image}');
  62. background-attachment: fixed;
  63. background-size: cover;
  64. line-height: 120%;
  65. font-family: ubuntu;
  66. font-size: 17px;
  67. }
  68.  
  69. ::-webkit-scrollbar-thumb:vertical {
  70. background-color:#7d7d7d;
  71. height:auto;-webkit-border-radius:6px;
  72. }
  73.  
  74. ::-webkit-scrollbar-thumb:horizontal {
  75. background-color:#7d7d7d;
  76. height:6px !important;-webkit-border-radius:6px;
  77. }
  78.  
  79. ::-webkit-scrollbar {
  80. height:6px;
  81. width:6px;
  82. background-color:#cdcdcd;
  83. -webkit-border-radius:6px;
  84. }
  85.  
  86. a:link, a:active, a:visited{
  87. color:#000000;
  88. text-decoration: none;
  89. -webkit-transition: 0.4s ease-in;
  90. -o-transition: 0.4s ease-in;
  91. -moz-transition: 0.4s ease-in;
  92. transition: 0.4s ease-in;
  93. }
  94.  
  95. a:hover {color:{color:Hover};
  96. text-decoration: strikethrough;
  97. }
  98.  
  99. #posts {
  100. width: 1305px;
  101. background-color:{color:Background};
  102. margin-left:85px;
  103. padding:3px;
  104. margin-top:80px;
  105. {block:permalinkpage}
  106. width: 430px;
  107. {/block:permalinkpage}
  108. float:center;
  109. -webkit-animation: bounceIn 2s;
  110. -moz-animation: bounceIn 2s;
  111. -ms-animation: bounceIn 2s;
  112. }
  113.  
  114. .entry {
  115. margin:3px;
  116. padding: 5px;
  117. padding-bottom: 5px;
  118. float:left;
  119. width:270px;
  120. font-family:ubuntu;
  121. font-size: 10px;
  122. line-height:18px;
  123. {block:PermalinkPage}
  124. margin-left:385px;
  125. margin-top:30px;
  126. {/block:PermalinkPage}
  127. }
  128. .entry #permalink {
  129. position:absolute;
  130. width:auto;
  131. height:15px;
  132. background-color:#fff;
  133. margin-left: 6px;
  134. overflow:hidden;
  135. margin-top: 6px;
  136. font-family: economica;
  137. text-transform: uppercase;
  138. font-size: 10px;
  139. line-height:15px;
  140. text-align:center;
  141. opacity:0.0;
  142. padding-left:10px;
  143. padding-right:10px;
  144. border-bottom-right-radius:0px;
  145. border-top-right-radius:0px;
  146. border-top-left-radius:0px;
  147. border-bottom-left-radius:0px;
  148. -webkit-transition: all 0.3s linear;
  149. -moz-transition: all 0.3s linear;
  150. transition: all 0.3s linear;
  151. }
  152.  
  153. .entry:hover #permalink {
  154. overflow:visible;
  155. -webkit-transition: opacity 1.0s linear; opacity: 0.8;
  156. transition: all 0.4s linear;
  157. margin-left: 6px;
  158. width: auto;
  159. height: 15px;
  160. margin-top: 6px;
  161. padding:10px;
  162. padding-bottom:8px;
  163. border-bottom-right-radius:7px;
  164. border-top-right-radius:7px;
  165. border-top-left-radius:7px;
  166. border-bottom-left-radius:7px;
  167. -webkit-transition: all 0.3s linear;
  168. -moz-transition: all 0.3s linear;
  169. transition: all 0.3s linear;
  170. }
  171.  
  172. .entry:hover #permalink:hover{
  173. opacity: 1;
  174. width: auto;
  175. -webkit-transition: all 0.5s linear;
  176. -moz-transition: all 0.5s linear;
  177. transition: all 0.5s linear;
  178. }
  179.  
  180. #permalinky{
  181. position:absolute;
  182. height:15px;
  183. right: 0px;
  184. overflow:hidden;
  185. bottom: -2px;
  186. font-family: economica;
  187. text-transform: uppercase;
  188. font-size: 10px;
  189. line-height:15px;
  190. text-align:center;
  191. opacity:0;
  192. padding-left:10px;
  193. -webkit-transition: all 0.3s linear;
  194. -moz-transition: all 0.3s linear;
  195. transition: all 0.3s linear;
  196. }
  197.  
  198. .entry:hover #permalinky{
  199. opacity: 1;
  200. width: auto;
  201. -webkit-transition: all 0.5s linear;
  202. -moz-transition: all 0.5s linear;
  203. transition: all 0.5s linear;
  204. }
  205.  
  206. @font-face { font-family: "caviardreams"; src: url('http://static.tumblr.com/4yxykdm/xXTlrecqr/caviardreams.ttf'); }
  207.  
  208. .titulo{
  209. color: white;
  210. font-family: caviardreams, cursive;
  211. font-size: 18px;
  212. }
  213.  
  214. #topless a{
  215. color:{color:Links};
  216. }
  217.  
  218. #topless{
  219. width:100%;
  220. z-index:1;
  221. position:fixed !important;
  222. text-align:center;
  223. top:0px;
  224. height:auto;
  225. background-color: black;
  226. color: white;
  227. font-family: ubuntu;
  228. font-size: 10px;
  229. padding-bottom: 7px;
  230. padding-top: 3px;
  231. margin-left:0px;
  232. opacity: 0.9;
  233. -webkit-transition: all 0.7s linear;
  234. -moz-transition: all 0.7s linear;
  235. transition: all 0.7s linear;
  236. -webkit-animation: fadeInDownBig 3s;
  237. -moz-animation: fadeInDownBig 3s;
  238. -ms-animation: fadeInDownBig 3s;
  239. }
  240.  
  241. #topless:hover{
  242. -webkit-transition: all 0.7s linear;
  243. -moz-transition: all 0.7s linear;
  244. transition: all 0.7s linear;
  245. }
  246.  
  247. .linkys{
  248. width:auto;
  249. height:15px;
  250. background-color:#fff;
  251. color:{color:Links};
  252. font-family: caviardreams, cursive;
  253. text-transform: lowercase;
  254. font-size: 14px;
  255. text-align:center;
  256. opacity:1;
  257. padding-left:10px;
  258. padding-right:10px;
  259. border-radius:10px;
  260. }
  261.  
  262. .linkys:hover{
  263. opacity:0;
  264. }
  265.  
  266. #bottomless{
  267. width:100%;
  268. z-index:1;
  269. position:fixed !important;
  270. text-align:center;
  271. bottom:0px;
  272. height:20px;
  273. background-color:black;
  274. font-family: ubuntu;
  275. font-size: 10px;
  276. padding-bottom: 7px;
  277. padding-top: 3px;
  278. margin-left:0px;
  279. opacity: 0.9;
  280. -webkit-transition: all 0.7s linear;
  281. -moz-transition: all 0.7s linear;
  282. transition: all 0.7s linear;
  283. -webkit-animation: fadeInUpBig 3s;
  284. -moz-animation: fadeInUpBig 3s;
  285. -ms-animation: fadeInUpBig 3s;
  286. }
  287.  
  288. #bottomless:hover{
  289. -webkit-transition: all 0.7s linear;
  290. -moz-transition: all 0.7s linear;
  291. transition: all 0.7s linear;
  292. }
  293.  
  294. .caption {
  295. margin:0px;
  296. padding:0px;
  297. }
  298.  
  299.  
  300. #credz {
  301. position: fixed !important;
  302. left:5px !important;
  303. bottom:7px !important;
  304. font-family:helvetica;
  305. font-size:13px;
  306. line-height: 12px;
  307. color: {color:body font};
  308. -moz-transition: all 0.8s ease-out;
  309. -webkit-transition: opacity 0.7s linear;
  310. -webkit-transition: all 0.8s ease-out;
  311. transition: all 0.8s ease-out;
  312. }
  313.  
  314. {CustomCSS}
  315.  
  316. </style>
  317.  
  318. {block:IndexPage}
  319.  
  320. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  321.  
  322. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  323.  
  324. <script type="text/javascript">
  325. $(window).load(function () {
  326. var $content = $('#posts');
  327. $content.masonry({itemSelector: '.entry'}),
  328. $content.infinitescroll({
  329. navSelector : 'div#pagination',
  330. nextSelector : 'div#pagination a#nextPage',
  331. itemSelector : '.entry',
  332. loading: {
  333. finishedMsg: '',
  334. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  335. },
  336. bufferPx : 600,
  337. debug : false,
  338. },
  339. // call masonry as a callback.
  340. function( newElements ) {
  341. var $newElems = $( newElements );
  342. $newElems.hide();
  343. // ensure that images load before adding to masonry layout
  344. $newElems.imagesLoaded(function(){
  345. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  346. });
  347. });
  348. });
  349. </script>
  350.  
  351. {/block:IndexPage}
  352.  
  353.  
  354. </head>
  355.  
  356. <body>
  357.  
  358. <div id="topless">
  359. {block:ifshowtitle}
  360. <p><a href="/"class="titulo">{Title}</a></p>
  361. {/block:ifshowtitle}
  362. <p> {description} </p>
  363. </div>
  364.  
  365. <div id="bottomless">
  366. <a href="/"class="linkys">home</a>
  367. <a href="/ask"class="linkys">inbox</a>
  368. {block:IfCustomLinkOne} <a href="{text:Custom Link One}"class="linkys">{text:Custom Link One Title}</a> {/block:IfCustomLinkOne}
  369. {block:IfCustomLinkTwo} <a href="{text:Custom Link Two}"class="linkys">{text:Custom Link Two Title}</a> {/block:IfCustomLinkTwo}
  370. {block:IfCustomLinkThree} <a href="{text:Custom Link Three}"class="linkys">{text:Custom Link Three Title}</a>{/block:IfCustomLinkThree}
  371. {block:IfCustomLinkFour} <a href="{text:Custom Link Four}"class="linkys">{text:Custom Link Four Title}</a>{/block:IfCustomLinkFour}
  372. {block:IfCustomLinkFive} <a href="{text:Custom Link Five}"class="linkys">{text:Custom Link Five Title}</a>{/block:IfCustomLinkFive}
  373. <a href="http://slutteen.tumblr.com"class="linkys"> theme </a>
  374. </div>
  375.  
  376. <div id="posts">
  377.  
  378. {block:Posts}
  379. <div class="entry">
  380.  
  381. {block:Text}
  382. {block:IndexPage}
  383. <div id="permalinky"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  384. {/block:IndexPage}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="entrytext">{Body}</span>
  385. {/block:Text}
  386.  
  387. {block:Link}
  388. {block:IndexPage}
  389. <div id="permalinky"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  390. {/block:IndexPage}<a href="{URL}" class="title">{Name}</a>
  391. {block:Description}{Description}{/block:Description}
  392. {block:Link}
  393.  
  394. {block:Photo}
  395. {block:IndexPage}
  396. <div id="permalink"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  397. {/block:IndexPage}
  398. {block:IndexPage}{LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="250"/></a></div>{LinkCloseTag}{/block:IndexPage}
  399. {block:PermalinkPage}{LinkOpenTag}<a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="305px"/></a>{LinkCloseTag}{/block:PermalinkPage}
  400. {/block:Photo}
  401.  
  402.  
  403. {block:Photoset}
  404. <center>
  405. {block:IndexPage}
  406. {Photoset-205}
  407. {block:IndexPage}
  408. <div id="permalink"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  409. {/block:IndexPage}
  410. </center>
  411. <center>{block:PermalinkPage}{Photoset-410}{/block:PermalinkPage}</center>
  412. {/block:Photoset}
  413.  
  414. {block:Quote}
  415. {block:IndexPage}
  416. <div id="permalink"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  417. {/block:IndexPage}
  418. {Quote}</span>
  419. {/block:Quote}
  420.  
  421. {block:Chat}
  422. {block:IndexPage}
  423. <div id="permalinky"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  424. {/block:IndexPage}
  425. {block:Title}<span class="title">{Title}</span>{/block:Title}
  426. <ul class="chat">
  427. {block:Lines}
  428. <li class="user_{UserNumber}">
  429. {block:Label}
  430. <span class="label">{Label}</span>
  431. {/block:Label}
  432.  
  433. {Line}
  434. </li>
  435. {/block:Lines}
  436. </ul>
  437. {/block:Chat}
  438.  
  439. {block:Audio}
  440. {block:IndexPage}
  441. <div id="permalinky"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  442. {/block:IndexPage}
  443. <center><div style="width:250px; height:28px;"><div style="float:left">{AudioPlayerBlack}</div><div style="margin-top:10px; float:right;">
  444. {block:ExternalAudio}{/block:ExternalAudio}</div></div></center>
  445. {/block:Audio}
  446.  
  447. {block:Video}
  448. {block:IndexPage}
  449. <div id="permalink"><a href="{ReblogURL}" target="_blank">REBLOG</a> / <a href="{permalink}">{notecount} NOTES</a></div>
  450. {/block:IndexPage}
  451. <center>
  452. {block:IndexPage}
  453. {Video-250}
  454. {/block:IndexPage}
  455. </center>
  456. <center>{block:PermalinkPage}{Video-500}{/block:PermalinkPage}</center>
  457. {block:Video}
  458.  
  459. {block:Answer}
  460. {block:IndexPage}
  461. <div id="permalinky"><a href="{permalink}">{notecount} NOTES</a></div>
  462. {/block:IndexPage}
  463. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3px;"/>
  464. <b>{Asker}: </b>{Question} <b>{Answer}</b>
  465. {/block:Answer}
  466.  
  467.  
  468. {block:PermalinkPage}
  469. {block:Date}
  470. <center>
  471. {TimeAgo} | {12HourWithZero}:{Minutes}{AmPm}
  472. <br>{block:Caption}{Caption}{/block:Caption}{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags} &middot; {block:Tags}<a href="TagURL"> #{Tag}</a> {/block:Tags}{/block:hasTags}</center>
  473. {/block:Date}
  474.  
  475. {/block:PermalinkPage}
  476.  
  477. {block:PostNotes}{PostNotes}
  478. {/block:PostNotes}
  479. </div>
  480.  
  481.  
  482. {/block:Posts}
  483. </div>
  484. </div>
  485. <div class="right">
  486. </div>
  487. <div class="footer">
  488. <br>
  489. </div>
  490. </div>
  491. </body>
  492. </html>
  493. <div style="position:fixed;right:0px;bottom:-425px;">
  494. <---DONT REMOVE---->
  495. {block:IndexPage}
  496. {block:Pagination}
  497. <div id="pagination">
  498. {block:NextPage}
  499. <a id="nextPage" href="{NextPage}">&nbsp;&rarr;</a>
  500. {/block:NextPage}
  501. {block:PreviousPage}
  502. <a href="{PreviousPage}">&larr;&nbsp;</a>
  503. {/block:PreviousPage}
  504. </div>
  505. {/block:Pagination}
  506. {/block:IndexPage}</div>
  507.  
  508.  
  509.  
  510. </div>
  511.  
  512. <div id="credz"><div style="{color:body font}"><a href="http://slutteen.tumblr.com">✿</a></div>
  513. </body>
  514. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement