API tools faq
paste
Advertisement
tharja

vivi theme

tharja
May 7th, 2014
1,515
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.31 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6. *.。.☆゜・*:.。.☆**☆.。.:*・゜☆.。.* *.。.☆゜・*:.。.☆**☆.。.:*・゜☆.。.*
  7.  
  8. vivi theme by coroncina.tumblr.com
  9. please don't touch the credits
  10.  
  11. *.。.☆゜・*:.。.☆**☆.。.:*・゜☆.。.**.。.☆゜・*:.。.☆**☆.。.:*・゜☆.。.*
  12. -->
  13.  
  14. <meta name="color:background" content=""/>
  15. <meta name="color:text" content=""/>
  16. <meta name="color:link" content=""/>
  17. <meta name="color:hover" content=""/>
  18. <meta name="color:post bg" content=""/>
  19. <meta name="color:border" content=""/>
  20. <meta name="color:nav bg" content=""/>
  21. <meta name="color:nav border"content=""/>
  22. <meta name="color:footer txt" content=""/>
  23. <meta name="color:perma" content=""/>
  24. <meta name="color:perma border" content=""/>
  25. <meta name="color:selection" content=""/>
  26. <meta name="color:selection txt" content=""/>
  27. <meta name="color:scroll" content=""/>
  28. <meta name="color:scroll border" content=""/>
  29.  
  30. <meta name="image:favicon" content=""/>
  31. <meta name="image:background" content=""/>
  32. <meta name="image:sidebar" content=""/>
  33. <meta name="image:cursor" content="" />
  34.  
  35. <meta name="if:bg cover" content="0"/>
  36. <meta name="if:250px" content="1"/>
  37. <meta name="if:extra links" content="0"/>
  38. <meta name="if:infinite scroll" content="1"/>
  39. <meta name="if:show tags" content="1"/>
  40. <meta name="if:no captions" content="1"/>
  41. <meta name="if:rounded perma" content="1"/>
  42.  
  43. <meta name="select:font" content="consolas" title="consolas">
  44. <meta name="select:font" content="calibri" title="calibri">
  45. <meta name="select:font size" content="10px" title="10px">
  46. <meta name="select:font size" content="11px" title="11px">
  47.  
  48. <meta name="text:link 1" content=""/>
  49. <meta name="text:link 1 url" content=""/>
  50. <meta name="text:link 2" content="" />
  51. <meta name="text:link 2 url" content=""/>
  52. <meta name="text:link 3" content="" />
  53. <meta name="text:link 3 url" content=""/>
  54. <meta name="text:link 4" content="" />
  55. <meta name="text:link 4 url" content=""/>
  56.  
  57. <title>{Title}</title>
  58. <link rel="shortcut icon" href="{image:favicon}">
  59. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  60. <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
  61.  
  62. <style type="text/css">
  63.  
  64. ::selection
  65. { background: {color:selection};
  66. color: {color:selection txt}; }
  67.  
  68. ::-moz-selection
  69. { background: {color:selection};
  70. color: {color:selection txt}; }
  71.  
  72. ::-webkit-selection
  73. { background:{color:selection};
  74. color: {color:selection txt}; }
  75.  
  76. ::-webkit-scrollbar-thumb:vertical
  77. { background-color:{color:scroll};
  78. height: 2px;
  79. border: 1px solid {color:scroll border} ;
  80. -moz-border-radius: 4px;
  81. -webkit-border-radius: 4px;
  82. border-radius:4px; }
  83.  
  84. ::-webkit-scrollbar
  85. { height: 2px;
  86. width: 5px;
  87. background: {color:background}; }
  88.  
  89. *, body, a, a:link, a:active, a:visited, a:hover
  90. { cursor: url({image:cursor}), auto; }
  91.  
  92. #content {
  93. margin-right:170px;
  94. margin-top:30px;
  95. width: 1000px;
  96. float: right;
  97. }
  98.  
  99. body {
  100. background-color: {color:background};
  101. background-image: url({image:background});
  102. background-attachment:fixed;background-repeat:repeat;
  103. background-position:center;
  104. {block:ifbgcover} no-repeat center fixed ;
  105. -webkit-background-size: cover;
  106. -moz-background-size: cover;
  107. -o-background-size: cover;
  108. background-size: cover; {/block:ifbgcover}
  109. font-family: {select:font};
  110. font-size: {select:font size};
  111. color: {color:text};
  112. margin: 0;
  113. padding: 0;
  114. }
  115.  
  116. a {
  117. color: {color:link};
  118. text-decoration: none;
  119. }
  120.  
  121. a:hover {
  122. opacity:1;
  123. text-decoration:underline;
  124. color:{color:hover};
  125. -webkit-transition: all 0.5s ease;
  126. -moz-transition: all 0.5s ease;
  127. -o-transition: all 0.5s ease;
  128. }
  129.  
  130. blockquote {
  131. padding-left:5px;
  132. border-left:2px solid;
  133. color: {color:text};
  134. margin-left:3px;
  135. margin-bottom:5px;
  136. }
  137.  
  138. iframe, img, embed, object, video {
  139. max-width: 100%;
  140. }
  141.  
  142. img {
  143. height: auto;
  144. width: auto;
  145. }
  146.  
  147. .sideb {
  148. width:250px;
  149. padding-top:120px;
  150. margin-left:20px;
  151. position:fixed;
  152. text-align:right;
  153. }
  154.  
  155. .sideb a {
  156. width:auto;
  157. padding-top:0px;
  158. padding-bottom:0px;
  159. padding-left:3px;
  160. padding-right:3px;
  161. border-right:1px solid {color:nav border};
  162. border-top:1px solid {color:nav border};
  163. border-bottom:1px solid {color:nav border};
  164. border-left:0px solid {color:nav border};
  165. background:{color:nav bg};
  166. color:{color:links};
  167. font-family: consolas;
  168. font-size:11px;
  169. text-transform: uppercase;
  170. letter-spacing:1px;
  171. }
  172.  
  173. .sideb li {
  174. display:block;
  175. float:right;
  176. clear:right;
  177. margin-bottom:5px;
  178. }
  179.  
  180. .sideb img {
  181. width:70px;
  182. padding:1px;
  183. margin-left:-1px;
  184. margin-top:-4px;
  185. border:1px solid {color:nav border};
  186. position:relative;
  187. }
  188.  
  189. #desc {
  190. height:auto;
  191. width:100px;
  192. margin-top:210px;
  193. padding:2px;
  194. margin-left:156px;
  195. position:fixed;
  196. background: {color:post bg};
  197. color:{color:text};
  198. border: 1px solid {color:border};
  199. font-size: 10px;
  200. letter-spacing:1px;
  201. font-family:{select:font};
  202. text-align:center;
  203. }
  204.  
  205. #llinks {
  206. text-align: center;
  207. font-family: {select:font};
  208. font-size: 10;
  209. margin-top: 10px;
  210. }
  211.  
  212. #llinks a {
  213. padding: 1px 2px 1px 2px;
  214. background:{color:nav bg};
  215. color: {color:link};
  216. border: 1px solid {color:nav border};
  217. line-height: 20px;
  218. }
  219.  
  220. article {
  221. background: {color:post bg};
  222. margin: 20px;
  223. margin-left:5px;
  224. margin-bottom:8px;
  225. padding: 5px;
  226. padding-bottom:9px;
  227. {block:ifnot250px} width: 400px; {/block:ifnot250px}
  228. {block:if250px} width: 250px; {/block:if250px}
  229. border: 1px solid {color:border};
  230. }
  231.  
  232. article:hover #perma {
  233. opacity:1;
  234. margin-bottom:-5px;
  235. -webkit-transition: all .3s ease-in-out;
  236. -moz-transition: all .3s ease-in-out;
  237. -o-transition: all .3s ease-in-out;
  238. }
  239.  
  240. .chat span {
  241. float: left;
  242. margin-right: 1%;
  243. }
  244.  
  245. {block:ifnocaptions}
  246. #cap {
  247. display:none;
  248. }
  249. {/block:ifnocaptions}
  250.  
  251. #perma {
  252. opacity:0;
  253. margin-bottom: -26px;
  254. text-align: left;
  255. position: relative;
  256. {block:ifpermaborder}
  257. border: 1px solid {color:nav border};
  258. {/block:ifpermaborder}
  259. margin-top:2px;
  260. padding-top: 4px;
  261. border:1px solid {color:perma border};
  262. font-family: consolas;
  263. padding:2px;
  264. font-size: 10px;
  265. letter-spacing:1px;
  266. color:{color:footer txt};
  267. padding-left:3px;
  268. background:{color:perma};
  269. {block:ifroundedperma}
  270. -moz-border-radius: 4px;
  271. -webkit-border-radius: 4px;
  272. border-radius:4px;
  273. {/block:ifroundedperma}
  274. {block:PermalinkPage}display:none;{/block:PermalinkPage}
  275. }
  276.  
  277. #tags {
  278. font-family:{select:font};
  279. font-size:10px;
  280. letter-spacing:1px;
  281. color: {color:footer txt};
  282. margin-top:2px;
  283. text-align:left;
  284. background: {color:perma};
  285. padding-left: 2px;
  286. padding:2px;
  287. padding-top:1px;
  288. {block:PermalinkPage}display:none;{/block:PermalinkPage} }
  289.  
  290. .tumblr_audio_player {
  291. width: 400px;
  292. height: 100px;
  293. padding-bottom:2px;
  294. overflow: hidden;
  295. position: relative;
  296. z-index: 1000;
  297. }
  298.  
  299. #pp {
  300. text-align: left;
  301. {block:ifnot250px} width:400px; {/block:ifnot250px}
  302. {block:if250px} width:250px; {/block:if250px}
  303. margin-top:2px;
  304. padding-top: 2px;
  305. color:{color:footer txt};
  306. padding-left:3px;
  307. }
  308.  
  309. .qst {
  310. padding: 2px;
  311. background: {color:perma};
  312. color: {color:text};
  313. -moz-border-radius: 4px;
  314. -webkit-border-radius: 4px;
  315. border-radius:4px;
  316. }
  317.  
  318. .answ {
  319. padding-left:2px;
  320. }
  321.  
  322. .cht {
  323. margin-left:-25px;
  324. margin-top:-5px;
  325. }
  326.  
  327. .quotxt {
  328. font-size:16px;
  329. font: {select:font};
  330. }
  331.  
  332. .kashi {
  333. padding:3px;
  334. margin-left:2px;
  335. font-size:13px;
  336. font: {select:font};
  337. }
  338.  
  339. .pptitle {
  340. padding-top:-10px;
  341. }
  342.  
  343. .qq {
  344. background: {color:perma};
  345. border-left: 10px solid {color:perma border};
  346. margin: 0;
  347. padding: 10px;
  348. }
  349.  
  350. {block:ifnotinfinitescroll}
  351. .pg {
  352. font-size:15px;
  353. font: {select:font};
  354. color: {color:link};
  355. text-align:center;
  356. padding:2px;
  357. padding-top:5px;
  358. }
  359. {/block:ifnotinfinitescroll}
  360.  
  361. {block:ifinfinitescroll}
  362. .pg {
  363. display:none;
  364. }
  365. {/block:ifinfinitescroll}
  366.  
  367. </style>
  368. </head>
  369. <body>
  370. <div class="sideb">
  371. <img src="{image:Sidebar}">
  372. <li><a href="/">home</a></li>
  373. <li><a href="/ask">mail</a></li>
  374. <li><a href="/archive">past</a></li>
  375. <li><a href="http://adf.ly/oLiQw">♡♡♡</a></li>
  376. </div>
  377. <div id="desc">{Description}
  378. {block:ifextralinks}
  379. <div id="llinks">
  380. <a href="{text:link 1 url}">{text:link 1}</a>
  381. <a href="{text:link 2 url}"> {text:link 2}</a>
  382. <a href="{text:link 3 url}">{text:link 3}</a>
  383. <a href="{text:link 4 url}">{text:link 4}</a>
  384. </div>
  385. {/block:ifextralinks}
  386. {block:Pagination}
  387. <div class="pagination">
  388. <div class="pg">
  389. {block:PreviousPage}<a href="{PreviousPage}"><</a>{/block:PreviousPage}
  390. {block:NextPage}<a href="{NextPage}">></a>{/block:NextPage}
  391. </div></div>
  392. {/block:Pagination}
  393. </div>
  394. <nav>
  395. <ul>
  396. {block:HasPages}
  397. {block:Pages}
  398. <li> <a href="{URL}">{Label}</a></li>
  399. {/block:Pages}
  400. {/block:HasPages}
  401. </ul>
  402. </nav>
  403.  
  404. <div id="content">
  405. {block:Posts}
  406. {block:ContentSource}<!-- {SourceURL}
  407. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  408. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  409. {/block:ContentSource}
  410. <article>
  411. {block:Text}
  412. <div class="text">
  413. <div class="pptitle">
  414. {block:Title}<h1 class="title">
  415. <a href="{Permalink}">{Title}</a>
  416. </h1>{/block:Title}
  417. {Body}</div>
  418. {/block:Text}
  419.  
  420. {block:Photo}
  421. <div class="photo">
  422. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}" />{LinkCloseTag}
  423. <div id="cap">{block:Caption}{Caption}{/block:Caption}</div>
  424. {/block:Photo}
  425.  
  426. {block:Photoset}
  427. <div class="photoset">
  428. {block:IndexPage}
  429. {block:ifnot250px}{Photoset-400}{/block:ifnot250px}
  430. {block:if250px}{Photoset-250}{/block:if250px}
  431. {/block:IndexPage}
  432. {block:PermalinkPage}
  433. {block:ifnot250px}{Photoset-400}{/block:ifnot250px}
  434. {block:if250px}{Photoset-250}{/block:if250px}
  435. {/block:PermalinkPage}
  436. <div id="cap">{block:Caption}{Caption}{/block:Caption}</div>
  437. {/block:Photoset}
  438.  
  439. {block:Quote}
  440. <div class="quote">
  441. <div class="quotxt">
  442. « {Quote} » </div>
  443. {block:Source}<div class="kashi"><cite> ─ {Source} </cite></div>{/block:Source}
  444. {/block:Quote}
  445.  
  446. {block:Link}
  447. <div class="link">
  448. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  449. {block:Description}{Description}{/block:Description}
  450. {/block:Link}
  451.  
  452. {block:Chat}
  453. <div class="chat">
  454. <div class="cht">
  455. <ul>
  456. {block:Lines}
  457. {block:Label}<b>{Label}</b>{/block:Label} {Line}<br>
  458. {/block:Lines}
  459. </ul></div>
  460. {/block:Chat}
  461.  
  462. {block:Audio}
  463. <div class="audio">
  464. {block:AlbumArt}
  465. <img src="{AlbumArtURL}" width="100px" height="100px"/>
  466. {/block:AlbumArt}
  467. {AudioPlayerWhite}
  468. {block:AudioEmbed}{AudioEmbed}{/block:AudioEmbed}
  469. <div class="qq">
  470. {block:TrackName}▪ <b>track:</b> {TrackName}{/block:TrackName}</span><br>
  471. {block:Artist}▪ <b>artist:</b> {Artist}{/block:Artist}</div>
  472. <div id="cap">{block:Caption}{Caption}{/block:Caption}</div>
  473. {/block:Audio}
  474.  
  475. {block:Video}
  476. <div class="video">
  477. <div class="video-player">{block:ifnot250px}{Video-400}{/block:ifnot250px}
  478. {block:if250px}{Video-250}{/block:if250px}
  479. </div>
  480. <div id="cap">{block:Caption}{Caption}{/block:Caption}</div>
  481. {/block:Video}
  482.  
  483. {block:Answer}
  484. <div class="answer">
  485. <div class="qst">
  486. {Asker} asked: <b>{Question}</b></div>
  487. <div class="answ">{Answer}</div>
  488. {/block:Answer}
  489.  
  490. </div>
  491. <div id="perma">
  492. {TimeAgo} ▪ <a href="{Permalink}">{NoteCountWithLabel}</a>
  493. {block:RebloggedFrom}<a href="{ReblogParentURL}">via</a> - <a href="{ReblogRootURL}">source</a>{/block:RebloggedFrom}
  494. {block:ifshowtags}
  495. {block:HasTags}<div id="tags">
  496. {block:Tags} #<a href="{TagURL}">{Tag}</a>{/block:Tags}</div>{/block:HasTags}{block:ifshowtags}
  497. </div>
  498. {block:PermalinkPage}
  499. <div id="pp">
  500. {block:Date}{Month} {DayOfMonth}{DayOfMonthSuffix}, {Year}{/block:Date}
  501. {block:NoteCount} ▪ {NoteCountWithLabel}{/block:NoteCount}
  502. {block:HasTags}</br>tagged as: {block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  503. {block:RebloggedFrom}</br>source: <a href="{ReblogRootURL}">{ReblogRootName}</a> - via: <a href="{ReblogParentURL}">{ReblogParentName}</a><br>{/block:RebloggedFrom}
  504. {block:PostNotes}{PostNotes}{/block:PostNotes}
  505. </div></div></div>
  506. {/block:PermalinkPage}
  507. </footer>
  508. </article>
  509. {/block:Posts}
  510.  
  511. </div>
  512.  
  513. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  514. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  515. {block:IfInfiniteScroll}
  516. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  517. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  518. {/block:IfInfiniteScroll}
  519.  
  520. <script>
  521. (function() {
  522. var $tumblelog = $('#content');
  523. {block:IfInfiniteScroll}
  524. $tumblelog.infinitescroll({
  525. navSelector : ".pagination",
  526. nextSelector : ".pagination a:first",
  527. itemSelector : "article",
  528. bufferPx : 50,
  529. done : "",
  530. loading: {
  531. img : "",
  532. msgText: ""
  533. },
  534. },
  535. function( newElements ) {
  536. var $newElems = $( newElements ).css({ opacity: 0 });
  537. $newElems.imagesLoaded(function(){
  538. $newElems.animate({ opacity: 1 });
  539. $tumblelog.masonry( 'appended', $newElems);
  540. });
  541. }
  542. );
  543. {/block:IfInfiniteScroll}
  544. $tumblelog.imagesLoaded( function(){
  545. $tumblelog.masonry({
  546. columnWidth: function( containerWidth ) {
  547. return containerWidth / 100;
  548. }
  549. });
  550. });
  551. })();
  552. </script>
  553. </body>
  554. </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!