farflunghopes

taylors

Jan 17th, 2013
493
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 38.61 KB | None | 0 0
  1. <!---Theme #16 'Taylors' by Brianna @ colorfulmetaphors.tumblr.com
  2.  
  3. Rules:
  4. 1. Do not remove the credit from the code or the theme. You may MOVE it, but leave it on the FIRST page of your blog, ie: it must be visible on the main page.
  5. 2. Do not redistribute this theme.
  6. 3. Do not steal this theme. Taking a portion of the code and adding it to your own theme/others' counts as stealing. If you want to learn how to do something, ask, and I will do my best to help you.
  7. 4. Do not use this theme as a base code.
  8. 5. If you have any problems, find glitches, or just need help, please ask me! That's not really a rule, but I'd love to help.
  9.  
  10. Help:
  11. - Theme looks best in Google Chrome.
  12. - SAVE and REFRESH the page before changing appearance options.
  13. - The background image REPEAT and POSITION can be changed under the appearance options. Select or deslect 'BackgroundImageRepeat' and enter the position in 'bgimgposition'.
  14. - The sidebar image is the home link.
  15. - There are eight extra links available. Add them under the appearance options.
  16. - This theme has two placement options for the post info (time stamp, note count, source, and reblog button). The default is beside the post. To have the info below the post, select 'BottomInfo' under the appearance options.
  17. - There are three post sizes available. For 250px posts, deselect both '400pxPosts' and '500pxPosts'.
  18. - The header, two titles, and header image are all optional. To disable them, deselect 'Header'.
  19. - The second title can be added in the appearance options.
  20. - The BODY font SIZE can be changed under the appearance options. DO NOT add 'px' after the number.
  21. - The 'highlight' and 'highlighttext' color options refer to the background and text color that appears when you click and drag the cursor.
  22.  
  23. Enjoy!
  24.  
  25. --->
  26.  
  27. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  28. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  29. <head><title>{Title}</title>
  30. <link rel="shortcut icon" href="{Favicon}">
  31. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  32. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  33.  
  34. <link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
  35.  
  36. <link href='http://fonts.googleapis.com/css?family=Satisfy' rel='stylesheet' type='text/css'>
  37.  
  38. <link href='http://fonts.googleapis.com/css?family=Allura' rel='stylesheet' type='text/css'>
  39.  
  40. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  41. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  42. <script>
  43. (function($){
  44. $(document).ready(function(){
  45. $("[title]").style_my_tooltips();
  46. });
  47. })(jQuery);
  48. </script>
  49.  
  50. <meta name="color:background" content="#ffffff"/>
  51. <meta name="color:text" content="#8b8b8b"/>
  52. <meta name="color:side text" content="#a3a3a3"/>
  53. <meta name="color:title" content="#EEEEEE"/>
  54. <meta name="color:header" content="#111111"/>
  55. <meta name="color:title scroll bg" content="#909090"/>
  56. <meta name="color:borders" content="#4d4d4d"/>
  57. <meta name="color:link" content="#333333"/>
  58. <meta name="color:link hover" content="#999999"/>
  59. <meta name="color:blockquotes" content="#a7a7a7"/>
  60. <meta name="color:tags" content="#818181"/>
  61. <meta name="color:tags hover" content="#282828"/>
  62. <meta name="color:infolink" content="#858585"/>
  63. <meta name="color:infolink hover" content="#dbdbdb"/>
  64. <meta name="color:sidelink" content="#d1d1d1"/>
  65. <meta name="color:sidelink bg" content="#313131"/>
  66. <meta name="color:posts" content="#f1f1f1"/>
  67. <meta name="color:scrollbar background" content="#dddddd"/>
  68. <meta name="color:scrollbar" content="#999999"/>
  69. <meta name="color:highlight" content="#dddddd"/>
  70. <meta name="color:highlight text" content="#111111"/>
  71.  
  72. <meta name="font:sidebar" content=""/>
  73. <meta name="font:body" content=""/>
  74.  
  75. <meta name="image:header" content=""/>
  76. <meta name="image:sidebar" content=""/>
  77. <meta name="image:background" content=""/>
  78.  
  79. <meta name="text:bodyfontsize" content="11"/>
  80. <meta name="text:bgimgposition" content="bottom right" />
  81. <meta name="text:second title" contetn="add your second title here"/>
  82. <meta name="text:link1" content="/"/>
  83. <meta name="text:link1name" content="link 1"/>
  84. <meta name="text:link2" content="/"/>
  85. <meta name="text:link2name" content="link 2"/>
  86. <meta name="text:link3" content="/"/>
  87. <meta name="text:link3name" content="link 3"/>
  88. <meta name="text:link4" content="/"/>
  89. <meta name="text:link4name" content="link 4"/>
  90. <meta name="text:link5" content="/"/>
  91. <meta name="text:link5name" content="link 5"/>
  92. <meta name="text:link6" content="/"/>
  93. <meta name="text:link6name" content="link 6"/>
  94. <meta name="text:link7" content="/"/>
  95. <meta name="text:link7name" content="link 7"/>
  96. <meta name="text:link8" content="/"/>
  97. <meta name="text:link8name" content="link 8"/>
  98.  
  99. <meta name="if:BackgroundImageRepeat" content="" />
  100. <meta name="if:BottomInfo" content=""/>
  101. <meta name="if:500pxPosts" content=""/>
  102. <meta name="if:400pxPosts" content="1"/>
  103. <meta name="if:Header" content="1"/>
  104.  
  105. <style type="text/css">
  106.  
  107. 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;}
  108. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  109.  
  110. ::-webkit-scrollbar {
  111. width: 7px;
  112. background-color:{color:scrollbar background};
  113. }
  114.  
  115. ::-webkit-scrollbar-thumb {
  116. width:7px;
  117. background-color:{color:scrollbar};
  118. }
  119.  
  120. ::selection {
  121. background: {color:highlight};
  122. color: {color:highlight text};
  123. }
  124.  
  125. #s-m-t-tooltip {
  126. z-index: 9999;
  127. background:{color:background};
  128. font-size: 7px;
  129. text-transform:uppercase;
  130. letter-spacing:1px;
  131. color:{color:text};
  132. max-width: 150px;
  133. padding: 5px 10px 5px 10px;
  134. display: block;
  135. margin: 17px 0px 0px -10px;
  136. box-shadow:3px 3px 5px;
  137. font-family: 'Droid Sans', sans-serif;
  138. }
  139.  
  140. body {
  141. background-color:{color:background};
  142. color:{color:text};
  143. font-size:{text:bodyfontsize}px;
  144. line-height:13px;
  145. font-family:{font:body};
  146. background-image:url('{image:background}');
  147. background-attachment:fixed;
  148. background-position:{text:bgimgposition};
  149. {block:IfBackgroundImageRepeat}
  150. background-repeat:repeat;
  151. {/block:IfBackgroundImageRepeat}
  152. {block:IfNotBackgroundImageRepeat}
  153. background-repeat:no-repeat;
  154. {/block:IfNotBackgroundImageRepeat}
  155. }
  156.  
  157. a {
  158. color:{color:link};
  159. text-decoration:none;
  160. outline:none;
  161. -moz-outline-style:none;
  162. -webkit-transition: all 0.6s ease-out;
  163. -o-transition: all 0.6s ease-out;
  164. -webkit-transition: all 0.6s ease-out;
  165. -moz-transition: all 0.6s ease-out;
  166. }
  167.  
  168. a:hover {
  169. color:{color:link hover};
  170. -webkit-transition: all 0.6s ease-out;
  171. -o-transition: all 0.6s ease-out;
  172. -webkit-transition: all 0.6s ease-out;
  173. -moz-transition: all 0.6s ease-out;
  174. }
  175.  
  176. blockquote {
  177. padding:1px 10px 1px 10px;
  178. border-left:1px solid {color:text};
  179. margin-left:10px;
  180. font-size:9px;
  181. word-wrap:break-word;
  182. background-color:{color:blockquotes};
  183. {block:IndexPage}
  184. {block:If500pxPosts}
  185. width:460px;
  186. {/block:If500pxPosts}
  187. {block:If400pxPosts}
  188. width:360px;
  189. {/block:If400pxPosts}
  190. {block:IfNot400pxPosts}
  191. {block:IfNot500pxPosts}
  192. width:210px;
  193. {/block:IfNot500pxPosts}
  194. {/block:IfNot400pxPosts}
  195. {/block:IndexPage}
  196. {block:PermalinkPage}
  197. width:460px;
  198. {/block:PermalinkPage}
  199. }
  200.  
  201. blockquote blockquote {
  202. padding:5px 5px 5px 5px;
  203. border-left:1px solid {color:text};
  204. background-color:{color:blockquotes};
  205. {block:IndexPage}
  206. {block:If500pxPosts}
  207. min-width:250px;
  208. width:auto;
  209. {/block:If500pxPosts}
  210. {block:If400pxPosts}
  211. min-width:200px;
  212. width:auto;
  213. {/block:If400pxPosts}
  214. {block:IfNot400pxPosts}
  215. {block:IfNot500pxPosts}
  216. min-width:100px;
  217. max-width:200px;
  218. width:auto;
  219. {/block:IfNot500pxPosts}
  220. {/block:IfNot400pxPosts}
  221. {/block:IndexPage}
  222. {block:PermalinkPage}
  223. min-width:250px;
  224. width:auto;
  225. {/block:PermalinkPage}
  226. }
  227.  
  228. blockquote img {
  229. {block:IndexPage}
  230. {block:If500pxPosts}
  231. max-width:430px;
  232. {/block:If500pxPosts}
  233. {block:If400pxPosts}
  234. max-width:330px;
  235. {/block:If400pxPosts}
  236. {block:IfNot400pxPosts}
  237. {block:IfNot500pxPosts}
  238. max-width:180px;
  239. {/block:IfNot500pxPosts}
  240. {/block:IfNot400pxPosts}
  241. {/block:IndexPage}
  242. {block:PermalinkPage}
  243. max-width:430px;
  244. {/block:PermalinkPage}
  245. }
  246.  
  247. h1 {
  248. font-size:17px;
  249. text-align:left;
  250. line-height:130%;
  251. }
  252.  
  253. h2 {
  254. text-align:center;
  255. font-style:italic;
  256. font-size:15px;
  257. }
  258.  
  259. #theme {
  260. {block:PermalinkPage}
  261. width:876px;
  262. {/block:PermalinkPage}
  263. {block:IndexPage}
  264. {block:If500pxPosts}
  265. width:876px;
  266. {/block:If500pxPosts}
  267. {block:If400pxPosts}
  268. width:776px;
  269. {/block:If400pxPosts}
  270. {block:IfNot500pxPosts}
  271. {block:IfNot400pxPosts}
  272. width:626px;
  273. {/block:IfNot400pxPosts}
  274. {/block:IfNot500pxPosts}
  275. {/block:IndexPage}
  276. margin:auto;
  277. }
  278.  
  279. #entries {
  280. margin-left:300px;
  281. {block:IndexPage}
  282. {block:If500pxPosts}
  283. width:522px;
  284. {/block:If500pxPosts}
  285. {block:If400pxPosts}
  286. width:422px;
  287. {/block:If400pxPosts}
  288. {block:IfNot400pxPosts}
  289. {block:IfNot500pxPosts}
  290. width:272px;
  291. {/block:IfNot500pxPosts}
  292. {/block:IfNot400pxPosts}
  293. {/block:IndexPage}
  294. {block:PermalinkPage}
  295. width:522px;
  296. {/block:PermalinkPage}
  297. {block:IfHeader}
  298. padding-top:240px;
  299. {/block:IfHeader}
  300. {block:IfNotHeader}
  301. padding-top:100px;
  302. {/block:IfNotHeader}
  303. }
  304.  
  305. #post {
  306. margin-bottom:40px;
  307. word-wrap:break-word;
  308. padding:10px;
  309. background-color:{color:posts};
  310. overflow:hidden;
  311. border:1px solid {color:borders};
  312. {block:IndexPage}
  313. {block:If500pxPosts}
  314. width:500px;
  315. {/block:If500pxPosts}
  316. {block:If400pxPosts}
  317. width:400px;
  318. {/block:If400pxPosts}
  319. {block:IfNot400pxPosts}
  320. {block:IfNot500pxPosts}
  321. width:250px;
  322. {/block:IfNot500pxPosts}
  323. {/block:IfNot400pxPosts}
  324. {/block:IndexPage}
  325. {block:PermalinkPage}
  326. width:500px;
  327. {/block:PermalinkPage}
  328. }
  329.  
  330. {block:IndexPage}
  331. {block:IfNotBottomInfo}
  332. #post:hover #info {
  333. {block:If500pxPosts}
  334. margin-left:515px;
  335. {/block:If500pxPosts}
  336. {block:If400pxPosts}
  337. margin-left:415px;
  338. {/block:If400pxPosts}
  339. {block:IfNot500pxPosts}
  340. {block:IfNot400pxPosts}
  341. margin-left:265px;
  342. {/block:IfNot400pxPosts}
  343. {/block:IfNot500pxPosts}
  344. border-left:14px solid {color:borders};
  345. opacity:0.9;
  346. -webkit-transition: all 0.6s ease-out;
  347. -o-transition: all 0.6s ease-out;
  348. -webkit-transition: all 0.6s ease-out;
  349. -moz-transition: all 0.6s ease-out;
  350. }
  351. {/block:IfNotBottomInfo}
  352. {/block:IndexPage}
  353.  
  354. {block:IfHeader}
  355. #topi {
  356. background-image:url('{image:header}');
  357. background-color:{color:header};
  358. height:200px;
  359. text-align:center;
  360. width:100%;
  361. background-position:bottom center;
  362. margin-top:-60px;
  363. -webkit-transition: all 0.6s ease-out;
  364. -o-transition: all 0.6s ease-out;
  365. -webkit-transition: all 0.6s ease-out;
  366. -moz-transition: all 0.6s ease-out;
  367.  
  368. }
  369.  
  370. .top {
  371. text-align:center;
  372. position:absolute;
  373. left:0px;
  374. height:140px;
  375. margin-top:50px;
  376. z-index:9999;
  377. width:100%;
  378. -webkit-transition: all 0.6s ease-out;
  379. -o-transition: all 0.6s ease-out;
  380. -webkit-transition: all 0.6s ease-out;
  381. -moz-transition: all 0.6s ease-out;
  382. }
  383.  
  384. .title {
  385. margin-top:-90px;
  386. margin-left:auto;
  387. margin-right:auto;
  388. text-align:center;
  389. {block:If500pxPosts}
  390. width:876px;
  391. {/block:If500pxPosts}
  392. {block:If400pxPosts}
  393. width:776px;
  394. {/block:If400pxPosts}
  395. {block:IfNot500pxPosts}
  396. {block:IfNot400pxPosts}
  397. width:626px;
  398. {/block:IfNot400pxPosts}
  399. {/block:IfNot500pxPosts}
  400. -webkit-transition: all 0.6s ease-out;
  401. -o-transition: all 0.6s ease-out;
  402. -webkit-transition: all 0.6s ease-out;
  403. -moz-transition: all 0.6s ease-out;
  404. }
  405.  
  406. .hide {
  407. background-color:transparent;
  408. opacity:0.5;
  409. font-size:25px;
  410. font-family: 'Satisfy', cursive;
  411. color:{color:title};
  412. padding:40px 0px 20px 0px;
  413. height:30px;
  414. }
  415.  
  416. .other {
  417. margin-top:-90px;
  418. background-color:transparent;
  419. opacity:0;
  420. font-size:25px;
  421. font-family: 'Satisfy', cursive;
  422. color:{color:title};
  423. padding:40px 0px 20px 0px;
  424. height:30px;
  425. -webkit-transition: all 0.6s ease-out;
  426. -o-transition: all 0.6s ease-out;
  427. -webkit-transition: all 0.6s ease-out;
  428. -moz-transition: all 0.6s ease-out;
  429. }
  430.  
  431. .sticky {
  432. top:-100px;
  433. position:fixed;
  434. -webkit-transition: all 0.6s ease-out;
  435. -o-transition: all 0.6s ease-out;
  436. -webkit-transition: all 0.6s ease-out;
  437. -moz-transition: all 0.6s ease-out;
  438. }
  439.  
  440. .sticky .other {
  441. background-color:{color:title scroll bg};
  442. opacity:1;
  443. -webkit-transition: all 0.6s ease-out;
  444. -o-transition: all 0.6s ease-out;
  445. -webkit-transition: all 0.6s ease-out;
  446. -moz-transition: all 0.6s ease-out;
  447. }
  448.  
  449. .sticky .hide {
  450. opacity:0;
  451. -webkit-transition: all 0.6s ease-out;
  452. -o-transition: all 0.6s ease-out;
  453. -webkit-transition: all 0.6s ease-out;
  454. -moz-transition: all 0.6s ease-out;
  455. }
  456. {/block:IfHeader}
  457.  
  458. #sidebar {
  459. width:300px;
  460. {block:IfHeader}
  461. margin-top:50px;
  462. position:absolute;
  463. -webkit-transition: all 0.6s ease-out;
  464. -o-transition: all 0.6s ease-out;
  465. -webkit-transition: all 0.6s ease-out;
  466. -moz-transition: all 0.6s ease-out;
  467. {/block:IfHeader}
  468. {block:IfNotHeader}
  469. margin-top:100px;
  470. position:fixed;
  471. {/block:IfNotHeader}
  472. }
  473.  
  474. #sidebarimage {
  475. width:170px;
  476. margin-left:60px;
  477. border:15px;
  478. }
  479.  
  480. #sidebarimage img:hover {
  481. opacity:0.6;
  482. -webkit-transition: all 0.6s ease-out;
  483. -o-transition: all 0.6s ease-out;
  484. -webkit-transition: all 0.6s ease-out;
  485. -moz-transition: all 0.6s ease-out;
  486. }
  487.  
  488. #sidebarimage img {
  489. width:170px;
  490. -webkit-transition: all 0.6s ease-out;
  491. -o-transition: all 0.6s ease-out;
  492. -webkit-transition: all 0.6s ease-out;
  493. -moz-transition: all 0.6s ease-out;
  494. }
  495.  
  496. #link {
  497. position:absolute;
  498. width:60px;
  499. text-align:center;
  500. -webkit-transition: all 0.6s ease-out;
  501. -o-transition: all 0.6s ease-out;
  502. -webkit-transition: all 0.6s ease-out;
  503. -moz-transition: all 0.6s ease-out;
  504. }
  505.  
  506. .links a {
  507. display:block;
  508. margin-top:3px;
  509. margin-left:40px;
  510. height:14px;
  511. font-size:8px;
  512. width:14px;
  513. background-color:{color:sidelink bg};
  514. font-family:georgia;
  515. font-style:italic;
  516. color:transparent;
  517. overflow:hidden;
  518. -webkit-transition: all 0.6s ease-out;
  519. -o-transition: all 0.6s ease-out;
  520. -webkit-transition: all 0.6s ease-out;
  521. -moz-transition: all 0.6s ease-out;
  522. }
  523.  
  524. .links a:hover {
  525. margin-left:0px;
  526. width:54px;
  527. color:{color:sidelink};
  528. -webkit-transition: all 0.6s ease-out;
  529. -o-transition: all 0.6s ease-out;
  530. -webkit-transition: all 0.6s ease-out;
  531. -moz-transition: all 0.6s ease-out;
  532. }
  533.  
  534. #next {
  535. margin-left:32px;
  536. margin-top:7px;
  537. }
  538.  
  539. #next a {
  540. display:block;
  541. background-color:none;
  542. color:{color:sidelink bg};
  543. -webkit-transition: all 0.6s ease-out;
  544. -o-transition: all 0.6s ease-out;
  545. -webkit-transition: all 0.6s ease-out;
  546. -moz-transition: all 0.6s ease-out;
  547. }
  548.  
  549. #back {
  550. margin-left:32px;
  551. margin-top:5px;
  552. }
  553.  
  554. #back a {
  555. display:block;
  556. background-color:none;
  557. color:{color:sidelink bg};
  558. -webkit-transition: all 0.6s ease-out;
  559. -o-transition: all 0.6s ease-out;
  560. -webkit-transition: all 0.6s ease-out;
  561. -moz-transition: all 0.6s ease-out;
  562.  
  563. }
  564.  
  565. #next a:hover {
  566. color:{color:sidelink};
  567. -webkit-transition: all 0.6s ease-out;
  568. -o-transition: all 0.6s ease-out;
  569. -webkit-transition: all 0.6s ease-out;
  570. -moz-transition: all 0.6s ease-out;
  571. }
  572.  
  573. #description {
  574. border-top:1px solid {color:sidelink bg};
  575. border-bottom:1px solid {color:sidelink bg};
  576. margin-top:10px;
  577. margin-left:60px;
  578. width:160px;
  579. padding:10px;
  580. text-align:right;
  581. font-size:10px;
  582. line-height:110%;
  583. color:{color:side text};
  584. font-family:{font:sidebar};
  585. -webkit-transition: all 0.6s ease-out;
  586. -o-transition: all 0.6s ease-out;
  587. -webkit-transition: all 0.6s ease-out;
  588. -moz-transition: all 0.6s ease-out;
  589. }
  590.  
  591. #pagination {
  592. margin-left:60px;
  593. margin-top:3px;
  594. width:190px;
  595. border-top:1px solid {color:borders};
  596. font-size:8px;
  597. font-style:italic;
  598. text-align:center;
  599. padding-top:3px;
  600. color:{color:scrollbar};
  601. }
  602.  
  603. #pagination a {
  604. font-style:italic;
  605. font-size:8px;
  606. font-family: 'Droid Sans', sans-serif;
  607. }
  608.  
  609. #pagination a:hover {
  610. color:{color:tags hover};
  611. font-family: 'Droid Sans', sans-serif;
  612. }
  613.  
  614. #info {
  615. font-family: 'Droid Sans', sans-serif;
  616. {block:IndexPage}
  617. font-size:7px;
  618. text-transform:uppercase;
  619. {block:IfNotBottomInfo}
  620. position:absolute;
  621. word-wrap:break-word;
  622. text-align:left;
  623. padding-left:5px;
  624. border-left:1px solid {color:borders};
  625. opacity:0;
  626. {block:If500pxPosts}
  627. margin-left:460px;
  628. {/block:If500pxPosts}
  629. {block:If400pxPosts}
  630. margin-left:360px;
  631. {/block:If400pxPosts}
  632. {block:IfNot500pxPosts}
  633. {block:IfNot400pxPosts}
  634. margin-left:210px;
  635. {/block:IfNot400pxPosts}
  636. {/block:IfNot500pxPosts}
  637. -webkit-transition: all 0.6s ease-out;
  638. -o-transition: all 0.6s ease-out;
  639. -webkit-transition: all 0.6s ease-out;
  640. -moz-transition: all 0.6s ease-out;
  641. {/block:IfNotBottomInfo}
  642. {block:IfBottomInfo}
  643. margin-top:7px;
  644. text-align:center;
  645. padding-top:5px;
  646. border-top:1px solid {color:borders};
  647. {/block:IfBottomInfo}
  648. {/block:IndexPage}
  649. {block:PermalinkPage}
  650. margin-top:7px;
  651. padding-top:5px;
  652. text-align:left;
  653. border-top:1px solid {color:borders};
  654. font-size:9px;
  655. {/block:PermalinkPage}
  656. }
  657.  
  658. #info a {
  659. color:{color:infolink};
  660. {block:PermalinkPage}
  661. text-decoration:underline;
  662. padding-bottom:2px;
  663. {/block:PermalinkPage}
  664. }
  665.  
  666. #info a:hover {
  667. color:{color:infolink hover};
  668. }
  669.  
  670. #tags {
  671. font-family:calibri, sans-serif;
  672. {block:IndexPage}
  673. text-align:center;
  674. font-size:10px;
  675. {block:IfNotBottomInfo}
  676. padding-top:3px;
  677. margin-top:7px;
  678. border-top:1px solid {color:borders};
  679. {/block:IfNotBottomInfo}
  680. {/block:IndexPage}
  681. {block:PermalinkPage}
  682. font-size:9px;
  683. text-align:left;
  684. text-transform:uppercase;
  685. {/block:PermalinkPage}
  686.  
  687. }
  688.  
  689. #tags a {
  690. color:{color:tags};
  691. font-style:italic;
  692. font-family:calibri, sans-serif;
  693. {block:IndexPage}
  694. font-size:10px;
  695. {/block:IndexPage}
  696. {block:PermalinkPage}
  697. font-size:9px;
  698. text-transform:uppercase;
  699. {/block:PermalinkPage}
  700. }
  701.  
  702. #tags a:hover {
  703. color:{color:tags hover};
  704. }
  705.  
  706. #credit {
  707. position:fixed;
  708. bottom:0px;
  709. left:0px;
  710. padding:4px 10px 4px 5px;
  711. text-decoration:none;
  712. font-size:11px;
  713. background-color:{color:side text};
  714. color:{color:background};
  715. font-family: 'Allura', cursive;
  716. -webkit-transition: all 0.3s ease-out;
  717. -o-transition: all 0.3s ease-out;
  718. -webkit-transition: all 0.3s ease-out;
  719. -moz-transition: all 0.3s ease-out;
  720.  
  721. }
  722.  
  723. .quote {
  724. padding-left:50px;
  725. padding-right:50px;
  726. font-size:12px;
  727. line-height:110%;
  728. text-align:center;
  729. font-family: 'Droid Sans', sans-serif;
  730. }
  731.  
  732. .face {
  733. float:right;
  734. width:37px;
  735. height:30px;
  736. padding-left:5px;
  737. border-left:1px solid {color:posts};
  738. }
  739.  
  740. .face img {
  741. border:7px solid {color:posts};
  742. }
  743.  
  744. .question {
  745. padding:10px;
  746. background-color:{color:blockquotes};
  747. min-height:30px;
  748. {block:IndexPage}
  749. {block:If400pxPosts}
  750. width:380px;
  751. {/block:If400pxPosts}
  752. {block:If500pxPosts}
  753. width:480px;
  754. {/block:If500pxPosts}
  755. {block:IfNot400pxPosts}
  756. {block:IfNot500pxPosts}
  757. width:230px;
  758. {/block:IfNot500pxPosts}
  759. {/block:IfNot400pxPosts}
  760. {/block:IndexPage}
  761. {block:PermalinkPage}
  762. width:480px;
  763. {/block:PermalinkPage}
  764. }
  765.  
  766. .words {
  767. text-align:justify;
  768. line-height:150%;
  769. }
  770.  
  771. .audio {
  772. margin-right:5px;
  773. width:70px;
  774. float:left;
  775. }
  776.  
  777. .hidden {
  778. width:70px;
  779. height:73px;
  780. }
  781.  
  782. .tumblr_audio_player {
  783. margin:0px;
  784. padding:0px;
  785. width:500px;
  786. height:50px;
  787. }
  788.  
  789. .pull {
  790. margin-left:5px;
  791. margin-top:-5px;
  792. }
  793.  
  794. .player {
  795. width:35px;
  796. height:37px;
  797. margin-left:10px;
  798. margin-top:10px;
  799. overflow:hidden;
  800. position:absolute;
  801. opacity:0.7;
  802. background-color:#fff;
  803. z-index:8888;
  804. border:7px solid #ECECEC;
  805. -webkit-transition: all 0.3s ease-out;
  806. -o-transition: all 0.3s ease-out;
  807. -webkit-transition: all 0.3s ease-out;
  808. -moz-transition: all 0.3s ease-out;
  809. }
  810.  
  811. .player:hover {
  812. opacity:1;
  813. -webkit-transition: all 0.3s ease-out;
  814. -o-transition: all 0.3s ease-out;
  815. -webkit-transition: all 0.3s ease-out;
  816. -moz-transition: all 0.3s ease-out;
  817. }
  818.  
  819. .caption {
  820. margin-top:20px;
  821. }
  822.  
  823. .audio img{
  824. max-width: 70px;
  825. height: auto;
  826. }
  827.  
  828. .song {
  829. margin-left:70px;
  830. margin-top:-55px;
  831. text-transform:uppercase;
  832. font-size:10px;
  833. padding-bottom:13px;
  834. font-family: 'Droid Sans', sans-serif;
  835. }
  836.  
  837. .link {
  838. padding:15px;
  839. border:1px solid {color:posts};
  840. border-radius:20px;
  841. font-size:15px;
  842. font-style:italic;
  843. }
  844.  
  845. .link a {
  846. color:{color:tags};
  847. }
  848.  
  849. .link a:hover {
  850. text-shadow:1px 1px 1px;
  851. }
  852.  
  853. ol.notes {
  854. padding:0px;
  855. margin-left:20px;
  856. list-style-type:decimal;
  857. font-style:italic;
  858. border-bottom: solid 1px {color:posts};
  859. width:480px;
  860. }
  861.  
  862. ol.notes li.note {
  863. border-top: solid 1px {color:posts};
  864. padding: 10px;
  865. font-family: 'Droid Sans', sans-serif;
  866. font-size:9px;
  867. }
  868.  
  869. ol.notes li.note img.avatar {
  870. vertical-align: -4px;
  871. margin-right: 10px;
  872. width: 16px;
  873. height: 16px;
  874. }
  875.  
  876. ol.notes li.note blockquote {
  877. border-color: {color:text};
  878. padding: 4px 10px;
  879. margin: 10px 0px 0px 25px;
  880. }
  881.  
  882. ol.notes li.note blockquote a {
  883. text-decoration: none;
  884. }
  885.  
  886. {CustomCSS}</style></head><body>
  887.  
  888. <div id="theme">
  889.  
  890. {block:IfHeader}
  891. <div class="top">
  892. <div id="topi"></div>
  893. <div class="title">
  894. <div class="hide">{Title}</div>
  895. <div class="other">{text:second title}</div>
  896. <div id="sidebar">
  897. <div id="link">
  898. <div class="links">
  899. <a href="/ask">askbox</a>
  900. <a href="/archive">index</a>
  901. {block:IfLink1Name}
  902. <a href="{text:link1}">{text:link1name}</a>
  903. {/block:IfLink1Name}
  904. {block:IfLink2Name}
  905. <a href="{text:link2}">{text:link2name}</a>
  906. {/block:IfLink2Name}
  907. {block:IfLink3Name}
  908. <a href="{text:link3}">{text:link3name}</a>
  909. {/block:IfLink3Name}
  910. {block:IfLink4Name}
  911. <a href="{text:link4}">{text:link4name}</a>
  912. {/block:IfLink4Name}
  913. {block:IfLink5Name}
  914. <a href="{text:link5}">{text:link5name}</a>
  915. {/block:IfLink5Name}
  916. {block:IfLink6Name}
  917. <a href="{text:link6}">{text:link6name}</a>
  918. {/block:IfLink6Name}
  919. {block:IfLink7Name}
  920. <a href="{text:link7}">{text:link7name}</a>
  921. {/block:IfLink7Name}
  922. {block:IfLink8Name}
  923. <a href="{text:link8}">{text:link8name}</a>
  924. {/block:IfLink8Name}
  925. </div>
  926. {block:Pagination}
  927. <div id="next">
  928. {block:NextPage}
  929. <span style="font-size:17px;">
  930. <a href="{NextPage}">+</a>
  931. </span>
  932. {/block:NextPage}
  933. </div>
  934. <div id="back">
  935. {block:PreviousPage}
  936. <span style="font-size:20px;font-weight:bold;">
  937. <a href="{PreviousPage}">-</a>
  938. </span>
  939. {/block:PreviousPage}
  940. </div>
  941. {/block:Pagination}
  942. </div>
  943. {block:IfSidebarImage}
  944. <div id="sidebarimage">
  945. <a title="home page" href="/"><img src="{image:sidebar}"></a>
  946. </div>
  947. {/block:IfSidebarImage}
  948. <div id="description">
  949. {Description}
  950. </div>
  951. </div>
  952. </div>
  953. </div>
  954.  
  955. <script>
  956. var header = document.querySelector('.top');
  957. var origOffsetY = header.offsetTop;
  958.  
  959. function onScroll(e) {
  960. window.scrollY >= origOffsetY ? header.classList.add('sticky') :
  961. header.classList.remove('sticky');
  962. }
  963.  
  964. document.addEventListener('scroll', onScroll);
  965. </script>
  966. {/block:IfHeader}
  967. {block:IfNotHeader}
  968. <div id="sidebar">
  969. <div id="link">
  970. <div class="links">
  971. <a href="/ask">askbox</a>
  972. <a href="/archive">index</a>
  973. {block:IfLink1Name}
  974. <a href="{text:link1}">{text:link1name}</a>
  975. {/block:IfLink1Name}
  976. {block:IfLink2Name}
  977. <a href="{text:link2}">{text:link2name}</a>
  978. {/block:IfLink2Name}
  979. {block:IfLink3Name}
  980. <a href="{text:link3}">{text:link3name}</a>
  981. {/block:IfLink3Name}
  982. {block:IfLink4Name}
  983. <a href="{text:link4}">{text:link4name}</a>
  984. {/block:IfLink4Name}
  985. {block:IfLink5Name}
  986. <a href="{text:link5}">{text:link5name}</a>
  987. {/block:IfLink5Name}
  988. {block:IfLink6Name}
  989. <a href="{text:link6}">{text:link6name}</a>
  990. {/block:IfLink6Name}
  991. {block:IfLink7Name}
  992. <a href="{text:link7}">{text:link7name}</a>
  993. {/block:IfLink7Name}
  994. {block:IfLink8Name}
  995. <a href="{text:link8}">{text:link8name}</a>
  996. {/block:IfLink8Name}
  997. </div>
  998. {block:Pagination}
  999. <div id="next">
  1000. {block:NextPage}
  1001. <span style="font-size:17px;">
  1002. <a href="{NextPage}">+</a>
  1003. </span>
  1004. {/block:NextPage}
  1005. </div>
  1006. <div id="back">
  1007. {block:PreviousPage}
  1008. <span style="font-size:20px;font-weight:bold;">
  1009. <a href="{PreviousPage}">-</a>
  1010. </span>
  1011. {/block:PreviousPage}
  1012. </div>
  1013. {/block:Pagination}
  1014. </div>
  1015. {block:IfSidebarImage}
  1016. <div id="sidebarimage">
  1017. <a href="/"><img src="{image:sidebar}"></a>
  1018. </div>
  1019. {/block:IfSidebarImage}
  1020. <div id="description">
  1021. {Description}
  1022. </div>
  1023. </div>
  1024. {/block:IfNotHeader}
  1025.  
  1026. <a target="blank" title="theme by colorfulmetaphors" href="http://colorfulmetaphors.tumblr.com/">
  1027. <div id="credit">
  1028. T
  1029. </div>
  1030. </a>
  1031.  
  1032. <div id="entries">
  1033. {block:Posts}
  1034. <div id="post">
  1035.  
  1036.  
  1037. {block:IndexPage}
  1038. {block:IfNotBottomInfo}
  1039. <div id="info">
  1040. {block:Date}
  1041. <a href="{Permalink}">{TimeAgo}<br />
  1042. {/block:Date}
  1043. {NoteCount}</a>&nbsp;|&nbsp;<a href="{ReblogURL}">reblog</a>
  1044. {block:RebloggedFrom}
  1045. <br />
  1046. {block:ContentSource}
  1047. &copy;&nbsp;<a href="{SourceURL}">{ReblogRootName}</a><br />
  1048. {/block:ContentSource}
  1049. via&nbsp;<a href="{ReblogParentURL}">{ReblogParentName}</a>
  1050. {/block:RebloggedFrom}
  1051. </div>
  1052. {/block:IfNotBottomInfo}
  1053. {/block:IndexPage}
  1054.  
  1055. {block:Text}
  1056. {block:Title}
  1057. <h1>{Title}</h1>
  1058. {/block:Title}
  1059. {Body}
  1060. {/block:Text}
  1061.  
  1062. {block:Photo}
  1063. <center>{LinkOpenTag}
  1064. {block:IndexPage}
  1065. {block:If400pxPosts}
  1066. <img src="{PhotoURL-500}" width="400">
  1067. {/block:If400pxPosts}
  1068. {block:If500pxPosts}
  1069. <img src="{PhotoURL-500}">
  1070. {/block:If500pxPosts}
  1071. {block:IfNot400pxPosts}
  1072. {block:IfNot500pxPosts}
  1073. <img src="{PhotoURL-500}" width="250">
  1074. {/block:IfNot500pxPosts}
  1075. {/block:IfNot400pxPosts}
  1076. {/block:IndexPage}
  1077. {block:PermalinkPage}
  1078. <img src="{PhotoURL-500}">
  1079. {/block:PermalinkPage}
  1080. {LinkCloseTag}</center>
  1081. {block:Caption}
  1082. {Caption}
  1083. {/block:Caption}
  1084. {/block:Photo}
  1085.  
  1086. {block:Photoset}
  1087. {block:IndexPage}
  1088. {block:If400pxPosts}
  1089. {Photoset-400}
  1090. {/block:If400pxPosts}
  1091. {block:If500pxPosts}
  1092. {Photoset-500}
  1093. {/block:If500pxPosts}
  1094. {block:IfNot400pxPosts}
  1095. {block:IfNot500pxPosts}
  1096. {Photoset-250}
  1097. {/block:IfNot500pxPosts}
  1098. {/block:IfNot400pxPosts}
  1099. {/block:IndexPage}
  1100. {block:PermalinkPage}
  1101. {Photoset-500}
  1102. {/block:PermalinkPage}
  1103. {block:Caption}
  1104. {Caption}
  1105. {/block:Caption}
  1106. {/block:Photoset}
  1107.  
  1108. {block:Quote}
  1109. <div class="quote">
  1110. {Quote}
  1111. </div>
  1112. {block:Source}
  1113. <div style="text-align:center; font-family: 'Droid Sans', sans-serif; padding-top:5px">— {Source} —
  1114. </div>
  1115. {/block:Source}
  1116. {/block:Quote}
  1117.  
  1118. {block:Link}
  1119. <div class="link">
  1120. <a target="blank" href="{URL}" {Target}>-----&nbsp;{Name}</a>
  1121. </div>
  1122. {block:Description}
  1123. {Description}
  1124. {/block:Description}
  1125. {/block:Link}
  1126.  
  1127. {block:Chat}
  1128. {block:Title}
  1129. <h1>
  1130. {Title}
  1131. </h1>
  1132. {/block:Title}
  1133. {block:Lines}
  1134. {block:Label}
  1135. <strong>{Label}&nbsp;</strong>
  1136. {/block:Label}
  1137. {Line}<br />
  1138. {/block:Lines}
  1139. {/block:Chat}
  1140.  
  1141. {block:Audio}
  1142. {block:AlbumArt}
  1143. <div class="audio">
  1144. <img src="{AlbumArtURL}">
  1145. </div>
  1146. {/block:AlbumArt}
  1147. <div class="hidden">
  1148. <div class="player">
  1149. <div class="pull">
  1150. {AudioPlayerWhite}
  1151. </div>
  1152. </div>
  1153. </div>
  1154. <div class="song">
  1155. {block:TrackName}
  1156. {TrackName}
  1157. {/block:TrackName}
  1158. {block:Artist}
  1159. <br />{Artist}
  1160. {/block:Artist}
  1161. <br />{PlayCountWithLabel}
  1162. </div>
  1163. {block:Caption}
  1164. <div class="caption">
  1165. {Caption}
  1166. </div>
  1167. {/block:Caption}
  1168. {/block:Audio}
  1169.  
  1170. {block:Video}
  1171. {block:IndexPage}
  1172. {block:If400pxPosts}
  1173. {Video-400}
  1174. {/block:If400pxPosts}
  1175. {block:If500pxPosts}
  1176. {Video-500}
  1177. {/block:If500pxPosts}
  1178. {block:IfNot400pxPosts}
  1179. {block:IfNot500pxPosts}
  1180. {Video-250}
  1181. {/block:IfNot500pxPosts}
  1182. {/block:IfNot400pxPosts}
  1183. {/block:IndexPage}
  1184. {block:PermalinkPage}
  1185. {Video-500}
  1186. {/block:PermalinkPage}
  1187. {block:Caption}
  1188. {Caption}
  1189. {/block:Caption}
  1190. {/block:Video}
  1191.  
  1192. {block:Answer}
  1193. <div class="question">
  1194. <div class="words">
  1195. <a href="{AskerURL}" title="{AskerName}">
  1196. <div style="float:right;margin-left:5px;padding-left:5px;border-left:1px solid {color:posts};height:30px;">
  1197. <img src="{AskerPortraitURL-16}" border="7px solid {color:posts}">
  1198. </div>
  1199. </a>
  1200. {Question}
  1201. </div>
  1202. </div>
  1203. <br />
  1204. {Answer}
  1205. {/block:Answer}
  1206.  
  1207. {block:IndexPage}
  1208. {block:IfBottomInfo}
  1209. <div id="info">
  1210. {block:Date}
  1211. <a href="{Permalink}">{TimeAgo}&nbsp;|&nbsp;
  1212. {/block:Date}
  1213. {NoteCount}</a>&nbsp;|&nbsp
  1214. <a href="{ReblogURL}">reblog</a>
  1215. {block:RebloggedFrom}
  1216. &nbsp;|&nbsp;{block:ContentSource}
  1217. (&nbsp;&copy;&nbsp;<a href="{SourceURL}">{ReblogRootName}</a>&nbsp;)&nbsp;
  1218. {/block:ContentSource}
  1219. <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1220. {/block:RebloggedFrom}
  1221. </div>
  1222. {/block:IfBottomInfo}
  1223. {block:HasTags}
  1224. <div id="tags">
  1225. {block:Tags}
  1226. &nbsp;<a href="{TagURL}">{Tag}</a>&nbsp;
  1227. {/block:Tags}
  1228. </div>
  1229. {/block:HasTags}
  1230. {/block:IndexPage}
  1231.  
  1232. {block:PermalinkPage}
  1233. <div id="info">
  1234. {block:Date}
  1235. {TimeAgo}&nbsp;on&nbsp;{Month}&nbsp;{DayofMonth}{DayofMonthSuffix},&nbsp;{Year}
  1236. &nbsp;with
  1237. {/block:Date}
  1238. {NoteCountWithLabel}&nbsp;|&nbsp;
  1239. <a href="{ReblogURL}">reblog&nbsp;this&nbsp;post</a>
  1240. {block:RebloggedFrom}
  1241. <br />
  1242. {block:ContentSource}
  1243. originally&nbsp;from&nbsp;<a href="{SourceURL}">{ReblogRootName}</a>,&nbsp;
  1244. {/block:ContentSource}
  1245. via&nbsp;<a href="{ReblogParentURL}">{ReblogParentName}</a>
  1246. {/block:RebloggedFrom}
  1247. </div>
  1248. {block:HasTags}
  1249. <div id="tags">
  1250. tagged&nbsp;as:
  1251. {block:Tags}
  1252. &nbsp;<a href="{TagURL}">{Tag}</a>&nbsp;
  1253. {/block:Tags}
  1254. </div>
  1255. {/block:HasTags}
  1256. {/block:PermalinkPage}
  1257.  
  1258. </div>
  1259.  
  1260. {block:PostNotes}
  1261. {PostNotes}
  1262. {/block:PostNotes}
  1263. {/block:Posts}
  1264. </div>
  1265. </div>
  1266.  
  1267. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment