Advertisement
onlysewenteen

theme #04 - radioactive

Jul 7th, 2013
34,552
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.92 KB | None | 0 0
  1. <!----
  2.  
  3. theme #04 - RADIOACTIVE by Stella (@onlysewenteen)
  4.  
  5. PLEASE abide by the following rules if you're going to use this theme:
  6.  
  7. 1. DO NOT STEAL any parts of the codes. I will recognize my own work when I see it. Also, editting and redistributing with my name attached counts as stealing.
  8. 2. KEEP MY CREDITS intact and where they are.
  9. 3. DO NOT USE THIS THEME AS A BASE CODE.
  10.  
  11. Thanks and enjoy the theme!
  12.  
  13. ---->
  14.  
  15. <html><head>
  16.  
  17. <!-- DEFAULT VARIABLES -->
  18. <meta name="color:background" content="#ffffff" />
  19. <meta name="color:sidebar" content="#151515" />
  20. <meta name="color:sidebar text" content="#cccccc" />
  21. <meta name="color:sidebar bold" content="#999999" />
  22. <meta name="color:sidebar links" content="#c4d5be">
  23. <meta name="color:navbar" content="#ecf1f2" />
  24. <meta name="color:nav" content="#151515" />
  25. <meta name="color:title" content="#7a4848" />
  26. <meta name="color:text" content="#888888" />
  27. <meta name="color:link" content="#af8d77" />
  28.  
  29. <meta name="image:background" content="" />
  30. <meta name="image:sidebar" content="" />
  31. <meta name="image:navbar" content="" />
  32.  
  33. <meta name="if:lowercase tags" content="1" />
  34. <meta name="if:bigger tags" content="" />
  35.  
  36. <meta name="text:link1" content="" />
  37. <meta name="text:link1 title" content="" />
  38. <meta name="text:link2" content="" />
  39. <meta name="text:link2 title" content="" />
  40. <meta name="text:link3" content="" />
  41. <meta name="text:link3 title" content="" />
  42. <meta name="text:link4" content="" />
  43. <meta name="text:link4 title" content="" />
  44. <meta name="text:link5" content="" />
  45. <meta name="text:link5 title" content="" />
  46. <meta name="text:link6" content="" />
  47. <meta name="text:link6 title" content="" />
  48.  
  49. <meta name="text:title top margin" content="100" />
  50. <meta name="text:title one" content="all systems go" />
  51. <meta name="text:title two" content="the sun hasn't died" />
  52.  
  53. <title>{Title}</title>
  54.  
  55. <link rel="shortcut icon" href="{Favicon}">
  56. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  57. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  58.  
  59. <link href='http://fonts.googleapis.com/css?family=Dawning+of+a+New+Day' rel='stylesheet' type='text/css'>
  60.  
  61. <link href='http://fonts.googleapis.com/css?family=Marck+Script' rel='stylesheet' type='text/css'>
  62.  
  63. <script type="text/javascript" src="http://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script>
  64.  
  65. <style type="text/css">
  66.  
  67. /* -- GENERAL THINGS -- */
  68.  
  69. body {
  70. color:{color:text};
  71. text-align:justify;
  72. font:10px cambria;
  73. background-color:{color:background};
  74. background-image:url('{image:background}');
  75. background-attachment:fixed}
  76.  
  77. a {
  78. color:{color:link};
  79. text-decoration:none}
  80.  
  81. a:hover {
  82. color:{color:text};
  83. border-bottom:1px solid {color:link}}
  84.  
  85. b, strong {color:{color:title}}
  86. i, em {color:{color:text}}
  87. p {margin-top:5px; margin-bottom:5px}
  88.  
  89. blockquote {
  90. border-left:2px solid {color:text};
  91. padding-left:5px;
  92. margin:0px 4px 0px 10px}
  93.  
  94. /* -- SIDEBAR ELEMENTS -- */
  95.  
  96. #sidebar {
  97. float:left;
  98. top:0;
  99. left:245px;
  100. position:fixed;
  101. width:170px;
  102. height:100%;
  103. background-color:{color:sidebar}}
  104.  
  105. .sbarimg {
  106. margin-bottom:10px;
  107. margin-top:80px}
  108.  
  109. .sbarimg img {
  110. max-width:120px;
  111. height:auto;
  112. -moz-border-radius:120px;
  113. -webkit-border-radius:120px}
  114.  
  115. #sbartext {
  116. font:10px cambria;
  117. color:{color:sidebar text};
  118. text-align:justify;
  119. margin:0px 20px}
  120.  
  121. #sbartext a {
  122. color:{color:sidebar links};
  123. text-decoration:none}
  124.  
  125. #sbartext a:hover {
  126. color:{color:sidebar text};
  127. border-bottom:1px solid {color:sidebar links}}
  128.  
  129. #sbartext i, em {
  130. color:{color:sidebar text}}
  131.  
  132. #sbartext b, strong {
  133. color:{color:sidebar bold}}
  134.  
  135. .pagination {
  136. text-align:center}
  137.  
  138. .pagination a {
  139. display:inline-block;
  140. color:{color:sidebar text};
  141. font:10px cambria;
  142. text-transform:lowercase}
  143.  
  144. .pagination a:hover {
  145. color:{color:sidebar text};
  146. border-bottom:1px solid {color:sidebar link}}
  147.  
  148. /* -- NAVIGATION -- */
  149.  
  150. #navbar {
  151. float:left;
  152. top:0;
  153. left:0;
  154. position:fixed;
  155. width:245px;
  156. height:100%;
  157. overflow:hidden;
  158. background-color:{color:navbar};
  159. background-image:url('{image:navbar}');
  160. background-attachment:fixed;
  161. background-size:245px auto;
  162. background-position:bottom left;
  163. background-repeat:no-repeat}
  164.  
  165. #ntitle {
  166. text-align:center;
  167. font-family:'Dawning of a New Day';
  168. font-size:20px;
  169. color:{color:title};
  170. margin-top:{text:title top margin}px}
  171.  
  172. #nsub {
  173. text-align:center;
  174. font:10px cambria;
  175. color:{color:text};
  176. margin-top:-8px;
  177. margin-bottom:10px;
  178. letter-spacing:1px}
  179.  
  180. #nav {
  181. text-align:center}
  182.  
  183. #nav a {
  184. display:inline-block;
  185. width:150px;
  186. background-color:{color:nav};
  187. padding:3px 0;
  188. margin-bottom:4px;
  189. color:{color:sidebar links};
  190. font:9px georgia;
  191. font-style:italic;
  192. letter-spacing:1px;
  193. text-transform:lowercase;
  194. -webkit-transition: all 0.5s ease-out;
  195. -moz-transition: all 0.5s ease-out;
  196. transition: all 0.5s ease-out}
  197.  
  198. #nav a:hover {
  199. border:none;
  200. opacity:0.5;
  201. letter-spacing:2px;
  202. -webkit-transition: all 0.5s ease-out;
  203. -moz-transition: all 0.5s ease-out;
  204. transition: all 0.5s ease-out}
  205.  
  206. /* -- ENTRIES -- */
  207.  
  208. #entries {
  209. position:absolute;
  210. width:500px;
  211. margin-left:470px;
  212. margin-top:20px}
  213.  
  214. #posts {
  215. background-color:transparent;
  216. margin-bottom:60px}
  217.  
  218. #posts b, strong {color:{color:title}}
  219. #posts i, em {color:{color:text}}
  220.  
  221. #title1 {
  222. font:14px cambria;
  223. color:{color:title};
  224. font-style:italic;
  225. text-align:center}
  226.  
  227. #title2 {
  228. font:14px cambria;
  229. color:{color:title};
  230. font-style:italic}
  231.  
  232. .consource {
  233. display:none}
  234.  
  235. /* -- INFO AND STUFF -- */
  236.  
  237. #notess {
  238. width:70px;
  239. padding:3px;
  240. background-color:{color:sidebar};
  241. font:9px cambria;
  242. text-align:center;
  243. margin-top:15px}
  244.  
  245. #notess a {
  246. color:{color:sidebar text}}
  247.  
  248. #notess a:hover {
  249. border:none;
  250. letter-spacing:1px}
  251.  
  252. #info {
  253. width:414px;
  254. margin-top:-16px;
  255. margin-left:76px;
  256. padding:3px 0 2px 10px;
  257. background:transparent;
  258. color:{color:text};
  259. font:9px cambria;
  260. line-height:120%;
  261. text-align:left;
  262. letter-spacing:1px;
  263. text-transform:uppercase;
  264. border-bottom:1px solid {color:sidebar}
  265. }
  266.  
  267. #info a {color:{color:text}}
  268. #info a:hover {color:{color:text}}
  269.  
  270. #tags {
  271. width:500px;
  272. background:transparent;
  273. margin-top:5px;
  274. color:{color:text};
  275. font:{block:ifnotbiggertags}9px{/block:ifnotbiggertags}{block:ifbiggertags}10px{/block:ifbiggertags} cambria;
  276. {block:iflowercasetags}text-transform:lowercase;{/block:iflowercasetags}
  277. text-align:center;
  278. letter-spacing:1px
  279. }
  280.  
  281. #tags a {color:{color:link}}
  282. #tags a:hover {color:{color:text}}
  283. .num {color:{color:text}}
  284.  
  285. /* -- POST SPECIFICS -- */
  286.  
  287. .user_1 .label {color:{color:link}; text-transform:uppercase; font-weight:bold}
  288. .user_2 .label {color:{color:title}; text-transform:uppercase; font-weight:bold}
  289. .user_3 .label {color:{color:link}; text-transform:uppercase; font-weight:bold}
  290. .user_4 .label {color:{color:title}; text-transform:uppercase; font-weight:bold}
  291. .user_5 .label {color:{color:link}; text-transform:uppercase; font-weight:bold}
  292. .user_6 .label {color:{color:title}; text-transform:uppercase; font-weight:bold}
  293. .user_7 .label {color:{color:link}; text-transform:uppercase; font-weight:bold}
  294. .user_8 .label {color:{color:title}; text-transform:uppercase; font-weight:bold}
  295. .user_9 .label {color:{color:link}; text-transform:uppercase; font-weight:bold}
  296. .user_10 .label {color:{color:title}; text-transform:uppercase; font-weight:bold}
  297.  
  298. ul.chat, .chat ol, .chat li {list-style:none; margin:0px; padding:4px}
  299.  
  300. #asks {
  301. text-align:justify;
  302. padding:5px 5px 5px 8px;
  303. background-color:transparent;
  304. border-left:1px dotted {color:sidebar};
  305. min-height:50px;
  306. margin-left:60px}
  307.  
  308. .asker {
  309. margin-bottom:-8px;
  310. font-size:12px;
  311. letter-spacing:1px;
  312. font-style:italic}
  313.  
  314. #answers {
  315. margin-top:8px}
  316.  
  317. #audios {
  318. width:100%;
  319. height:80px;
  320. margin-bottom:10px}
  321.  
  322. .albumart {
  323. float:left;
  324. width:80px;
  325. height:80px}
  326.  
  327. .player {
  328. display:block;
  329. height:80px;
  330. width:80px;
  331. overflow:hidden;
  332. position:absolute;
  333. opacity:0.3;
  334. background:#fff;
  335. -webkit-transition:all 0.4s ease-in-out;
  336. -moz-transition:all 0.4s ease-in-out;
  337. -o-transition:all 0.4s ease-in-out;
  338. -ms-transition: all 0.4s ease-in-out;
  339. transition:all 0.5s ease-in-out}
  340.  
  341. .player:hover {
  342. opacity:0.7;
  343. -webkit-transition:all 0.4s ease-in-out;
  344. -moz-transition:all 0.4s ease-in-out;
  345. -o-transition:all 0.4s ease-in-out;
  346. -ms-transition: all 0.4s ease-in-out;
  347. transition:all 0.5s ease-in-out}
  348.  
  349. .audioplayer {
  350. width:24px;
  351. height:24px;
  352. margin:26px 0 0 26px;
  353. overflow:hidden}
  354.  
  355. .audioinfo {
  356. margin-left:80px;
  357. height:54px;
  358. line-height:150%;
  359. font:12px cambria;
  360. background-color:{color:sidebar};
  361. color:{color:sidebar text};
  362. padding:16px 10px 10px 10px;
  363. text-align:center}
  364.  
  365. #source {
  366. margin-top:3px;
  367. text-align:right;
  368. margin-bottom:5px;
  369. font-size:10px}
  370.  
  371. div#qTip {
  372. display:none;
  373. text-align:center;
  374. position:absolute;
  375. letter-spacing:1px;
  376. text-transform:uppercase;
  377. z-index:5;
  378. font:8px cambria;
  379. padding:5px 3px 2px 3px;
  380. color:{color:text};
  381. background:{color:background};
  382. border:1px solid {color:link}}
  383.  
  384. /* -- DON'T TOUCH THIS -- */
  385.  
  386. #cred a {position:fixed;
  387. font:14px Marck Script;
  388. background-color:transparent;
  389. border:1px dotted {color:sidebar};
  390. color:{color:link};
  391. padding:5px;
  392. bottom:20px;
  393. right:20px}
  394.  
  395. #cred a:hover {
  396. color:{color:text}}
  397.  
  398. </style>
  399. </head>
  400.  
  401. <body>
  402.  
  403. <div id="navbar">
  404. <div id="nav">
  405. <div id="ntitle">{text:title one}</div>
  406. <div id="nsub">{text:title two}</div>
  407. <a href="/">index</a><br>
  408. <a href="/ask">message</a><br>
  409. {block:iflink1}<a href="{text:link1}">{text:link1 title}</a><br>{/block:iflink1}
  410. {block:iflink2}<a href="{text:link2}">{text:link2 title}</a><br>{/block:iflink2}
  411. {block:iflink3}<a href="{text:link3}">{text:link3 title}</a><br>{/block:iflink3}
  412. {block:iflink4}<a href="{text:link4}">{text:link4 title}</a><br>{/block:ifLink4}
  413. {block:iflink5}<a href="{text:link5}">{text:link5 title}</a><br>{/block:ifLink5}
  414. {block:iflink6}<a href="{text:link6}">{text:link6 title}</a><br>{/block:ifLink6}</div>
  415. </div>
  416.  
  417. <div id="sidebar">
  418. <div class="sbarimg" align="center"><img src="{image:sidebar}" /></div>
  419. <div id="sbartext">{block:Description}{Description}{/block:Description}</div><br>
  420. <div class="pagination">{block:Pagination}
  421. {block:PreviousPage}<a href="{PreviousPage}">&larr;</a>&nbsp;&nbsp;&nbsp;{/block:PreviousPage}{block:NextPage}<a href="{NextPage}">&rarr;</a>{/block:NextPage}
  422. {/block:Pagination}</div>
  423. </div>
  424.  
  425. <div id="entries">{block:Posts}<div id="posts">
  426.  
  427. {block:Quote}
  428. <div id="title2">❝ {Quote}</div>
  429. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  430. {/block:Quote}
  431.  
  432. {block:Title}<div id="title1">{Title}</div>{/block:Title}
  433. {block:Text}{Body}{/block:Text}
  434.  
  435. {block:Link}
  436. <div id="title1"><a href="{URL}" class="link" {Target}>→ {Name}</a></div>
  437. {block:Description}<div class="description">{Description}</div>{/block:Description}
  438. {/block:Link}
  439.  
  440. {block:Photo}
  441. <center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>
  442. {block:Caption}{Caption}{/block:Caption}
  443. {/block:Photo}
  444.  
  445. {block:Photoset}
  446. <center>{Photoset-500}</center>
  447. {block:Caption}{Caption}{/block:Caption}
  448. {/block:Photoset}
  449.  
  450. {block:Chat}
  451. <ul class="chat">{block:Lines}<li class="user_{UserNumber}">
  452. {block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>
  453. {/block:Chat}
  454.  
  455. {block:Video}
  456. {Video-500}
  457. {block:Caption}{Caption}{/block:Caption}
  458. {/block:Video}
  459.  
  460. {block:Answer}
  461. <img src="{AskerPortraitURL-64}" style="height:50px; width:50px; float:left; margin-top:5px">
  462. <div id="asks"><div class="asker">{Asker} inquired:</div>
  463. <br>{Question}</div>
  464. <div id="answers">{Answer}</div>
  465. {/block:Answer}
  466.  
  467. {block:Audio}
  468. <div id="audios">
  469. <div class="player"><div class="audioplayer">{AudioPlayerWhite}</div></div>
  470. <div class="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="80">{/block:AlbumArt}</div>
  471. <div class="audioinfo">
  472. <big>{block:TrackName}{TrackName}{/block:TrackName}</big><br>
  473. {block:Artist}<small>by</small> {Artist}{/block:Artist} {block:Album}<small>on</small> {Album}{/block:Album}<br>
  474. <small>{FormattedPlayCount} plays</small></div></div>
  475. {block:Caption}{Caption}{/block:Caption}
  476. {/block:Audio}
  477.  
  478. <div id="notess">
  479. <a href="{Permalink}">&hearts; {FormattedNoteCount}</a>
  480. </div>
  481. <div id="info">
  482. {block:Date}{DayofMonthWithZero} {ShortMonth} {ShortYear} @ {12Hour}:{Minutes} {AMPM}{/block:Date}&nbsp;&nbsp{block:RebloggedFrom}&mdash;&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> + <a href="{ReblogRootURL}" title="{ReblogRootName}">org</a>&nbsp;&nbsp;{/block:RebloggedFrom}&mdash;&nbsp;&nbsp;<a href="{ReblogURL}"target="_blank" title="reblog this post">reblog</a>
  483. </div>
  484.  
  485. {block:HasTags}<div id="tags">
  486. {block:Tags}<a href="/tagged/{Tag}"><span class="num">#</span>{Tag}</a>&nbsp;&nbsp;{/block:Tags}
  487. </div>{/block:HasTags}
  488.  
  489. {block:ContentSource}
  490. <div class="consource"><a href="{SourceURL}">source</a></div>
  491. {/block:ContentSource}
  492.  
  493. </div>
  494.  
  495. {/block:posts}{block:PostNotes}{PostNotes}{/block:PostNotes}
  496.  
  497. </div>
  498. </div>
  499.  
  500. <div id="cred"><a href="http://onlysewenthemes.tumblr.com/" title="theme">OS</a></div>
  501.  
  502. </body>
  503. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement