Advertisement
themesbygeorgia

Theme #44 Revamp- Allure

Oct 14th, 2014
1,107
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.35 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. <head>
  4.  
  5. <!--Theme #44 by wonderfullythemes-->
  6.  
  7. <title>{Title}</title>
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  10. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  11.  
  12. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  13. <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
  14.  
  15. <!--SCRIPT FOR TOOLTIPS-->
  16. <stsss>
  17. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  18. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  19. <script>
  20. (function($){
  21. $(document).ready(function(){
  22. $("a[title]").style_my_tooltips({
  23. tip_follows_cursor:true,
  24. tip_delay_time:200,
  25. tip_fade_speed:300,
  26. attribute:"title"
  27. });
  28. });
  29. })(jQuery);
  30. </script>
  31.  
  32. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  33. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  34. <script type="text/javascript" charset="utf-8">
  35. var $j = jQuery.noConflict();
  36. $j(function() {
  37. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  38. $j("img").lazyload({
  39. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  40. effect: "fadeIn",
  41. });
  42. });
  43. </script>
  44.  
  45. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  46. <script>
  47. $(document).ready(function(){
  48. $(".idk").click(function(){
  49. $(".description").fadeToggle("slow");
  50. });
  51.  
  52. $(".what").click(function(){
  53. $(".navi").fadeToggle("slow");
  54. });
  55. });
  56. </script>
  57.  
  58. <meta name="color:Background" content="#fff" />
  59. <meta name="color:Link" content="#1bcc5c" />
  60. <meta name="color:Hover" content="#444" />
  61. <meta name="color:Text" content="#444" />
  62. <meta name="color:Border" content="#ddd" />
  63. <meta name="color:Description Text" content="#fff" />
  64. <meta name="color:Question Background" content="#ddd" />
  65. <meta name="color:Question Text" content="#444" />
  66. <meta name="color:Answer Background" content="#fff" />
  67. <meta name="color:Answer Text" content="#444" />
  68. <meta name="color:Chat Bg Odd" content="#ddd" />
  69. <meta name="color:Chat Bg Even" content="#fff" />
  70. <meta name="color:Info Background" content="#ddd" />
  71. <meta name="color:Info Text" content="#444" />
  72. <meta name="color:Info Links" content="#444" />
  73. <meta name="color:Info Links Hover" content="#fff" />
  74. <meta name="color:Tooltip Background" content="#000" />
  75. <meta name="color:Tooltip Text" content="#fff" />
  76.  
  77. <meta name="image:Sidebar" content="" />
  78.  
  79. <meta name="text:Quote" content="your quote here" />
  80. <meta name="text:Source" content="source here" />
  81.  
  82. <meta name="text:Link1" content="/" />
  83. <meta name="text:Link1 Text" content="Link 1" />
  84. <meta name="text:Link2" content="/" />
  85. <meta name="text:Link2 Text" content="Link 2" />
  86. <meta name="text:Link3" content="/" />
  87. <meta name="text:Link3 Text" content="Link 3" />
  88. <meta name="text:Link4" content="/" />
  89. <meta name="text:Link4 Text" content="Link 4" />
  90. <meta name="text:Link5" content="/" />
  91. <meta name="text:Link5 Text" content="Link 5" />
  92. <meta name="text:Link6" content="/" />
  93. <meta name="text:Link6 Text" content="Link 6" />
  94.  
  95.  
  96. <style type="text/css">
  97.  
  98. ::-webkit-scrollbar-thumb {
  99. height:auto;
  100. background-color:{color:Text};
  101. }
  102.  
  103. ::-webkit-scrollbar {
  104. height:4px;
  105. width:6px;
  106. padding-right:2px;
  107. background-color:transparent;
  108. }
  109.  
  110. #s-m-t-tooltip {
  111. font-family:'calibri';
  112. max-width:200px;
  113. font-size:10px;
  114. background-color:{color:Tooltip Background};
  115. color:{color:Tooltip Text};
  116. line-height:9px;
  117. display:none;
  118. position:absolute;
  119. letter-spacing:1px;
  120. text-transform:uppercase;
  121. padding:10px;
  122. margin:15px 0px 0px 15px;
  123. z-index:99999999999999;
  124. }
  125.  
  126. body {
  127. background:{color:Background};
  128. color:{color:Text};
  129. font-family:'corbel';
  130. font-size:13px;
  131. text-decoration:none;
  132. text-transform:none;
  133. margin:0px;
  134. }
  135.  
  136. a {
  137. color:{color:Link};
  138. text-decoration:none;
  139. -moz-transition-duration:0.7s;
  140. -webkit-transition-duration:0.7s;
  141. -o-transition-duration:0.7s;
  142. }
  143.  
  144. a:hover {
  145. color:{color:Hover};
  146. -moz-transition-duration:0.7s;
  147. -webkit-transition-duration:0.7s;
  148. -o-transition-duration:0.7s;
  149. }
  150.  
  151. h2 {
  152. color:{color:Text};
  153. }
  154.  
  155. h2 a {
  156. color:{color:Link};
  157. }
  158.  
  159. li {
  160. list-style:square;
  161. }
  162.  
  163. blockquote {
  164. border-left:2px solid {color:Text};
  165. padding-left:5px;
  166. }
  167.  
  168. img, blockquote, li, h2 {
  169. max-width:100%;
  170. }
  171.  
  172. #entries {
  173. width:350px;
  174. margin:auto;
  175. position:relative;
  176. top:0;
  177. right:300px;
  178. float:right;
  179. }
  180.  
  181. #post {
  182. padding:50px;
  183. width:250px;
  184. margin-bottom:100px;
  185. }
  186.  
  187. #sidebar {
  188. width:200px;
  189. position:fixed;
  190. top:0;
  191. right:0;
  192. }
  193.  
  194. .sidebarpic {
  195. position:absolute;
  196. }
  197.  
  198. .sidebarpic img {
  199. height:100%;
  200. }
  201.  
  202. .idk:hover {
  203. cursor:help;
  204. }
  205.  
  206. .description {
  207. margin-left:32px;
  208. color:{color:Description Text};
  209. background: rgba(225,225,225,0.5);
  210. border:1px solid {color:Border};
  211. font-size:11px;
  212. padding:10px;
  213. width:125px;
  214. height:140px;
  215. overflow-y:scroll;
  216. margin-top:50px;
  217. position:absolute;
  218. text-align:justify;
  219. text-transform:uppercase;
  220. display:none;
  221. }
  222.  
  223. .links {
  224. width:150px;
  225. margin-top:-40px;
  226. margin-left:-75px;
  227. top:50%;
  228. font-size:10px;
  229. position:fixed;
  230. text-align:center;
  231. letter-spacing:1px;
  232. text-transform:uppercase;
  233. }
  234.  
  235. .links a {
  236. margin-bottom:10px;
  237. border:1px solid {color:Border};
  238. display:block;
  239. padding:3px;
  240. color:{color:Link};
  241. }
  242.  
  243. .links a:hover {
  244. background-color:{color:Text};
  245. color:white;
  246. }
  247.  
  248. .what:hover {
  249. cursor:help;
  250. }
  251.  
  252. .navi {
  253. padding-top:10px;
  254. background: rgba(225,225,225,0.5);
  255. border:1px solid {color:Border};
  256. font-size:11px;
  257. width:135px;
  258. height:145px;
  259. position:fixed;
  260. text-transform:uppercase;
  261. bottom:50px;
  262. right:30px;
  263. display:none;
  264. }
  265.  
  266. .navi a {
  267. padding:5px;
  268. text-align:center;
  269. display:block;
  270. }
  271.  
  272. .navi a:hover {
  273. background-color:{color:Link};
  274. color:{color:Hover};
  275. }
  276.  
  277. /*--EXTRA--*/
  278. #extra {
  279. position:fixed;
  280. top:35%;
  281. left:33%;
  282. }
  283.  
  284. #quote {
  285. padding-bottom:10px;
  286. width:200px;
  287. position:relative;
  288. border-bottom:1px solid {color:Info Background};
  289. }
  290.  
  291. .mark {
  292. text-align:left;
  293. font-family:georgia;
  294. font-size:60px;
  295. color:{color:Link};
  296. }
  297.  
  298. .words {
  299. margin-top:-35px;
  300. text-indent:10px;
  301. line-height:16px;
  302. font-size:13px;
  303. font-style:italic;
  304. }
  305.  
  306. #pagination {
  307. margin-top:20px;
  308. position:relative;
  309. font-size:10px;
  310. text-transform:uppercase;
  311. float:center;
  312. line-height:10px;
  313. }
  314.  
  315. #pagination a {
  316. letter-spacing:1px;
  317. padding:5px 7px 5px 7px;
  318. color:{color:Link};
  319. background-color:transparent;
  320. border:1px solid {color:Border};
  321. }
  322.  
  323. #pagination a:hover {
  324. color:{color:Border};
  325. background-color:{color:Hover};
  326. }
  327.  
  328. .current_page {
  329. padding:5px 7px 5px 7px;
  330. }
  331.  
  332. .jump_page {
  333. color:{color:Hover};
  334. padding:5px 7px 5px 7px;
  335. }
  336.  
  337. /*--POST TYPES--*/
  338. .user {
  339. font-style:italic;
  340. position:relative;
  341. }
  342.  
  343. .user a {
  344. border-bottom:none;
  345. color:white;
  346. }
  347.  
  348. .user a:hover {
  349. color:{color:Hover};
  350. letter-spacing:2px;
  351. box-shadow:none;
  352. }
  353.  
  354. .question {
  355. position:relative;
  356. max-width:100%;
  357. background-color:{color:Question Background};
  358. color:{color:Question Text};
  359. padding:20px;
  360. }
  361.  
  362. .arrow-down {
  363. width: 0;
  364. height: 0;
  365. border-left: 15px solid transparent;
  366. border-right: 15px solid transparent;
  367. margin-left:30px;
  368. margin-top:0px;
  369. border-top: 15px solid {color:Question Background};
  370. }
  371.  
  372. .answer {
  373. text-align:left;
  374. margin-top:20px;
  375. max-width:100%;
  376. padding-bottom:5px;
  377. }
  378.  
  379. .quote {
  380. font-size:18px;
  381. font-style:italic;
  382. }
  383.  
  384. .chat li {
  385. list-style:none;
  386. }
  387.  
  388. .label {
  389. text-transform:uppercase;
  390. }
  391.  
  392. .line_odd {
  393. color:{color:Chat Bg Odd};
  394. }
  395.  
  396. .line_even {
  397. color:{color:Chat Bg Even};
  398. }
  399.  
  400. .playerbuttonbg {
  401. position: absolute;
  402. left: 20px;
  403. top: 20px;
  404. width: 19px;
  405. height: 19px;
  406. background-color: #fff;
  407. padding: 10px;
  408. opacity: .4;
  409. filter: alpha(opacity=40);
  410. -moz-opacity: 0.4;
  411. -khtml-opacity: 0.4;
  412. transition: opacity .7s ease-in-out;
  413. -moz-transition: opacity .7s ease-in-out;
  414. -webkit-transition: opacity .7s ease-in-out;
  415. }
  416.  
  417. .playerbuttonbg:hover {
  418. opacity: 1;
  419. filter: alpha(opacity=100);
  420. -moz-opacity: 1;
  421. -khtml-opacity: 1;
  422. }
  423.  
  424. .newplayerbutton {
  425. position: relative;
  426. width: 19px;
  427. height: 19px;
  428. overflow: hidden;
  429. }
  430.  
  431. .playerbuttonhug {
  432. position: absolute;
  433. top: -18px;
  434. left: -7px;
  435. }
  436.  
  437. .tumblr_audio_player {
  438. height: 90px;
  439. width: 270px;
  440. -moz-transform: scale(0.60, 0.60);
  441. -webkit-transform: scale(0.60, 0.60);
  442. -o-transform: scale(0.60, 0.60);
  443. -ms-transform: scale(0.60, 0.60);
  444. transform: scale(0.60, 0.60);
  445. -moz-transform-origin: top left;
  446. -webkit-transform-origin: top left;
  447. -o-transform-origin: top left;
  448. -ms-transform-origin: top left;
  449. transform-origin: top left;
  450. }
  451.  
  452. .audioimgwrapper {
  453. position: absolute;
  454. left: 0px;
  455. top: 0px;
  456. overflow: hidden;
  457. width: 79px;
  458. height: 79px;
  459. }
  460.  
  461. .audioimgwrapper img {
  462. width: 100%;
  463. height: auto;
  464. }
  465.  
  466. .trackdetails {
  467. width: auto;
  468. display:inline-block;
  469. margin-left: 90px;
  470. min-height: 85px;
  471. }
  472.  
  473. .audiowrapper {
  474. position: relative;
  475. display:inline-block;
  476. }
  477.  
  478. /*--INFO AND TAGS--*/
  479. #footer {
  480. font-family:'calibri';
  481. color:{color:Info Text};
  482. text-transform:uppercase;
  483. width:230px;
  484. text-align:left;
  485. font-size:10px;
  486. margin-top:10px;
  487. padding:10px;
  488. background-color:{color:Info Background};
  489. }
  490.  
  491. #footer a {
  492. color:{color:Info Links};
  493. }
  494.  
  495. #footer a:hover {
  496. color:{color:Info Links Hover};
  497. }
  498.  
  499. #post:hover .like_and_reblog_buttons {
  500. opacity:1;
  501. -moz-transition-duration:0.7s;
  502. -webkit-transition-duration:0.7s;
  503. -o-transition-duration:0.7s;
  504. }
  505.  
  506. .like_and_reblog_buttons {
  507. list-style: none;
  508. opacity:0;
  509. -moz-transition-duration:0.7s;
  510. -webkit-transition-duration:0.7s;
  511. -o-transition-duration:0.7s;
  512. }
  513.  
  514. .like_and_reblog_buttons li {
  515. list-style:none;
  516. float: left;
  517. margin: 0;
  518. padding: 7px 7px;
  519. }
  520.  
  521. .like_and_reblog_buttons li:first-child {
  522. height:10px;
  523. }
  524.  
  525. /*--CREDIT--*/
  526. #spectrum {
  527. bottom:9px;
  528. left:7px;
  529. font-size:8px;
  530. font-family:'calibri';
  531. letter-spacing:1px;
  532. text-transform:uppercase;
  533. position:fixed;
  534. }
  535.  
  536. {CustomCSS}</style></head><body>
  537.  
  538. <div id="sidebar">
  539. <div class="sidebarpic"><img src="{image:Sidebar}" /></div>
  540.  
  541. <div class="links">
  542. <a href="/">refresh</a>
  543. <a class="idk">description</a>
  544. <a class="what">navigation</a>
  545. <a href="http://wonderfullythemes.tumblr.com" title="wonderfullythemes">credit</a>
  546. </div>
  547.  
  548. <div class="description">{Description}</div>
  549.  
  550. <div class="navi">
  551. <a href="{text:Link1}">{text:Link1 Text}</a>
  552. <a href="{text:Link2}">{text:Link2 Text}</a>
  553. <a href="{text:Link3}">{text:Link3 Text}</a>
  554. <a href="{text:Link4}">{text:Link4 Text}</a>
  555. <a href="{text:Link5}">{text:Link5 Text}</a>
  556. <a href="{text:Link6}">{text:Link6 Text}</a>
  557. </div>
  558. </div>
  559.  
  560. <div id="extra">
  561.  
  562. <div id="quote">
  563. <div class="mark">“</div>
  564. <div class="words">{text:Quote}</div>
  565. <div style="text-align:right;
  566. font-family:georgia;
  567. font-size:60px;
  568. color:{color:Link};margin-top:-10px">”</div>
  569. <div style="text-transform:uppercase;letter-spacing:3px;margin-top:-30px;font-size:9px">-{text:Source}</div>
  570.  
  571. </div>
  572.  
  573. <div id="pagination">
  574.  
  575. {block:Pagination}{block:PreviousPage}
  576. <a href="{PreviousPage}">back</a>&nbsp;
  577. {/block:PreviousPage}{block:JumpPagination length="5"}{block:CurrentPage}
  578. <span class="current_page">{PageNumber}</span>
  579. {/block:CurrentPage}{block:JumpPage}
  580. <a class="jump_page" href="{URL}">{PageNumber}</a>&nbsp;
  581. {/block:JumpPage}{/block:JumpPagination}{block:NextPage}
  582. <a href="{NextPage}">Next</a>
  583. {/block:NextPage}{/block:Pagination}
  584.  
  585. </div>
  586. </div>
  587.  
  588. <div id="entries">{block:Posts}<div id="post">
  589.  
  590. {block:Text}
  591. {block:Title}<h2>{Title}</h2>{/block:Title}
  592. {Body}
  593. {/block:Text}
  594.  
  595. {block:Answer}
  596. <div class="question">{Question}&nbsp;&nbsp;&nbsp;&nbsp;&#8213;<span class="user">{Asker}</span></div>
  597. <div class="arrow-down"></div>
  598.  
  599. <div class="answer">{Answer}</div>
  600. {/block:Answer}
  601.  
  602. {block:Quote}
  603. <span class="quote"><div style="font-size:20px;color:{color:Link};font-weight:bold;border-bottom:3px solid {color:Text};font-style:normal;text-align:center;float:center;width:100%;margin-bottom:10px">&#147;</div>
  604. {Quote}
  605. <div style="font-size:20px;color:{color:Link};font-weight:bold;border-top:3px solid {color:Text};font-style:normal;text-align:center;float:center;width:100%;margin-top:10px;padding-top:5px;line-height:30px;">&#148; </div></span>
  606. {block:Source}<div class="font-size:18px"> &mdash;{Source}</div>{/block:Source}
  607. {/block:Quote}
  608.  
  609. {block:Link}
  610. <h2><a href="{URL}">{Name}</a></h2>
  611. {block:Description}{Description}{/block:Description}
  612. {/block:Link}
  613.  
  614. {block:Chat}
  615. {block:Title}<h2>{Title}</h2>{/block:Title}
  616. {block:Lines}<span class="chat">
  617. <li><span class="line_{Alt}">{block:Label}<span class="label">{Label}</span></span>{/block:Label}</span> {Line}</li>
  618. {/block:Lines}
  619. {/block:Chat}
  620.  
  621. {block:Photo}
  622. {LinkOpenTag}<img src="{PhotoURL-250}" alt="{PhotoAlt}">{LinkCloseTag}
  623. {block:Caption}{Caption}{/block:Caption}
  624. {/block:Photo}
  625.  
  626. {block:Photoset}
  627. {Photoset-250}
  628. {block:Caption}{Caption}{/block:Caption}
  629. {/block:Photoset}
  630.  
  631. {block:Audio}
  632. {block:AudioPlayer}
  633. <div class="audiowrapper">
  634. {block:AlbumArt}
  635. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  636. {/block:AlbumArt}
  637.  
  638. <div class="playerbuttonbg">
  639. <div class="newplayerbutton">
  640. <div class="playerbuttonhug">
  641.  
  642. {AudioPlayerWhite}
  643.  
  644. </div>
  645. </div>
  646. </div>
  647.  
  648. <div class="trackdetails">
  649.  
  650. {block:TrackName}{TrackName}</a><br>{/block:TrackName}
  651. {block:Artist}Artist: {Artist}<br>{/block:Artist}
  652. {block:Album}Album: {Album}<br>{/block:Album}
  653. {PlayCountWithLabel}
  654.  
  655. </div>
  656. </div>
  657. {/block:AudioPlayer}
  658.  
  659. {block:Caption}{Caption}{/block:Caption}
  660. {/block:Audio}
  661.  
  662. {block:Video}
  663. {Video-250}
  664. {block:Caption}{Caption}{/block:Caption}
  665. {/block:Video}
  666.  
  667. <div id="footer">
  668. {block:Date}<a href="{Permalink}" title="{MonthNumberWithZero}.{DayOfMonthWithZero}.{ShortYear}"><i class="fa fa-clock-o"></i></a> {block:NoteCount} &nbsp;&nbsp; <a href="{Permalink}" title="{NoteCountWithLabel}"><i class="fa fa-heart"></i></a>{/block:NoteCount} {/block:Date}
  669. {block:HasTags} &nbsp;&nbsp; <a href="{Permalink}" title="{block:Tags}#{Tag} {/block:Tags}"><i class="fa fa-tags"></i></a> {/block:HasTags}
  670. <div style="float:right">
  671. {block:RebloggedFrom} + <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> {/block:RebloggedFrom}
  672. {block:RebloggedFrom} | <a href="{ReblogRootURL}" title="{ReblogRootName}">src</a>{/block:RebloggedFrom}
  673. </div>
  674. </div>
  675. <div class="like_and_reblog_buttons">
  676. <li>{ReblogButton size="15"}</li>
  677. <li>{LikeButton size="15"}</li>
  678. </div>
  679.  
  680. </div>{/block:Posts}
  681.  
  682. {block:PostNotes}{PostNotes}{/block:PostNotes}
  683.  
  684. <div id="spectrum">
  685. <a href="http://wonderfullythemes.tumblr.com" title="wonderfullythemes">theme</a>
  686. </div>
  687.  
  688. </div>
  689.  
  690.  
  691.  
  692.  
  693. </body>
  694. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement