API tools faq
paste
parispier

Theme09: Sweet Spring

parispier
Mar 15th, 2013
4,574
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.05 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. <meta name="color:background" content="#ffffff"/>
  31. <meta name="color:text" content="#a3a3a3" />
  32. <meta name="color:link" content="#b3b2b1" />
  33. <meta name="color:linkhovercolor" content="#f3f3f3" />
  34. <meta name="color:linkborder" content="#f3f3f3" />
  35. <meta name="color:linkhoverborder" content="#c2c2c2" />
  36. <meta name="color:linkhoverbg" content="#d6d5d5" />
  37. <meta name="color:navlink" content="#b3b2b1" />
  38. <meta name="color:big" content="#b9aeac" />
  39. <meta name="color:bold" content="#f3e6e3" />
  40. <meta name="color:scrollbar" content="#b1b1b1" />
  41. <meta name="color:italic" content="#cec2c0" />
  42.  
  43. <meta name="text:Link1" content="/" />
  44. <meta name="text:Link1 Title" content="link 1" />
  45. <meta name="text:Link2" content="/" />
  46. <meta name="text:Link2 Title" content="link 2" />
  47. <meta name="text:Link3" content="/" />
  48. <meta name="text:Link3 Title" content="link 3" />
  49. <meta name="text:Link4" content="/" />
  50. <meta name="text:Link4 Title" content="link 4" />
  51.  
  52. <meta name="image:sidebar" content=""/>
  53. <meta name="image:sidebackground" content=""/>
  54.  
  55.  
  56. <style type="text/css">
  57.  
  58. ::-webkit-scrollbar-thumb:vertical {background-color: {color:scrollbar}; height:100px;}
  59.  
  60. ::-webkit-scrollbar-thumb:horizontal {background-color: {color:scrollbar}; height:10px !important;}
  61.  
  62. ::-webkit-scrollbar {height:9px; width:9px; background-color: {color:background};}
  63.  
  64.  
  65. body {
  66. background:{color:background};
  67. font-family:consolas;
  68. margin:0px;
  69. color:{color:text};
  70. font-size:10px;
  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:linkhovercolor};
  105. -webkit-transition: all 0.9s ease-in;
  106. -moz-transition: all 0.9s ease-in;
  107. -o-transition: all 0.9s ease-in;
  108. -webkit-transition: all 0.5s ease-out;
  109. -moz-transition: all 0.5s ease-out;
  110. -o-transition: all 0.5s ease-out;
  111. }
  112.  
  113. #entries {
  114. padding:10px;
  115. width:500px;
  116. margin-left:500px;
  117. margin-top:70px;
  118. }
  119.  
  120. #post {
  121. width:500px;
  122. padding-bottom:20px;
  123. padding:15px;
  124. margin-top:30px;
  125. }
  126.  
  127. #sidebar {
  128. z-index:5;
  129. position:fixed;
  130. width:170px;
  131. height:250px;
  132. margin-left:20px;
  133. margin-top:320px;
  134. -webkit-transition: all 0.9s ease-in;
  135. -moz-transition: all 0.9s ease-in;
  136. -o-transition: all 0.9s ease-in;
  137. -webkit-transition: all 0.5s ease-out;
  138. -moz-transition: all 0.5s ease-out;
  139. -o-transition: all 0.5s ease-out;
  140. }
  141.  
  142. #sidebarlbg {
  143. z-index:2;
  144. position:fixed;
  145. opacity:0;
  146. background-image: url('{image:sidebackground}');
  147. width:450px;
  148. height:650px;
  149. margin-top:25px;
  150. margin-left:-350px;
  151. -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,1)), color-stop(0.3, rgba(0,0,0,.6)), to(rgba(0,0,0,0)));
  152. webkit-transition: all 0.9s ease-in;
  153. -moz-transition: all 0.9s ease-in;
  154. -o-transition: all 0.9s ease-in;
  155. -webkit-transition: all 0.5s ease-out;
  156. -moz-transition: all 0.5s ease-out;
  157. -o-transition: all 0.5s ease-out;
  158. }
  159.  
  160. #hoverarea:hover #sidebarlbg {
  161. opacity:.7;
  162. margin-left:-270px;
  163. webkit-transition: all 0.9s ease-in;
  164. -moz-transition: all 0.9s ease-in;
  165. -o-transition: all 0.9s ease-in;
  166. -webkit-transition: all 0.5s ease-out;
  167. -moz-transition: all 0.5s ease-out;
  168. -o-transition: all 0.5s ease-out;
  169. }
  170.  
  171. #sidebarbg {
  172. z-index:1;
  173. position:fixed;
  174. height:700px;
  175. opacity:1;
  176. margin-left:-10px;
  177. width:210px;
  178. background-color:#fff;
  179. background-color:#fcfcfc;
  180. border-right:1px solid #ececec;
  181. border-left:1px solid #ececec;
  182. -webkit-transition: all 0.9s ease-in;
  183. -moz-transition: all 0.9s ease-in;
  184. -o-transition: all 0.9s ease-in;
  185. -webkit-transition: all 0.5s ease-out;
  186. -moz-transition: all 0.5s ease-out;
  187. -o-transition: all 0.5s ease-out;
  188. }
  189.  
  190. #hoverarea:hover #sidebarbg {
  191. opacity:1;
  192. width:200px;
  193. margin-left:0px;
  194. border-left:none;
  195. -webkit-mask-image: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,1)), color-stop(0.5, rgba(0,0,0,1)), to(rgba(0,0,0,0)));
  196. -webkit-transition: all 0.9s ease-in;
  197. -moz-transition: all 0.9s ease-in;
  198. -o-transition: all 0.9s ease-in;
  199. -webkit-transition: all 0.5s ease-out;
  200. -moz-transition: all 0.5s ease-out;
  201. -o-transition: all 0.5s ease-out;
  202. }
  203.  
  204. #hoverarea {
  205. position:fixed;
  206. margin-top:-100px;
  207. margin-left:260px;
  208. width:200px;
  209. height:750px;
  210. }
  211.  
  212. #sidebarimage {
  213. position:fixed;
  214. margin-left:11px;
  215. margin-top:10px;
  216. height:187px;
  217. width:137px;
  218. }
  219.  
  220. #hoverarea:hover #sidebarimage {
  221. background-color:#fff;
  222. height:187px;
  223. width:137px;
  224. -webkit-transition: all 0.1s ease-in;
  225. -moz-transition: all 0.1s ease-in;
  226. -o-transition: all 0.1s ease-in;
  227. -webkit-transition: all 0.5s ease-out;
  228. -moz-transition: all 0.5s ease-out;
  229. -o-transition: all 0.5s ease-out;
  230. }
  231.  
  232. #sidebarimage img {
  233. position:fixed;
  234. width:125px;
  235. height:175px;
  236. padding:3px;
  237. border:1px solid #e4e3e2;
  238. opacity:.6;
  239. -webkit-transition: all 0.1s ease-in;
  240. -moz-transition: all 0.1s ease-in;
  241. -o-transition: all 0.1s ease-in;
  242. -webkit-transition: all 0.5s ease-out;
  243. -moz-transition: all 0.5s ease-out;
  244. -o-transition: all 0.5s ease-out;
  245. }
  246.  
  247. #hoverarea:hover #sidebarimage img{
  248. border:3px solid #e4e3e2;
  249. -webkit-transition: all 0.1s ease-in;
  250. -moz-transition: all 0.1s ease-in;
  251. -o-transition: all 0.1s ease-in;
  252. -webkit-transition: all 0.5s ease-out;
  253. -moz-transition: all 0.5s ease-out;
  254. -o-transition: all 0.5s ease-out;
  255. }
  256.  
  257. #description {
  258. font-family:cambria;
  259. font-size:9px;
  260. position:fixed;
  261. padding:5px;
  262. width:115px;
  263. margin-top:140px;
  264. margin-left:15px;
  265. text-align:center;
  266. background-color:#fff;
  267. opacity:.9;
  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. #hoverarea:hover #description {
  277. opacity:.9;
  278. background-color:#ffffff;
  279. border:1px solid #ececec;
  280. margin-top:200px;
  281. margin-left:17px;
  282. -webkit-transition: all 0.9s ease-in;
  283. -moz-transition: all 0.9s ease-in;
  284. -o-transition: all 0.9s ease-in;
  285. -webkit-transition: all 0.5s ease-out;
  286. -moz-transition: all 0.5s ease-out;
  287. -o-transition: all 0.5s ease-out;
  288. }
  289.  
  290. #links {
  291. z-index:5;
  292. position:fixed;
  293. margin-left:20px;
  294. margin-top:148px;
  295. width:58px;
  296. height:15px;
  297. line-height:150%;
  298. font-family:calibri;
  299. font-size:7.5px;
  300. text-align:center;
  301. text-transform:uppercase;
  302. opacity:0;
  303. font-weight:bolder;
  304. display:block;
  305. -webkit-transition: all 0.9s ease-in;
  306. -moz-transition: all 0.9s ease-in;
  307. -o-transition: all 0.9s ease-in;
  308. -webkit-transition: all 0.5s ease-out;
  309. -moz-transition: all 0.5s ease-out;
  310. -o-transition: all 0.5s ease-out;
  311. }
  312.  
  313. #links2 {
  314. z-index:5;
  315. position:fixed;
  316. margin-left:81px;
  317. margin-top:148px;
  318. width:58px;
  319. height:15px;
  320. line-height:150%;
  321. font-family:calibri;
  322. font-size:7.5px;
  323. text-align:center;
  324. text-transform:uppercase;
  325. font-weight:bolder;
  326. opacity:0;
  327. display:block;
  328. -webkit-transition: all 0.9s ease-in;
  329. -moz-transition: all 0.9s ease-in;
  330. -o-transition: all 0.9s ease-in;
  331. -webkit-transition: all 0.5s ease-out;
  332. -moz-transition: all 0.5s ease-out;
  333. -o-transition: all 0.5s ease-out;
  334. }
  335.  
  336. #links a {
  337. display:block;
  338. margin-bottom:-5px;
  339. padding-bottom:2px;
  340. padding-top:2px;
  341. padding-left:3px;
  342. padding-right:3px;
  343. border:1px solid {color:linkborder};
  344. background-color:#fff;
  345. color:{color:navlink};
  346. -webkit-transition: all 0.9s ease-in;
  347. -moz-transition: all 0.9s ease-in;
  348. -o-transition: all 0.9s ease-in;
  349. -webkit-transition: all 0.5s ease-out;
  350. -moz-transition: all 0.5s ease-out;
  351. -o-transition: all 0.5s ease-out;
  352. }
  353.  
  354. #links2 a {
  355. display:block;
  356. margin-bottom:-5px;
  357. padding-bottom:2px;
  358. padding-top:2px;
  359. padding-left:3px;
  360. padding-right:3px;
  361. background-color:#fff;
  362. border:1px solid {color:linkborder};
  363. color:{color:navlink};
  364. -webkit-transition: all 0.9s ease-in;
  365. -moz-transition: all 0.9s ease-in;
  366. -o-transition: all 0.9s ease-in;
  367. -webkit-transition: all 0.5s ease-out;
  368. -moz-transition: all 0.5s ease-out;
  369. -o-transition: all 0.5s ease-out;
  370. }
  371.  
  372. #hoverarea:hover #links {
  373. opacity:.85;
  374. }
  375.  
  376. #hoverarea:hover #links2 {
  377. opacity:.85;
  378. }
  379.  
  380. #links a:hover{
  381. opacity:1;
  382. font-style:italic;
  383. background-color:{color:linkhoverbg};
  384. letter-spacing:1px;
  385. color:#fff;
  386. border:1px solid {color:linkhoverborder};
  387. -webkit-transition: all 0.9s ease-in;
  388. -moz-transition: all 0.9s ease-in;
  389. -o-transition: all 0.9s ease-in;
  390. -webkit-transition: all 0.5s ease-out;
  391. -moz-transition: all 0.5s ease-out;
  392. -o-transition: all 0.5s ease-out;
  393. }
  394.  
  395. #links2 a:hover{
  396. opacity:1;
  397. font-style:italic;
  398. background-color:{color:linkhoverbg};
  399. letter-spacing:1px;
  400. color:#fff;
  401. border:1px solid {color:linkhoverborder};
  402. -webkit-transition: all 0.9s ease-in;
  403. -moz-transition: all 0.9s ease-in;
  404. -o-transition: all 0.9s ease-in;
  405. -webkit-transition: all 0.5s ease-out;
  406. -moz-transition: all 0.5s ease-out;
  407. -o-transition: all 0.5s ease-out;
  408. }
  409.  
  410. #pagination {
  411. position:fixed;
  412. font-family:cambria;
  413. font-size:8px;
  414. text-align:center;
  415. margin-top:214px;
  416. margin-left:380px;
  417. padding:3px;
  418. text-transform:uppercase;
  419. opacity:1;
  420. color:#afaaaa;
  421. }
  422.  
  423. #info {
  424. width:500px;
  425. font-family:cambria;
  426. text-align:left;
  427. text-transform:lowercase;
  428. font-size:8px;
  429. margin-top:10px;
  430. border-top:1px solid #e7e7e7;
  431. border-left:1px solid #e7e7e7;
  432. padding-left:3px;
  433. padding-top:3px;
  434. }
  435.  
  436. #tags {
  437. text-align:left;
  438. font-family:cambria;
  439. font-size:8px;
  440. text-transform:lowercase;
  441. }
  442.  
  443. #question{
  444. font-size:9px;
  445. background-color:#ffffff;
  446. padding:7px;
  447. text-align:center;
  448. background-color:#fcfcfc;
  449. border-bottom:1px solid #cecccc;
  450. }
  451.  
  452. #heyo {
  453. font-family:cambria;
  454. position:fixed;
  455. text-align:center;
  456. bottom:10px;
  457. right:7px;
  458. font-size:6.5px;
  459. text-transform:uppercase;
  460. display:block;
  461. background-color:#fff;
  462. letter-spacing:1px;
  463. }
  464.  
  465. #heyo a{
  466. color:#b3b2b1;
  467. border: 1px solid #e4e3e2;
  468. padding: 3px 5px 3px 5px;
  469. border-radius:500px;
  470. background-color:#fff;
  471. -moz-transition-duration:0.5s;
  472. -webkit-transition-duration:0.5s;
  473. -o-transition-duration:0.5s;
  474. }
  475.  
  476. #heyo a:hover{
  477. color:#fff;
  478. background-color:#969194;
  479. border: 1px solid #7a7979;
  480. -moz-transition-duration:0.5s;
  481. -webkit-transition-duration:0.5s;
  482. -o-transition-duration:0.5s;
  483. }
  484.  
  485. i, em{color:{color:italic}; font-style:italic;}
  486. b, strong{color:{color:bold}; font-weight:bolder;}
  487.  
  488. #audioinfo {
  489. font-size:8px;
  490. letter-spacing:1px;
  491. padding-bottom:2px;
  492. text-transform:lowercase;
  493. }
  494.  
  495. .audioplayer {
  496. overflow:hidden;
  497. display:block;
  498. float:left;
  499. margin-top:7px;
  500. margin-left:7px;
  501. width:27px;
  502. height:27px;
  503. opacity:.5;
  504. }
  505.  
  506. .audioplayercontainer {
  507. width:70px;
  508. height:70px;
  509. position:absolute;
  510. }
  511.  
  512. {CustomCSS}</style></head><body>
  513.  
  514. <div id="hoverarea">
  515.  
  516. <div id="sidebarlbg"></div>
  517.  
  518. <div id="sidebarbg"></div>
  519.  
  520. <div id="sidebar">
  521.  
  522. <div id="links">
  523. <a href="{text:Link1}">{text:Link1 Title}</a> <p>
  524. <a href="{text:Link3}">{text:Link3 Title}</a>
  525. </div>
  526.  
  527. <div id="links2">
  528. <a href="{text:Link2}">{text:Link2 Title}</a> <p>
  529. <a href="{text:Link4}">{text:Link4 Title}</a>
  530. </div>
  531.  
  532. <div id="sidebarimage"><img src="{image:sidebar}"></div>
  533.  
  534. <div id="description">{Description}</div>
  535. </div></div>
  536.  
  537. <div id="pagination">
  538. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">«</a>{/block:PreviousPage}
  539. {CurrentPage}<small> of </small>{TotalPages}
  540. {block:NextPage}<a href="{NextPage}">»</a>{/block:NextPage}{/block:Pagination}
  541. </div>
  542.  
  543. <div id="entries">{block:Posts}<div id="post">
  544.  
  545. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  546.  
  547. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  548.  
  549. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  550.  
  551. {block:Quote}{Quote}{block:Source} —{Source}{/block:Source}{/block:Quote}
  552.  
  553. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  554.  
  555. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  556.  
  557. {block:Audio}
  558. {block:AlbumArt}<img src="{AlbumArtURL}" width="40px" height="40px" align="left" />{/block:AlbumArt}
  559. <div class="audioplayercontainer"><div class="audioplayer">{AudioPlayerWhite}</div></div>
  560.  
  561. <div id="audioinfo">
  562. &nbsp;{block:TrackName}<b>Title: </b>{TrackName}{/block:TrackName}<br>
  563. &nbsp;{block:Artist}<b>Artist: </b>{Artist}{/block:Artist}<br>
  564. &nbsp;{block:Album}<b>Album:</b> {Album}{/block:Album}<br>
  565. &nbsp;<b>Plays:</b> {PlayCount}</div>
  566. {block:Caption}{Caption}{/block:Caption}
  567. {/block:Audio}
  568.  
  569. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  570.  
  571. {block:Answer}
  572. <a href="{AskerURL}"><img align="left" src="{AskerPortraitUR-24}"></a> <div id="question" style="width:485px;">{Asker}: {Question}</div> <BR>
  573. {Answer}
  574. {/block:Answer}
  575.  
  576. <div id="info">
  577. {block:Date}posted {TimeAgo}{/block:Date} with <a href="{Permalink}">
  578. {NoteCountWithLabel}</a>{block:RebloggedFrom} via <a href="{ReblogParentURL}"
  579. title="{ReblogParentTitle}">{ReblogParentName}</a>{/block:RebloggedFrom}
  580. + <a href="{ReblogURL}" target="_blank">reblog</a>
  581. {block:HasTags}<div id="tags">{block:Tags} #<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags} </div></div>
  582. {/block:Posts}
  583. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  584. {/block:Posts} </div></div></div>
  585.  
  586. <div id="heyo"><a href="http://nialljhoren.tumblr.com">n</a></div>
  587.  
  588. </div>
  589.  
  590. </div>
  591.  
  592. </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!