Advertisement
cristina_

eternity.

Jul 30th, 2016
5,667
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.59 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4.  
  5. THEME:
  6. ᵉᵗᵉʳᶰᶦᵗʸ
  7. BY:
  8. ʷʰᵉᶫᵛᵉˢ
  9.  
  10.  
  11. RULES:
  12. ▻ do not copy.
  13. ▻ do not steal.
  14. ▻ @whelves for more themes!✰
  15.  
  16.  
  17.  
  18.  
  19. -->
  20.  
  21.  
  22.  
  23.  
  24. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  25. <html>
  26. <head>
  27.  
  28. <title>{Title}</title>
  29.  
  30.  
  31. <meta name="image:Sidebar" content=""/>
  32.  
  33.  
  34. <meta name="color:accent" content="#e2cede" />
  35. <meta name="color:background" content="#f3f3f3" />
  36. <meta name="color:bold" content="#aaaaaa" />
  37. <meta name="color:border" content="#f3f3f3" />
  38. <meta name="color:italic" content="#e8c4ea" />
  39. <meta name="color:hover" content="#e2e2e2" />
  40. <meta name="color:link" content="#b0b0b0" />
  41. <meta name="color:scrollbar" content="#f0d4f3" />
  42. <meta name="color:text" content="#625e5e" />
  43. <meta name="color:underline" content="#848283" />
  44.  
  45.  
  46.  
  47. <meta name="text:Link 1 URL" content="/"/>
  48. <meta name="text:Link 1 name" content="link"/>
  49. <meta name="text:Link 2 URL" content="/"/>
  50. <meta name="text:Link 2 name" content="link"/>
  51. <meta name="text:Link 3 URL" content="/"/>
  52. <meta name="text:Link 3 name" content="link"/>
  53.  
  54.  
  55.  
  56. <link rel="shortcut icon" href="{Favicon}">
  57. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  58. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  59. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  60. <link href="https://fonts.googleapis.com/css?family=Asap|Roboto:500" rel="stylesheet">
  61. <!--fonts-->
  62.  
  63.  
  64.  
  65. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  66.  
  67. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  68. <script>
  69. (function($){
  70. $(document).ready(function(){
  71. $("[title]").style_my_tooltips({
  72. tip_follows_cursor:true,
  73. tip_delay_time:0,
  74. tip_fade_speed:400,
  75. attribute:"title"
  76. });
  77. });
  78. })(jQuery);
  79. </script>
  80.  
  81.  
  82. <style type="text/css">
  83.  
  84.  
  85. /*Basics*/
  86.  
  87.  
  88. body {
  89. background-color:{color:background};
  90. color:{color:text};
  91. font-family: 'Asap', sans-serif;
  92. font-size:10px;
  93. line-height:150%;
  94. text-align:justify;
  95. }
  96.  
  97.  
  98. a:link, a:active, a:visited {
  99. color:{color:link};
  100. text-decoration:none;
  101. -webkit-transition:all 0.5s ease-out;
  102. -moz-transition:all 0.5s ease-out;
  103. transition:all 0.5s ease-out;
  104. }
  105.  
  106.  
  107.  
  108. a:hover {
  109. color:{color:hover};
  110. cursor:help;
  111. }
  112.  
  113.  
  114.  
  115. /*Styles*/
  116.  
  117. i, em{
  118. color:{color:italic};
  119. }
  120.  
  121.  
  122. b, strong{
  123. font-weight:bold;
  124. color:{color:bold};}
  125.  
  126. u{
  127. color:{color:underline};
  128. padding-bottom:0px;
  129. z-index:2321232837283;
  130. }
  131.  
  132.  
  133. h1{
  134. text-transform:capitalize;
  135. margin:10px;
  136. font-size:11px;
  137. color:{color:accent};
  138. }
  139.  
  140. h2{
  141. text-transform:lowercase;
  142. margin:25px;
  143. text-align:center;
  144. }
  145.  
  146. .cap{
  147. margin:15px;}
  148.  
  149. .tx{
  150. margin:10px;
  151. }
  152.  
  153. ol, ul {
  154. padding:0px;
  155. list-style-type:none;}
  156.  
  157. ul li,ol li {
  158. position:relative;
  159. padding-left:25px;}
  160.  
  161. li {
  162. margin:3px 0px;}
  163.  
  164. ul li:before, ol li:before {
  165. content:'›';
  166. position:absolute;
  167. display:block;
  168. font-size:11px;
  169. left:10px;
  170. font-weight:700;
  171. color:#999999;
  172. }
  173.  
  174. blockquote {
  175. margin:10px;
  176. padding-left:10px;
  177. border-left:1px solid;
  178. border-color:{color:scrollbar};
  179. width:360px;}
  180.  
  181.  
  182.  
  183.  
  184.  
  185.  
  186. /*Posts */
  187.  
  188. #container {
  189. width:410px;
  190. margin-left:500px;
  191. margin-top:76px;
  192. position: absolute;
  193. float: right;
  194. background-color:transparent;
  195. }
  196.  
  197. #post {
  198. border-radius:2px;
  199. width:400px;
  200. padding:0px;
  201. overflow:hidden;
  202. margin-bottom:70px;
  203. background-color:#fff;
  204. }
  205.  
  206.  
  207. #info{
  208. margin:5px;
  209. }
  210.  
  211. #info .ti {
  212. padding-right:20px;
  213. margin:10px;
  214. font-size:9px;
  215. text-transform:lowercase;
  216. font-family: 'Roboto';
  217. }
  218.  
  219. #info .ti a{
  220. padding-right:5px;}
  221.  
  222. #tags{
  223. margin:10px;
  224. font-size:10px;
  225. }
  226.  
  227. #tags a{
  228. padding-right:5px;}
  229.  
  230.  
  231. /*Nav */
  232.  
  233.  
  234. #sbar{
  235. position:fixed;
  236. background-color:white;
  237. border-radius:3px;
  238. border:1px solid {color:border};
  239. width:135px;
  240. padding:5px;
  241. margin-left:250px;
  242. margin-top:80px;
  243. }
  244.  
  245.  
  246. #sbar img{
  247. border-radius:3px;
  248. width:135px;
  249. }
  250.  
  251.  
  252. #abt{
  253. margin-top:10px;
  254. width:130px;
  255. margin-left:0px;
  256. line-height:160%;
  257. text-align:justify;
  258. padding:2px;
  259. z-index:1;
  260. }
  261.  
  262.  
  263.  
  264.  
  265. /*navigation and description*/
  266.  
  267.  
  268. #icons {
  269. position:absolute;
  270. width:140px;
  271. text-transform:capitalize;
  272. margin-left:-10px;
  273. margin-top:10px;
  274. -webkit-transition: all 1s ease;
  275. -moz-transition: all 1s ease;
  276. -o-transition: all 1s ease;
  277. -ms-transition: all 1s ease;
  278. transition: all 1s ease;
  279. }
  280.  
  281. #icons a {float:left;text-align:center;margin-left:10px;line-height:20px;}
  282.  
  283.  
  284. .cmn-t-underline {
  285. position: relative;
  286. display: inline-block;
  287. }
  288. .cmn-t-underline:after {
  289. display: block;
  290. position: absolute;
  291. left: 0;
  292. bottom: 1px;
  293. width: 0;
  294. height: 2px;
  295. background-color:white;
  296. content:"";
  297. transition: width 0.3s;
  298. }
  299. .cmn-t-underline:hover {
  300. color: #333;
  301. }
  302. .cmn-t-underline:hover:after {
  303. width: 100%;
  304. }
  305.  
  306.  
  307. /* Bubble Right */
  308. .hvr-bubble-right {
  309. display: inline-block;
  310. vertical-align: middle;
  311. -webkit-transform: translateZ(0);
  312. transform: translateZ(0);
  313. box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  314. -webkit-backface-visibility: hidden;
  315. backface-visibility: hidden;
  316. -moz-osx-font-smoothing: grayscale;
  317. position: relative;
  318. }
  319. .hvr-bubble-right:before {
  320. pointer-events: none;
  321. position: absolute;
  322. z-index: -1;
  323. content: '';
  324. border-style: solid;
  325. -webkit-transition-duration: 0.3s;
  326. transition-duration: 0.3s;
  327. -webkit-transition-property: transform;
  328. transition-property: transform;
  329. top: calc(50% - 10px);
  330. right: 0;
  331. border-width: 10px 0 10px 10px;
  332. border-color: transparent transparent transparent white;
  333. }
  334. .hvr-bubble-right:hover:before, .hvr-bubble-right:focus:before, .hvr-bubble-right:active:before {
  335. -webkit-transform: translateX(10px);
  336. transform: translateX(10px);
  337. }
  338.  
  339. /*Pagination*/
  340.  
  341.  
  342. #pag {
  343. width:100px;
  344. float:left;
  345. position:relative;
  346. text-align:left;
  347. }
  348.  
  349.  
  350. /*Audio*/
  351.  
  352. .audio {
  353. height:85px;
  354. margin-bottom:10px;
  355. }
  356. .audio-album {
  357. position:absolute;
  358. width:85px;
  359. opacity:.0;
  360. }
  361. .audio-player {
  362. opacity:1;
  363. filter:alpha(opacity=100);
  364. border:30px solid #FFF;
  365. width:25px;
  366. height:25px;
  367. overflow:hidden;
  368. position:absolute;
  369. z-index:2;
  370. -webkit-transition: all 0.5s ease;
  371. -moz-transition: all 0.5s ease;
  372. -ms-transition: all 0.5s ease;
  373. -o-transition: all 0.5s ease;
  374. transition: all 0.5s ease;}
  375.  
  376. .audio-info {
  377. width:225px;
  378. height:100%;
  379. line-height:180%;
  380. padding:0px 20px 0px 20px;
  381. text-align:right;
  382. display: table;
  383. }
  384.  
  385. .audio-info p {
  386. display: table-cell;
  387. vertical-align: middle;
  388. text-align:right;
  389. }
  390.  
  391. /*chat* *notes*/
  392.  
  393. .chat{margin:10px;}
  394. .lines {padding:10px;border-top:1px solid {color:border};}
  395. .lines:first-child,.chat h2{border:none;}
  396. .lines b{display:block;font-weight:400;color:{color:accent};}
  397.  
  398.  
  399.  
  400.  
  401. /*Ask*/
  402.  
  403. #question {
  404. text-align:left;
  405. margin:5px;
  406. }
  407.  
  408.  
  409.  
  410. #asker {
  411. font-style:bold;
  412. margin:20px;
  413. }
  414.  
  415. #asker img {
  416. float:left;
  417. width:25px;
  418. border-radius:100px;
  419. margin-right:7px;
  420.  
  421.  
  422. }
  423.  
  424. #tumblr_lightbox,.tmblr-lightbox {
  425. background:rgba({RGBcolor:Background},0.5)!important;
  426. }
  427.  
  428. #vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{
  429. opacity:0!important;
  430. }
  431.  
  432. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image,
  433. #tumblr_lightbox_right_image, .lightbox-image {
  434. box-shadow:none!important;
  435. border-radius:0px!important;
  436. {block:ifRoundEdges}border-radius:4px!important;{/block:ifRoundEdges}
  437. }
  438.  
  439. /* Scrollbar */
  440.  
  441. ::-webkit-scrollbar {
  442. width:5px;
  443. height:3px;
  444. padding:5px;
  445. }
  446. ::-webkit-scrollbar {
  447. background-color:{color:scollbar};
  448. }
  449. ::-webkit-scrollbar-track {
  450. border:5px solid {color:background};
  451. background-color:white;
  452. }
  453. ::-webkit-scrollbar-thumb {
  454. border-right:3px solid {color:background};
  455. background-color:{color:scrollbar}; -webkit-border-radius: 10px;
  456. border-radius: 10px;
  457. }
  458.  
  459. ::selection {
  460. background-color:{color:accent};
  461. }
  462.  
  463. /* controls */
  464. #tumblr_controls, .tmblr-iframe{ z-index:99999!important; -webkit-filter:invert(100%); -moz-filter:invert(100%); -o-filter:invert(100%); -ms-filter:invert(100%); filter:invert(100%); position:fixed!important; top:0px!important; right:0px!important; opacity:.5;
  465. -webkit-transition:all 0.6s ease-out;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out}
  466.  
  467.  
  468. #credit {font-size:10px;letter-spacing:0px;text-transform:uppercase; bottom:10px; right:11px; position:fixed;z-index:auto;z-index:178243862476237;}
  469.  
  470.  
  471. #credit a{height:5px;line-height:4px;padding:5px;background:{color:background};opacity:1;display:block;}
  472.  
  473.  
  474. </style>
  475.  
  476. </head>
  477.  
  478. <body>
  479.  
  480. <div id="sbar" class="hvr-bubble-right">
  481.  
  482.  
  483. <div id ="sbarimg">
  484. <img src="{image:sidebar}"/></div>
  485. <div id="abt">
  486. {Description}
  487. </div>
  488.  
  489. <div id="icons">
  490. <a href="/" class="cmn-t-underline"><i>{title}.</i></a>
  491. <a href="/ask" class="cmn-t-underline">contact</a>
  492. <a href="/archive" class="cmn-t-underline">history</a>
  493. {block:ifLink1name}
  494. <a href="{text:Link 1 URL}" class="cmn-t-underline" > {text:Link 1 name} </a>
  495. {/block:ifLink1name}
  496. {block:ifLink2name}
  497. <a href="{text:Link 2 URL}" class="cmn-t-underline"> {text:Link 2 name} </a>
  498. {/block:ifLink2name}
  499. {block:ifLink3name}
  500. <a href="{text:Link 3 URL}" class="cmn-t-underline" > {text:Link 3 name} </a>
  501. {/block:ifLink3name}
  502.  
  503. </div>
  504.  
  505. </div>
  506.  
  507. <div id="credit"><a href="http:/whelves.tumblr.com/"> W. </a></div>
  508.  
  509. <div id="container">
  510. {block:Posts}
  511. <div id="post">
  512.  
  513. {block:IndexPage}
  514. <div id="info">
  515. <div class="ti">
  516. week {WeekOfYear} &nbsp;
  517. <a href="{Permalink}"> {timeago} </a> &nbsp;
  518. {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  519. &nbsp;
  520. {block:RebloggedFrom}<a href="{ReblogParentURL}"></a>{/block:RebloggedFrom} &nbsp; {block:ContentSource} <a href="{SourceURL}"></a>{/block:ContentSource}</div>
  521. </div>
  522. {/block:IndexPage}
  523.  
  524.  
  525. {block:Text}
  526. {block:Title}
  527. <h1>{Title}</h1>
  528. {/block:title}
  529. <div class="tx">
  530. {body}
  531. </div>
  532. {/block:Text}
  533.  
  534.  
  535. {block:Link}
  536. <h1>{Name}</h1>
  537. {block:Description}
  538. <div class="tx">
  539. {Description}
  540. </div>
  541. {/block:Description}
  542. {/block:Link}
  543.  
  544.  
  545. {block:Quote}
  546. <h2> ‘ {Quote} ’ </h2>
  547. {/block:Quote}
  548.  
  549.  
  550. {block:Photo}
  551. <div class="photo"><img style="width:400px;" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/></div>
  552. {/block:Photo}
  553.  
  554. {block:Photoset}
  555. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  556. {/block:Photoset}
  557.  
  558. {block:Chat}
  559. <div class="chat">
  560. {block:Title}<h2>{Title}</h2>{/block:Title}
  561. {block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</div></div>{/block:Lines}
  562. </div>
  563. {/block:Chat}
  564.  
  565.  
  566.  
  567. {block:Audio}
  568. <div class="audio">
  569. {block:AlbumArt}<img class="audio-album" src="{AlbumArtURL}">{/block:AlbumArt}
  570. <div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  571. </div>
  572. <div class="audio-info">
  573. <p>{block:TrackName}{TrackName}<BR>{/block:TrackName}
  574. {block:Artist}{Artist}<BR>{/block:Artist}
  575. </p>
  576. </div>
  577. </div>
  578. <br>
  579. {block:ExternalAudio}<b>Download:</b> <a href="{ExternalAudioURL}">click here</a><br />{/block:ExternalAudio}
  580. {/block:Audio}
  581.  
  582.  
  583. {block:Video}
  584. {Video-400}
  585. {/block:Video}
  586.  
  587.  
  588. {block:Caption}<div class="cap {select:Captions}">{Caption}</div>{/block:Caption}
  589.  
  590. {block:Answer}
  591. <div id="asker">
  592. <img src="{AskerPortraitURL-40}">{Asker} said: &nbsp;{Question}
  593. </div>
  594. <br>
  595. <div id="question">
  596. {Answer}
  597. </div>
  598. {/block:Answer}
  599.  
  600. {block:IndexPage}
  601.  
  602. <div id="tags">{block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}
  603. </div>
  604.  
  605. {/block:IndexPage}
  606.  
  607.  
  608.  
  609.  
  610. {block:PermalinkPage}
  611. <div id="info">
  612.  
  613. <span style="text-transform:lowercase;">
  614. {block:Date}
  615. posted on {Month} {DayOfMonthWithZero}{DayOfMonthSuffix} at <a href="{Permalink}" >{12Hour}:{Minutes} {AmPm}</a>{/block:Date}
  616. {block:RebloggedFrom}
  617. <br>
  618. source: <a href="{ReblogRootURL}">{ReblogRootName}</a>&nbsp;&nbsp; via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  619. {block:HasTags}
  620. <br>
  621. FILE UNDER: {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}
  622. {/block:HasTags}</p>
  623. </span>
  624.  
  625. <a href="#" class="not">view {NoteCountWithLabel}</a>
  626. {block:PostNotes}
  627. <div class="nu">
  628. {PostNotes}
  629. </div>
  630. {/block:PostNotes}
  631. {/block:PermalinkPage}
  632.  
  633. </div>
  634.  
  635. {/block:Posts}
  636.  
  637. {block:Pagination}
  638. <div id="pag">{block:PreviousPage}
  639. <a href="{PreviousPage}">back</a>
  640. {/block:PreviousPage} &
  641. {block:NextPage}
  642. <a href="{NextPage}">forth</a>
  643. {/block:NextPage}
  644. </div><br><br><br>
  645. {/block:Pagination}</div>
  646.  
  647. <script>
  648. $(document).ready(function(){
  649. $(".nu").hide();
  650. $(".not").show();$('.not').toggle(function(){
  651. $(".nu").slideDown(function(){});
  652. },function(){
  653. $(".nu").slideUp(function(){});
  654. });
  655. $(".lb").hide();
  656. $(".lh").show();$('.lh').toggle(function(){
  657. $(".lb").slideDown(function(){});
  658. },function(){
  659. $(".lb").slideUp(function(){});
  660. });
  661. });
  662. </script>
  663.  
  664.  
  665. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  666. <script>
  667. $(document).ready(function(){
  668. $('.photo-slideshow').pxuPhotoset({
  669. lightbox: true,
  670. rounded: false,
  671. gutter: '1px',
  672. borderRadius: '0px',
  673. photoset: '.photo-slideshow',
  674. photoWrap: '.photo-data',
  675. photo: '.pxu-photo'
  676. });
  677. });
  678. </script>
  679.  
  680.  
  681.  
  682. </body>
  683. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement