API tools faq
paste
Advertisement
str-wrs

Morpheus

str-wrs
Jan 8th, 2016
13,946
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.63 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. THEME: MORPHEUS
  4. by acuite
  5.  
  6. - inspired by the instagram website!
  7. - don't steal this pls
  8. - enjoy, ilu (ﾉ◕ヮ◕)ﾉ*:･ﾟ✧
  9.  
  10. - @acuite for more themes
  11.  
  12. - go to approx line 772 to add extra links
  13.  
  14. -->
  15.  
  16. <html>
  17. <head>
  18.  
  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="image:Profile" content=""/>
  25.  
  26. <meta name="color:Background" content="#f8f8f8"/>
  27. <meta name="color:Post" content="#fff"/>
  28. <meta name="color:Border" content="#eee"/>
  29. <meta name="color:Title" content="#222"/>
  30. <meta name="color:Text" content="#555"/>
  31. <meta name="color:Link" content="#999"/>
  32. <meta name="color:Hover" content="#ddd"/>
  33.  
  34. <meta name="if:Fixed Header" content=""/>
  35. <meta name="if:Shadows" content=""/>
  36. <meta name="if:Tags" content=""/>
  37. <meta name="if:Load More" content=""/>
  38. <meta name="if:Paginate" content=""/>
  39. <meta name="if:Round Edges" content=""/>
  40.  
  41. <meta name="select:Header" content="newhead" title="New">
  42. <meta name="select:Header" content="oldhead" title="Original">
  43.  
  44. <meta name="select:Font" content="font_os" title="Open Sans">
  45. <meta name="select:Font" content="font_ssp" title="Source Sans Pro">
  46. <meta name="select:Font" content="font_karla" title="Karla">
  47.  
  48. <meta name="select:Captions" content="creg" title="Regular">
  49. <meta name="select:Captions" content="cmin" title="Minimal">
  50. <meta name="select:Captions" content="cinl" title="Inline">
  51. <meta name="select:Captions" content="chid" title="Hide">
  52.  
  53. <meta name="text:Post" content="400"/>
  54. <meta name="text:Margin" content="50"/>
  55.  
  56. <meta name="text:Link 1" content="/"/>
  57. <meta name="text:Link 1 Title" content="one"/>
  58. <meta name="text:Link 2" content="/" />
  59. <meta name="text:Link 2 Title" content="two"/>
  60. <meta name="text:Link 3" content="/" />
  61. <meta name="text:Link 3 Title" content="three"/>
  62. <meta name="text:Link 4" content="/" />
  63. <meta name="text:Link 4 Title" content="four"/>
  64. <meta name="text:Link 5" content="/" />
  65. <meta name="text:Link 5 Title" content="five"/>
  66. <meta name="text:Link 6" content="/" />
  67. <meta name="text:Link 6 Title" content="six"/>
  68.  
  69. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  70. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  71. <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic|Source+Sans+Pro:400,400italic,600,600italic,700,700italic|Karla:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
  72.  
  73. <style type="text/css">
  74.  
  75. ::-webkit-scrollbar{width:11px;height:11px;background:{color:Border};}
  76. ::-webkit-scrollbar-thumb{background:rgba({RGBcolor:Link},0.5);}
  77. ::-webkit-scrollbar,::-webkit-scrollbar-thumb{border:5px solid {color:Background};}
  78.  
  79. .tmblr-iframe--desktop-logged-in-controls, .iframe-controls--desktop, .tmblr-iframe, #tumblr_controls{-webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%);opacity:0.5;z-index:99999999!important;}
  80.  
  81. /* General */
  82.  
  83. body {
  84. margin:0px;
  85. color:{color:Text};
  86. background:{color:Background};
  87. }
  88.  
  89. .cap,.txt,.ans,.qut,.desc,.srch {
  90. font-smooth:always;
  91. -webkit-font-smoothing:antialiased;
  92. -moz-osx-font-smoothing: grayscale;
  93. }
  94.  
  95. a:link, a:active, a:visited {text-decoration:none;}
  96. body,p,pre,blockquote,big,small,sub,sup,.entry {font-size:10px;}
  97. .font_os,.font_os pre,.font_os input{
  98. font-family:'Open Sans',Arial,Helvetica,sans-serif;
  99. }
  100.  
  101. .font_ssp,.font_ssp pre,.font_ssp input{
  102. font-family:'Source Sans Pro',Arial,Helvetica,sans-serif;
  103. }
  104.  
  105. .font_karla,.font_karla pre,.font_karla input{
  106. font-family:'Karla',Arial,Helvetica,sans-serif;
  107. }
  108.  
  109. a,.play {
  110. transition:0.5s ease;
  111. -o-transition:0.5s ease;
  112. -moz-transition:0.5s ease;
  113. -webkit-transition:0.5s ease;
  114. }
  115.  
  116. /* Credit & Scroll to Top */
  117.  
  118. .c,.top{position:fixed;right:30px;width:40px;}
  119. .c {bottom:30px;}
  120. .top {bottom:50px;display:none;}
  121.  
  122. /* Pagination */
  123.  
  124. .cp {font-weight:600;}
  125. .cp,.jp,.pag a{display:inline-block;vertical-align:middle;margin:0 10px;}
  126. .pag a i,.top{font-size:20px;}
  127. .pag {position:relative;}
  128. .load {cursor:pointer;display:block;}
  129. .c,.top,.pag,.load {text-align:center;}
  130. .c,.pag,.load {font-size:9px;letter-spacing:1px;text-transform:uppercase;}
  131. {block:ifnotPaginate}
  132. .pag,#infscr-loading {display:none!important;}
  133. {/block:ifnotPaginate}
  134.  
  135. /* Containers */
  136.  
  137. .center {
  138. position:relative;
  139. margin:{text:Margin}px auto;
  140. width:{text:Post}px;
  141. }
  142.  
  143. #tab1,.hold {
  144. {block:ifFixedHeader}
  145. margin-top:calc(68px + {text:Margin}px);
  146. {/block:ifFixedHeader}
  147. }
  148.  
  149. .entry img{max-width:100%;height:auto;}
  150. .entry {margin:{text:Margin}px 0px;}
  151.  
  152. /* Header */
  153.  
  154. header {
  155. padding:20px;
  156. width:calc(100% - 42px);
  157. {block:ifFixedHeader}
  158. position:fixed;
  159. top:0;
  160. z-index:999;
  161. {/block:ifFixedHeader}
  162. }
  163.  
  164. .header_hold {width:calc({text:Post}px + 100px);margin:auto;font-size:0;}
  165. .hcen {text-align:center;}
  166. .hrig {text-align:right;}
  167. .iconlinks a:first-of-type {margin:0;}
  168. .iconlinks a {font-size:14px;margin-left:15px;}
  169. .textlink a {font-size:11px;line-height:100%;font-weight:600;}
  170. .hlef,.hcen,.hrig{display:inline-block;vertical-align:middle;width:33.3%;}
  171.  
  172. .hlef .icon,.hlef h1{display:inline-block;vertical-align:middle;}
  173. .hlef .icon {width:26px;border-radius:3px;margin-right:8px;}
  174. .hlef h1 {
  175. margin:0;
  176. padding:5px 0 6px;
  177. font-size:13px;
  178. line-height:100%;
  179. font-weight:600;
  180. }
  181.  
  182. .hcen nav a{font-size:9px;line-height:100%;display:inline-block;margin:0 6px;}
  183. .srch {
  184. display:inline-block;
  185. background:{color:Background};
  186. border:1px solid {color:Border};
  187. padding:4px;
  188. border-radius:3px;
  189. width:130px;
  190. }
  191.  
  192. .srch i {font-size:11px;margin-right:5px;}
  193. .search-form {display:inline-block;width:40px;outline:none;margin:0;}
  194. .search-form input {
  195. font-size:10px;
  196. background:inherit;
  197. border:none;
  198. outline:none;
  199. padding:0;
  200. width:100%;
  201. }
  202.  
  203. .search-form input[type=text] {color:{color:Link};}
  204. input::-webkit-input-placeholder {color:{color:Link};}
  205. input::-moz-placeholder {color:{color:Link};}
  206. input:-moz-placeholder {color:{color:Link};}
  207. input:-ms-input-placeholder {color:{color:Link};}
  208. input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance:none;}
  209.  
  210. .oldhead .icon,.oldhead .srch,.oldhead .iconlinks,.oldhead .newt,.newhead .hcen nav,.newhead .textlink,.newhead .oldt {display:none;}
  211.  
  212. /* Tabs */
  213.  
  214. #tab1,#tab2,#tab3,#tab4{display:none;font-size:0;}
  215. #tab1 {display:block;}
  216.  
  217. .profile {padding:30px;}
  218. .image,.pinfo {display:inline-block;vertical-align:middle;}
  219. .pinfo h2 {margin:0;font-size:15px;font-weight:600;}
  220. .pinfo {width:calc(100% - 92px - 30px);}
  221. .desc {font-size:11px;margin-top:5px;}
  222. .image {
  223. width:90px;
  224. height:90px;
  225. margin-right:30px;
  226. border-radius:50%;
  227. border:1px solid {color:Border};
  228. }
  229.  
  230. .hold nav {padding:10px;border-bottom:1px solid {color:Border};}
  231. .hold nav:last-of-type {border:0;}
  232. .hold nav h2 {font-size:11px;line-height:100%;margin:0 0 5px;}
  233. .hold nav a {
  234. display:inline-block;
  235. width:33.333%;
  236. margin:5px 0;
  237. font-size:10px;
  238. line-height:100%;
  239. }
  240.  
  241. .blogroll {max-height:400px;overflow:auto;}
  242. .blog {display:block;padding:10px;height:34px;}
  243. .blog img,.name {display:inline-block;vertical-align:middle;}
  244. .blog img{width:34px;height:34px;border-radius:50%;margin-right:12px;}
  245. .name {line-height:0;margin-top:-2px;max-width:calc(100% - 42px);}
  246. .name i,.name b{display:block;line-height:100%;color:{color:Text};}
  247. .name i{margin-top:1px;font-size:9px;font-style:normal;}
  248. .name b{font-size:11px;font-weight:600;}
  249. .hold ::-webkit-scrollbar,.hold ::-webkit-scrollbar-thumb{
  250. border-color:{color:Post};
  251. }
  252.  
  253. /* Titles */
  254.  
  255. .hold h1 {
  256. margin:0;
  257. padding:15px;
  258. font-size:11px;
  259. line-height:100%;
  260. letter-spacing:0.5px;
  261. text-transform:uppercase;
  262. border-bottom:1px solid {color:Border};
  263. }
  264.  
  265. .entry h2 {margin:10px;font-size:12px;}
  266. h3,h4,h5 {margin:10px;font-size:10px;letter-spacing:0.5px;text-transform:uppercase;}
  267.  
  268. /* Permalinks */
  269.  
  270. .p_top {padding:8px;font-size:0;}
  271. .from,.time{display:inline-block;vertical-align:middle;line-height:100%;}
  272. .from {font-weight:600;font-size:10px;width:calc(100% - 75px);}
  273. .time {font-size:9px;text-align:right;width:72px;padding-right:3px;}
  274. .from img {
  275. display:inline-block;
  276. vertical-align:middle;
  277. width:18px;
  278. margin-right:5px;
  279. border-radius:50%;
  280. }
  281.  
  282. .p_bot {padding:8px;font-size:0;border-top:1px solid {color:Border};}
  283. .com,.eli {display:inline-block;vertical-align:middle;}
  284. .com {font-size:9px;line-height:100%;width:calc(100% - 25px);}
  285. .com i {margin-right:3px;}
  286. .eli {text-align:right;font-size:4.5px;letter-spacing:1px;width:25px;}
  287. .tags a{display:inline-block;margin:0 4px 0 0;}
  288. {block:ifTags}
  289. .vc{display:none!important;}
  290. .p:not(.tags) .vc{display:inline-block!important;}
  291. {/block:ifTags}
  292.  
  293. /* Quotes */
  294.  
  295. .qut_hold {padding:25px;}
  296. .src {margin-bottom:10px;}
  297. .qut {font-size:14px;font-style:italic;font-weight:300;}
  298.  
  299. /* Audio & Chat */
  300.  
  301. .chat,.lines,.chat h2 {padding:10px;}
  302. .chat h2 {margin:0px;}
  303. .lines b{display:block;font-weight:400;}
  304. .audio {height:57px;padding:20px;}
  305. .audio_player {height:57px;}
  306. .tn{font-size:11px;font-weight:600;}
  307. .au {padding:8px;font-size:10px;}
  308. .au span{display:block;margin:4px;}
  309. .coverart {width:57px;float:left;margin-right:16px;}
  310. .coverart img {width:100%;border-radius:4px;}
  311.  
  312. .audio:hover .play {opacity:1;}
  313. .play {
  314. opacity:0;
  315. background:rgba({RGBcolor:Post},0.75);
  316. position:absolute;
  317. margin:0px;
  318. width:57px;
  319. height:57px;
  320. }
  321.  
  322. .tumblr_audio_player {
  323. width:27px;
  324. height:27px;
  325. margin:5px;
  326. padding:10px 9px 10px 11px;
  327. overflow:hidden;
  328. border-radius:50%;
  329. background:#fff;
  330. }
  331.  
  332. /* Text */
  333.  
  334. ol,ul {padding:0 0 0 20px;}
  335. li {margin:5px;}
  336. p,blockquote,pre,ul,ol{margin:10px;}
  337. b,strong {font-weight:600;}
  338. blockquote p{margin:10px 0;}
  339. blockquote p:first-child{margin:0 0 10px;}
  340. blockquote p:last-child{margin:10px 0 0;}
  341. blockquote p:only-child{margin:0;}
  342. blockquote blockquote {margin:0;}
  343. blockquote{padding-left:10px;border-left:1px solid {color:Border};}
  344. pre {
  345. margin:0;
  346. white-space:pre-wrap;
  347. white-space:-moz-pre-wrap;
  348. white-space:-pre-wrap;
  349. white-space:-o-pre-wrap;
  350. word-wrap:break-word;
  351. }
  352.  
  353. /* Video */
  354.  
  355. .video {overflow:hidden;}
  356. .vine-embed,#youtube_iframe {display:block;}
  357. .instagram-media {border-radius:0!important;box-shadow:none!important;}
  358.  
  359. /* Captions */
  360.  
  361. .nt {
  362. display:block;
  363. margin:13px;
  364. font-size:10px;
  365. font-weight:600;
  366. color:{color:Title};
  367. }
  368.  
  369. .txt iframe,.cap iframe{display:block;max-width:100%;overflow:hidden;}
  370. .txt {padding:10px;}
  371. .cmin blockquote {border:0;padding:0;}
  372. .cmin p,.cmin blockquote{margin:0;}
  373. .creg {margin:-5px 3px 13px;}
  374. .chid {display:none;}
  375. .cinl,.cmin {margin:-5px 13px 13px;}
  376. .cinl *:not(a):not(ul):not(ol):not(li){margin:0;padding:0;display:inline;}
  377. .cinl p:first-of-type {display:inline!important;}
  378. .cinl blockquote {border:0;}
  379. .cinl p,.cinl blockquote p {display:block!important;margin:0!important;}
  380. {block:PermalinkPage}
  381. .creg,.cinl,.cmin {margin:0;border-bottom:1px solid {color:Border};}
  382. .creg {padding:10px;}
  383. .cinl,.cmin {padding:20px;}
  384. {/block:PermalinkPage}
  385.  
  386. /* Captions */
  387.  
  388. .txt iframe,.cap iframe{
  389. display:block;
  390. max-width:100%;
  391. overflow:hidden;
  392. {block:ifRoundEdges}border-radius:4px!important;{/block:ifRoundEdges}
  393. }
  394.  
  395. /* Photosets */
  396.  
  397. #tumblr_lightbox,.tmblr-lightbox {
  398. background:rgba({RGBcolor:Background},0.99)!important;
  399. }
  400.  
  401. #vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{
  402. opacity:0!important;
  403. }
  404.  
  405. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image,
  406. #tumblr_lightbox_right_image, .lightbox-image {
  407. box-shadow:none!important;
  408. border-radius:0!important;
  409. {block:ifRoundEdges}border-radius:4px!important;{/block:ifRoundEdges}
  410. }
  411.  
  412. /* Ask */
  413.  
  414. .askername {font-size:0;padding:15px;border-bottom:1px dotted {color:Border};}
  415. .aski,.askicon {display:inline-block;vertical-align:middle;}
  416. .aski {font-size:10px;line-height:100%;width:calc(100% - 32px);}
  417. .askicon {width:16px;margin-right:7px;border-radius:50%;}
  418. .que {padding:15px;}
  419.  
  420. /* Permalink Page + Postnotes */
  421.  
  422. .pph {text-transform:lowercase;}
  423. .perma {padding:15px;font-size:9px;line-height:175%;}
  424. .pmt a:after {content:',';}
  425. .pmt a:last-of-type:after {content:'.';}
  426.  
  427. .pn ul,.pn ol {margin:0;padding:0;list-style-type:none;}
  428. .pn li{
  429. display:block;
  430. margin:0;
  431. padding:8px;
  432. font-size:9px;
  433. line-height:100%;
  434. border-top:1px solid {color:Border};
  435. }
  436.  
  437. .pn,.pn img{display:none;}
  438. .pn {font-size:0;}
  439. .pnh {display:block;font-weight:600;}
  440.  
  441. /* Tooltips */
  442.  
  443. #s-m-t-tooltip{
  444. max-width:300px;
  445. margin:15px;
  446. z-index:99999999;
  447. padding:6px;
  448. font-size:8.5px;
  449. line-height:100%;
  450. word-wrap:break-word;
  451. break-word:break-all;
  452. letter-spacing:0.5px;
  453. text-transform:uppercase;
  454. color:{color:Link};
  455. background:{color:Border};
  456. }
  457.  
  458. /* Common Styles */
  459.  
  460. .ask,p,blockquote,.lines,.qut{line-height:150%;}
  461. a,.perma,.src,.lines b,.tn,h2,.com,h1,.srch,.ask{color:{color:Link};}
  462. .cap a {color:{color:Text};}
  463. .from a,h1 a,.hrig a,a.tumblr_blog,.hold nav h2,.aski b *{color:{color:Title};}
  464. a:hover, a h2:hover{color:{color:Hover};}
  465. h2 a i,.pag a i{margin:0px 2px;}
  466.  
  467. .ans,.ask,.chat,.audio,.qut_hold,.p_top,.bx,.video,.pcap,.txt,.blog {
  468. border-bottom:1px solid {color:Border};
  469. }
  470.  
  471. {block:ifRoundEdges}
  472. .entry,.txt img,.ans img,.cap img,.pcap img,#s-m-t-tooltip,.hold{
  473. border-radius:4px!important;
  474. }
  475. {/block:ifRoundEdges}
  476.  
  477. {block:ifShadows}
  478. .entry,#s-m-t-tooltip,.hold,header{
  479. box-shadow:rgba(0,0,0,0.05)1px 1px 3px;
  480. }
  481. {/block:ifShadows}
  482.  
  483. .entry,.hold,header{
  484. background:{color:Post};
  485. border:1px solid {color:Border};
  486. }
  487.  
  488. /* Etc */
  489.  
  490. .notes img {width:0px;}
  491. img {margin:0;display:block;}
  492.  
  493. </style>
  494. </head>
  495. <body class="{select:Font}">
  496.  
  497. <header class="{select:Header}">
  498. <div class="header_hold">
  499. <span class="hlef">
  500. <img class="icon" src="{PortraitURL-48}"/>
  501. <h1 class="newt"><a href="/">{Title}</a></h1>
  502. <h1 class="oldt"><a class="one" href="#" title="posts">{Title}</a></h1>
  503. </span>
  504.  
  505. <span class="hcen">
  506. <div class="srch"><i class="fa fa-search"></i>
  507. <form action="/search" class="search-form" method="get">
  508. <input type="text" name="q" placeholder="Search" value="{SearchQuery}"/>
  509. </form></div>
  510. <nav>
  511. <a href="/">refresh</a>
  512. <a href="/ask">message</a>
  513. <a href="/archive">history</a>
  514. </nav>
  515. </span>
  516.  
  517. <span class="hrig">
  518. <nav class="iconlinks">
  519. <a class="one" href="#" title="posts"><i class="fa fa-home"></i></a>
  520. <a class="two" href="#" title="explore"><i class="fa fa-compass"></i></a>
  521. <a class="three" href="#" title="following"><i class="fa fa-heart"></i></a>
  522. <a class="four" href="#" title="profile"><i class="fa fa-user"></i></a>
  523. </nav>
  524. <nav class="textlink">
  525. <a class="four" href="#" title="profile">{Name}</a>
  526. </nav>
  527. </span>
  528. </div>
  529. </header>
  530.  
  531. <div class="center">
  532.  
  533. <!-- Tab 1: Content Start (do not edit) -->
  534. <div id="tab1">
  535. <div id="content">
  536. {block:Posts}
  537. <div class="entry">
  538.  
  539. {block:Date}
  540. <div class="p_top">
  541. <div class="from">
  542. {block:RebloggedFrom}
  543. <a href="{ReblogRootURL}">
  544. <img src="{ReblogRootPortraitURL-30}">
  545. {ReblogRootName}
  546. </a>
  547. {/block:RebloggedFrom}
  548.  
  549. {block:NotReblog}
  550. <a href="{Permalink}">
  551. <img src="{PortraitURL-30}">
  552. {Name}
  553. </a>
  554. {/block:NotReblog}
  555. </div>
  556.  
  557. <div class="time"><a href="{Permalink}">{TimeAgo}</a></div>
  558. </div>
  559. {/block:Date}
  560.  
  561. {block:Text}
  562. <div class="txt">
  563. {block:Title}<h2>{Title}</h2>{/block:Title}
  564. {Body}
  565. </div>
  566. {/block:Text}
  567.  
  568. {block:Link}
  569. <div class="txt">
  570. <h2><a title="{URL}" href="{URL}">{Name} <i class="fa fa-angle-right"></i></a></h2>
  571. {block:Description}{Description}{/block:Description}
  572. </div>
  573. {/block:Link}
  574.  
  575. {block:Photo}
  576. <div class="bx">
  577. <a href="{Permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/></a>
  578. </div>
  579. {/block:Photo}
  580.  
  581. {block:Photoset}
  582. <div class="bx">
  583. <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>
  584. </div>
  585. {/block:Photoset}
  586.  
  587. {block:Quote}
  588. <div class="qut_hold">
  589. {block:Source}<div class="src">{Source}</div>{/block:Source}
  590. <div class="qut">{Quote}</div>
  591. </div>
  592. {/block:Quote}
  593.  
  594. {block:Chat}
  595. <div class="chat">
  596. {block:Title}<h2>{Title}</h2>{/block:Title}
  597. {block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</div></div>{/block:Lines}
  598. </div>
  599. {/block:Chat}
  600.  
  601. {block:Audio}
  602. <div class="audio">
  603. {block:AlbumArt}
  604. <div class="coverart"><img src="{AlbumArtURL}"/></div>
  605. {/block:AlbumArt}
  606. {block:AudioPlayer}
  607. <div class="play">{AudioPlayerWhite}</div>
  608. {/block:AudioPlayer}
  609.  
  610. <div class="au">
  611. {block:TrackName}<span class="tn">{TrackName}</span>{/block:TrackName}
  612. {block:Artist}<span>by {Artist}</span>{/block:Artist}
  613. </div>
  614. </div>
  615. {/block:Audio}
  616.  
  617. {block:Video}
  618. <div class="video">{Video-500}</div>
  619. {/block:Video}
  620.  
  621. {block:Answer}
  622. <div class="ask">
  623. <div class="askername">
  624. <img class="askicon" src="{AskerPortraitURL-48}">
  625. <div class="aski"><b>{Asker}</b> asked a question:</div>
  626. </div>
  627. <div class="que">{Question}</div>
  628. </div>
  629. <div class="ans">{Answer}</div>
  630. {/block:Answer}
  631.  
  632. {block:IndexPage}
  633. <div class="p_mid">
  634. <a class="nt" href="{Permalink}">{NoteCountWithLabel}</a>
  635. </div>
  636. {/block:IndexPage}
  637.  
  638. {block:Caption}<div class="cap {select:Captions}">{Caption}</div>{/block:Caption}
  639.  
  640. {block:IndexPage}
  641. <div class="p_bot">
  642. <div class="com">
  643. <i class="fa fa-heart-o"></i>
  644. {block:ifTags}
  645. <span class="p {block:HasTags} tags {/block:HasTags}">
  646. {block:HasTags}
  647. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  648. {/block:HasTags}
  649. <a class="vc" href="{Permalink}">View all comments...</a>
  650. </span>
  651. {/block:ifTags}
  652. {block:ifnotTags}
  653. <a class="vc" href="{Permalink}">View all comments...</a>
  654. {/block:ifnotTags}
  655. </div>
  656.  
  657. <div class="eli">
  658. <a href="{Permalink}">
  659. <i class="fa fa-circle-o"></i>
  660. <i class="fa fa-circle-o"></i>
  661. <i class="fa fa-circle-o"></i>
  662. </a>
  663. </div>
  664. </div>
  665. {/block:IndexPage}
  666.  
  667. {block:PermalinkPage}
  668. {block:Date}
  669. <div class="pph">
  670. <div class="perma">
  671. posted {TimeAgo} on {DayofMonthWithSuffix} {Month}
  672. {block:RebloggedFrom}<br>
  673. via <a href="{ReblogParentURL}">{ReblogParentName}</a> &nbsp;&nbsp;&nbsp;
  674. source <a href="{ReblogRootURL}">{ReblogRootName}</a>
  675. {/block:RebloggedFrom}
  676.  
  677. {block:HasTags}<div class="pmt">tags: &nbsp;
  678. {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}
  679. </div>{/block:HasTags}
  680. <a href="#" class="pnh">{NoteCountWithLabel}</a>
  681. </div>
  682.  
  683. {block:PostNotes}
  684. <div class="pn">{PostNotes}</div>
  685. {/block:PostNotes}
  686.  
  687. </div>
  688. {/block:Date}
  689. {/block:PermalinkPage}
  690.  
  691. {block:ContentSource}
  692. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  693. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  694. {/block:SourceLogo}
  695. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  696. {/block:ContentSource}
  697.  
  698. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  699.  
  700. </div>
  701. {/block:Posts}
  702.  
  703. {block:ifPaginate}
  704. {block:Pagination}
  705. <div class="pag">
  706. {block:PreviousPage}
  707. <a href="{PreviousPage}"><i class="fa fa-angle-left"></i></a>
  708. {/block:PreviousPage}
  709.  
  710. {block:JumpPagination length="3"}
  711. {block:CurrentPage}
  712. <span class="cp">{PageNumber}</span>
  713. {/block:CurrentPage}
  714. {block:JumpPage}
  715. <a class="jp" href="{URL}">{PageNumber}</a>
  716. {/block:JumpPage}
  717. {/block:JumpPagination}
  718.  
  719. {block:NextPage}
  720. <a href="{NextPage}"><i class="fa fa-angle-right"></i></a>
  721. {/block:NextPage}
  722. </div>
  723. {/block:Pagination}
  724. {/block:ifPaginate}
  725.  
  726. </div>
  727.  
  728. {block:ifnotPaginate}
  729. {block:Pagination}
  730. <div class="pag">
  731. {block:PreviousPage}
  732. <a href="{PreviousPage}" class="prev">back</a>
  733. {/block:PreviousPage}
  734. {block:NextPage}
  735. <a href="{NextPage}" class="next">next</a>
  736. {/block:NextPage}
  737. </div>
  738.  
  739. {block:ifLoadMore}
  740. <a class="load">Load More</a>
  741. {/block:ifLoadMore}
  742. {/block:Pagination}
  743. {/block:ifnotPaginate}
  744.  
  745. </div>
  746. <!-- Tab 1: Content End -->
  747.  
  748.  
  749.  
  750.  
  751.  
  752. <!-- Tab 2: Explore Starts -->
  753. <div id="tab2">
  754. <div class="hold">
  755. <h1>explore</h1>
  756. <nav>
  757. <h2>Main Links</h2>
  758. {block:ifLink1}
  759. <a href="{text:Link 1}">{text:Link 1 Title}</a>
  760. {/block:ifLink1}{block:ifLink2}
  761. <a href="{text:Link 2}">{text:Link 2 Title}</a>
  762. {/block:ifLink2}{block:ifLink3}
  763. <a href="{text:Link 3}">{text:Link 3 Title}</a>
  764. {/block:ifLink3}{block:ifLink4}
  765. <a href="{text:Link 4}">{text:Link 4 Title}</a>
  766. {/block:ifLink4}{block:ifLink5}
  767. <a href="{text:Link 5}">{text:Link 5 Title}</a>
  768. {/block:ifLink5}{block:ifLink6}
  769. <a href="{text:Link 6}">{text:Link 6 Title}</a>
  770. {/block:ifLink6}
  771. </nav>
  772. <!-- Example Box:
  773.  
  774. <nav>
  775. <h2>Category Name</h2>
  776. <a href="/">lorem</a>
  777. <a href="/">ipsum</a>
  778. <a href="/">dolor</a>
  779. <a href="/">sit</a>
  780. <a href="/">amet</a>
  781. <a href="/">conseq</a>
  782. </nav>
  783.  
  784. -->
  785. </div>
  786. </div>
  787. <!-- Tab 2: Explore End -->
  788.  
  789.  
  790.  
  791.  
  792.  
  793. <!-- Tab 3: Blogroll Starts -->
  794. <div id="tab3">
  795. <div class="hold">
  796. <h1>following</h1>
  797. <div class="blogroll">{block:Following}{block:Followed}<a href="{FollowedURL}"><div class="blog {FollowedName}"><img src="{FollowedPortraitURL-48}"><div class="name"><b>{FollowedName}</b><i>{FollowedTitle}</i></div></div></a>{/block:Followed}{/block:Following}</div>
  798. </div>
  799. </div>
  800. <!-- Tab 3: Blogroll End -->
  801.  
  802.  
  803.  
  804.  
  805.  
  806. <!-- Tab 4: Profile Starts -->
  807. <div id="tab4">
  808. <div class="hold profile">
  809. <img class="image" src="{block:ifProfileImage}{image:Profile}{/block:ifProfileImage}{block:ifnotProfileImage}{PortraitURL-128}{/block:ifnotProfileImage}"/>
  810. <div class="pinfo">
  811. <h2>{Name}</h2>
  812. <div class="desc">{Description}</div>
  813. </div>
  814. </div>
  815. <div class="hold" style="margin:10px 0 0;padding:10px;">
  816. <iframe id="ask_form" frameborder="0" border="0" scrolling="no" width="100%" height="258" allowtransparency="true" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com"></iframe>
  817. </div>
  818. </div>
  819. <!-- Tab 4: Profile End -->
  820.  
  821.  
  822.  
  823.  
  824.  
  825. </div>
  826.  
  827. <a href="#" class="top"><i class="fa fa-angle-up"></i></a>
  828. <div class="c"><a href="http://acuite.tumblr.com">acuite</a></div>
  829.  
  830. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  831. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  832. <script src ="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  833. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  834. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  835. <script>
  836. $(document).ready(function(){
  837. $('.photo-slideshow').pxuPhotoset({
  838. lightbox: true,
  839. rounded: false,
  840. gutter: '1px',
  841. photoset: '.photo-slideshow',
  842. photoWrap: '.photo-data',
  843. photo: '.pxu-photo'
  844. });
  845. {block:ifnotPaginate}
  846. var $container = $('#content');
  847. $container.infinitescroll({
  848. itemSelector: '.entry',
  849. navSelector: '.pag',
  850. nextSelector: '.next',
  851. loadingImg: ' ',
  852. loadingText: ' ',
  853. donetext: 'No more posts' ,
  854. bufferPx: 2000,
  855. {block:ifLoadMore}
  856. errorCallback: function(){
  857. jQuery('.load').delay(50).fadeOut();
  858. }
  859. {/block:ifLoadMore}
  860. },
  861. function( newElements ) {
  862. var $newElems = $( newElements );
  863. var $newElemsIDs = $newElems.map(function(){
  864. return this.id;
  865. }).get();
  866. $newElems.find('.photo-slideshow').pxuPhotoset({
  867. lightbox: true,
  868. rounded: false,
  869. gutter: '1px',
  870. photoset: '.photo-slideshow',
  871. photoWrap: '.photo-data',
  872. photo: '.pxu-photo'
  873. });
  874. resizeVideos();
  875. console.log($newElems, $newElemsIDs);
  876. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  877. });
  878.  
  879. {block:ifLoadMore}
  880. $(window).unbind(".infscr");
  881. $(".load").click(function(){
  882. $("#content").infinitescroll("retrieve");
  883. });
  884. {/block:ifLoadMore}
  885.  
  886. {/block:ifnotPaginate}
  887. });
  888.  
  889.  
  890.  
  891. // scroll to top © html-tuts.com
  892. var amountScrolled = 500;
  893. $(window).scroll(function() {
  894. if ($(window).scrollTop() > amountScrolled) {
  895. $('a.top').fadeIn('slow');
  896. } else {
  897. $('a.top').fadeOut('slow');
  898. }
  899. });
  900.  
  901. $('a.top').click(function() {
  902. $('body, html').animate({
  903. scrollTop: 0
  904. }, 'slow');
  905. return false;
  906. });
  907.  
  908.  
  909.  
  910. // drop links & post notes
  911. $(document).ready(function(){
  912. $(".pn").hide();
  913. $(".pnh").show();$('.pnh').toggle(function(){
  914. $(".pn").slideDown(function(){});
  915. },function(){
  916. $(".pn").slideUp(function(){});
  917. });
  918. });
  919.  
  920.  
  921.  
  922. // tooltips
  923. (function($){
  924. $(document).ready(function(){
  925. $("[title]").style_my_tooltips({
  926. tip_delay_time:200,
  927. tip_fade_speed:300
  928. }
  929. );
  930. });
  931. })(jQuery);
  932.  
  933.  
  934.  
  935. // tabs
  936. $(document).ready(function(){
  937. $("a.one").click(function(){
  938. $("#tab1").show();
  939. $("#tab2").hide();
  940. $("#tab3").hide();
  941. $("#tab4").hide();
  942. });
  943. $("a.two").click(function(){
  944. $("#tab1").hide();
  945. $("#tab2").show();
  946. $("#tab3").hide();
  947. $("#tab4").hide();
  948. });
  949. $("a.three").click(function(){
  950. $("#tab1").hide();
  951. $("#tab2").hide();
  952. $("#tab3").show();
  953. $("#tab4").hide();
  954. });
  955. $("a.four").click(function(){
  956. $("#tab1").hide();
  957. $("#tab2").hide();
  958. $("#tab3").hide();
  959. $("#tab4").show();
  960. });
  961. });
  962. </script>
  963. </body>
  964. </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!