ameliasdreams

theme 21 - aria

May 18th, 2014
2,003
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.10 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <!---
  6.  
  7. aria (theme #21) by melodypcnd(.tumblr.com)
  8.  
  9. - do not remove the credit or edit it
  10. - do not remove it and put the credit on another page
  11. - do not steal or claim this as your own
  12. - do not use this as a base code
  13. - and lastly, don't take parts of the code, as that it also stealing
  14.  
  15. but please like or reblog the post! :) enjoy the theme! <3
  16.  
  17. --->
  18.  
  19. <head>
  20.  
  21. <title>{Title}</title>
  22.  
  23. <link rel="shortcut icon" href="{Favicon}">
  24.  
  25. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  26.  
  27. {block:Description}
  28. <meta name="description" content="{MetaDescription}"/>
  29. {/block:Description}
  30.  
  31. <meta name="text:Link1" content="" />
  32. <meta name="text:Link1 URL" content="" />
  33.  
  34. <meta name="text:Link2" content="" />
  35. <meta name="text:Link2 URL" content="" />
  36.  
  37. <meta name="text:Link3" content="" />
  38. <meta name="text:Link3 URL" content="" />
  39.  
  40. <meta name="text:Link4" content="" />
  41. <meta name="text:Link4 URL" content="" />
  42.  
  43. <meta name="image:Sidebar" content="" />
  44. <meta name="color:SidebarBG" content="#f4f4f4" />
  45.  
  46. <meta name="color:Title" content="#000000" />
  47. <meta name="color:Text" content="#000000" />
  48. <meta name="color:Link" content="#000000" />
  49. <meta name="color:LinkHover" content="#000000" />
  50.  
  51.  
  52.  
  53. <style type="text/css">
  54.  
  55. ::-webkit-scrollbar {width:8px; height:auto; background-color:#f4f4f4;}
  56.  
  57. ::-webkit-scrollbar-thumb {background-color:#ddd;}
  58.  
  59. ::selection {background-color:{color:TextSelect};}
  60. ::-moz-selection {background-color:{color:TextSelect};}
  61.  
  62. body {
  63. font-family:calibri light, sans-serif;
  64. font-size:9px;
  65. font-style:none;
  66. letter-spacing:1.2px;
  67. line-height:100%;
  68. color:{color:Text};
  69. background-color:#fff;
  70. margin-top:-10px;
  71. margin-left:-10px;
  72. }
  73.  
  74. blockquote {border-left:1px solid {color:Text}; padding-left:10px; margin-left:20px;}
  75.  
  76. a {color:{color:Link}; text-decoration:none;}
  77. a:hover {color:{color:LinkHover};}
  78.  
  79.  
  80. img {max-height:100%; max-width:100%;}
  81.  
  82. h1 {
  83. font-size:11px;
  84. line-height:20px;
  85. text-transform:uppercase;
  86. }
  87.  
  88. #sidebar {
  89. width:325px;
  90. height:100%;
  91. margin-left:0px;
  92. margin-top:0px;
  93. background-color:{color:SidebarBG};
  94. border-right:1px solid #eee;
  95. position:fixed;
  96. text-align:center;
  97. padding-bottom:10px;
  98. }
  99.  
  100. #sidebar img {
  101. width:110px;
  102. height:110px;
  103. padding:10px;
  104. background-color:#fff;
  105. border:1px solid #eee;
  106. margin-bottom:10px;
  107. -webkit-transition-duration:0.5s;
  108. -moz-transition-duration:0.5s;
  109. -o-transition-duration:0.5s;
  110. }
  111.  
  112. #sidebar img:hover {
  113. opacity:0.8;
  114. -webkit-transition-duration:0.35s;
  115. -moz-transition-duration:0.35s;
  116. -o-transition-duration:0.35s;
  117. }
  118.  
  119. #title {
  120. font-family:calibri;
  121. font-size:18px;
  122. font-style:italic;
  123. color:{color:Title};
  124. text-transform:lowercase;
  125. letter-spacing:2px;
  126. margin-top:175px;
  127. padding:10px;
  128. }
  129.  
  130. #desc {
  131. font-family:calibri light;
  132. font-size:10px;
  133. letter-spacing:1.5px;
  134. line-height:125%;
  135. padding:5px;
  136. width:120px;
  137. text-align:center;
  138. margin:auto;
  139. background-color:#fff;
  140. border-top:1px solid #eee;
  141. border-bottom:1px solid #eee;
  142. }
  143.  
  144. #links {
  145. width:138px;
  146. position:fixed;
  147. position:absolute;
  148. font-family:calibri;
  149. font-size:10px;
  150. font-style:italic;
  151. text-transform:lowercase;
  152. text-align:left;
  153. letter-spacing:2px;
  154. margin-top:10px;
  155. margin-left:97px;
  156. }
  157.  
  158. #links a {
  159. width:50px;
  160. margin-right:3px;
  161. margin-bottom:8px;
  162. padding:8px 5px;
  163. background-color:#fff;
  164. border-bottom:1px solid #e4e4e4;
  165. display:inline-block;
  166. text-align:center;
  167. overflow:hidden;
  168. -webkit-transition-duration:0.5s;
  169. -moz-transition-duration:0.5s;
  170. -o-transition-duration:0.5s;
  171. }
  172.  
  173. #links a:hover {
  174. background-color:#000;
  175. color:#fff;
  176. -webkit-transition-duration:0.35s;
  177. -moz-transition-duration:0.35s;
  178. -o-transition-duration:0.35s;
  179. }
  180.  
  181. #entry {
  182. width:500px;
  183. margin-left:375px;
  184. margin-top:25px;
  185. position:absolute;
  186. text-align:center;
  187. }
  188.  
  189. #post {
  190. width:500px;
  191. margin-bottom:50px;
  192. font-style:none;
  193. padding:10px;
  194. border:1px solid #eee;
  195. background-color:#fff;
  196. }
  197.  
  198. .cap {
  199. padding:5px;
  200. text-align:left;
  201. }
  202.  
  203. #quote {
  204. font-size:15px;
  205. font-style:italic;
  206. line-height:100%;
  207. text-align:left;
  208. text-transform:none;
  209. }
  210.  
  211. #chat {
  212. text-align:left;
  213. }
  214.  
  215. .line {
  216. border-bottom:1px solid #eee;
  217. padding-bottom:7px;
  218. }
  219.  
  220. .newplayerbutton {
  221. position:relative;
  222. width:28px;
  223. height:27px;
  224. overflow:hidden;
  225. }
  226.  
  227. .playerbuttonhug {
  228. position:absolute;
  229. top:-11px;
  230. left:-12px;
  231. }
  232.  
  233. .tumblr_audio_player {
  234. border:none;
  235. padding:0px;
  236. margin:0px;
  237. height:50px;
  238. width:500px;
  239. padding-left:12.5px;
  240. }
  241.  
  242. .playerbuttonbg {
  243. position:absolute;
  244. left:20px;
  245. top:20px;
  246. width:28px;
  247. height:28px;
  248. background-color:#ffffff;
  249. border:1px solid #eee;
  250. padding:10px;
  251. opacity:.4;
  252. filter:alpha(opacity=40);
  253. -moz-opacity:0.4;
  254. -khtml-opacity:0.4;
  255. transition:opacity .7s ease-in-out;
  256. -moz-transition:opacity .7s ease-in-out;
  257. -webkit-transition:opacity .7s ease-in-out;
  258. }
  259.  
  260. .playerbuttonbg:hover {
  261. opacity:1;
  262. filter:alpha(opacity=100);
  263. -moz-opacity:1;
  264. -khtml-opacity:1;
  265. }
  266.  
  267. .audioimgwrapper {
  268. position:absolute;
  269. left:0px;
  270. top:0px;
  271. -webkit-border-radius:50px;
  272. -moz-border-radius:50px;
  273. border-radius:50px;
  274. overflow:hidden;
  275. width:88px;
  276. height:88px;
  277. }
  278.  
  279. .audioimgwrapper img {
  280. width:100%;
  281. height:auto;
  282. -webkit-border-radius:50px;
  283. -moz-border-radius:50px;
  284. border-radius:50px;
  285. opacity:0;
  286. }
  287.  
  288. .trackdetails {
  289. width:auto;
  290. display:inline-block;
  291. margin-left:100px;
  292. min-height:85px;
  293. text-transform:uppercase;
  294. letter-spacing:1px;
  295. line-height:125%;
  296. font-size:10px;
  297. }
  298.  
  299. .audiowrapper {
  300. position:relative;
  301. display:block;
  302. background-color:#f1f1f1;
  303. border:1px solid #eee;
  304. padding:2px;
  305. }
  306.  
  307. #q {
  308. padding:10px;
  309. font-size:10px;
  310. letter-spacing:1px;
  311. line-height:150%;
  312. border-bottom:1px solid #eee;
  313. }
  314.  
  315. #info {
  316. margin-top:5px;
  317. padding-top:3px;
  318. padding-left:5px;
  319. font-size:8px;
  320. font-style:none;
  321. text-align:left;
  322. text-transform:lowercase;
  323. color:{color:Link};
  324. line-height:150%;
  325. border-top:1px solid #eee;
  326. }
  327.  
  328. .notecont {
  329. width:500px;
  330. font-size:8px;
  331. letter-spacing:1px;
  332. word-spacing:5px;
  333. text-transform:lowercase;
  334. text-align:left;
  335. }
  336.  
  337. .notecont li {
  338. list-style-type:circle;
  339. line-height:275%;
  340. }
  341.  
  342. .notecont img {
  343. display:none;
  344. }
  345.  
  346. #pagi {
  347. padding-top:3px;
  348. text-transform:uppercase;
  349. }
  350.  
  351. #pagi a {
  352. padding:5px 10px;
  353. letter-spacing:4px;
  354. margin-left:-3px;
  355. margin-right:-3px;
  356. border-top:1px dotted #eee;
  357. }
  358.  
  359. .current_page {
  360. border-top:1px dotted #000;
  361. padding:5px 10px;
  362. }
  363.  
  364. #poop {
  365. font-size:8px;
  366. font-family:calibri, sans-serif;
  367. letter-spacing:2px;
  368. }
  369.  
  370. #poop a {
  371. position:fixed;
  372. width:20px;
  373. padding-top:4px;
  374. padding-bottom:4px;
  375. bottom:5px;
  376. right:5px;
  377. text-align:center;
  378. box-align:center;
  379. text-transform:none;
  380. color:#777;
  381. background-color:#eee;
  382. border:3px double #fff;
  383. }
  384.  
  385. {CustomCSS}</style></head><body>
  386.  
  387. <div id="sidebar">
  388. <div id="title">{Title}</div>
  389. <img src="{image:Sidebar}">
  390. <div id="desc">{Description}</div>
  391. <div id="links">
  392. <a href="{text:Link1 URL}">{text:Link1}</a>&nbsp;
  393. <a href="{text:Link2 URL}">{text:Link2}</a>
  394. <a href="{text:Link3 URL}">{text:Link3}</a>&nbsp;
  395. <a href="{text:Link4 URL}">{text:Link4}</a>
  396. </div>
  397. </div>
  398.  
  399. <div id="entry">
  400. {block:Posts}
  401. <div id="post">
  402.  
  403. {block:Text}
  404. <h1>
  405. {block:Title}
  406. {Title}
  407. {/block:Title}
  408. </h1>
  409. <div class="cap">{Body}</div>
  410. {/block:Text}
  411.  
  412. {block:blockquote}
  413. {/block:blockquote}
  414.  
  415. {block:Photo}
  416. <center>
  417. {LinkOpenTag}
  418. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  419. {LinkCloseTag}
  420. </center>
  421. {/block:Photo}
  422.  
  423. {block:Photoset}
  424. {Photoset-500}
  425. {/block:Photoset}
  426.  
  427. {block:Quote}
  428. <div id="quote">❝{Quote}❞</div><p>
  429. {block:Source}
  430. <div id="src">—{Source}</div>
  431. {/block:Source}
  432. {/block:Quote}
  433.  
  434. {block:Link}
  435. <h1>
  436. <a href="{URL}"{Target}>{Name}</a>
  437. </h1>
  438. {block:Description}
  439. <div class="cap">{Description}</div>
  440. {/block:Description}
  441. {/block:Link}
  442.  
  443. {block:Chat}
  444. <div id="chat">
  445. {block:Title}
  446. <h1>
  447. {Title}
  448. </h1>
  449. {/block:Title}
  450. {block:Lines}
  451. {block:Label}
  452. <div class="line">
  453. <b>{Label}</b>
  454. {/block:Label}
  455. {Line}
  456. </div><br>
  457. {/block:Lines}
  458. </div>
  459. {/block:Chat}
  460.  
  461. {block:AudioPlayer}
  462. <div class="audiowrapper">
  463. {block:AlbumArt}
  464. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  465. {/block:AlbumArt}
  466. <div class="playerbuttonbg">
  467. <div class="newplayerbutton">
  468. <div class="playerbuttonhug">
  469. {AudioPlayerWhite}
  470. </div></div></div>
  471. <div class="trackdetails"><br><br>
  472. {block:TrackName}{TrackName}{/block:TrackName}<br>
  473. {block:Artist}{Artist}{/block:Artist}<br>
  474. {PlayCountWithLabel}
  475. </div></div>
  476. {/block:AudioPlayer}
  477.  
  478. {block:Video}
  479. {Video-500}
  480. {block:Caption}
  481. <div class="cap">{Caption}</div>
  482. {/block:Caption}
  483. {/block:Video}
  484.  
  485. {block:Answer}
  486. <div id="q">
  487. <a href="{askerURL}"><b>{Asker}:</b></a><br>
  488. {Question}
  489. </div>
  490. <div class="cap">{Answer}</div>
  491. {/block:answer}
  492.  
  493. {block:Caption}
  494. <div class="cap">{Caption}</div>
  495. {/block:Caption}
  496.  
  497. <div id="info">
  498. {block:Date}
  499. <a href="{Permalink}">{MonthNumberWithZero}-{DayOfMonthWithZero}-{ShortYear}</a>
  500. {/block:Date}
  501. {block:NoteCount}
  502. &nbsp;/&nbsp; <a href="{Permalink}">+{NoteCount}</a>
  503. {/block:NoteCount}
  504. {block:RebloggedFrom}
  505. &nbsp;/&nbsp; <a href="{ReblogParentURL}">via</a>
  506. {/block:RebloggedFrom}
  507. {block:ContentSource}
  508. &nbsp;/&nbsp; <a href="{SourceURL}">src</a>
  509. {/block:ContentSource}
  510. <br>
  511. <div class="tags">
  512. {block:HasTags}
  513. {block:Tags}
  514. <a href="{TagURL}">#{Tag}</a>&nbsp;
  515. {/block:Tags}
  516. {/block:HasTags}
  517. </div>
  518. </div>
  519.  
  520. {block:PostNotes}
  521. <div class="notecont">
  522. {PostNotes}
  523. </div>
  524. {/block:PostNotes}
  525. </div>
  526. {/block:Posts}
  527.  
  528. <div id="post">
  529. <div id="pagi">
  530. {block:Pagination}
  531. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">prev</a>{/block:PreviousPage}
  532. {block:JumpPagination length="10"}
  533. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  534. {block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  535. {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}
  536. {/block:Pagination}
  537. </div>
  538. </div>
  539.  
  540. <div id="poop">
  541. <a href="http://melodypcnd.tumblr.com/">mk</a>
  542. </div>
  543.  
  544. </body>
  545.  
  546. </html>
Advertisement
Add Comment
Please, Sign In to add comment