Advertisement
cocoofrps

THEME 20 'COCO & CHANEL'

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