axiumthemes

theme 13 - bar code

Feb 3rd, 2018
387
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.04 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <!----------------------------------------------------------------------
  3.  
  4. THEME #13 /// BAR CODE
  5. by WOLFTHEMES
  6.  
  7. rules:
  8. 1. do not claim as your own
  9. 2. if you want to use any part
  10. of the code in your own theme
  11. please ask
  12. 3. don't remove the credit
  13. 4. enjoy :)
  14.  
  15.  
  16. Credit:
  17. Dashboard Captions - neothm.com & magnusthemes.tumblr.com
  18. resize - shythemes.tumblr.com
  19. icons - pixeden
  20.  
  21. -----------------------------------------------------------------------
  22.  
  23. ----------------------------------------------------------------------->
  24. <html>
  25.  
  26. <head>
  27. <title>{Title}</title>
  28. <link rel="shortcut icon" href="{Favicon}">
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30. {block:Description}
  31. <meta name="description" content="{MetaDescription}" />
  32. {/block:Description}
  33.  
  34.  
  35. <meta name="if:caption" content=""/>
  36. <meta name="if:right sidebar left posts" content="1"/>
  37. <meta name="if:left sidebar right posts" content=""/>
  38.  
  39. <meta name="color:background" content="#ffffff"/>
  40. <meta name="color:accent" content="#ff9966"/>
  41. <meta name="color:text" content="#b3b3b3"/>
  42. <meta name="color:link" content="#959595"/>
  43. <meta name="color:borders" content="#000000"/>
  44.  
  45. <meta name="select:post width" content="200" title="200px"/>
  46. <meta name="select:post width" content="225" title="225px"/>
  47. <meta name="select:post width" content="250" title="250px"/>
  48. <meta name="select:post width" content="275" title="275px"/>
  49. <meta name="select:post width" content="300" title="300px"/>
  50. <meta name="select:post width" content="325" title="325px"/>
  51. <meta name="select:post width" content="350" title="350px"/>
  52. <meta name="select:post width" content="375" title="375px"/>
  53. <meta name="select:post width" content="400" title="400px"/>
  54. <meta name="select:post width" content="425" title="425px"/>
  55. <meta name="select:post width" content="450" title="450px"/>
  56. <meta name="select:post width" content="475" title="475px"/>
  57. <meta name="select:post width" content="500" title="500px"/>
  58. <meta name="select:post width" content="540" title="540px"/>
  59.  
  60. <meta name="text:photoset gutter" content="0"/>
  61. <meta name="text:font size" content="12px"/>
  62.  
  63. <meta name="text:link 1" content="link"/>
  64. <meta name="text:link 1 URL" content="/"/>
  65. <meta name="text:link 2" content="link"/>
  66. <meta name="text:link 2 URL" content="/"/>
  67. <meta name="text:link 3" content="link"/>
  68. <meta name="text:link 3 URL" content="/"/>
  69. <meta name="text:link 4" content="link"/>
  70. <meta name="text:link 4 URL" content="/"/>
  71.  
  72. <link href="https://fonts.googleapis.com/css?family=Arimo|Crimson+Text|Inconsolata|Lato|Libre+Barcode+39|Libre+Barcode+128+Text|Lora|Muli|Open+Sans|Playfair+Display|Quicksand|Roboto|Roboto+Mono" rel="stylesheet">
  73. <link href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" rel="stylesheet">
  74. <link rel="stylesheet" href="http://static.tumblr.com/i5s2zks/6kOohwlux/pe-icon-7-stroke.css">
  75.  
  76. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  77. <script>
  78. // minimal soundcloud player © shythemes.tumblr
  79. $(document).ready(function(){
  80. var color = '{color:accent}'; // color of play button (hex)
  81. $('.soundcloud_audio_player').each(function(){
  82. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  83. });
  84. });
  85. </script>
  86.  
  87.  
  88. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  89. <script src="https://static.tumblr.com/uopakca/GVcnvdwbq/jquery.style-my-tooltips.js"></script>
  90. <script>
  91. (function($){
  92. $(document).ready(function(){
  93. $('[title]').style_my_tooltips({
  94. tip_follows_cursor:true,
  95. tip_delay_time:90,
  96. tip_fade_speed:700,
  97. attribute:'title'
  98. });
  99. });
  100. })(jQuery);
  101. </script>
  102.  
  103. <script src="http://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  104. <script>
  105. !function(a){a.fn.unnest=function(b){var d,e,f,g,h,c=a.extend({yourCaption:".cap",wrapName:".rebloguser",newCaptionUsername:!1,originalPostCaptionUsername:!1,tumblrAvatarClass:".avtar",tumblrAvatars:!0,usernameColon:!0},b),i=c.wrapName.slice(1,c.wrapName.length),j=c.tumblrAvatarClass.slice(1,c.tumblrAvatarClass.length);a(c.yourCaption,this).each(function(){var b=!1,k=!1;a("a.tumblr_blog",this).length<=0&&(b=!0),a(this).find("blockquote").each(function(){a(this).prev().children(".tumblr_blog").length>0&&(a(this).addClass(i),d=a(this).parent().find("a.tumblr_blog").parent("p").html(),c.usernameColon||(d=d.slice(0,-1))),a(this).hasClass(i)&&(a(this).prepend(d),c.tumblrAvatars&&(g=a(this).prev().children("a.tumblr_blog").text(),a(this).prepend('<img src="http://api.tumblr.com/v2/blog/'+g+'.tumblr.com/avatar/30" class="'+j+'" />')))}),a(this).find("a.tumblr_blog:first-of-type").parent("p").remove(),a(c.wrapName,this).each(function(){a(this).parents(c.yourCaption).prepend(a(this))}),h=window.location.hostname;var l=a(this);a.getScript("http://"+h+"/api/read/json").complete(function(){e=l.contents(":not("+c.wrapName+")"),e.text().replace(/\s/g,"").length>0&&(k=l.clone().find(c.wrapName).remove().end().html(),e.remove(),c.newCaptionUsername||b?(f='<blockquote class="'+i+'">',c.tumblrAvatars&&(!b||b&&c.originalPostCaptionUsername)&&(f+='<img src="http://api.tumblr.com/v2/blog/'+h+'/avatar/30" class="'+j+'" />'),(!b||b&&c.originalPostCaptionUsername)&&(f+='<a class="tumblr_blog" href="/">'),(!b||b&&c.originalPostCaptionUsername)&&("undefined"!=typeof tumblr_api_read&&(h=tumblr_api_read.tumblelog.name),console.info(h),f+=h+"</a><p>"),f+=k+"</blockquote>",l.append(f)):l.append('<blockquote class="'+i+'">'+k+"</blockquote>"))})})}}(jQuery);
  106. $('.caption').unnest({
  107. yourCaption: ".cap", //your caption selector, the div wrapping
  108. wrapName: ".rebloguser", //the name of the captions’ new wrapper
  109. newCaptionUsername: true, //if the user adds a new caption, following a series of captions, show their username above the caption
  110. originalPostCaptionUsername: true, //for the original captions, or a user-added caption that previously didn’t have any, have their username on it
  111. tumblrAvatars: false, //”dashboard style” caption, have the avatar of the blog next to the username
  112. tumblrAvatarClass: ".avatar", //class of the avatar next to the username
  113. usernameColon: false //if turned to false, removes the colon at the end of usernames bc :) seriously :) hwy :)
  114. });
  115. $('.caption').unnest({
  116. newCaptionUsername: true,
  117. tumblrAvatars: false,
  118. usernameColon: false
  119. });
  120. </script>
  121.  
  122. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  123. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  124. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  125. <script>
  126. $(document).ready(function(){
  127. $('.photo-slideshow').pxuPhotoset({
  128. lightbox: true,
  129. rounded: false,
  130. gutter: '{text:photoset gutter}px',
  131. borderRadius: '0px',
  132. photoset: '.photo-slideshow',
  133. photoWrap: '.photo-data',
  134. photo: '.pxu-photo'
  135. });
  136. });
  137. </script>
  138.  
  139. {block:IndexPage}
  140. <script type="text/javascript">
  141. jQuery(document).ready(function() {
  142. jQuery(".tags").hide();
  143. jQuery(".tagbutt").click(function()
  144. {
  145. jQuery(this).next(".tags").slideToggle(500);
  146. });});
  147. </script>
  148. {/block:IndexPage}
  149.  
  150. {block:PermalinkPage}
  151. <script type="text/javascript">
  152. jQuery(document).ready(function() {
  153. jQuery(".permalinks").hide();
  154. jQuery(".postnotes").click(function()
  155. {
  156. jQuery(this).next(".permalinks").slideToggle(500);
  157. });});
  158. </script>
  159. {/block:PermalinkPage}
  160.  
  161. </head>
  162.  
  163. <style type="text/css">
  164.  
  165.  
  166. /*-------------- SCROLLBAR ----------------*/
  167. ::-webkit-scrollbar {
  168. width:17px;
  169. height:17px;
  170. }
  171. ::-webkit-scrollbar {
  172. background-color:{color:background}; /* background color */
  173. }
  174. ::-webkit-scrollbar-track {
  175. border:8px solid {color:background}; /* background color */
  176. background-color:rgb(230,230,230); /* light border color */
  177. }
  178. ::-webkit-scrollbar-thumb {
  179. border:8px solid {color:background}; /* background color */
  180. background-color:{color:accent}; /* dark border color */
  181. min-height:24px;
  182. min-width:24px;
  183. }
  184. /*-------------- TOOLTIP ----------------*/
  185.  
  186. #s-m-t-tooltip {
  187. max-width:300px;
  188. padding:3px 6px 3px 6px;
  189. margin:20px 20px 10px 6px;
  190. font-family: 'Inconsolata', monospace;
  191. font-size:{text:font size};
  192. background: #f2f2f2;color:#888;
  193. border: 1px solid #eee;
  194. border-radius: 5px;
  195. z-index:9999999;}
  196.  
  197. ::selection {
  198. background: #eee; /* WebKit/Blink Browsers */
  199. color: #000;
  200. }
  201. ::-moz-selection {
  202. background: #eee; /* Gecko Browsers */
  203. color: #000;
  204. }
  205.  
  206.  
  207. /*-------------- BASIC HTML ----------------*/
  208.  
  209.  
  210. html {
  211. overflow-x:hidden;
  212. background: {color:background};
  213. cursor: url(http://www.rw-designer.com/cursor-extern.php?id=27887), progress !important;
  214. }
  215.  
  216.  
  217. a:hover, img:hover {
  218. cursor: url(http://www.rw-designer.com/cursor-extern.php?id=77322), progress !important;
  219. }
  220.  
  221. body {
  222. font-size:{text:font size};
  223. color: {color:text};
  224. font-family:'Roboto', sans-serif;
  225. }
  226.  
  227. hr {
  228. border: none;
  229. height: 1px;
  230. background: #eee;
  231. }
  232.  
  233. a {
  234. text-decoration: none;
  235. color: #ccc;
  236. -webkit-transition: all ease 0.8s;
  237. -moz-transition: all ease 0.8s;
  238. transition: all ease 0.8s;
  239. }
  240.  
  241. a:hover, a:active, .links span:hover {
  242. color:{color:accent};
  243. -webkit-transition: all ease 0.8s;
  244. -moz-transition: all ease 0.8s;
  245. transition: all ease 0.8s;
  246. }
  247.  
  248. b {
  249. color: #000000;
  250. }
  251.  
  252. blockquote {
  253. border-left: 1px solid #333;
  254. margin-right: 20px;
  255. padding-left: 10px;
  256. }
  257.  
  258. /*------------------------------------------*/
  259.  
  260. iframe.tmblr-iframe {
  261. z-index:2!important;
  262. top: 10px;
  263. right: 10px;
  264. opacity:0.2;
  265. /* delete invert(1) from here */
  266. filter:invert(1) contrast(150%);
  267. -webkit-filter:invert(1) contrast(150%);
  268. -o-filter:invert(1) contrast(150%);
  269. -moz-filter:invert(1) contrast(150%);
  270. -ms-filter:invert(1) contrast(150%);
  271. /* to here if your blog has a dark background */
  272. transform:scale(0.65);
  273. transform-origin:100% 0;
  274. -webkit-transform:scale(0.65);
  275. -webkit-transform-origin:100% 0;
  276. -o-transform:scale(0.65);
  277. -o-transform-origin:100% 0;
  278. -moz-transform:scale(0.65);
  279. -moz-transform-origin:100% 0;
  280. -ms-transform:scale(0.65);
  281. -ms-transform-origin:100% 0;}
  282.  
  283. iframe.tmblr-iframe:hover {
  284. opacity:0.2!important;
  285. -webkit-transition: all ease 0.8s;
  286. -moz-transition: all ease 0.8s;
  287. transition: all ease 0.8s;}
  288.  
  289. /*------------------------------------------*/
  290.  
  291. #midbar {
  292. width: 400px;
  293. border: 1px solid {color:borders};
  294. border-top: 2px solid {color:borders};
  295. border-bottom: 2px solid {color:borders};
  296. background: #fff;
  297. font-family: 'Inconsolata', monospace;
  298. padding: 10px;
  299. position: fixed;
  300. height: 500px;
  301. top: calc(50vh - 250px);
  302. {block:ifrightsidebarleftposts}left: calc(75vw - 200px);{/block:ifrightsidebarleftposts}
  303. {block:ifleftsidebarrightposts}right: calc(75vw - 200px);{/block:ifleftsidebarrightposts}
  304. z-index: 9;
  305. }
  306.  
  307. .vertical {
  308. position: absolute;
  309. transform: rotate(-90deg);
  310. height: 50px;
  311. width: 100%;
  312. bottom:214px;
  313. padding: 30px 70px 10px 30px;
  314. right: -215px;
  315. border-top: 1px solid {color:borders};
  316. }
  317.  
  318. .vertical .copy, .vertical .title {
  319. display:inline;
  320. }
  321.  
  322. .vertical .title {
  323. font-family: 'Libre Barcode 128 Text', cursive;
  324. font-size: 30px;
  325. }
  326.  
  327. .vertical .copy {
  328. position: absolute;
  329. right: 80px;
  330. }
  331.  
  332. .vertical .copy::before {
  333. content:'best before';
  334. font-weight: 800;
  335. padding-right: 20px;
  336. text-transform: uppercase;
  337. }
  338.  
  339. .center {
  340. position: absolute;
  341. left:0;
  342. top: 0;
  343. width: 330px;
  344. }
  345.  
  346. .center b {
  347. text-transform: uppercase;
  348. }
  349.  
  350. .center .desc, .center .updates, .center .linkage {
  351. padding: 40px;
  352. border-bottom: 1px solid {color:borders};
  353. }
  354.  
  355. .center .desc {
  356. padding-top: 60px;
  357. }
  358.  
  359. .updates info {
  360. position: relative;
  361. right: -50px;
  362. }
  363.  
  364. .center .desc b, .center .linkage b {
  365. padding-right: 20px;
  366. }
  367.  
  368. .center .linkage a {
  369. text-transform: uppercase;
  370. }
  371.  
  372. /*------------------------------------------*/
  373.  
  374. #pagination {
  375. font-family: 'Inconsolata', monospace;
  376. width: 330px;
  377. position: absolute;
  378. text-align: center;
  379. bottom: 15px;
  380. left: 0;
  381. word-spacing:10px;
  382. font-size: calc({text:font size} - 2px);
  383. }
  384.  
  385. #pagination .current {
  386. color: {color:accent};
  387. }
  388. #pagination a {
  389. color:{color:link};
  390. }
  391.  
  392. #pagination a:hover {
  393. color:{color:accent};
  394. }
  395.  
  396. .permapage {
  397. word-spacing: 0;
  398. }
  399.  
  400. .permapage a {
  401. padding: 0 10px 0 10px;
  402. }
  403.  
  404. /*------------------------------------------*/
  405.  
  406. .date {
  407. font-family:'Roboto', sans-serif;
  408. font-weight: 300;
  409. font-size: calc({text:font size} - 2px);
  410. }
  411.  
  412. .postinfo {
  413. position: absolute;
  414. font-size: calc({text:font size} - 1px);
  415. right: -15px;
  416. top:-10px:
  417. opacity: 0!important;
  418. }
  419.  
  420. .postinfo .notes, .postinfo .reblog {
  421. padding-bottom: 10px;
  422. }
  423.  
  424. .post:hover .postinfo {
  425. opacity: 1!important;
  426. -webkit-transition: all ease 0.8s;
  427. -moz-transition: all ease 0.8s;
  428. transition: all ease 0.8s;
  429. }
  430.  
  431. .date a, .postinfo a {
  432. color: #ddd!important;
  433. }
  434.  
  435. .date a:hover, .postinfo a:hover {
  436. color: {color:text}!important;
  437. }
  438.  
  439. .tags {
  440. width: 75px;
  441. height: 75px;
  442. overflow-y: scroll;
  443. position: absolute;
  444. margin-top: -15px;
  445. margin-left: 25px;
  446. font-family: 'Inconsolata', monospace;
  447. }
  448.  
  449. .tags a {
  450. display:block;
  451. border-bottom: 1px solid #eee;
  452. }
  453.  
  454. .tags::-webkit-scrollbar {
  455. width:4px;
  456. height:4px;
  457. display:none;
  458. }
  459.  
  460. .reblgfrm {
  461. position: absolute;
  462. right:10px;
  463. margin-top: -15px;
  464. font-size: calc({text:font size} + 1px);
  465. }
  466.  
  467. .reblgfrm a{
  468. color:#ddd!important;
  469. font-family: 'Libre Barcode 39', cursive;
  470. }
  471.  
  472. .reblgfrm a:hover {
  473. color:{color:text}!important;
  474. }
  475.  
  476. /*------------------------------------------*/
  477.  
  478. #thecontainer {
  479. width:{select:post width}px;
  480. position:absolute;
  481. top: calc(50vh - 250px);
  482. {block:ifrightsidebarleftposts}left: calc(75vw - ({select:post width}px + 350px));{/block:ifrightsidebarleftposts}
  483. {block:ifleftsidebarrightposts}right: calc(75vw - ({select:post width}px + 350px));{/block:ifleftsidebarrightposts}
  484. }
  485.  
  486. .posts {
  487. width: {select:post width}px!important;
  488. position: relative;
  489. {block:IndexPage}margin-top: 140px;{/block:IndexPage}
  490. font-size:{text:font size};
  491. color: {color:text};
  492. }
  493.  
  494. .posts:first-child {
  495. margin-top: 0;
  496. }
  497.  
  498. .posts a {
  499. color: {color:accent};
  500. }
  501.  
  502. .posts a:hover {
  503. color: {color:text};
  504. }
  505.  
  506. /*------------------------------------------*/
  507.  
  508. #captions {
  509. width: 100%;font-size:{text:font size};
  510. }
  511.  
  512. .caption {
  513. margin-bottom: 10px;
  514. {block:ifCaption}display: block;{/block:IfCaption}
  515. {block:ifNotCaption}display:none;{/block:IfNotCaption}
  516.  
  517. }
  518.  
  519. .caption img, .cap img, #askcaption img {
  520. margin: 0;
  521. padding: 0;
  522. max-width: calc({select:post width}px - 20px);
  523. }
  524.  
  525. .cap {
  526. margin-left: 10vw;
  527. margin: 2px 10px 0px 10px;
  528. padding: 5px 0 3px 0;
  529. }
  530.  
  531. .rebloguser {
  532. margin-bottom: 3px;
  533. margin-top: 15px;
  534. padding-top: 10px;
  535. }
  536.  
  537. .rebloguser:first-child {
  538. border-top: 0px;
  539. padding-top: 10px;
  540. }
  541.  
  542. .rebloguser a {
  543. font-family: 'Inconsolata', monospace;
  544. font-weight: 800;
  545. font-size: 10px;
  546. padding: 3px 5px;
  547. letter-spacing: 1px;
  548. text-transform: uppercase;
  549. background:#f1f1f1;
  550. border: 1px solid #eee;
  551. color: {color:text};
  552. }
  553.  
  554. .rebloguser a:hover {
  555. color: {color:accent};
  556. }
  557.  
  558. img.avatar {
  559. display:none;
  560. height: 14px;
  561. width: 14px;
  562. border-radius: 100%;
  563. margin-left: 10px;
  564. margin-right: 3px;
  565. float: left;
  566. }
  567.  
  568. /*------------------------------------------*/
  569.  
  570.  
  571. /*------------------------------------------*/
  572.  
  573. .tmblr-lightbox, #tumblr_lightbox {
  574. background-color:rgba(245,245,245,.80) !important;
  575. }
  576. .vignette, #vignette {
  577. opacity:0;
  578. }
  579. .lightbox-image, #tumblr_lightbox img {
  580. box-shadow:none !important;
  581. border-radius:0 !important;
  582. max-width:none;
  583. }
  584.  
  585.  
  586.  
  587.  
  588. /*------------------------------------------*/
  589.  
  590. .posttitle {
  591. border: 1px solid #eee;
  592. color: #737373;
  593. padding: 10px;
  594. margin-bottom: 10px;
  595. background: {color:background};
  596. text-align: center;
  597. font-size: 13px;
  598. text-transform: capitalize;
  599. font-family: 'Inconsolata', monospace;
  600. }
  601. /*------------------------------------------*/
  602.  
  603. .question {
  604. background: #fff;
  605. padding: 10px 5px;
  606. color: {color:text};
  607. }
  608.  
  609. .question b {
  610. font-family: 'Inconsolata', monospace;
  611. }
  612.  
  613. .question img {
  614. float:right;
  615. width: 24px;
  616. height: 24px;
  617. margin-top: 3px;
  618. margin-right: 15px;
  619. margin-left: 5px;
  620. border-radius: 10px;
  621. }
  622.  
  623. .askbox {
  624. z-index:7;
  625. background:#eee;
  626. padding: 10px 10px 10px 10px;
  627. width: calc({select:post width}px - 100px);
  628. border-radius: 5px;
  629. margin-right: 60px;
  630. }
  631.  
  632. .ask, .quest {
  633. z-index:7;
  634. display:inline;
  635. }
  636.  
  637. .ask {z-index:5;
  638. margin-right: 5px;
  639. }
  640.  
  641. .ask a {
  642. text-transform: uppercase;
  643. color: {color:accent}!important;
  644. }
  645.  
  646. .ask a:hover {
  647. color:#333!important;
  648. }
  649.  
  650. #askcaption {
  651. margin-top: 10px;
  652. padding-top: 10px;
  653. background: #fff;
  654. }
  655.  
  656. .answerer {
  657. margin-left: 20px;
  658. }
  659.  
  660. .answer img {
  661. width: 20px;
  662. float: left;
  663. height: 20px;
  664. position: absolute;
  665. left: 15px;
  666. border-radius: 5px;
  667. }
  668.  
  669. .answ {
  670. background: #eee;
  671. padding: 10px;
  672. margin: 15px 10px 10px 10px;
  673. border-radius: 5px;
  674. }
  675.  
  676. /*------------------------------------------*/
  677.  
  678. .quote {
  679. padding: 20px;
  680. font-family: 'Quicksand', sans-serif;
  681. font-variant: italic;
  682. font-size:calc({text:font size} + 2px);
  683. }
  684.  
  685. /*------------------------------------------*/
  686.  
  687. .chats ul li, .chats ol li {
  688. list-style-type: none!important;
  689. padding: 10px;
  690. background:#ddd;
  691. font-family: 'Inconsolata', monospace;
  692. }
  693.  
  694. .chats li:nth-of-type(2n) {
  695. background: transparent;
  696. }
  697.  
  698. li .line {
  699. line-height: 2em;
  700. }
  701.  
  702. /*------------------------------------------*/
  703.  
  704. .audio {
  705. width: {select:post width}px;
  706. }
  707.  
  708. .tumblr_audio_player {
  709. border-radius: 0 !important;
  710. width: {select:post width}px !important;
  711. }
  712.  
  713. .spotify_audio_player {
  714. width: {select:post width}px;
  715. height: 80px !important;
  716.  
  717. }
  718.  
  719. /*------------------------------------------*/
  720.  
  721. .tippytop {
  722. font-family: 'Inconsolata', monospace;
  723. }
  724.  
  725. .permalinks {
  726. border-top: 1px solid #eee;
  727. border-bottom: 1px solid #eee;
  728. color: #999999;
  729. width: {select:post width}px;
  730. max-height: 300px;
  731. overflow-y:scroll;
  732. overflow-x:hidden;
  733. margin-bottom: 10px;
  734. }
  735.  
  736. .permalinks ol li {
  737. list-style-type:none;
  738. margin:0;
  739. padding: 0;
  740. line-height: 3;
  741. }
  742.  
  743. .permalinks li {
  744. margin-bottom: 15px;
  745. }
  746.  
  747. .permalinks a {
  748. font-family: 'Muli', monospace;
  749. color: #333;
  750. }
  751.  
  752. .permalinks a:hover {
  753. color: {color:accent};
  754. }
  755.  
  756. .permalinks img {
  757. height: 12px;
  758. width:12px;
  759. float:left;
  760. margin-top: 10px;
  761. margin-right: 10px;
  762. border-radius: 100%;
  763. }
  764. /*------------------------------------------*/
  765.  
  766. .permalinkbox {
  767. width: {select:post width}px;
  768. height: 500px;
  769. margin-bottom: 150px;
  770. }
  771.  
  772. .postnotes {
  773. margin: 20px 0;
  774. width: {select:post width}px;
  775. padding: 5px 0;
  776. text-transform: uppercase;
  777. }
  778.  
  779. /*------------------------------------------*/
  780.  
  781.  
  782.  
  783.  
  784. </style>
  785. <body>
  786.  
  787. <div id="midbar">
  788. <div class="vertical">
  789. <div class="title">{Name}</div>
  790. <div class="copy">{CopyrightYears}</div>
  791. </div>
  792. <div class="center">
  793. <div class="desc"><b>information</b> {Description}</div>
  794. <div class="updates">
  795. <b>Feb 03</b> <info>barcode released</info></br>
  796. <b>Feb 02</b> <info>put info</info></br>
  797. <b>Feb 01</b> <info>put info</info></br>
  798. <b>Jan 31</b> <info>put info</info></br>
  799. </div>
  800. <div class="linkage">
  801. <b>links</b>
  802. <a href="/">home</a>
  803. <a href="/">ask</a>
  804. {block:iflink1}<a href="{text:link 1 url}">{text:link 1}</a>{block:iflink1}
  805. {block:iflink2}<a href="{text:link 2 url}">{text:link 2}</a>{block:iflink2}
  806. {block:iflink3}<a href="{text:link 3 url}">{text:link 3}</a>{block:iflink3}
  807. {block:iflink4}<a href="{text:link 4 url}">{text:link 4}</a>{block:iflink4}
  808. </div>
  809. </div>
  810.  
  811. <div id="pagination">
  812. {block:IndexPage}
  813. {block:Pagination}
  814. {block:PreviousPage}
  815. <a class="prev" href="{PreviousPage}" title="back">back</a>
  816. {/block:PreviousPage}
  817. {block:JumpPagination length="5"}
  818. {block:CurrentPage}<span class="current">{PageNumber}</span>{/block:CurrentPage}
  819. {block:JumpPage}<a class="jump" href="{URL}" title="page {PageNumber}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  820. {block:NextPage}
  821. <a class="next" href="{NextPage}" title="next">next</a>
  822. {/block:NextPage}
  823. {/block:Pagination}{/block:IndexPage}
  824. {block:PermalinkPage}<div class="permapage">{block:PermalinkPagination}{block:PreviousPost}<a href="{PreviousPost}" title="previous post"><i class="pe-7s-prev"></i></a>{/block:PreviousPost}{/block:PermalinkPagination}<a href="/">back to the blog</a>{block:PermalinkPagination}{block:NextPost}<a href="{NextPost}" title="next post"><i class="pe-7s-next"></i></a>{/block:NextPost}{/block:PermalinkPagination}</div>{/block:PermalinkPage}
  825. </div>
  826.  
  827. </div>
  828.  
  829.  
  830.  
  831. <div id="thecontainer">
  832.  
  833.  
  834. {block:Posts}
  835.  
  836. <div class="posts" id="{PostID}">
  837. {block:IndexPage}
  838. {block:Date}<div class="date"><a href="{Permalink}" title="{12Hour}:{Minutes}:{Seconds} {AmPm}"><i class="pe-7s-clock"></i> {Month} {DayOfMonthWithZero}</a></div>{/block:Date}
  839. <!----{block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}"></a>{/block:ContentSource}---->
  840. {block:RebloggedFrom}<div class="reblgfrm"><a href="{ReblogParentURL}" title="{ReblogParentName}">{ReblogParentName}</a></div>{/block:RebloggedFrom}
  841.  
  842. <div class="postinfo">
  843. {block:NoteCount}<div class="notes"><a href="{Permalink}" title="{NoteCountWithLabel}"><i class="pe-7s-note"></i></a>
  844. </div>{/block:NoteCount}
  845. <div class="reblog"><a href="{ReblogURL}" title="reblog"><i class="pe-7s-refresh-2"></i></a>
  846. </div>
  847. {block:HasTags}<div class="tagbutt"><a><i class="pe-7s-ticket"></i></a></div>
  848. <div class="tags">filed under:
  849. {block:Tags}<a href="{TagURL}" title="{Tag}"># {Tag}</a>{/block:Tags}
  850. </div>{/block:HasTags}
  851. </div>
  852. {block:IndexPage}
  853.  
  854. {block:Text}{block:Title}<div class="posttitle">{Title}</div>{/block:Title}{/block:Text}
  855.  
  856. {block:Photo}<a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  857. <img style="width:{select:post width}px;" src="{PhotoURL-HighRes}">
  858. </a>{block:Photo}
  859.  
  860. {block:Photoset}<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>{/block:Photoset}
  861.  
  862. {block:Chat}{block:Title}<div class="posttitle">{Title}</div></a>{/block:Title}{/block:Chat}
  863.  
  864. {block:Video}<div class="video">{Video-500}</div>{block:Video}
  865.  
  866. {block:Audio}<div class="audio spotify_audio_player">{AudioEmbed}</div>{/block:Audio}
  867.  
  868. {block:Link}<div class="posttitle"><a href="{URL}">{Name}</a></div>{/block:Link}
  869.  
  870. {block:Quote}
  871. <div class="quote">{Quote}</div>
  872. {/block:Quote}
  873.  
  874. <div id="captions">
  875.  
  876. {block:Answer}
  877. <div class="question"><img src="{AskerPortraitURL-24}"><div class="askbox"><div class="ask"> {Asker} asked:</div><div class="quest">{Question}</div></div>
  878. <div id="askcaption">
  879. <div class="answer"><img src="{AnswererPortraitURL-24}"> {block:Answerer}<div class="answerer">{Answerer} said:</div> {/block:Answerer}<div class="answ">{Answer}</div></div></div></div>
  880. {/block:Answer}
  881.  
  882. {block:Text}<div class="caption">
  883. {block:Reblogs}
  884. <div class="rebloguser">
  885. {block:IsNotOriginalEntry}
  886. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  887. {/block:IsNotOriginalEntry}
  888. {block:IsOriginalEntry}
  889. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  890. {/block:IsOriginalEntry}
  891. </div>
  892. <div class="cap">
  893. {Body}
  894. </div>
  895. {/block:Reblogs}
  896. {block:NotReblog}
  897. {block:Caption}
  898. <div class="cap">
  899. {Caption}
  900. </div>
  901. {/block:Caption}
  902. {/block:NotReblog}</div>
  903. {/block:Text}
  904.  
  905. {block:Photo}
  906. <div class="caption">
  907. {block:Reblogs}
  908. <div class="rebloguser">
  909. {block:IsNotOriginalEntry}
  910. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  911. {/block:IsNotOriginalEntry}
  912. {block:IsOriginalEntry}
  913. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  914. {/block:IsOriginalEntry}
  915. </div>
  916. <div class="cap">
  917. {Body}
  918. </div>
  919. {/block:Reblogs}
  920. {block:NotReblog}
  921. {block:Caption}
  922. <div class="cap">
  923. {Caption}
  924. </div>
  925. {/block:Caption}
  926. {/block:NotReblog}</div>
  927. {/block:Photo}
  928.  
  929. {block:Photoset}
  930. <div class="caption">
  931. {block:Reblogs}
  932. <div class="rebloguser">
  933. {block:IsNotOriginalEntry}
  934. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  935. {/block:IsNotOriginalEntry}
  936. {block:IsOriginalEntry}
  937. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  938. {/block:IsOriginalEntry}
  939. </div>
  940. <div class="cap">
  941. {Body}
  942. </div>
  943. {/block:Reblogs}
  944. {block:NotReblog}
  945. {block:Caption}
  946. <div class="cap">
  947. {Caption}
  948. </div>
  949. {/block:Caption}
  950. {/block:NotReblog}</div>
  951. {/block:Photoset}
  952.  
  953. {block:Video}
  954. <div class="caption">
  955. {block:Reblogs}
  956. <div class="rebloguser">
  957. {block:IsNotOriginalEntry}
  958. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  959. {/block:IsNotOriginalEntry}
  960. {block:IsOriginalEntry}
  961. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  962. {/block:IsOriginalEntry}
  963. </div>
  964. <div class="cap">
  965. {Body}
  966. </div>
  967. {/block:Reblogs}
  968. {block:NotReblog}
  969. {block:Caption}
  970. <div class="cap">
  971. {Caption}
  972. </div>
  973. {/block:Caption}
  974. {/block:NotReblog}</div>
  975. {/block:Video}
  976.  
  977. {block:Audio}
  978. <div class="caption">
  979. {block:Reblogs}
  980. <div class="rebloguser">
  981. {block:IsNotOriginalEntry}
  982. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  983. {/block:IsNotOriginalEntry}
  984. {block:IsOriginalEntry}
  985. <a href="{Permalink}"><img class="avatar" src="{PortraitURL-64}" /> {Username}</a>
  986. {/block:IsOriginalEntry}
  987. </div>
  988. <div class="cap">
  989. {Body}
  990. </div>
  991. {/block:Reblogs}
  992. {block:NotReblog}
  993. {block:Caption}
  994. <div class="cap">
  995. {Caption}
  996. </div>
  997. {/block:Caption}
  998. {/block:NotReblog}</div>
  999. {/block:Audio}
  1000.  
  1001. <div class="caption">
  1002. {block:Reblogs}
  1003. <div class="sourceq">{Source}</div>
  1004. {/block:Reblogs}
  1005. {block:NotReblog}
  1006. <div class="sourceq">{Source}</div>
  1007. {/block:NotReblog}</div>
  1008. {/block:Quote}
  1009.  
  1010. {block:Link}{block:Description}<div class="caption">{Description}</div>{/block:Description}{/block:Link}
  1011.  
  1012. {block:Chat}<div class="chats">{block:Lines}<li class="lines">{block:Label}{Label}{/block:Label}{Line}</li>{/block:Lines}</div>{/block:Chat}
  1013.  
  1014.  
  1015.  
  1016.  
  1017. </div>
  1018.  
  1019. {block:PermalinkPage}
  1020. <div class="tippytop">
  1021. {block:Date}<date>posted at <i>{12Hour}:{Minutes}:{Seconds} {AmPm}</i> on <i>{DayOfMonthWithZero} {Month} {Year}</i></date></br>{/block:Date}
  1022. {block:NotReblog}
  1023. <from><a href="{URL}"><i>original</i></a></from></br>
  1024. {/block:NotReblog}
  1025. {block:RebloggedFrom}<vias><i class="pe-7s-shuffle"></i> reblogged from <a href="{ReblogParentURL}" title="via {ReblogParentName}">{ReblogParentName}</a></vias></br>{/block:RebloggedFrom}
  1026. {block:ContentSource} <src><i class="pe-7s-pin"></i> originally from <a href="{SourceURL}" title="from {SourceTitle}">{SourceTitle}</a></src></br>{/block:ContentSource}
  1027. {block:HasTags}<div class="tagperma">filed under:{block:Tags}<a href="{TagURL}" title="{Tag}">#{Tag}</a>, {/block:Tags}</div>{/block:HasTags}
  1028. </div>
  1029. {block:NoteCount}<div class="postnotes">{NoteCountWithLabel}</div>{/block:NoteCount}
  1030. {block:PostNotes}<div class="permalinks">
  1031. {PostNotes-16}<br>
  1032. </div>{/block:PostNotes}
  1033. {/block:PermalinkPage}
  1034.  
  1035. </div>
  1036.  
  1037. {/block:Posts}
  1038.  
  1039.  
  1040.  
  1041.  
  1042. </div>
  1043.  
  1044.  
  1045. <!---------------DONT TOUCH PLS------------------->
  1046. <a href="http://wolfthemes.tumblr.com" style="position:fixed; bottom:10px; right:10px; font-size:9px;" title="wolfthemes">wolf</a>
  1047. <!------------------------------------------------>
  1048. </body>
  1049. </html>
Advertisement
Add Comment
Please, Sign In to add comment