Advertisement
Guest User

junebug theme 1

a guest
Oct 12th, 2013
45
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 19.31 KB | None | 0 0
  1. <html>
  2. <head>
  3. <title>{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. {block:Description}
  7. <meta name="description" content="{MetaDescription}" />
  8.  
  9. <meta name="text:image background" content="http://25.media.tumblr.com/96a39efa4d907f9e896d57a37756de05/tumblr_mtawtqq3DE1st5lhmo1_1280.jpg" />
  10. <meta name="text:sidebar pic" content="http://31.media.tumblr.com/95c52fcf0072d4ba3085cc7ddaf8e49d/tumblr_mftdhwSrOz1rgab2qo18_r2_250.gif" />
  11. <meta name="text:link1 url" content="http://" />
  12. <meta name="text:link1 name" content="" />
  13. <meta name="text:link2 url" content="http://" />
  14. <meta name="text:link2 name" content="" />
  15. <meta name="text:link3 url" content="http://" />
  16. <meta name="text:link3 name" content="" />
  17. <meta name="text:link4 url" content="http://" />
  18. <meta name="text:link4 name" content="" />
  19.  
  20. <meta name="color:titles color" content="#BABABA" />
  21. <meta name="color:links color" content="#BABABA" />
  22. {/block:Description}
  23.  
  24. <style type="text/css">
  25. body {
  26. background:url({text:image background}) fixed no-repeat;
  27. font-size:9px;
  28. font-family:arial;
  29. color:#f5f5f5;
  30. }
  31.  
  32. h1, h3 {
  33. font-size:24px;
  34. text-align:center;
  35. color:{color:titles color};
  36. position:relative;
  37. z-index:6;
  38. font-family: 'Dosis', sans-serif;
  39. font-weight:100;
  40. line-height:90%;
  41. text-transform:uppercase;
  42. }
  43.  
  44. h1 {
  45. text-transform:uppercase;
  46. font-weight:100;
  47. border-bottom:1px solid {color:titles color};
  48. }
  49.  
  50. a {
  51. color:{color:links color};
  52. text-decoration:none;
  53. -webkit-transition:0.3s all ease;
  54. -moz-transition:0.3s all ease;
  55. -o-transition:0.3s all ease;
  56. }
  57.  
  58. a:hover {
  59. color: transparent;
  60. text-shadow: 0 0 5px rgba(255,255,255,0.5);
  61. }
  62.  
  63. .sidebar {
  64. width:240px;
  65. height:100%;
  66. background:rgba(0,0,0,0.8);
  67. position:fixed;
  68. left:13%;
  69. top:0px;
  70. z-index:4;
  71. padding:100px 5px 0px 5px;
  72. }
  73.  
  74. .sidebar #description {
  75. width:240px;
  76. padding:15px;
  77. color:#BABABA;
  78. }
  79.  
  80. .wrapper {
  81. min-width:500px;
  82. position:absolute;
  83. right:23%;
  84. top:-5px;
  85. }
  86.  
  87. .post {
  88. width:500px;
  89. overflow:hidden;
  90. position:relative;
  91. z-index:4;
  92. margin:10px 0px 10px 0px;
  93. background:black;
  94. padding:5px;
  95. }
  96.  
  97. .post img {
  98. width:500px;
  99. max-width:500px;
  100. }
  101.  
  102. .post #tru {
  103. width:450px;
  104. padding:25px;
  105. opacity:0;
  106. -webkit-transition:0.6s all ease;
  107. -moz-transition:0.6s all ease;
  108. height:100%;
  109. background:rgba(0,0,0,0.7);
  110. color:white;
  111. position:absolute;
  112. top:0px;
  113. z-index:6;
  114. text-align:center;
  115. font-size:10px;
  116. text-transform:uppercase;
  117. font-weight:100;
  118. line-height:90%;
  119. }
  120.  
  121. .post:hover #tru {
  122. opacity:1;
  123. }
  124.  
  125. #like {
  126. position:absolute;
  127. left:220px;
  128. bottom:150px;
  129. }
  130.  
  131. #reblog {
  132. position:absolute;
  133. right:220px;
  134. bottom:150px;
  135. }
  136.  
  137. #posts {
  138. width:500px;
  139. }
  140.  
  141. #sbpg {
  142. text-transform:uppercase;
  143. letter-spacing:2px;
  144. text-align:center;
  145. }
  146.  
  147. #linkbar {
  148. color:#000;
  149. background:#8b8682;
  150. text-align:center;
  151. width:240px;
  152. font-size:8px;
  153. text-transform:uppercase;
  154. letter-spacing:3px;
  155. padding:2px 0px;
  156. }
  157.  
  158. #linkbar a {
  159. color:#000;
  160. }
  161.  
  162. .lasnotes {
  163. list-style:none;
  164. width:490px;
  165. padding:10px;
  166. background:rgba(0,0,0,0.7);
  167. }
  168.  
  169. .lostagos {
  170. width:510px;
  171. margin: -5px 0px 5px 0px;
  172. padding:2px 0px;
  173. background:#000;
  174. color:#fafafa !important;
  175. opacity:0.7;
  176. color:#f5f5f5;
  177. text-align:center;
  178. font-style:italic;
  179. }
  180. /*TEXT POSTS*/
  181. .text {
  182. width:470px;
  183. background:black;
  184. padding:20px;
  185. color:#f5f5f5;
  186. }
  187.  
  188. /*PHOTO POSTS*/
  189.  
  190. /*VIDEO POSTS*/
  191. .vcaption {
  192. background:black;
  193. padding:10px;
  194. width:480px;
  195. margin-top:3px;
  196. color:#f5f5f5;
  197. }
  198.  
  199. /*PHOTOSETS*/
  200.  
  201. /*LINK POSTS*/
  202. .link {
  203. font-size:24px;
  204. line-height:90%;
  205. padding:5px;
  206. font-family:dosis;
  207. font-weight:100;
  208. text-transform:uppercase;
  209. }
  210.  
  211. .link a {
  212. margin-bottom:-4px;
  213. line-height:90%;
  214. }
  215.  
  216. .description {
  217. line-height:90%;
  218. color:white;
  219. font-size:9px;
  220. letter-spacing:3px;
  221. text-transform:uppercase;
  222. padding:5px;
  223. }
  224. /*QUOTE POSTS*/
  225. .quote {
  226. font-style:italic;
  227. color:white;
  228. font-size:18px;
  229. padding:20px;
  230. width:470px;
  231. }
  232.  
  233. .source {
  234. font-size:9px;
  235. text-align:right;
  236. text-transform:uppercase;
  237. letter-spacing:3px;
  238. }
  239.  
  240. /*AUDIO POSTS*/
  241. .audio {
  242. min-height:100px;
  243. margin-bottom:-5px;
  244. padding-bottom:-10px;
  245. }
  246.  
  247. .audio img {
  248. width:100px;
  249. }
  250.  
  251. #albumart {
  252. float:left;
  253. top:-100px;
  254. position:relative;
  255. z-index:2;
  256. margin-bottom:-100px;
  257. }
  258.  
  259. #audioplayer {
  260. width:30px;
  261. height:30px;
  262. overflow:hidden;
  263. position:absolute;
  264. margin:40px;
  265. opacity:0.6;
  266. z-index:3;
  267. }
  268.  
  269. #defaultaa {
  270. width:100px;
  271. height:100px;
  272. z-index:1;
  273. position:relative;
  274. }
  275.  
  276. #aanotes {
  277. color:#000;
  278. background:#BABABA;
  279. text-align:center;
  280. width:500px;
  281. font-size:8px;
  282. text-transform:uppercase;
  283. letter-spacing:3px;
  284. padding:2px 0px;
  285. }
  286.  
  287. #aanotes a {
  288. color:#000;
  289. }
  290. #aacap {
  291. position:relative;
  292. top:-110px;
  293. left:105px;
  294. padding:20px;
  295. font-family:arial;
  296. font-size:7px;
  297. text-transform:uppercase;
  298. letter-spacing:2px;
  299. margin-bottom:-106px;
  300. background:rgba(0,0,0,0.8);
  301. color:#f5f5f5;
  302. min-height:70px;
  303. }
  304.  
  305. /*ASKS CODING*/
  306. #question {
  307. width:460px;
  308. padding:10px 20px;
  309. text-align:justify;
  310. background:#bababa;
  311. color:#000;
  312. font-size:8px;
  313. text-transform:uppercase;
  314. }
  315.  
  316. #qq {
  317. color:#bababa;
  318. text-align:justify;
  319. text-indent:20px;
  320. }
  321.  
  322. /*CHAT POSTS*/
  323. .chat {
  324. width:500px;
  325. background:black;
  326. color:#f5f5f5;
  327. padding:5px;
  328. list-style:none;
  329. }
  330. .cls {
  331. list-style:none;
  332. }
  333.  
  334. .label {
  335. text-transform:uppercase;
  336. margin-left:-30px;
  337. }
  338. </style>
  339.  
  340.  
  341. </head>
  342. <body> <link href='http://fonts.googleapis.com/css?family=Dosis:200' rel='stylesheet' type='text/css'>
  343. <div class="sidebar">
  344. {block:Description}
  345. <h1><a href="/">{Title}</a></h1>
  346. <div style="width:240px; margin-top:-10px; overflow:hidden;"><img src="{text:sidebar pic}" width="240px"></div>
  347. <div id="linkbar"><a href="/ask">ask</a> <a href="{text:link1 url}">{text:link1 name}</a> <a href="{text:link2 url}">{text:link2 name}</a> <a href="{text:link3 url}">{text:link3 name}</a> <a href="{text:link4 url}">{text:link4 name}</a> </div>
  348. <p id="description">{Description}</p>
  349. <center><div id="sbpg">
  350. {block:PreviousPage}
  351. <a href="{PreviousPage}">&#171; Previous</a>
  352. {/block:PreviousPage}
  353. <a href="puppymother.tumblr.com">▲</a>
  354. {block:NextPage}
  355. <a href="{NextPage}">Next &#187;</a>
  356. {/block:NextPage}
  357. </div></center>
  358. {/block:Description}
  359. </div>
  360. <div id="posts" class="wrapper">
  361. {block:Posts}
  362. {block:Text}
  363. <div class="post text">
  364. {block:Title}
  365. <h3><a href="{Permalink}">{Title}</a></h3>
  366. {/block:Title}
  367.  
  368. {Body}
  369. <div id="tru">
  370. <a href="{Permalink}">{NoteCountWithLabel}</a><center>
  371. <div id="reblog" style="bottom:80px;">
  372. <a href="{ReblogURL}">{reblogbutton}</a>
  373. </div>
  374. <div id="like" style="bottom:80px;">
  375. <a href="{LikeURL}">{likebutton}</a>
  376. </div>
  377. </center>
  378. </div>
  379. </div>
  380. {/block:Text}
  381.  
  382. {block:Photo}
  383. <div class="post photo">
  384. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  385. <div id="tru">
  386. {block:Caption}
  387.  
  388. <div class="caption">{Caption}</div>
  389. <a href="{Permalink}">{NoteCountWithLabel}</a><center>
  390. <div id="reblog">
  391. <a href="{ReblogURL}">{reblogbutton}</a>
  392. </div>
  393. <div id="like">
  394. <a href="{LikeURL}">{likebutton}</a>
  395. </div>
  396. </center>
  397. {/block:Caption}
  398. </div>
  399. </div>
  400.  
  401. {/block:Photo}
  402.  
  403. {block:Panorama}
  404. <div class="post panorama">
  405. {LinkOpenTag}
  406. <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
  407. {LinkCloseTag}
  408.  
  409. <div id="tru">
  410. {block:Caption}
  411.  
  412. <div class="caption">{Caption}</div>
  413. <a href="{Permalink}">{NoteCountWithLabel}</a><center>
  414. <div id="reblog">
  415. <a href="{ReblogURL}">{reblogbutton}</a>
  416. </div>
  417. <div id="like">
  418. <a href="{LikeURL}">{likebutton}</a>
  419. </div>
  420. </center>
  421. {/block:Caption}
  422. </div>
  423. </div>
  424. {/block:Panorama}
  425.  
  426. {block:Photoset}
  427. <div class="post photoset">
  428. {Photoset-500}
  429.  
  430. <div id="tru">
  431. {block:Caption}
  432.  
  433. <div class="caption">{Caption}</div>
  434. <a href="{Permalink}">{NoteCountWithLabel}</a><center>
  435. <div id="reblog">
  436. <a href="{ReblogURL}">{reblogbutton}</a>
  437. </div>
  438. <div id="like">
  439. <a href="{LikeURL}">{likebutton}</a>
  440. </div>
  441. </center>
  442. {/block:Caption}
  443. </div>
  444. </div>
  445. {/block:Photoset}
  446.  
  447. {block:Quote}
  448. <div class="post quote">
  449. "{Quote}"
  450.  
  451. {block:Source}
  452. <div class="source">-- {Source}</div>
  453. {/block:Source}
  454. <div id="tru">
  455. <a href="{Permalink}">{NoteCountWithLabel}</a><center>
  456. <div id="reblog" style="bottom:80px;">
  457. <a href="{ReblogURL}">{reblogbutton}</a>
  458. </div>
  459. <div id="like" style="bottom:80px;">
  460. <a href="{LikeURL}">{likebutton}</a>
  461. </div>
  462. </center>
  463. </div>
  464. </div>
  465. {/block:Quote}
  466.  
  467. {block:Link}
  468. <div class="post link">
  469. <a href="{URL}" class="link" {Target}>{Name}</a>
  470.  
  471. {block:Description}
  472. <div class="description">{Description}</div>
  473. {/block:Description}
  474. <div id="tru">
  475. <a href="{Permalink}">{NoteCountWithLabel}</a><center>
  476. <div id="reblog" style="bottom:80px;">
  477. <a href="{ReblogURL}">{reblogbutton}</a>
  478. </div>
  479. <div id="like" style="bottom:80px;">
  480. <a href="{LikeURL}">{likebutton}</a>
  481. </div>
  482. </center>
  483. </div>
  484. </div>
  485. {/block:Link}
  486.  
  487. {block:Chat}
  488. <div class="post chat">
  489. {block:Title}
  490. <h3><a href="{Permalink}">{Title}</a></h3>
  491. {/block:Title}
  492.  
  493. <ul class="cls">
  494. {block:Lines}
  495. <li class="{Alt} user_{UserNumber}">
  496. {block:Label}
  497. <span class="label">{Label}</span>
  498. {/block:Label}
  499.  
  500. {Line}
  501.  
  502. </li>
  503. {/block:Lines}
  504. </ul>
  505. <div id="tru">
  506. <a href="{Permalink}">{NoteCountWithLabel}</a><center>
  507. <div id="reblog" style="bottom:80px;">
  508. <a href="{ReblogURL}">{reblogbutton}</a>
  509. </div>
  510. <div id="like" style="bottom:80px;">
  511. <a href="{LikeURL}">{likebutton}</a>
  512. </div>
  513. </center>
  514. </div>
  515. </div>
  516. {/block:Chat}
  517.  
  518. {block:Video}
  519. <div class="post video">
  520. {Video-500}
  521.  
  522. {block:Caption}
  523. <div class="vcaption">{Caption}</div>
  524. {/block:Caption}
  525. </div>
  526. {/block:Video}
  527.  
  528. {block:Audio}
  529. <div class="post audio">
  530. <div id="audioplayer">
  531. {AudioPlayerWhite}
  532. </div>
  533. <div id="defaultaa">
  534. <img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" width="100px"/>
  535. </div>
  536. <div id="albumart">
  537. {block:AlbumArt}
  538. <img src="{AlbumArtURL}" width="100">
  539. {/block:AlbumArt}
  540. </div>
  541. {block:caption}
  542. <div id="aacap">
  543. {caption}
  544. {PlayCountWithLabel}
  545. </div>
  546. {/block:caption}
  547. <div id="aanotes">
  548. <a href="{Permalink}">{NoteCountWithLabel}</a>
  549. </div>
  550. </div>
  551.  
  552. {/block:Audio}
  553. {block:Answer}
  554. <div class="post" id="qq">
  555. <div id="question">
  556. <b>{Asker}</b>: {Question}
  557. </div>
  558. {Answer}
  559.  
  560. <div id="tru">
  561. <a href="{Permalink}">{NoteCountWithLabel}</a>
  562. <center>
  563. <div id="reblog" style="bottom:80px;">
  564. <a href="{ReblogURL}">
  565. {reblogbutton}
  566. </a>
  567. </div>
  568. <div id="like" style="bottom:80px;">
  569. <a href="{LikeURL}">
  570. {likebutton}
  571. </a>
  572. </div>
  573. </center>
  574. </div>
  575. </div>
  576. {/block:Answer}
  577.  
  578. {block:PermalinkPage}
  579. <style type="text/css">
  580. #tru { display:none; }
  581. .post:hover #tru { display:none; }
  582. </style>
  583. {block:HasTags}
  584. <div class="lostagos">
  585. {block:Tags}
  586. <a href="{TagURL}">#{Tag}</a>
  587. {/block:Tags}
  588. </div>
  589. {/block:HasTags}
  590.  
  591. <div class="lasnotes">
  592. {PostNotes}
  593. </div>
  594. {/block:PermalinkPage}
  595. {/block:Posts}
  596. </div>
  597.  
  598.  
  599. </body>
  600. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement