Advertisement
shakespaere

Theme One: Intricacy

Apr 14th, 2014
1,730
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.65 KB | None | 0 0
  1.  
  2. <!--Theme One by Shakespaere, base code by Farahmir/Leepace
  3.  
  4. Please:
  5. - Feel free to edit this theme as much as you like
  6. - Don't remove the credit
  7.  
  8. -->
  9.  
  10. <!DOCTYPE html>
  11. <head>
  12.  
  13. <link href=’http://fonts.googleapis.com/css?family=Codystar|La+Belle+Aurore|Monofett|Megrim|Meddon|Homemade+Apple|Cedarville+Cursive’ rel=’stylesheet’ type=’text/css’>
  14.  
  15. <title>{Title}</title>
  16.  
  17. <link rel="shortcut icon" href="{Favicon}">
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  19. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  20.  
  21.  
  22. <!--Default Variables-->
  23.  
  24. <meta name="color:Background" content="#ffffff"/>
  25. <meta name="color:Text" content="#aaaaaa"/>
  26. <meta name="color:Link" content="#000000"/>
  27. <meta name="color:Link Hover" content=""/>
  28. <meta name="color:popup text"content="#aaaaaa"/>
  29.  
  30.  
  31. <meta name="image:Sidebar Image" content=""/>
  32.  
  33. <meta name="if:hide captions" content="1"/>
  34.  
  35. <meta name="text:Link 1 URL" content="" />
  36. <meta name="text:Link 1" content="" />
  37. <meta name="text:Link 2 URL" content="" />
  38. <meta name="text:Link 2" content="" />
  39. <meta name="text:Link 3 URL" content="" />
  40. <meta name="text:Link 3" content="" />
  41.  
  42.  
  43.  
  44. <!-- jquery for tooltips-->
  45.  
  46.  
  47. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  48.  
  49. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  50.  
  51. <link href=’http://fonts.googleapis.com/css?family=Codystar|La+Belle+Aurore|Monofett|Megrim|Meddon|Homemade+Apple|Cedarville+Cursive’ rel=’stylesheet’ type=’text/css’>
  52.  
  53.  
  54. <script>
  55.  
  56. (function($){
  57.  
  58. $(document).ready(function(){
  59.  
  60. $("a[title]").style_my_tooltips({
  61.  
  62. tip_follows_cursor:true,
  63.  
  64. tip_delay_time:30,
  65.  
  66. tip_fade_speed:300,
  67.  
  68. attribute:"title"
  69.  
  70. });
  71.  
  72. });
  73.  
  74. })(jQuery);
  75.  
  76. </script>
  77.  
  78.  
  79.  
  80.  
  81.  
  82.  
  83. <!--CSS customization here. -->
  84.  
  85. <style type="text/css">
  86.  
  87.  
  88. /*CODING FOR POP UP ASK*/
  89.  
  90. #fade {
  91. display: none;
  92. background: #000;
  93. position: fixed;
  94. left: 0;
  95. top: 0;
  96. width: 100%;
  97. height: 100%;
  98. opacity: .80;
  99. z-index: 9999;
  100. }
  101.  
  102. .popup_block{
  103. display: none;
  104. background: none; /*this is where you can enter the colour for the popup background, right now there isn't one*/
  105. color:{color:popup text}; /*this is where you change the text colour*/
  106. padding: 20px;
  107. float: left;
  108. position: fixed;
  109. top: 50%;
  110. left: 50%;
  111. z-index: 99999;
  112. }
  113.  
  114. img.btn_close {
  115. float: right;
  116. margin: -55px -55px 0 0;
  117. }
  118.  
  119. *html #fade {
  120. position: absolute;
  121. }
  122.  
  123. *html .popup_block {
  124. position: absolute;
  125. }
  126.  
  127. /*END OF POPUP ASK STUFF*/
  128.  
  129.  
  130.  
  131. #s-m-t-tooltip{
  132. position:absolute;
  133. margin-top: 15px;
  134. z-index:9999;
  135. background:{color:background};
  136. }
  137.  
  138.  
  139.  
  140. /*basics*/
  141. blockquote {padding:5px 0 5px 30px;
  142. border-left:1px solid {color:text};
  143. margin-left:30px;
  144. }
  145.  
  146. body {
  147. background:{color:background};
  148. color:{color:text};
  149. font-family:times;
  150. font-size:11px;
  151. text-align:justify;
  152. margin:0;
  153. line-height:16px;}
  154.  
  155.  
  156. a {
  157. color:{color:link};
  158. text-decoration:none;
  159. }
  160.  
  161. a:hover {
  162. text-decoration:none;
  163. color:{color:link hover};
  164. }
  165.  
  166. img{opacity:1;
  167. border:none;
  168. text-decoration:none}
  169.  
  170.  
  171. small {
  172. font-size:9px;}
  173.  
  174. big {
  175. font-size:12px;}
  176.  
  177.  
  178. /*sidebar*/
  179. #sidebar {text-align:left;
  180. position:fixed;
  181. margin-left:-255px;
  182. margin-top:200px;
  183. width:250px;
  184. }
  185.  
  186. #sidebarim {margin-bottom:20px}
  187.  
  188. #sidebarim img {
  189. width:100px;
  190. height:100px;
  191. box-shadow: 3px 3px 16px #b8b8b8;
  192. margin-bottom:0px;
  193. margin-left:-2px;
  194.  
  195.  
  196. }
  197.  
  198.  
  199. #description {
  200. margin-bottom:-10px;
  201. padding-left: 115px;
  202. height: 100px;
  203. letter-spacing:1px;
  204. font-style:italic;
  205. font-family:baskerville;
  206. width: auto;
  207. margin-top:-125px;
  208.  
  209. }
  210.  
  211. #title {
  212. top:320px;
  213. left:150px;
  214. font-size:12px;
  215. margin-top:25px;
  216. text-transform:uppercase;
  217. font-family:baskerville;
  218. }
  219.  
  220. #links {
  221. line-height:16px;
  222. text-transform:uppercase;
  223. font-family:baskerville;
  224. font-size:8px;
  225. }
  226.  
  227.  
  228. #links a {
  229. margin-right:5px;
  230. display:inline-block;
  231. margin-bottom:5px;
  232. margin-top:5px;
  233. }
  234.  
  235. #pagination {
  236. top:250px;
  237. width:200px;
  238. margin-left:555px;
  239. position:fixed;
  240. font-size:18px;
  241. font-style:italic;
  242. font-family: baskerville;
  243. letter-spacing:2px;
  244. }
  245. #pagination a {
  246. display:block;
  247. border:0;
  248. padding-bottom:5px;
  249. text-decoration:none;}
  250.  
  251.  
  252. /*container*/
  253. #con {
  254. left:50%;
  255. margin-left:-250px;
  256. position:absolute;
  257. }
  258.  
  259.  
  260.  
  261. /*posts*/
  262.  
  263. #entries {
  264. margin-top:125px;
  265. width:500px;
  266. margin-left:50px;
  267. }
  268.  
  269.  
  270.  
  271. #posts {
  272. width:500px;
  273. {block:IndexPage}
  274. margin-bottom:200px;
  275. {/block:IndexPage}
  276. {block:PermalinkPage}
  277. margin-bottom:50px;
  278. {/block:PermalinkPage}
  279.  
  280. }
  281. #posts img {
  282. max-width:500px;
  283. }
  284.  
  285. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  286. .caption {width:100%;
  287. margin-top:10px;
  288. {block:ifhidecaptions}
  289. {block:indexpage}
  290. display:none;
  291. {/block:indexpage}
  292. {/block:ifhidecaptions}
  293.  
  294. }
  295.  
  296. /*quote*/
  297.  
  298. #titlequote{
  299. text-align:left;
  300. font-family:baskerville;
  301. font-size:16px;
  302. line-height:18px;
  303. font-weight:none;
  304. font-style:italic;
  305. letter-spacing:2px;
  306. }
  307. #source {
  308. margin-top:15px;
  309. margin-left:15px;
  310. font-size:10px;
  311. font-family:times;
  312. letter-spacing:1px;
  313. }
  314.  
  315. /*audio*/
  316.  
  317. #audio {
  318. margin-bottom:5px;
  319. width:500px;
  320. height:justify;
  321. }
  322.  
  323. .cover {
  324. width:78px;
  325. height:78px;
  326. position:absolute;
  327. }
  328.  
  329. .cover img {
  330. width:73px;
  331. height:73px;
  332. float:left;
  333. }
  334.  
  335. .player {
  336. opacity: 0.05;
  337. position:absolute;
  338. z-index:1;
  339. background:#fff
  340. ;width:80px;
  341. height:80px;
  342. display:block;
  343. -webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;
  344. }
  345. .player:hover{
  346. opacity:0.5;
  347. -webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;
  348. }
  349.  
  350. .player2 {
  351. width:25px;
  352. height:25px;
  353. margin-top:20px;
  354. margin-left:20px;
  355. overflow:hidden;
  356. padding:3px;
  357. }
  358.  
  359. .track {
  360. text-transform:;
  361. font-family:baskerville;
  362. letter-spacing:1px;
  363. margin-left:80px;
  364. line-height:15px;
  365. padding-top:0px;
  366. }
  367.  
  368.  
  369. /*asks*/
  370. .q {
  371. margin-bottom:10px;
  372. text-align:right;
  373. font-style:italic;
  374. letter-spacing:1px;
  375. font-family:baskerville;
  376.  
  377. }
  378. .as {
  379. text-align:right;
  380. font-family:baskerville;
  381. letter-spacing:1px;
  382. font-style:italic;
  383. }
  384.  
  385. .a {
  386. margin-top:10px;
  387. text-align:left;
  388. }
  389.  
  390.  
  391. /*chat*/
  392.  
  393. .chat ol {
  394. padding:0;
  395. list-style:none;
  396. }
  397. .line {padding:5px 0;}
  398.  
  399. .label {font-weight:bold;
  400. }
  401.  
  402.  
  403.  
  404.  
  405.  
  406. /*permalink and notes*/
  407.  
  408. #permalink {
  409. margin-top:15px;
  410. font-size:9px;
  411. text-transform:none;
  412. font-family:times;
  413. }
  414. #permalink a {margin-right:10px;
  415. }
  416.  
  417.  
  418. .tags {
  419. word-break:break-all;
  420. font-size:9px;
  421. font-family:times;
  422. }
  423.  
  424. .pagenotes {
  425. {block:IndexPage}
  426. display: none!important;
  427. {/block:IndexPage}
  428. width:400px;
  429. text-align:left;
  430. font-family:times;
  431.  
  432. }
  433. .pagenotes img {
  434. display:none!important;}
  435. .pagenotes li {
  436. list-style-type:none;
  437. padding:5px 0px;
  438. text-align:left;
  439. margin:0 0 0 -40px;
  440. }
  441.  
  442. #visitors {
  443. bottom:0px;
  444. right:0px;
  445. padding:10px;
  446. }
  447.  
  448. /*credit -DO NOT REMOVE, please*/
  449.  
  450. #credit {
  451. font-size:7px;
  452. text-transform:uppercase;
  453. letter-spacing:2px;
  454. opacity:1;
  455. bottom:0px;
  456. right:0px;
  457. text-align:right;
  458. position:fixed;
  459. padding:10px;
  460. }
  461. #credit a {
  462. text-decoration:none;
  463. color:{color:link hover};
  464. }
  465.  
  466.  
  467. {CustomCSS}
  468.  
  469.  
  470. </style>
  471.  
  472. <script type="text/javascript"
  473. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  474.  
  475. <!--MORE POP UP STUFF-->
  476.  
  477. <script>
  478.  
  479.  
  480.  
  481. $(document).ready(function() {
  482.  
  483. //
  484.  
  485.  
  486.  
  487. //When you click on a link with class of poplight and the href starts with a #
  488.  
  489. $('a.poplight[href^=#]').click(function() {
  490.  
  491. var popID = $(this).attr('rel'); //Get Popup Name
  492.  
  493. var popURL = $(this).attr('href'); //Get Popup href to define size
  494.  
  495.  
  496.  
  497. //Pull Query & Variables from href URL
  498.  
  499. var query= popURL.split('?');
  500.  
  501. var dim= query[1].split('&');
  502.  
  503. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  504.  
  505.  
  506.  
  507. //Fade in the Popup and add close button
  508.  
  509. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://tiny.cc/closeimg" class="btn_close" title="Close Window" alt="Close" /></a>');
  510.  
  511.  
  512. //Define margin for center alignment (vertical horizontal) - we add 80px to the height/width to accomodate for the padding and border width defined in the css
  513.  
  514. var popMargTop = ($('#' + popID).height() + 80) / 2;
  515.  
  516. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  517.  
  518.  
  519.  
  520. //Apply Margin to Popup
  521.  
  522. $('#' + popID).css({
  523.  
  524. 'margin-top' : -popMargTop,
  525.  
  526. 'margin-left' : -popMargLeft
  527.  
  528. });
  529.  
  530.  
  531.  
  532. //Fade in Background
  533.  
  534. $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
  535.  
  536. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies
  537.  
  538.  
  539.  
  540. return false;
  541.  
  542. });
  543.  
  544.  
  545.  
  546. //Close Popups and Fade Layer
  547.  
  548. $('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
  549.  
  550. $('#fade , .popup_block').fadeOut(function() {
  551.  
  552. $('#fade, a.close').remove(); //fade them both out
  553.  
  554. });
  555.  
  556. return false;
  557.  
  558. });
  559.  
  560.  
  561.  
  562.  
  563.  
  564. });
  565.  
  566. </script>
  567.  
  568. <!--END OF POP UP STUFF-->
  569.  
  570. </head>
  571.  
  572. <body>
  573.  
  574.  
  575.  
  576. <div id="con">
  577.  
  578. <div id="sidebar">
  579. <div id="sidebarim"><img src="{image:Sidebar Image}"></div>
  580. <div id="description">{Description}</div>
  581. <div id="title">{Title}</div>
  582. <div id="links">
  583. <a href="/">home</a>
  584. <a href="#?w=500" rel="ask_popup" class="poplight">ask</a>
  585. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}
  586. {block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:ifLink2}
  587. {block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a> {/block:ifLink3}
  588. </div>
  589.  
  590.  
  591.  
  592.  
  593. </div>
  594.  
  595.  
  596.  
  597.  
  598. <div id="entries">
  599.  
  600. {block:Posts}
  601. <div id="posts">
  602.  
  603.  
  604. {block:Quote}
  605.  
  606.  
  607. <div id="titlequote">“{Quote}”</div>
  608. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  609. {/block:Quote}
  610.  
  611.  
  612.  
  613. {block:Text}
  614.  
  615. {block:Title}
  616. <div id="title">{Title}</div>{/block:Title}
  617. {Body}
  618. {/block:Text}
  619.  
  620. {block:Link}
  621. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  622. {/block:Link}
  623.  
  624. {block:Chat}
  625. {block:Title}
  626. <h1>{Title}</h1>
  627. {/block:Title}
  628. <div class="chat">
  629. <ol>{block:Lines}
  630. <li class="line {Alt}">
  631. {block:Label}
  632. <span class="label">
  633. {Label}</span>
  634. {/block:Label}{Line}</li>
  635. {/block:Lines}
  636. </ol></div>
  637. {/block:Chat}
  638.  
  639. {block:Photo}
  640. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}
  641. {/block:Photo}
  642.  
  643. {block:Photoset}
  644. {Photoset-500}
  645. {/block:Photoset}
  646.  
  647. {block:Video}
  648. {Video-500}
  649. {/block:Video}
  650.  
  651. {block:Audio}
  652. <div id="audio">{block:AlbumArt}<div class="cover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
  653. <div class="player">
  654. <div class="player2">
  655. {AudioPlayerWhite}</div></div><div class="track">{block:TrackName}<b>Title:</b> {TrackName}{/block:TrackName}<br />{block:Artist}<b>Artist:</b> {Artist}{/block:Artist}<br />{block:Album}<b>Album:</b> {Album}{/block:Album}<br />{PlayCountWithLabel}</div></div>
  656. {/block:Audio}
  657.  
  658.  
  659. {block:Answer}
  660. <div class="q">
  661. <big>"{Question}"</big></div>
  662. <div class="as">said <b>{Asker}</b>.</div>
  663. <div class="a"><em><br><br>And there was a reply,</em><br>{Answer}</div>
  664. {/block:Answer}
  665.  
  666. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  667.  
  668. {block:Date}
  669. <div id="permalink">
  670. <a href="{Permalink}" >{Month} {DayOfMonth} {Year}, {12Hour}:{Minutes} {AmPm} </a>{block:NoteCount}<a href="{Permalink}">{NoteCount} notes</a>{/block:NoteCount}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{block:ContentSource}<a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:ContentSource}{/block:RebloggedFrom}
  671. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  672. </div>
  673. {/block:Date}
  674.  
  675.  
  676.  
  677. </div>
  678.  
  679.  
  680. {block:PostNotes}
  681. <div class="pagenotes">
  682. {PostNotes}
  683. </div>
  684. {/block:PostNotes}
  685.  
  686.  
  687. {/block:Posts}
  688.  
  689. <div id="pagination">
  690. {block:Pagination}
  691. {block:PreviousPage}
  692. <a href="{PreviousPage}">&larr; previous </a>
  693. {/block:PreviousPage}
  694.  
  695.  
  696. {block:NextPage}
  697. <a href="{NextPage}">next &rarr;</a>
  698. {/block:NextPage}
  699. {/block:Pagination}
  700. </div>
  701.  
  702.  
  703.  
  704. </div>
  705.  
  706. </div>
  707.  
  708.  
  709. {block:ContentSource}
  710. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  711. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  712. {/block:SourceLogo}
  713. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  714. {/block:ContentSource}
  715.  
  716. <div id="credit"><a href=http://shakespaere.tumblr.com/>Credit</a> </div>
  717.  
  718. <div id="ask_popup" class="popup_block">
  719. <center><big><b>ASK ME ANYTHING</b></big>
  720. <br>_______________________________________________
  721. <p>Here you can enter any text such as an FAQ, or just a little message to your followers. Alternatively, feel free to delete it all, it's your blog!<br><br>
  722. ✧・゚: *✧・゚:* \(◕ヮ◕✿)/ *:・゚✧*:・゚✧
  723. </center><p>
  724. <br>
  725. <!--THIS IS YOUR ASK CODE, IT'S VERY IMPORTANT YOU ENTER YOUR URL AND DON'T CHANGE ANYTHING-->
  726. <iframe frameborder="0"
  727. height="150"
  728. id="ask_form"
  729. scrolling="no"
  730. src="http://www.tumblr.com/ask_form/ENTER-YOUR-URL-HERE.tumblr.com"
  731. width="100%">
  732. </iframe>
  733. </div>
  734.  
  735.  
  736. </body>
  737.  
  738.  
  739.  
  740. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement