Advertisement
cocoofrps

THEME 15 'FUNKY CURLS'

Feb 24th, 2014
492
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.19 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  4. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  5. <script>
  6. (function($){
  7. $(document).ready(function(){
  8. $("[title]").style_my_tooltips({
  9. tip_follows_cursor:true,
  10. tip_delay_time:200,
  11. tip_fade_speed:300
  12. }
  13. );
  14. });
  15. })(jQuery);
  16. </script>
  17.  
  18. <head>
  19.  
  20.  
  21. <head><title>{Title}</title>
  22.  
  23. <link rel="shortcut icon" href="{Favicon}">
  24. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  25. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  26.  
  27. <!--- THEME BY @cocoofrps --->
  28.  
  29. <meta name="color:Background" content="#845c67"/>
  30. <meta name="color:Text" content="#b0a799"/>
  31. <meta name="color:PostBG" content="#685050"/>
  32. <meta name="color:SidebarBorder" content="#916673" />
  33. <meta name="color:Border" content="#a58e8a"/>
  34. <meta name="color:Hover" content="#b6aea1"/>
  35. <meta name="color:Scrollbar" content="#a58e8a"/>
  36. <meta name="color:ScrollbarBg" content="#b6aea1"/>
  37. <meta name="color:Post Links" content="#b1aa9a"/>
  38. <meta name="color:DescriptionText" content="#966c78"/>
  39.  
  40. <meta name="image:Background" content=""/>
  41. <meta name="image:Sidebar" content=""/>
  42. <meta name="image:Border BG" content=""/>
  43. <meta name="image:title" content=""/>
  44. <meta name="image:AskBackground" content=""/>
  45.  
  46. <meta name="text:LINK1" content="REFRESH"/>
  47. <meta name="text:LINK2" content="INQUIRE"/>
  48. <meta name="text:LINK3" content="NAVI"/>
  49. <meta name="text:LINK4" content="PLOT"/>
  50. <meta name="text:LINK5" content="CHARAS"/>
  51. <meta name="text:LINK6" content="APPCOUNT"/>
  52. <meta name="text:LINK1URL" content="/"/>
  53. <meta name="text:LINK2URL" content="/ask"/>
  54. <meta name="text:LINK3URL" content="/etc"/>
  55. <meta name="text:LINK4URL" content="/plot"/>
  56. <meta name="text:LINK5URL" content="/charas"/>
  57. <meta name="text:LINK6URL" content="/appcount"/>
  58.  
  59. <meta name="if:CoverBackgroundImage" content="0"/>
  60.  
  61. <style type="text/css">
  62.  
  63. ::-webkit-scrollbar-thumb {
  64. height:auto;
  65. border:{color:ScrollbarBg};
  66. border:1px solid {color:ScrollbarBg};
  67. background-color:{color:Scrollbar};
  68. }
  69.  
  70. ::-webkit-scrollbar {
  71. height:9px;
  72. width:5px;
  73. background-color:{color:ScrollbarBg};
  74. }
  75.  
  76. ::selection {
  77. background: {color:Background};
  78. color: {color:PostBG};
  79. }
  80.  
  81. ::-moz-selection {
  82. background: {color:Background};
  83. color: {color:PostBG};
  84. }
  85.  
  86. ::-webkit-selection {
  87. background: {color:Background};
  88. color: {color:PostBG};
  89. }
  90.  
  91. body {
  92. overflow-y:scroll;
  93. background:{color:Background};
  94. margin:0px;
  95. color:{color:Text};
  96. font-family:'arial';
  97. font-size:10px;
  98. line-height:110%;
  99. letter-spacing:1px;
  100. text-align:justify;
  101. {block:ifNotCoverBackgroundImage}
  102. background-image:url('{image:Background}');
  103. background-attachment:fixed;
  104. {block:ifNotCoverBackgroundImage}
  105. {block:IfCoverBackgroundImage}
  106. background: url('{image:Background}') no-repeat center center fixed;
  107. -webkit-background-size: cover;
  108. -moz-background-size: cover;
  109. -o-background-size: cover;
  110. background-size: cover;
  111. {block:IfCoverBackgroundImage}
  112. }
  113.  
  114. small,big {
  115. font-size:10px;
  116. }
  117.  
  118. pre {
  119. font-family:consolas;
  120. width:484px;
  121. padding:5px 8px;
  122. border-top:2px solid {color:SidebarBorder};
  123. border-bottom:2px solid {color:SidebarBorder};
  124. }
  125. a {
  126. text-decoration:none;
  127. outline:none;
  128. font-weight:400;
  129. -moz-outline-style:none;
  130. color:{color:Post Links};
  131. }
  132.  
  133. b {
  134. color:{color:border};
  135. font-weight:100;
  136. }
  137.  
  138. a:hover {
  139. color:{color:Hover};
  140. -webkit-transition: all 0.4s ease-in-out;
  141. -moz-transition: all 0.4s ease-in-out;
  142. -o-transition: all 0.4s ease-in-out;
  143. -ms-transition: all 0.4s ease-in-out;
  144. transition: all 0.4s ease-in-out;
  145. }
  146.  
  147. img {
  148. border:none;
  149. }
  150.  
  151. blockquote {
  152. margin-left:5px;
  153. padding-left:5px;
  154. border-left:2px solid {color:Border};
  155. }
  156.  
  157. blockquote blockquote {
  158. padding-left:5px;
  159. border-left:2px solid {color:Border};
  160. }
  161.  
  162. h1 {
  163. font-size:11px;
  164. letter-spacing:2px;
  165. text-transform:uppercase;
  166. font-style:none;
  167. line-height:10px;
  168. text-align:center;
  169. padding:0px;
  170. }
  171.  
  172. /*ENTRIES*/
  173. #right {
  174. position:fixed;
  175. width:605px;
  176. height:100%;
  177. background-color:{color:Background};
  178. margin-top:0px;
  179. margin-left:70px;
  180. }
  181.  
  182. #entries {
  183. width:500px;
  184. position:absolute;
  185. margin-left:100px;
  186. margin-top:40px;
  187. letter-spacing:1px;
  188. font-weight:100;
  189. font-size:8px;
  190. z-index:40;
  191. }
  192. #post {
  193. background-color:{color:PostBG};
  194. width:500px;
  195. padding-bottom:20px;
  196. padding:20px;
  197. border:2px solid {color:Border};
  198. margin-top:10px;
  199. }
  200.  
  201. /*SIDEBAR*/
  202.  
  203.  
  204. #sidebar {
  205. position:fixed;
  206. margin-left:700px;
  207. margin-top:150px;
  208. }
  209.  
  210. #title img {
  211. position:fixed;
  212. margin-top:-100px;
  213. }
  214.  
  215. #image img{
  216. position:fixed;
  217. margin-top:5px;
  218. margin-left:0px;
  219. }
  220.  
  221. #left {
  222. position:fixed;
  223. width:400px;
  224. margin-top:-5px;
  225. height:400px;
  226. -webkit-transition: all 0.4s ease-in-out;
  227. -moz-transition: all 0.4s ease-in-out;
  228. -o-transition: all 0.4s ease-in-out;
  229. -ms-transition: all 0.4s ease-in-out;
  230. transition: all 0.4s ease-in-out;
  231. }
  232.  
  233. #sidebar:hover .poop{
  234. height:500px;
  235. -webkit-transition: all 0.4s ease-in-out;
  236. -moz-transition: all 0.4s ease-in-out;
  237. -o-transition: all 0.4s ease-in-out;
  238. -ms-transition: all 0.4s ease-in-out;
  239. transition: all 0.4s ease-in-out;
  240. }
  241.  
  242. .poop {
  243. background-image:url('{image:Border BG}');
  244. border-top:10px solid {color:SidebarBorder};
  245. border-bottom:10px solid {color:SidebarBorder};
  246. }
  247.  
  248. #desc {
  249. position:fixed;
  250. width:200px;
  251. margin-left:100px;
  252. margin-top:355px;
  253. padding:5px;
  254. opacity:0.8;
  255. height:40px;
  256. overflow-y:auto;
  257. background-color:{color:Text};
  258. -webkit-transition: all 0.4s ease-in-out;
  259. -moz-transition: all 0.4s ease-in-out;
  260. -o-transition: all 0.4s ease-in-out;
  261. -ms-transition: all 0.4s ease-in-out;
  262. transition: all 0.4s ease-in-out;
  263. }
  264.  
  265. #desc p {
  266. color:{color:DescriptionText};
  267. line-height:100%;
  268. display:inline;
  269. -webkit-transition: all 0.4s ease-in-out;
  270. -moz-transition: all 0.4s ease-in-out;
  271. -o-transition: all 0.4s ease-in-out;
  272. -ms-transition: all 0.4s ease-in-out;
  273. transition: all 0.4s ease-in-out;
  274. }
  275.  
  276. #sidebar:hover #desc {
  277. margin-top:200px;
  278. opacity:0.9;
  279. height:auto;
  280. -webkit-transition: all 0.4s ease-in-out;
  281. -moz-transition: all 0.4s ease-in-out;
  282. -o-transition: all 0.4s ease-in-out;
  283. -ms-transition: all 0.4s ease-in-out;
  284. transition: all 0.4s ease-in-out;
  285. }
  286.  
  287. .links {
  288. padding:10px;
  289. margin-top:385px;
  290. margin-left:-10px;
  291. opacity:0;
  292. width:100px;
  293. -webkit-transition: all 0.4s ease-in-out;
  294. -moz-transition: all 0.4s ease-in-out;
  295. -o-transition: all 0.4s ease-in-out;
  296. -ms-transition: all 0.4s ease-in-out;
  297. transition: all 0.4s ease-in-out;
  298. }
  299.  
  300. .links a {
  301. width:190px;
  302. display:block;
  303. padding:5px;
  304. background-color:{color:ScrollbarBG};
  305. color:{color:Scrollbar};
  306. -webkit-transition: all 0.4s ease-in-out;
  307. -moz-transition: all 0.4s ease-in-out;
  308. -o-transition: all 0.4s ease-in-out;
  309. -ms-transition: all 0.4s ease-in-out;
  310. transition: all 0.4s ease-in-out;
  311. }
  312.  
  313. .links a:hover {
  314. background-color:{color:Scrollbar};
  315. color:{color:ScrollbarBG};
  316. -webkit-transition: all 0.4s ease-in-out;
  317. -moz-transition: all 0.4s ease-in-out;
  318. -o-transition: all 0.4s ease-in-out;
  319. -ms-transition: all 0.4s ease-in-out;
  320. transition: all 0.4s ease-in-out;
  321. }
  322.  
  323. #sidebar:hover .links {
  324. opacity:0.8;
  325. -webkit-transition: all 0.4s ease-in-out;
  326. -moz-transition: all 0.4s ease-in-out;
  327. -o-transition: all 0.4s ease-in-out;
  328. -ms-transition: all 0.4s ease-in-out;
  329. transition: all 0.4s ease-in-out;
  330. }
  331.  
  332. #pagination {
  333. margin-top:5px;
  334. position:fixed;
  335. padding:5px;
  336. width:150px;
  337. z-index:99000000;
  338. font-family:'arial';
  339. text-transform:uppercase;
  340. background-color:{color:Scrollbar};
  341. }
  342.  
  343. #pagination a{
  344. font-style:bold;
  345. font-size:8px;
  346. padding:5px;
  347. color:{color:ScrollbarBG};
  348. text-align:center;
  349. z-index:-111;
  350. -webkit-transition: all 0.4s ease-in-out;
  351. -moz-transition: all 0.4s ease-in-out;
  352. -o-transition: all 0.4s ease-in-out;
  353. -ms-transition: all 0.4s ease-in-out;
  354. transition: all 0.4s ease-in-out;
  355. }
  356.  
  357. #pagination a:hover {
  358. color:{color:Background};
  359. -webkit-transition: all 0.4s ease-in-out;
  360. -moz-transition: all 0.4s ease-in-out;
  361. -o-transition: all 0.4s ease-in-out;
  362. -ms-transition: all 0.4s ease-in-out;
  363. transition: all 0.4s ease-in-out;
  364. }
  365.  
  366.  
  367. /*AUDIO INFO*/
  368.  
  369. .playerbuttonbg {
  370. position: absolute;
  371. left: 15px;
  372. top: 15px;
  373. width: 30px;
  374. height: 30px;
  375. background-color: #ffffff;
  376. padding: 10px;
  377. opacity: .4;
  378. filter: alpha(opacity=40);
  379. -moz-opacity: 0.4;
  380. -khtml-opacity: 0.4;
  381. transition: opacity .7s ease-in-out;
  382. -moz-transition: opacity .7s ease-in-out;
  383. -webkit-transition: opacity .7s ease-in-out;
  384. }
  385.  
  386. .playerbuttonbg:hover {
  387. opacity: 1;
  388. filter: alpha(opacity=100);
  389. -moz-opacity: 1;
  390. -khtml-opacity: 1;
  391. }
  392.  
  393. .newplayerbutton {
  394. position: relative;
  395. width:30px;
  396. height:30px;
  397. margin-top:-4px;
  398. overflow: hidden;
  399. }
  400.  
  401. .playerbuttonhug {
  402. position: absolute;
  403. top: -25px;
  404. left: -10px;
  405. }
  406.  
  407. .tumblr_audio_player {
  408. height: 90px;
  409. width: 270px;
  410.  
  411. -moz-transform-origin: top left;
  412. -webkit-transform-origin: top left;
  413. -o-transform-origin: top left;
  414. -ms-transform-origin: top left;
  415. transform-origin: top left;
  416. }
  417.  
  418. .audioimgwrapper {
  419. position: absolute;
  420. left: 0px;
  421. top: 0px;
  422. overflow: hidden;
  423. width: 79px;
  424. height: 79px;
  425. }
  426.  
  427. .audioimgwrapper img {
  428. width: 100%;
  429. height: auto;
  430. }
  431.  
  432. .trackdetails {
  433. text-transform:uppercase;
  434. width: auto;
  435. display:inline-block;
  436. margin-top:23px;
  437. margin-left: 90px;
  438. min-height: 85px;
  439. }
  440.  
  441. .audiowrapper {
  442. position: relative;
  443. display:inline-block;
  444. }
  445.  
  446. /*POST INFO*/
  447.  
  448. #info {
  449. text-align:right;
  450. font-family:'helvetica';
  451. letter-spacing:1px;
  452. font-size:7px;
  453. font-style:none;
  454. color:{color:Border};
  455. line-height:10px;
  456. text-transform:uppercase;
  457. padding:5px;
  458. background-color:{color:Background};
  459. border-color:{color:Border};
  460. }
  461.  
  462. #info a {
  463. text-align:right;
  464. color:{color:Border};
  465. }
  466.  
  467. #info a:hover {
  468. -moz-transition-duration:0.3s;
  469. -webkit-transition-duration:0.3s;
  470. -o-transition-duration:0.3s;
  471. color:{color:Hover}
  472. }
  473.  
  474. #tags {
  475. margin-top:4px;
  476. width:500px;
  477. text-align:right;
  478. font-size:8px;
  479. margin-left:-5px;
  480. font-family:'arial';
  481. opacity:1;
  482. padding:0px;
  483. text-transform:lowercase;
  484. transition-duration: 0.5s;
  485. -moz-transition-duration: 0.5s;
  486. -webkit-transition-duration: 0.5s;
  487. -o-transition-duration: 0.5s
  488. color:{color:Post Links};
  489. background-color:{color:Border};
  490. }
  491.  
  492. #tags a {
  493. padding:5px;
  494. letter-spacing:0px;
  495. color:{color:Background};
  496. font-family:'helvetica';
  497. text-decoration:none;
  498. display:inline-block;
  499. }
  500.  
  501.  
  502. #sweg {
  503. margin-top:300px;
  504. position:fixed;
  505. }
  506. #tags a:hover {
  507. -moz-transition-duration:0.3s;
  508. -webkit-transition-duration:0.3s;
  509. -o-transition-duration:0.3s;
  510. color:{color:Hover};
  511. }
  512.  
  513. /*QUESTION*/
  514.  
  515. #asker {
  516. padding:14px;
  517. background-image:url('{image:AskBackground}');
  518. font-size:11px;
  519. letter-spacing:0px;
  520. text-align:left;
  521. margin-top:0px;
  522. border:2px solid {color:Border};
  523. text-transform:lowercase;
  524. line-height:100%;
  525. }
  526.  
  527. #q {
  528. border:2px solid {color:Border};
  529. -webkit-border-radius: 5px;
  530. -moz-border-radius: 5px;
  531. -o-border-radius: 5px;
  532. -ms-border-radius: 5px;
  533. border-radius: 5px;
  534. }
  535.  
  536. /*CREDIT*/
  537.  
  538. #cred {
  539. position:fixed;
  540. font-family:'helvetica';
  541. text-transform:uppercase;
  542. font-size:20px;
  543. background-color:{color:PostBG};
  544. right:9px;
  545. bottom:9px;
  546. padding:5px;
  547. padding-bottom:11px;
  548. border:2px solid {color:Background};
  549. letter-spacing:1px;
  550. }
  551.  
  552. #notes {
  553. font-family:helvetica;
  554. text-transform:uppercase;
  555. }
  556.  
  557. #notes li{
  558. list-style-type:none;
  559. background-color:{color:PostBG};
  560. padding:6px;
  561. }
  562.  
  563. #notes img {
  564. opacity:0;
  565. }
  566.  
  567. #s-m-t-tooltip{
  568. position:absolute;
  569. background-color:{color:PostBG};
  570. padding:3px;
  571. z-index:9999;
  572. border-left:5px solid {color:DescriptionText};
  573. margin-top:-10px;
  574. margin-left:5px;
  575. display:block;
  576. text-transform:uppercase;
  577. font-size:7px;
  578. color:{color:text};
  579. }
  580.  
  581.  
  582. {CustomCSS}</style>
  583. </head><body>
  584. <div id="sidebar">
  585. <div id="title"><img src="{image:Title}"></div>
  586. <div id="left" class="poop">
  587. <div class="links">
  588. <a href="{text:LINK1URL}">{text:LINK1}</a>
  589. <a href="{text:LINK2URL}">{text:LINK2}</a>
  590. <a href="{text:LINK3URL}">{text:LINK3}</a>
  591. <br/><div style="margin-left:200px;margin-top:-74px;">
  592. <a href="{text:LINK4URL}">{text:LINK4}</a>
  593. <a href="{text:LINK5URL}">{text:LINK5}</a>
  594. <a href="{text:LINK6URL}">{text:LINK6}</a>
  595. </div>
  596. </div>
  597. </div>
  598. <div id="image"><img src="{image:Sidebar}"></div>
  599. <div id="desc"><p>{Description}</p></div>
  600. {block:Pagination}
  601. <div id="pagination">
  602. {block:PreviousPage}<a href="{PreviousPage}" title="back"><big>PREV</big> // </a>{/block:PreviousPage}
  603. {block:NextPage}<a href="{NextPage}" title="next"><big> NEXT</big></a>{/block:NextPage}
  604. </div>
  605. {/block:Pagination}
  606. </div>
  607. <div id="right"></div>
  608. <div id="entries">
  609. {block:Posts}
  610. <div id="post">
  611.  
  612. {block:Text}
  613. <h1>{block:Title}<a href="{Permalink}" title="{Title}"><div style="border-top:2px solid {color:SidebarBorder};width:490px;font-size:10px;font-family:'arial';text-tranform:uppercase;padding:5px;background-color:{color:Border};color:{color:PostBG};">{Title}</div></a>{/block:Title}</h1>
  614. {Body}<br>{/block:Text}
  615.  
  616. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
  617. {block:Caption}{Caption}{/block:Caption}<br>{/block:Photo}
  618.  
  619. {block:Photoset}{Photoset-500}{block:Caption}{Caption}
  620. {/block:Caption}<br>{/block:Photoset}
  621.  
  622. {block:Quote}<div style="width:490px;font-size:11px;padding:5px;background-color:{color:Border};color:{color:PostBG};">"{Quote}"</div><br/>
  623. {block:Source}<div class="qsource"> —{Source}</div>
  624. {/block:Source}<br>{/block:Quote}
  625.  
  626. {block:Link}<a href="{URL}" {Target} title="{Name}"><div style="border-top:5px solid {color:SidebarBorder};width:490px;border-bottom:2px solid {color:SidebarBorder};font-size:11px;padding:5px;font-family:'arial';background-color:{color:Border};color:{color:PostBG};">{Name}</div></a>{block:Description}{Description}{/block:Description}<br>{/block:Link}
  627.  
  628. {block:Chat}{block:Title}{Title}{/block:Title}{block:Lines}{block:Label}<span style="font-size:15px;text-transform:uppercase;"><b>{Label}</b></span>{/block:Label} {Line}<br>{/block:Lines}<br>{/block:Chat}
  629.  
  630. {block:AudioPlayer}<div class="audiowrapper">{block:AlbumArt}<div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>{/block:AlbumArt} <div class="playerbuttonbg"><div class="newplayerbutton"><div class="playerbuttonhug">{AudioPlayerWhite}</div></div></div><div class="trackdetails">{block:TrackName}{TrackName}{/block:TrackName}<br/>{block:Artist}{Artist}{/block:Artist}<br/>{block:Album}{Album}{/block:Album}<br/></div></div>{block:Caption}{Caption}{/block:Caption}{/block:AudioPlayer}
  631.  
  632.  
  633. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}<br>{/block:Video}
  634.  
  635. <!--- Please don't steal anything. I find it rude and unethical. -->
  636. {block:Answer}<div id="asker"><span style="text-transform:uppercase;color:{color:Post Links};letter-spacing:2px;text-shadow:1px 1px 0px {color:PostBG};">{Asker}:</span></br>{Question}</div>{block:Answerer}</br><div style="padding:14px;border:2px solid {color:Border};padding-top:17px;padding-bottom:2px;"><span style="text-transform:uppercase;letter-spacing:2px;">{Answerer}:</span><div style="margin-top:-10px;">{Answer}</div></div>{/block:Answerer}{Replies}</br>{/block:Answer}
  637.  
  638. <div id="info">
  639. <a href="{Permalink}" title="{ShortMonth}.{DayOfMonth}.{Year}">{TimeAgo}</a>
  640. {block:NoteCount}
  641. | <a href="{Permalink}">{NoteCountWithLabel}{/block:NoteCount}</a>{block:RebloggedFrom} | <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom} {block:ContentSource} |
  642. <a href="{SourceURL}" title="{SourceTitle}">source</a>{/block:ContentSource}
  643. {block:RebloggedFrom} <a href="{ReblogParentURL}" title="Reblogged From" target="_blank"></a>{/block:RebloggedFrom}
  644. {block:HasTags}<div id="tags">
  645. {block:Tags} <a href="/tagged/{Tag}">#{Tag}</a>{/block:Tags}
  646. </div>{block:HasTags}
  647. </div>
  648. </div>
  649. {/block:Posts}
  650. <br><br>{block:PostNotes}<div id="notes"><left>{PostNotes}</div>{/block:PostNotes}
  651. {/block:Posts}</div></div></div>
  652. <br><br><br><br>
  653.  
  654. <div id="cred">
  655. <a href="http://cocoofrps.tumblr.com/" title="THEME 15 BY COCO">♚</a>
  656. </div>
  657. </div>
  658.  
  659.  
  660.  
  661. </body>
  662.  
  663. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement