API tools faq
paste
silvercybermen

Theme 01 REVAMP: Dancing Petals

silvercybermen
Aug 6th, 2014
594
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.25 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!--
  4.  
  5. Theme 01 REVAMP: Dancing Petals by lunecerise aka sxriusblack
  6.  
  7. Edit as much as you want, as long as you:
  8. -keep the credit intact
  9. -don't steal any code
  10. -don't use as a base code
  11.  
  12. -->
  13.  
  14.  
  15. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  16. <head>
  17.  
  18. <title>{Title}</title>
  19. <link rel="shortcut icon" href="{Favicon}">
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  22.  
  23. <meta name="color:Background" content="#ffffff"/>
  24. <meta name="color:Text" content="#bbbbbb"/>
  25. <meta name="color:Accent" content="#A987E2"/>
  26. <meta name="color:Link" content="#aaaaaa"/>
  27. <meta name="color:Tags" content="#cccccc"/>
  28. <meta name="color:Hover" content="#b3b3b3"/>
  29. <meta name="color:Line" content="#f2f2f2"/>
  30. <meta name="color:Border" content="#eeeeee"/>
  31. <meta name="color:Tooltip" content="#777777"/>
  32. <meta name="color:Scrollbar" content="#eeeeee"/>
  33.  
  34. <meta name="image:Sidebar" content=""/>
  35.  
  36. <meta name="if:Ask Popup" content="1"/>
  37. <meta name="if:No Popup" content="0"/>
  38. <meta name="if:Flowers" content="1"/>
  39.  
  40. <meta name="text:Blog Title" content="">
  41. <meta name="text:linkA" content="">
  42. <meta name="text:linkA url" content="/">
  43. <meta name="text:linkB" content="">
  44. <meta name="text:linkB url" content="/">
  45. <meta name="text:linkC" content="">
  46. <meta name="text:linkC url" content="/">
  47. <meta name="text:linkD" content="">
  48. <meta name="text:linkD url" content="/">
  49. <meta name="text:linkE" content="">
  50. <meta name="text:linkE url" content="/"/>
  51.  
  52. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  53. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  54. <script>
  55. (function($){
  56. $(document).ready(function(){
  57. $("[title]").style_my_tooltips({
  58. tip_follows_cursor:true,
  59. tip_delay_time:1,
  60. tip_fade_speed:100,
  61. attribute:"title"
  62. });
  63. });
  64. })(jQuery);
  65. </script>
  66.  
  67. <style type="text/css">
  68.  
  69. ::-webkit-scrollbar {width:5px; height:auto; background:{color:Background};}
  70. ::-webkit-scrollbar-corner {background:transparent;}
  71. ::-webkit-scrollbar-thumb:vertical {background:transparent; width:3px; border-left:2px solid {color:scrollbar}; transition:0.5s ease-in-out;-webkit-transition:0.5s ease-in-out;-moz-transition:0.5s ease-in-out;-ms-transition:0.5s ease-in-out;-o-transition:0.5s ease-in-out;}
  72. ::-webkit-scrollbar-thumb:horizontal {background:{color:scrollbar};}
  73. ::-webkit-scrollbar-thumb:hover {background:{color:scrollbar};border-left:5px; width:0px;}
  74. ::-webkit-scrollbar-increment {width:5px; height:5px; background-color:#fff;}
  75.  
  76. iframe#tumblr_controls {
  77. white-space:nowrap;
  78. -webkit-filter: invert(100%);
  79. -moz-filter: invert(100%);
  80. -o-filter: invert(100%);
  81. -ms-filter: invert(100%);
  82. filter: invert(100%);
  83. opacity:.2;transition: .8s ease-in-out;
  84. -webkit-transition: .8s ease-in-out;
  85. -moz-transition: .8s ease-in-out;
  86. -o-transition: .8s ease-in-out;
  87. }
  88.  
  89. ::selection {
  90. background-color:{color:Accent};
  91. color:white;
  92. }
  93.  
  94. ::-moz-selection {
  95. background-color:{color:accent};
  96. color:white;
  97. }
  98.  
  99. *, body, a, a:hover, a:active { cursor:url(https://31.media.tumblr.com/4b32a8c60c9e7a01890827f616c6ed74/tumblr_inline_n7563jM9Gt1qcs1bb.png), auto;}
  100.  
  101. body {
  102. background:{color:background};
  103. margin:0px;
  104. color:{color:text};
  105. font-family:times;
  106. font-size:9px;
  107. line-height:112%;
  108. }
  109.  
  110. a {
  111. text-decoration:none;
  112. -moz-outline-style:none;
  113. color:{color:link};
  114. transition:0.5s ease-in-out;
  115. -webkit-transition:0.5s ease-in-out;
  116. -moz-transition:0.5s ease-in-out;
  117. -ms-transition:0.5s ease-in-out;
  118. -o-transition:0.5s ease-in-out;
  119. }
  120.  
  121. a:hover {color:{color:hover};text-decoration:line-through;}
  122.  
  123. img {border:none;max-width:100%;}
  124. h1 {font-size:12px;text-transform:uppercase;}
  125. h2 {font-size:17px;}
  126.  
  127. blockquote {
  128. padding-left:5px;
  129. border-left:2px solid;
  130. }
  131.  
  132. blockquote blockquote {
  133. padding-left:5px;
  134. border-left:2px solid;
  135. }
  136.  
  137. pre {
  138. padding:3px 5px;
  139. text-transform:uppercase;
  140. font-family:consolas;
  141. white-space: pre-wrap;
  142. white-space: -moz-pre-wrap;
  143. white-space: -pre-wrap;
  144. white-space: -o-pre-wrap;
  145. word-wrap: break-word;
  146. }
  147.  
  148. b, strong {font-weight:700;}
  149. small, sub {font-size:7px;}
  150. big {font-size:13px;}
  151. ol {list-style:lower-roman;line-height:123%;}
  152. li {list-style:square;line-height:123%;}
  153.  
  154. #sidebar {
  155. height:100%;
  156. position:fixed;
  157. width:300px;
  158. left:70px;
  159. padding-top:100px;
  160. opacity:1;
  161. padding-right:70px;
  162. z-index:2;
  163. }
  164.  
  165. #sidebarimage {width: 300px;}
  166.  
  167. #sidebarimage img {
  168. width:300px;
  169. padding:6px 0;
  170. z-index:888;
  171. position:relative;
  172. }
  173.  
  174. #title {
  175. font-size:15px;
  176. font-family:Microsoft Yehei, times;
  177. width:280px;
  178. text-transform:uppercase;
  179. padding:5px 10px;
  180. text-align:center;
  181. }
  182.  
  183. #title a {
  184. letter-spacing:1px;
  185. border-bottom:1px dotted {color:link};
  186. text-decoration:none;
  187. padding:2px 5px;
  188. transition:0.5s ease-in-out;
  189. -webkit-transition:0.5s ease-in-out;
  190. -moz-transition:0.5s ease-in-out;
  191. -ms-transition:0.5s ease-in-out;
  192. -o-transition:0.5s ease-in-out;
  193. }
  194.  
  195. #title a:hover {
  196. padding:2px 15px;
  197. letter-spacing:0.5em;
  198. text-decoration:none;
  199. }
  200.  
  201. .desc {
  202. position:fixed;
  203. margin-top:10px;
  204. font-family:cambria;
  205. line-height:110%;
  206. font-size:9px;
  207. font-style:italic;
  208. width:280px;
  209. height:auto;
  210. padding:10px;
  211. text-align:justify;
  212. color:{color:text};
  213. }
  214.  
  215. .links {
  216. position:fixed;
  217. margin-top:-6px;
  218. margin-left:-5px;
  219. width:260px;
  220. padding:10px 20px;
  221. word-spacing:2px;
  222. font-family:times;
  223. text-align:center;
  224. text-transform:uppercase;
  225. }
  226.  
  227. .links a {
  228. font-size: 9px;
  229. }
  230.  
  231. .links a:hover {
  232. color:{color:Hover};
  233. text-decoration:underline;
  234. }
  235.  
  236. #pagi{
  237. width:300px;
  238. font-size:8px;
  239. text-align:center;
  240. margin-top:40%;
  241. font-family:cambria;
  242. letter-spacing:0px;
  243. }
  244.  
  245. .current_page {
  246. height:10px;
  247. width:20px;
  248. padding:5px;
  249. border:solid 1px {color:line};
  250. }
  251.  
  252. .jump_page {
  253. border:none;
  254. height:10px;
  255. width:20px;
  256. padding:5px;
  257. }
  258.  
  259. #all {
  260. padding:10px 70px;
  261. width:500px;
  262. font-size:10px;
  263. z-index:2;
  264. margin:auto;
  265. }
  266.  
  267. #posts {
  268. width:500px;
  269. padding-bottom:20px;
  270. padding:10px 0;
  271. margin-top:30px;
  272. background-color:{color:Post};
  273. -ms-word-break: break-all;
  274. word-break: break-all;
  275. word-break: break-word;
  276. -webkit-hyphens: auto;
  277. -moz-hyphens: auto;
  278. -ms-hyphens: auto;
  279. hyphens: auto;
  280. }
  281.  
  282. #details {
  283. text-align:center;
  284. margin-top:8px;
  285. text-transform:uppercase;
  286. font-size:8px;
  287. font-style:none;
  288. border-top:1px solid {color:Line};
  289. }
  290.  
  291. #tags {
  292. font-family:cambria;
  293. letter-spacing:0px;
  294. text-transform:lowercase;
  295. font-size:10px;
  296. margin-top:2px;
  297. text-align:center;
  298. width:500px;
  299. height:30px;
  300. opacity:0;
  301. transition:0.5s ease-in-out;
  302. -webkit-transition:0.5s ease-in-out;
  303. -moz-transition:0.5s ease-in-out;
  304. -ms-transition:0.5s ease-in-out;
  305. -o-transition:0.5s ease-in-out;
  306. }
  307.  
  308. #tags a {
  309. display:inline-block;
  310. padding:3px;
  311. text-align:center;
  312. color:{color:Tags};
  313. }
  314.  
  315. #tags a:hover {
  316. text-decoration:underline;
  317. color:{color:hover};
  318. }
  319.  
  320. #tags .comma:last-child {display:none;}
  321.  
  322. #posts:hover #tags {opacity:1;}
  323.  
  324. #question {
  325. padding:10px;
  326. font-family:cambria;
  327. letter-spacing:2px;
  328. text-align:center;
  329. border:1px {color:border} dotted;
  330. color:{color:text};
  331. background-color:{color:background};
  332. }
  333.  
  334. #akport {
  335. width:500px;
  336. text-align:center;
  337. height:12px;
  338. padding:5px 0;
  339. color:#444;
  340. opacity:1;
  341. background-color:{color:background};
  342. z-index:99999;
  343. margin-bottom:3px;
  344. }
  345.  
  346. #akport a {
  347. background-color:{color:background};
  348. text-align:center;
  349. text-decoration:none;
  350. }
  351.  
  352. #akport a:hover {
  353. text-decoration:none;
  354. letter-spacing:0.8em;
  355. }
  356.  
  357. .tumblr_audio_player {width:100%;}
  358.  
  359. .player {
  360. width:30px;
  361. height:30px;
  362. overflow:hidden;
  363. background:white;
  364. margin:0 auto;
  365. text-align:center;
  366. }
  367.  
  368. .audioinfo {
  369. margin-top:15px;
  370. text-align:center;
  371. color:{color:accent};
  372. }
  373.  
  374. .chat li {list-style:none;line-height:110%;}
  375. .line.odd {background-color:#f2f2f2;padding:3px 5px;}
  376. .line.even {padding:0;}
  377.  
  378. #caption {
  379. width:500px;
  380. -ms-word-break: break-all;
  381. word-break: break-all;
  382. word-break: break-word;
  383. -webkit-hyphens: auto;
  384. -moz-hyphens: auto;
  385. -ms-hyphens: auto;
  386. hyphens: auto;
  387. }
  388.  
  389. #notecontain {
  390. width:400px;
  391. padding:20px 49px;
  392. text-align:center;
  393. border:dotted 1px {color:border};
  394. }
  395.  
  396. #notes {
  397. width:300px;
  398. height:150px;
  399. padding:5px 10px;
  400. overflow-y:scroll;
  401. overflow-x:hidden;
  402. text-align:justify;
  403. margin:0 40px 0px 30px;
  404. line-height:125%;
  405. }
  406.  
  407. #notes img {display:none;}
  408. #notes ol, #notes li {list-style:circle;line-height:125%;}
  409.  
  410. #s-m-t-tooltip {
  411. max-width:300px;
  412. padding: 3px 5px;
  413. margin:10px;
  414. background-color:{color:background};
  415. font-family:times;
  416. font-size:9px;
  417. font-style:bold;
  418. letter-spacing:1px;
  419. text-transform:uppercase;
  420. color:{color:tooltip};
  421. z-index:10000000000000000000000000000000000000000000000000000000000;
  422. -moz-transition-duration: 0.3s;
  423. -webkit-transition-duration: 0.3s;
  424. -o-transition-duration: 0.3s;
  425. }
  426.  
  427. #credit, #credit a {
  428. position:fixed;
  429. bottom:4px;
  430. right:4px;
  431. padding:5px 4px;
  432. font-family: helvetica;
  433. text-transform:uppercase;
  434. color:#aaa;
  435. font-size:10px;
  436. -moz-transition-duration:0.3s;
  437. -webkit-transition-duration:0.3s;
  438. -o-transition-duration:0.3s;
  439. -ms-transition-duration:0.3s;
  440. }
  441.  
  442. #credit:hover, #credit a:hover {
  443. font-family: helvetica;
  444. text-decoration:none;
  445. color:#000;
  446. background-color:#fff;
  447. text-shadow:#aaa 2px 2px;
  448. -moz-transition-duration:0.4s;
  449. -webkit-transition-duration:0.4s;
  450. -o-transition-duration:0.4s;
  451. -ms-transition-duration:0.4s;
  452. }
  453.  
  454.  
  455. {CustomCSS}</style></head><body>
  456.  
  457. <div id="sidebar">
  458. <div id="title"><a href="/">{text:Blog Title}</a></div>
  459. <div id="sidebarimage">
  460. <img src="{image:sidebar}">
  461. </div>
  462. <div class="links">
  463. {block:ifAskPopup}<a href="#?w=500" rel="mailyo" class="poplight">{text:linkA}</a>{/block:ifAskPopup}
  464. {block:ifNoPopup}<a href="{text:linkA url}">{text:linkA}</a>{/block:ifNoPopup}
  465. <a href="{text:linkB url}">{text:linkB}</a>
  466. <a href="{text:linkC url}">{text:linkC}</a>
  467. <a href="{text:linkD url}">{text:linkD}</a>
  468. <a href="{text:linkE url}">{text:linkE}</a>
  469. </div>
  470. <div class="desc">
  471. {Description}
  472. </div>
  473. {block:Pagination}<div id="pagi">
  474. {block:PreviousPage}<a href="{PreviousPage}">&larr;</a>&nbsp;&nbsp;{/block:PreviousPage}
  475. {block:JumpPagination length="3"}
  476. {block:CurrentPage}<span class="current_page">{PageNumber}</span>&nbsp;&nbsp;{/block:CurrentPage}
  477. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>&nbsp;&nbsp;{/block:JumpPage}
  478. {/block:JumpPagination}
  479. {block:NextPage}<a href="{NextPage}">&rarr;</a>{/block:NextPage}
  480. </div>{/block:Pagination}
  481. </div>
  482.  
  483. <div id="all">{block:Posts}<div id="posts">
  484.  
  485. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  486.  
  487. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  488.  
  489. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  490.  
  491. {block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  492.  
  493. {block:Quote}<h2 style="text-shadow:2px 2px 0px #f1f1f1; text-align:center; line-height:115%">“{Quote}”</h2><br> <div style="text-align:center">—{Source}</div><br>{/block:Quote}
  494.  
  495. {block:Audio}
  496. <div class="player">{AudioPlayerWhite}</div>
  497. <div class="audioinfo">
  498. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist} — {Artist}{/block:Artist}
  499. </div>
  500. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:Audio}
  501.  
  502. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  503.  
  504. {block:Chat}<div class="chat">{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}<li class="line {Alt}">{block:Label}<b>{Label}</b>{/block:Label} {Line}</li><br>{/block:Lines}</div>{/block:Chat}
  505.  
  506. {block:Answer}<div id="question"><span style="text-transform:uppercase;font-size:10px; padding-bottom:10px"><div id="akport">{Asker}</div></span>{Question}</div><left>{Answer}</left>{/block:Answer}
  507.  
  508. <div id="details">
  509. <div style="margin-left:490px; margin-bottom:-15px" title="reblog">{ReblogButton color="grey" size="10"}</div>
  510. <br> {block:Date}<a href="{Permalink}">{ShortMonth} {DayOfMonthWithZero} {12Hour} {AMPM}</a>{/block:Date}{block:RebloggedFrom} | <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}{block:ContentSource} | <a href="{SourceURL}" title="{SourceTitle}">©</a>{/block:ContentSource}{block:NoteCount} | <a href="{Permalink}">♥{NoteCount}</a>{/block:NoteCount}{block:HasTags}<div id="tags">{block:Tags} <a href="{TagURL}">{Tag}</a><span class="comma">,</span> {/block:Tags}</div>{/block:HasTags}
  511. </div>
  512. {/block:Posts}
  513. {block:PostNotes}<div id="notecontain"><div id="notes">{PostNotes}</div></div>{/block:PostNotes}
  514. {/block:Posts}
  515. </div></div>
  516.  
  517. {block:ifFlowers}
  518. <script type="text/javascript">
  519.  
  520.  
  521. var snowcolor=new Array("#FBB7B7", "#FAA5CD", "#FEE7F1", "#EFC3D8")
  522. var snowmax=150
  523. var snowtype=new Array("Times", "Arial", "Georgia", "Cambria", "Calibri")
  524. var snowletter="❀"
  525. var sinkspeed=0.8
  526. var snowmaxsize=20
  527. var snowminsize=7
  528. var snowingzone=1
  529.  
  530.  
  531. var snow=new Array()
  532. var marginbottom
  533. var marginright
  534. var timer
  535. var i_snow=0
  536. var x_mv=new Array();
  537. var crds=new Array();
  538. var lftrght=new Array();
  539. var browserinfos=navigator.userAgent
  540. var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
  541. var ns6=document.getElementById&&!document.all
  542. var opera=browserinfos.match(/Opera/)
  543. var browserok=ie5||ns6||opera
  544.  
  545. function randommaker(range) {
  546. rand=Math.floor(range*Math.random())
  547. return rand
  548. }
  549.  
  550. function initsnow() {
  551. if (ie5 || opera) {
  552. marginbottom = document.body.scrollHeight
  553. marginright = document.body.clientWidth-15
  554. }
  555. else if (ns6) {
  556. marginbottom = document.body.scrollHeight
  557. marginright = window.innerWidth-15
  558. }
  559. var snowsizerange=snowmaxsize-snowminsize
  560. for (i=0;i<=snowmax;i++) {
  561. crds[i] = 0;
  562. lftrght[i] = Math.random()*15;
  563. x_mv[i] = 0.03 + Math.random()/10;
  564. snow[i]=document.getElementById("s"+i)
  565. snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)]
  566. snow[i].size=randommaker(snowsizerange)+snowminsize
  567. snow[i].style.fontSize=snow[i].size+'px';
  568. snow[i].style.color=snowcolor[randommaker(snowcolor.length)]
  569. snow[i].style.zIndex=1000
  570. snow[i].sink=sinkspeed*snow[i].size/5
  571. if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
  572. if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
  573. if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
  574. if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
  575. snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size)
  576. snow[i].style.left=snow[i].posx+'px';
  577. snow[i].style.top=snow[i].posy+'px';
  578. }
  579. movesnow()
  580. }
  581.  
  582. function movesnow() {
  583. for (i=0;i<=snowmax;i++) {
  584. crds[i] += x_mv[i];
  585. snow[i].posy+=snow[i].sink
  586. snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i])+'px';
  587. snow[i].style.top=snow[i].posy+'px';
  588.  
  589. if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){
  590. if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
  591. if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
  592. if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
  593. if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
  594. snow[i].posy=0
  595. }
  596. }
  597. var timer=setTimeout("movesnow()",50)
  598. }
  599.  
  600. for (i=0;i<=snowmax;i++) {
  601. document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>")
  602. }
  603. if (browserok) {
  604. window.onload=initsnow
  605. }
  606.  
  607. </script>
  608. {/block:ifFlowers}
  609.  
  610. <div id="credit"><a href="http://lunecerise.tumblr.com" title="lunecerise">LC</a></div>
  611.  
  612. </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!