alithegreat

THEME 12; LET'S BE BAD

Jul 4th, 2014
598
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.50 KB | None | 0 0
  1. <!--
  2.  
  3. BASE CODE BY KAYLIE (@DEANANDHISPIE)
  4. THEME BY ALI (@ALICATOFRP OR @SAINTBERRIES)
  5. THEME #12: LET'S BE BAD
  6.  
  7. ♛ No stealing any parts of this coding and using it in your own
  8. ♛ Do not use this as a base code for your own theme
  9. ♛ Feel free to edit as much as you'd like for personal use
  10. ♛ Do not take my credit off (or the base credit) or move it somewhere else
  11. ♛ Let me know if you have any questions about this theme
  12.  
  13. -->
  14.  
  15.  
  16. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  17.  
  18. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  19. <head>
  20. <title>{Title}</title>
  21. <link rel="shortcut icon" href="{Favicon}">
  22.  
  23. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  24. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  25.  
  26. <meta name="color:bg" content="#FFFFFF">
  27. <meta name="color:border" content="#e2e1e1">
  28. <meta name="color:infobg" content="#F9F9F9">
  29. <meta name="color:linksbg" content="#ededed">
  30. <meta name="color:links hover" content="#f7f5f5">
  31. <meta name="color:links" content="#c2c2c2">
  32. <meta name="color:title" content="#f7f5f5">
  33. <meta name="color:scrollbar" content="#dddada">
  34. <meta name="color:scrollbar bg" content="#f7f5f5">
  35. <meta name="color:tags" content="#d3d0d0">
  36. <meta name="color:text" content="#c0bfbf">
  37. <meta name="color:title" content="#c0bfbf">
  38.  
  39. <meta name="image:sidebar" content=""/>
  40.  
  41. <meta name="text:linkA" content="">
  42. <meta name="text:linkA url" content="/">
  43. <meta name="text:linkB" content="">
  44. <meta name="text:linkB url" content="/">
  45. <meta name="text:linkC" content="">
  46. <meta name="text:linkC url" content="/">
  47.  
  48. <style type="text/css">
  49.  
  50.  
  51. ::-webkit-scrollbar {background-color:{color:scrollbar bg}; height:8px; width:5px}
  52. ::-webkit-scrollbar-thumb:vertical {background-color:{color:scrollbar}; height:50px}
  53. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:scrollbar}; height:10px!important}
  54.  
  55. body {
  56. background:{color:bg};
  57. color:{color:text};
  58. font-family:'times new';
  59. line-height:140%;
  60. font-size:11px; }
  61.  
  62. a {
  63. color:{color:links};
  64. text-decoration:none
  65. }
  66.  
  67. a:hover {
  68. opacity:1;
  69. font-family: 'times new';
  70. color:{color:links hover};}
  71.  
  72. img {
  73. border:none;
  74. }
  75.  
  76. b,strong {
  77. color:{color:Title};
  78. }
  79.  
  80. small,sub {
  81. font-size:9px;
  82. }
  83.  
  84. h1 {
  85. font-weight:normal;
  86. font-size:10px;
  87. text-align:center;
  88. font-style:normal;
  89. line-height:80%;
  90. letter-spacing:1px;
  91. text-transform:uppercase;
  92. color:{color:text};
  93. }
  94.  
  95.  
  96. blockquote {
  97. border-left:1px solid {color:text};
  98. padding-left:5px;
  99. margin:5px;}
  100.  
  101. #theme {
  102. background-color:{color:bg};
  103. width:700px;
  104. margin: 0 auto -12px auto;
  105. text-align: center;}
  106.  
  107.  
  108. h2 {
  109. font-size:20px;
  110. text-align:right;
  111. font-weight:normal;
  112. line-height:100%;
  113. letter-spacing:-0.5px;
  114. color:{color:title};
  115. font-style:italic;
  116. padding:5px;
  117. padding-bottom:2px;}
  118.  
  119.  
  120. #sidebar {
  121. color:{color:text};
  122. position:fixed;
  123. width:300px;
  124. height:auto;
  125. margin-left:32px;
  126. margin-top:50px;
  127. text-align:center;
  128. }
  129.  
  130. #sidebarph {
  131. position:fixed;
  132. width:250px;
  133. height:200px;
  134. padding:2px;
  135. margin-left:96px;
  136. margin-top:50px;
  137. border: 1px solid {color:border};
  138. }
  139.  
  140.  
  141. #links {
  142. position:absolute;
  143. z-index: 99999;
  144. margin-left:0px;
  145. margin-top:0px;
  146. width: 61px;
  147. height: 256px;
  148. background-color: transparent;
  149. -webkit-transition: all 0.6s ease-out;
  150. -moz-transition: all 0.6s ease-out;
  151. transition: all 0.6s ease-out;}
  152.  
  153. #links a {
  154. display: block;
  155. margin-bottom:4px;
  156. margin-left:3px;
  157. width: 55px;
  158. height: 29px;
  159. line-height: 29px;
  160. background-color: {color:infobg};
  161. color: {color:links};
  162. text-transform: uppercase;
  163. text-align: center;
  164. font-family: times new;
  165. border:1px solid {color:border};
  166. font-size: 7px;
  167. -webkit-transition: all 0.6s ease;
  168. -moz-transition: all 0.6s ease;
  169. -o-transition: all 0.6s ease;}
  170.  
  171.  
  172. #description {
  173. position: fixed;
  174. text-align:justify;
  175. font-size:10px;
  176. width:295px;
  177. padding:10px;
  178. margin-top:260px;
  179. margin-left:35px;
  180. color:{color:text};
  181. background-color:{color:infobg};
  182. letter-spacing:1px;
  183. line-height:140%;
  184. border:1px solid {color:border};
  185. }
  186.  
  187. .description a {
  188. color:{color:text};
  189. }
  190.  
  191.  
  192. .pagination {
  193. text-transform:lowercase;
  194. letter-spacing:0px;
  195. text-align:center;
  196. margin-top:0px;
  197. font-family:'times new';
  198. font-size:12px;
  199. padding:5px;
  200. font-style:italic;
  201. opacity:1;
  202. -moz-transition-duration:0.7s;
  203. -webkit-transition-duration:0.7s;
  204. -o-transition-duration:0.7s;
  205. }
  206.  
  207. .pagination a {
  208. color:{color:text};
  209. }
  210.  
  211. .pagination a:hover{
  212. color:{color:link};
  213. }
  214.  
  215.  
  216. #entries {
  217. float:left;
  218. margin-left:380px;
  219. margin-top:20px;
  220. text-align:justify;
  221. background-color:{color:bg};
  222. color:{color:text};
  223. margin-bottom: 30px;
  224. }
  225.  
  226.  
  227. #posts {
  228. width:500px;
  229. margin-top:0px;
  230. text-align:justify;
  231. font-size:11px;
  232. line-height:140%;
  233. margin-bottom:30px;
  234. color:{color:text};
  235. padding:10px;
  236. }
  237.  
  238. .caption {
  239. width:500px;
  240. text-align:justify;
  241. line-height:120%;
  242. }
  243.  
  244.  
  245. #ask {
  246. background-color:{color:infobg};
  247. text-align:center;
  248. line-height:120%;
  249. color:{color:text};
  250. padding:5px;
  251. padding-bottom:10px;
  252. padding-top:5px;
  253. }
  254.  
  255.  
  256. #asker img {
  257. margin-left:-2px;
  258. margin-bottom:-15px;
  259. border-radius:50px;
  260. padding:5px;
  261. padding-bottom:5px;
  262. }
  263.  
  264. #ans {
  265. text-align:left;
  266. padding:0px;
  267. color:{color:text};
  268. }
  269.  
  270. .playerbuttonbg {
  271. position: absolute;
  272. left: 20px;
  273. top: 20px;
  274. width: 19px;
  275. height: 19px;
  276. background-color: #ffffff;
  277. padding: 10px;
  278. -webkit-border-radius: 40px;
  279. -moz-border-radius: 40px;
  280. border-radius: 40px;
  281. opacity: .4;
  282. filter: alpha(opacity=40);
  283. opacity: 0.4;
  284. -khtml-opacity: 0.4;
  285. transition: opacity .7s ease-in-out;
  286. -moz-transition: opacity .7s ease-in-out;
  287. -webkit-transition: opacity .7s ease-in-out;
  288. }
  289.  
  290. .playerbuttonbg:hover {
  291. opacity: 1;
  292. filter: alpha(opacity=100);
  293. -moz-opacity: 1;
  294. -khtml-opacity: 1;
  295. }
  296.  
  297. .newplayerbutton {
  298. position: relative;
  299. width: 19px;
  300. height: 19px;
  301. overflow: hidden;
  302. }
  303.  
  304. .playerbuttonhug {
  305. position: absolute;
  306. top: -18px;
  307. left: -7px;
  308. }
  309.  
  310. .tumblr_audio_player {
  311. height: 90px;
  312. width: 270px;
  313. -moz-transform: scale(0.60, 0.60);
  314. -webkit-transform: scale(0.60, 0.60);
  315. -o-transform: scale(0.60, 0.60);
  316. -ms-transform: scale(0.60, 0.60);
  317. transform: scale(0.60, 0.60);
  318. -moz-transform-origin: top left;
  319. -webkit-transform-origin: top left;
  320. -o-transform-origin: top left;
  321. -ms-transform-origin: top left;
  322. transform-origin: top left;
  323. }
  324.  
  325. .audioimgwrapper {
  326. position: absolute;
  327. left: 0px;
  328. top: 0px;
  329. -webkit-border-radius: 40px;
  330. -moz-border-radius: 40px;
  331. border-radius: 40px;
  332. overflow: hidden;
  333. width: 79px;
  334. height: 79px;
  335. }
  336.  
  337. .audioimgwrapper img {
  338. width: 100%;
  339. height: auto;
  340. -webkit-border-radius: 40px;
  341. -moz-border-radius: 40px;
  342. border-radius: 40px;
  343. }
  344.  
  345. .trackdetails {
  346. width: auto;
  347. display:inline-block;
  348. margin-left: 90px;
  349. min-height: 85px;
  350. }
  351.  
  352. .audiowrapper {
  353. position: relative;
  354. display:inline-block;
  355. }
  356.  
  357.  
  358.  
  359. #postinfo {
  360. padding-top:5px;
  361. margin-top:12px;
  362. font-size:8px;
  363. color:{color:link};
  364. text-transform:uppercase;
  365. letter-spacing:1px;
  366. text-align:center;
  367. font-family:'times new';
  368. border-top:1px solid {color:border};
  369. -moz-transition-duration:0.5s;
  370. -webkit-transition-duration:0.5s;
  371. -o-transition-duration:0.5s;
  372. }
  373.  
  374. #postinfo a {
  375. color:{color:link};
  376. letter-spacing:0px;
  377. }
  378.  
  379. #postinfo a:hover {
  380. color:{color:hover};
  381. }
  382.  
  383.  
  384. .tags {
  385. font-style:normal;
  386. width:500px;
  387. text-transform:uppercase;
  388. font-style:normal;
  389. font-family:'times new';
  390. color:{color:tags};
  391. line-height:120%;
  392. font-size:8px;
  393. text-align:center;
  394. padding:2px;
  395. -moz-transition-duration:0.5s;
  396. -webkit-transition-duration:0.5s;
  397. -o-transition-duration:0.5s;
  398. }
  399.  
  400. .tags a {
  401. color:{color:tags};
  402. letter-spacing:0px;
  403. padding:1px;
  404. }
  405.  
  406. .tags a:hover {
  407. color:{color:link};
  408. }
  409.  
  410.  
  411. ul.chat, .chat ol, .chat li {
  412. list-style:none;
  413. margin:0px;
  414. padding:3px;
  415. }
  416.  
  417. .label {
  418. font-weight:700;
  419. margin-right:5px;
  420. }
  421.  
  422.  
  423. #credit{
  424. font-size: 8px;
  425. font-style:none;
  426. letter-spacing: 0px;
  427. float: center;
  428. position: fixed;
  429. bottom: 15px;
  430. right: 15px;
  431. text-transform:uppercase;
  432. font-family:'times new';
  433. }
  434.  
  435. #credit a{
  436. color: {color:text};
  437. padding:4px;
  438. background:{color:infobg};
  439. -moz-transition-duration:0.5s;
  440. -webkit-transition-duration:0.5s;
  441. -o-transition-duration:0.5s;
  442. }
  443.  
  444.  
  445. img {
  446. filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
  447. filter: gray; /* IE6-9 */
  448. z-index:-1;
  449. -webkit-filter: grayscale(100%); /* Google Chrome, Safari 6+ & Opera 15+ */
  450. -webkit-transition: all 0.8s ease-out;
  451. -moz-transition: all 0.8s ease-out;
  452. transition: all 0.8s ease-out;
  453.  
  454. }
  455.  
  456. img:hover {
  457. filter: none;
  458. -webkit-filter: grayscale(0);
  459. }
  460.  
  461. .html_photoset {
  462. -webkit-filter: grayscale(100%);
  463. -webkit-transition: all .25s;
  464. ...
  465. }
  466. .html_photoset:hover {
  467. -webkit-filter: grayscale(0);
  468. }
  469.  
  470.  
  471. {CustomCSS}
  472.  
  473. </style></head>
  474.  
  475. <body>
  476.  
  477. <div id="sidebarph"><img src="{image:sidebar}"></div>
  478.  
  479. <div id="sidebar">
  480. <div id="links">
  481. <a href="/">home</a>
  482. <a href="/ask">inquire</a>
  483. <a href="/submit">submit</a>
  484. <a href="{text:linkA url}">{text:linkA}</a>
  485. <a href="{text:linkB url}">{text:linkB}</a>
  486. <a href="{text:linkC url}">{text:linkC}</a>
  487. </div></div>
  488.  
  489. <div id="description">
  490. {Description}
  491. <div class="pagination">
  492. {block:Pagination}
  493. {block:PreviousPage}
  494. <a href="{PreviousPage}">fall</a>
  495. {/block:PreviousPage}
  496. {block:NextPage} -
  497. <a href="{NextPage}">rise</a>
  498. {/block:NextPage}
  499. {/block:Pagination}</div>
  500. </div>
  501.  
  502. <div id="entries">
  503.  
  504. {block:Posts}
  505.  
  506. <div id="posts">
  507.  
  508. {block:Text}{block:Title}<h2>{Title}</h2>{/block:Title}{Body}{/block:Text}
  509.  
  510. {block:Quote}<h2>“{Quote}”</h2><h1>{Source}</h1>{/block:Quote}
  511.  
  512. {block:Link}<a href="{URL}"><h2>{Name}</h2></a>
  513. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  514.  
  515. {block:Photo}<center><img src="{PhotoURL-500}"/></center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  516.  
  517. {block:Photoset}<center>{Photoset-500}</center>
  518. {block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  519.  
  520. {block:Chat}<ul class="chat">{block:Title}<h2>{Title}</h2>{/block:Title}{block:Lines}<li>{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>{/block:Chat}
  521.  
  522. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  523.  
  524. {block:Answer}<div id="ask"><div id="asker"><img src="{AskerPortraitURL-64}" style="height:30px; width:30px; float:center; margin-top:0px"><big><i><big>{Asker} asked:</big></big></i><br><br>{Question}</div></div><div id="ans">{Answer}</div>{/block:answer}
  525.  
  526. {block:Audio}{block:AudioPlayer}
  527. <div class="audiowrapper">
  528. {block:AlbumArt}
  529. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  530. {/block:AlbumArt}
  531.  
  532. <div class="playerbuttonbg">
  533. <div class="newplayerbutton">
  534. <div class="playerbuttonhug">
  535.  
  536. {AudioPlayerWhite}
  537.  
  538. </div>
  539. </div>
  540. </div>
  541.  
  542. <div class="trackdetails">
  543.  
  544. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  545. {block:Artist}Artist: {Artist}{/block:Artist}<br/>
  546. {block:Album}Album: {Album}{/block:Album}<br/>
  547. {PlayCountWithLabel}
  548.  
  549. </div>
  550. </div>
  551. {/block:AudioPlayer}
  552.  
  553. {block:Caption}{Caption}{/block:Caption}{/block:Audio}
  554.  
  555.  
  556. {block:Date}<div id="postinfo"><a href="{Permalink}">{TimeAgo}</a>{block:NoteCount} with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}{block:RebloggedFrom} via <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  557. {block:ContentSource} from <a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource}</div>{/block:Date}
  558. {block:HasTags}
  559. <div class="tags">
  560. {block:Tags}<a href="{TagURL}">#&nbsp;{Tag}</a>{/block:Tags}</div>
  561. {/block:HasTags}
  562. <div class="note">
  563. {block:PostNotes}{PostNotes}{/block:PostNotes}
  564. </div>
  565. </div>
  566. {/block:Posts}
  567.  
  568.  
  569. </div>
  570.  
  571. <div id="credit"> <a href="http://alicatofrp.tumblr.com/">queen</a></div>
  572.  
  573. </div>
  574. </div>
  575. </div>
  576. </body>
  577. </html>
Advertisement
Add Comment
Please, Sign In to add comment