Advertisement
hellmouths

THEME #006: TRESPASSING

Jul 27th, 2012
6,218
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.82 KB | None | 0 0
  1. <!--
  2. #006: TRESPASSING
  3. theme by hellmouths @ tumblr
  4.  
  5. - don't copy or claim as your own
  6. - don't use as a base
  7. - don't remove credit
  8.  
  9. read faq before asking any questions;
  10. otherwise contact me about any complications
  11.  
  12. thank you for using my themes!
  13.  
  14. -->
  15.  
  16. <html>
  17. <head>
  18.  
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{Favicon}"/>
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22. {block:Description} <meta name="description" content="{MetaDescription}"/> {/block:Description}
  23.  
  24. <meta name="color:bg" content="#ffffff" />
  25. <meta name="color:text" content="#cccbc9" />
  26. <meta name="color:a" content="#cfb1a2" />
  27. <meta name="color:hover" content="#ddc2a4" />
  28. <meta name="color:posts" content="#ffffff" />
  29. <meta name="color:bq border" content="#e5e5e5" />
  30. <meta name="color:post border" content="#f2f2f2"/>
  31. <meta name="color:left" content="#ffffff"/>
  32.  
  33. <meta name="text:link1" content="">
  34. <meta name="text:link1 url" content="">
  35. <meta name="text:link2" content="">
  36. <meta name="text:link2 url" content="">
  37. <meta name="text:link3" content="">
  38. <meta name="text:link3 url" content="">
  39. <meta name="text:link4" content="">
  40. <meta name="text:link4 url" content="">
  41. <meta name="text:link5" content="">
  42. <meta name="text:link5 url" content="">
  43. <meta name="text:link6" content="">
  44. <meta name="text:link6 url" content="">
  45. <meta name="text:link7" content="">
  46. <meta name="text:link7 url" content="">
  47. <meta name="text:link8" content="">
  48. <meta name="text:link8 url" content="">
  49. <meta name="text:link9" content="">
  50. <meta name="text:link9 url" content="">
  51.  
  52. <meta name="image:sidebar" content="">
  53.  
  54. <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
  55. <link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
  56.  
  57.  
  58. <style type="text/css">
  59.  
  60. body {
  61. font-family:arial;
  62. font-size:11px;
  63. line-height:140%;
  64. background-color:{color:bg};
  65. color: {color:text}; }
  66.  
  67. a, a:active, a:visited { text-decoration: none; color: {color:a};}
  68. a:hover { color: {color:hover}; text-decoration:none; }
  69.  
  70. #content {
  71. width:100%;
  72. margin:auto; }
  73.  
  74. b { font-weight:700; color:{color:a};}
  75. strong{ font-weight:700; color:{color:text};}
  76.  
  77. i, em { font-weight:400;}
  78.  
  79.  
  80.  
  81. /* SIDEBAR */
  82.  
  83.  
  84. #left {
  85. width:420px;
  86. height:100%;
  87. top:0;
  88. left:0;
  89. position:fixed;
  90. z-index:-2;
  91. background-color:{color:left}; }
  92.  
  93. #sidebar {
  94. width:305px;
  95. margin:180px 0 0 117px;
  96. height:auto;
  97. float:left;
  98. position:fixed;
  99. font-family: georgia;
  100. font-size:10px;}
  101.  
  102.  
  103. #sbimage {
  104. margin:10px auto 0px auto;
  105. float:right; }
  106.  
  107. #stext {
  108. background:white;
  109. padding:15px 0;
  110. text-align:center;
  111. width:265px;
  112. float:right; }
  113.  
  114. .slinks {
  115. opacity:0;
  116. height:auto;
  117. position:fixed;
  118. text-align:left;
  119. width:auto;
  120. margin-left:50px;
  121. margin-top:35px;
  122. line-height:230%;
  123. -webkit-transition: all 0.4s ease-out;
  124. -o-transition: all 0.4s ease-out;
  125. -webkit-transition: all 0.4s ease-out;
  126. -moz-transition: all 0.4s ease-out; }
  127.  
  128. .slinks a {
  129. width:90px;
  130. display:block;
  131. font-family:'Inconsolata';
  132. font-size:10px;
  133. padding:0px 0px;
  134. letter-spacing:1px;
  135. margin-bottom:7px;
  136. text-align:center; }
  137.  
  138. .slinks a:hover {
  139. -webkit-transition: all 0.7s ease;
  140. -moz-transition: all 0.7s ease;
  141. -o-transition: all 0.7s ease;}
  142.  
  143. #sidebar:hover .slinks {
  144. opacity:1;
  145. margin-left:-60px;
  146. -webkit-transition: all 0.4s ease-out;
  147. -o-transition: all 0.4s ease-out;
  148. -webkit-transition: all 0.4s ease-out;
  149. -moz-transition: all 0.4s ease-out;
  150. }
  151.  
  152.  
  153. .menu {
  154. opacity:0.8;
  155. width:auto;
  156. width:265px;
  157. text-align:center;
  158. color:#c1c1c1;
  159. float:right; }
  160.  
  161. .menu a {
  162. text-transform:uppercase;
  163. display:inline-block;
  164. font-weight:bold;
  165. font-family:calibri;
  166. font-size:10px; }
  167.  
  168.  
  169.  
  170. #pagination {
  171. margin-top:310px;
  172. background:#trans;
  173. width:265px;
  174. opacity:0.9;
  175. height:25px;
  176. margin-left:40px;
  177. position:fixed;
  178. color:{color:text};
  179. text-align:center;
  180. line-height:20px;
  181. font-family:calibri;
  182. font-size:10px;
  183. }
  184.  
  185. #pagination a {
  186. text-decoration:none;
  187. background:#fafafa;
  188. padding: 2px 4px 2px 4px;
  189. color:{color:pagea};
  190. }
  191.  
  192. #pagination a:hover {
  193. background-color:{color:bg};
  194. color:{color:text};
  195. }
  196.  
  197.  
  198.  
  199.  
  200. /* POSTS */
  201.  
  202.  
  203. #posts {
  204. width:600px;
  205. float:center;
  206. margin:-10px auto auto 460px;
  207. height:auto;
  208. padding-left:30px;
  209. padding-bottom:50px; }
  210.  
  211. .post {
  212. width:500px;
  213. padding:70px 0 5px 0;
  214. text-align: justify;
  215. background: #ffffff;
  216. letter-spacing:0;}
  217.  
  218. .tags {
  219. font-family:georgia;
  220. position:absolute;
  221. padding-top: 7px;
  222. text-align: left;
  223. font-size: 8px;
  224. text-transform: lowercase;
  225. width:500px;
  226. height:30px;
  227. overflow:hidden;
  228. -webkit-transition: all 0.7s ease;
  229. -moz-transition: all 0.7s ease;
  230. -o-transition: all 0.7s ease; }
  231. .tags a { color:{color:text}; }
  232.  
  233.  
  234. .quote { font-size:18px; font-family:'oswald'; color:{color:a}; margin-bottom:7px; line-height:160%; }
  235.  
  236. .source { font-size:9px; text-transform:uppercase; letter-spacing:1; }
  237.  
  238. .link { font-size:18px; font-family:'oswald'; margin-bottom:7px; line-height:160%; text-align:left;}
  239.  
  240. .link a { color:{color:a}; }
  241.  
  242. .subject { font-size:18px; font-family:'oswald'; margin-bottom:7px; line-height:160%; text-align:left;}
  243.  
  244. .subject a { color:{color:a}; }
  245.  
  246. blockquote { margin-left:15px; padding-left:5px; border-left:1px solid {color:post border}; }
  247.  
  248.  
  249. #info {
  250. border-bottom:1px solid #f6f6f6;
  251. text-align:left;
  252. font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  253. padding:3px 2px;
  254. text-transform:uppercase;
  255. letter-spacing:1px;
  256. width:500px;
  257. margin-top:10px;
  258. font-size:7px;}
  259.  
  260.  
  261.  
  262.  
  263. /* CREDITS - DO NOT REMOVE */
  264.  
  265. .cred { font-family:tinytots; font-size:10px; bottom:0px; right:5px; position:fixed; background-color:#trans; padding:10px; -webkit-transition: all 0.2s ease-out;
  266. -o-transition: all 0.2s ease-out;
  267. -webkit-transition: all 0.2s ease-out;
  268. -moz-transition: all 0.2s ease-out; }
  269.  
  270. .cred:hover { padding-bottom:20px; -webkit-transition: all 0.2s ease-out;
  271. -o-transition: all 0.2s ease-out;
  272. -webkit-transition: all 0.2s ease-out;
  273. -moz-transition: all 0.2s ease-out; }
  274.  
  275. .cred img { opacity:0.4; }
  276.  
  277. @font-face {
  278. font-family: "tinytots";
  279. src: url('http://tinyurl.com/6rljj32');
  280. }
  281.  
  282.  
  283.  
  284.  
  285. /* NOTES */
  286.  
  287. ol.notes{
  288. opacity:0.8;
  289. padding: 0px;
  290. margin-top: 30px;
  291. background-color:{color:bg};
  292. text-align:left;
  293. list-style-type: none;
  294. width:500px;
  295. border-bottom: solid 0px #efefef;
  296. }
  297.  
  298. ol.notes li.note{ border-top: solid 1px {color:post border}; padding: 4px; }
  299.  
  300. ol.notes li.note img.avatar { display:none; }
  301.  
  302. ol.notes li.note span.action { font-weight: normal; }
  303.  
  304. ol.notes li.note .answer_content { font-weight: normal; }
  305.  
  306. ol.notes li.note blockquote{
  307. padding: 0px 0px 0px 5px;
  308. margin: 0px 0px 2px 25px;
  309. border-left: 2px solid #DDDDDD;
  310. }
  311.  
  312. ol.notes li.note blockquote a { text-decoration: none; font-size:10px; }
  313.  
  314.  
  315.  
  316. /* SCROLLBAR */
  317.  
  318. ::-webkit-scrollbar-thumb:vertical {
  319. background-color:{color:a};
  320. border-top:2px solid {color:a};
  321. border-bottom:2px solid {color:a};
  322. height:auto;}
  323. ::-webkit-scrollbar-thumb:vertical:hover{
  324. background-color:{color:a};}
  325. ::-webkit-scrollbar-thumb:horizontal{
  326. background-color:{color:a};
  327. height:auto;}
  328. ::-webkit-scrollbar-thumb:horizontal:hover{
  329. background-color:{color:a};}
  330. ::-webkit-scrollbar{
  331. height:10px;
  332. width:5px;
  333. background-color: #trans;}
  334.  
  335.  
  336. </style>
  337. </head>
  338. <body>
  339. <div class="cred">
  340. <img src="http://www.swimchick.net/resources/website-bullets/bull7.gif"> <a href="http://hellmouths.tumblr.com">HELLMOUTHS</a></div>
  341.  
  342.  
  343. <div id="left"></div>
  344.  
  345. <div id="sidebar">
  346.  
  347. <div class="slinks">
  348. <a href="{text:link4 url}">{text:link4}</a>
  349. <a href="{text:link5 url}">{text:link5}</a>
  350. <a href="{text:link6 url}">{text:link6}</a>
  351. <a href="{text:link7 url}">{text:link7}</a>
  352. <a href="{text:link8 url}">{text:link8}</a>
  353. <a href="{text:link9 url}">{text:link9}</a>
  354. </div>
  355.  
  356. <div class="menu">
  357. <a href="{text:link1 url}">{text:link1}</a>
  358. &nbsp; · &nbsp;
  359. <a href="{text:link2 url}">{text:link2}</a>
  360. &nbsp; · &nbsp;
  361. <a href="{text:link3 url}">{text:link3}</a>
  362. </div>
  363.  
  364. <div id="sbimage"><img src="{image:sidebar}"></div>
  365.  
  366. <div id="stext">{description}</div>
  367.  
  368.  
  369.  
  370. <div id="pagination">{block:Pagination}
  371. {block:PreviousPage}<a href="{PreviousPage}">«</a>{/block:PreviousPage}
  372. {block:JumpPagination length="6"}{block:CurrentPage}
  373. <span class="current_page" style="padding-right:3px;padding-left:3px;">{PageNumber}</span>
  374. {/block:CurrentPage}
  375. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}
  376. {/block:JumpPagination}
  377. {block:NextPage}<a href="{NextPage}">»</a> {/block:NextPage}
  378. </div>{/block:Pagination} </div>
  379. </div>
  380.  
  381.  
  382.  
  383. <div id="content">
  384. <div id="posts">
  385.  
  386. {block:Posts}
  387.  
  388. <div class="post">
  389.  
  390. {block:Text}
  391. {block:Title}
  392. <div class="subject"><a href="{Permalink}">{Title}</a></div>
  393. {/block:Title}
  394. {Body}
  395. {/block:Text}
  396.  
  397. {block:Photo}
  398. <center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>
  399. {block:Caption}
  400. <div class="caption">{Caption}</div>
  401. {/block:Caption}
  402. {/block:Photo}
  403.  
  404. {block:Photoset}
  405. <center>{Photoset-500}</center>
  406. {block:Caption}
  407. <div class="caption">{Caption}</div>
  408. {/block:Caption}
  409. {/block:Photoset}
  410.  
  411. {block:Quote}
  412. <div class="quote">"{Quote}"</div>
  413. {block:Source}
  414. <div class="source">- {Source}</div>
  415. {/block:Source}
  416. {/block:Quote}
  417.  
  418. {block:Link}
  419. <center><div class="link">⇒ <a href="{URL}" class="link" {Target}>{Name}</a></div></center>
  420. {block:Description}
  421. {Description}
  422. {/block:Description}
  423. {/block:Link}
  424.  
  425. {block:Chat}{block:Title}<div class="subject">{Title}</div>{/block:Title}<p>
  426. {block:Lines}<div style="padding: 2px 0px; width:500px; border-bottom: 1px solid {color:posts}">{block:Label}<span style="color: {color:a}; font-size:9px; text-transform: uppercase; letter-spacing: 0px; font-weight:bold;">{Label}</span>{/block:Label}&nbsp;{Line}<br></div>{/block:Lines}{/block:Chat}
  427.  
  428. {block:Video}
  429. <center>{Video-500}</center>
  430. {block:Caption}
  431. {Caption}
  432. {/block:Caption}
  433. {/block:Video}
  434.  
  435. {block:Answer}<div style="color: {color:text}; background: {color:bg}; padding: 15px; border:1px solid #efefef;">{Asker}: {Question}</div><br><p>{Answer}{/block:answer}
  436.  
  437. {block:Audio}
  438. {block:AlbumArt}
  439. <img src="{AlbumArtURL}" height="100px">
  440. {/block:AlbumArt}<div style="margin-top: -100px; margin-left: 102px; background: {color:a}; font-family: 'Droid Serif'; width: 348px; border-bottom: 2px solid {color:posts}; color: {color:posts}; text-align: left; font-size: 10px; height: 8px; padding: 26px 25px; letter-spacing: 2px;">{block:trackname}{TrackName}{/block:TrackName} ⋅ {block:Artist}{Artist}{/block:Artist}
  441. </div>
  442. <div style="background-color:#e4e4e4; width: 388px; padding: 5px; margin-left: 102px; ">{AudioPlayerGrey}</div>{/block:Audio}
  443.  
  444.  
  445.  
  446.  
  447.  
  448. <div id="info">{block:Date}
  449. posted <a href="{Permalink}">{TimeAgo}</a> with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:Date} <div style="float:right;">{block:RebloggedFrom}via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom} {block:ContentSource}/ source: <a href="{SourceURL}">{SourceLink}</a>
  450. {/block:ContentSource}</div>
  451.  
  452.  
  453. <div class="tags">
  454. {block:HasTags}
  455. {block:Tags}<i>#<a href="{TagURL}">{Tag}</a> &nbsp;</i>{/block:Tags}{/block:HasTags}</div>
  456. </div>
  457.  
  458.  
  459. {block:PermalinkPage}{block:PostNotes}{PostNotes}{/block:PostNotes}{/block:PermalinkPage}
  460. {/block:Posts}
  461.  
  462. </div>
  463. </div>
  464.  
  465. </body>
  466. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement