Advertisement
octomoosey

Croatoan

Oct 5th, 2014
3,642
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.64 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!-- octomoosey @ tumblr -->
  4.  
  5. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6. <head><title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10.  
  11.  
  12. <meta name="color:link" content="#a50000" />
  13. <meta name="color:hover" content="#1b4456" />
  14. <meta name="color:background" content="000000" />
  15. <meta name="color:headerbg" content="000000" />
  16. <meta name="color:headertxt" content="#ffffff" />
  17. <meta name="color:post" content="#ffffff" />
  18. <meta name="color:text" content="#000000" />
  19. <meta name="color:line" content="#f0f0f0" />
  20. <meta name="color:bold" content="#a50000" />
  21. <meta name="color:italic" content="#a50000" />
  22. <meta name="color:blockquote" content="#000000" />
  23. <meta name="color:sidebg" content="#ffffff" />
  24. <meta name="color:sidebartxt" content="#000000" />
  25.  
  26. <meta name="image:background" content="" />
  27. <meta name="image:headerbg" content="" />
  28. <meta name="image:sidebarbg" content="" />
  29. <meta name="image:header" content="" />
  30.  
  31. <meta name="if:greyscale" content="1"/>
  32. <meta name="font:body font" content="Gibson">
  33. <meta name="text:text size" content="11px" />
  34.  
  35. <meta name="text:link 1" content="link 1"/>
  36. <meta name="text:link 1 url" content="/"/>
  37. <meta name="text:link 2" content="link 2"/>
  38. <meta name="text:link 2 url" content="/"/>
  39. <meta name="text:link 3" content="link 3"/>
  40. <meta name="text:link 3 url" content="/"/>
  41. <meta name="text:link 4" content="link 4"/>
  42. <meta name="text:link 4 url" content="/"/>
  43. <meta name="text:link 5" content="link 5"/>
  44. <meta name="text:link 5 url" content="/"/>
  45. <meta name="text:link 6" content="link 6"/>
  46. <meta name="text:link 6 url" content="/"/>
  47. <meta name="text:link 7" content="link 7"/>
  48. <meta name="text:link 7 url" content="/"/>
  49. <meta name="text:link 8" content="link 8"/>
  50. <meta name="text:link 8 url" content="/"/>
  51.  
  52. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  53.  
  54. <script type="text/javascript" src="https://static.tumblr.com/86jccts/wpsmuemne/hoverqtip.js"></script>
  55.  
  56. </head>
  57. <style>
  58. body {
  59. background-color:{color:background};
  60. background-image: url('{image:background}');
  61. background-position: right bottom;
  62. background-repeat: no-repeat;
  63. background-attachment: fixed;
  64. line-height:100%;
  65. color:{color:text};
  66. font-family:{font:body font};
  67. font-size: {text:text size};}
  68.  
  69. a {
  70. text-decoration:none;
  71. outline:none;
  72. -moz-outline-style:none;
  73. color:{color:link};
  74. -webkit-transition: all 0.7s ease;
  75. -moz-transition: all 0.7s ease;
  76. -o-transition: all 0.7s ease;}
  77.  
  78. a:hover {
  79. color:{color:hover};
  80. -webkit-transition: all 0.7s ease;
  81. -moz-transition: all 0.7s ease;
  82. -o-transition: all 0.7s ease;}
  83.  
  84. blockquote {
  85. padding:2px 7px;
  86. margin:3px 0 3px 8px;
  87. border-left:2px solid {color:line};
  88. background-color:{color:blockquote};}
  89.  
  90. blockquote img {
  91. max-width:100%;}
  92.  
  93. b, strong {
  94. color:{color:bold};}
  95.  
  96. i, em {
  97. color:{color:italic};}
  98.  
  99. small,sup,sub {
  100. font-size:{text:Text Size}}
  101.  
  102. big {
  103. font-size:12px;}
  104.  
  105. pre{
  106. font-size:10px;
  107. padding:20px;
  108. white-space: pre-wrap; /* css-3 */
  109. white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
  110. white-space: -pre-wrap; /* Opera 4-6 */
  111. white-space: -o-pre-wrap; /* Opera 7 */
  112. word-wrap: break-word; /* Internet Explorer 5.5+ */}
  113.  
  114. {block:IfGreyscale}
  115.  
  116. img {
  117. -webkit-filter:grayscale(100%);
  118. -webkit-transition: all 0.9s ease-in-out;
  119. -moz-transition: all 0.9s ease-in-out;
  120. -o-transition: all 0.9s ease-in-out;
  121. -ms-transition: all 0.9s ease-in-out;
  122. transition: all 0.9s ease-in-out;}
  123.  
  124. img:hover {
  125. -webkit-filter:none;}
  126.  
  127. .html_photoset {
  128. -webkit-filter: grayscale(100%);
  129. -webkit-transition: all 0.9s ease-in-out;
  130. -moz-transition: all 0.9s ease-in-out;
  131. -o-transition: all 0.9s ease-in-out;
  132. -ms-transition: all 0.9s ease-in-out;
  133. transition: all 0.9s ease-in-out;}
  134.  
  135. .html_photoset:hover {
  136. -webkit-filter: none;}
  137.  
  138. {/block:IfGreyscale}
  139.  
  140. img {
  141. max-width:100%;}
  142.  
  143. #content {
  144. margin-top:450px;
  145. margin-left:auto;
  146. margin-right:auto;
  147. width:500px;}
  148.  
  149. #posts {
  150. width:500px;
  151. padding:10px;
  152. border:1px solid #f0f0f0;
  153. background-color:{color:post};
  154. margin-top:20px;
  155. margin-bottom:20px;}
  156.  
  157. h1 {
  158. font-size:60px;
  159. font-weight:700;}
  160.  
  161. #ask {
  162. margin-top:-55px;
  163. margin-left:80px;}
  164.  
  165. #askimg img {
  166. height:64px;
  167. width:64px;
  168. border-radius:50%;
  169. -moz-box-shadow: 3px 3px 5px #888;
  170. -webkit-box-shadow: 3px 3px 5px #888;
  171. box-shadow: 3px 3px 5px #888;}
  172.  
  173. #ask2 {
  174. margin-top:50px;}
  175.  
  176. #note {
  177. margin-left:-25px;
  178. margin-top:-8px;}
  179.  
  180. #note a {
  181. font-style:normal;
  182. text-decoration:underline;}
  183.  
  184. #note a:hover {
  185. font-style:none;
  186. text-decoration:underline;
  187. background:#ff0;}
  188.  
  189. #note img {
  190. display:none;}
  191.  
  192. #titles {
  193. font-family:consolas;
  194. font-size:16px;
  195. line-height:20px;
  196. text-align:right;}
  197.  
  198. #titles a {
  199. font-style:normal;
  200. text-decoration:underline;}
  201.  
  202. #titles a:hover {
  203. font-style:none;
  204. text-decoration:underline;
  205. background:#ff0;}
  206.  
  207. .info {
  208. padding-top:5px;
  209. border-top:3px solid {color:line};
  210. font-size:14px;
  211. text-align:center;
  212. margin-top:30px;
  213. line-height:15px;}
  214.  
  215. .tag {
  216. margin-top:3px;
  217. text-align:center;
  218. font-size:9px;
  219. font-style:normal;
  220. line-height:18px;}
  221.  
  222. .tag a {
  223. padding:5px;}
  224.  
  225. .note {
  226. text-transform:uppercase;
  227. width:470px;
  228. font-style:normal;
  229. letter-spacing:0px;
  230. font-size: 10px;
  231. text-align:left;
  232. line-height:100%;
  233. margin-left:-20px;}
  234.  
  235. .note li {
  236. list-style-type:none;
  237. border-bottom:1px solid {color:line};
  238. padding:10px 25px 10px 25px;
  239. text-align:left;
  240. -moz-transition-duration:0.5s;
  241. -webkit-transition-duration:0.5s;
  242. -o-transition-duration:0.5s;}
  243.  
  244. .note img.avatar {
  245. margin-right: 10px;
  246. width: 16px;
  247. height: 16px;}
  248.  
  249. .header{
  250. position: fixed;
  251. top:0px;
  252. left:-10px;
  253. width: 105%;
  254. text-align: center;
  255. font-size: 12px;
  256. line-height: 16px;
  257. height: 400px;
  258. background:{color:headerbg};
  259. color: {color:headertxt};
  260. font-family: 'PT Sans', sans-serif;
  261. background-image: url('{image:headerbg}');
  262. background-position: center top;
  263. background-repeat: no-repeat;
  264. background-attachment: fixed;
  265.  
  266. // set animation
  267. -webkit-transition: all 0.4s ease;
  268. transition: all 0.4s ease;}
  269.  
  270. .header.sticky {
  271. left:10px;
  272. font-size: 24px;
  273. line-height: 24px;
  274. height: 90px;
  275. text-align: left;
  276. padding-left: 20px;}
  277.  
  278. .header.description {
  279. height:100%;
  280. width:280px;
  281. color:{color:sidebartxt};
  282. background:{color:sidebg};
  283. font-size: 12px;
  284. line-height: 18px;
  285. background-image: url('{image:sidebarbg}');
  286. background-position: bottom left;
  287. background-repeat: no-repeat;
  288. background-attachment: fixed;}
  289.  
  290. #links a {
  291. display:inline-block;
  292. padding-right:10px;
  293. margin-bottom:7px;
  294. color:{color:links};
  295. letter-spacing:2px;}
  296.  
  297. #links a:hover {
  298. color: {color:hover};}
  299.  
  300. div#qTip {
  301. padding: 4px;
  302. display: none;
  303. font-style:none;
  304. text-align: center;
  305. position: absolute;
  306. font-size:11px;
  307. line-height:10px;
  308. font-family:calibri;
  309. z-index: 1000;
  310. background: black;
  311. z-index: 9999999;
  312. border:1px solid #ccc;
  313. color: #999;
  314. letter-spacing: 1px;}
  315.  
  316. </style>
  317.  
  318. <body>
  319.  
  320. <div class="header"><h1>{title}</h1>
  321.  
  322. <div class="description">{description}<p>
  323. <div id="links">
  324. <a href="/">home</a>
  325. <a href="/ask">ask</a>
  326. {block:Ifshowsubmit}<a href="/submit">submit</a>{/block:Ifshowsubmit}
  327. {block:iflink1}<a href="{text:link 1 url}">{text:link 1}</a>{/block:iflink1}
  328. {block:iflink2}<a href="{text:link 2 url}">{text:link 2}</a>{/block:iflink2}
  329. {block:iflink3}<a href="{text:link 3 url}">{text:link 3}</a>{/block:iflink3}
  330. {block:iflink4}<a href="{text:link 4 url}">{text:link 4}</a>{/block:iflink4}
  331. {block:iflink5}<a href="{text:link 5 url}">{text:link 5}</a>{/block:iflink5}
  332. {block:iflink6}<a href="{text:link 6 url}">{text:link 6}</a>{/block:iflink6}
  333. {block:iflink7}<a href="{text:link 7 url}">{text:link 7}</a>{/block:iflink7}
  334. {block:iflink8}<a href="{text:link 8 url}">{text:link 8}</a>{/block:iflink8}
  335. <a href="https://octomoosey.tumblr.com/">©</a>
  336. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">back</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}</div>{/block:Pagination}</div>
  337.  
  338. </div>
  339. </div>
  340.  
  341. <div id="content">
  342.  
  343. {block:Posts}
  344. <div id="posts">
  345.  
  346. {block:Text}
  347. {block:Title}<div id="titles">{Title}</div>{/block:Title}
  348. {Body}
  349. {/block:Text}
  350.  
  351. {block:Quote}
  352. <div id="titles">{Quote}</div>
  353. <br />— {Source}
  354. {/block:Quote}
  355.  
  356. {block:Link}
  357. <div id="titles"><a href="{URL}">{Name}</a></div>
  358. {block:Description}{Description}{/block:Description}
  359. {/block:Link}
  360.  
  361. {block:Photo}
  362. <center><img src="{PhotoURL-500}"/></center>
  363. {block:Caption}{Caption}{/block:Caption}
  364. {/block:Photo}
  365.  
  366. {block:Photoset}
  367. <center>{Photoset-500}</center>
  368. {block:Caption}{Caption}{/block:Caption}
  369. {/block:Photoset}
  370.  
  371. {block:Chat}
  372. {block:Title}<div id="titles">{Title}</div>{/block:Title}
  373. {block:Lines}
  374. {block:Label}<b>{Label}</b>{/block:Label}
  375. {Line}<br />
  376. {/block:Lines}
  377. {/block:Chat}
  378.  
  379. {block:Video}
  380. {Video-500}
  381. {block:Caption}{Caption}{/block:Caption}
  382. {/block:Video}
  383.  
  384. {block:Answer}
  385. <div id="askimg"><img src="{AskerPortraitURL-64}"></div>
  386. <div id="ask">
  387. <div style="font-size:14px; font-weight:lighter; font-style:italic;">{Asker}</div>{Question}</div>
  388. <div id="ask2">{Answer}<div id="signature">{text:signature}</div></div>{/block:Answer}
  389.  
  390. {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="60px" height="60px" align="left" style="margin-right:10px" />{/block:AlbumArt}<span class="audio">{AudioPlayerWhite}</left></span>
  391. {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
  392. {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  393. {/block:ExternalAudio}<br><br>
  394. {block:Caption}{Caption}{/block:Caption}{/block:Audio}<br>
  395.  
  396. <div class="info">
  397. {block:date}<a href="{Permalink}"> posted;
  398. {block:Date}{TimeAgo}</a>{/block:Date}
  399. {block:NoteCount}
  400. with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount} <a href="{ReblogURL}"> - reblog</a><br>
  401.  
  402. {block:RebloggedFrom}
  403. via; <a href="{ReblogParentURL}">{ReblogParentName}</a>
  404. source; <a href="{ReblogRootURL}">{ReblogRootName}</a>
  405. {/block:RebloggedFrom}
  406. </div>
  407.  
  408. <div class="tag">{block:HasTags}{block:Tags}♦ <a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div>
  409. </div>
  410.  
  411. {block:PostNotes}
  412. <div class="note">
  413. {PostNotes}
  414. </div>
  415. {/block:PostNotes}
  416.  
  417. {/block:Posts}
  418.  
  419. </div>
  420.  
  421. {block:ContentSource}
  422. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  423. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  424. {/block:SourceLogo}
  425. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  426. {/block:ContentSource}
  427.  
  428. <script>
  429.  
  430.  
  431. $(window).scroll(function() {
  432. if ($(this).scrollTop() > 1){
  433. $('.header').addClass("sticky description");
  434. }
  435. else{
  436. $('.header').removeClass("sticky description");
  437. }
  438. });
  439. </script>
  440.  
  441. </body>
  442. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement