API tools faq
paste
Advertisement
okesan

niiiucan

okesan
Aug 26th, 2014
281
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.96 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. W h i t e by
  3. :_;
  4. ,-.,-..-..-..-. .--. .--. ,-.,-.
  5. : ,. :: :: :; :' ..'' .; ; : ,. :
  6. :_;:_;:_;`.__.'`.__.'`.__,_;:_;:_;
  7. @ tumblr.com
  8.  
  9. Rules:
  10. ▣ DO NOT remove theme credit
  11. ▣ do not modify and claim as your own
  12. ▣ you can modify the theme as you please, just make sure to credit me
  13. -->
  14.  
  15. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  16. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  17. <head>
  18.  
  19. <!-- fade-out -->
  20. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
  21. <script type="text/javascript">
  22. $(document).ready(function() {
  23. $("body").css("display", "none");
  24. $("body").fadeIn(700);
  25. $("a.transition").click(function(event){
  26. event.preventDefault();
  27. linkLocation = this.href;
  28. $("body").fadeOut(1000, redirectPage);
  29. });
  30. function redirectPage() {
  31. window.location = linkLocation;
  32. }
  33. });
  34. </script>
  35.  
  36. <!-- fade out pictures -->
  37. <script type="text/javascript" src="http://static.tumblr.com/zh7ydxo/CIvlwa3c5/jquery.js"></script>
  38. <script type="text/javascript" src="http://static.tumblr.com/zh7ydxo/CtWlwa3d9/lazyload.js"></script>
  39. <script type="text/javascript" charset="utf-8">
  40. var $j = jQuery.noConflict();
  41. $j(function() {
  42. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  43. $j("img").lazyload({
  44. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  45. effect: "fadeIn",
  46. });
  47. });
  48. </script>
  49. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  50. <script type="text/javascript">
  51. $(function() {
  52. $('#toggle').click(function() {
  53. $('.toggle').slideToggle('slow');
  54. return false;
  55. });
  56. });
  57. </script>
  58.  
  59. <!-- scroll to top -->
  60. <script src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  61. <a href="javascript:;" id="scrollToTop" title="scroll to top"><img src="http://static.tumblr.com/ii9pnwy/6qRn1ekzg/1393103726_up4.png" border="0"></a>
  62. </script>
  63.  
  64. <!-- Customize theme colors, commands, text, etc -->
  65. <meta name="color:Background" content="#ffffff"/>
  66. <meta name="color:Posts text color" content="#bbbbbb"/>
  67. <meta name="color:Posts link color" content="#393939"/>
  68. <meta name="color:Tab links text color" content="#000000"/>
  69. <meta name="color:Current tab text color" content="#82CAD8"/>
  70. <meta name="color:Tab content background" content="#f9f9f9"/>
  71. <meta name="color:Tab content text" content="#aaaaaa"/>
  72. <meta name="color:Sublinks text" content="#aaaaaa"/>
  73. <meta name="color:Blog title" content="#000000"/>
  74. <meta name="color:Posts information background" content="#ffffff"/>
  75. <meta name="color:Posts information border" content="#f9f9f9"/>
  76. <meta name="color:Posts information tags" content="#bbbbbb"/>
  77. <meta name="color:Main Text" content="#000000"/>
  78. <meta name="color:Chat user1 background" content="#f0f0f0"/>
  79. <meta name="color:Chat user1 text" content="#F09595"/>
  80. <meta name="color:Chat user2 background" content="#f9f9f9"/>
  81. <meta name="color:Chat user2 text" content="#A7D0B0"/>
  82. <meta name="text:Main Link 1 Name" content="one"/>
  83. <meta name="text:Main Link 2 Name" content="two"/>
  84. <meta name="text:Main Link 3 Name" content="three"/>
  85. <meta name="text:Posts font size" content="10"/>
  86. <meta name="text:Your username" content=""/>
  87. <meta name="text:Main Link 1 Sublink 1 Name" content="sublink1"/>
  88. <meta name="text:Main Link 1 Sublink 1 URL" content="/"/>
  89. <meta name="text:Main Link 1 Sublink 2 Name" content="sublink2"/>
  90. <meta name="text:Main Link 1 Sublink 2 URL" content="/"/>
  91. <meta name="text:Main Link 1 Sublink 3 Name" content="sublink3"/>
  92. <meta name="text:Main Link 1 Sublink 3 URL" content="/"/>
  93. <meta name="text:Main Link 1 Sublink 4 Name" content="sublink4"/>
  94. <meta name="text:Main Link 1 Sublink 4 URL" content="/"/>
  95. <meta name="text:Main Link 1 Sublink 5 Name" content="sublink5"/>
  96. <meta name="text:Main Link 1 Sublink 5 URL" content="/"/>
  97. <meta name="text:Main Link 1 Sublink 6 Name" content="sublink6"/>
  98. <meta name="text:Main Link 1 Sublink 6 URL" content="/"/>
  99. <meta name="text:Main Link 1 Sublink 7 Name" content="sublink7"/>
  100. <meta name="text:Main Link 1 Sublink 7 URL" content="/"/>
  101. <meta name="text:Main Link 1 Sublink 8 Name" content="sublink8"/>
  102. <meta name="text:Main Link 1 Sublink 8 URL" content="/"/>
  103. <meta name="text:Main Link 1 Sublink 9 Name" content="sublink9"/>
  104. <meta name="text:Main Link 1 Sublink 9 URL" content="/"/>
  105. <meta name="text:Main Link 1 Sublink 10 Name" content="sublink10"/>
  106. <meta name="text:Main Link 1 Sublink 10 URL" content="/"/>
  107. <meta name="text:Main Link 1 Sublink 11 Name" content="sublink11"/>
  108. <meta name="text:Main Link 1 Sublink 11 URL" content="/"/>
  109. <meta name="text:Main Link 1 Sublink 12 Name" content="sublink12"/>
  110. <meta name="text:Main Link 1 Sublink 12 URL" content="/"/>
  111. <meta name="text:Main Link 1 Sublink 13 Name" content="sublink13"/>
  112. <meta name="text:Main Link 1 Sublink 13 URL" content="/"/>
  113. <meta name="text:Main Link 1 Sublink 14 Name" content="sublink14"/>
  114. <meta name="text:Main Link 1 Sublink 14 URL" content="/"/>
  115. <meta name="text:Main Link 1 Sublink 15 Name" content="sublink15"/>
  116. <meta name="text:Main Link 1 Sublink 15 URL" content="/"/>
  117. <meta name="text:Main Link 2 Sublink 1 Name" content="sublink1"/>
  118. <meta name="text:Main Link 2 Sublink 1 URL" content="/"/>
  119. <meta name="text:Main Link 2 Sublink 2 Name" content="sublink2"/>
  120. <meta name="text:Main Link 2 Sublink 2 URL" content="/"/>
  121. <meta name="text:Main Link 2 Sublink 3 Name" content="sublink3"/>
  122. <meta name="text:Main Link 2 Sublink 3 URL" content="/"/>
  123. <meta name="text:Main Link 2 Sublink 4 Name" content="sublink4"/>
  124. <meta name="text:Main Link 2 Sublink 4 URL" content="/"/>
  125. <meta name="text:Main Link 2 Sublink 5 Name" content="sublink5"/>
  126. <meta name="text:Main Link 2 Sublink 5 URL" content="/"/>
  127. <meta name="text:Main Link 2 Sublink 6 Name" content="sublink6"/>
  128. <meta name="text:Main Link 2 Sublink 6 URL" content="/"/>
  129. <meta name="text:Main Link full description" content="some other text here. some other text here. some other text here. some other text here. some other text here. some other text here."/>
  130. <meta name="image:Background" content="">
  131. <meta name="if:400px posts" content="0"/>
  132. <meta name="if:500px posts" content="1"/>
  133. <meta name="if:Show Captions" content="1"/>
  134.  
  135. {block:Description}
  136. <meta name="description" content="{MetaDescription}" />
  137. {/block:Description}
  138.  
  139. <meta charset="utf-8">
  140. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  141.  
  142. <title>{block:TagPage}{Tag} posts - {/block:TagPage} {block:SearchPage}{lang:Search results for SearchQuery} - {/block:SearchPage}{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
  143.  
  144. <link rel="shortcut icon" href="{Favicon}">
  145. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  146. <link href='http://fonts.googleapis.com/css?family=Domine' rel='stylesheet' type='text/css'>
  147.  
  148. <!-- Start of CSS -->
  149. <style type="text/css">
  150.  
  151. @font-face { font-family: "dubielitalic"; src: url('http://static.tumblr.com/m6mqatb/QUklrzd0z/dubielitalic.ttf');}
  152.  
  153. /* scroll to top */
  154. #scrollToTop:link,#scrollToTop:visited { color: transparent; background-color: transparent; display: none; position: fixed; bottom: 25px; right: 12px;}
  155.  
  156. /* dashboard follow buttons */
  157. iframe#tumblr_controls {
  158. position: fixed !important;
  159. right: 0px !important;
  160. opacity: 0.3;
  161. z-index: 999;
  162. -webkit-filter:invert(100%);
  163. }
  164.  
  165. /* scrollbar */
  166. ::-webkit-scrollbar {
  167. width: 9px;
  168. height: 9px;
  169. background-color: transparent;
  170. border: 1pt solid #f9f9f9;
  171. }
  172. ::-webkit-scrollbar-button:vertical {
  173. height:8px;
  174. display: block;
  175. background-color: #f1f1f1;
  176. border-left:1pt solid #ddd;
  177. border-right:1pt solid #ddd;
  178. }
  179. ::-webkit-scrollbar-button:horizontal {
  180. width: 4px;
  181. height: 4px;
  182. display: block;
  183. }
  184. ::-webkit-scrollbar-thumb:vertical {
  185. background-color: #f1f1f1;
  186. border: 1px solid #ddd;
  187. }
  188. ::-webkit-scrollbar-thumb:horizontal {
  189. background-color: #f1f1f1;
  190. border: 1px solid #f1f1f1;
  191. }
  192. ::-webkit-scrollbar-thumb {
  193. background-color: #f1f1f1;
  194. border-top: 1pt solid #f1f1f1;
  195. border-bottom: 1pt solid #f1f1f1;
  196. }
  197. ::-webkit-scrollbar-thumb:hover {
  198. background-color: #f1f1f1;
  199. }
  200. ::-webkit-scrollbar-track-piece {
  201. background-color: {color:Background};
  202. border-top: 1pt solid #f1f1f1;
  203. border-bottom: 1pt solid #f1f1f1;
  204. width: 4px;
  205. }
  206.  
  207. /* text highlight */
  208. ::-moz-selection {
  209. background-color: {color:Background};
  210. color: #000;
  211. }
  212. ::selection {
  213. background-color: {color:Background};
  214. color: #000;
  215. }
  216.  
  217. /* main commands */
  218.  
  219. body { /* main body */
  220. background: {color:Background} url('{image:background-color}');
  221. background-attachment: fixed;
  222. color: {color:Posts text color};
  223. font-family: 'Arial';
  224. font-size: {text:Posts font size}px;
  225. }
  226.  
  227. a { /* main links */
  228. text-decoration: none;
  229. color: {color:Posts link color};
  230. }
  231.  
  232. blockquote {
  233. margin: 0px 0px 0px 15px;
  234. padding: 0px 0px 0px 15px;
  235. border-left: 2px solid {color:Posts information border};
  236. }
  237.  
  238. /* top bar */
  239. #bar {
  240. margin: auto;
  241. width: 485px;
  242. }
  243.  
  244. #up {
  245. margin: auto;
  246. margin-top: 90px;
  247. width: 400px;
  248. }
  249.  
  250. #tabs {
  251. margin: 50px 40px 5px 39px;
  252. padding: 0px;
  253. list-style: none;
  254. text-align: left;
  255. overflow: hidden;
  256. font-family: 'Arial Narrow';
  257. text-transform: uppercase;
  258. letter-spacing: 2px;
  259. }
  260.  
  261. #tabs a {
  262. color: {color:Tab links text color};
  263. }
  264.  
  265. #tabs li {
  266. position: relative;
  267. display: inline-block;
  268. background-color: {color:Background};
  269. padding: 0px 0px 0px 0px;
  270. margin: 0px 10px 0px 0px;
  271. width: 65px;
  272. line-height: 200%;
  273. font-size: 8px;
  274. text-transform: uppercase;
  275. text-align: center;
  276. letter-spacing: 2px;
  277. border-top: 1px solid {color:Tab content background};
  278. border-bottom: 1px solid {color:Tab content background};
  279. }
  280.  
  281. #tabs li:hover{
  282. border-top: 1px dashed {color:Tab content background};
  283. border-bottom: 1px dashed {color:Tab content background};
  284. }
  285.  
  286. #tabs li #current {
  287. background-color: {color:Tab content background};
  288. color: {color:Current tab text color};
  289. padding: 10px;
  290. }
  291.  
  292. #content {
  293. position: relative;
  294. background-color: {color:Tab content background};
  295. margin: 10px 20px 10px 20px;
  296. padding: 20px;
  297. color: {color:Tab content text};
  298. text-align: justify;
  299. overflow-y: auto;
  300. width: 400px;
  301. font-size: 11px;
  302. font-family: 'Arial Narrow';
  303. letter-spacing: 1px;
  304. }
  305.  
  306. .sublinks li {
  307. display: inline-block;
  308. background-color: {color:Background};
  309. width: 125px;
  310. margin: 0px 5px 2px 0px;
  311. text-align: center;
  312. text-transform: uppercase;
  313. font-size: 8px;
  314. -moz-transition: all 0.6s ease-in-out;
  315. -webkit-transition: all 0.6s ease-in-out;
  316. -o-transition: all 0.6s ease-in-out;
  317. -ms-transition: all 0.6s ease-in-out;
  318. transition: all 0.6s ease-in-out;
  319. }
  320.  
  321. .sublinks li:hover {
  322. background-color: {color:Tab content background};
  323. }
  324.  
  325. .sublinks a {
  326. color: {color:Sublinks text};
  327. }
  328.  
  329. /* main posts */
  330.  
  331. #posts {
  332. margin-top:90px;
  333. }
  334.  
  335. .posts {
  336. padding: 20px;
  337. margin: auto;
  338. margin-bottom: 90px;
  339. {block:If400pxposts}
  340. width: 400px;
  341. {/block:If400pxposts}
  342. {block:If500pxposts}
  343. width: 500px;
  344. {/block:If500pxposts}
  345. {block:PermalinkPage}
  346. width: 500px;
  347. {/block:PermalinkPage}
  348. text-align: justify;
  349. }
  350.  
  351. .posts img {
  352. width: 100%;
  353. -webkit-transition: all 0.9s ease-in-out;
  354. -moz-transition: all 0.9s ease-in-out;
  355. -o-transition: all 0.9s ease-in-out;
  356. -ms-transition: all 0.9s ease-in-out;
  357. transition: all 0.9s ease-in-out;
  358. }
  359.  
  360. .posts img:hover {
  361. -webkit-filter: grayscale(100%);
  362. }
  363.  
  364. .posts li {
  365. list-style-type: square;
  366. }
  367.  
  368. .html_photoset {
  369. -webkit-transition: all 0.9s ease-in-out;
  370. -moz-transition: all 0.9s ease-in-out;
  371. -o-transition: all 0.9s ease-in-out;
  372. -ms-transition: all 0.9s ease-in-out;
  373. transition: all 0.9s ease-in-out;
  374. }
  375.  
  376. .html_photoset:hover {
  377. -webkit-filter: grayscale(100%);
  378. }
  379.  
  380. /* blog title */
  381. #title {
  382. padding: 5px;
  383. text-align: center;
  384. letter-spacing: -1px;
  385. font-family: 'Dubielitalic';
  386. font-size: 38px;
  387. font-style: italic;
  388. }
  389.  
  390. #title a {
  391. color: {color:Blog title};
  392. -moz-transition: all 0.6s ease-in-out;
  393. -webkit-transition: all 0.6s ease-in-out;
  394. -o-transition: all 0.6s ease-in-out;
  395. -ms-transition: all 0.6s ease-in-out;
  396. transition: all 0.6s ease-in-out;
  397. }
  398.  
  399. nav a {
  400. position: relative;
  401. }
  402.  
  403. .titletransition a {
  404. padding: 10px;
  405. -webkit-transition: color 0.3s;
  406. -moz-transition: color 0.3s;
  407. transition: color 0.3s;
  408. }
  409.  
  410. .titletransition a::before,
  411. .titletransition a::after {
  412. position: absolute;
  413. left: 0;
  414. width: 100%;
  415. height: 2px;
  416. background-color: {color:Blog title};
  417. content: '';
  418. opacity: 0;
  419. -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  420. -moz-transition: opacity 0.3s, -moz-transform 0.3s;
  421. transition: opacity 0.3s, transform 0.3s;
  422. -webkit-transform: translateY(-10px);
  423. -moz-transform: translateY(-10px);
  424. transform: translateY(-10px);
  425. }
  426.  
  427. .titletransition a::before {
  428. top: 0;
  429. -webkit-transform: translateY(-10px);
  430. -moz-transform: translateY(-10px);
  431. transform: translateY(-10px);
  432. }
  433.  
  434. .titletransition a::after {
  435. bottom: 0;
  436. -webkit-transform: translateY(10px);
  437. -moz-transform: translateY(10px);
  438. transform: translateY(10px);
  439. }
  440.  
  441. .titletransition a:hover,
  442. .titletransition a:focus {
  443. color: {color:Blog title};
  444. }
  445.  
  446. .titletransition a:hover::before,
  447. .titletransition a:focus::before,
  448. .titletransition a:hover::after,
  449. .titletransition a:focus::after {
  450. opacity: 1;
  451. -webkit-transform: translateY(0px);
  452. -moz-transform: translateY(0px);
  453. transform: translateY(0px);
  454. }
  455.  
  456. /* index permalink */
  457. #tags {
  458. background-color: {color:Posts information background};
  459. padding: 10px;
  460. margin: 0px 0px 0px 0px;
  461. line-height: 13px;
  462. font-size: 9px;
  463. border: 1px double {color:Posts information border};
  464. }
  465.  
  466. #tags a {
  467. padding: 1px 5px 1px 5px;
  468. -moz-transition: all 0.6s ease-in-out;
  469. -webkit-transition: all 0.6s ease-in-out;
  470. -o-transition: all 0.6s ease-in-out;
  471. -ms-transition: all 0.6s ease-in-out;
  472. transition: all 0.6s ease-in-out;
  473. }
  474.  
  475. #tags a:hover {
  476. padding: 1px 5px 1px 5px;
  477. background-color: {color:Posts information border};
  478. color: #000;
  479. }
  480.  
  481. .dates {
  482. position: absolute;
  483. font-family:'dubielitalic';
  484. font-size: 13px;
  485. }
  486.  
  487. .indextag {
  488. margin-top: 20px;
  489. }
  490.  
  491. .indextag a {
  492. color: {color:Posts information tags};
  493. }
  494.  
  495. /* POSTS */
  496.  
  497. /* QUOTE POSTS */
  498. #quotes {
  499. color: {color:Main Text};
  500. font-family: 'Garamond', Times;
  501. font-size: 20px;
  502. font-style: italic;
  503. text-align: center;
  504. }
  505.  
  506. /* CHAT POSTS */
  507.  
  508. .chat_line {
  509. padding: 6px;
  510. margin-left: -40px;
  511. }
  512.  
  513. .chat_line li {
  514. list-style-type: none;
  515. }
  516.  
  517. .conversation .chat_line.user1 {
  518. background-color: {color:Chat user1 background};
  519. border-bottom: 2px solid {color:Background};
  520. color: {color:Chat user1 text};
  521. }
  522.  
  523. .conversation .chat_line.user2 {
  524. background-color: {color:Chat user2 background};
  525. border-bottom: 2px solid {color:Background};
  526. color: {color:Chat user2 text};
  527. }
  528.  
  529. .conversation li {
  530. list-style-type: none;
  531. }
  532.  
  533. /* AUDIO POSTS */
  534.  
  535. #music {
  536. width: 40px;
  537. height: 60px;
  538. padding: 10px;
  539. display: table;
  540. }
  541.  
  542. #music img {
  543. position: absolute;
  544. width: 60px;
  545. }
  546.  
  547. #aud li {
  548. list-style-type: none;
  549. padding: 3px;
  550. border-bottom: solid 2px {color:Tab content background};
  551. background-color: {color:Background};
  552. }
  553.  
  554. #audioplayer {
  555. padding: 17px;
  556. background-color: {color:Background};
  557. position: absolute;
  558. opacity: 0.4;
  559. margin-top: 10px;
  560. margin-left: 10px;
  561. z-index: 2;
  562. -moz-transition: all 0.6s ease-in-out;
  563. -webkit-transition: all 0.6s ease-in-out;
  564. -o-transition: all 0.6s ease-in-out;
  565. -ms-transition: all 0.6s ease-in-out;
  566. transition: all 0.6s ease-in-out;
  567. }
  568.  
  569. #audioplayer:hover {
  570. opacity: 1;
  571. }
  572.  
  573. #audioinfo {
  574. position: absolute;
  575. margin-top: -70px;
  576. margin-left: 70px;
  577. {block:If400pxposts}
  578. width: 318px;
  579. {/block:If400pxposts}
  580. {block:If500pxposts}
  581. width: 418px;
  582. {/block:If500pxposts}
  583. font-size: 9px;
  584. }
  585.  
  586. #ap {
  587. width: 30px;
  588. overflow: hidden;
  589. height: 26px;
  590. }
  591.  
  592. /* MESSAGE POSTS */
  593. .answer {
  594. background-color: {color:Tab content background};
  595. text-align: justify;
  596. padding: 20px;
  597. }
  598.  
  599. .question {
  600. font-weight: bold;
  601. min-height: 20px;
  602. background-color: {color:Background};
  603. padding: 20px;
  604. text-align: center;
  605. border: 1px solid {color:Chat user1 background};
  606. }
  607.  
  608. .asker {
  609. background-color: {color:Tab content background};
  610. font-family: 'Dubielitalic';
  611. font-size: 15px;
  612. text-align: center;
  613. padding: 5px;
  614. }
  615.  
  616. /* pagination */
  617. #pagination {
  618. margin:auto;
  619. margin-bottom: 100px;
  620. {block:If400pxposts}
  621. width: 362px;
  622. {/block:If400pxposts}
  623. {block:If500pxposts}
  624. width: 462px;
  625. {/block:If500pxposts}
  626. letter-spacing: 1px;
  627. display: block;
  628. font-family: 'Dubielitalic';
  629. font-size: 14px;
  630. padding: 10px 20px 10px 20px;
  631. background-color: #fff;
  632. color: {color:Posts link color};
  633. {block:IndexPage}
  634. border-top: 1px dashed #eee;
  635. {/block:IndexPage}
  636. }
  637.  
  638. #pagination a{
  639. background-color: {color:Tab content background};
  640. color: {color:Posts text color};
  641. }
  642.  
  643. /* permalink notes */
  644. ol.notes {
  645. padding: 0px;
  646. margin: 15px 0px 0px 15px;
  647. list-style-type: none;
  648. border-bottom: solid 1px {color:Tab content background};
  649. width: 450px;
  650. }
  651.  
  652. ol.notes li.note {
  653. border-top: solid 1px {color:Tab content background};
  654. padding: 15px;
  655. }
  656.  
  657. ol.notes li.note img.avatar {
  658. margin-left: 20px;
  659. margin-right: 20px;
  660. width: 16px;
  661. height: 16px;
  662. }
  663.  
  664. /* credits */
  665. #niucan {
  666. position: fixed;
  667. right: 10px;
  668. bottom: 10px;
  669. font-size: 12px;
  670. letter-spacing: 1px;
  671. }
  672.  
  673. /*Custom CSS*/
  674. {CustomCSS}
  675. </style>
  676. </head>
  677.  
  678. <body>
  679. <div id="up">
  680. <nav class="titletransition">
  681. <div id="title"><a href="/">{Title}</a></div>
  682. </nav>
  683. </div>
  684.  
  685. <div id="bar">
  686. <ul id="tabs">
  687. <li><a href="#" name="#one">Index</a></li>
  688. <li><a href="#" name="#two">Message</a></li>
  689. <li><a href="#" name="#three">{text:Main Link 1 Name}</a></li>
  690. <li><a href="#" name="#four">{text:Main Link 2 Name}</a></li>
  691. <li><a href="#" name="#five">{text:Main Link 3 Name}</a></li>
  692. </ul>
  693.  
  694. <div id="content">
  695. <div id="one">{block:Description}{Description}{/block:Description}</div>
  696. <div id="two">
  697. <center><iframe frameborder="0" height="260" id="ask_form" scrolling="no" src="http://www.tumblr.com/ask_form/{text:Your username}.tumblr.com" width="400px" style="margin-left:0px;"></iframe> </center>
  698. </div>
  699. <div id="four"><div class="sublinks">
  700. <a href="{text:Main Link 1 Sublink 1 URL}"><li>{text:Main Link 1 Sublink 1 Name}</li></a>
  701. <a href="{text:Main Link 1 Sublink 2 URL}"><li>{text:Main Link 1 Sublink 2 Name}</li></a>
  702. <a href="{text:Main Link 1 Sublink 3 URL}"><li>{text:Main Link 1 Sublink 3 Name}</li></a>
  703. <a href="{text:Main Link 1 Sublink 4 URL}"><li>{text:Main Link 1 Sublink 4 Name}</li></a>
  704. <a href="{text:Main Link 1 Sublink 5 URL}"><li>{text:Main Link 1 Sublink 5 Name}</li></a>
  705. <a href="{text:Main Link 1 Sublink 6 URL}"><li>{text:Main Link 1 Sublink 6 Name}</li></a>
  706. <a href="{text:Main Link 1 Sublink 7 URL}"><li>{text:Main Link 1 Sublink 7 Name}</li></a>
  707. <a href="{text:Main Link 1 Sublink 8 URL}"><li>{text:Main Link 1 Sublink 8 Name}</li></a>
  708. <a href="{text:Main Link 1 Sublink 9 URL}"><li>{text:Main Link 1 Sublink 9 Name}</li></a>
  709. <a href="{text:Main Link 1 Sublink 10 URL}"><li>{text:Main Link 1 Sublink 10 Name}</li></a>
  710. <a href="{text:Main Link 1 Sublink 11 URL}"><li>{text:Main Link 1 Sublink 11 Name}</li></a>
  711. <a href="{text:Main Link 1 Sublink 12 URL}"><li>{text:Main Link 1 Sublink 12 Name}</li></a>
  712. <a href="{text:Main Link 1 Sublink 13 URL}"><li>{text:Main Link 1 Sublink 13 Name}</li></a>
  713. <a href="{text:Main Link 1 Sublink 14 URL}"><li>{text:Main Link 1 Sublink 14 Name}</li></a>
  714. <a href="{text:Main Link 1 Sublink 15 URL}"><li>{text:Main Link 1 Sublink 15 Name}</li></a>
  715. </div></div>
  716. <div id="three">
  717. {text:Main Link full description}
  718. </div>
  719. <div id="five"><div class="sublinks">
  720. <a href="{text:Main Link 2 Sublink 1 URL}"><li>{text:Main Link 2 Sublink 1 Name}</li></a>
  721. <a href="{text:Main Link 2 Sublink 2 URL}"><li>{text:Main Link 2 Sublink 2 Name}</li></a>
  722. <a href="{text:Main Link 2 Sublink 3 URL}"><li>{text:Main Link 2 Sublink 3 Name}</li></a>
  723. <a href="{text:Main Link 2 Sublink 4 URL}"><li>{text:Main Link 2 Sublink 4 Name}</li></a>
  724. <a href="{text:Main Link 2 Sublink 5 URL}"><li>{text:Main Link 2 Sublink 5 Name}</li></a>
  725. <a href="{text:Main Link 2 Sublink 6 URL}"><li>{text:Main Link 2 Sublink 6 Name}</li></a>
  726. </div></div>
  727. </div>
  728. </div>
  729.  
  730. <div id="posts">
  731. {block:Posts}
  732. <div class="posts">
  733.  
  734. <!-- POSTS -->
  735. <!-- text posts -->
  736. {block:Text}
  737. {block:Title}
  738. <div style="font-family: 'Dubielitalic'; font-size:20px;"> <a href="{Permalink}">{Title}</a><br></div>
  739. {/block:Title}
  740. {Body}
  741. {/block:Text}
  742. <!-- photo posts -->
  743. {block:Photo}
  744. {LinkOpenTag}
  745. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  746. {LinkCloseTag}
  747. {block:IndexPage}
  748. {block:Ifshowcaptions}
  749. {block:Caption}{Caption}{/block:Caption}
  750. {/block:Ifshowcaptions}
  751. {/block:IndexPage}
  752. {block:PermalinkPage}
  753. {block:Caption}{Caption}{/block:Caption}
  754. {/block:PermalinkPage}
  755. {/block:Photo}
  756. <!-- photoset posts -->
  757. {block:Photoset}
  758. {block:IndexPage}
  759. {block:If400pxposts}
  760. {Photoset-400}
  761. {/block:If400pxposts}
  762. {block:If500pxposts}
  763. {Photoset-500}
  764. {/block:If500pxposts}
  765. {/block:IndexPage}
  766. {block:PermalinkPage}
  767. {Photoset-500}
  768. {/block:PermalinkPage}
  769. {block:IndexPage}
  770. {block:Ifshowcaptions}
  771. {block:Caption}{Caption}{/block:Caption}
  772. {/block:Ifshowcaptions}
  773. {/block:IndexPage}
  774. {block:PermalinkPage}
  775. {block:Caption}{Caption}{/block:Caption}
  776. {/block:PermalinkPage}
  777. {/block:Photoset}
  778. <!-- quote posts -->
  779. {block:Quote}
  780. <div id="quotes">&ldquo;{Quote}&rdquo;</div>
  781. {block:Source}
  782. <div style="padding: 6px 2px; background-color: {color:Tab content background}; text-align: center;">✐ <i>{Source}</i></div>
  783. {/block:Source}
  784. {/block:Quote}
  785. <!-- link posts -->
  786. {block:Link}
  787. <div style="font-family: 'Dubielitalic'; font-size:20px;"><a href="{URL}" class="link" {Target}>{Name}</a></div>
  788. {block:Description}
  789. {Description}
  790. {/block:Description}
  791. {/block:Link}
  792. <!-- chat posts -->
  793. {block:Chat}
  794. {block:Title}
  795. <div style="font-family: 'Dubielitalic'; font-size:20px"><a href="{Permalink}">{Title}</a></div>
  796. {/block:Title}
  797. <ul class="conversation">
  798. {block:Lines}
  799. <li class="chat_line user{UserNumber}">
  800. {block:Label}
  801. <strong>{Label}</strong>&nbsp;&nbsp;
  802. {/block:Label}
  803. {Line}
  804. </li>
  805. {/block:Lines}
  806. </ul>
  807. {/block:Chat}
  808. <!-- video posts -->
  809. {block:Video}
  810. {block:If400pxposts}
  811. {Video-400}
  812. {/block:If400pxposts}
  813. {block:If500pxposts}
  814. {Video-500}
  815. {/block:If500pxposts}
  816. {block:PermalinkPage}
  817. {Video-500}
  818. {/block:PermalinkPage}
  819. {block:IndexPage}
  820. {block:Ifshowcaptions}
  821. {block:Caption}{Caption}{/block:Caption}
  822. {/block:Ifshowcaptions}
  823. {/block:IndexPage}
  824. {block:PermalinkPage}
  825. {block:Caption}{Caption}{/block:Caption}
  826. {/block:PermalinkPage}
  827. {/block:Video}
  828. <!-- audio posts -->
  829. {block:Audio}
  830. <div style="border: 1px solid #f0f0f0; background-color: {color:Tab content background};">
  831. <div id="audioplayer">
  832. {block:AudioPlayer}
  833. <div id="ap">{AudioPlayerWhite}</div>
  834. {/block:AudioPlayer}
  835. </div>
  836. <div id="music">
  837. <img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" alt="default album art"/>
  838. {block:AlbumArt}
  839. <img src="{AlbumArtURL}">
  840. {/block:AlbumArt}
  841. </div>
  842. <div id="audioinfo">
  843. <div id="aud">
  844. {block:TrackName}
  845. <li><b><i><font color="{color:Chat user1 text}">Trackname</font></i></b>: {TrackName} <br /></li>
  846. {/block:TrackName}
  847. {block:Artist}
  848. <li><b><i><font color="{color:Chat user1 text}">Artist</font></i></b>: {Artist}</li>
  849. {/block:Artist}
  850. {block:Album}
  851. <li><b><i><font color="{color:Chat user1 text}">Album:</font></i></b> {Album}</li>
  852. {/block:Album}
  853. </div>
  854. </div>
  855. </div>
  856. {block:IndexPage}
  857. {block:Ifshowcaptions}
  858. {block:Caption}{Caption}{/block:Caption}
  859. {/block:Ifshowcaptions}
  860. {/block:IndexPage}
  861. {block:PermalinkPage}
  862. {block:Caption}{Caption}{/block:Caption}
  863. {/block:PermalinkPage}
  864. {/block:Audio}
  865. <!-- question posts -->
  866. {block:Answer}
  867. <div class="asker">
  868. {Asker}:
  869. </div>
  870. <div class="question">
  871. {Question}
  872. </div>
  873. <div class="answer">
  874. {Answer}
  875. </div>
  876. {/block:Answer}
  877.  
  878.  
  879. <!-- Links for posts -->
  880. {block:IndexPage}
  881. <div id="tags">
  882. {block:Date}
  883. <div class="dates">
  884. <a href="{Permalink}" title="permalink">{DayOfWeek}, {Month} {DayOfMonth}{DayOfMonthSuffix}</a>
  885. {block:NoteCount}<span style="padding-left:15px;">{NoteCountWithLabel}</span>{/block:NoteCount}
  886. <span style="padding-left:15px;"><a href="{ReblogURL}" title="reblog">↺</a></span>
  887. </div>
  888. {/block:Date}
  889. <div class="indextag">
  890. {block:HasTags}<span style="letter-spacing:1px;padding-left:5px;">✎</span> {block:Tags}<span style="padding-left:10px;"><a href="{TagURL}">{Tag}</a></span>{/block:Tags}{/block:HasTags}
  891. </div>
  892. </div>
  893. {/block:IndexPage}
  894.  
  895. <!-- PERMALINK PAGE -->
  896. {block:PermalinkPage}
  897. {block:Date}
  898. <div style="line-height: 12px; padding: 15px; letter-spacing: 1px; width: 470px; margin-top:10px; border: 1px solid #f0f0f0; font-size:10px;">
  899. Posted on: {Month} {DayOfMonth}, {Year} &mdash; ({TimeAgo})<br />
  900. {block:NoteCount} Notes: {NoteCountwithLabel} {/block:NoteCount}
  901. {block:RebloggedFrom}
  902. <br /> Reblogged from: <a href="{ReblogParentURL}">{ReblogParentName}</a> | Originally posted by: <a href="{ReblogRootURL}">{ReblogRootName}</a>
  903. {/block:RebloggedFrom}
  904. {block:HasTags}
  905. <br />Tagged as: {block:Tags}<a href="{TagURL}">#{Tag} </a> {/block:Tags}
  906. {/block:HasTags}
  907. </div>
  908. {block:PostNotes}
  909. <div style="line-height: 12px; padding: 15px; letter-spacing: 1px; width: 470px; height: 100px; overflow: auto; margin-top:10px; border: 1px solid #f0f0f0; font-size:10px;">
  910. <div class="notes">{PostNotes}</div>
  911. </div>
  912. {/block:PostNotes}
  913. {/block:Date}
  914. {/block:PermalinkPage}
  915.  
  916. <!-- source/via -->
  917. {block:ContentSource}
  918. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  919. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  920. {/block:SourceLogo}
  921. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  922. {/block:ContentSource}
  923.  
  924. </div> <!-- end of class posts -->
  925. {/block:Posts}
  926.  
  927. <div id="pagination">
  928. <center>
  929. {block:Pagination}{block:PreviousPage} <a href="{PreviousPage}">recent</a> &mdash;{/block:Pagination}{/block:PreviousPage} Page <b>{CurrentPage}</b> of <b>{TotalPages}</b></span> {block:Pagination}{block:NextPage} &mdash; <a href="{NextPage}"> previous</a> {/block:Pagination}{/block:NextPage}
  930. </center>
  931. </div>
  932. </div> <!-- end of div posts -->
  933.  
  934. <!-- script for minimal tabs using jquery -->
  935. <script>
  936. function resetTabs(){
  937. $("#content > div").hide(); //Hide all content
  938. $("#tabs a").attr("id",""); //Reset id's
  939. }
  940.  
  941. var myUrl = window.location.href; //get URL
  942. var myUrlTab = myUrl.substring(myUrl.indexOf("#")); // For mywebsite.com/tabs.html#tab2, myUrlTab = #tab2
  943. var myUrlTabName = myUrlTab.substring(0,4); // For the above example, myUrlTabName = #tab
  944.  
  945. (function(){
  946. $("#content > div").hide(); // Initially hide all content
  947. $("#tabs li:first a").attr("id","current"); // Activate first tab
  948. $("#content > div:first").fadeIn(); // Show first tab content
  949.  
  950. $("#tabs a").on("click",function(e) {
  951. e.preventDefault();
  952. if ($(this).attr("id") == "current"){ //detection for current tab
  953. return
  954. }
  955. else{
  956. resetTabs();
  957. $(this).attr("id","current"); // Activate this
  958. $($(this).attr('name')).fadeIn(); // Show content for current tab
  959. }
  960. });
  961.  
  962. for (i = 1; i <= $("#tabs li").length; i++) {
  963. if (myUrlTab == myUrlTabName + i) {
  964. resetTabs();
  965. $("a[name='"+myUrlTab+"']").attr("id","current"); // Activate url tab
  966. $(myUrlTab).fadeIn(); // Show url tab content
  967. }
  968. }
  969. })()
  970. </script>
  971.  
  972. <div id="niucan">
  973. <a href="http://niucan.tumblr.com" title="theme by niucan"><font color="#E7E7E7">●</font><font color="#838383">●</font><font color="#282828">●</font></a>
  974. </div>
  975. </body>
  976. </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!