Advertisement
puckrps

THEME 02: BADASS

Sep 26th, 2014
540
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.76 KB | None | 0 0
  1. <!-- PUCKRPS' THEME NUMBER TWO: BADASS
  2. Please do not steal, use as a base code, or redistribute. It will be obvious if you have stolen the code from me and it's not just worth the drama. Those are the only rules I have, feel free to edit as you please! Enjoy the theme. <3 -->
  3.  
  4.  
  5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  6. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  7. <head><title>{Title}</title>
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  10. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  11.  
  12. <meta name="color:background" content="#ffffff"/>
  13. <meta name="color:text" content="#888"/>
  14. <meta name="color:link" content="#888"/>
  15. <meta name="color:navigation" content="#ffffff"/>
  16. <meta name="color:link hover" content="#b8b8b8"/>
  17. <meta name="color:sidebarbg" content="#b8b8b8"/>
  18. <meta name="color:sidebar" content="#b8b8b8"/>
  19. <meta name="color:link text" content="#b8b8b8"/>
  20. <meta name="color:navhover" content="#b8b8b8"/>
  21. <meta name="color:entries" content="#b8b8b8"/>
  22. <meta name="color:textshadow" content="#000000"/>
  23. <meta name="color:border" content="#000000"/>
  24. <meta name="color:scrollbar" content="#888" />
  25. <meta name="image:sidebar" content=""/>
  26. <meta name="image:sidebarbg" content=""/>
  27. <meta name="text:link1 title" content=""/>
  28. <meta name="text:link1 URL" content="/" />
  29. <meta name="text:link2 title" content=""/>
  30. <meta name="text:link2 URL" content="/" />
  31. <meta name="text:link3 title" content=""/>
  32. <meta name="text:link3 URL" content="/" />
  33. <meta name="text:link4 title" content=""/>
  34. <meta name="text:link4 URL" content="/" />
  35.  
  36. <link rel="shortcut icon" href="{Favicon}">
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  38. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  39.  
  40. <script type="text/javascript" src="http://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script>
  41.  
  42. <style type="text/css">
  43.  
  44. ::-webkit-scrollbar{height: 5px; width: 5px; -webkit-border-radius: 0px; background-color:#ffffff;}
  45.  
  46. ::-webkit-scrollbar-thumb{background-color:{color:scrollbar};}
  47. ::-webkit-scrollbar-track{background-color:#ffffff;}
  48.  
  49.  
  50. body {
  51. background:{color:background};
  52. margin:0px;
  53. {block:ifbackgroundimage}background-image:url('{image:background}');{/block:ifbackgroundimage}
  54. color:{color:text};
  55. font-family:georgia;
  56. font-size:10px;
  57. line-height:150%;
  58. text-align:justify;
  59. }
  60.  
  61. div#qTip {
  62. font-size:9px;
  63. margin-top: 3px;
  64. margin-left: 3px;
  65. display: none;
  66. text-align: center;
  67. position :absolute;
  68. letter-spacing: 0px;
  69. text-transform: uppercase;
  70. z-index: 5;
  71. padding:3px;
  72. color: {color:text};
  73. background: {color:background};
  74. border: 1px solid {color:border}}
  75.  
  76. a {
  77. text-decoration:none;
  78. outline:none;
  79. -moz-outline-style:none;
  80. color:{color:link};
  81. -webkit-transition: all 0.5s ease-in-out;
  82. -moz-transition: all 0.5s ease-in-out;
  83. -o-transition: all 0.5s ease-in-out;
  84. }
  85.  
  86. a:hover {
  87. text-decoration:none;
  88. outline:none;
  89. -moz-outline-style:none;
  90. color:{color:link hover};
  91. text-shadow: 0px 0px 1px {color:textshadow};
  92. -webkit-transition: all 0.5s ease-in-out;
  93. -moz-transition: all 0.5s ease-in-out;
  94. -o-transition: all 0.5s ease-in-out;
  95. }
  96.  
  97. img {
  98. border:none;
  99. }
  100.  
  101. img {
  102. max-width: 100%;
  103. }
  104.  
  105. h1 {
  106. font-size:15px;
  107. }
  108.  
  109. #entries {
  110. padding:10px;
  111. width:500px;
  112. margin-left:510px;
  113. margin-top:20px;
  114. }
  115.  
  116. #post {
  117. width:500px;
  118. padding:15px;
  119. background-color:{color:entries};
  120. border:1px solid {color:border};
  121. margin-bottom: 0px;
  122. }
  123.  
  124. #sidebar {
  125. width:249px;
  126. position:fixed;
  127. margin-left:50px;
  128. margin-top:70px;
  129. }
  130.  
  131. #links {
  132. text-align:center;
  133. margin-top:-6px;
  134. margin-right:0px;
  135. margin-left:-2px;
  136. }
  137.  
  138. #links a {
  139. text-align:center;
  140. font-family:cambria;
  141. font-size:15px;
  142. letter-spacing:1px;
  143. font-style:italic;
  144. font-weight:bold;
  145. margin-bottom:0px;
  146. background-color:{color:navigation};
  147. color:{color:link text};
  148. display:inline-block;
  149. border:1px solid {color:border};
  150. width:42px;
  151. line-height:250%;
  152. height:38px;
  153. padding:2px;
  154. text-transform:uppercase;
  155. -webkit-transition: all 0.5s ease-in-out;
  156. -moz-transition: all 0.5s ease-in-out;
  157. -o-transition: all 0.5s ease-in-out;
  158. }
  159.  
  160. #links a:hover {
  161. border:1px solid {color:border};
  162. background-color:{color:navhover};
  163. text-shadow: 0px 0px 1px {color:textshadow};
  164. color:{color:text};
  165. display:inline-block;
  166. text-align:center;
  167. -webkit-transition: all 0.5s ease-in-out;
  168. -moz-transition: all 0.5s ease-in-out;
  169. -o-transition: all 0.5s ease-in-out;
  170. }
  171.  
  172.  
  173.  
  174. #posttitle {
  175. letter-spacing: 0px;
  176. margin-bottom: 5px;
  177. color:{color:sidebar link};
  178. text-transform: uppercase;
  179. font-size:17px;
  180. text-align:center;
  181. }
  182.  
  183. #posttitle2 {
  184. letter-spacing: 1px;
  185. margin-bottom: 5px;
  186. font-style: italic;
  187. font-family:cambria;
  188. color:{color:sidebar link};
  189. text-transform: lowercase;
  190. font-size:17px;
  191. text-align:right;
  192. }
  193.  
  194. #sidebarimage {
  195. width: 320px;
  196. margin-top:9px;
  197. height:200px;
  198. background-color:{color:sidebarbg};
  199. margin-left:8px;
  200. border:1px solid {color:border};
  201.  
  202. }
  203.  
  204. #sidebarimage img {
  205. width: 320px;
  206. height:200px;
  207.  
  208.  
  209. }
  210.  
  211. #entrybg {
  212. padding: 5px;
  213. width:533px;
  214. height:auto;
  215. margin-left:0px;
  216. margin-top:0px;
  217. margin-bottom: 45px;
  218. background-color:{color:sidebar};
  219. background-image:url('{image:sidebarbg}');
  220. border: 1px solid {color:border};
  221. }
  222.  
  223. #sidebarbg {
  224. position: fixed;
  225. margin-left:60px;
  226. width: 340px;
  227. margin-top: 80px;
  228. height: 459px;
  229. border: 1px solid {color:border};
  230. background-color:{color:sidebarbg};
  231. background-image:url('{image:sidebarbg}');
  232. background-attachment:fixed;
  233. }
  234.  
  235.  
  236. #description {
  237. padding: 10px;
  238. line-height:130%;
  239. background: none;
  240. width:300px;
  241. height:155px;
  242. border: 1px solid {color:border};
  243. background-color:{color:sidebar};
  244. font-size: 10px;
  245. font-family:georgia;
  246. margin-top: 60px;
  247. margin-left: 8px;
  248. }
  249.  
  250. #linksbg {
  251. padding: 10px;
  252. line-height:130%;
  253. background: none;
  254. width:300px;
  255. height:32px;
  256. border: 1px solid {color:border};
  257. background-color:{color:sidebar};
  258. font-size: 10px;
  259. font-family:georgia;
  260. margin-top: -234px;
  261. margin-left: 8px;
  262. }
  263.  
  264. #pagination {
  265. font-size:16px;
  266. margin-top:5px;
  267. text-align:center;
  268. }
  269.  
  270. #info {
  271. font-size:10px;
  272. letter-spacing: 0px;
  273. width: 530px;
  274. text-transform: uppercase;
  275. background-color: {color:entries};
  276. border: 1px solid {color:border};
  277. padding-top: 3px;
  278. padding-bottom: 0px;
  279. text-align:center;
  280. margin-top:2px;
  281. }
  282.  
  283. #tags {
  284. text-transform: lowercase;
  285. letter-spacing: 0px;
  286. background-color: {color:entries};
  287. margin-top:0px;
  288. font-size: 9px;
  289. font-style: italic;
  290. text-align:center;
  291. }
  292.  
  293. b, strong {
  294. color:{color:link}
  295. }
  296.  
  297. i, em {
  298. color:{color:text}
  299. }
  300.  
  301. #p, p {
  302. margin-top:5px;
  303. margin-bottom:5px
  304. }
  305.  
  306. #audio {
  307. border-radius:0%;
  308. width:100%;
  309. height:100px;
  310. margin-bottom:10px}
  311.  
  312. .albumart {
  313. border-radius:0%;
  314. padding: 2px;
  315. border: 1px #f1f1f1 solid;
  316. float:left;
  317. width:100px;
  318. height:100px}
  319.  
  320. .player {
  321. border-radius:0%;
  322. margin-left:2px;
  323. margin-top:2px;
  324. padding:11px;
  325. display:block;
  326. height:80px;
  327. width:80px;
  328. overflow:hidden;
  329. position:absolute;
  330. opacity:0.3;
  331. background:#fff;
  332. -webkit-transition:all 0.4s ease-in-out;
  333. -moz-transition:all 0.4s ease-in-out;
  334. -o-transition:all 0.4s ease-in-out;
  335. -ms-transition: all 0.4s ease-in-out;
  336. transition:all 0.5s ease-in-out}
  337.  
  338. .player:hover {
  339. opacity:0.7;
  340. -webkit-transition:all 0.4s ease-in-out;
  341. -moz-transition:all 0.4s ease-in-out;
  342. -o-transition:all 0.4s ease-in-out;
  343. -ms-transition: all 0.4s ease-in-out;
  344. transition:all 0.5s ease-in-out}
  345.  
  346. .audioplayer {
  347. width:24px;
  348. height:24px;
  349. margin:28px 0 0 28px;
  350. overflow:hidden}
  351.  
  352. .audioinfo {
  353. margin-left:105px;
  354. height:54px;
  355. line-height:100%;
  356. color:{color:text};
  357. padding:26px 5px 24px 10px;
  358. text-align:left}
  359.  
  360. .tracktitle {
  361. margin-top: 10px;
  362. color:{color:title};
  363. margin-bottom:-15px;
  364. text-transform: uppercase;
  365. font-size: 11px;
  366. }
  367.  
  368. .user_1 .label {
  369. color:{color:link};
  370. text-transform:uppercase;
  371. font-weight:bold}
  372.  
  373. .user_2 .label {
  374. color:{color:title};
  375. text-transform:uppercase;
  376. font-weight:bold}
  377.  
  378. .user_3 .label {
  379. color:{color:link};
  380. text-transform:uppercase;
  381. font-weight:bold}
  382.  
  383. .user_4 .label {
  384. color:{color:title};
  385. text-transform:uppercase;
  386. font-weight:bold}
  387.  
  388. .user_5 .label {
  389. color:{color:link};
  390. text-transform:uppercase;
  391. font-weight:bold}
  392.  
  393. .user_6 .label {
  394. color:{color:title};
  395. text-transform:uppercase;
  396. font-weight:bold}
  397.  
  398. .user_7 .label {
  399. color:{color:link};
  400. text-transform:uppercase;
  401. font-weight:bold}
  402.  
  403. .user_8 .label {
  404. color:{color:title};
  405. text-transform:uppercase;
  406. font-weight:bold}
  407.  
  408. .user_9 .label {
  409. color:{color:link};
  410. text-transform:uppercase;
  411. font-weight:bold}
  412.  
  413. .user_10 .label {
  414. color:{color:title};
  415. text-transform:uppercase;
  416. font-weight:bold}
  417.  
  418. ul.chat, .chat ol, .chat li {
  419. list-style:none;
  420. margin:0px 0px 3px 0px;
  421. padding:0px; 0px 0px 0px}
  422.  
  423. #asks {
  424. text-align:justify;
  425. padding:10px 2px 2px 2px;
  426. margin-top:-5px;
  427. color:{color:text};
  428. background-color:{color:background};
  429. border: 2px {color:border} solid;
  430. text-align:center;
  431. min-height:43px;}
  432.  
  433. .asker {
  434. text-transform:uppercase;
  435. margin-bottom:-12px;
  436. font-size:15px;
  437. text-align:center;
  438. letter-spacing:0px;}
  439.  
  440. #answers {
  441. margin-top:10px}
  442.  
  443. blockquote {
  444. margin-top: 0px;
  445. margin-bottom: 0px;
  446. width: 480px;
  447. border-left: 3px {color:text} solid;
  448. padding-left: 5px;
  449. margin-left: 5px;
  450. text-align:justify;
  451. }
  452.  
  453. #credit a {
  454. position:fixed;
  455. letter-spacing: 0px;
  456. font:20px georgia;
  457. border: 1px {color:border} solid;
  458. color:{color:links};
  459. background-color:{color:entries};
  460. padding:0px;
  461. bottom:10px;
  462. right:10px
  463. }
  464.  
  465. #credit a:hover {
  466. color:{color:text}
  467. }
  468.  
  469.  
  470. {CustomCSS}</style></head><body>
  471.  
  472. <div id="sidebarbg">
  473.  
  474.  
  475.  
  476.  
  477. <div id="sidebarimage"><img src="{image:sidebar}"></div>
  478.  
  479.  
  480.  
  481. <div id="description">{Description}
  482. <div id="pagination">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">«</a>{/block:PreviousPage} page {CurrentPage} of {TotalPages} {block:NextPage}<a href="{NextPage}">»</a>{/block:NextPage}{/block:Pagination}</div></div>
  483.  
  484. <div id="linksbg">
  485. <div id="links">
  486. <a href="/" title="home.">01.</a>
  487. <a href="/ask" title="askbox.">02.</a>
  488. <a href="{text:Link1 URL}" title="{text:Link1 title}.">03.</a>
  489. <a href="{text:Link2 URL}" title="{text:Link2 title}.">04.</a>
  490. <a href="{text:Link3 URL}" title="{text:Link3 title}.">05.</a>
  491. <a href="{text:Link4 URL}" title="{text:Link4 title}.">06.</a>
  492. </div></div>
  493.  
  494. </div>
  495.  
  496.  
  497.  
  498. <div id="entries">{block:Posts}<div id="entrybg"><div id="post">
  499.  
  500. {block:Title}<div id="posttitle">{Title}</div>{/block:Title} {Body}
  501.  
  502. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  503.  
  504. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  505.  
  506. {block:Quote}<div id="posttitle2">"{Quote}"</div>{block:Source}<br>—<b>{Source}</b>{/block:Source}{/block:Quote}
  507.  
  508. {block:Link}<div id="posttitle"><a href="{URL}" {Target}>{Name}</a></div>{block:Description}{Description}{/block:Description}{/block:Link}
  509.  
  510. {block:Chat} <ul class="chat">{block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>
  511. {/block:Chat}
  512.  
  513. {block:Audio}
  514. <div id="audio">
  515. <div class="player"><div class="audioplayer">{AudioPlayerWhite}</div></div>
  516. <div class="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="100" style="border-radius: 0%">{/block:AlbumArt}</div>
  517. <div class="audioinfo">
  518. <div class="tracktitle">{block:TrackName}{TrackName}{/block:TrackName}{block:Artist} by <b>{Artist}</b>{/block:Artist}</div><br>
  519. {block:Album}<br>
  520. <b>Album:</b> {Album}{/block:Album}<br>
  521. <b>Played:</b> {FormattedPlayCount} times</div></div>
  522. {block:Caption}{Caption}{/block:Caption}
  523. {/block:Audio}
  524.  
  525. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  526.  
  527. {block:Answer}
  528. <div id="asks"><div class="asker">{Asker} asked:</div>
  529. <br>{Question}</div>
  530. <div id="answers">{Answer}</div>
  531. {/block:Answer}</div>
  532.  
  533.  
  534. {block:Date}<div id="info">POSTED <a href="{Permalink}">{TimeAgo}</a> {block:NoteCount} WITH {NoteCountwithlabel} {/block:NoteCount}{block:RebloggedFrom} — via <a href="{ReblogParentURL}">{ReblogParentName}</a>{block:ContentSource} (<a href="{SourceURL}">source</a>){block:ContentSource}{/block:RebloggedFrom}{/block:Date}
  535. <div id="tags"> tags: {block:Tags}{block:HasTags}#<a href="{TagURL}">{Tag}</a> {/block:HasTags}{/block:Tags}</div></div>
  536.  
  537. </div>
  538. {block:PostNotes}{PostNotes}{/block:PostNotes}
  539. {/block:Posts}</div>
  540.  
  541. <!-- DO NOT REMOVE THIS -->
  542. <div id="credit"><a href="http://puckrps.tumblr.com/">❤</a></div>
  543. <!-- DO NOT REMOVE THIS -->
  544.  
  545. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement