Advertisement
cocoofrps

THEME 23 'TROPICO'

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