thetruththemes

Axel Tumblr Theme

Dec 9th, 2014
946
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.21 KB | None | 0 0
  1. <html>
  2. <!----------------------------------------------------------------------------
  3. ,,
  4. ,GG,
  5. GIIG
  6. Gl''lG
  7. ;G' 'G;
  8. GP YG
  9. oQ' 'Qo -Axᴇʟ ᴛʜᴇᴍᴇ ʙʏ
  10. *TGGGGGGGGGGGGQQQ, ,QQQGGGGGGGGGGGGP* ɴʏᴄᴛᴏᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ
  11. *TGo, '* *' ,oGP*
  12. *TGo, ɴʏᴄᴛ□ᴛʜᴇᴍᴇs ,oGP* -ᴘʟᴇᴀsᴇ ʀᴇғᴇʀ ᴛᴏ ᴏʀɪɢɪɴᴀʟ
  13. *TGio,, ,,oiGP* ᴘᴏsᴛ ʟɪɴᴋ ғᴏʀ ʀᴜʟᴇs ᴀɴᴅ ᴍɪsᴄ
  14. ;GGT' 'TGG:
  15. GG' ii 'GG -ᴅᴏ ɴᴏᴛ ʀᴇᴍᴏᴠᴇ ᴀɴʏ ᴏғ ᴛʜᴇ
  16. GG' ,GG, 'GG ᴄᴏᴅᴇ ᴄʀᴇᴅɪᴛ ᴏʀ ᴍᴏᴠᴇ ɪᴛ ᴛᴏ
  17. GG* oGGGGo. *GG ᴀ ᴘᴀɢᴇ.
  18. oG* oGG* *GGo. *Go
  19. ;GG;oGG* *GGo;GG;
  20. ,GGGT* *TGGG,
  21. ""' '""
  22.  
  23. ----------------------------------------------------------------------------->
  24. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  25. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  26.  
  27. <head>
  28. {block:Ifcustomfavicon}<link rel="shortcut icon" href="{image:favicon}" />{/block:Ifcustomfavicon}
  29. {block:IfNotcustomfavicon}<link rel="shortcut icon" href="{favicon}" />{/block:IfNotcustomfavicon}
  30.  
  31. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  32. <title>{Title}</title>
  33. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  34.  
  35. <!------------------------------ IMAGES ------------------------------->
  36. <meta name="image:background" content="http://static.tumblr.com/u5vz4xb/7o0nf7mej/dark_leather.png"/>
  37. <meta name="image:sidebar bg" content="http://static.tumblr.com/u5vz4xb/1gVnfb6sv/axel1.png"/>
  38. <meta name="image:album art" content="http://static.tumblr.com/u5vz4xb/WJOnca8ic/untitled-1.png"/>
  39. <meta name="image:custom cursor" content="https://31.media.tumblr.com/d3a2666a9afc904c2c26785488e24691/tumblr_inline_nfcpqiyL4f1rg1lxe.png"/>
  40. <meta name="image:custom cursor Links" content="https://31.media.tumblr.com/0189de63450db9d85909aac53475452e/tumblr_inline_nfcpqlinZK1rg1lxe.png"/>
  41. <meta name="image:favicon" content="https://31.media.tumblr.com/670eceb54b2dd96a69f51ac31b40f8f2/tumblr_inline_njhm6x6zlt1rg1lxe.png"/>
  42.  
  43. <!------------------------------ COLORS ------------------------------->
  44. <!-- Main Stuff -->
  45. <meta name="color:Background" content="#0f0f0f"/>
  46. <meta name="color:Content Shadows" content="#0c090a"/>
  47. <meta name="color:Scroll Thumb" content="#4b171d"/>
  48. <meta name="color:Scroll BG" content="#0f0f0f"/>
  49. <!-- Side -->
  50. <meta name="color:Side BG" content="#9facab"/>
  51. <meta name="color:Side Border" content="#0c090a"/>
  52. <!-- Chakram Links -->
  53. <meta name="color:Side Links" content="#2c2c2d"/>
  54. <meta name="color:Middle Side Link" content="#8e9897"/>
  55. <meta name="color:Hovered Side Links" content="#0c090a"/>
  56. <meta name="color:Hovered Side Links Hover" content="#ab3939"/>
  57. <!-- Description -->
  58. <meta name="color:Description BG" content="#0c090a"/>
  59. <meta name="color:Description Text" content="#596867"/>
  60. <meta name="color:Description Bold" content="#353d3c"/>
  61. <meta name="color:Description Italic" content="#495657"/>
  62. <meta name="color:Description Links" content="#8b2530"/>
  63. <meta name="color:Description Links Hover" content="#c74a42"/>
  64. <meta name="color:Description Scroll Thumb" content="#4b171d"/>
  65. <meta name="color:Description Scroll Tracks" content="#111111"/>
  66. <meta name="color:Pagination Text" content="#596867"/>
  67. <meta name="color:Pagination Links" content="#8b2530"/>
  68. <meta name="color:Pagination Links Hover" content="#c74a42"/>
  69. <!-- Posts -->
  70. <meta name="color:Posts BG" content="#0c090a"/>
  71. <meta name="color:Posts Text" content="#596867"/>
  72. <meta name="color:Posts Titles" content="#353d3c"/>
  73. <meta name="color:Posts Links" content="#8b2530"/>
  74. <meta name="color:Posts Links Hover" content="#c74a42"/>
  75. <meta name="color:Posts Bold" content="#353d3c"/>
  76. <meta name="color:Posts Italic" content="#495657"/>
  77. <meta name="color:Posts Code" content="#353d3c"/>
  78. <meta name="color:Posts Code BG" content="#0f0f0f"/>
  79. <meta name="color:Posts Blockquote" content="#0f0f0f"/>
  80. <meta name="color:Posts Ask BG" content="#0f0f0f"/>
  81. <meta name="color:Audio Player" content="#de4040"/>
  82. <!-- Post Ending Info -->
  83. <meta name="color:Post Info BG" content="#111111"/>
  84. <meta name="color:Post Info Text" content="#3c4646"/>
  85. <meta name="color:Post Info Links" content="#412223"/>
  86. <meta name="color:Post Info Links Hover" content="#683131"/>
  87. <!-- Permalink Notes -->
  88. <meta name="color:Permalink Text" content="#683131"/>
  89. <meta name="color:Permalink Links" content="#4a5757"/>
  90. <meta name="color:Permalink Links Hover" content="#6b8484"/>
  91. <meta name="color:Permalink Blockquote" content="#412223"/>
  92. <meta name="color:Permalink Scroll Thumb" content="#412223"/>
  93. <!-- Hover Text + Click-n-Drag Selection -->
  94. <meta name="color:Hover Text" content="#d6e1e0"/>
  95. <meta name="color:Hover Text BG" content="#4b171d"/>
  96. <meta name="color:Selection Text" content="#323838"/>
  97. <meta name="color:Selection Links" content="#4b171d"/>
  98.  
  99. <!------------------------------ OPTIONS ------------------------------->
  100. <meta name="if:Simple Post Info" content="1"/>
  101. <meta name="if:Monochrome Photos" content="1"/>
  102. <meta name="if:Fade Photos" content="1"/>
  103. <meta name="if:Custom Cursor" content="1"/>
  104. <meta name="if:Custom Favicon" content="1"/>
  105. <meta name="if:Dark Audio Player" content="1"/>
  106. <meta name="if:Credit on the Right" content="1"/>
  107.  
  108. <!------------------------------ TEXTS ------------------------------->
  109. <meta name="text:Ask Verb" content="wondered"/>
  110. <!-- custom link 1 -->
  111. <meta name="text:Link 1 URL" content="/links"/>
  112. <meta name="text:Link 1 Title" content="Links"/>
  113. <meta name="text:Link 1 Symbol" content="fa fa-heart"/>
  114. <!-- custom link 2 -->
  115. <meta name="text:Link 2 URL" content="/submit"/>
  116. <meta name="text:Link 2 Title" content="Submit"/>
  117. <meta name="text:Link 2 Symbol" content="fa fa-upload"/>
  118.  
  119. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
  120. <link href='http://fonts.googleapis.com/css?family=Cinzel:400,700,900' rel='stylesheet' type='text/css'>
  121.  
  122. </head>
  123.  
  124. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  125. <script type="text/javascript" src="http://static.tumblr.7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  126. <script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  127.  
  128. <script type="text/javascript">
  129. WebFontConfig = {
  130. google: { families: [ 'Cinzel:400,700,900:latin' ] }
  131. };
  132. (function() {
  133. var wf = document.createElement('script');
  134. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  135. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  136. wf.type = 'text/javascript';
  137. wf.async = 'true';
  138. var s = document.getElementsByTagName('script')[0];
  139. s.parentNode.insertBefore(wf, s);
  140. })(); </script>
  141.  
  142. <style type="text/css">
  143.  
  144. @import url(http://fonts.googleapis.com/css?family=Cinzel:400,700,900);
  145.  
  146. /* --------------------------- DECORATION ---------------------------- */
  147.  
  148. /* body */
  149. body {
  150. color:{color:Posts Text};
  151. background: {color:Background} url('http://static.tumblr.com/u5vz4xb/7o0nf7mej/dark_leather.png') fixed;
  152. font-family:Calibri;
  153. font-size:10px;
  154. line-height:12px;
  155. text-align:justify;}
  156.  
  157. /*-------------------------- CREDIT; DON'T REMOVE --------------------------*/
  158.  
  159. #credit {
  160. z-index:99999;
  161. position:fixed;
  162. bottom:10px;
  163. {block:IfNotCreditOnTheRight}left:10px;{/block:IfNotCreditOnTheRight}
  164. {block:IfCreditOnTheRight}right:10px;{/block:IfCreditOnTheRight}
  165. width:20px; height:20px;
  166. font-size:20px;
  167. letter-spacing:1px;
  168. font-weight:bold;}
  169. #credit a {
  170. opacity:.8;
  171. color:{color:Side BG};
  172. text-shadow: 0 0 3px {color:Content Shadows};
  173. -webkit-transition: all 0.3s linear;
  174. -moz-transition: all 0.3s linear;
  175. transition: all 0.3s linear;}
  176. #credit a:hover {
  177. opacity:1;}
  178.  
  179. /* --------------------------- MINOR STUFF ---------------------------- */
  180.  
  181. /* hover text */
  182. #s-m-t-tooltip {
  183. color: {color:Hover Text};
  184. max-width:300px;
  185. padding: 3px 5px 4px 6px;
  186. font-family:Calibri;
  187. font-size:8px;
  188. font-weight:bold;
  189. line-height:10px;
  190. text-transform:uppercase;
  191. letter-spacing:1px;
  192. text-align:left;
  193. background: {color:Hover Text BG};
  194. border-radius: 1px;
  195. box-shadow: 0 0 1px rgba(0,0,0,.8);
  196. display: block;
  197. margin-left: 20px;
  198. z-index: 99999;}
  199.  
  200. /* scrollbar */
  201. ::-webkit-scrollbar {
  202. height: 8px;
  203. width: 8px;
  204. background: {color:Scroll BG};}
  205. ::-webkit-scrollbar-thumb:vertical {
  206. background: {color:Scroll Thumb};
  207. border-top:10px solid {color:Scroll BG};
  208. border-bottom:10px solid {color:Scroll BG};}
  209. ::-webkit-scrollbar-thumb:horizontal {
  210. background: {color:Scroll Thumb};
  211. border-left:10px solid {color:Scroll BG};
  212. border-right:10px solid {color:Scroll BG};}
  213.  
  214. /* drag n' click selection */
  215. ::selection {
  216. background: transparent;
  217. color: {color:Selection Text};
  218. text-shadow:none}
  219. ::-moz-selection {
  220. background: transparent;
  221. color: {color:Selection Text};
  222. text-shadow:none}
  223. a::selection {
  224. background: transparent;
  225. color: {color:Selection Links};
  226. text-shadow:none}
  227. a::-moz-selection {
  228. background: transparent;
  229. color: {color:Selection Links};
  230. text-shadow:none}
  231.  
  232. /* ------------------------- FONT STUFF --------------------------- */
  233.  
  234. /* links */
  235. a:link, a:active, a:visited{
  236. color: {color:Posts Links};
  237. text-decoration:none;
  238. -webkit-transition: all 0.5s linear;
  239. -moz-transition: all 0.5s linear;
  240. transition: all 0.5s linear;}
  241. a:hover {
  242. color: {color:Posts Links Hover};
  243. -webkit-transition: all 0.2s linear;
  244. -moz-transition: all 0.2s linear;
  245. transition: all 0.2s linear;}
  246.  
  247. /* main font decorations */
  248. b, strong{color:{color:Posts Bold};}
  249. i, em {color:{color:Posts Italic};}
  250. pre {color:{color:Posts Code};
  251. font-size:10px;
  252. max-width:100%;
  253. font-family:consolas;
  254. word-break: break-all;
  255. background:{color:Posts Code BG};
  256. margin-left:-6px;
  257. padding:4px 6px;
  258. white-space: pre-wrap;
  259. white-space: -moz-pre-wrap;
  260. white-space: -pre-wrap;
  261. white-space: -o-pre-wrap;
  262. word-wrap: break-word;}
  263.  
  264. /* text and link post titles */
  265. h1 {font: normal normal 700 19px/19px Cinzel;
  266. color:{color:Posts Title};
  267. text-align:center;
  268. letter-spacing:0.5px;}
  269. /* quote and ask post titles */
  270. h2 {font: normal normal 400 18px/18px Cinzel;
  271. color:{color:Posts Bold};
  272. text-align:center;
  273. letter-spacing:0.5px;}
  274. .posts h1:first-child, .posts h2:first-child {margin-top:0px;}
  275.  
  276. /* ----------------------------- LOW SIDEBAR ------------------------------ */
  277.  
  278. /* side */
  279. #side {
  280. position:fixed;
  281. top:0px;
  282. left:0px;
  283. width:390px;
  284. height:100%;
  285. overflow:hidden;
  286. background:{color:Side BG} url(http://static.tumblr.com/u5vz4xb/1gVnfb6sv/axel1.png) fixed no-repeat left top;}
  287. #sideborder {
  288. position:fixed;
  289. width:20px;
  290. height:100%;
  291. top:0px;
  292. left:370px;
  293. background:{color:Side Border};
  294. box-shadow:0 -10px 10px #0c090a;}
  295.  
  296. /*---------- description -------*/
  297. #axel {
  298. position:fixed;
  299. bottom:0px;
  300. left:0px;
  301. width:370px;
  302. height:100%;
  303. background: url(https://31.media.tumblr.com/24c4f798412a8b50e49052632a07d4ec/tumblr_inline_ngc9wcAlEO1rg1lxe.png) fixed no-repeat left bottom;}
  304.  
  305. /* description block */
  306. #desccontainer {
  307. position:fixed;
  308. bottom:0px;
  309. left:161px;
  310. width:209px;
  311. height:189px;
  312. border-radius:4px 0 0 0;
  313. background:{color:Description BG} url(https://31.media.tumblr.com/eff5dd118b3445b0583c7669aacf0a61/tumblr_inline_ngcapecoX31rg1lxe.png) no-repeat;
  314. background-position:31px 0px;}
  315. /* actual description itself */
  316. #desc {
  317. font-family:Calibri;
  318. text-transform:uppercase;
  319. font-size:8px;
  320. letter-spacing:1px;
  321. color:{color:Description Text};
  322. text-shadow:0 0 0 {color:Description Text};
  323. position:fixed;
  324. overflow:auto;
  325. padding-right:7px;
  326. width:170px; height:120px;
  327. left:190px; bottom:40px;}
  328. #desc b {color:{color:Description Bold};}
  329. #desc i {color:{color:Description Italic};}
  330.  
  331. #desc a {
  332. color:{color:Description Links};
  333. text-shadow:0 0 0 {color:Description Links};}
  334. #desc a:hover {
  335. color:{color:Description Links Hover};
  336. text-shadow:0 0 0 {color:Description Links Hover};}
  337.  
  338. /* desc scrollbar */
  339. #axel ::-webkit-scrollbar {
  340. height: 3px;
  341. width: 3px;
  342. background: {color:Description Scroll Tracks};
  343. border:1px solid {color:Description BG};}
  344. #axel ::-webkit-scrollbar-thumb:vertical {
  345. background: {color:Description Scroll Thumb};
  346. border-radius:1px;
  347. border:none;}
  348.  
  349. /* page navigation*/
  350. #pagination {
  351. color:{color:Pagination Text};
  352. font-family:Calibri;
  353. text-transform:uppercase;
  354. font-size:8px;
  355. letter-spacing:1px;
  356. text-align:center;
  357. position:fixed;
  358. width:170px; height:20px;
  359. left:190px; bottom:8px;}
  360. #pagination a {
  361. color:{color:Pagination Links};}
  362. #pagination a:hover {
  363. color:{color:Pagination Links Hover};}
  364.  
  365. /* ---------------------------- HIGH SIDEBAR ------------------------------ */
  366.  
  367. /* chakram */
  368. #sidebar {
  369. position:fixed;
  370. left:55px;
  371. top:33%;
  372. margin-top:-134px;
  373. text-align:left;
  374. font-size:20px;
  375. width:260px;
  376. height:260px;
  377. border-radius:1000px;
  378. background: url('https://31.media.tumblr.com/6e2c46bba5176518f9f85bdaa424d3f7/tumblr_inline_ng6rk1ECDx1rg1lxe.png') center no-repeat;
  379. -webkit-transition: all 0.4s linear;
  380. -moz-transition: all 0.4s linear;
  381. transition: all 0.4s linear;}
  382. /* links */
  383. #sidebar a {
  384. color:{color:Side Links};
  385. background:none;
  386. text-shadow:none;}
  387. /* middle link */
  388. #sidebar w {
  389. color:{color:Middle Side Link};
  390. background:none;
  391. text-shadow:none;
  392. -webkit-transition: all 0.4s linear;
  393. -moz-transition: all 0.4s linear;
  394. transition: all 0.4s linear}
  395.  
  396. /* chakram hover */
  397. #sidebar:hover {
  398. background: url('https://31.media.tumblr.com/b999a6fe02d0f9482230fff355c0e323/tumblr_inline_ng6rkbpEr81rg1lxe.png') center no-repeat;}
  399. #sidebar:hover a {
  400. color:{color:Hovered Side Links};
  401. text-shadow:0 0 3px {color:Hovered Side Links};
  402. -webkit-transition: all 0.4s linear;
  403. -moz-transition: all 0.4s linear;
  404. transition: all 0.4s linear;}
  405. #sidebar:hover w {
  406. color:{color:Hovered Side Links};
  407. text-shadow:0 0 3px {color:Hovered Side Links};
  408. -webkit-transition: all 0.4s linear;
  409. -moz-transition: all 0.4s linear;
  410. transition: all 0.4s linear}
  411. #sidebar:hover a:hover {
  412. color:{color:Hovered Side Links Hover};
  413. text-shadow:0 0 7px {color:Hovered Side Links Hover};}
  414. #sidebar:hover w:hover {
  415. color:{color:Hovered Side Links Hover};
  416. text-shadow:0 0 7px {color:Hovered Side Links Hover};}
  417.  
  418. /* ------------------------- POSTS --------------------------- */
  419.  
  420. /* position */
  421. #entries {
  422. margin-top:70px;
  423. margin-left:410px;
  424. text-align:justify;}
  425. /* posts themselves */
  426. .posts {
  427. margin:0 0 50px 0;
  428. overflow:hidden;
  429. width:500px;
  430. min-height:33px;
  431. text-align:justify;
  432. box-shadow:0 0px 20px {color:Content Shadows};
  433. padding:20px;
  434. background:{color:Posts BG};
  435. border-radius:2px;}
  436.  
  437. /* ------------------------- POSTS SIDES --------------------------- */
  438.  
  439. #postinfo {
  440. position:absolute;
  441. text-align:left;
  442. width:22px;
  443. margin-top:-53px;
  444. overflow:hidden;
  445. left:968px;}
  446. #postfact {
  447. margin-left:-9px;
  448. -webkit-transition: all 0.25s linear;
  449. -moz-transition: all 0.25s linear;
  450. transition: all 0.25s linear;}
  451. #postfact:hover {
  452. margin-left:0px;}
  453.  
  454. /* ------------------------------ POST TYPES ------------------------------ */
  455.  
  456.  
  457. /* text post */
  458. blockquote {
  459. padding:0px;
  460. padding-left:6px;
  461. margin:-3px 0 -1px 6px;
  462. border-left:3px solid {color:posts blockquote};}
  463. hr {display: block;
  464. margin-top: 0.5em;
  465. margin-bottom: 0.5em;
  466. margin-left: auto;
  467. margin-right: auto;
  468. border-style: solid;
  469. border-width: 1px;
  470. border-color: {color:posts blockquote};}
  471.  
  472. /* bullet lists */
  473. ul {margin-left:-20px;
  474. list-style-type:circle;}
  475. ol {margin-left:-20px;
  476. list-style-type:decimal;}
  477. li {margin-bottom:3px;}
  478.  
  479. /* text-images */
  480. .posts img {
  481. max-width:100%;
  482. {block:IfFadePhotos}opacity:0.85;{/block:IfFadePhotos}
  483. -webkit-transition-duration: 0.2s;
  484. -moz-transition-duration:0.2s;
  485. -o-transition-duration:0.2s;
  486. transition-duration:0.2s;}
  487. .posts:hover img {opacity:1;}
  488. /* the credit below images that are from other people */
  489. .tmblr-full {margin:0;}
  490. .tmblr-attribution {
  491. opacity:.8;
  492. margin-top:0px;
  493. font-family:Calibri;
  494. font-size:8px; line-height:8px;
  495. text-transform:uppercase;
  496. letter-spacing:1px;}
  497. .tmblr-attribution::before {content: "└";}
  498. .tmblr-attribution::after {content: " >";}
  499. img a{border:none; max-width:100%;}
  500.  
  501. /* link posts */
  502. .link-posts a {
  503. background: {color:Posts Links};
  504. display:inline-block;
  505. width: 480px;
  506. border-radius:3px;
  507. padding:10px;
  508. color:{color:Posts BG};}
  509. .link-posts a:hover {
  510. background: {color:Posts Links Hover}}
  511.  
  512. /* ask posts */
  513. .ask-posts {
  514. min-height:64px;
  515. padding: 10px;
  516. background: {color:ask bg};
  517. border-radius:3px;}
  518. .ask-posts img {
  519. border-radius:2px;
  520. max-width:64px;}
  521. .ask-posts .question {
  522. margin-top:-64px; margin-left:74px;
  523. width:406px;}
  524. .ask-posts h2 {text-align:left; margin:0px 0px 5px 0px;}
  525.  
  526. /* quote posts */
  527. .quote-posts {
  528. border-top:3px solid {color:Posts Blockquote};
  529. border-bottom:3px solid {color:Posts Blockquote};
  530. margin:0px 0px 5px 0px;
  531. padding:10px;
  532. text-align:center}
  533. .fa-quote-left {float:left; color:{color:Posts Blockquote}}
  534. .fa-quote-right {float:right; color:{color:Posts Blockquote}}
  535.  
  536. /* chat posts */
  537. ul.chat, .chat ol, .chat li {
  538. list-style:none;
  539. margin:0px;
  540. padding:4px 0px 4px 2px;}
  541. ul.chat, .chat ol {margin:-2px 0px;}
  542. .chat li {
  543. border-bottom:2px solid {color:Posts Blockquote};}
  544. .chat li:first-of-type {
  545. border-top:2px solid {color:Posts Blockquote};}
  546. .person {
  547. color:{color:Posts Bold};
  548. font-weight:bold}
  549.  
  550. /* photo posts */
  551. .posts .photo-posts {
  552. {block:IfFadePhotos}opacity:0.85;{/block:IfFadePhotos}
  553. {block:IfMonochromePhotos}-webkit-filter: grayscale(100%);{/block:IfMonochromePhotos}
  554. -webkit-transition-duration: 0.5s;
  555. -moz-transition-duration:0.5s;
  556. transition-duration:0.5s;
  557. -o-transition-duration:0.5s;}
  558. .posts:hover .photo-posts {
  559. opacity:1;
  560. -webkit-filter: grayscale(0%);
  561. -webkit-transition-duration: 0.5s;
  562. -moz-transition-duration:0.5s;
  563. transition-duration:0.5s;
  564. -o-transition-duration:0.5s;}
  565. .posts .html_photoset {
  566. {block:IfFadePhotos}opacity:0.7;{/block:IfFadePhotos}
  567. {block:IfMonochromePhotos}-webkit-filter: grayscale(100%);{/block:IfMonochromePhotos}
  568. -webkit-transition-duration: 0.5s;
  569. -moz-transition-duration:0.5s;
  570. transition-duration:0.5s;
  571. -o-transition-duration:0.5s;}
  572. .posts:hover .html_photoset {
  573. opacity:1;
  574. -webkit-filter: grayscale(0%);
  575. -webkit-transition-duration: 0.5s;
  576. -moz-transition-duration:0.5s;
  577. transition-duration:0.5s;
  578. -o-transition-duration:0.5s;}
  579.  
  580. /* video posts */
  581. .caption #youtube_iframe, .caption iframe {
  582. margin:5px 0px 5px 0px;
  583. max-width:100%;}
  584.  
  585. /* audio posts */
  586. /* album image */
  587. #albumart {
  588. position:absolute;
  589. margin-right:10px;
  590. width:100px; height:100px;
  591. background: url('{image:Album Art}');
  592. background-size:cover;
  593. border-radius:1px;}
  594. .posts #albumart {
  595. {block:IfMonochromePhotos}-webkit-filter: grayscale(100%);{/block:IfMonochromePhotos}
  596. {block:IfFadePhotos}opacity:.7;{/block:IfFadePhotos}
  597. -webkit-transition: all 0.2s linear;
  598. -moz-transition: all 0.2s linear;
  599. transition: all 0.2s linear;}
  600. .posts:hover #albumart {
  601. -webkit-filter: grayscale(0%);
  602. opacity:1;}
  603. /* music player */
  604. .posts #audio-player {
  605. margin-left:110px;
  606. max-width:207px;
  607. max-height:27px;
  608. {block:IfMonochromePhotos}background:#808080;{/block:IfMonochromePhotos}
  609. {block:IfNotMonochromePhotos}background:{color:Audio Player};{/block:IfNotMonochromePhotos}
  610. border-radius:1px;
  611. -webkit-transition: all 0.2s linear;
  612. -moz-transition: all 0.2s linear;
  613. transition: all 0.2s linear;}
  614. .posts:hover #audio-player {
  615. background:{color:Audio Player}}
  616. /* audio information */
  617. #audioinfo {
  618. height:66px;
  619. margin:-3px 0px 5px 110px;
  620. text-transform:uppercase;
  621. font-family:Calibri;
  622. font-size:8px;
  623. line-height:13px;
  624. letter-spacing:1px;}
  625.  
  626. /* -------------------------- PERMALINK ----------------------------- */
  627.  
  628. /* permalink post information */
  629. #postending {
  630. background:{color:Post Info BG};
  631. text-align:center;
  632. border-radius:1px;
  633. margin-top:15px;
  634. text-transform:uppercase;
  635. font-family:Calibri;
  636. letter-spacing:1px;
  637. padding:10px;
  638. font-size:8px;
  639. color:{color:Post Info Text};
  640. text-shadow:0 0 0 {color:Post Info Text};}
  641. #postending a {
  642. background:transparent;
  643. color:{color:Post Info Links};
  644. text-shadow:0 0 0 {color:Post Info Links};}
  645. #postending a:hover {
  646. color:{color:Post Info Links Hover};
  647. text-shadow:0 0 0 {color:Post Info Links Hover};}
  648.  
  649. /* permalink position */
  650. #permalink {
  651. background:; /* if you want the post-notes to have a non-transparent bg */
  652. margin:-50px 0px 0px 0px;
  653. width: 500px;
  654. padding: 20px;}
  655.  
  656. /* post notes container */
  657. .notes {
  658. width: 500px;
  659. max-height:600px;
  660. overflow: auto;
  661. line-height:14px;
  662. text-transform:uppercase;
  663. font-family:Calibri;
  664. font-size:8px;
  665. letter-spacing:1px;
  666. text-align:left;
  667. color:{color:Permalink Text};}
  668. .notes a {
  669. box-shadow:none;
  670. font-weight:bold;
  671. text-decoration:none;
  672. color:{color:Permalink Links};}
  673. .notes a:hover {
  674. color:{color:Permalink Links Hover};}
  675. .notes blockquote {
  676. background:{color:posts bg};
  677. display:inline-block;
  678. padding:1px 10px;
  679. margin:3px auto;}
  680.  
  681. /* permalink etc */
  682. .notes img {
  683. display:none;
  684. {block:IfFadePhotos}opacity:0.7;{/block:IfFadePhotos}
  685. {block:IfMonochromePhotos}-webkit-filter: grayscale(100%);{/block:IfMonochromePhotos}
  686. width: 10px;
  687. position: relative;
  688. vertical-align: middle;
  689. padding-right: 5px;
  690. -webkit-transition: all 0.5s linear;
  691. -moz-transition: all 0.5s linear;
  692. transition: all 0.5s linear;}
  693. ol.notes, .notes li {
  694. width: 100%;
  695. text-align:center;
  696. list-style: none;
  697. margin: 0px;
  698. padding-left: 0px}
  699. .notes li:hover img {
  700. {block:IfFadePhotos}opacity:1;{/block:IfFadePhotos}
  701. {block:IfMonochromePhotos}-webkit-filter: grayscale(0%);{/block:IfMonochromePhotos}
  702. -webkit-transition: all 0.5s linear;
  703. -moz-transition: all 0.5s linear;
  704. transition: all 0.5s linear;}
  705.  
  706. /* permalink scrollbar */
  707. #permalink ::-webkit-scrollbar {
  708. height:5px; width:5px;
  709. background: transparent;}
  710. #permalink ::-webkit-scrollbar-thumb:vertical {
  711. background: {color:Permalink Scroll Thumb};
  712. border:none;
  713. border-radius: 1px;}
  714.  
  715. </style>
  716. <body>
  717.  
  718. {block:IfCustomCursor}
  719. <style type="text/css"> body {cursor: url({image:Custom Cursor}), auto;} a, a:hover{cursor:url({image:Custom Cursor Links}), auto;}
  720. </style>
  721. <!-- Custom cursors don't show up on empty spaces, but this fixes that -->
  722. <div style="position:fixed; background:rgba(0,0,0,0); top:0px; left:0px; width:100%; height:100%; z-index: -99999999999999;"></div>{/block:IfCustomCursor}
  723.  
  724. <!------------------------- CREDIT; DON'T REMOVE ---------------------------->
  725.  
  726. <div id="credit">
  727. <a href="http://nyctothemes.tumblr.com/" title="© nyctothemes">
  728. <l class="fa fa-th"></l>
  729. </a>
  730. </div>
  731.  
  732. <!------------------------------ LOW SIDEBAR -------------------------------->
  733.  
  734. <div id="side">
  735. <div id="sideborder"></div>
  736. <div id="axel"><div id="desccontainer">
  737.  
  738. <div id="desc">
  739. {Description}
  740. </div>
  741.  
  742. {block:Pagination}<div id="pagination">
  743. {block:PreviousPage}<a href="{PreviousPage}">◀ prev </a>{/block:PreviousPage}
  744. {CurrentPage}/{TotalPages}
  745. {block:NextPage}<a href="{NextPage}"> next ▶</a>{/block:NextPage}
  746. </div>{/block:Pagination}
  747.  
  748. </div></div>
  749. </div>
  750.  
  751. <!----------------------------- HIGH SIDEBAR -------------------------------->
  752.  
  753. <div id="sidebar">
  754. <div style="margin-top:66px; margin-left:117px;">
  755. <a href="{text:Link 1 URL}" title="{text:Link 1 Title}">
  756. <l class="{text:Link 1 Symbol}"></l></a></div>
  757. <div style="margin-top:30px; margin-left:64px;">
  758. <a href="/ask" title="Ask"><l class="fa fa-envelope"></l></a></div>
  759. <div style="margin-top:-20px; margin-left:118px;">
  760. <a href="/" title="Home"><w><l class="fa fa-home"></l></w></a></div>
  761. <div style="margin-top:-20px; margin-left:171px;">
  762. <a href="/archive" title="Archive"><l class="fa fa-clock-o"></l></a></div>
  763. <div style="margin-top:32px; margin-left:118px;">
  764. <a href="{text:Link 2 URL}" title="{text:Link 2 Title}">
  765. <l class="{text:Link 2 Symbol}"></l></a></div>
  766. </div>
  767.  
  768. <!--------------------------------- POSTS --------------------------------->
  769.  
  770. <div id="entries">
  771. {block:posts}
  772. <div class="posts">
  773.  
  774. <!-- text posts -->
  775. {block:Text}
  776. {block:Title}<h1>{Title}</h1>{/block:Title}
  777. <div class="caption">{Body}</div>
  778. {/block:Text}
  779.  
  780. <!-- link posts -->
  781. {block:Link}
  782. {block:Thumbnail}<center>
  783. <a href="{Thumbnail-HighRes}">
  784. <img src="{Thumbnail}" class="photo-posts" style="margin-bottom:5px; border-radius:3px">
  785. </a>
  786. </center>{/block:Thumbnail}
  787. <div class="link-posts"><h1><a href="{URL}">
  788. {Name}&nbsp;&nbsp;&#8594;</l>
  789. </a></h1></div>
  790. {block:Description}<div class="caption">
  791. <p>{Description}</p>
  792. </div>{/block:Description}
  793. {/block:Link}
  794.  
  795. <!-- ask posts -->
  796. {block:Answer}
  797. <div class="ask-posts">
  798. <img src="{AskerPortraitURL-64}">
  799. <div class="question">
  800. <h2>{Asker} {text:Ask Verb}:</h2> {Question}
  801. </div></div><br>
  802. <div id="caption">{Answer}</div>
  803. {/block:Answer}
  804.  
  805. <!-- quote posts -->
  806. {block:Quote}
  807. <h2 class="quote-posts">
  808. <l class="fa fa-quote-left"></l>
  809. <l class="fa fa-quote-right"></l>
  810. {Quote}</h2>
  811. <div style="text-align:right; margin-right:20px">
  812. {block:Source}<b>- {Source}</b>{/block:Source}
  813. </div>
  814. {/block:Quote}
  815.  
  816. <!-- chat posts -->
  817. {block:Chat}
  818. {block:Title}<h1>{Title}</h1>{/block:Title}
  819. <ul class="chat">{block:Lines}
  820. <li class="user_{UserNumber}">{block:Label}<span class="person">{Label}</span>{/block:Label} {Line}</li>
  821. {/block:Lines}</ul>
  822. {/block:Chat}
  823.  
  824. <!-- photo posts -->
  825. {block:Photo}
  826. <center>
  827. {block:HighRes}<a href="{PhotoURL-HighRes}">{/block:HighRes}<img src="{PhotoURL-500}" class="photo-posts"/>{block:HighRes}</a>{/block:HighRes}
  828. </center>
  829. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}{/block:Photo}
  830.  
  831. {block:Photoset}
  832. <center>
  833. {Photoset-500}
  834. </center>
  835. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}{/block:Photoset}
  836.  
  837. <!-- video post -->
  838. {block:Video}
  839. {Video-500}
  840. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  841. {/block:Video}
  842.  
  843. <!-- audio post -->
  844. {block:Audio}
  845. <!--image-->
  846. {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}<div id="albumart" {block:AlbumArt}style="background:none"{/block:AlbumArt}>
  847. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  848. </div>{block:IndexPage}</a>{/block:IndexPage}
  849. <!--player-->
  850. <div id="audio-player"><div style="opacity:0.66">
  851. {block:ifDarkAudioPlayer}{AudioPlayerBlack}{/block:ifDarkAudioPlayer}
  852. {block:ifNotDarkAudioPlayer}{AudioPlayerWhite}{/block:ifNotDarkAudioPlayer}
  853. </div></div>
  854. </br>
  855. <!--info-->
  856. <div id="audioinfo">
  857. {block:TrackName}<b>Track:</b> {TrackName}</br>{/block:TrackName}
  858. {block:Artist}<b>Artist:</b> {Artist}</br>{/block:Artist}
  859. {block:Album}<b>Album:</b> {Album}</br>{/block:Album}
  860. {block:PlayCount}<b>Plays:</b> {FormattedPlayCount}{/block:PlayCount}
  861. </div>
  862. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:Audio}
  863.  
  864. <!----------------------------- POSTS SIDES -------------------------------->
  865. {block:IfSimplePostInfo}{block:IndexPage}
  866. <div id="postinfo">
  867.  
  868. <!-- date posted -->
  869. {block:Date}<div id="postfact">
  870. <a href="{Permalink}" title="{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}"><img src="https://31.media.tumblr.com/0fa74d3089a0eff0401d2b370638a7de/tumblr_inline_nfcnqsUgEK1rg1lxe.png"></a></div>
  871. {/block:Date}
  872.  
  873. <!-- notes counter -->
  874. {block:NoteCount}<div id="postfact">
  875. <a href="{Permalink}" title="{NoteCountWithLabel}"><img src="https://31.media.tumblr.com/0fa74d3089a0eff0401d2b370638a7de/tumblr_inline_nfcnqsUgEK1rg1lxe.png"></a></div>
  876. {/block:NoteCount}
  877.  
  878. <!-- original poster -->
  879. {block:ContentSource}<div id="postfact">
  880. <a href="{SourceURL}" title="Source"><img src="https://31.media.tumblr.com/0fa74d3089a0eff0401d2b370638a7de/tumblr_inline_nfcnqsUgEK1rg1lxe.png"></a></div>
  881. {/block:ContentSource}
  882.  
  883. <!-- reblogged from -->
  884. {block:RebloggedFrom}<div id="postfact">
  885. <a href="{ReblogParentURL}" title="Via"><img src="https://31.media.tumblr.com/0fa74d3089a0eff0401d2b370638a7de/tumblr_inline_nfcnqsUgEK1rg1lxe.png"></a></div>
  886. {/block:RebloggedFrom}
  887.  
  888. <!-- tags -->
  889. {block:HasTags}<div id="postfact">
  890. <a href="{Permalink}" title="# {block:Tags}{Tag}, {/block:Tags}"><img src="https://31.media.tumblr.com/0fa74d3089a0eff0401d2b370638a7de/tumblr_inline_nfcnqsUgEK1rg1lxe.png"></a></div>
  891. {/block:HasTags}
  892.  
  893. </div>
  894. {/block:IndexPage}{/block:IfSimplePostInfo}
  895.  
  896. <!------------------------------ POST ENDING ------------------------------->
  897.  
  898. <!-- index -->
  899. {block:IfNotSimplePostInfo}{block:IndexPage}
  900. {block:Date}<div id="postending">
  901.  
  902. <!-- date posted -->
  903. <a href="{Permalink}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a>
  904. <!-- notes counter -->
  905. {block:NoteCount}
  906. || {NoteCountWithLabel}
  907. {/block:NoteCount}
  908. <!-- reblogged from -->
  909. {block:RebloggedFrom}<br>
  910. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  911. {/block:RebloggedFrom}
  912. <!-- original poster -->
  913. {block:ContentSource}
  914. || Source: <a href="{SourceURL}">{SourceTitle}</a>
  915. {/block:ContentSource}
  916. <!-- tags -->
  917. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  918. Tags: {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags}
  919. </div>{/block:HasTags}
  920.  
  921. </div>{/block:Date}
  922. {/block:IndexPage}{/block:IfNotSimplePostInfo}
  923.  
  924. <!-- permalink -->
  925. {block:PermalinkPage}<div id="postending">
  926.  
  927. <!-- date posted -->
  928. <a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a>
  929. <!-- notes counter -->
  930. {block:NoteCount}
  931. || {NoteCountWithLabel}
  932. {/block:NoteCount}
  933. <!-- reblogged from -->
  934. {block:RebloggedFrom}<br>
  935. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  936. {/block:RebloggedFrom}
  937. <!-- original poster -->
  938. {block:ContentSource}
  939. || Source: <a href="{SourceURL}">{SourceTitle}</a>
  940. {/block:ContentSource}
  941. <!-- tags -->
  942. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  943. Tags: {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags}
  944. </div>{/block:HasTags}
  945.  
  946. </div>{/block:PermalinkPage}
  947.  
  948. </div> <!-- ending div tag for "posts" -->
  949.  
  950. {/block:Posts}
  951.  
  952. <!------------------------------ PERMALINK ------------------------------->
  953.  
  954. {block:PostNotes}
  955. <div id="permalink">{PostNotes}</div>
  956. {/block:PostNotes}
  957.  
  958. </div> <!-- ending div tag for "entries" -->
  959.  
  960. </body>
  961. </html>
Advertisement
Add Comment
Please, Sign In to add comment