Advertisement
0xumthemes

Breathe Theme

Nov 11th, 2012
1,249
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.22 KB | None | 0 0
  1. <!--
  2.  
  3. Theme Breathe by 0-xum.
  4.  
  5. Please do not remove the credits.
  6.  
  7. -->
  8.  
  9. <head>
  10.  
  11. <link href='http://fonts.googleapis.com/css?family=EB+Garamond' rel='stylesheet' type='text/css'>
  12.  
  13.  
  14.  
  15. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"><!--mce:0--></script>
  16. <script src="toggle.js" type="text/javascript"><!--mce:1--></script>
  17. <script type="text/javascript">
  18. $(document).ready(function(){
  19. $(".description").hide();
  20. $(".about").click(function(){
  21. $('.description').slideToggle("fast");
  22. return true;
  23. });
  24. });
  25. </script>
  26.  
  27. <meta name="color:Background" content="#fff" />
  28. <meta name="color:Text" content="#000" />
  29. <meta name="color:Audio" content="#eeecec" />
  30. <meta name="color:Text Verdana" content="#000000"/>
  31.  
  32.  
  33. <meta name="if:Background Image" content="0"/>
  34. <meta name="if:Ask Link" content="1"/>
  35. <meta name="if:Three Columns" content="0"/>
  36. <meta name="if:Four Columns" content="1"/>
  37. <meta name="if:Five Columns" content="0"/>
  38. <meta name="if:Menu On Banner" content="0"/>
  39. <meta name="if:Show Blog Title" content="1"/>
  40. <meta name="if:Use Banner" content="0">
  41.  
  42. <meta name="image:Background" content=""/>
  43. <meta name="image:Banner" content="">
  44.  
  45. <meta name="text:Ask Link Text" content="message"/>
  46. <meta name="text:Custom Link One" content="" />
  47. <meta name="text:Custom Link One Title" content="" />
  48. <meta name="text:Custom Link Two" content="" />
  49. <meta name="text:Custom Link Two Title" content="" />
  50. <meta name="text:Custom Link Three" content="" />
  51. <meta name="text:Custom Link Three Title" content="" />
  52. <meta name="text:Custom Link Four" content="" />
  53. <meta name="text:Custom Link Four Title" content="" />
  54. <meta name="text:Custom Link Five" content="" />
  55. <meta name="text:Custom Link Five Title" content="" />
  56.  
  57.  
  58.  
  59. <title>{Title}</title>
  60. <link rel="shortcut icon" href="{Favicon}">
  61. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  62. <link rel="shortcut icon" href="{Favicon}">
  63. <title>Untitled Document</title>
  64. <link rel="shortcut icon" href="{Favicon}">
  65. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  66.  
  67. {block:Description}
  68. <meta name="description" content="{MetaDescription}" />
  69. {/block:Description}
  70.  
  71. <style type="text/css">
  72.  
  73. p{
  74. margin:0px;
  75. padding:0px;
  76. }
  77.  
  78. #tumblr_controls{
  79. top: 1px !important;
  80. margin: 0 0 0 0;
  81. right: 6px !important;
  82. position: fixed !important;
  83. }
  84.  
  85. body{
  86. color:{color:Text};
  87. background-color:{color:Background};
  88. font-size:11px;
  89. text-align:justify;
  90. font-family:Arial, 'Helvetica Neue', Helvetica, sans-serif;
  91. line-height:15px;
  92. }
  93.  
  94. ::-webkit-scrollbar{width:10px;
  95. height:8px;}
  96. ::-webkit-scrollbar-button:start:decrement
  97. ::-webkit-scrollbar-button:end:increment{display:block;
  98. height:0;
  99. background-color:transparent;}
  100. ::-webkit-scrollbar-track-piece{background-color:{color:background};
  101. -webkit-border-radius:0;
  102. -webkit-border-bottom-right-radius:3px;
  103. -webkit-border-bottom-left-radius:3px;}
  104. ::-webkit-scrollbar-thumb:vertical{height:50px;
  105. background-color:{color:Text};}
  106. ::-webkit-scrollbar-thumb:horizontal{width:50px;
  107. background-color:{color:Text};}
  108.  
  109. #content{
  110. margin: auto auto auto auto ;
  111. width:100%;
  112. top:0px;
  113. position:relative;
  114.  
  115. }
  116. #content .posts{
  117. {block:ifThreeColumns}
  118. width:800px;
  119. {/block:ifThreeColumns}
  120. {block:ifFourColumns}
  121. width:1050px;
  122. {/block:ifFourColumns}
  123. {block:ifFiveColumns}
  124. width:1300px;
  125. {/block:ifFiveColumns}
  126. margin:auto;
  127. {block:PermalinkPage}
  128. width:510px;
  129. {/block:PermalinkPage}
  130. }
  131.  
  132. #content .entry{
  133. {block:IndexPage}
  134. width:250px;
  135. margin:5px;
  136. padding:0px;
  137. float:left;
  138. {/block:IndexPage}
  139. {block:PermalinkPage}
  140. margin:6px;
  141. width:500px;
  142. {/block:PermalinkPage}
  143. }
  144.  
  145. #content .entry img{
  146. {block:IndexPage}
  147. max-width:250px;
  148. {/block:IndexPage}
  149. }
  150.  
  151.  
  152. .top{
  153. {block:ifthreecolumns}
  154. width:800px;
  155. {/block:ifthreecolumns}
  156. {block:ifFourColumns}
  157. width:1050px;
  158. {/block:ifFourColumns}
  159. {block:iffivecolumns}
  160. width:1300px;
  161. {/block:iffivecolumns}
  162. {block:ifsixcolumns}
  163. width:1600px;
  164. {/block:ifsixcolumns}
  165. text-align:left;
  166. margin: 20px auto ;
  167. z-index:5000;
  168. margin-bottom:25px;
  169. }
  170.  
  171. .title{
  172. font-family: 'EB Garamond', serif;
  173. font-weight:bold;
  174. text-transform:none;
  175. font-size: 35px;
  176. color:{color:Text};
  177. padding-bottom:1px;
  178. {color:Text};
  179. }
  180.  
  181. a:link, a:active, a:visited{
  182.  
  183. color:{color:Text};
  184. text-decoration: none;
  185. -o-transition-duration: 3s;
  186. -webkit-transition-duration: 3s;
  187. -moz-transition-duration: 3s;
  188. }
  189.  
  190.  
  191.  
  192. color:{color:Hover};
  193. -webkit-transition-duration: 0.5s;
  194. -moz-transition-duration: 0.5s;
  195. -o-transition-duration: 0.5s;
  196. -ms-transition-duration: 0.5s;
  197. text-decoration:underline;
  198. text-Verdana:0px 0px 10px {color:Text Verdana};
  199.  
  200. }
  201.  
  202.  
  203.  
  204. {block:ifReblogLinkOnHover}
  205. .photopermaholder{
  206. position:absolute;
  207. height:14px;
  208. margin:8px 0px 0px 208px;
  209. opacity:0;
  210. filter: alpha(opacity = 0);
  211. -moz-transition: all 0.5;
  212. -webkit-transition: all 0.5s;
  213. -o-transition: all 0.5s;
  214. transition: all 0.5;
  215. }
  216.  
  217. .photoperma{
  218. display:inline-block;
  219. margin-right:5px;
  220. padding:4px;
  221. height:14px;
  222. }
  223.  
  224. .photoperma a{color:#000;}
  225.  
  226. .entry:hover .photopermaholder{
  227. opacity:1.9;
  228. filter: alpha(opacity = 70);
  229. -moz-transition: all 0.5;
  230. -webkit-transition: all 0.5s;
  231. -o-transition: all 0.5s;
  232. transition: all 0.5;
  233. }
  234. {/block:ifReblogLinkOnHover}
  235.  
  236. .post_title{
  237. font-family:Arial, 'Helvetica Neue', Helvetica, sans-serif;
  238. display:block;
  239. font-size:14px;
  240. line-height:20px;
  241. text-transform:none;
  242. }
  243.  
  244. .link_title{
  245. font-size:13px;
  246. line-height:20px;
  247. text-transform:none;
  248. font-family:Arial, 'Helvetica Neue', Helvetica, sans-serif;
  249. margin-bottom:5px;
  250. }
  251.  
  252. .nav{
  253. font-size:10px;
  254. text-align:left;
  255. margin-top:2px;
  256. margin-bottom:5px;
  257. }
  258.  
  259.  
  260.  
  261. .permalink{
  262. text-transform:none;
  263. text-align:center;
  264. color:gray;
  265. position: relative;
  266. margin-top: -10px;
  267. font-size: 8px;
  268. opacity: 0;
  269. filter: alpha(opacity = 0);
  270. -moz-transition: all 0.4s;
  271. -webkit-transition: all 0.4s;
  272. -o-transition: all 0.4s;
  273. transition: all 0.4;
  274. }
  275.  
  276. div#entry:hover .permalink{
  277. margin-top: -5px;
  278. opacity: 1;
  279. filter: alpha(opacity = 100);
  280. -moz-transition: all 0.4s;
  281. -webkit-transition: all 0.4s;
  282. -o-transition: all 0.4s;
  283. transition: all 0.4;
  284. }
  285.  
  286. .quote{
  287. font-size:13px;
  288. line-height:20px;
  289. text-transform:none;
  290. margin-bottom:5px;
  291. font-family:Arial, 'Helvetica Neue', Helvetica, sans-serif;
  292. }
  293.  
  294. .audio{
  295. {block:IndexPage}
  296. width:238px;
  297. {/block:IndexPage}
  298. {block:PermalinkPage}
  299. width:488px;
  300. {/block:PermalinkPage}
  301. background-color:#fff;
  302. padding:5px;
  303. margin-bottom:0px;
  304. border-left:1px solid;
  305. border-right:1px solid;
  306. border-color:{color:Audio};
  307. }
  308.  
  309. .audiocap, .videocap{
  310. background-color:{color:Audio};
  311. display:block;
  312. padding:10px;
  313. }
  314.  
  315. .albumart, .albumart img{
  316. {block:IndexPage}
  317. width:250px;
  318. {/block:IndexPage}
  319. {block:PermalinkPage}
  320. width:500px;
  321. {/block:PermalinkPage}
  322. }
  323.  
  324. div.video embed,
  325. div.post div.video object {
  326. {block:IndexPage}
  327. width:250px !important;
  328. height:150px !important;
  329. {/block:IndexPage}
  330. {block:PermalinkPage}
  331. width:500px !important;
  332. height:400px !important;
  333. {/block:PermalinkPage}
  334. }
  335.  
  336. .question{
  337. font-weight:normal;
  338. margin-bottom:5px;
  339. font-size:9px;
  340. line-height:15px;
  341. display:block;
  342. text-transform:lowercase;
  343. }
  344.  
  345. .caption{
  346. margin-top:5px;
  347. margin-bottom:5px;
  348. }
  349.  
  350. #bg img {
  351. z-index:-1;
  352. position:fixed;
  353. top:0;
  354. left:0;
  355. height:100%;
  356. width:100%;
  357. }
  358.  
  359.  
  360. .h1 {color: #000; font-size: 32px; line-height: 25px; text-align: left; margin-bottom: -0px; cursor: arrow; font-family: 'EB Garamond', serif;
  361. }
  362.  
  363. </style>
  364.  
  365. {block:IfBackgroundImage}<div id="bg"><img src="{image:Background}"></div>{/block:IfBackgroundImage}
  366.  
  367. <script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script>
  368. <script type="text/javascript" src="http://static.tumblr.com/imovwvl/rSGl20lfv/masonry.js">
  369. </script>
  370. <script src="http://static.tumblr.com/df28qmy/SHUlh3i7s/jquery.infinitescroll.js"></script>
  371. <script src="http://static.tumblr.com/thpaaos/lLwkowcqm/jquery.masonry.js"></script>
  372. <script type="text/javascript">
  373.  
  374. $(window).load(function () {
  375. $('.posts').masonry(),
  376. $('.masonryWrap').infinitescroll({
  377. navSelector : "div#navigation",
  378. // selector for the paged navigation (it will be hidden)
  379. nextSelector : "div#navigation a#nextPage",
  380. // selector for the NEXT link (to page 2)
  381. itemSelector : ".entry",
  382. // selector for all items you'll retrieve
  383. bufferPx : 10000,
  384. extraScrollPx: 11000,
  385. loadingImg : "",
  386. loadingText : "<em></em>",
  387. },
  388. // call masonry as a callback.
  389. function() { $('.posts').masonry({ appendedContent: $(this) }); }
  390. );
  391. });
  392. </script>
  393.  
  394.  
  395.  
  396.  
  397. <script type"text/javascript">
  398. $(document).ready(function() {
  399. // hides the slickbox as soon as the DOM is ready
  400. $('#slickbox').hide();
  401.  
  402. // shows the slickbox on clicking the noted link
  403. $('#slick-show').click(function() {
  404. $('#slickbox').show('slow');
  405. return false;
  406. });
  407. // hides the slickbox on clicking the noted link
  408. $('#slick-hide').click(function() {
  409. $('#slickbox').hide('fast');
  410. return false;
  411. });
  412.  
  413. // toggles the slickbox on clicking the noted link
  414. $('#slick-toggle').click(function() {
  415. $('#slickbox').toggle(250);
  416. return false;
  417. });
  418. });
  419. </script>
  420.  
  421.  
  422. </head>
  423.  
  424. <body>
  425.  
  426. <div class="top">
  427. <div class="nav">
  428. {block:ifMenuOnBanner}
  429. <center><span class="title"><a title="" href="#" id="slick-toggle"><center><div style="text-align: center;cursor: help;"><img style="max-width:1500px; max-height:300px" src="{image:banner}"/></center></a></span><br>
  430.  
  431. <div id="slickbox">
  432. <a href="/">home</a> &nbsp;
  433. {block:ifAskLink}<a href="/ask">{text:Ask Link Text}</a> &nbsp; {/block:ifAskLink}
  434. {block:ifCustomLinkOneTitle}<a href="{text:Custom Link One}">{text:Custom Link One Title}</a> &nbsp; {/block:ifCustomLinkOneTitle}
  435. {block:ifCustomLinkTwoTitle}<a href="{text:Custom Link Two}">{text:Custom Link Two Title}</a> &nbsp; {/block:ifCustomLinkTwoTitle}
  436. {block:ifCustomLinkThreeTitle}<a href="{text:Custom Link Three}">{text:Custom Link Three Title}</a> &nbsp; {/block:ifCustomLinkThreeTitle}
  437. {block:ifCustomLinkFourTitle}<a href="{text:Custom Link Four}">{text:Custom Link Four Title}</a> &nbsp; {/block:ifCustomLinkFourTitle}
  438. {block:ifCustomLinkFiveTitle}<a href="{text:Custom Link Five}">{text:Custom Link Five Title}</a> &nbsp; {/block:ifCustomLinkFiveTitle}
  439. <a href="http://0-xum.tumblr.com/">theme</a><br><br>
  440. {block:Description}{Description}{/block:Description}</div>
  441. {/block:ifMenuOnBanner}
  442. {block:ifnotMenuOnBanner}
  443. <center><div style="text-align: center;">{block:ifusebanner}<img style="max-width:1500px; max-height:250px" src="{image:banner}"/>{/block:ifusebanner}<br><span class="title"><a href="/">{block:ifshowblogtitle}{Title}{/block:ifshowblogtitle}</a></span></div><br><br>
  444. <a href="/">home</a> &nbsp;
  445. {block:ifAskLink}<a href="/ask">{text:Ask Link Text}</a> &nbsp; {/block:ifAskLink}
  446. {block:ifCustomLinkOneTitle}<a href="{text:Custom Link One}">{text:Custom Link One Title}</a> &nbsp; {/block:ifCustomLinkOneTitle}
  447. {block:ifCustomLinkTwoTitle}<a href="{text:Custom Link Two}">{text:Custom Link Two Title}</a> &nbsp; {/block:ifCustomLinkTwoTitle}
  448. {block:ifCustomLinkThreeTitle}<a href="{text:Custom Link Three}">{text:Custom Link Three Title}</a> &nbsp; {/block:ifCustomLinkThreeTitle}
  449. {block:ifCustomLinkFourTitle}<a href="{text:Custom Link Four}">{text:Custom Link Four Title}</a> &nbsp; {/block:ifCustomLinkFourTitle}
  450. {block:ifCustomLinkFiveTitle}<a href="{text:Custom Link Five}">{text:Custom Link Five Title}</a> &nbsp; {/block:ifCustomLinkFiveTitle}
  451. <a href="http://0-xum.tumblr.com/">theme</a><br><br>
  452. {block:Description}{Description}{/block:Description}{/block:ifnotMenuOnBanner}
  453. </center></center>
  454.  
  455. </div>
  456.  
  457. </div>
  458.  
  459. </div>
  460.  
  461. <div id="content">
  462.  
  463. <div class="posts">
  464.  
  465. {block:Posts}
  466.  
  467. <div class="entry">
  468.  
  469. {block:Text}
  470. <div id="entry">
  471. {block:Title}<span class="post_title">{Title}</span>{/block:Title}
  472. {Body}
  473. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a></div>{/block:IndexPage}
  474. </div>
  475. {/block:Text}
  476.  
  477. {block:Photo}
  478. {block:IndexPage}{block:ifReblogLinkOnHover}<div class="photopermaholder"><div class="photoperma"><a href="{ReblogURL}"target="_blank"><img src="http://static.tumblr.com/i8axhtw/blCm9ugwq/reblogicon.png"></a></div></div>{/block:IndexPage}
  479. {/block:ifReblogLinkOnHover}{block:IndexPage}
  480. {LinkOpenTag}<a href="{Permalink}"><img src="{PhotoUrl-500}" width="250"></a>{LinkCloseTag}{/block:IndexPage}
  481. {block:PermalinkPage}
  482. {block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  483. {/block:Photo}
  484.  
  485. {block:Photoset}
  486. <div id="entry">
  487. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  488. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  489. {block:Caption}{Caption}{/block:Caption}
  490. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a></div>{/block:IndexPage}
  491. </div>
  492. {/block:Photoset}
  493.  
  494. {block:Quote}
  495. <div id="entry">
  496. <div class="quote">" {Quote} " </div>
  497.  
  498. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a></div>{/block:IndexPage}
  499. </div>
  500. {/block:Quote}
  501.  
  502. {block:Link}
  503. <div id="entry">
  504. <a href="{URL}"{Target}><span class="link_title">&rarr; {Name}</span></a>
  505. {block:Description}<small>{Description}</small>{/block:Description}
  506. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a></div>{/block:IndexPage}
  507. </div>
  508. {/block:Link}
  509.  
  510. {block:Video}
  511. <div class="video">
  512. {block:IndexPage}{Video-250}{/block:IndexPage}
  513. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  514. </div>
  515. {block:IndexPage}{block:Caption}<div class="videocap"><a href="{Permalink}">{Caption}</a></div>{/block:Caption}{/block:IndexPage}
  516. {block:PermalinkPage}{block:Caption}<div class="videocap">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
  517. {/block:Video}
  518.  
  519. {block:Chat}
  520. <div id="entry">
  521. {block:Title}
  522. <div class="ptitle">{Title}</div>
  523. {/block:Title}{block:Lines}{block:Label}<b>{Label}</b> {/block:Label}{Line}<br>{/block:Lines}
  524. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a></div>{/block:IndexPage}
  525. </div>
  526. {/block:Chat}
  527.  
  528. {block:Audio}
  529. {block:AlbumArt}<div class="albumart"><img src="{AlbumArtURL}"></a></div>{/block:AlbumArt}
  530. <div class="audio">{AudioPlayerWhite}</div>
  531. {block:IndexPage}{block:Caption}<div class="audiocap"><a href="{Permalink}">{Caption}</a></div>{/block:Caption}{/block:IndexPage}
  532. {block:PermalinkPage}{block:Caption}<div class="audiocap">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
  533. {/block:Audio}
  534.  
  535. {block:Answer}
  536. <div id="entry">
  537. <div class="question">{Asker}: {Question}</div>
  538. {Answer}
  539. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a></div>{/block:IndexPage}
  540. </div>
  541. {/block:Answer}
  542.  
  543. {block:PostNotes}{PostNotes}{/block:PostNotes}
  544.  
  545. </div>
  546.  
  547. {/block:Posts}
  548. </div>
  549. </div>
  550.  
  551. {block:IndexPage}
  552. <div class="column navigation" id="navigation">
  553. {block:Pagination}
  554. {block:PreviousPage}<a href="{PreviousPage}" class="navigate">{/block:PreviousPage}{block:PreviousPage}</a>{/block:PreviousPage}
  555. {block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage">{/block:NextPage}{block:NextPage}</a>{/block:NextPage}{/block:Pagination}
  556. </div>
  557. {/block:IndexPage}
  558.  
  559. <div style="font-family:arial ; text-transform:none; position:fixed; bottom:3px; right:5px; padding:5px; "><a href="http://0-xum.tumblr.com"><small>Themeby0-xum</small></a></div>
  560. </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement