API tools faq
paste
parispier

Theme08: Simply Elegant

parispier
Mar 2nd, 2013
1,575
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.37 KB | None | 0 0
raw download clone embed print report
  1. <!---- theme made by nialljhoren ---->
  2. <!---- do not use as base code, remove credit, or claim as your own --->
  3.  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6. <head><title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10.  
  11. <script>
  12. window.onload = function () {
  13. document.body.insertAdjacentHTML( 'beforeEnd', '<iframe id="my-like-frame" style="display:none;"></iframe>' );
  14. document.addEventListener( 'click', function ( event ) {
  15. var myLike = event.target;
  16. if( myLike.className.indexOf( 'my-like' ) > -1 ) {
  17. var frame = document.getElementById( 'my-like-frame' ),
  18. liked = ( myLike.className == 'my-liked' ),
  19. command = liked ? 'unlike' : 'like',
  20. reblog = myLike.getAttribute( 'data-reblog' ),
  21. id = myLike.getAttribute( 'data-id' ),
  22. oauth = reblog.slice( -8 );
  23. frame.src = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + id;
  24. liked ? myLike.className = 'my-like' : myLike.className = 'my-liked';
  25. };
  26. }, false );
  27. };
  28. </script>
  29.  
  30.  
  31.  
  32. <meta name="color:Background" content="#ffffff"/>
  33.  
  34. <meta name="color:entry" content="#fffdfd" />
  35. <meta name="color:text" content="#a3a3a3" />
  36. <meta name="color:link" content="#b3b2b1" />
  37. <meta name="color:linkhovercolor" content="#f3f3f3" />
  38. <meta name="color:navlinkhovercolor" content="f3f3f3" />
  39. <meta name="color:big" content="#b9aeac" />
  40. <meta name="color:bold" content="#f3e6e3" />
  41. <meta name="color:title" content="#b1b1b1" />
  42. <meta name="color:italic" content="#cec2c0" />
  43. <meta name="color:border" content="#e4e3e2" />
  44. <meta name="color:scrollbar" content="#b1b1b1" />
  45.  
  46. <meta name="text:Link1" content="/" />
  47. <meta name="text:Link2" content="/" />
  48. <meta name="text:Link3" content="/" />
  49. <meta name="text:Link4" content="/" />
  50. <meta name="text:Link5" content"/" >
  51.  
  52. <meta name="image:sidebar" content=""/>
  53.  
  54.  
  55. <style type="text/css">
  56.  
  57. ::-webkit-scrollbar-thumb:vertical {background-color: {color:scrollbar}; height:100px;}
  58.  
  59. ::-webkit-scrollbar-thumb:horizontal {background-color: {color:scrollbar}; height:10px !important;}
  60.  
  61. ::-webkit-scrollbar {height:9px; width:9px; background-color: {color:Background};}
  62.  
  63.  
  64. body {
  65. background:{color:background};
  66. font-family:consolas;
  67. margin:0px;
  68. color:{color:text};
  69. font-size:10px;
  70. font-weight:bolder;
  71. line-height:100%;
  72. }
  73.  
  74. a {
  75. text-decoration:none;
  76. outline:none;
  77. -moz-outline-style:none;
  78. color:{color:link};
  79. }
  80.  
  81. img {
  82. border:none;
  83. }
  84.  
  85. blockquote {
  86. padding-left:5px;
  87. border-left:2px solid;
  88. }
  89.  
  90. blockquote blockquote {
  91. padding-left:5px;
  92. border-left:2px solid;
  93. }
  94.  
  95. h1 {
  96. font-size:10px;
  97. font-family:cambria;
  98. text-transform:uppercase;
  99. padding-bottom:5px;
  100. }
  101.  
  102. a:hover {
  103. opacity:10;
  104. color:{color:hover};
  105. -webkit-transition: all 0.7s ease;
  106. -moz-transition: all 0.7s ease;
  107. -o-transition: all 0.7s ease
  108. }
  109.  
  110. #entries {
  111. padding:10px;
  112. width:500px;
  113. margin-left:450px;
  114. margin-top:70px;
  115. }
  116.  
  117. #post {
  118. width:500px;
  119. padding-bottom:20px;
  120. padding:15px;
  121. margin-top:30px;
  122. border:1px solid {color:border};
  123. }
  124.  
  125. #sidebar {
  126. position:fixed;
  127. width:230px;
  128. height:200px;
  129. position:fixed;
  130. margin-left:130px;
  131. margin-top:200px;
  132. }
  133.  
  134. #sidebarbg {
  135. position:fixed;
  136. width:230px;
  137. height:200%;
  138. margin-top:-75px;
  139. margin-left:130px;
  140. background-color:#fff;
  141. background-color:#fcfcfc;
  142. border:1px solid #ececec;
  143. }
  144.  
  145. #sidebarimage {
  146. margin-top:20px;
  147. margin-left:55px;
  148. position:fixed;
  149. width 120px;
  150. height:125px;
  151. }
  152.  
  153. #sidebarimage img {
  154. position:fixed;
  155. width:120px;
  156. height:125px;
  157. padding:3px;
  158. border:1px solid #d1d1d1;
  159. }
  160.  
  161. #description {
  162. font-family:consolas;
  163. font-size:8px;
  164. position:fixed;
  165. padding:5px;
  166. width:115px;
  167. margin-top:115px;
  168. margin-left:10px;
  169. background-color:#fcfcfc;
  170. text-align:center;
  171. opacity:0;
  172. -webkit-transition: all 0.9s ease-in;
  173. -moz-transition: all 0.9s ease-in;
  174. -o-transition: all 0.9s ease-in;
  175. -webkit-transition: all 0.5s ease-out;
  176. -moz-transition: all 0.5s ease-out;
  177. -o-transition: all 0.5s ease-out;
  178. }
  179.  
  180. #sidebar:hover #description{
  181. margin-left:56px;
  182. opacity:.9;
  183. -webkit-transition: all 0.9s ease-in;
  184. -moz-transition: all 0.9s ease-in;
  185. -o-transition: all 0.9s ease-in;
  186. -webkit-transition: all 0.5s ease-out;
  187. -moz-transition: all 0.5s ease-out;
  188. -o-transition: all 0.5s ease-out;
  189. }
  190.  
  191.  
  192. #pagination {
  193. position:fixed;
  194. font-family:cambria;
  195. font-size:7.5px;
  196. text-align:center;
  197. margin-top:-10px;
  198. margin-left:90px;
  199. padding:17px;
  200. width: 100px;
  201. letter-spacing:1px;
  202. text-transform:uppercase;
  203. }
  204.  
  205. #pagination a {
  206. color:{color:link};
  207. }
  208.  
  209. #pagination a:hover {
  210. color:{color:linkhovercolor};
  211. }
  212.  
  213. #tags {
  214. font-family:consolas;
  215. font-size:8px;
  216. text-transform:lowercase;
  217. opacity:0;
  218. width:150px;
  219. margin-left:500px;
  220. position:absolute;
  221. -webkit-transition: all 0.9s ease-in;
  222. -moz-transition: all 0.9s ease-in;
  223. -o-transition: all 0.9s ease-in;
  224. -webkit-transition: all 0.5s ease-out;
  225. -moz-transition: all 0.5s ease-out;
  226. -o-transition: all 0.5s ease-out;
  227. }
  228.  
  229. #post:hover #tags {
  230. opacity:1;
  231. margin-top:5px;
  232. margin-left:520px;
  233. -webkit-transition: all 0.9s ease-in;
  234. -moz-transition: all 0.9s ease-in;
  235. -o-transition: all 0.9s ease-in;
  236. -webkit-transition: all 0.5s ease-out;
  237. -moz-transition: all 0.5s ease-out;
  238. -o-transition: all 0.5s ease-out;
  239. }
  240.  
  241. #links {
  242. z-index:5;
  243. position:fixed;
  244. margin-left:40px;
  245. margin-top:155px;
  246. width:145px;
  247. line-height:150%;
  248. font-family:consolas;
  249. font-size:12px;
  250. text-align:center;
  251. padding-left:5px;
  252. text-transform:uppercase;
  253. letter-spacing:1px;
  254. opacity:.8;
  255. font-weight:lighter;
  256. display:block;
  257. color:#b8b3b3;
  258. -webkit-transition: all 0.9s ease-in;
  259. -moz-transition: all 0.9s ease-in;
  260. -o-transition: all 0.9s ease-in;
  261. -webkit-transition: all 0.5s ease-out;
  262. -moz-transition: all 0.5s ease-out;
  263. -o-transition: all 0.5s ease-out;
  264. }
  265.  
  266. #links a{
  267. color:#b8b3b3;
  268. -webkit-transition: all 0.9s ease-in;
  269. -moz-transition: all 0.9s ease-in;
  270. -o-transition: all 0.9s ease-in;
  271. -webkit-transition: all 0.5s ease-out;
  272. -moz-transition: all 0.5s ease-out;
  273. -o-transition: all 0.5s ease-out;
  274. }
  275.  
  276. #links a:hover{
  277. -webkit-transition: all 0.9s ease-in;
  278. -moz-transition: all 0.9s ease-in;
  279. -o-transition: all 0.9s ease-in;
  280. -webkit-transition: all 0.5s ease-out;
  281. -moz-transition: all 0.5s ease-out;
  282. -o-transition: all 0.5s ease-out;
  283. color:{color:navlinkhovercolor};
  284. }
  285.  
  286.  
  287. #info {
  288. font-family:consolas;
  289. text-align:right;
  290. text-transform:lowercase;
  291. font-size:8px;
  292. margin-top:10px;
  293. border-top:1px dotted {color:border};
  294. padding-top:3px;
  295. }
  296.  
  297. #info a {
  298. color:{color:link};
  299. }
  300.  
  301. #info a:hover {
  302. color:{color:linkhovercolor};
  303. }
  304.  
  305. #question{
  306. font-family: consolas;
  307. font-size:10px;
  308. padding:8px 3px 8px 5px;
  309. width:500px;
  310. text-align:left;
  311. font-style:italic;
  312. background-color:#ffffff;
  313. background-color:#fcfcfc;
  314. border-bottom:1px dotted #e4e3e2;
  315. color:{color:text};
  316. }
  317.  
  318. #question a:hover{
  319. color:{color:linkhovercolor};}
  320.  
  321. #heyo {
  322. font-family:times new;
  323. position:fixed;
  324. text-align:center;
  325. bottom:10px;
  326. right:5px;
  327. font-size:7px;
  328. text-transform:uppercase;
  329. display:block;
  330. background-color:#fff;
  331. }
  332.  
  333. #heyo a{
  334. {color:link};
  335. border: 1px solid #dbd8d9;
  336. border-radius:200px;
  337. padding: 4px 5px 3px 5px;
  338. background-color:#fff;
  339. -moz-transition-duration:0.5s;
  340. -webkit-transition-duration:0.5s;
  341. -o-transition-duration:0.5s;}
  342.  
  343. #heyo a:hover{
  344. color:{color:linkhovercolor};
  345. background-color:#969194;
  346. border: 1px solid #7a7979;
  347. color:#fff;
  348. padding: 4px 5px 3px 5px;
  349. -moz-transition-duration:0.5s;
  350. -webkit-transition-duration:0.5s;
  351. -o-transition-duration:0.5s;}
  352.  
  353. i, em{color:{color:italic}; font-style:italic;}
  354. b, strong{color:{color:bold}; font-style:bold;}
  355.  
  356. #albumart {
  357. position:absolute;
  358. width:125px;
  359. height:125px;}
  360. #albumart img {
  361. width:125px;
  362. height:125px;
  363. float:left;
  364. padding:5px;}
  365. #audioinfo {
  366. font-size:7px;
  367. color:text;}
  368.  
  369. {CustomCSS}</style></head><body>
  370.  
  371.  
  372. <div id="sidebarbg"></div>
  373.  
  374. <div id="sidebar">
  375.  
  376. <div id="links">
  377. <a href="{text:Link1}">I</a>
  378. <a href="{text:Link2}">II</a>
  379. <a href="{text:Link3}">III</a>
  380. <a href="{text:Link4}">IV</a>
  381. <a href="{text:Link5}">V</a>
  382.  
  383. </div>
  384.  
  385. <div id="sidebarimage"><img src="{image:sidebar}"></div>
  386.  
  387. <div id="description">{Description}</div>
  388.  
  389. <div id="pagination">
  390. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">«</a>{/block:PreviousPage}
  391. {CurrentPage}<small> of </small>{TotalPages}
  392. {block:NextPage}<a href="{NextPage}">»</a>{/block:NextPage}{/block:Pagination}
  393. </div>
  394.  
  395. </div>
  396.  
  397. <div id="entries">{block:Posts}<div id="post">
  398.  
  399. {block:HasTags}<div id="tags">Tagged as:<p>{block:Tags} #<a href="{TagURL}">{Tag}</a><br> {/block:Tags}</div>{/block:HasTags}
  400.  
  401. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  402.  
  403. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  404.  
  405. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  406.  
  407. {block:Quote}{Quote}{block:Source} —{Source}{/block:Source}{/block:Quote}
  408.  
  409. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  410.  
  411. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  412.  
  413. {block:Audio}
  414. {block:AlbumArt}<img src="{AlbumArtURL}" width="80px" height="80px" align="left" />{/block:AlbumArt}<p>
  415. {AudioPlayerWhite}
  416. {block:TrackName}<b>Title: </b>{TrackName}{/block:TrackName}
  417. <br>
  418. {block:Artist}<b>Artist: </b>{Artist}{/block:Artist}
  419. <br>
  420. {block:Album}<b>Album:</b> {Album}{/block:Album}
  421. <br>
  422. <b>Plays:</b> {PlayCount}
  423. {/block:Audio}
  424.  
  425. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  426.  
  427. {block:Answer}
  428. <a href="{AskerURL}"></a> <div id="question" style="width:487px;">{Asker}: {Question}</div> <BR>
  429. {Answer}
  430. {/block:Answer}
  431.  
  432. <div id="info">
  433. {block:Date}posted {TimeAgo}{/block:Date} with <a href="{Permalink}">
  434. {NoteCountWithLabel}</a>{block:RebloggedFrom} via <a href="{ReblogParentURL}"
  435. title="{ReblogParentTitle}">{ReblogParentName}</a>{/block:RebloggedFrom}
  436. + <a href="{ReblogURL}" target="_blank">reblog</a>
  437. </div></div>
  438. {/block:Posts}
  439. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  440. {/block:Posts} </div></div></div>
  441.  
  442. <div id="heyo"><a href="http://nialljhoren.tumblr.com">N</a></div>
  443.  
  444. </div>
  445.  
  446. </div>
  447.  
  448. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!