axiumthemes

theme 06 - ragnarok

Nov 19th, 2017
1,232
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.51 KB | None | 0 0
  1. <html>
  2.  
  3. <!----------------------------------------------------------------------
  4.  
  5. THEME #06 /// Ragnarok
  6. by WOLFTHEMES
  7.  
  8. rules:
  9. 1. do not claim as your own
  10. 2. if you want to use any part
  11. of the code in your own theme
  12. please ask
  13. 3. don't remove the credit
  14. 4. enjoy :)
  15.  
  16.  
  17. Credit:
  18. Icons - linearicons
  19. Dashboard Captions - neothm.com & magnusthemes.tumblr.com
  20. resize - shythemes.tumblr.com
  21.  
  22.  
  23. -----------------------------------------------------------------------
  24.  
  25. ----------------------------------------------------------------------->
  26.  
  27. <head>
  28. <title>{Title}</title>
  29. <link rel="shortcut icon" href="{Favicon}">
  30. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  31. {block:Description}
  32. <meta name="description" content="{MetaDescription}" />
  33. {/block:Description}
  34.  
  35. <meta name="image:Icon" content=""/>
  36. <meta name="if:MiniCursor" content="">
  37. <meta name="if:Dark Theme" content="">
  38.  
  39. <meta name="color:Accent" content="#F1DC8E"/>
  40.  
  41. <meta name="select:Font" content="'Open Sans', sans-serif" title="Open Sans">
  42. <meta name="select:Font" content="'Roboto', sans-serif" title="Roboto">
  43. <meta name="select:Font" content="'Barlow', sans-serif" title="Barlow">
  44. <meta name="select:Font" content="'Oswald', sans-serif" title="Oswald">
  45. <meta name="select:Font" content="'Poppins', sans-serif" title="Poppins">
  46. <meta name="select:Font" content="'Muli', sans-serif" title="Muli">
  47. <meta name="select:Font" content="'Nunito', sans-serif" title="Nunito">
  48. <meta name="select:Font" content="'Sarala', sans-serif" title="Sarala">
  49. <meta name="select:Font" content="'Magra', sans-serif" title="Magra">
  50. <meta name="select:Font" content="'Jaldi', sans-serif" title="Jaldi">
  51. <meta name="select:Font" content="'Merriweather', serif" title="Merriweather">
  52. <meta name="select:Font" content="'Playfair Display', serif" title="Playfair Display">
  53. <meta name="select:Font" content="'Crimson Text', serif" title="Crimson Text">
  54. <meta name="select:Font" content="'Rasa', serif" title="Rasa">
  55. <meta name="select:Font" content="'David Libre', serif" title="David Libre">
  56. <meta name="select:Font" content="'IM Fell English', serif" title="IM Fell English">
  57.  
  58. <meta name="select:Title Font" content="'Open Sans', sans-serif" title="Open Sans">
  59. <meta name="select:Title Font" content="'Roboto', sans-serif" title="Roboto">
  60. <meta name="select:Title Font" content="'Barlow', sans-serif" title="Barlow">
  61. <meta name="select:Title Font" content="'Oswald', sans-serif" title="Oswald">
  62. <meta name="select:Title Font" content="'Poppins', sans-serif" title="Poppins">
  63. <meta name="select:Title Font" content="'Muli', sans-serif" title="Muli">
  64. <meta name="select:Title Font" content="'Nunito', sans-serif" title="Nunito">
  65. <meta name="select:Title Font" content="'Sarala', sans-serif" title="Sarala">
  66. <meta name="select:Title Font" content="'Magra', sans-serif" title="Magra">
  67. <meta name="select:Title Font" content="'Jaldi', sans-serif" title="Jaldi">
  68. <meta name="select:Title Font" content="'Merriweather', serif" title="Merriweather">
  69. <meta name="select:Title Font" content="'Playfair Display', serif" title="Playfair Display">
  70. <meta name="select:Title Font" content="'Crimson Text', serif" title="Crimson Text">
  71. <meta name="select:Title Font" content="'Rasa', serif" title="Rasa">
  72. <meta name="select:Title Font" content="'David Libre', serif" title="David Libre">
  73. <meta name="select:Title Font" content="'IM Fell English', serif" title="IM Fell English">
  74.  
  75. <meta name="select:Link Font" content="'Open Sans', sans-serif" title="Open Sans">
  76. <meta name="select:Link Font" content="'Roboto', sans-serif" title="Roboto">
  77. <meta name="select:Link Font" content="'Barlow', sans-serif" title="Barlow">
  78. <meta name="select:Link Font" content="'Oswald', sans-serif" title="Oswald">
  79. <meta name="select:Link Font" content="'Poppins', sans-serif" title="Poppins">
  80. <meta name="select:Link Font" content="'Muli', sans-serif" title="Muli">
  81. <meta name="select:Link Font" content="'Nunito', sans-serif" title="Nunito">
  82. <meta name="select:Link Font" content="'Sarala', sans-serif" title="Sarala">
  83. <meta name="select:Link Font" content="'Magra', sans-serif" title="Magra">
  84. <meta name="select:Link Font" content="'Jaldi', sans-serif" title="Jaldi">
  85. <meta name="select:Link Font" content="'Merriweather', serif" title="Merriweather">
  86. <meta name="select:Link Font" content="'Playfair Display', serif" title="Playfair Display">
  87. <meta name="select:Link Font" content="'Crimson Text', serif" title="Crimson Text">
  88. <meta name="select:Link Font" content="'Rasa', serif" title="Rasa">
  89. <meta name="select:Link Font" content="'David Libre', serif" title="David Libre">
  90. <meta name="select:Link Font" content="'IM Fell English', serif" title="IM Fell English">
  91.  
  92. <meta name="text:Font Size" content="11"/>
  93. <meta name="text:Post Width" content="250"/>
  94. <meta name="text:Permalink Post Width" content="500"/>
  95.  
  96. <meta name="text:Link One URL" content="/"/>
  97. <meta name="text:Link One" content="one"/>
  98. <meta name="text:Link Two URL" content="/"/>
  99. <meta name="text:Link Two" content="two"/>
  100. <meta name="text:Link Three URL" content="/"/>
  101. <meta name="text:Link Three" content="three"/>
  102. <meta name="text:Link Four URL" content="/"/>
  103. <meta name="text:Link Four" content="four"/>
  104.  
  105.  
  106. <link href="https://fonts.googleapis.com/css?family=Barlow|Crimson+Text|David+Libre|IM+Fell+English|Jaldi|Magra|Merriweather|Muli|Nunito|Open+Sans|Oswald|Playfair+Display|Poppins|Rasa|Roboto|Sarala" rel="stylesheet">
  107. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  108.  
  109.  
  110.  
  111. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  112. <script src="https://static.tumblr.com/uopakca/GVcnvdwbq/jquery.style-my-tooltips.js"></script>
  113. <script>
  114. (function($){
  115. $(document).ready(function(){
  116. $('a[title]').style_my_tooltips({
  117. tip_follows_cursor:true,
  118. tip_delay_time:90,
  119. tip_fade_speed:700,
  120. attribute:'title'
  121. });
  122. });
  123. })(jQuery);
  124. </script>
  125.  
  126. <script src="http://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  127. <script>
  128. !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);
  129. $('#captions').unnest({
  130. yourCaption: ".cap", //your caption selector, the div wrapping
  131. wrapName: ".rebloguser", //the name of the captions’ new wrapper
  132. newCaptionUsername: false, //if the user adds a new caption, following a series of captions, show their username above the caption
  133. originalPostCaptionUsername: false, //for the original captions, or a user-added caption that previously didn’t have any, have their username on it
  134. tumblrAvatars: true, //”dashboard style” caption, have the avatar of the blog next to the username
  135. tumblrAvatarClass: ".avatr", //class of the avatar next to the username
  136. usernameColon: false //if turned to false, removes the colon at the end of usernames bc :) seriously :) hwy :)
  137. });
  138. $('#captions').unnest({
  139. newCaptionUsername: false,
  140. tumblrAvatars: false,
  141. usernameColon: true
  142. });
  143. </script>
  144.  
  145. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  146. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  147. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  148. <script>
  149. $(document).ready(function(){
  150. $('.photo-slideshow').pxuPhotoset({
  151. lightbox: true,
  152. rounded: false,
  153. gutter: '0px',
  154. borderRadius: '0px',
  155. photoset: '.photo-slideshow',
  156. photoWrap: '.photo-data',
  157. photo: '.pxu-photo'
  158. });
  159. });
  160. </script>
  161.  
  162.  
  163.  
  164. </head>
  165.  
  166. <style type="text/css">
  167.  
  168.  
  169. /*-------------- SCROLLBAR ----------------*/
  170.  
  171. ::-webkit-scrollbar {
  172. width:8px;
  173. }
  174. ::-webkit-scrollbar {
  175. {block:ifDarkTheme}background: #000;{/block:ifDarkTheme}
  176. {block:ifNotDarkTheme}background: #f2f2f2;{/block:ifNotDarkTheme} /* background color */
  177. }
  178. ::-webkit-scrollbar-track {
  179. {block:ifDarkTheme}background: #000;{/block:ifDarkTheme}
  180. {block:ifNotDarkTheme}background: #f2f2f2;{/block:ifNotDarkTheme} /* light border color */
  181. }
  182. ::-webkit-scrollbar-thumb {
  183. background: {color:Accent} ;
  184. }
  185.  
  186. /*-------------- TOOLTIP ----------------*/
  187.  
  188. #s-m-t-tooltip {
  189. max-width:300px;
  190. padding:3px 6px 3px 6px;
  191. margin:20px 20px 10px 6px;
  192. font-family: 'Sarala', sans-serif;
  193. font-size:9px;
  194. {block:ifDarkTheme}background: #0f0f0f;color:#fff;{/block:ifDarkTheme}
  195. {block:ifNotDarkTheme}background: #f2f2f2;color:#888;{/block:ifNotDarkTheme}
  196. text-transform: uppercase;
  197. z-index:9999999;}
  198.  
  199. ::selection {
  200. background: {color:Accent}; /* WebKit/Blink Browsers */
  201. color: #000;
  202. }
  203. ::-moz-selection {
  204. background: {color:Accent}; /* Gecko Browsers */
  205. color: #000;
  206. }
  207.  
  208.  
  209. /*-------------- BASIC HTML ----------------*/
  210.  
  211.  
  212. html {
  213. overflow-x:hidden;
  214. {block:ifDarkTheme}background: #0f0f0f;{/block:ifDarkTheme}
  215. {block:ifNotDarkTheme}background: #f2f2f2;{/block:ifNotDarkTheme}
  216. {block:ifMiniCursor}cursor: url(http://www.rw-designer.com/cursor-extern.php?id=27887), progress !important;{/block:ifMiniCursor}
  217. }
  218.  
  219.  
  220. a:hover, img:hover {
  221. {block:ifMiniCursor}cursor: url(http://www.rw-designer.com/cursor-extern.php?id=91283), progress !important;{/block:ifMiniCursor}
  222. }
  223.  
  224. body {
  225. font-size: {text:Font Size}px;
  226. {block:ifDarkTheme}color: #f7f7f7;{/block:ifDarkTheme}
  227. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  228. font-family: {select:Font};
  229. }
  230.  
  231. hr {
  232. border: none;
  233. height: 1px;
  234. background: #eee;
  235. }
  236.  
  237. a {
  238. text-decoration: none;
  239. {block:ifDarkTheme}color: #fff;{/block:ifDarkTheme}
  240. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  241. -webkit-transition: all ease 0.8s;
  242. -moz-transition: all ease 0.8s;
  243. transition: all ease 0.8s;
  244. }
  245.  
  246. a:hover, a:active {
  247. color:{color:Accent};
  248. -webkit-transition: all ease 0.8s;
  249. -moz-transition: all ease 0.8s;
  250. transition: all ease 0.8s;
  251. }
  252.  
  253. b {
  254. {block:ifDarkTheme}color: #fff;{/block:ifDarkTheme}
  255. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  256. font-weight: 1500;
  257. }
  258.  
  259. blockquote {
  260. border-left: 2px solid {color:Accent};
  261. padding: 0px 10px;
  262. margin: 0;
  263. {block:ifDarkTheme}background: #0f0f0f;{/block:ifDarkTheme}
  264. {block:ifNotDarkTheme}background: #f9f9f9;{/block:ifNotDarkTheme}
  265. margin-right: 10px;
  266. }
  267.  
  268. /*------------------------------------------*/
  269.  
  270.  
  271. /*------------------------------------------*/
  272.  
  273. #leftbar {
  274. width: 100px;
  275. height: 100%;
  276. position: fixed;
  277. left: 0;
  278. top:0;
  279. {block:ifDarkTheme}background: #000;{/block:ifDarkTheme}
  280. {block:ifNotDarkTheme}background: #fff;{/block:ifNotDarkTheme}
  281. z-index: 9;
  282. }
  283.  
  284. .title a{
  285. position: fixed;
  286. font-size: 16px;
  287. padding: 20px 15px 20px 15px;
  288. font-family: {select:Title Font};
  289. font-weight: 900;
  290. margin-left: 25px;
  291. margin-top: 15px;
  292. letter-spacing: 6px;
  293. {block:ifDarkTheme}background: #000; color: #fff;{/block:ifDarkTheme}
  294. {block:ifNotDarkTheme}background: #fff; color: #333;{/block:ifNotDarkTheme}
  295. z-index: 9;
  296. }
  297.  
  298. .title a:hover {
  299. color: {color:Accent};
  300. }
  301.  
  302. #customlinks {
  303. width: 600px;
  304. height: 50px;
  305. position: fixed;
  306. bottom: 300px;
  307. left: -235px;
  308. font-size: 13px;
  309. font-family: {select:Link Font};
  310. transform: rotate(270deg);
  311. }
  312.  
  313. #customlinks a {
  314. {block:ifDarkTheme}color: #fff;{/block:ifDarkTheme}
  315. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  316. opacity: 0.3;
  317. margin-left: 30px;
  318. padding: 2px 10px 2px 10px;
  319. box-shadow: inset 0 0 0 0 #fff;
  320. -webkit-transition: all ease 1s;
  321. -moz-transition: all ease 1s;
  322. transition: all ease 1s;
  323.  
  324. }
  325.  
  326. #customlinks a:hover {
  327. box-shadow: inset 100px 0 0 0 {color:Accent};
  328. {block:ifDarkTheme}color: #000;{/block:ifDarkTheme}
  329. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  330. opacity: 1;
  331. -webkit-transition: all ease 1s;
  332. -moz-transition: all ease 1s;
  333. transition: all ease 1s;
  334. }
  335.  
  336. #mainlinks {
  337. position:fixed;
  338. top:40px;
  339. right:20px;
  340. z-index: 9;
  341. }
  342.  
  343. #mainlinks a {
  344. padding: 2px 10px 2px 10px;
  345. {block:ifDarkTheme}color: #fff;{/block:ifDarkTheme}
  346. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  347. opacity: 0.3;
  348. margin-right: 20px;
  349. font-size: 11px;
  350. font-family: {select:Link Font};
  351. z-index: 9;
  352. }
  353.  
  354. #mainlinks a:hover {
  355. box-shadow: inset 100px 0 0 0 {color:Accent};
  356. {block:ifDarkTheme}color: #000;{/block:ifDarkTheme}
  357. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  358. opacity: 1;
  359. -webkit-transition: all ease 1s;
  360. -moz-transition: all ease 1s;
  361. transition: all ease 1s;
  362. z-index: 9;
  363. }
  364.  
  365. #aboutbox {
  366. width: 200px;
  367. height: auto;
  368. padding: 20px;
  369. border-right: 5px solid {color:Accent};
  370. {block:ifDarkTheme}background: #000;{/block:ifDarkTheme}
  371. {block:ifNotDarkTheme}background: #fff;{/block:ifNotDarkTheme}
  372. font-size: 9px;
  373. position: fixed;
  374. bottom: 20px;
  375. right: 20px;
  376. opacity: 0.3;
  377. -webkit-transition: all ease 0.8s;
  378. -moz-transition: all ease 0.8s;
  379. transition: all ease 0.8s;
  380. z-index: 9;
  381. }
  382.  
  383. #aboutbox:hover {
  384. opacity: 1;
  385. -webkit-transition: all ease 0.8s;
  386. -moz-transition: all ease 0.8s;
  387. transition: all ease 0.8s;
  388. }
  389.  
  390. #icon img {
  391. position: absolute;
  392. width: 45px;
  393. height: 45px;
  394. {block:ifDarkTheme}border: 2px solid #000;{/block:ifDarkTheme}
  395. {block:ifNotDarkTheme}border: 2px solid #fff;{/block:ifNotDarkTheme}
  396. border-radius: 100%;
  397. margin-top: -60px;
  398. left: calc(50% - 22.5px);
  399. }
  400.  
  401. #postbar {
  402. position: fixed;
  403. left: 0;
  404. top: 0;
  405. height: 100px;
  406. width: 100%;
  407. z-index: 5;
  408. {block:ifDarkTheme}background: #0f0f0f;{/block:ifDarkTheme}
  409. {block:ifNotDarkTheme}background: #f2f2f2;{/block:ifNotDarkTheme}
  410. }
  411.  
  412. iframe.tmblr-iframe {
  413. z-index:1!important;
  414. top:0!important;
  415. right:0!important;
  416. opacity:0.4;
  417. display:none;
  418. /* delete invert(1) from here */
  419. filter:invert(1) contrast(150%);
  420. -webkit-filter:invert(1) contrast(150%);
  421. -o-filter:invert(1) contrast(150%);
  422. -moz-filter:invert(1) contrast(150%);
  423. -ms-filter:invert(1) contrast(150%);
  424. /* to here if your blog has a dark background */
  425. transform:scale(0.65);
  426. transform-origin:100% 0;
  427. -webkit-transform:scale(0.65);
  428. -webkit-transform-origin:100% 0;
  429. -o-transform:scale(0.65);
  430. -o-transform-origin:100% 0;
  431. -moz-transform:scale(0.65);
  432. -moz-transform-origin:100% 0;
  433. -ms-transform:scale(0.65);
  434. -ms-transform-origin:100% 0;}
  435.  
  436. iframe.tmblr-iframe:hover {
  437. display:none;
  438. opacity:0.6!important;}
  439.  
  440.  
  441. /*------------------------------------------*/
  442. .postcontainer {
  443. position: absolute;
  444. margin-top: 70px;
  445. {block:IndexPage}width: {text:Post Width}px; left: calc(50% - {text:Post Width}px/2);{/block:IndexPage}
  446. {block:PermalinkPage}width: {text:Permalink Post Width}px;left: calc(50% - {text:Permalink Post Width}px/2);{/block:PermalinkPage}
  447. height: auto;
  448. z-index: 1;
  449. margin-bottom: 80px;
  450. }
  451.  
  452. .posts {
  453. margin-top: 50px;
  454. {block:IndexPage}width: {text:Post Width}px;{/block:IndexPage}
  455. {block:PermalinkPage}width: {text:Permalink Post Width}px;{/block:PermalinkPage}
  456. {block:ifDarkTheme}background: #000; color: #f7f7f7;border: 5px solid #000;{/block:ifDarkTheme}
  457. {block:ifNotDarkTheme}background: #fff;color: #555;border: 5px solid #fff;{/block:ifNotDarkTheme}
  458. }
  459.  
  460. ol{
  461. list-style-type: lower-roman;
  462. width: 75%;
  463. }
  464.  
  465. ul {
  466. list-style-type: square;
  467. width: 75%;
  468. }
  469.  
  470. #captions a {
  471. padding-left: 5px;
  472. padding-right: 5px;
  473. box-shadow: inset 0 0 0 0 {color:Accent};
  474. {block:ifDarkTheme}color: #fff;{/block:ifDarkTheme}
  475. {block:ifNotDarkTheme}color: #333;{/block:ifNotDarkTheme}
  476. -webkit-transition: all ease 0.8s;
  477. -moz-transition: all ease 0.8s;
  478. transition: all ease 0.8s;
  479. }
  480.  
  481. #captions a:hover {
  482. box-shadow: inset 100px 0 0 0 {color:Accent};
  483. {block:ifDarkTheme}color: #000;{/block:ifDarkTheme}
  484. {block:ifNotDarkTheme}color: #000;{/block:ifNotDarkTheme}
  485. -webkit-transition: all ease 0.8s;
  486. -moz-transition: all ease 0.8s;
  487. transition: all ease 0.8s;
  488. }
  489.  
  490. #captions {
  491. width: 100%;
  492. margin-left: 5px;
  493. margin-top: 10px;
  494. {block:ifDarkTheme}background: #000; color: #f7f7f7;{/block:ifDarkTheme}
  495. {block:ifNotDarkTheme}background: #fff;color: #555;{/block:ifNotDarkTheme}
  496. border: 1px solid #ddd;
  497. }
  498.  
  499. #captionhome {
  500. margin-top: 10px;
  501. padding-left: 10px;
  502. }
  503.  
  504. #spacetime {
  505. {block:ifDarkTheme}border-top: 1px solid #fff;{/block:ifDarkTheme}
  506. {block:ifNotDarkTheme}border-top: 1px solid #ddd;{/block:ifNotDarkTheme}
  507. padding-top: 10px;
  508. padding-bottom: 10px;
  509. }
  510.  
  511. #tags {
  512. {block:ifDarkTheme}border-top: 1px solid #fff;{/block:ifDarkTheme}
  513. {block:ifNotDarkTheme}border-top: 1px solid #ddd;{/block:ifNotDarkTheme}
  514. padding-top: 10px;
  515. padding-bottom: 10px;
  516. text-align: center;
  517. {block:ifDarkTheme}color: #f7f7f7;{/block:ifDarkTheme}
  518. {block:ifNotDarkTheme}color: #555;{/block:ifNotDarkTheme}
  519. font-size: 10px;
  520. }
  521.  
  522. #tags a {
  523. margin-right: 10px;
  524. }
  525.  
  526. #tags .lnr {
  527. margin-right: 3px;
  528. font-weight:bold;
  529. }
  530.  
  531. .notes {
  532. {block:ifDarkTheme}border-top: 1px solid #fff;{/block:ifDarkTheme}
  533. {block:ifNotDarkTheme}border-top: 1px solid #ddd;{/block:ifNotDarkTheme}
  534. padding-top: 10px;
  535. padding-bottom: 10px;
  536. text-align: center;
  537. {block:ifDarkTheme}color: #f7f7f7;{/block:ifDarkTheme}
  538. {block:ifNotDarkTheme}color: #555;{/block:ifNotDarkTheme}
  539. }
  540.  
  541. .notes img {
  542. border-radius: 5px;
  543. }
  544.  
  545. .marginoferror {
  546. margin: 5px;
  547. }
  548.  
  549. a.via {
  550. margin-left: 10px;
  551. margin-right: 3px;
  552. padding-left: 3px;
  553. padding-right: 3px;
  554. }
  555.  
  556. a.src {
  557. margin-left: 3px;
  558. padding-left: 3px;
  559. padding-right: 3px;
  560. }
  561.  
  562. a.permas{
  563. font-weight: bold;
  564. position: absolute;
  565. right: 10px;
  566. margin-top: 3px;
  567. }
  568.  
  569. a.permas .lnr, a.reblog .lnr {
  570. font-weight: bold;
  571. }
  572.  
  573. a.reblog {
  574. font-weight: bold;
  575. position: absolute;
  576. margin-top: 3px;
  577. right: 30px;
  578. }
  579.  
  580. .avatr{
  581. display: inline;
  582. margin-top: 30px;
  583. margin-right: 5px;
  584. font-weight: bold;
  585. }
  586.  
  587. .avatr .lnr{
  588. font-weight: bold;
  589. }
  590.  
  591. .cap {
  592. margin-left: 10px;
  593. }
  594.  
  595. .rebloguser a {
  596. {block:ifDarkTheme}background: #0f0f0f; {/block:ifDarkTheme}
  597. {block:ifNotDarkTheme}background: #f2f2f2;{/block:ifNotDarkTheme}
  598. padding: 2px 5px;
  599. }
  600.  
  601. #posttype .lnr {
  602. position: absolute;
  603. font-size:15px;
  604. padding: 10px;
  605. margin-top: -15px;
  606. margin-left: -15px;
  607. border-radius: 100%;
  608. font-weight: bold;
  609. z-index: 8;
  610. {block:ifDarkTheme}background: #000; color: #f7f7f7;{/block:ifDarkTheme}
  611. {block:ifNotDarkTheme}background: #fff;color: #555;{/block:ifNotDarkTheme}
  612. }
  613.  
  614. #posttype img {
  615. position: absolute;
  616. border-radius: 100%;
  617. margin-top: -15px;
  618. margin-left: -15px;
  619. padding: 5px;
  620. {block:ifDarkTheme}background: #000; {/block:ifDarkTheme}
  621. {block:ifNotDarkTheme}background: #fff;{/block:ifNotDarkTheme}
  622. }
  623.  
  624. .ask, .quest {
  625. display: inline;
  626. z-index: 99;
  627. }
  628.  
  629. .quest {
  630. margin-left: 10px;z-index: 99;
  631. }
  632.  
  633. .ask a {
  634. {block:ifDarkTheme}background: #0f0f0f;{/block:ifDarkTheme}
  635. {block:ifNotDarkTheme}background: #f9f9f9;{/block:ifNotDarkTheme}
  636. padding: 2px 15px;
  637. box-shadow: inset 0 0 0 0 {color:Accent};
  638. }
  639.  
  640. .ask a:hover {
  641. box-shadow: inset 100px 0 0 0 {color:Accent};
  642. {block:ifDarkTheme}color: #000;{/block:ifDarkTheme}
  643. {block:ifNotDarkTheme}color: #000;{/block:ifNotDarkTheme}
  644. -webkit-transition: all ease 0.8s;
  645. -moz-transition: all ease 0.8s;
  646. transition: all ease 0.8s;
  647. }
  648.  
  649. .question {
  650. border-radius: 10px;
  651. padding: 10px;
  652. width: 80%;
  653. margin: 10px;
  654. }
  655.  
  656. .question img {
  657. position: absolute;
  658. left: 5px;
  659. margin-top: -10px;
  660. {block:ifDarkTheme}border-top: 5px solid #fff;{/block:ifDarkTheme}
  661. {block:ifNotDarkTheme}border-top: 5px solid #ddd;{/block:ifNotDarkTheme}
  662. border-radius: 100%;
  663. }
  664.  
  665. .posttitle {
  666. text-align: center;
  667. margin: 5px;
  668. }
  669.  
  670. .quote {
  671. width: 50%;
  672. margin-left: 25%;
  673. text-align: center;
  674. margin-top: 5px;
  675. margin-bottom: 5px;
  676. }
  677.  
  678. .sourceq {
  679. text-align: right;
  680. margin-bottom: 10px;
  681. margin-right: 20px;
  682. }
  683.  
  684. .sourceq a {
  685. {block:ifDarkTheme}background: #0f0f0f;{/block:ifDarkTheme}
  686. {block:ifNotDarkTheme}background: #f9f9f9;{/block:ifNotDarkTheme}
  687. }
  688.  
  689. .sourceq a:hover {
  690. background: {color:Accent};
  691. {block:ifDarkTheme}color: #000;{/block:ifDarkTheme}
  692. {block:ifNotDarkTheme}color: #000;{/block:ifNotDarkTheme}
  693. -webkit-transition: all ease 0.8s;
  694. -moz-transition: all ease 0.8s;
  695. transition: all ease 0.8s;
  696. }
  697.  
  698. #pagination {
  699. {block:ifDarkTheme}background: #000;{/block:ifDarkTheme}
  700. {block:ifNotDarkTheme}background: #fff;{/block:ifNotDarkTheme}
  701. position: fixed;
  702. bottom: 0;
  703. left: 0;
  704. width: 250px;
  705. height: 40px;
  706. z-index: 9;
  707. font-size: 30px;
  708. word-spacing: 6px;
  709. text-align: center;
  710. }
  711.  
  712. .current, .jump, .linear {
  713. margin-top: 45px;
  714. }
  715.  
  716. .current {
  717. color: {color:Accent};
  718. }
  719.  
  720. .jump {
  721. {block:ifDarkTheme}color: #0f0f0f;{/block:ifDarkTheme}
  722. {block:ifNotDarkTheme}color: #f9f9f9;{/block:ifNotDarkTheme}
  723. }
  724.  
  725. .jump:hover {
  726. color: {color:Accent};
  727. -webkit-transition: all ease 0.8s;
  728. -moz-transition: all ease 0.8s;
  729. transition: all ease 0.8s;
  730. }
  731.  
  732. a.next:hover , a.prev:hover {
  733. color: {color:Accent};
  734. -webkit-transition: all ease 0.8s;
  735. -moz-transition: all ease 0.8s;
  736. transition: all ease 0.8s;
  737. }
  738.  
  739. </style>
  740.  
  741. <body>
  742.  
  743. <div id="leftbar">
  744. <div class="title"><a href="/">{Name}</a></div>
  745. <div id="customlinks">
  746. <a href="{text:Link One Url}">{text:Link One}</a>
  747. <a href="{text:Link Two Url}">{text:Link Two}</a>
  748. <a href="{text:Link Three Url}">{text:Link Three}</a>
  749. <a href="{text:Link Four Url}">{text:Link Four}</a>
  750. </div>
  751. </div>
  752. <div id="mainlinks">
  753. <a href="/">home</a>
  754. <a href="/ask">ask</a>
  755. <a href="/archive">archive</a>
  756. <a href="http://www.tumblr.com/follow/blogname">follow</a>
  757. <a href="http://www.tumblr.com/dashboard">dash</a>
  758. <a href="http://wolfthemes.tumblr.com">credit</a>
  759. </div>
  760.  
  761. <div id="aboutbox">
  762. <div id="icon"><img src="{image:Icon}"></div>
  763. {description}
  764. </div>
  765.  
  766.  
  767. {block:IndexPage}
  768. <div id="postbar"></div>
  769. <div id="pagination">
  770. {block:Pagination}
  771. {block:PreviousPage}
  772. <a class="prev" href="{PreviousPage}" title="back">—</a>
  773. {/block:PreviousPage}
  774. {block:JumpPagination length="5"}
  775. {block:CurrentPage}<span class="current">•</span>{/block:CurrentPage}
  776. {block:JumpPage}<a class="jump" href="{URL}" title="page {PageNumber}">•</a>{/block:JumpPage}{/block:JumpPagination}
  777. {block:NextPage}
  778. <a class="next" href="{NextPage}" title="next">—</a>
  779. {/block:NextPage}
  780. {/block:Pagination}
  781. </div>
  782. {/block:IndexPage}
  783.  
  784.  
  785.  
  786. <div class="postcontainer" data-infinite-scroll='{ "path": ".pagination__next", "append": ".post", "history": false }'>
  787. {block:Posts}
  788. <div class="posts">
  789. <span id="posttype">
  790. {block:Answer}<img src="{AskerPortraitURL-24}">{/block:Answer}
  791. {block:Text}<span class="lnr lnr-text-size"></span>{/block:Text}
  792. {block:Photo}<span class="lnr lnr-camera"></span>{/block:Photo}
  793. {block:Photoset}<span class="lnr lnr-camera"></span>{/block:Photoset}
  794. {block:Quote}<span class="lnr lnr-bubble"></span>{/block:Quote}
  795. {block:Link}<span class="lnr lnr-link"></span>{/block:Link}
  796. {block:Chat}<span class="lnr lnr-pushpin"></span>{/block:Chat}
  797. {block:Video}<span class="lnr lnr-camera-video"></span>{/block:Video}
  798. {block:Audio}<span class="lnr lnr-music-note"></span>{/block:Audio}
  799. </span>
  800.  
  801.  
  802. {block:Answer}
  803. <div class="question"><div class="ask"> {Asker} asked:</div><div class="quest">{Question}</div></div>
  804. {/block:Answer}
  805.  
  806. {block:Text}{block:Title}<div class="posttitle">{Title}</div>{/block:Title}{/block:Text}
  807.  
  808. {block:Photo}<img src="{PhotoURL-500}" width="{block:IndexPage}{text:Post Width}px{/block:IndexPage}{block:PermalinkPage}{text:Permalink Post Width}px{/block:PermalinkPage}" max-height="100%">{block:Photo}
  809.  
  810. {block:Photoset}<div class="set"><center><div class="pxu"><div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}
  811. <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></div></center></div>{/block:Photoset}
  812.  
  813. {block:Quote}<div class="quote">{Quote}</div>{/block:Quote}
  814.  
  815. {block:Link}<a href="{URL}" class="link" {Target}>{Name}</a>{/block:Link}
  816.  
  817. {block:Chat}{block:Title}<div class="posttitle">{Title}</div></a>{/block:Title}{/block:Chat}
  818.  
  819. {block:Video}<div class="video">{Video-500}</div>{block:Video}
  820.  
  821. {block:Audio}{AudioEmbed}{/block:Audio}
  822.  
  823. </div>
  824. <div id="captions">
  825.  
  826. {block:Answer}
  827. <div id="captionhome">
  828. <div class="answer"><img src="{AnswererPortraitURL-24}">{block:Answerer}{Answerer} said: {/block:Answerer}{Answer}</div></div>
  829. {/block:Answer}
  830.  
  831. {block:Text}<div id="captionhome">{block:Reblogs}
  832. <div class="rebloguser">
  833. {block:IsNotOriginalEntry}
  834. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  835. {/block:IsNotOriginalEntry}
  836. {block:IsOriginalEntry}
  837. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>{/block:IsOriginalEntry}
  838. </div>
  839. <div class="cap">
  840. {Body}
  841. </div>
  842. {/block:Reblogs}
  843. {block:NotReblog}
  844. <div class="cap">
  845. {Body}
  846. </div>
  847. {/block:NotReblog}</div>
  848. {/block:Text}
  849. {block:Photo}
  850. <div id="captionhome">
  851. {block:Reblogs}
  852. <div class="rebloguser">
  853. {block:IsNotOriginalEntry}
  854. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  855. {/block:IsNotOriginalEntry}
  856. {block:IsOriginalEntry}
  857. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  858. {/block:IsOriginalEntry}
  859. </div>
  860. <div class="cap">
  861. {Body}
  862. </div>
  863. {/block:Reblogs}
  864. {block:NotReblog}
  865. {block:Caption}
  866. <div class="cap">
  867. {Caption}
  868. </div>
  869. {/block:Caption}
  870. {/block:NotReblog}
  871. </div>
  872. {/block:Photo}
  873. {block:Photoset}
  874. <div id="captionhome">
  875. {block:Reblogs}
  876. <div class="rebloguser">
  877. {block:IsNotOriginalEntry}
  878. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  879. {/block:IsNotOriginalEntry}
  880. {block:IsOriginalEntry}
  881. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  882. {/block:IsOriginalEntry}
  883. </div>
  884. <div class="cap">
  885. {Body}
  886. </div>
  887. {/block:Reblogs}
  888. {block:NotReblog}
  889. {block:Caption}
  890. <div class="cap">
  891. {Caption}
  892. </div>
  893. {/block:Caption}
  894. {/block:NotReblog}
  895. </div>
  896. {/block:Photoset}
  897. {block:Video}
  898. <div id="captionhome">
  899. {block:Reblogs}
  900. <div class="rebloguser">
  901. {block:IsNotOriginalEntry}
  902. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  903. {/block:IsNotOriginalEntry}
  904. {block:IsOriginalEntry}
  905. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  906. {/block:IsOriginalEntry}
  907. </div>
  908. <div class="cap">
  909. {Body}
  910. </div>
  911. {/block:Reblogs}
  912. {block:NotReblog}
  913. {block:Caption}
  914. <div class="cap">
  915. {Caption}
  916. </div>
  917. {/block:Caption}
  918. {/block:NotReblog}
  919. </div>
  920. {/block:Video}
  921. {block:Audio}
  922. <div id="captionhome">
  923. {block:Reblogs}
  924. <div class="rebloguser">
  925. {block:IsNotOriginalEntry}
  926. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  927. {/block:IsNotOriginalEntry}
  928. {block:IsOriginalEntry}
  929. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  930. {/block:IsOriginalEntry}
  931. </div>
  932. <div class="cap">
  933. {Body}
  934. </div>
  935. {/block:Reblogs}
  936. {block:NotReblog}
  937. {block:Caption}
  938. <div class="cap">
  939. {Caption}
  940. </div>
  941. {/block:Caption}
  942. {/block:NotReblog}
  943. </div>
  944. {/block:Audio}
  945.  
  946. {block:Quote}<div id="captionhome">{block:Reblogs}
  947. <div class="rebloguser">
  948. {block:IsNotOriginalEntry}
  949. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  950. {/block:IsNotOriginalEntry}
  951. {block:IsOriginalEntry}
  952. <a href="{Permalink}"><div class="avatr"><span class="lnr lnr-bubble"></span></div>{Username}</a>
  953. {/block:IsOriginalEntry}
  954. </div>
  955. <div class="sourceq">{Source}</div>
  956. {/block:Reblogs}
  957. {block:NotReblog}
  958. <div class="sourceq">{Source}</div>
  959. {/block:NotReblog}</div>
  960. {/block:Quote}
  961.  
  962. {block:Link}{block:Description}<div id="captionhome">{Description}</div>{/block:Description}{/block:Link}
  963.  
  964. {block:Chat}<div id="captionhome">{block:Lines}<li>{block:Label}{Label}{/block:Label}{Line}</li>{/block:Lines}</div>{/block:Chat}
  965.  
  966. <div id="spacetime">
  967. <div class="marginoferror">
  968. {block:RebloggedFrom}
  969. <a class="via" href="{ReblogParentURL}" title="{ReblogParentTitle} ">{ReblogParentName}</a>
  970. {/block:RebloggedFrom}<span class="lnr lnr-sync" style="font-weight: bold;"></span>
  971. {block:ContentSource}
  972. <a class="src" href="{ReblogRootURL}" title="{ReblogRootTitle}">{ReblogRootName}</a>
  973. {/block:ContentSource}
  974. <a class="reblog" href="{ReblogURL}" title="reblog"><span class="lnr lnr-sync"></span></a>
  975. <a class="permas" href="{Permalink}" title="{NoteCountWithLabel} : {DayofMonth} {Month}"><span class="lnr lnr-heart"></span></a>
  976. </div></div>
  977.  
  978. {block:HasTags}
  979. <div id="tags">
  980. {block:Tags}<a href="{TagUrl}" title="{Tag}"><span class="lnr lnr-bookmark"></span>{Tag}</a>{/block:Tags}
  981. </div>
  982. {/block:HasTags}
  983.  
  984.  
  985. </div>
  986.  
  987. {/block:Posts}
  988.  
  989. </div>
  990.  
  991.  
  992.  
  993.  
  994. </body>
  995. </html>
Advertisement
Add Comment
Please, Sign In to add comment