Advertisement
befuddlement

befuddlement first theme

Nov 12th, 2012
5,438
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.19 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. first 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="#fcfcfc"/>
  15. <meta name="color:sidelinks" content="#ffffff"/>
  16. <meta name="color:sidelinkshov" content="#f8f8f8"/>
  17. <meta name="color:text" content="#b5b5b5"/>
  18. <meta name="color:link" content="#d6c1a0"/>
  19. <meta name="color:link hover" content="#e0e0e0"/>
  20. <meta name="color:border" content="#f2f2f2"/>
  21. <meta name="color:bold" content="#d6c1a0"/>
  22.  
  23. <meta name="image:side" content=""/>
  24. <meta name="image:side2" content=""/>
  25. <meta name="image:background" content=""/>
  26.  
  27. <meta name="if:Hover Link" content="0"/>
  28.  
  29. <meta name="text:Link1" content="/" />
  30. <meta name="text:Link1 Title" content="link 1" />
  31. <meta name="text:Link2" content="/" />
  32. <meta name="text:Link2 Title" content="link 2" />
  33. <meta name="text:Link3" content="/" />
  34. <meta name="text:Link3 Title" content="link 3" />
  35. <meta name="text:Link4" content="/" />
  36. <meta name="text:Link4 Title" content="link 4" />
  37. <meta name="text:Drop height" content="90"/>
  38. <meta name="text:Drop name" content="hover link"/>
  39. <meta name="text:Title sub" content="sub title"/>
  40.  
  41. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
  42.  
  43. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  44. <style>
  45. div#qTip {
  46. padding: 4px;
  47. border-right-width: 2px;
  48. border-bottom-width: 2px;
  49. display: none;
  50. font: 8px cambria;
  51. text-align: left;
  52. position: absolute;
  53. z-index: 1000;
  54. background: #ffffff;
  55. color:{color:link};
  56. border: 1px solid #f2f2f2;
  57. border-radius: 1px;
  58. text-transform:uppercase;
  59. letter-spacing: 1px;
  60. }
  61. </style>
  62.  
  63.  
  64. <style type="text/css">
  65.  
  66. /*--- S C R O L L B A R ---*/
  67.  
  68. ::-webkit-scrollbar-thumb:vertical {background-color:{color:link}; border: 1px solid #EEEEEE; height:10px;}
  69. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:link}; border: 1px solid #EEEEEE; height:10px!important;}
  70. ::-webkit-scrollbar {background-color:{color:background}; height:10px; width:10px;}
  71.  
  72.  
  73. /*--- B A S E ---*/
  74.  
  75. body {
  76. background-color:{color:background};
  77. background-image:url('{image:Background}');
  78. background-attachment:fixed;
  79. background-repeat:repeat;
  80. margin:0px;
  81. color:{color:text};
  82. font-family: cambria, georgia;
  83. font-size:10px;
  84. line-height:110%;
  85. font-style: none;
  86. }
  87.  
  88. a:link, a:visited, a:active {
  89. color: {color:link};
  90. text-decoration: none;
  91. font-weight: normal;
  92. }
  93.  
  94. a:hover {
  95. color: {color:link hover};
  96. text-decoration: none;
  97. font-weight: normal;
  98. -webkit-transition: opacity 0.7s linear;
  99. opacity: 0.7s;
  100. -webkit-transition: all 0.6s ease-out;
  101. -moz-transition: all 0.6s ease-out;
  102. transition: all 0.6s ease-out;
  103. }
  104.  
  105. b {
  106. color:{color:bold};
  107. }
  108.  
  109. h1 {
  110. font-family:cambria,georgia;
  111. font-size:12px;
  112. letter-spacing:2px;
  113. line-height:110%;
  114. text-transform:uppercase;
  115. font-style:normal;
  116. font-weight:normal;
  117. }
  118.  
  119. h2 {
  120. font-family:georgia;
  121. font-size:11px;
  122. letter-spacing:1px;
  123. font-style:italic;
  124. font-weight:normal;
  125. }
  126.  
  127. blockquote {
  128. padding:5px 10px 10px 10px;
  129. margin-left:0px;
  130. width:480px;
  131. overflow:hidden;
  132. background-color:#fcfcfc;
  133. }
  134.  
  135.  
  136. /*--- S I D E ---*/
  137.  
  138. #title2 {
  139. color:{color:text};
  140. background-color:{color:sidelinks};
  141. font-style: cambria, georgia;
  142. letter-spacing:3px;
  143. text-transform:uppercase;
  144. text-align:center;
  145. font-size:9px;
  146. margin-top:1px;
  147. margin-left:25px;
  148. padding:8px 0px 2px 0px;
  149. width:150px;
  150. z-index:100;
  151. }
  152.  
  153. .titlesub {
  154. color:{color:text};
  155. background-color:{color:sidelinks};
  156. font-style: georgia;
  157. letter-spacing:2px;
  158. text-transform:lowercase;
  159. font-style:italic;
  160. text-align:center;
  161. font-size:9px;
  162. margin-top:0px;
  163. margin-left:25px;
  164. padding:0px 0px 7px 0px;
  165. width:150px;
  166. z-index:100
  167. }
  168.  
  169.  
  170. #sidebar {
  171. width:200px;
  172. height:1000%;
  173. position:fixed;
  174. margin-left:47px;
  175. margin-top:-50px;
  176. padding-top:50px;
  177. border-left: 1px solid #f8f8f8;
  178. border-right: 1px solid #f8f8f8;
  179. background-color:{color:side};
  180. }
  181.  
  182. #sidebarimage {
  183. width 150px;
  184. }
  185.  
  186. #sidebarimage img {
  187. width:150px;
  188. margin-left:25px;
  189. -moz-border-radius-topleft: 75px;
  190. -moz-border-radius-topright:75px;
  191. -moz-border-radius-bottomleft:75px;
  192. -moz-border-radius-bottomright:75px;
  193. -webkit-border-top-left-radius:75px;
  194. -webkit-border-top-right-radius:75px;
  195. -webkit-border-bottom-left-radius:75px;
  196. -webkit-border-bottom-right-radius:75px;
  197. border-top-left-radius:75px;
  198. border-top-right-radius:75px;
  199. border-bottom-left-radius:75px;
  200. border-bottom-right-radius:75px;
  201. -webkit-transition: all 0.9s ease-in-out;
  202. -moz-transition: all 0.9s ease-in-out;
  203. -transition: all 0.9s ease-in-out;
  204. }
  205.  
  206. .sidebarimage2 {
  207. opacity:0;
  208. margin-top:-152px;
  209. position:fixed;
  210. z-index:1;
  211. -webkit-transition: all 0.9s ease-in-out;
  212. -moz-transition: all 0.9s ease-in-out;
  213. -transition: all 0.9s ease-in-out;
  214. }
  215.  
  216. .sidebarimage2:hover {
  217. opacity:1;
  218. -webkit-transition: all 0.9s ease-in-out;
  219. -moz-transition: all 0.9s ease-in-out;
  220. -transition: all 0.9s ease-in-out;
  221. }
  222.  
  223. /*--- D E S C R I P T I O N ---*/
  224.  
  225. .desc {
  226. width:120px;
  227. margin-left:25px;
  228. text-align:center;
  229. font-family: georgia;
  230. font-size:8px;
  231. font-style:italic;
  232. letter-spacing:1px;
  233. background-color:{color:sidelinks};
  234. margin-bottom:2px;
  235. padding:8px 15px 7px 15px;
  236. }
  237.  
  238. /*--- N A V I G A T I O N ---*/
  239.  
  240. #sidelink a {
  241. width:150px;
  242. margin-left:25px;
  243. display:block;
  244. background-color:{color:sidelinks};
  245. font-size:8px;
  246. font-family: cambria, georgia;
  247. color:{color:link};
  248. letter-spacing: 2px;
  249. text-align:center;
  250. text-transform: uppercase;
  251. margin-bottom: 2px;
  252. padding:8px 0px 7px 0px;}
  253.  
  254. #sidelink a:hover {
  255. background-color:{color:sidelinkshov};
  256. color:{color:link hover};
  257. -webkit-transition: opacity 0.7s linear;
  258. opacity: 0.7s;
  259. -webkit-transition: all 0.6s ease-out;
  260. -moz-transition: all 0.6s ease-out;
  261. transition: all 0.6s ease-out;}
  262.  
  263. /*--- D R O P B O X ---*/
  264.  
  265. #drop {
  266. height: 20px;
  267. width:150px;
  268. overflow:hidden;
  269. font-family:cambria;
  270. font-size:8px;
  271. padding-top:8px;
  272. letter-spacing:1px;
  273. text-transform:uppercase;
  274. background-color:{color:sidelinks};
  275. color:{color:link};
  276. text-align:center;
  277. margin-left:25px;
  278. transition: all 0.8s ease-out;
  279. -o-transition: all 0.8s ease-out;
  280. -webkit-transition: all 0.8s ease-out;
  281. -moz-transition: all 0.8s ease-out;}
  282.  
  283. #drop:hover {
  284. height: {text:Drop height}px;
  285. background-color:{color:sidelinkshov};
  286. transition: all 0.8s ease-out;
  287. -o-transition: all 0.8s ease-out;
  288. -webkit-transition: all 0.8s ease-out;
  289. -moz-transition: all 0.8s ease-out;}
  290.  
  291.  
  292. /*--- P A G I N A T I O N ---*/
  293.  
  294. #pagination {
  295. width:150px;
  296. font-family:georgia;
  297. text-align:center;
  298. font-size:8px;
  299. margin-bottom:2px;
  300. margin-left:25px;
  301. text-transform:none;
  302. font-style:none;
  303. text-transform: lowercase;
  304. }
  305.  
  306. .pagination a {
  307. padding: 2px 4px 2px 4px;
  308. color:{color:link};
  309. font-style:italic;}
  310.  
  311. .pagination a:visited {color:{color:link}; text-decoration:none;}
  312.  
  313. .pagination a:hover {color:{color:link hover};}
  314.  
  315. /*--- E N T R I E S ---*/
  316.  
  317. #entries {
  318. margin-top:50px;
  319. width:522px;
  320. top:5px;
  321. text-align:left;
  322. margin-left:300px;
  323. padding:0px;
  324. }
  325.  
  326. #post {
  327. margin-bottom:55px;
  328. width:500px;
  329. padding-top:10px;
  330. padding-left:10px;
  331. padding-bottom:0px;
  332. padding-right:10px;
  333. background-color: {color:entries};
  334. border:1px solid {color:border};
  335. border-radius: 0px 0px 10px 10px;
  336. }
  337.  
  338. /*--- I N F O ---*/
  339.  
  340. #info {
  341. text-transform:uppercase;
  342. font-family:cambria;
  343. font-size: 8px;
  344. width:503px;
  345. margin-left:-10px;
  346. margin-top:10px;
  347. border-top:1px solid {color:border};
  348. text-align:left;
  349. padding-top:2px;
  350. padding-bottom:3px;
  351. padding-right:9px;
  352. padding-left:9px;
  353. color:{color:text};
  354.  
  355. }
  356.  
  357. #info a:link {
  358. color:{color:link};
  359. }
  360.  
  361. #info a:hover {
  362. color:{color:link hover};
  363. -webkit-transition: opacity 0.7s linear;
  364. opacity: 0.7s;
  365. -webkit-transition: all 0.6s ease-out;
  366. -moz-transition: all 0.6s ease-out;
  367. transition: all 0.6s ease-out;
  368. }
  369.  
  370.  
  371. /*--- T A G S ---*/
  372.  
  373. #tags {
  374. width:513px;
  375. margin-left:-10px;
  376. text-transform:lowercase;
  377. text-align:center;
  378. font-style:italic;
  379. letter-spacing:1px;
  380. line-height:10px;
  381. padding:4px;
  382. background-color: {color:side};
  383. border-top: 1px solid {color:border};
  384. border-radius: 0px 0px 10px 10px;
  385. }
  386.  
  387. #tags a:hover {
  388. color:{color:link hover};
  389. -webkit-transition: opacity 0.7s linear;
  390. opacity: 0.7s;
  391. -webkit-transition: all 0.6s ease-out;
  392. -moz-transition: all 0.6s ease-out;
  393. transition: all 0.6s ease-out;
  394. }
  395.  
  396. /*--- C R E D I T ---*/
  397.  
  398. .credit {
  399. padding:6px;
  400. color:{color:links};
  401. border:1px solid #f8f8f8;
  402. background-color:#fcfcfc;
  403.  
  404. #ask {
  405. float:left;
  406. margin-right:5px;
  407. }
  408.  
  409. {CustomCSS}</style>
  410.  
  411.  
  412. </head><body>
  413.  
  414. <div id="sidebar">
  415. <div id="title2">{Title}</div>
  416. <div class="titlesub">{text:Title sub}</div></br>
  417. <div id="sidebarimage">
  418. <a href="/"><img src="{image:side}" /></a>
  419. <div class="sidebarimage2">
  420. <a href="/"><img src="{image:side2}" /></a>
  421. </a></div></br></br>
  422. <div class="desc">
  423. {Description}</div>
  424. <div id="sidelink">
  425. <a href="/">refresh</a>
  426. <a href="/ask">message</a>
  427. {block:ifLink1}<a href="{text:Link1}">{text:Link1 Title}</a>{/block:ifLink1}
  428. {block:ifLink2}<a href="{text:Link2}">{text:Link2 Title}</a>{/block:ifLink2}
  429. {block:ifLink3}<a href="{text:Link3}">{text:Link3 Title}</a>{/block:ifLink3}
  430. {block:ifLink4}<a href="{text:Link4}">{text:Link4 Title}</a>{/block:ifLink4}</div>
  431. {block:ifHoverLink}
  432. <div id="drop">
  433. <a style="margin-top: 1px; margin-left:0px; ">{text:Drop name}</a>
  434. <div class="substuff" style="font-size:8px; color:{color:text}; font-family:georgia; text-transform:lowercase; font-style:italic; letter-spacing:1px; text-align:center;padding:0px 10px 5px 10px;"><br />
  435. <!--- H O V E R L I N K C O N T E N T --->
  436. hover link content! list fandoms or put whatever you like.
  437. <!--- H O V E R L I N K C O N T E N T E N D --->
  438. </div>
  439. {/block:ifHoverLink}
  440. </div>
  441. </br>
  442.  
  443.  
  444.  
  445.  
  446. <div id="pagination">
  447. {block:Pagination}<div class="pagination">
  448. {block:PreviousPage}<a href="{PreviousPage}">←</a>{/block:PreviousPage}
  449. {block:JumpPagination length="3"}{block:CurrentPage}
  450. <span class="current_page" style="padding-right:3px;padding-left:3px;">{PageNumber}</span>
  451. {/block:CurrentPage}
  452. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}
  453. {/block:JumpPagination}
  454. {block:NextPage}<a href="{NextPage}">β†’</a> {/block:NextPage}
  455. </div>{/block:Pagination}
  456. </div>
  457.  
  458.  
  459. </div>
  460.  
  461.  
  462.  
  463. </div>
  464.  
  465. <div id="entries">{block:Posts}<div id="post">
  466. {block:ContentSource}
  467. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  468. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  469. {/block:SourceLogo}
  470. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  471. {/block:ContentSource}
  472.  
  473. {block:Text}<h1><center>{block:Title}{Title}{/block:Title}</center></h1>{Body}{/block:Text}
  474.  
  475. {block:Photo}{LinkOpenTag}<center><img src="{PhotoURL-500}"></center>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  476.  
  477. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  478.  
  479. {block:Quote}<h2>"{Quote}"</h2>{block:Source} β€”{Source}{/block:Source}{/block:Quote}
  480.  
  481. {block:Link}<h1><center><a href="{URL}" {Target}>{Name}</a></center></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  482.  
  483. {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}
  484.  
  485. {block:Audio}{AudioPlayerWhite}{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  486.  
  487. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  488.  
  489. {block:Answer}<div id="ask"><img src="{AskerPortraitURL-0}"></div><h2>{Asker} asked: {Question}</h2>{Answer}{/block:Answer}
  490.  
  491.  
  492. <div id="info"><table><tr><td width="250px" style="font-size:8px;">{block:Date}<a href="{Permalink}">{ShortMonth} {DayofMonth}</a> {/block:Date} {block:NoteCount}| <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> | <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a> <br>{/block:RebloggedFrom}</td></tr></table></div>
  493. <div id="tags">{block:HasTags}{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  494.  
  495. </div>
  496.  
  497.  
  498.  
  499. </div>
  500.  
  501. {block:PostNotes}{PostNotes}{/block:PostNotes}
  502. {/block:Posts}
  503.  
  504. <div style="text-align:right; position:fixed; bottom:10px; right:15px;"><div class="credit"><a href="http://befuddlement.tumblr.com/">TH</a></div></div>
  505.  
  506. </div>
  507.  
  508. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement