API tools faq
paste
Advertisement
ofcuteboys

HERE EMILY

ofcuteboys
Dec 13th, 2013
93
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.09 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!---
  3.  
  4. | |
  5. | CAROLINE'S THEME |
  6. | |
  7.  
  8.  
  9. I'M STARTING OVER WITH MY THEMES BECAUSE MY EARLY ONES ARE JUST BAD AND I AM SORRY FOR PUTTING YOU THROUGH THAT.
  10.  
  11. So this is effectively Theme #01, "For A Dancer"
  12.  
  13. It's dedicated to my dad, who showed me the song of the same title by Jackson Browne.
  14.  
  15. The rules for my theme are-
  16. : do not steal, repost, or claim as your own
  17.  
  18. : I'm fine with people borrowing bits of my code. If you use a significant portion, please give me credit on another page or something!
  19.  
  20. : There are a lot of base codes out there. This theme is not a base code. You ARE welcome to look at it to teach yourself coding though
  21.  
  22. : If you use this theme, you MUST like/reblog the post. Your feedback helps me know what to make next!
  23.  
  24. CREDITS (people who helped)
  25. -Becky (ofjack) helped with the drop down links
  26. -hoenarry made the base code
  27. -paynex made the code for different color highlight and bold
  28. -hazzstop made the tooltips
  29.  
  30.  
  31. --->
  32.  
  33.  
  34.  
  35. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  36. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  37. <head><title>{Title}</title>
  38. <link rel="shortcut icon" href="{Favicon}">
  39. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  40. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  41.  
  42.  
  43.  
  44. <meta name="color:Background" content="#ffffff"/>
  45. <meta name="color:Text" content="#838282"/>
  46. <meta name="color:Link" content="#b8b8b8"/>
  47. <meta name="color:Hover" content="#838282"/>
  48. <meta name="color:accent" content="#ff0000"/>
  49. <meta name="color:shadow" content="#888888"/>
  50.  
  51.  
  52. <meta name="image:sidebar" content=""/>
  53.  
  54.  
  55.  
  56. <meta name="text:Link 1 Title" content="01 text">
  57. <meta name="text:Link 1 URL" content="01">
  58. <meta name="text:Link 2 Title" content="02 text">
  59. <meta name="text:Link 2 URL" content="02">
  60. <meta name="text:Link 3 Title" content="03 text">
  61. <meta name="text:Link 3 URL" content="03">
  62.  
  63.  
  64. <!---SCRIPT FOR DROPDOWN LINKS--->
  65. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
  66. </script>
  67. <script>
  68. $(document).ready(function(){
  69. $("#flip").click(function(){
  70. $("#panel").slideToggle("slow");
  71. });
  72. });
  73. </script>
  74.  
  75.  
  76. <!----SCRIPT FOR OTHER DROPDOWNS--->
  77.  
  78. <script type="text/javascript">
  79. function unhide(divID) {
  80. var item = document.getElementById(divID);
  81. if (item) {
  82. item.className=(item.className=='hidden')?'unhidden':'hidden';
  83. }
  84. }
  85. </script>
  86.  
  87. <!---SCRIPT FOR TOOLTIPS--->
  88.  
  89. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  90. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  91. <script>
  92. (function($){
  93. $(document).ready(function(){
  94. $("a[title]").style_my_tooltips({
  95. tip_follows_cursor:true,
  96. tip_delay_time:90,
  97. tip_fade_speed:600,
  98. attribute:"title"
  99. });
  100. });
  101. })(jQuery);
  102. </script>
  103.  
  104. <!---SCRIPT FOR POP UP ASK BOX--->
  105.  
  106. <script type="text/javascript"
  107. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  108. <script>
  109. $(document).ready(function() {
  110. //
  111. $('a.poplight[href^=#]').click(function() {
  112. var popID = $(this).attr('rel'); //Get Popup Name
  113. var popURL = $(this).attr('href'); //Get Popup href to define size
  114. var query= popURL.split('?');
  115. var dim= query[1].split('&');
  116. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  117. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://i171.photobucket.com/albums/u300/ferny-dust/sozai/bullets/14.gif" class="btn_close" title="Close" alt="Close" /></a>');
  118. var popMargTop = ($('#' + popID).height() + 80) / 2;
  119. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  120. //Apply Margin to Popup
  121. $('#' + popID).css({
  122. 'margin-top' : -popMargTop,
  123. 'margin-left' : -popMargLeft
  124. });
  125. $('body').append('<div id="fade"></div>');
  126. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  127. return false;
  128. });
  129. $('a.close, #fade').live('click', function() {
  130. $('#fade , .popup_block').fadeOut(function() {
  131. $('#fade, a.close').remove(); //fade them both out
  132. });
  133. return false;
  134. });
  135. });
  136. </script>
  137.  
  138. <style type="text/css">
  139.  
  140.  
  141.  
  142.  
  143. /*---CSS FOR DROPDOWN LINKS---*/
  144.  
  145. #flip {
  146. background-color:black;
  147. margin-top:05px;
  148. color:white;
  149. margin-left:-1px;
  150. font-family:Arial;
  151. font-size:25px;
  152. padding-top: 10px;
  153. width:204px;
  154. height:15px;
  155. text-align:center;
  156. text-transform:uppercase;
  157. border:solid 1px #f2f2f2;
  158. }
  159.  
  160.  
  161.  
  162. #panel,#flip
  163. {
  164. padding-top:5px;
  165. text-align:center;
  166. width:197px;
  167. }
  168.  
  169. #panel
  170. {
  171. display:none;
  172. text-align:center;
  173. background:#fff;
  174. }
  175.  
  176. #panel a {
  177. width:192px;
  178. padding:5px;
  179. display:block;
  180. color:black;
  181. letter-spacing:2px;
  182. font-family:arial;
  183. text-align:left;
  184. font-size:9px;
  185. margin:3px;
  186. background:#fff;
  187. -moz-transition-duration:1s;
  188. -webkit-transition-duration:1s;
  189. -o-transition-duration:1s;
  190. }
  191.  
  192. #panel a:hover {
  193. background-color:{color:accent};
  194. color:white;
  195. letter-spacing:4px;
  196. -moz-transition-duration:.2s;
  197. -webkit-transition-duration:.2s;
  198. -o-transition-duration:.2s;
  199. }
  200.  
  201. /*---CSS FOR OTHER DROPDOWNS---*/
  202.  
  203. .hidden {display: none;}
  204. .unhidden {display: block;}
  205.  
  206.  
  207.  
  208.  
  209.  
  210.  
  211. /*---CSS FOR TOOLTIPS---*/
  212. #s-m-t-tooltip{
  213. max-width:250px;
  214. z-index:999999;
  215. margin:10px;
  216. padding:2px 5px;
  217. letter-spacing:2px;
  218. text-transform:uppercase; /* cand be lowercase or none */
  219. border-top:3px solid {color:accent}; /* change the border width and color */
  220. background:#FFF; /* change the background color */
  221. color:#000; /* change the text color */
  222. font-family:arial; /* change the font */
  223. font-weight:bold;
  224. font-size:9px; /* change the font size */
  225. box-shadow:1px 1px 3px rgba(0,0,0,.1);}
  226.  
  227.  
  228. /*---CSS FOR POP UP WINDOWS---*/
  229.  
  230. .popup_block{
  231. display: none;
  232. background: #000;
  233. background-image: url();
  234. padding: 10px;
  235. font-family: arial;
  236. float: left;
  237. line-height:130%;
  238. color:white;
  239. font-size: 10px;
  240. position: fixed;
  241. top: 50%; left: 50%;
  242. z-index: 2;
  243.  
  244. }
  245.  
  246. .popup_block a {
  247. color:{color:accent};
  248. }
  249. img.btn_close {
  250. float: right;
  251. width:10px;
  252. margin: -5px -5px 0 0;
  253. }
  254. *html .popup_block {
  255. position: absolute;
  256. }
  257.  
  258. body {
  259. background:{color:background};
  260. margin:0px;
  261. color:{color:text};
  262. font-family:arial;
  263. font-size:10px;
  264. line-height:100%;
  265. }
  266.  
  267. a {
  268. text-decoration:none;
  269. font-weight:bold;
  270. outline:none;
  271. -moz-outline-style:none;
  272. color:{color:accent};
  273. -o-transition-transition: all 1s ease-out;
  274. -webkit-transition: all 1s ease-out;
  275. -moz-transition: all 1s ease-out;
  276.  
  277. }
  278.  
  279. a:hover{
  280. color:{color:hover};
  281. -o-transition-transition: all 1s ease-out;
  282. -webkit-transition: all 1s ease-out;
  283. -moz-transition: all 1s ease-out;
  284.  
  285. }
  286.  
  287. img {
  288. border:none;
  289. }
  290.  
  291. blockquote {
  292. padding-left:5px;
  293. border-left:2px solid;
  294. }
  295.  
  296. blockquote blockquote {
  297. padding-left:5px;
  298. border-left:3px solid {color:accent};
  299. }
  300.  
  301. h1 {
  302. font-size:15px;
  303. }
  304.  
  305. b {color:{color:accent}; font-size:1.5;}
  306. i {color:{color:accent};}
  307. em {color:{color:accent}; text-transform:none; font-size:2;}
  308. strong {color:{color:accent}; text-transform:none; font-size:2;}
  309.  
  310.  
  311.  
  312. ::selection {
  313. background-color:{color:accent};
  314. }
  315.  
  316.  
  317. #news {
  318. width:145px;
  319. font-size:11px;
  320. font-family:candara;
  321. letter-spacing:1px;
  322. text-align:center;
  323. margin-left:-175px;
  324. color:#fff;
  325. margin-top:-14px;
  326. line-height: 125%;
  327. opacity:0;
  328. -o-transition-transition: all 1s ease-out;
  329. -webkit-transition: all 1s ease-out;
  330. -moz-transition: all 1s ease-out;
  331. }
  332.  
  333. #news a {
  334. color:{color:accent};
  335. font-size:13px;
  336. }
  337.  
  338. #newstitle:hover #news {
  339. opacity:10;
  340. font-family:Calibri;
  341. font-size:11px;
  342. color:white;
  343. background-color:#000;
  344. border-bottom:2px dotted #fff;
  345. margin-left:-10px;
  346. -o-transition-transition: all 1s ease-in-out;
  347. -webkit-transition: all 1s ease-in-out;
  348. -moz-transition: all 1s ease-in-out;
  349. }
  350.  
  351. #newstitle {
  352. width:125px;
  353. height:0px;
  354. font-family:Bebas Neue;
  355. font-size:35px;
  356. text-align:center;
  357. margin-left:0px;
  358. top:0px;
  359. padding-left:10px;
  360. padding-right:10px;
  361. padding-top:10px;
  362. padding-bottom:20px;
  363. color:#fff;
  364. position:fixed;
  365. background-color:#000;
  366. border-bottom:2px solid black;
  367.  
  368. }
  369.  
  370. #entries {
  371. padding:10px;
  372. width:500px;
  373. margin-left:500px;
  374. margin-top:40px;
  375. }
  376.  
  377. #post {
  378. width:500px;
  379. margin-bottom:50px;
  380. }
  381.  
  382. #sidebar {
  383. position:fixed;
  384. margin-left:200px;
  385. margin-top:100px;
  386. }
  387.  
  388. #title {
  389. font-size:25px;
  390. width:210px;
  391. color:black;
  392. font-family:arial;
  393. font-weight:bold;
  394. letter-spacing:-3px;
  395. line-height:100%;
  396. text-align:center;
  397. text-transform:lowercase;
  398. margin-bottom:5px;
  399. margin-left:-6px;
  400. -moz-transition-duration:1s;
  401. -webkit-transition-duration:1s;
  402. -o-transition-duration:1s;
  403. }
  404.  
  405. #title:hover {
  406. color:{color:accent};
  407. -moz-transition-duration:1s;
  408. -webkit-transition-duration:1s;
  409. -o-transition-duration:1s;
  410. }
  411.  
  412. #sidebarimage {
  413. width 200px;
  414. }
  415.  
  416. #sidebarimage img {
  417. width:200px;
  418. }
  419.  
  420.  
  421.  
  422. #linkdrop {
  423. background-color:black;
  424. border:2px white solid;
  425. margin-left:-2px;
  426. margin-top:4px;
  427. font-family:arial;
  428. font-size:20px;
  429. color:white;
  430. padding:5px;
  431. width:190px;
  432. -moz-transition-duration:1s;
  433. -webkit-transition-duration:1s;
  434. -o-transition-duration:1s;
  435. }
  436.  
  437.  
  438.  
  439. .links{
  440. margin-top:-150px;
  441. text-align:center;
  442. letter-spacing:2px;
  443. -moz-transition-duration:1s;
  444. -webkit-transition-duration:1s;
  445. -o-transition-duration:1s;
  446. }
  447.  
  448. .links a{
  449. padding:5px;
  450. -moz-transition-duration:1s;
  451. -webkit-transition-duration:1s;
  452. -o-transition-duration:1s;
  453. }
  454.  
  455. .links a:hover{
  456. color:{color:hover};
  457. letter-spacing:4px;
  458. -moz-transition-duration:1s;
  459. -webkit-transition-duration:1s;
  460. -o-transition-duration:1s;
  461. }
  462.  
  463. #description {
  464. text-align:justify;
  465. margin-top:5px;
  466. padding-left:5px;
  467. color:black;
  468. width:190px;
  469. font-size:9px;
  470. border-left:2px solid black;
  471. }
  472.  
  473. #pagination {
  474. font-size:10px;
  475. text-align:center;
  476. }
  477.  
  478. #info {
  479. text-align:center;
  480. margin-top:20px;
  481. background-color:black;
  482. padding:7px;
  483. font-family:arial;
  484. font-weight:bold;
  485.  
  486. }
  487.  
  488. #ask{
  489. float:left;
  490. margin-right:5px;
  491. font-family:arial;
  492. font-style:italic;
  493. color:black;
  494. border-bottom:2px solid black;
  495. padding:5px;
  496. line-height:120%;
  497. }
  498.  
  499. .asker {
  500. font-size:15px;
  501. font-family:arial;
  502. font-weight:bold;
  503. letter-spacing:-1px;
  504. color:black;
  505. }
  506.  
  507.  
  508. .date {
  509. color:white;
  510. font-size:17px;
  511. }
  512.  
  513. .date a {
  514. color:white;
  515. }
  516.  
  517. .date a:hover {
  518. color:{color:accent};
  519. }
  520.  
  521.  
  522. .reblog {
  523. font-family:meem2;
  524. font-size:15px;
  525. color:white;
  526. }
  527.  
  528. .reblog a {
  529. color:white;
  530. }
  531.  
  532. #credit {
  533. position:fixed;bottom:3px; right:3px; font-size:11px; letter-spacing:-2px; font-family:arial;font-weight:bold;color:black;background-color:white;padding:2px;border:3px solid black;
  534.  
  535. }
  536.  
  537. #credit a {
  538. color:black;
  539. }
  540.  
  541. @font-face {font-family:"meem2"; src: url('http://static.tumblr.com/gs9d5ab/Rj8m7debq/websymbols-regular-webfont.ttf');}
  542.  
  543.  
  544.  
  545.  
  546. </style></head>
  547.  
  548.  
  549.  
  550. <body>
  551.  
  552.  
  553. <div id="newstitle"> UPDATES <br><br><br><br>
  554. <div id="news">
  555. <a href="http://carolines.co.vu/post/68732026819/am-i-punk-rock-yet">reblog my selfie?</a><br><br>
  556. <a href="http://carolines.co.vu/post/69822944466/wanna-be-friends">BE MY FRIEND</a><br><br>
  557. <a href="/hereforyouproject">feeling down? they're here.</a>
  558. <br><br>
  559. I'm starting fresh with my themes. This is theme #01, for a dancer. I will be releasing it soon so keep your eyes peeled! For more info on why I'm restarting, visit my <a href="#?w=500" rel="01" class="poplight">theme blog</a><br><br>
  560.  
  561.  
  562. <b><a href="http://doncastertea.tumblr.com" title="Johanna">♥</a></b>
  563. <b><a href="http://fancy-fruitandveg.tumblr.com" title="Jordan">♥</a></b>
  564. <b><a href="http://leedsandlarry.tumblr.com" title="Logan">♥</a></b>
  565. <b><a href="http://heaven-0ver-hell.tumblr.com" title="Emma">♥</a></b>
  566. <b><a href="http://breathrealslow.tumblr.com" title="Lauren">♥</a></b>
  567. <b><a href="http://tcmlinslut.tumblr.com" title="Jennifer">♥</a></b>
  568. <b><a href="http://ofjack.tumblr.com" title="Becky">♥</a></b>
  569. <b><a href="http://screwshire.tumblr.com" title="Jennifer">♥</a></b>
  570.  
  571.  
  572. <br><br>
  573.  
  574. Queue is always up and running, my tumblr time will be limited until Christmas. <br><br>
  575.  
  576. If you like this theme and want me to release it, let me know!<br><br>
  577. </div></div>
  578.  
  579.  
  580. <div id="sidebar">
  581.  
  582. <a href="/" title="fresh"><div id="title">{Title};</div></a>
  583.  
  584. <div id="sidebarimage">
  585. <img src="{image:sidebar}"></div>
  586.  
  587.  
  588.  
  589. <div id="flip" title="click to reveal links">+</div>
  590.  
  591. <div id="panel">
  592.  
  593.  
  594. <a href="/" title="fresh">home</a>
  595. <a href="#?w=500" rel="02" class="poplight" title="messages">ask</a>
  596. <a href="#?w=500" rel="03" class="poplight" title="links">navigate</a>
  597. <a href="#?w=500" rel="01" class="poplight" title="my themes">HTML</a>
  598. <a href="/hereforyouproject" title="they listen">feeling down?</a></div>
  599.  
  600. <div id="description">{Description}</div>
  601.  
  602. <div id="pagination">
  603. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">back</a>{/block:PreviousPage} —
  604. {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}{/block:Pagination}
  605. </div>
  606.  
  607. </div>
  608.  
  609. <div id="entries">{block:Posts}<div id="post">
  610.  
  611. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  612.  
  613. {block:Photo}{LinkOpenTag}<center><img src="{PhotoURL-500}" width="500px"></center>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  614.  
  615. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  616.  
  617. {block:Quote}{Quote}{block:Source} —{Source}{/block:Source}{/block:Quote}
  618.  
  619. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  620.  
  621. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  622.  
  623. {block:Audio}{AudioPlayerWhite}{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  624.  
  625. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  626.  
  627.  
  628.  
  629. {block:Answer}
  630. <div id="ask">
  631. <span style="font-size:45px;font-family:Times;color:{color:accent};letter-spacing:-1px;padding-top:20px;">“</span>{Question}<br><br><span class="asker">-{Asker}</span>
  632. </div><br><br><br><br><br><br>{Answer}
  633. {/block:Answer}
  634.  
  635.  
  636.  
  637. <div id="info"><center><a href="{Perimalink}">{block:Date}<a href="{Permalink}"><span class="date">{ShortMonth}. {DayOfMonth}</span></a> {/block:Date}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  638.  
  639.  
  640.  
  641. <span class="reblog"><a href="{ReblogURL}" target="_blank" class="details">J</a></span></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  642. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  643. <span class="date">
  644. <img src="http://img.photobucket.com/albums/v252/shaquanda/dumpitydump/pixelwixel/teenytinyheart5.gif">
  645. <a href="{Permalink}">{NoteCount} notes </a></span>
  646. <br>
  647. {block:HasTags} <font-color="#fff">filed as-{block:Tags} <a href="{TagURL}">{Tag}</a>, {/block:Tags}</font-color>{/block:HasTags}</div>
  648.  
  649. </div>
  650. {block:PostNotes}
  651. <span style="font-family:arial;font-size:9px;font-color:black;">
  652.  
  653. {PostNotes}</span>{/block:PostNotes}
  654. {/block:Posts}</div></center>
  655.  
  656. <div id="credit"><a href="http://ofcuteboyscodes.tumblr.com/">O C B</a></center></div>
  657.  
  658. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!