Advertisement
harreyeh

theme 06: ella

Feb 1st, 2014
838
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.47 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4.  
  5. ᴛʜᴇᴍᴇ 06 ʙʏ ʜᴀʀᴅᴢɪᴀᴍ
  6. please don't take off the credit it's really small!!!!
  7.  
  8.  
  9. ╭━━━━┳╮╱╭┳━━━┳━╮╭━┳━━━┳━━━╮ ╭━━┳╮╱╱╭╮
  10. ┃╭╮╭╮┃┃╱┃┃╭━━┫┃╰╯┃┃╭━━┫╭━╮┃ ┃╭╮┃╰╮╭╯┃
  11. ╰╯┃┃╰┫╰━╯┃╰━━┫╭╮╭╮┃╰━━┫╰━━╮ ┃╰╯╰╮╰╯╭╯
  12. ╱╱┃┃╱┃╭━╮┃╭━━┫┃┃┃┃┃╭━━┻━━╮┃ ┃╭━╮┣╮╭╯
  13. ╱╱┃┃╱┃┃╱┃┃╰━━┫┃┃┃┃┃╰━━┫╰━╯┃ ┃╰━╯┃┃┃
  14. ╱╱╰╯╱╰╯╱╰┻━━━┻╯╰╯╰┻━━━┻━━━╯ ╰━━━╯╰╯
  15. ╭╮╱╭┳━━━┳━━━┳━━━┳━━━━┳━━┳━━━┳━╮╭━╮
  16. ┃┃╱┃┃╭━╮┃╭━╮┣╮╭╮┣━━╮━┣┫┣┫╭━╮┃┃╰╯┃┃
  17. ┃╰━╯┃┃╱┃┃╰━╯┃┃┃┃┃╱╭╯╭╯┃┃┃┃╱┃┃╭╮╭╮┃
  18. ┃╭━╮┃╰━╯┃╭╮╭╯┃┃┃┃╭╯╭╯╱┃┃┃╰━╯┃┃┃┃┃┃
  19. ┃┃╱┃┃╭━╮┃┃┃╰┳╯╰╯┣╯━╰━┳┫┣┫╭━╮┃┃┃┃┃┃
  20. ╰╯╱╰┻╯╱╰┻╯╰━┻━━━┻━━━━┻━━┻╯╱╰┻╯╰╯╰╯
  21.  
  22.  
  23. hardziam.tumblr.com // themesbyzsu.tumblr.com
  24.  
  25.  
  26.  
  27. -->
  28.  
  29. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  30.  
  31. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  32.  
  33. <head>
  34.  
  35. <title>{Title}</title>
  36. <link rel="shortcut icon" href="{Favicon}">
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  38.  
  39.  
  40. <meta name="color:background" content="#fff" />
  41. <meta name="color:text" content="#6783a2" />
  42. <meta name="color:link" content="#8d8c8d" />
  43. <meta name="color:linkhovercolor" content="#c48e8e" />
  44. <meta name="color:borders" content="#f1f1f1" />
  45. <meta name="color:info color" content="#000" />
  46. <meta name="image:sidebar" content="" />
  47. <meta name="image:background" content="" />
  48. <meta name="text:Link1" content="/" />
  49. <meta name="text:Link1 Title" content="link" />
  50. <meta name="text:Link2" content="/" />
  51. <meta name="text:Link2 Title" content="link" />
  52. <meta name="text:Link3" content="/" />
  53. <meta name="text:Link3 Title" content="link" />
  54. <meta name="text:Link4" content="/" />
  55. <meta name="text:Link4 Title" content="link" />
  56. <meta name="text:Link5" content="/" />
  57. <meta name="text:Link5 Title" content="link" />
  58. <meta name="if:Navi Links Effect" content="0"/>
  59.  
  60.  
  61. <style>
  62. @font-face {font-family:Kawaii Food Font; src: url(http://static.tumblr.com/ssqfxic/Tjmn085y1/kawaii_food_font.ttf);}
  63.  
  64. </style>
  65.  
  66. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  67.  
  68. <style>
  69. div#qTip {
  70. padding: 3px;
  71. display:none;
  72. text-align: center;
  73. position: absolute;
  74. font-style:italic;
  75. font-size:9px;
  76. line-height:9px;
  77. font-family:calibri;
  78. margin-left:-90px;
  79. z-index: 1000;
  80. border: 1px solid {color:borders};
  81. border-radius:10%;
  82. box-shadow:2px 2px;
  83. background-color:{color:background};
  84. color: {color:text};
  85. letter-spacing: 1px;
  86. }
  87. </style>
  88.  
  89. <style type="text/css">
  90.  
  91. body {
  92. background: {color:background};
  93. background-image: url('{image:background}');
  94. margin-left: 100px;
  95. padding: 0;
  96. position:absolute;
  97. font-family: calibri;
  98. }
  99.  
  100. a {
  101. text-decoration:none;
  102. outline:none;
  103. -moz-outline-style:none;
  104. color:{color:link};
  105. -webkit-transition: all 0.5s ease-in-out;
  106. -moz-transition: all 0.5s ease-in-out;
  107. -o-transition: all 0.5s ease-in-out;
  108. }
  109.  
  110. a:hover {
  111. color:{color:linkhovercolor};
  112. -webkit-transition: all 0.5s ease-in-out;
  113. -moz-transition: all 0.5s ease-in-out;
  114. -o-transition: all 0.5s ease-in-out;
  115. }
  116.  
  117. h1 {
  118. font-family:tahoma;
  119. text-transform:lowercase;
  120. }
  121.  
  122. h2 {
  123. font-family:tahoma;
  124. text-transform:uppercase;
  125. padding:5px;
  126. background:#f1f1f1;
  127. }
  128.  
  129. h3 {
  130. font-size:15px;
  131. color:black;
  132. }
  133.  
  134.  
  135. #title {
  136. font-family:calibri;
  137. color:black;
  138. font-size:12px;
  139. margin-top:-5px;
  140. width:200px;
  141. margin-left:-20px;
  142. padding:10px;
  143. opacity:1;
  144. font-style:italic;
  145. background:{color:background};
  146. border:1px solid {color:borders};
  147. text-align:center;
  148. text-decoration:none;
  149. -webkit-transition: all 0.5s ease-in-out;
  150. -moz-transition: all 0.5s ease-in-out;
  151. -o-transition: all 0.5s ease-in-out;
  152. }
  153.  
  154. #triangles {
  155. width:221px;
  156. height:10px;
  157. margin-left:-20px;
  158. }
  159.  
  160. #triangle-topright {
  161. width: 0;
  162. height: 0;
  163. float:left;
  164. border-top: 7px solid {color:borders};
  165. border-left: 10px solid transparent;
  166.  
  167. }
  168.  
  169. #triangle-topleft {
  170. width: 0;
  171. float:right;
  172. height: 0;
  173. border-top: 7px solid {color:borders};
  174. border-right: 9px solid transparent;
  175. }
  176.  
  177.  
  178. #sidebar {
  179. position:fixed;
  180. margin-top:60px;
  181. margin-left:100px;
  182. width:180px;
  183. padding:5px;
  184. }
  185. #border {
  186. height:150%;
  187. margin-top:-10px;
  188. width:200px;
  189. margin-left:95px;
  190. position:fixed;
  191. border-left:solid {color:borders} 1px;
  192. border-right:solid {color:borders} 1px;
  193. }
  194.  
  195. #sidebarpic {
  196. z-index:1000;
  197. }
  198.  
  199. #sidebarpic img {
  200. width:180px;
  201. height:auto;
  202. padding:10px;
  203. background:{color:background};
  204. margin-left:-10px;
  205. border:1px solid {color:borders};
  206. text-align:center;
  207. }
  208.  
  209.  
  210. #description {
  211. opacity:1;
  212. width: 160px;
  213. margin-top:0px;
  214. z-index:-100;
  215. padding:10px;
  216. color:{color:text};
  217. font-size:11px;
  218. text-align:justify;
  219. font-family:calibri;
  220. -webkit-transition: all 0.5s ease-in-out;
  221. -moz-transition: all 0.5s ease-in-out;
  222. -o-transition: all 0.5s ease-in-out;
  223. }
  224.  
  225. #pagination {
  226. background:black;
  227. color:white;
  228. }
  229.  
  230. #icon {
  231. margin-bottom:20px;
  232. }
  233. #links {
  234. margin-top:0px;
  235. opacity:1;
  236. width:160px;
  237. height:15px;
  238. font-size:9px;
  239. padding:9px;
  240. z-index:-1000000;
  241. display:block;
  242. font-family:calibri;
  243. text-align:center;
  244. text-transform:uppercase;
  245. z-index:10;
  246. color:black;
  247. background:white;
  248. -webkit-transition: all 0.5s ease-in-out;
  249. -moz-transition: all 0.5s ease-in-out;
  250. -o-transition: all 0.5s ease-in-out;
  251. }
  252.  
  253.  
  254. #links a{
  255. text-align:left;
  256. display:block;
  257. width:160px;
  258. background:white;
  259. margin-top:3px;
  260. padding:3px;
  261. color:gray;
  262. -webkit-box-shadow: inset 200px 0px 0px -200px rgba(0,0,0,0.5);
  263. -moz-box-shadow: inset 200px 0px 0px -200px rgba(0,0,0,0.5);
  264. box-shadow: inset 200px 0px 0px -200px rgba(0,0,0,0.5);
  265. -webkit-transition: all 0.5s ease-in-out;
  266. -moz-transition: all 0.5s ease-in-out;
  267. -o-transition: all 0.5s ease-in-out;
  268. }
  269.  
  270. #links a:hover{
  271. color:{color:linkhovercolor};
  272. letter-spacing:2px;
  273. {block:IfNaviLinksEffect}
  274. color:white;
  275. -webkit-box-shadow: inset 150px 0px 0px 150px rgba(0,0,0,0.4);
  276. -moz-box-shadow: inset 150px 0px 0px 150px rgba(0,0,0,0.4);
  277. box-shadow: inset 150px 0px 0px 150px rgba(0,0,0,0.4);
  278. -webkit-transition: all 0.5s ease-in-out;
  279. -moz-transition: all 0.5s ease-in-out;
  280. -o-transition: all 0.5s ease-in-out;
  281. {/block:IfNaviLinksEffect}
  282. }
  283.  
  284. /* ---------------------- */
  285.  
  286. .mus {height: 70px; padding: 20px; background-color: #f1f1; display: table; position: relative;
  287. width: 460px;}
  288.  
  289.  
  290. .mus img {height: 50px; position: absolute; border: 10px solid #f2f2f2;}
  291.  
  292. .musiclabel {padding-left: 80px;
  293. text-align: left;
  294. display: table-cell;
  295. vertical-align: middle;
  296. font-family: calibri}
  297.  
  298. .mlabel {color: {color:text};
  299. font-style:italic;
  300. font-size:12px;}
  301.  
  302. .newplayerbutton {
  303. position: relative;
  304. width: 28px;
  305. height: 27px;
  306. overflow: hidden;}
  307.  
  308. .playerbuttonhug {
  309. position: absolute;
  310. top: -8px;
  311. left: -12px;}
  312.  
  313.  
  314. .tumblr_audio_player {
  315. border: none;
  316. padding: 0px;
  317. margin: 0px;
  318. margin-left:15px;
  319. height: 43px;
  320. width: 300px;}
  321.  
  322. .playerbuttonbg {
  323. position: absolute;
  324. left: 30px;
  325. top: 30px;
  326. width: 30px;
  327. height: 30px;
  328. background:white;
  329. padding: 10px;
  330. opacity: 0.3;
  331. transition-duration: 0.6s;
  332. -moz-transition-duration: 0.6s;
  333. -webkit-transition-duration: 0.6s;
  334. -o-transition-duration: 0.6s;
  335. z-index: 1000;}
  336.  
  337. .playerbuttonbg:hover {opacity: 0.8;
  338. transition-duration: 0.6s;
  339. -moz-transition-duration: 0.6s;
  340. -webkit-transition-duration: 0.6s;
  341. -o-transition-duration: 0.6s;}
  342.  
  343.  
  344. /* ---------------------- */
  345.  
  346. .bubble {
  347. align:right;background: #f2f2f2;
  348. margin:7px 0px 5px 0px;
  349. padding:10px;
  350. position: relative;
  351. }
  352.  
  353. .bubble p {
  354. margin:1px 0px;
  355. }
  356.  
  357. .bubble span {
  358. display:block;
  359. position:absolute;
  360. width:1px;
  361. height:1px
  362. font-size: 0;
  363. line-height: 1px;
  364. left:-10px;
  365. top:10px;
  366. border-right:7px solid transparent;
  367. border-left:7px solid transparent;
  368. border-top:10px solid #f2f2f2;
  369. }
  370.  
  371. .askborder {
  372. float: left;
  373. margin: 1px 4px 0 0;
  374. padding: 2px;
  375. background: #f1f1f1;
  376. }
  377. /* ----dsgsfh --*/
  378. #entry {
  379. font-size:10px;
  380. margin-left: 390px;
  381. margin-top:40px;
  382. float: right;
  383. text-align: justify;
  384. }
  385.  
  386. #post {
  387. font-size:10px;
  388. padding: 5px;
  389. margin-bottom:30px;
  390. width: 500px;
  391. color:{color:text};
  392. text-align: left;
  393. overflow:hidden;
  394. }
  395.  
  396. .info {
  397. padding: 5px;
  398. margin-left:0px;
  399. min-height:25px;
  400. z-index:2;
  401. color: {color:info color};
  402. border-bottom-left-radius:5px;
  403. border-bottom-right-radius:5px;
  404. border:1px solid {color:borders};
  405. background:{color:background};
  406. }
  407.  
  408. #credit {
  409. position:fixed;
  410. right:0px;
  411. bottom:0px;
  412. padding:4px;
  413. text-transform:none;
  414. font-family: georgia;
  415. font-weight:none;
  416. letter-spacing:1px;
  417. margin-bottom:3px;
  418. font-size:9px;
  419. margin-right:3px;
  420. border:1px solid;
  421. opacity:0.7;
  422. border-color:#bbb;
  423. background: #fff;
  424. -moz-transition-duration:1s;
  425. -webkit-transition-duration:1s;
  426. -o-transition-duration:1s;
  427. }
  428.  
  429. #credit:hover {
  430. opacity:1;
  431. -moz-transition-duration:1s;
  432. -webkit-transition-duration:1s;
  433. -o-transition-duration:1s;
  434. }
  435.  
  436. {CustomCSS}
  437. </style>
  438. </head>
  439.  
  440. <body>
  441. <div id="border"></div>
  442.  
  443. <div id="sidebar">
  444. <center>
  445. <div id="title">{Title}</div></center>
  446. <div id="triangles"><div id="triangle-topleft"></div><div id="triangle-topright"></div></div>
  447. <div id="sidebarpic"><a href="/"><img src="{image:sidebar}"/></a></div>
  448. <div id="description">{block:Description}{Description}{/block:Description}
  449. </div>
  450. <div id="links">
  451. <a href="{text:Link1}">{text:link1 title}</a>
  452. <a href="{text:link2}">{text:link2 title}</a>
  453. <a href="{text:link3}">{text:link3 title}</a>
  454. <a href="{text:link4}">{text:link4 title}</a>
  455. <a href="{text:link5}">{text:link5 title}</a>
  456.  
  457. {block:NextPage} <a href="{NextPage}">next</a>{/block:NextPage}
  458. {block:PreviousPage}<a href="{PreviousPage}">previous</a>{/block:PreviousPage}
  459. </div>
  460. </div>
  461.  
  462.  
  463. <div id="entry">
  464. {block:Posts}
  465. <div id="post">
  466.  
  467. {block:Text}<h1>{title}</h1>{Body}{/block:Text}
  468.  
  469. {block:Quote}<h3>“{Quote}”</h3><div style="text-align:right; padding:5px; font-style:italic;">- {Source}</div>{/block:Quote}
  470.  
  471. {block:Link}<a href="{URL}" class="link" {Target}> <h2>{Name}</h2></a>
  472. {block:Description}<P>{Description}</p>{/block:Description}{/block:Link}
  473.  
  474. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  475. {block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  476.  
  477. {block:Chat}{block:Title}<t>{Title}</t><br>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  478. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  479.  
  480.  
  481.  
  482.  
  483. {block:Audio}
  484. {block:AudioPlayer}
  485.  
  486. <div class="mus">
  487.  
  488. <div class="playerbuttonbg">
  489. <div class="newplayerbutton">
  490. <div class="playerbuttonhug">
  491.  
  492. {AudioPlayerWhite}
  493.  
  494. </div>
  495. </div>
  496. </div>
  497. {/block:AudioPlayer}
  498.  
  499.  
  500. <img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" alt="default album art"/>
  501. {block:AlbumArt}
  502. <img class="cover" src="{AlbumArtURL}" />
  503. {/block:AlbumArt}
  504.  
  505. <div class="musiclabel">
  506. {block:TrackName}<span class="mlabel">{TrackName}</span>{/block:TrackName}<br>
  507. {block:Artist}{Artist}{/block:Artist} {block:Album}· {Album}{/block:Album}<br>
  508. {block:Playcount}{Playcount} Plays{/block:Playcount}
  509. </div></div>
  510.  
  511. {block:Caption}{Caption}{/block:Caption}
  512. {/block:Audio}
  513.  
  514. {block:Answer}
  515. <div class="bubble">{Asker}: {Question}</div><br><div class="bubble" style="background:transparent; margin-top:-30px; margin-left:20px; margin-bottom:10px;"><span></span></div>
  516. {Answer}{/block:Answer}
  517.  
  518.  
  519. <div class="icon"><a href="{Permalink}" title="permalink"><font style="font-family:'Kawaii Food Font'; font-size:60px; font-weight:none; float:left; margin-top:-5px; padding-left:15px; z-index:10000">d</font></a></div>
  520.  
  521. <div class="info">posted {block:Date}{TimeAgo}{/block:Date} {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}{/block:NoteCount}{block:RebloggedFrom} (<a href="{ReblogParentURL}">via</a>{block:ContentSource} & <a href="{SourceURL}">source</a>{block:ContentSource}){/block:RebloggedFrom}<br>
  522. {block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}</div>
  523.  
  524. </div><br>
  525. {/block:Posts}
  526.  
  527. {block:PostNotes}{PostNotes}{/block:PostNotes}
  528.  
  529. </div>
  530. <div id="credit"><a href="http://hardziam.tumblr.com">HZ</a></div>
  531. </body>
  532.  
  533. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement