API tools faq
paste
Advertisement
Jyuubi

[Theme] → #07 Simplistic {v.1)

Jyuubi
Jul 22nd, 2012
12,465
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.51 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3.  
  4. <!--
  5. PLEASE DO NOT REMOVE THIS.
  6. THE REMOVAL OF THIS PART WILL CONSIDER YOU A THIEF.
  7. IF YOU REMOVE CREDIT, MAKE SURE IT'S ON A CREDITS PAGE.
  8.  
  9. THEME: #7 SIMPLISTIC [V.1]
  10. jyuubi.org | manatopia.tumblr
  11.  
  12. --RULES--
  13. 1) DO NOT REMOVE CREDIT.
  14. 2) DO NOT USE TO MAKE YOUR OWN THEME TO RESDISTRIBUTE.
  15. 3) DO NOT USE TO MAKE YOUR OWN THEME AND REMOVE CREDIT.
  16. 4) IF YOU USE ANYTHING FROM MY THEMES, ALWAYS CREDIT.
  17. 5) DO USE ANY GRAPHICS MADE FOR A PREVIEW.
  18. -->
  19.  
  20. <meta name="color:BackgroundM" content="#fff">
  21. <meta name="color:Content Background" content="#ECECEC">
  22. <meta name="color:Content Text" content="#828282">
  23. <meta name="color:Content Bold" content="#616161">
  24. <meta name="color:Content Italic" content="#8f8f8f">
  25. <meta name="color:Content Link" content="#adadad">
  26. <meta name="color:Post Title" content="#adadad">
  27. <meta name="color:Nav Background" content="#e1e1e1">
  28. <meta name="color:Nav Link" content="#979797">
  29. <meta name="color:Nav Link Hover" content="#7f7f7f">
  30. <meta name="color:Custom Link Background" content="#e1e1e1">
  31. <meta name="color:Custom Link Background Hover" content="#d9d9d9">
  32. <meta name="color:Custom Link Text" content="#9f9f9f">
  33. <meta name="color:Custom Link Text Hover" content="#828282">
  34. <meta name="color:Permalink Symbol" content="#7f7f7f">
  35. <meta name="image:BackgroundM" content="http://static.tumblr.com/pdgxkke/R3Rm1ih24/simplistic.png">
  36. <meta name="image:Sidebar" content="">
  37. <meta name="if:Infinite Scrolling" content="0">
  38. <meta name="if:Larger Posts" content="0">
  39. <meta name="if:Show Captions" content="0">
  40. <meta name="if:Dropdown Description" content="1">
  41. <meta name="if:Show Captions" content="0">
  42. <meta name="if:Photo Fading" content="1">
  43. <meta name="if:High Res Link" content="1">
  44. <meta name="font:Post Content" content="lucida sans">
  45. <meta name="text:Sidebar Position" content="50">
  46. <meta name="text:Post Content Size" content="10">
  47. <meta name="text:Sidebar Desc Size" content="9">
  48. <meta name="text:Permalink Symbol" content="&#4326;">
  49. <meta name="text:Name 1" content="">
  50. <meta name="text:URL 1" content="http://">
  51. <meta name="text:Name 2" content="">
  52. <meta name="text:URL 2" content="http://">
  53. <meta name="text:Name 3" content="">
  54. <meta name="text:URL 3" content="http://">
  55. <meta name="text:Name 4" content="">
  56. <meta name="text:URL 4" content="http://">
  57. <meta name="text:Name 5" content="">
  58. <meta name="text:URL 5" content="http://">
  59. <meta name="text:Name 6" content="">
  60. <meta name="text:URL 6" content="http://">
  61.  
  62. <head>
  63. <meta http-equiv="content-type" content="text/html; charset=utf-8">
  64. <title>{Title}</title>
  65. <link rel="shortcut icon" href="{Favicon}">
  66. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  67. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  68.  
  69. <style type="text/css">
  70. /* BODY */
  71. body {
  72. background-image: url("{image:BackgroundM}");
  73. background-attachment: fixed;
  74. background-repeat: repeat;
  75. background-color: {color:BackgroundM};
  76. }
  77.  
  78. #container {
  79. {block:IfNotLargerPosts}width: 632px;{/block:IfNotLargerPosts}
  80. {block:IfLargerPosts}width: 732px;{/block:IfLargerPosts}
  81. margin: auto;
  82. }
  83.  
  84. /* SIDEBAR */
  85. #sidebar {
  86. background-color: {color:Content Background};
  87. padding: 5px;
  88. position: fixed;
  89. margin-top: {text:Sidebar Position}px;
  90. font-family: lucida sans unicode;
  91. font-size: {text:Sidebar Desc Size}px;
  92. color: {color:Content Text};
  93. text-align: center;
  94. letter-spacing: 1px;
  95. line-height: 16px;
  96. text-transform: lowercase;
  97. width: 200px;
  98. float: left;
  99. }
  100.  
  101. #sidebar a {
  102. color: {color:Content Link};
  103. text-decoration: none;
  104. }
  105.  
  106. #sidebar b, strong {
  107. color: {color:Content Bold};
  108. font-weight: normal;
  109. }
  110.  
  111. #sidebar i, em {
  112. color: {color:Content Italic};
  113. }
  114.  
  115. #sidebar img {
  116. max-width: 200px;
  117. margin-bottom: 5px;
  118. opacity: .8;
  119. }
  120.  
  121. #links {
  122. background-color: {color:Nav Background};
  123. color: {color:Nav Link Hover};
  124. text-align: center;
  125. margin-bottom: 5px;
  126. }
  127.  
  128. #links a {
  129. font-family: consolas;
  130. font-size: 9px;
  131. color: {color:Nav Link};
  132. text-decoration: none;
  133. text-transform: uppercase;
  134. letter-spacing: 1px;
  135. -webkit-transition: all 0.5s ease;
  136. -moz-transition: all 0.5s ease;
  137. -o-transition: all 0.5s ease;
  138. padding: 2px;
  139. }
  140.  
  141. #links a:hover {
  142. color: {color:Nav Link Hover};
  143. }
  144.  
  145. #sidebar a.custom {
  146. background-color: {color:Custom Link Background};
  147. display: block;
  148. width: 200px;
  149. height: 20px;
  150. line-height: 20px;
  151. font-family: lucida sans unicode;
  152. font-size: 9px;
  153. color: {color:Custom Link Text};
  154. text-transform: lowercase;
  155. text-decoration: none;
  156. letter-spacing: 4px;
  157. text-align: center;
  158. -webkit-transition: all 0.5s ease;
  159. -moz-transition: all 0.5s ease;
  160. -o-transition: all 0.5s ease;
  161. }
  162.  
  163. #sidebar a.custom:hover {
  164. background-color: {color:Custom Link Background Hover};
  165. color: {color:Custom Link Text Hover};
  166. height: 30px;
  167. }
  168.  
  169. /* PAGINATION */
  170. #pages {
  171. font-size: 20px;
  172. color: {color:Content Link};
  173. text-align: center;
  174. }
  175.  
  176. #pages a {
  177. color: {color:Content Link};
  178. text-decoration: none;
  179. }
  180.  
  181. /* ENTRY */
  182. .post {
  183. {block:IfNotLargerPosts}width: 500px;{/block:IfNotLargerPosts}
  184. {block:IfLargerPosts}width: 600px;{/block:IfLargerPosts}
  185. float: right;
  186. }
  187.  
  188. .entry {
  189. background-color: {color:Content Background};
  190. {block:IfNotLargerPosts}width: 400px;{/block:IfNotLargerPosts}
  191. {block:IfLargerPosts}width: 500px;{/block:IfLargerPosts}
  192. padding: 5px;
  193. margin-bottom: 8px;
  194. font-family: {font:Post Content};
  195. font-size: {text:Post Content Size}px;
  196. color: {color:Content Text};
  197. letter-spacing: 1px;
  198. float: right;
  199. text-transform: lowercase;
  200. overflow: hidden;
  201. }
  202.  
  203. .entry b, strong {
  204. color: {color:Content Bold};
  205. font-weight: normal;
  206. }
  207.  
  208. .entry i, em {
  209. color: {color:Content Italic};
  210. }
  211.  
  212. .entry a {
  213. color: {color:Content Link};
  214. text-decoration: none;
  215. }
  216.  
  217. .entry h1 {
  218. font-family: georgia;
  219. font-size: 18px;
  220. color: {color:Post Title};
  221. font-weight: normal;
  222. font-style: italic;
  223. text-transform: lowercase;
  224. letter-spacing: 2px;
  225. text-align: center;
  226. }
  227.  
  228. .entry h1 a {
  229. color: {color:Post Title};
  230. }
  231.  
  232. /* IMAGE POSTS */
  233. {block:IfNotLargerPosts}
  234. .entry img {
  235. max-width: 400px;
  236. }
  237. {block:IfNotLargerPosts}
  238.  
  239. {block:IfPhotoFading}
  240. .entry img {
  241. opacity: .8;
  242. }
  243.  
  244. .photo {
  245. opacity: .8;
  246. }
  247. {/block:IfPhotoFading}
  248.  
  249. /* QUOTES */
  250. .entry h2 {
  251. font-family: {font:Titles};
  252. font-size: 14px;
  253. color: {color:Post Title};
  254. font-weight: normal;
  255. text-transform: uppercase;
  256. letter-spacing: 1px;
  257. text-align: left;
  258. }
  259.  
  260. .quote {
  261. font-family: georgia;
  262. font-size: 28px;
  263. color: {color:Content Bold};
  264. float: left;
  265. }
  266.  
  267. /* AUDIO ALBUMS */
  268. .audio img {
  269. max-width: 40px;
  270. float: left;
  271. margin-right: 5px;
  272. }
  273.  
  274. /* HOVER */
  275. .show a {
  276. font-size: 9px;
  277. font-family: consolas;
  278. text-transform: uppercase;
  279. position: absolute;
  280. color: {color:Permalink Symbol};
  281. line-height: 12px;
  282. padding: 0px;
  283. text-decoration: none;
  284. }
  285.  
  286. .show a.symbol {
  287. font-size: 20px;
  288. font-family: lucida sans unicode;
  289. position: absolute;
  290. color: {color:Permalink Symbol};
  291. line-height: 12px;
  292. padding: 0px;
  293. text-decoration: none;
  294. }
  295.  
  296. .show {
  297. letter-spacing: 1px;
  298. float: right;
  299. padding: 2px;
  300. opacity: 0;
  301. filter: alpha(opacity=0);
  302. -moz-opacity: 0;
  303. -khtml-opacity: 0;
  304. -webkit-transition: all 1s ease;
  305. -moz-transition: all 1s ease;
  306. -o-transition: all 1s ease;
  307. }
  308.  
  309. .post:hover .show {
  310. opacity: 1;
  311. -moz-opacity: 1;
  312. -khtml-opacity: 1;
  313. }
  314.  
  315. /* PERMALINK PAGE */
  316. .permalink {
  317. font-family: tahoma, sans-serif;
  318. font-size: 10px;
  319. color: {color:Content Text};
  320. text-transform: lowercase;
  321. text-align: center;
  322. {block:IfNotLargerPosts}width: 510px;{/block:IfNotLargerPosts}
  323. {block:IfLargerPosts}width: 410px;{/block:IfLargerPosts}
  324. margin-left: 230px;
  325. }
  326.  
  327. .permalink b {
  328. color: {color:Content Bold};
  329. font-weight: normal;
  330. }
  331.  
  332. #date {
  333. color: {color:Content Italic};
  334. }
  335.  
  336. .permalink a {
  337. color: {color:Content Link};
  338. text-decoration: none;
  339. }
  340.  
  341. ol.notes {
  342. padding: 0px;
  343. margin: 15px 0px;
  344. list-style-type: none;
  345. background: transparent;
  346. border: 0px;
  347. letter-spacing: 0px;
  348. }
  349.  
  350. ol.notes li.note {
  351. padding: 1px;
  352. text-align: left;
  353. letter-spacing: 0px;
  354. }
  355.  
  356. .notes img{
  357. width: 10px;
  358. position: relative;
  359. top: 1px;
  360. opacity: .5;
  361. }
  362.  
  363. /* FOLLOW CODE */
  364. iframe#tumblr_controls {
  365. right:3px !important;
  366. position: fixed !important;
  367. -webkit-transition: opacity 0.7s linear;
  368. opacity: 0.2;
  369. -webkit-transition: all 0.8s ease-out;
  370. -moz-transition: all 0.8s ease-out;
  371. transition: all 0.8s ease-out;
  372. }
  373.  
  374. iframe#tumblr_controls:hover {
  375. -webkit-transition: opacity 0.7s linear;
  376. opacity: 1;
  377. -webkit-transition: all 0.4s ease-out;
  378. -moz-transition: all 0.4s ease-out;
  379. transition: all 0.4s ease-out;
  380. }
  381. </style>
  382. <style type="text/css">{CustomCSS}</style>
  383. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  384. <script type="text/javascript" src="http://wekaonline.googlecode.com/svn-history/r60/trunk/web_design/js/animatedcollapse.js">
  385. /***********************************************
  386. * Animated Collapsible DIV v2.4- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
  387. * This notice MUST stay intact for legal use
  388. * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
  389. ***********************************************/
  390. </script>
  391. <script type="text/javascript">
  392. animatedcollapse.addDiv('1', 'fade=2')
  393.  
  394. animatedcollapse.ontoggle=function($, divobj, state){ //fires each time a DIV is expanded/contracted
  395. //$: Access to jQuery
  396. //divobj: DOM reference to DIV being expanded/ collapsed. Use "divobj.id" to get its ID
  397. //state: "block" or "none", depending on state
  398. }
  399. animatedcollapse.init()
  400. </script>
  401.  
  402. {block:IfInfiniteScrolling}
  403. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  404. {/block:IfInfiniteScrolling}
  405. </head>
  406.  
  407. <body>
  408. <div id="container">
  409.  
  410. <div id="sidebar">
  411. <div id="links">
  412. <a href="/">Index</a>&nbsp;&nbsp;<a href="/archive">Archive</a>&nbsp;&nbsp;<a href="/ask">Ask</a>&nbsp;&nbsp;<a href="http://jyuubi.tumblr.com">Theme</a>
  413. </div>
  414. <img src="{image:Sidebar}">
  415. {block:IfName1}<a class="custom" href="{text:URL 1}">{text:Name 1}</a>{/block:IfName1}
  416. {block:IfName2}<a class="custom" href="{text:URL 2}">{text:Name 2}</a>{/block:IfName2}
  417. {block:IfName3}<a class="custom" href="{text:URL 3}">{text:Name 3}</a>{/block:IfName3}
  418. {block:IfName4}<a class="custom" href="{text:URL 4}">{text:Name 4}</a>{/block:IfName4}
  419. {block:IfName5}<a class="custom" href="{text:URL 5}">{text:Name 5}</a>{/block:IfName5}
  420. {block:IfName6}<a class="custom" href="{text:URL 6}">{text:Name 6}</a>{/block:IfName6}
  421. {block:IfDropdownDescription}<a class="custom" href="javascript:animatedcollapse.toggle('1')">Description</a>
  422. <div id="1" style="display:none;">{/block:IfDropdownDescription}
  423. <p>{Description}</p>
  424. {block:IfDropdownDescription}</div>{/block:IfDropdownDescription}
  425. {block:IfNotInfiniteScrolling}
  426. {block:Pagination}<div id="pages">
  427. {block:PreviousPage}<a href="{PreviousPage}">&larr;</a>&nbsp;&nbsp;&middot;&nbsp;&nbsp;{block:PreviousPage}{block:NextPage}<a href="{NextPage}">&rarr;</a>{block:NextPage}
  428. </div>{/block:Pagination}
  429. {/block:IfNotInfiniteScrolling}
  430. </div>
  431.  
  432. <div id="content">
  433.  
  434. <div class="autopagerize_page_element">
  435. {block:Posts}
  436.  
  437. <div class="post">
  438. {block:IndexPage}<div class="show"><a class="symbol" href="{Permalink}">{text:Permalink Symbol}</a><br /><a href="{Permalink}">{block:Date}{TimeAgo}{/block:Date}<br />{block:NoteCount}{NoteCount}{/block:NoteCount}</a></div>{/block:IndexPage}
  439. <div class="entry">
  440.  
  441. {block:Text}
  442. {block:Title}<h1>{Title}</h1>{/block:Title}
  443. {Body}
  444. {/block:Text}
  445.  
  446. {block:Photo}
  447. <center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"></a>{LinkCloseTag}</center>
  448. {block:IfHighResLink}{block:HighRes}<font size="1px"><a href="{PhotoURL-HighRes}">high resolution &rarr;</a></font>{/block:HighRes}{/block:IfHighResLink}
  449. {block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
  450. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  451. {Caption}
  452. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  453. {/block:Photo}
  454.  
  455. {block:Photoset}
  456. {block:IfNotLargerPosts}<div class="photo">{Photoset-400}</div>{/block:IfNotLargerPosts}
  457. {block:IfLargerPosts}<div class="photo">{Photoset-500}</div>{/block:IfLargerPosts}
  458. {block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
  459. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  460. {Caption}
  461. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  462. {/block:Photoset}
  463.  
  464. {block:Quote}
  465. <div class="quote">&#10077;</div>
  466. <h2>{Quote}</h2>
  467. {block:Source}<p align="right">{Source} &mdash;</p>{/block:Source}
  468. {/block:Quote}
  469.  
  470. {block:Link}
  471. <h1><a href="{URL}" target="{Target}">{Name}</a></h1>
  472. {block:Description}{Description}{/block:Description}
  473. {/block:Link}
  474.  
  475. {block:Chat}
  476. {block:Title}<h1>{Title}</h1>{/block:Title}
  477. {block:Lines}
  478. {block:Label}
  479. <b>{Label}</b>
  480. {/block:Label}
  481. {Line}<br />
  482. {/block:Lines}
  483. {/block:Chat}
  484.  
  485. {block:Audio}
  486. {block:AlbumArt}
  487. <div class="audio"><img src="{AlbumArtURL}" alt=""></div>
  488. {/block:AlbumArt}
  489. {AudioPlayerGrey}
  490. <b>{FormattedPlayCount}</b> plays
  491. {block:IfShowCaptions}{block:Caption}<br />{Caption}{/block:Caption}{/block:IfShowCaptions}
  492. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}<br />
  493. {Caption}
  494. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  495. {/block:Audio}
  496.  
  497. {block:Video}
  498. {block:IfNotLargerPosts}{Video-400}{/block:IfNotLargerPosts}
  499. {block:IfLargerPosts}{Video-500}{/block:IfLargerPosts}
  500. <center><i>{FormattedPlayCount}</i> plays</center><br />
  501. {block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
  502. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  503. {Caption}
  504. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  505. {/block:Video}
  506.  
  507. {block:Answer}
  508. {Asker} <b>sent:</b> {Question}<br /><br />
  509. {Answer}
  510. {/block:Answer}
  511.  
  512. </div>
  513. </div>
  514.  
  515. {block:PermalinkPage}
  516. <div class="permalink">
  517. <center><div id="date">{block:Date}posted {12Hour}:{Minutes} {AmPm} on {DayOfWeek}, {Month} {DayOfMonth}, {Year}{/block:Date} {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}</div>{block:RebloggedFrom}<b>origin:</b> <a href="{ReblogRootURL}">{ReblogRootName}</a> &nbsp;|&nbsp; <b>via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br />{/block:RebloggedFrom}
  518. {block:HasTags}<b>tags &raquo;</b> {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}{/block:HasTags}</center>
  519. {block:PostNotes}
  520. {PostNotes}
  521. {/block:PostNotes}
  522. </div>
  523. {/block:PermalinkPage}
  524.  
  525. {/block:Posts}
  526. </div>
  527.  
  528. </div>
  529.  
  530. </div>
  531. </body>
  532. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!