Advertisement
befuddlement

befuddlement third theme

Dec 6th, 2012
6,304
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.57 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4.  
  5. <!--- obligatory theft warning:if you steal this theme i will send a llama to eat you. please don’t remove the credit. third theme by hannah at befuddlement.tumblr.com --->
  6.  
  7. <title>{Title}</title>
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  10. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  11.  
  12. <meta name="color:background" content="#ffffff"/>
  13. <meta name="color:entries" content="#ffffff"/>
  14. <meta name="color:side" content="#ffffff"/>
  15. <meta name="color:sidebox" content="#ffffff"/>
  16. <meta name="color:sidebox border" content="#f2f2f2"/>
  17. <meta name="color:text" content="#b5b5b5"/>
  18. <meta name="color:link" content="#c5c0c1"/>
  19. <meta name="color:link hover" content="#e0e0e0"/>
  20. <meta name="color:linkbar" content="#000000"/>
  21. <meta name="color:sidelinks" content="#000000"/>
  22. <meta name="color:sidelinkshov" content="#ffffff"/>
  23. <meta name="color:border" content="#f8f8f8"/>
  24. <meta name="color:tag line" content="#f8f8f8"/>
  25. <meta name="color:bold" content="#e0e0e0"/>
  26.  
  27. <meta name="image:side" content=""/>
  28. <meta name="image:sidebar" content=""/>
  29. <meta name="image:background" content=""/>
  30.  
  31. <meta name="if:sidebox image" content="0">
  32.  
  33. <meta name="text:Link1" content="/" />
  34. <meta name="text:Link1 Title" content="link 1" />
  35. <meta name="text:Link2" content="/" />
  36. <meta name="text:Link2 Title" content="link 2" />
  37. <meta name="text:Link3" content="/" />
  38. <meta name="text:Link3 Title" content="link 3" />
  39. <meta name="text:Link4" content="/" />
  40. <meta name="text:Link4 Title" content="link 4" />
  41. <meta name="text:Sidebox Margin Top" content="200"/>
  42. <meta name="text:Linkbar Padding Top" content="80"/>
  43.  
  44.  
  45. <link href='http://fonts.googleapis.com/css?family=Homemade+Apple' rel='stylesheet' type='text/css'>
  46.  
  47.  
  48.  
  49.  
  50. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
  51.  
  52. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  53. <style>
  54. div#qTip {
  55. padding: 4px;
  56. border-right-width: 2px;
  57. border-bottom-width: 2px;
  58. display: none;
  59. font: 8px cambria;
  60. text-align: left;
  61. position: absolute;
  62. z-index: 1000;
  63. background: #ffffff;
  64. color:{color:link};
  65. border: 1px solid {color:border};
  66. border-radius: 1px;
  67. text-transform:uppercase;
  68. letter-spacing: 1px;
  69. }
  70. </style>
  71.  
  72.  
  73. <style type="text/css">
  74.  
  75. /*--- S C R O L L B A R ---*/
  76.  
  77. ::-webkit-scrollbar, ::-webkit-scrollbar-corner{background-color:{color:background};width:10px;height:10px;}
  78. ::-webkit-scrollbar-thumb{background:{color:linkbar};}
  79. ::-webkit-scrollbar-button{background:{color:linkbar};width:10px;height:10px;}
  80.  
  81.  
  82.  
  83. /*--- B A S E ---*/
  84.  
  85. body {
  86. background-color:{color:background};
  87. background-image:url('{image:Background}');
  88. background-attachment:fixed;
  89. background-repeat:repeat;
  90. margin:0px;
  91. color:{color:text};
  92. font-family: cambria, georgia;
  93. font-size:10px;
  94. line-height:110%;
  95. font-style: none;
  96. }
  97.  
  98. a:link, a:visited, a:active {
  99. color: {color:link};
  100. text-decoration: none;
  101. font-weight: normal;
  102. }
  103.  
  104. a:hover {
  105. color: {color:link hover};
  106. text-decoration: none;
  107. font-weight: normal;
  108. -webkit-transition: opacity 0.7s linear;
  109. opacity: 0.7s;
  110. -webkit-transition: all 0.6s ease-out;
  111. -moz-transition: all 0.6s ease-out;
  112. transition: all 0.6s ease-out;
  113. }
  114.  
  115. b {
  116. color:{color:bold};
  117. }
  118.  
  119. h1 {
  120. font-family:cambria,georgia;
  121. font-size:11px;
  122. letter-spacing:2px;
  123. line-height:170%;
  124. text-transform:uppercase;
  125. font-style:normal;
  126. font-weight:normal;
  127. border:1px solid {color:border};
  128. background-color:{color:background};
  129. }
  130.  
  131. h2 {
  132. font-family:georgia;
  133. font-size:14px;
  134. line-height:130%;
  135. letter-spacing:1px;
  136. padding-left:10px;
  137. padding-right:10px;
  138. font-style:italic;
  139. font-weight:normal;
  140. }
  141.  
  142. blockquote {
  143. padding:5px 10px 5px 9px;
  144. margin-left:0px;
  145. width:480px;
  146. overflow:hidden;
  147. background-color:{color:entries};
  148. border-left: 1px solid #dadada;
  149. }
  150.  
  151.  
  152.  
  153.  
  154. /*--- S I D E ---*/
  155.  
  156. #title2 {
  157. color:{color:text};
  158. font-family:'Homemade Apple', cursive;
  159. letter-spacing:2px;
  160. text-shadow:#eeeeee 0px 1px 1px;
  161. text-transform:lowercase;
  162. text-align:center;
  163. font-size:14px;
  164. margin-top:1px;
  165. padding:2px 0px 8px 0px;
  166. width:195px;
  167. z-index:100;
  168. }
  169.  
  170.  
  171. #sidebar {
  172. width:350px;
  173. height:1000%;
  174. position:fixed;
  175. background-color:{color:side};
  176. background-image:url('{image:sidebar}');
  177. }
  178.  
  179. #side {
  180. width:195px;
  181. margin-top:{text:sidebox margin top}px;
  182. margin-left:60px;
  183. padding:15px;
  184. border:4px double {color:sidebox border};
  185. background-color:{color:sidebox};
  186. }
  187.  
  188.  
  189. #sidebarimage {
  190. width 175px;
  191. }
  192.  
  193. #sidebarimage img {
  194. width:195px;
  195. padding-bottom:5px;
  196. background-color:#ffffff;
  197. -webkit-transition: all 0.9s ease-in-out;
  198. -moz-transition: all 0.9s ease-in-out;
  199. -transition: all 0.9s ease-in-out;
  200. }
  201.  
  202. #sidebarimage img:hover {
  203. opacity:.8;
  204. -webkit-transition: all 0.9s ease-in-out;
  205. -moz-transition: all 0.9s ease-in-out;
  206. -transition: all 0.9s ease-in-out;
  207. }
  208.  
  209. /*--- D E S C R I P T I O N ---*/
  210.  
  211. .desc {
  212. width:165px;
  213. text-align:center;
  214. font-family: georgia;
  215. font-size:9px;
  216. font-style:none;
  217. letter-spacing:0px;
  218. margin-top:5px;
  219. margin-bottom:2px;
  220. padding:0px 15px 7px 15px;
  221. }
  222.  
  223. /*--- N A V I G A T I O N ---*/
  224.  
  225. #linkbar {
  226. width:60px;
  227. height:1000%;
  228. margin-top:-20px;
  229. padding-top:{text:linkbar padding top}px;
  230. position:fixed;
  231. margin-left:350px;
  232. border-left:4px solid #ffffff;
  233. background-color:{color:linkbar};
  234. }
  235.  
  236. #sidelink a {
  237. width:60px;
  238. display:block;
  239. background-color:{color:sidelinks};
  240. font-size:8px;
  241. font-family: calibri, arial;
  242. color:{color:link};
  243. letter-spacing: 2px;
  244. text-align:center;
  245. text-transform: uppercase;
  246. padding:15px 0px 14px 0px;
  247. -webkit-transition: opacity 0.7s linear;
  248. opacity: 0.7s;
  249. -webkit-transition: all 0.6s ease-out;
  250. -moz-transition: all 0.6s ease-out;
  251. transition: all 0.6s ease-out;}
  252.  
  253. #sidelink a:hover {
  254. background-color:{color:sidelinkshov};
  255. color:{color:link hover};
  256. -webkit-transition: opacity 0.7s linear;
  257. opacity: 0.7s;
  258. -webkit-transition: all 0.6s ease-out;
  259. -moz-transition: all 0.6s ease-out;
  260. transition: all 0.6s ease-out;}
  261.  
  262.  
  263.  
  264. /*--- P A G I N A T I O N ---*/
  265.  
  266. #pagination {
  267. width:195px;
  268. font-family:georgia;
  269. text-align:center;
  270. font-size:8px;
  271. margin-bottom:2px;
  272. text-transform:none;
  273. font-style:none;
  274. text-transform: lowercase;
  275. }
  276.  
  277. .pagination a {
  278. padding: 2px 4px 2px 4px;
  279. color:{color:link};
  280. font-style:italic;}
  281.  
  282. .pagination a:visited {color:{color:link}; text-decoration:none;}
  283.  
  284. .pagination a:hover {color:{color:link hover};}
  285.  
  286. /*--- E N T R I E S ---*/
  287.  
  288. #entries {
  289. margin-top:0px;
  290. width:522px;
  291. top:5px;
  292. text-align:left;
  293. margin-left:480px;
  294. padding-right:50px;
  295. padding-top:50px;
  296. }
  297.  
  298. #post {
  299. margin-bottom:55px;
  300. width:500px;
  301. padding-top:15px;
  302. padding-left:15px;
  303. padding-right:15px;
  304. padding-bottom:0px;
  305. background-color: {color:entries};
  306. border:1px solid {color:border};
  307. -webkit-box-shadow: 0px 0px 0px 0px #cecece;
  308. -moz-box-shadow: 0px 0px 0px 0px #cecece;
  309. box-shadow: 0px 0px 0px 0px #cecece;
  310.  
  311. }
  312.  
  313. /*--- I N F O ---*/
  314.  
  315. #info {
  316. opacity:1;
  317. text-transform:uppercase;
  318. letter-spacing:1px;
  319. line-height:4px;
  320. font-size: 8px;
  321. width:498px;
  322. margin-left:0px;
  323. margin-top:10px;
  324. border-top:2px solid {color:tag line};
  325. text-align:left;
  326. padding-bottom:3px;
  327. padding-right:1px;
  328. padding-left:1px;
  329. color:{color:text};
  330. }
  331.  
  332. #info a {
  333. opacity:0;
  334. -webkit-transition: opacity 0.7s linear;
  335. opacity: 0.7s;
  336. -webkit-transition: all 0.6s ease-out;
  337. -moz-transition: all 0.6s ease-out;
  338. transition: all 0.6s ease-out;
  339. }
  340.  
  341. #info a:link {
  342. color:{color:link};
  343.  
  344. }
  345.  
  346. #info a:hover {
  347. color:{color:link hover};
  348. -webkit-transition: opacity 0.7s linear;
  349. opacity: 0.7s;
  350. -webkit-transition: all 0.6s ease-out;
  351. -moz-transition: all 0.6s ease-out;
  352. transition: all 0.6s ease-out;
  353. }
  354.  
  355. #post:hover #info a {opacity:1;
  356. -webkit-transition: opacity 0.7s linear;
  357. opacity: 0.7s;
  358. -webkit-transition: all 0.6s ease-out;
  359. -moz-transition: all 0.6s ease-out;
  360. transition: all 0.6s ease-out}
  361.  
  362. /*--- T A G S ---*/
  363.  
  364. #tags {
  365. width:490px;
  366. margin-top:-5px;
  367. font-family:cambria;
  368. text-transform:lowercase;
  369. font-style:italic;
  370. text-align:center;
  371. font-size:9px;
  372. letter-spacing:1px;
  373. line-height:11px;
  374. padding:3px 0px 12px 0px;
  375. background-color: {color:entries};
  376. }
  377.  
  378. #tags a {
  379. padding:2px 0px;
  380. }
  381.  
  382. #tags a:hover {
  383. color:{color:link hover};
  384. -webkit-transition: opacity 0.7s linear;
  385. opacity: 0.7s;
  386. -webkit-transition: all 0.6s ease-out;
  387. -moz-transition: all 0.6s ease-out;
  388. transition: all 0.6s ease-out;
  389. }
  390.  
  391. /*--- C R E D I T ---*/
  392.  
  393. .credit {
  394. padding:6px;
  395. color:{color:links};
  396. border:3px double #f2f2f2;
  397. background-color: {color:side};
  398. -webkit-transition: opacity 0.7s linear;
  399. opacity: 0.7s;
  400. -webkit-transition: all 0.6s ease-out;
  401. -moz-transition: all 0.6s ease-out;
  402. transition: all 0.6s ease-out;
  403. }
  404.  
  405. /*--- O T H E R ---*/
  406.  
  407. #ask {
  408. float:left;
  409. margin-right:5px;
  410. }
  411.  
  412. .qsource {
  413. text-align:right;
  414. }
  415.  
  416.  
  417. .playerbutton {
  418. width:38px;
  419. height:38px;
  420. padding-top:12px;
  421. padding-left:12px;
  422. overflow:hidden;
  423. }
  424.  
  425.  
  426. .player {
  427. opacity:.5;
  428. background-color: #ffffff;
  429. position: absolute;
  430. z-index: 1000;
  431. }
  432.  
  433.  
  434. .audio{
  435. position:absolute;
  436. width:20px;
  437. height:20px;
  438. }
  439.  
  440.  
  441. .albumcover{
  442. width:50px;
  443. height:50px;
  444. position:absolute;
  445. }
  446.  
  447.  
  448. .albumcover img{
  449. float:left;
  450. opacity:1;
  451. width:50px;
  452. }
  453.  
  454.  
  455. .audioinfo{
  456. margin-top: 2px;
  457. margin-left:10px;
  458. height: 40px;
  459. display:block;
  460. width:381px;
  461. text-align: left;
  462. padding-left: 50px;
  463. padding-right:10px;
  464. }
  465.  
  466. ol.notes {padding: 0px; margin: 25px 0px; list-style-type: none; border: solid 0px #fcfcfc; text-transform: normal; letter-spacing: 0px; text-align: left; font-style: normal;}
  467.  
  468. ol.notes li.note {border-top: solid 1px #f2f2f2; padding: 3px;}
  469.  
  470. ol.notes li.note img.avatar {vertical-align: -6px; margin-right: 10px; width: 18px; height: 18px; opacity:.7;}
  471.  
  472. ol.notes li.note span.action {font-style: normal;}
  473.  
  474. ol.notes li.note .answer_content {font-weight: normal;}
  475.  
  476. ol.notes li.note blockquote {color: {color:text}; background-color: #f8f8f8; padding: 4px 10px; margin: 10px 0px 0px 25px;}
  477.  
  478. ol.notes li.note blockquote a {text-decoration: none; font-weight: bold;}
  479.  
  480. {CustomCSS}</style>
  481.  
  482.  
  483. </head><body>
  484.  
  485. <div id="sidebar">
  486. <div id="side">
  487. <div id="title2">{Title}</div>
  488. <div class="titlesub">{text:Title sub}</div>
  489. {block:ifsideboximage}
  490. <div id="sidebarimage">
  491. <a href="/"><img src="{image:side}" /></a>
  492. </div>{/block:ifsideboximage}
  493. <div class="desc">
  494. {Description}</div>
  495. <div id="pagination">
  496. {block:Pagination}<div class="pagination">
  497. {block:PreviousPage}<a href="{PreviousPage}">←</a>{/block:PreviousPage}
  498. {block:JumpPagination length="5"}{block:CurrentPage}
  499. <span class="current_page" style="padding-right:3px;padding-left:3px;">{PageNumber}</span>
  500. {/block:CurrentPage}
  501. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}
  502. {/block:JumpPagination}
  503. {block:NextPage}<a href="{NextPage}">→</a> {/block:NextPage}
  504. </div>{/block:Pagination}
  505.  
  506. </div></div>
  507. </br>
  508.  
  509.  
  510.  
  511. </div>
  512.  
  513. <div id="linkbar">
  514. <div id="sidelink">
  515. <a href="/">home</a>
  516. <a href="/ask">ask</a>
  517. {block:ifLink1}<a href="{text:Link1}">{text:Link1 Title}</a>{/block:ifLink1}
  518. {block:ifLink2}<a href="{text:Link2}">{text:Link2 Title}</a>{/block:ifLink2}
  519. {block:ifLink3}<a href="{text:Link3}">{text:Link3 Title}</a>{/block:ifLink3}
  520. {block:ifLink4}<a href="{text:Link4}">{text:Link4 Title}</a>{/block:ifLink4}</div><div>
  521.  
  522. </div></div>
  523.  
  524. <div id="entries">{block:Posts}<div id="post">
  525. {block:ContentSource}
  526. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  527. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  528. {/block:SourceLogo}
  529. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  530. {/block:ContentSource}
  531.  
  532. {block:Text}<h1><center>{block:Title}{Title}{/block:Title}</center></h1>{Body}{/block:Text}
  533.  
  534. {block:Photo}{LinkOpenTag}<center><img src="{PhotoURL-500}"></center>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  535.  
  536. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  537.  
  538. {block:Quote}<h2>"{Quote}"</h2>
  539. {block:Source}<div class="qsource"> —{Source}</div>{/block:Source}{/block:Quote}
  540.  
  541. {block:Link}<h1><center><a href="{URL}" {Target}>{Name} →</a></center></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  542.  
  543. {block:Chat}{block:Title}<h1><center>{Title}</center></h1>{/block:Title}<div style="line-height:14.5px;">{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}</div>{/block:Chat}
  544.  
  545. {block:Audio}
  546. <div class="audio">
  547. <div class="player"><div class="playerbutton">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div>
  548. <div class="albumcover"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>{block:AlbumArt}<div class="albumcover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  549. <div class="audioinfo">{block:TrackName}<b>Title:</b> {TrackName}{/block:TrackName}</br>
  550. {block:Artist}<b>Artist: </b>{Artist}{/block:Artist}</br>
  551. {block:Album}<b>Album:</b> {Album}{/block:Album} </br>
  552. <b>Played:</b>{PlayCount} times
  553. </div><br>{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  554.  
  555. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  556.  
  557. {block:Answer}<div id="ask"><img src="{AskerPortraitURL-0}"></div><h2>{Asker} asked: {Question}</h2>{Answer}{/block:Answer}
  558.  
  559.  
  560. <div id="info"><table><tr><td width="250px" style="font-size:8px;">{block:Date}<a href="{Permalink}">&nbsp;{ShortMonth} {DayofMonth}</a> {/block:Date} {block:NoteCount} &nbsp; <a href="{Permalink}">({NoteCount})</a>{/block:NoteCount} </td><td width="250px" style="font-size:8px; text-align: right;"> {block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}"> via</a> &nbsp; <a href="{ReblogRootURL}" title="{ReblogRootName}">(source)</a><br>{/block:RebloggedFrom}</td></tr></table></div>
  561. <div id="tags">{block:HasTags}{block:Tags}&nbsp;#<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  562.  
  563. </div>
  564.  
  565.  
  566.  
  567. </div>
  568.  
  569. {block:PostNotes}{PostNotes}{/block:PostNotes}
  570. {/block:Posts}
  571.  
  572. <div style="text-align:right; position:fixed; bottom:10px; right:15px;"><div class="credit"><a href="http://befuddlement.tumblr.com/">TH</a></div></div>
  573.  
  574.  
  575.  
  576. </div>
  577.  
  578. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement