Advertisement
ValarMorghulis

Theme #9: glory & gore (400px)

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