Advertisement
cocoofrps

my theme right now :)

Mar 31st, 2015
560
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.18 KB | None | 0 0
  1. <html>
  2. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  3. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  4. <script>
  5. (function($){
  6. $(document).ready(function(){
  7. $("[title]").style_my_tooltips({
  8. tip_follows_cursor:true,
  9. tip_delay_time:200,
  10. tip_fade_speed:300
  11. }
  12. );
  13. });
  14. })(jQuery);
  15. </script>
  16.  
  17.  
  18. <head>
  19. <title>{Title}</title>
  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. <meta name="color:background" content="#fff"/>
  25. <meta name="color:text" content="#303030"/>
  26. <meta name="color:links" content="#303030"/>
  27. <meta name="color:bold" content="#303030"/>
  28. <meta name="color:other text" content="#303030"/>
  29. <meta name="color:hover" content="#f8f8f8"/>
  30. <meta name="color:highlight" content="#C8C8A9"/>
  31. <meta name="color:sidebar" content="#f8f8f8"/>
  32. <meta name="color:desc" content="#303030"/>
  33. <meta name="color:post links" content="#FE4365"/>
  34. <meta name="color:posts" content="#f0f0f0"/>
  35. <meta name="color:info" content="#fff"/>
  36. <meta name="color:scrollbar" content="#303030"/>
  37. <meta name="color:scrollbar bg" content="#f0f0f0"/>
  38.  
  39. <meta name="image:background" content=""/>
  40. <meta name="image:sidebar" content=""/>
  41.  
  42. <meta name="text:updates" content="home"/>
  43. <meta name="text:link 1" content="home"/>
  44. <meta name="text:link 2" content="inquire"/>
  45. <meta name="text:link 2 url" content="/ask"/>
  46. <meta name="text:link 3" content="navigate"/>
  47.  
  48. <style type="text/css">
  49.  
  50. ::-webkit-scrollbar-thumb {
  51. height:auto;
  52. background-color:{color:scrollbar};
  53. }
  54.  
  55. ::-webkit-scrollbar {
  56. height:9px;
  57. width:5px;
  58. background-color:{color:scrollbar bg};
  59. }
  60.  
  61. body {
  62. color:{color:text};
  63. background-color:{color:background};
  64. line-height:20px;
  65. font-size:11px;
  66. font-family:'Roboto', arial;
  67. background-image:url('{image:background}');
  68. background-attachment:fixed;
  69. }
  70.  
  71. small {
  72. font-size:11px;
  73. }
  74.  
  75. pre {
  76. font-family:'roboto','courier new';
  77. background-color:{color:highlight};
  78. display:block;
  79. padding:2px 10px;
  80. font-weight:600;
  81. text-transform:uppercase;
  82. }
  83.  
  84. a {
  85. text-decoration:none;
  86. color:{color:links};
  87. }
  88.  
  89. a:hover {
  90. color:{color:hover};
  91. }
  92.  
  93. b {
  94. color:{color:bold};
  95. }
  96.  
  97. u, i {
  98. color:{color:other text};
  99. }
  100.  
  101. #tab3 pre {
  102. color:{color:highlight};
  103. margin:0px;
  104. background-color:{color:sidebar};
  105. font-size:13px;
  106. margin-top:8px;
  107. text-align:right;
  108. font-weight:600;
  109. padding:0px;
  110. font-family:'roboto';
  111. }
  112.  
  113. h1, h2, h3, h4, h5, h6 {
  114. color:{color:background};
  115. font-size:12px;
  116. padding:5px 10px;
  117. background-color:{color:highlight};
  118. display:inline-block;
  119. font-family:'roboto',arial;
  120. }
  121.  
  122. blockquote {
  123. border-left:2px solid {color:highlight};
  124. padding-left:10px;
  125. margin-left:15px;
  126. }
  127.  
  128. /* SIDEBAR */
  129.  
  130. #b {
  131. position:fixed;
  132. top:0px;
  133. left:0px;
  134. z-index:99999999999;
  135. width:100%;
  136. border-top:10px solid {color:highlight};
  137. }
  138.  
  139. #b a {
  140. padding:3px 10px;
  141. display:inline-block;
  142. text-transform:uppercase;
  143. font-size:9px;
  144. font-weight:600;
  145. background-color:{color:highlight};
  146. }
  147.  
  148. #b a:first-child {
  149. margin-left:50px;
  150. }
  151.  
  152. #b a:hover {
  153. color:{color:background};
  154. }
  155.  
  156. #arrow {
  157. width:0;
  158. height:0;
  159. border-right:40px solid transparent;
  160. border-bottom:20px solid {color:sidebar};
  161. position:fixed;
  162. margin-top:80px;
  163. margin-left:50px;
  164. }
  165.  
  166. #sidebar {
  167. position:fixed;
  168. width:300px;
  169. margin-top:100px;
  170. margin-left:50px;
  171. font-size:9px;
  172. padding:20px;
  173. background-color:{color:sidebar};
  174. }
  175.  
  176. #sidebar img {
  177. width:300px;
  178. display:block;
  179. }
  180.  
  181. .pagi {
  182. padding:3px;
  183. font-size:8px;
  184. text-align:center;
  185. background-color:{color:highlight};
  186. display:block;
  187. }
  188.  
  189. .pagi a {
  190. display:inline-block;
  191. padding:2px 7px;
  192. }
  193.  
  194. .current_page {
  195. display:inline-block;
  196. padding:2px 7px;
  197. font-weight:600;
  198. font-size:8px;
  199. background-color:{color:posts};
  200. }
  201.  
  202. .desc {
  203. padding:25px;
  204. text-align:justify;
  205. }
  206.  
  207. .e {
  208. width:305px;
  209. margin-top:100px;
  210. position:fixed;
  211. height:400px;
  212. display:none;
  213. overflow:auto;
  214. font-size:9px;
  215. margin-left:50px;
  216. text-align:left;
  217. background-color:{color:posts};
  218. padding:20px;
  219. }
  220.  
  221. .e h1 {
  222. position:fixed;
  223. margin-top:-50px;
  224. text-transform:uppercase;
  225. margin-left:-20px;
  226. background-color:{color:posts};
  227. color:{color:highlight};
  228. }
  229.  
  230. .e b {
  231. display:block;
  232. text-align:center;
  233. font-size:11px;
  234. text-transform:uppercase;
  235. }
  236.  
  237. .e a {
  238. display:inline-block;
  239. width:150px;
  240. text-align:center;
  241. }
  242.  
  243.  
  244. /*ENTRIES*/
  245.  
  246. #entries {
  247. margin-left:450px;
  248. margin-top:100px;
  249. position:absolute;
  250. }
  251.  
  252. #post {
  253. width:500px;
  254. background-color:{color:posts};
  255. padding:20px;
  256. transition-duration: 0.5s;
  257. -moz-transition-duration: 0.5s;
  258. -webkit-transition-duration: 0.5s;
  259. -o-transition-duration: 0.5s;
  260. }
  261.  
  262. #post a {
  263. color:{color:post links};
  264. }
  265.  
  266. /* ANSWER POSTS */
  267.  
  268. .a b, .an a {
  269. display:inline-block;
  270. padding:3px 10px;
  271. background-color:{color:highlight};
  272. text-transform:lowercase;
  273. font-weight:600;
  274. color:{color:links};
  275. font-size:13px;
  276. }
  277.  
  278. #post .a a {
  279. color:{color:links};
  280. }
  281.  
  282. .q {
  283. padding:5px 10px;
  284. background-color:{color:highlight};
  285. margin-bottom:10px;
  286. }
  287.  
  288. /* QUOTE POSTS */
  289.  
  290. .s {
  291. text-align:right;
  292. }
  293.  
  294. /* AUDIO POSTS */
  295.  
  296. .ia {
  297. height:100px;
  298. }
  299.  
  300. .ia img {
  301. width:100px;
  302. }
  303.  
  304. .audio_player {
  305. overflow:hidden;
  306. width:27px;
  307. height:27px;
  308. }
  309.  
  310. .ap {
  311. padding:10px;
  312. background-color:#000;
  313. }
  314.  
  315. .ain {
  316. padding:10px;
  317. margin-top:-100px;
  318. margin-left:100px;
  319. width:380px;
  320. padding-top:55px;
  321. padding-bottom:5px;
  322. background-color:{color:highlight};
  323. position:absolute;
  324. }
  325.  
  326. /*NOTES*/
  327.  
  328. .n {
  329. margin-top:40px;
  330. width:500px;
  331. }
  332.  
  333. .n li {
  334. list-style-type:none;
  335. margin-left:-40px;
  336. }
  337.  
  338. .n img {
  339. display:none;
  340. }
  341.  
  342. .d.p {
  343. display:block;
  344. width:480px;
  345. text-transform:uppercase;
  346. }
  347.  
  348.  
  349. .o {
  350. width:500px;
  351. }
  352.  
  353. .o a {
  354. color:{color:highlight};
  355. display:inline-block;
  356. padding:3px;
  357. margin-left:10px;
  358. }
  359.  
  360. /*INFO*/
  361.  
  362. .i {
  363. text-transform:lowercase;
  364. font-size:9px;
  365. width:540px;
  366. margin-bottom:100px;
  367. background-color:{color:info};
  368. }
  369.  
  370.  
  371. a.d,a.v {
  372. padding:2px 10px;
  373. display:inline-block;
  374. background-color:{color:highlight};
  375. font-weight:bold;
  376. text-transform:uppercase;
  377. }
  378.  
  379. a.v {
  380. background-color:{color:posts};
  381. }
  382.  
  383. .icons {
  384. position:absolute;
  385. margin-top:-25px;
  386. right:0px;
  387. }
  388.  
  389. .likes, .reblogs {
  390. display:inline-block;
  391. padding:7px;
  392. }
  393.  
  394. .right {
  395. background-color:none;
  396. }
  397.  
  398. .right a {
  399. display:inline-block;
  400. padding:2px;
  401. }
  402.  
  403.  
  404. /*TAGS*/
  405.  
  406. .t {
  407. font-size:9px;
  408. transition-duration: 0.5s;
  409. -moz-transition-duration: 0.5s;
  410. -webkit-transition-duration: 0.5s;
  411. -o-transition-duration: 0.5s;
  412. }
  413.  
  414. #s-m-t-tooltip{
  415. position:absolute;
  416. background-color:rgba(0,0,0,0.7);
  417. padding:3px 10px;
  418. z-index:99999999999999999999999999999999;
  419. margin-top:30px;
  420. margin-left:30px;
  421. font-family:'roboto',arial;
  422. display:block;
  423. text-transform:uppercase;
  424. font-size:8px;
  425. color:{color:highlight};
  426. }
  427.  
  428. {CustomCSS}</style>
  429. <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Roboto:400,500,700,300' rel='stylesheet' type='text/css'>
  430. </head>
  431.  
  432. <body>
  433.  
  434. <!-- SIDEBAR -->
  435.  
  436. <div id="b">
  437. <a href="/">{text:link 1}</a><a href="{text:link 2 url}">{text:link 2}</a><a href="#" class="m">{text:link 3}</a><a href="http://cocoofrps.tumblr.com/">theme</a>
  438. </div>
  439. <div id="arrow"></div>
  440. <div id="sidebar">
  441. <img src="{image:sidebar}">
  442. <div class="pagi">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">←</a>{/block:PreviousPage}{block:JumpPagination length="5"}{block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}{block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}{block:NextPage}<a href="{NextPage}">→</a>{/block:NextPage}
  443. {/block:Pagination}</div>
  444. <div class="desc">{Description}</div>
  445. </div>
  446.  
  447. <div class="e">
  448. <h1>navigation</h1>
  449. <b>( header )</b>
  450. <a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a>
  451. <b>( header )</b>
  452. <a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a><b>( header )</b>
  453. <a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a><a href="/">link</a>
  454. </div>
  455.  
  456.  
  457. <!-- POSTS START -->
  458. <div id="entries">
  459. {block:Posts}
  460. <div id="post">
  461.  
  462. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}
  463. {Body}{/block:Text}
  464.  
  465. {block:Photo}<img src="{PhotoURL-500}">{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  466.  
  467. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  468.  
  469. {block:Quote}<h1>"{Quote}"</h1>{block:Source}<div class="s">— {Source}</div>{/block:Source}{/block:Quote}
  470.  
  471. {block:Link}<h1><a href="{URL}">{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  472.  
  473. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}<li style="list-style-type:none;">{block:Label}<b>{Label}</b> {/block:Label}{Line}</li>{/block:Lines}{/block:Chat}
  474.  
  475. {block:Audio}<div class="au">{block:AudioEmbed}{AudioEmbed}{/block:AudioEmbed}{block:AlbumArt}<div class="ia"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}<div class="ain">{block:TrackName}<b>{TrackName}</b>{/block:TrackName}{block:Artist}<br/>{Artist}{/block:Artist}</div>{block:AudioPlayer}<div class="ap">{AudioPlayerBlack}</div>{/block:AudioPlayer}{block:Caption}{Caption}{/block:Caption}</div>{/block:Audio}
  476.  
  477. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  478.  
  479. {block:Answer}<div class="a"><b>{Asker}</b><div class="q">{Question}</div></div>{block:Answerer}<div class="a"><b>{Answerer}</b>{Answer}</div>{block:Answerer}{Replies}{/block:Answer}
  480.  
  481. </div>
  482. {block:IndexPage}<div class="i"><div class="left">{block:Date}<a href="{Permalink}" class="d">{TimeAgo}</a>{/block:Date}{block:RebloggedFrom}<a href="{ReblogParentURL}" class="v">via</a>{/block:RebloggedFrom}{block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}" class="v">src</a>
  483. {/block:ContentSource}</div>{block:Date}<div class="icons"><div class="likes">{LikeButton}</div><div class="reblogs">{ReblogButton}</div></div>{/block:Date}<div class="right">{block:NoteCount}<a href="{Permalink}">{NoteCount}</a>{/block:NoteCount}{block:HasTags}{block:Tags}<a href="/tagged/{Tag}">+{Tag}</a>{/block:Tags}{/block:HasTags}</div></div>{/block:IndexPage}
  484.  
  485.  
  486. {block:PermalinkPage}{block:Date}<div class="i"><div class="left">{block:Date}<a href="{Permalink}" class="d">{TimeAgo}</a>{/block:Date}{block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}" class="v">src</a>{/block:ContentSource}{block:RebloggedFrom}<a href="{ReblogParentURL}" class="v">via</a><a href="{ReblogURL}" class="v">reblog</a>{/block:RebloggedFrom}</div><div class="right">{block:NoteCount}<a href="{Permalink}">{NoteCount}</a>{/block:NoteCount}{block:HasTags}{block:Tags}<a href="/tagged/{Tag}">+{Tag}</a>{/block:Tags}{/block:HasTags}</div></div>{/block:Date}{/block:PermalinkPage}
  487.  
  488. {block:PostNotes}<br/><div class="n">{PostNotes}</div>{/block:PostNotes}
  489. {/block:Posts}
  490. </div>
  491. </body>
  492. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  493. <script>
  494. $(document).ready(function(){
  495. $('.m').click(function(){
  496. $('.e').fadeToggle(300,'linear');
  497. })
  498. });
  499. </script>
  500.  
  501.  
  502. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement