Advertisement
wallflwers

Theme 04 Joshdevin (Big posts)

Dec 9th, 2012
2,445
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5.  
  6. <meta name="color:Box" content="#f8f8f8"/>
  7. <meta name="color:Background" content="#ffffff"/>
  8. <meta name="color:Border" content="#e8e8e8"/>
  9. <meta name="color:HyperLink" content="#b1486c"/>
  10. <meta name="color:HyperLink Hover" content="#d6bfc7"/>
  11. <meta name="color:Scrollbar" content="#b1486c"/>
  12. <meta name="color:Links Text" content="#d59db0"/>
  13. <meta name="color:Link Text Hover" content="#292727"/>
  14. <meta name="color:Text" content="#9c8f93"/>
  15.  
  16.  
  17. <meta name="image:Background" content""/>
  18. <meta name="image:Sidebar" content""/>
  19.  
  20. <meta name="text:Link 1 URL" content="/"/>
  21. <meta name="text:Link 1 name" content=""/>
  22. <meta name="text:Link 2 URL" content="/"/>
  23. <meta name="text:Link 2 name" content=""/>
  24. <meta name="text:Link 3 URL" content="/"/>
  25. <meta name="text:Link 3 name" content=""/>
  26. <meta name="text:Link 4 URL" content="/"/>
  27. <meta name="text:Link 4 name" content=""/>
  28.  
  29. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  30.  
  31. <script src="jquery.js"></script>
  32. <script>
  33. $(document).ready(function(){
  34. $("#flip").click(function(){
  35. $("#panel").slideToggle("fast");
  36. });
  37. });
  38. </script>
  39.  
  40. {block:Description}
  41. <meta name="description" content="{MetaDescription}" />{/block:Description}
  42. <title>
  43. {block:PostSummary}
  44. {PostSummary} - {/block:PostSummary}{Title}</title>
  45. </style>
  46.  
  47. <style type="text/css">
  48. img{
  49. -webkit-transition: opacity 0.5s linear;
  50. opacity: 0.75;
  51. }
  52.  
  53. img:hover{
  54. -webkit-transition: opacity 0.5s linear;
  55. opacity: 1;
  56. }
  57.  
  58.  
  59. img{
  60. -moz-transition: opacity 0.5s linear;
  61. opacity: 0.75;
  62. }
  63.  
  64. img:hover{
  65. -moz-transition: opacity 0.5s linear;
  66. opacity: 1;
  67. }
  68.  
  69.  
  70.  
  71. iframe#tumblr_controls {right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  72.  
  73.  
  74. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: .9;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  75.  
  76. ::-webkit-scrollbar {width: 5px; height: 5px; background:{color:Scrollbar Background}; }
  77. ::-webkit-scrollbar-thumb { background-color: {color:Scrollbar};}
  78.  
  79.  
  80. body{
  81. background-color: {color:Background};
  82. background-image: url({image:Background});
  83. background-attachment: fixed;
  84. background-repeat: repeat;
  85. background-position: center;
  86. font-family:calibri;
  87. font-size:10px;
  88. line-height:12px;
  89. color:{color:Text};
  90. }
  91.  
  92. a:link, a:active, a:visited{
  93. color: {color:HyperLink};
  94. text-decoration:none;
  95. -webkit-transition: all 0.4s linear;
  96. -moz-transition: all 0.4s linear;
  97. transition: all 0.4s linear;
  98. }
  99.  
  100. a:hover{
  101. color: {color:HyperLink Hover};
  102. }
  103.  
  104. #container {
  105. margin:auto;
  106. width:500px;
  107. }
  108.  
  109. #content {
  110. width:500px;
  111. padding:10px;
  112. margin-top:-10px;
  113. }
  114.  
  115. #entry {
  116. width:500px;
  117. margin-top:20px;
  118. margin-left:110px;
  119. }
  120.  
  121.  
  122.  
  123. #side {
  124. position:fixed;
  125. text-align:center;
  126. width:150px;
  127. margin-top:270px;
  128. margin-left:-100px;
  129. }
  130.  
  131. #navigate a{
  132. text-transform:uppercase;
  133. font-family:courier;
  134. font-size:8px;
  135. letter-spacing:.01px;
  136. margin-top:3px;
  137. margin-left:3px;
  138. text-align:center;
  139. z-index:1;
  140. display:inline-block;
  141. background:{color:Sidelinks};
  142. color:{color:Links Text};
  143. transition: all 0.5s ease-out;
  144. -o-transition-transition: all 0.5s ease-out;
  145. -webkit-transition: all 0.5s ease-out;
  146. -moz-transition: all 0.5s ease-out;
  147. }
  148.  
  149. #navigate a:hover{
  150. background:{color:Link Hover};
  151. color:{color:Link Text Hover};
  152. transition: all 0.5s ease-out;
  153. -o-transition-transition: all 0.5s ease-out;
  154. -webkit-transition: all 0.5s ease-out;
  155. -moz-transition: all 0.5s ease-out;
  156. }
  157.  
  158.  
  159.  
  160. .video embed, .post div.video object {width:250px; height:187px}
  161.  
  162.  
  163. #tags{
  164. padding-top:6px;
  165. font-size:9px;
  166. position:relative;
  167. font-family:courier;
  168. }
  169.  
  170. #via{
  171. position:absolute;
  172. right:0;
  173. font-size:9px;
  174. font-family:courier;
  175. }
  176.  
  177. .head{
  178. font-family:calibri;
  179. font-style:italic;
  180. font-size: 15px;
  181. }
  182.  
  183.  
  184.  
  185.  
  186. {CustomCSS}
  187. </style>
  188.  
  189. <link rel="shortcut icon" href="{Favicon}">
  190. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" /><meta name="viewport" content="width=820" />
  191.  
  192. </head>
  193. <body>
  194. <div id="container">
  195. <div id="content">
  196. <div id="side">
  197. <div id="sidepic">
  198. <a href="/"><img src="{image:Sidebar}" width="108" style="z-index:999;padding:5px; background:white; border:1px solid {color:Border};margin-top:2px;margin-left:2px;"></a>
  199. </div>
  200.  
  201. <div class="desc">
  202. <div id="navigate">
  203. <a style="border: 1px solid {color:Border}; padding:2px;" href="{text:Link 1 URL}">{text:Link 1 name}</a>
  204. <a style="border: 1px solid {color:border}; padding:2px;"href="{text:Link 2 URL}">{text:Link 2 name}</a>
  205. <a style="border: 1px solid {color:border}; padding:2px;"href="{text:Link 3 URL}">{text:Link 3 name}</a>
  206. <a style="border: 1px solid {color:border}; padding:2px;"href="{text:Link 4 URL}">{text:Link 4 name}</a>
  207. </div>
  208. </div>
  209.  
  210. <div style="padding:2px;margin-top:2px;width:100px;margin-left:24px;font-size:10px;">
  211. {block:Pagination}{/block:Pagination}
  212. {Description}
  213. {block:PreviousPage}<a href="{PreviousPage}">←</a>{/block:PreviousPage}
  214. {block:NextPage}<a href="{NextPage}">→</a>{/block:NextPage}
  215. <hr color="#d6d5d5" size=".5" width="85%">
  216.  
  217. </div>
  218. {block:PreviousPage}
  219. {/block:PreviousPage}
  220. {block:NextPage}
  221. {/block:NextPage}
  222. </div>
  223. </div>
  224.  
  225. {block:Posts}
  226. <div style="border: 1px solid {color:border};padding:10px;" id="entry">
  227.  
  228. {block:Text}
  229. {block:Title}
  230. <div class="head">{Title}</div>
  231. {/block:Title}
  232. {Body}
  233. {/block:Text}
  234.  
  235. {block:Link}
  236. <div class="head">
  237. <a href="{URL}">{Name}</a>
  238. </div>
  239. {block:Description}{Description}{/block:Description}
  240. {/block:Link}
  241.  
  242. {block:Photo}
  243. <center>
  244. {LinkOpenTag}
  245. <div id="pic">
  246. <a href="{tags}">
  247. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500"></a>
  248. </div>
  249. {LinkCloseTag}
  250. </center>
  251. {block:Caption}{Caption}{/block:Caption}
  252. {block:ContentSource}
  253. {/block:ContentSource}
  254. {block:ReblogParentURL}
  255. {/block:ReblogParentURL}
  256. {/block:Photo}
  257.  
  258. {block:Photoset}
  259. <center>
  260. <div class="photo">
  261. {Photoset-500}
  262. </div>
  263. </center>
  264. {block:Caption}{Caption}{/block:Caption}
  265. {/block:Photoset}
  266.  
  267. {block:Quote}
  268. <div class="head">"{Quote}"</div>
  269. {block:Source}
  270. <i> ~ {Source}</i>
  271. {/block:Source}
  272. {/block:Quote}
  273.  
  274. {block:Chat}
  275. {block:Title}
  276. <div class="head">
  277. {Title}
  278. </div>
  279. {/block:Title}
  280. {block:Lines}
  281. <div class="line {Alt}">
  282. <div class="{Alt} user_{UserNumber}">
  283. {block:Label}
  284. <b>{Label} </b>
  285. {/block:Label}
  286. {Line}
  287. </div>
  288. </div>
  289. {/block:Lines}
  290. {/block:Chat}
  291.  
  292. {block:Audio}
  293. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
  294.  
  295. {block:TrackName}
  296. {TrackName}
  297. {/block:TrackName}
  298.  
  299. {block:Artist}
  300. {Artist}
  301. {/block:Artist}
  302.  
  303.  
  304. <br>
  305. {block:Caption}{Caption}{/block:Caption}
  306. {/block:Audio}
  307.  
  308. {block:Video}
  309. <center>
  310. <div class="photo">
  311. {Video-500}
  312. </div>
  313. </center>
  314. {block:Caption}{Caption}{/block:Caption}
  315. {/block:Video}
  316.  
  317. {block:IndexPage}
  318. <div id="tags">posted
  319. <a href="{Permalink}"> {TimeAgo}</a>
  320. with
  321. <a href="{Permalink}">{NoteCountWithLabel}</a>
  322. <div id="via">
  323. {block:RebloggedFrom}<a href="{ReblogParentURL}" target="_blank">{ReblogParentName}</a> ~ (<a href="{ReblogRootURL}" target="_blank">{ReblogRootName}</a>) {/block:RebloggedFrom}
  324. </div>
  325. <br>
  326. {block:HasTags}
  327. {block:Tags}<a href="{TagURL}">#{Tag}</a>
  328. {/block:Tags}
  329. {/block:HasTags}
  330. </div>
  331. {/block:IndexPage}
  332.  
  333. {block:PermalinkPage}
  334. <center>
  335. <div id="tags">
  336. {block:Date}
  337. {TimeAgo} on
  338. {ShortMonth} {DayofMonth},{Year}
  339. {/block:Date}
  340. {block:NoteCount} {NoteCountWithLabel}
  341. {/block:NoteCount}<br>
  342. {block:HasTags}
  343. {block:Tags}<a href="{TagURL}">#{Tag} </a>
  344. {/block:Tags}
  345. {/block:HasTags}
  346. <br>{block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank">{ReblogParentName}</a> ( <a href="{ReblogRootURL}" target="_blank">{ReblogRootName}</a>) {/block:RebloggedFrom}
  347. </div>
  348. </center>
  349. {/block:PermalinkPage}
  350.  
  351. {block:PostNotes}
  352. {PostNotes}
  353. {/block:PostNotes}
  354. </div>
  355. {/block:Posts}
  356. </div>
  357.  
  358. <div style="font-size: 10px; letter-spacing: 1px; float: right; position: fixed; bottom: 5px; right: 5px; text-transform:lowercase;"><a href="http://joshdevin.tumblr.com">©joshdevin</a></div>
  359.  
  360.  
  361. </body>
  362. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement