Advertisement
noziam

THEME 23: SHARD

Aug 4th, 2014
1,064
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 10.06 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4.  
  5.  
  6. <!--
  7.                                        
  8.        .                                 .o8       oooo              
  9.      .o8                                "888       `888              
  10.    .o888oo oooo  oooo  ooo. .oo.  .oo.   888oooo.   888  oooo d8b    
  11.      888   `888  `888  `888P"Y88bP"Y88b  d88' `88b  888  `888""8P    
  12.      888    888   888f   888   888   888  888   888  888   888        
  13.      888 .  888   888   888   888   888  888   888  888   888    .o.
  14.      "888"  `V88V"V8P' o888o o888o o888o `Y8bod8P' o888o d888b   Y8P
  15.  
  16. -->
  17.  
  18.  
  19. <!--
  20.  
  21. THEME 23 SHARD BY JAE @ HE1975
  22.  
  23. IF YOU HAVE ANY QUESTIONS PLEASEPLEASEPLEASE SEND ME AN ASK :)
  24.  
  25. THANK YOU.
  26. ENJOY!
  27.  
  28.  
  29. -->
  30.  
  31.  
  32.  
  33.  
  34. <title>{Title}</title>
  35.  
  36. <link rel="shortcut icon" href="{image:Favicon}">
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  38. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  39.  
  40. <!--Default Variables-->
  41.  
  42. <meta name="color:Background" content="#ffffff"/>
  43. <meta name="color:Post Background" content="#ffffff"/>
  44. <meta name="color:Accent" content="#59b4ff"/>
  45. <meta name="color:Text" content="#000000"/>
  46. <meta name="color:Link" content="#000000"/>
  47.  
  48.  
  49. <meta name="image:background" content=""/>
  50. <meta name="image:favicon" content=""/>
  51.  
  52. <meta name="text:topbar title" content="" />
  53. <meta name="text:topbar hover" content="" />
  54. <meta name="text:desc1" content="" />
  55. <meta name="text:desc2" content="" />
  56.  
  57.  
  58. <meta name="text:Link 1 URL" content="" />
  59. <meta name="text:Link 1" content="" />
  60. <meta name="text:Link 2 URL" content="" />
  61. <meta name="text:Link 2" content="" />
  62. <meta name="text:Link 3 URL" content="" />
  63. <meta name="text:Link 3" content="" />
  64. <meta name="text:Link 4 URL" content="" />
  65. <meta name="text:Link 4" content="" />
  66. <meta name="text:Link 5 URL" content="" />
  67. <meta name="text:Link 5" content="" />
  68. <meta name="text:Link 6 URL" content="" />
  69. <meta name="text:Link 6" content="" />
  70.  
  71.  
  72.  
  73. <!-- jquery for tooltips-->
  74.  
  75.  
  76. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  77.  
  78. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  79.  
  80. <script>
  81.  
  82. (function($){
  83.  
  84. $(document).ready(function(){
  85.  
  86. $("a[title]").style_my_tooltips({
  87.  
  88. tip_follows_cursor:true,
  89.  
  90. tip_delay_time:30,
  91.  
  92. tip_fade_speed:300,
  93.  
  94. attribute:"title"
  95.  
  96. });
  97.  
  98. });
  99.  
  100. })(jQuery);
  101.  
  102. </script>
  103.  
  104.  
  105.  
  106. <!--CSS customization here. -->
  107.  
  108. <style type="text/css">
  109.  
  110. ::selection {
  111. color:#fff;
  112. background:{color:accent};
  113. }
  114.  
  115. ::-moz-selection {
  116. color:#fff;
  117. background:{color:accent};
  118. }
  119.  
  120.  
  121. ::-webkit-scrollbar {
  122. height: 0px;
  123. width: 4px;
  124. background:#fff;
  125. }
  126.  
  127. ::-webkit-scrollbar-thumb {
  128. background:{color:accent};
  129. border-left:1px solid #fff;
  130. }
  131.  
  132. ::-webkit-scrollbar-thumb:active {
  133. border-left:0px solid #fff;
  134. }
  135.  
  136.  
  137.  
  138. #s-m-t-tooltip{
  139.     position:absolute;
  140.     margin-top: 15px;
  141.     z-index:9999;
  142.     padding:2px;
  143.     border:1px solid {color:accent};
  144.     background:{color:background};
  145.    
  146. }
  147.  
  148.  
  149.  
  150. /*basics*/
  151. blockquote {padding:5px 0 5px 30px;
  152. border-left:1px solid {color:text};
  153. margin-left:30px;
  154.  
  155. }
  156.  
  157.  *, body, a {cursor: url(https://31.media.tumblr.com/91037c9d8802fdca6dea299654b6dc17/tumblr_inline_mzpkcniZkt1r6h6z5.png), auto;}
  158. a:hover {cursor: url(https://31.media.tumblr.com/673fab4e45d2badc5533613afdbbf39d/tumblr_inline_mzpkcfVDdS1r6h6z5.png), auto;}
  159.  
  160. /*this theme was inspired by the skyscraper in london*/
  161.  
  162. body {
  163.    
  164. background:{color:background};
  165. color:{color:text};
  166. font-family:helvetica;
  167. font-size:10px;
  168. text-align:justify;
  169. margin:0;
  170. line-height:16px;
  171. }
  172.  
  173.  
  174.  
  175. a {
  176. color:{color:link};
  177. text-decoration:none;
  178.  
  179. }
  180.  
  181. a:hover {
  182. text-decoration:underline;
  183. font-weight:normal;
  184.  
  185. }
  186.  
  187.  
  188. img{opacity:1;
  189. border:none;
  190. text-decoration:none}
  191.  
  192.  
  193. small {
  194. font-size:9px;}
  195.  
  196. big {
  197. font-size:12px;}
  198.  
  199.  
  200. #title {font-size:12px;
  201. line-height:18px;
  202. font-weight:bold;
  203. margin-bottom:10px;
  204. text-transform:lowercase;
  205. text-align:center;}
  206.  
  207.  
  208.  
  209.  
  210. /*pagination*/
  211. #pagination {
  212. margin:50px 0;
  213. text-transform:lowercase;
  214. font-weight:bold;
  215. margin-bottom:50px;
  216. }
  217. #pagination a {
  218. padding:0 15px;
  219. }
  220.  
  221. /*container*/
  222. #oli {
  223. left:200px;
  224. margin-left:0px;
  225. position:absolute;
  226. background-color:{color:background};
  227.  
  228.  
  229. }
  230.  
  231. /*background*/
  232. {width:100%; height:100%;
  233. background: url('{image:background}')top fixed repeat-x; position:fixed; margin-top:-50px; } body { background: {color:background} url('{image:background}') no-repeat center fixed ; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; ; margin: 0; padding: 0; }
  234.  
  235. /*posts*/
  236.  
  237. #entries {
  238. left:37%;
  239. top:170px;
  240. border:1px solid {color:accent};
  241. width:280px;
  242. height:60%;
  243. position:fixed;
  244. overflow:scroll;
  245. background-color:{color:post background};
  246. padding:20px 0px 0px 20px;
  247.  
  248. }
  249.  
  250.  
  251.  
  252.  
  253.  
  254. #posts {
  255. width:250px;
  256. border:1px solid {color:accent};
  257. padding:5px;
  258. {block:IndexPage}
  259. margin-bottom:35px;
  260. {/block:IndexPage}
  261. {block:PermalinkPage}
  262. margin-bottom:50px;
  263. {/block:PermalinkPage}
  264.  
  265. }
  266. #posts img {
  267. max-width:250px;
  268. }
  269.  
  270. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  271. .caption {width:100%;
  272. margin-top:10px;
  273.  
  274. }
  275.  
  276. /*quote*/
  277.  
  278. #titlequote{text-align:left;
  279. font-size:14px;
  280. line-height:18px;
  281. font-weight:bold;
  282. }
  283. #source {
  284. margin-top:15px;
  285. margin-left:15px;}
  286.  
  287. /*audio*/
  288.  
  289. .player {
  290. width:25px;
  291. height:25px;
  292. overflow:hidden;
  293. position:absolute;
  294. background:white;}
  295.  
  296. .audioinfo {
  297. margin-left:50px;
  298. }
  299.  
  300.  
  301. /*asks*/
  302. .q {margin-bottom:10px;
  303. }
  304. .as {
  305. font-weight:bold;}
  306.  
  307. .a {
  308. margin-top:10px;
  309. }
  310.  
  311.  
  312. /*chat*/
  313.  
  314. .chat ol {
  315. padding:0;
  316. list-style:none;
  317. }
  318. .line {padding:5px 0;}
  319.  
  320. .label {font-weight:bold;
  321. }
  322.  
  323.  
  324.  
  325. /*permalink and notes*/
  326.  
  327. #permalink {
  328. margin-top:15px;
  329. font-size:9px;
  330. text-transform:lowercase;
  331. }
  332. #permalink a {margin-right:10px;
  333. }
  334.  
  335.  
  336. .tags {
  337. word-break:break-all;
  338. font-size:9px;
  339. opacity:0;
  340. text-align:center;
  341. -webkit-transition: opacity 0.5s linear;
  342. }
  343.  
  344. #posts:hover .tags{
  345.     opacity:1;
  346. }
  347.  
  348. .pagenotes {
  349. {block:IndexPage}
  350. display: none!important;
  351. {/block:IndexPage}
  352. width:250px;
  353. text-align:left;
  354.  
  355. }
  356. .pagenotes img {
  357. display:none!important;}
  358. .pagenotes li {
  359. list-style-type:none;
  360. padding:5px 0px;
  361. text-align:left;
  362. margin:0 0 0 -40px;
  363. }
  364.  
  365.  
  366. {CustomCSS}
  367.  
  368.  
  369. </style>
  370.  
  371.  
  372.  
  373. </head>
  374.  
  375. <body>
  376.  
  377. <div id="oli">
  378.  
  379.    
  380. <div style="position:fixed;line-height:120%;top:30px;left:37%; z-index:999; margin-bottom:0px; background:{color:post background}; width:80px; border:1px solid {color:accent}; padding:5px 10px 10px 10px; width:120px;">
  381.  
  382. <center><big><a href="/" title="{text:topbar hover}">{text:topbar title}</a></big></center>
  383. <br>
  384.  
  385. <center>{text:Desc1}<br><a href="{text:Link 1 URL}">.{text:Link 1}</a>
  386. <a href="{text:Link 2 URL}" >.{text:Link 2}</a>
  387. <a href="{text:Link 3 URL}">.{text:Link 3}</a> </center>
  388.  
  389. <div style="position:fixed;line-height:120%;top:30px;left:50%; z-index:999; margin-bottom:0px; background:{color:post background}; width:80px; border:1px solid {color:accent}; padding:5px 10px 10px 10px; width:120px;">
  390.  
  391.  
  392.  
  393.  
  394. <center><big><a href="/" title="{text:topbar hover}">{text:topbar title}</a></big></center>
  395. <br>
  396.  
  397. <center>{text:Desc2}<br><a href="{text:Link 4 URL}">.{text:Link 4}</a>
  398. <a href="{text:Link 5 URL}" >.{text:Link 5}</a>
  399. <a href="{text:Link 6 URL}">.{text:Link 6}</a> </center>
  400.  
  401.  
  402. <div style="position:fixed;line-height:120%;top:125px;left:37%; z-index:999; margin-bottom:0px; background:{color:post background}; width:80px; border:1px solid {color:accent}; padding:10px; width:280px;">
  403.  
  404. {description}
  405.  
  406. <center>
  407.  
  408. </center>
  409.  
  410. <div id="entries">
  411.  
  412. {block:Posts}
  413. <div id="posts">
  414.  
  415.  
  416. {block:Quote}
  417.  
  418.  
  419. <div id="titlequote">“{Quote}”</div>
  420. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  421. {/block:Quote}
  422.  
  423.  
  424.  
  425. {block:Text}
  426.  
  427. {block:Title}
  428. <div id="title">{Title}</div>{/block:Title}
  429. {Body}
  430. {/block:Text}
  431.  
  432. {block:Link}
  433. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  434. {/block:Link}
  435.  
  436. {block:Chat}
  437. {block:Title}
  438. <h1>{Title}</h1>
  439. {/block:Title}
  440. <div class="chat">
  441. <ol>{block:Lines}
  442. <li class="line {Alt}">
  443. {block:Label}
  444. <span class="label">
  445. {Label}</span>
  446. {/block:Label}{Line}</li>
  447. {/block:Lines}
  448. </ol></div>
  449. {/block:Chat}
  450.  
  451. {block:Photo}
  452. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
  453. {/block:Photo}
  454.  
  455. {block:Photoset}
  456. {Photoset-250}
  457. {/block:Photoset}
  458.  
  459. {block:Video}
  460. {Video-250}
  461. {/block:Video}
  462.  
  463. {block:Audio}
  464. <div class="player">{AudioPlayerWhite}</div>
  465. <div class="audioinfo">
  466. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}
  467. </div>
  468. {/block:Audio}
  469.  
  470. {block:Answer}
  471. <div class="q">
  472. <div class="as">{Asker} said: {Question}</div></div>
  473. <div class="a">{Answer}</div>
  474. {/block:Answer}
  475.  
  476. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  477.  
  478. {block:Date}
  479. <div id="permalink">
  480. <a href="{Permalink}" >{12Hour}:{Minutes} {AmPm}</a>{block:NoteCount}<a href="{Permalink}">- {NoteCount}</a>{/block:NoteCount}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{block:ContentSource}<a href="{SourceURL}" title="{ReblogRootName}">source</a>{/block:ContentSource}{/block:RebloggedFrom} <a href="{ReblogURL}" target="_blank" >reblog</a><br>
  481. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  482. </div>
  483. {/block:Date}
  484.  
  485.  
  486.  
  487. </div>
  488.  
  489. {block:PermalinkPage}
  490. {block:PostNotes}
  491. <div class="pagenotes">
  492. {PostNotes}
  493. </div>
  494. {/block:PostNotes}
  495. {/block:PermalinkPage}
  496.  
  497. {/block:Posts}
  498.  
  499. <div id="pagination">
  500. {block:Pagination}
  501. {block:PreviousPage}
  502. <a href="{PreviousPage}">&larr; back </a>
  503. {/block:PreviousPage}
  504.  
  505.  
  506. {block:NextPage}
  507. <a href="{NextPage}">forward &rarr;</a>
  508. {/block:NextPage}
  509. {/block:Pagination}
  510. </div>
  511.  
  512.  
  513.  
  514. </div>
  515.  
  516. </div>
  517.  
  518.  
  519.  
  520. <div style="position:fixed;bottom:5px;right:5px;z-index:999"><a href="http://he1975.tumblr.com" title="he1975">jae.</a></div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement