Advertisement
selsthemes

Theme 03 - Baker Street

Jul 28th, 2013
3,115
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.98 KB | None | 0 0
  1. <html>
  2.  
  3. <!--
  4.  
  5. Theme 03 - "Baker Street" by 500daysoflahey.
  6.  
  7. Please do not repost and claim as your own.
  8. Please keep the credit in tact. You're beautiful for using this theme.
  9. Thank you!
  10.  
  11. --->
  12.  
  13. <head>
  14.  
  15. <title>{Title}</title>
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  18. <meta name="description" content="" />
  19.  
  20. <meta name="color:Background" content="#ffffff">
  21. <meta name="color:Posts Text" content="#3c3c3b">
  22. <meta name="color:Links" content="#471e1e">
  23. <meta name="color:Links hover" content="#8f5c5c">
  24. <meta name="color:Blockquote" content="#471e1e">
  25. <meta name="color:Description text" content="#3c3c3b">
  26. <meta name="color:Posts border" content="#afa1a1">
  27. <meta name="color:Question background" content="#f8f8f8">
  28. <meta name="color:Permalink background" content="#ebe9e9">
  29. <meta name="color:Sidebar" content="#050505">
  30. <meta name="color:Askborder" content="#471e1e">
  31. <meta name="color:Icon Border Color" content="#fefffd">
  32. <meta name="color:Title" content="#fdfdfc">
  33. <meta name="color:Title First Letter" content="#fdfdfc">
  34. <meta name="color:Title First Letter Background" content="#471e1e">
  35. <meta name="color:Scrollbar" content="#471e1e">
  36. <meta name="color:Scrollbar Background" content="#fbfcfa">
  37.  
  38. <meta name="text:Link1URL" content="/" />
  39. <meta name="text:Link2URL" content="/" />
  40. <meta name="text:Link3URL" content="/" />
  41. <meta name="text:Link4URL" content="/" />
  42. <meta name="text:Link5URL" content="/" />
  43.  
  44. <meta name="image:Sidebar1" content="" />
  45. <meta name="image:Sidebar2" content="" />
  46.  
  47. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  48. <link rel="shortcut icon" href="{Favicon}" />
  49. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  50.  
  51. <style type="text/css">
  52.  
  53. ::-webkit-scrollbar { width: 6px; height: 6px; }
  54. ::-webkit-scrollbar-button:start:decrement;
  55. ::-webkit-scrollbar-button:end:increment { height: 0px; display: block; background: #9C9C9C; }
  56. ::-webkit-scrollbar-track-piece { background-color: {color:scrollbar background}; }
  57. ::-webkit-scrollbar-thumb { border-radius: 0px; height: 50px; background-color: {color:scrollbar}; }
  58.  
  59. /* BODY */
  60.  
  61. body {
  62. font-family: Cambria;
  63. font-size: 10px;
  64. color: {color:Posts Text};
  65. text-align: justify;
  66. background-color: {color:Background};
  67. }
  68.  
  69. body a {
  70. text-decoration: none;
  71. color: {color:Links};
  72. }
  73.  
  74. body a:hover {
  75. text-decoration: none;
  76. color: {color:Links hover};
  77. -webkit-transition-duration: 0.5s
  78. }
  79.  
  80. small {
  81. font-size: 10px;
  82. }
  83.  
  84. blockquote {
  85. border-left: solid;
  86. border-left-width: 2px;
  87. border-color: {color:Blockquote};
  88. padding-left: 7px;
  89. margin-left: 10px;
  90. }
  91.  
  92. /* SIDEBAR */
  93.  
  94. #sidebar {
  95. width:255px;
  96. height:100%;
  97. position:fixed;
  98. margin-left:-2050px;
  99. margin-top:-10px;
  100. overflow:hidden;
  101. padding:5px;
  102. background:{color:Sidebar};
  103. border-left:2000px
  104. solid {color:Sidebar}
  105. }
  106.  
  107. #sidebar1 {
  108. width:200px;
  109. height:100%;
  110. position:fixed;
  111. top:17%;
  112. text-align:center;
  113. }
  114.  
  115. #sideimg img {
  116. width:150px;
  117. height:150px;
  118. border-style: solid;
  119. border-width: 10px;
  120. border-color: {color:Icon Border Color};
  121. }
  122.  
  123. #sideimg img:hover {
  124. opacity: 0.6;-webkit-transition-duration: 0.6s
  125. }
  126.  
  127. #description {
  128. width: 140px;
  129. height: 140px;
  130. border-style: solid;
  131. border-width: 15px;
  132. border-color: {color:Icon Border Color};
  133. overflow: auto;
  134. font-family: Cambria;
  135. font-size: 12;
  136. font-style: italic;
  137. margin-top: -170px;
  138. margin-left: 15px;
  139. color: {color:Description text};
  140. background-color: {color:Icon Border Color};
  141. opacity: 0;
  142. -webkit-transition:opacity 0.5s;
  143. }
  144.  
  145. #description:hover {
  146. border-width: 15px;
  147. width: 140px;
  148. height: 140px;
  149. opacity: 0.8;
  150. -webkit-transition:opacity 0.5s;
  151. }
  152.  
  153. #sideimg2 {
  154. margin-bottom:5px;
  155. -webkit-transition:all 0.5s ease-in-out;
  156. -moz-transition:all 0.5s ease-in-out;
  157. -o-transition:all 0.5s ease-in-out;
  158. transition:all 0.5s ease-in-out;
  159. }
  160.  
  161. #sideimg2 img {
  162. width:150px;
  163. height:150px;
  164. border-style: solid;
  165. border-width: 10px;
  166. border-color: {color:Icon Border Color};
  167. }
  168.  
  169. #sideimg2 img:hover {
  170. opacity: 0.6;-webkit-transition-duration: 0.6s
  171. }
  172.  
  173. #Navigation {
  174. width: 140px;
  175. height: 140px;
  176. border-style: solid;
  177. border-width: 15px;
  178. border-color: {color:Icon Border Color};
  179. overflow: auto;
  180. font-family: Cambria;
  181. font-size: 12;
  182. font-weight: bold;
  183. text-transform: uppercase;
  184. word-spacing: 15px;
  185. line-height: 35px;
  186. margin-top: -175px;
  187. margin-left: 15px;
  188. color: {color:Description text};
  189. background-color: {color:Icon Border Color};
  190. opacity: 0;
  191. -webkit-transition:opacity 0.5s;
  192. }
  193.  
  194. #Navigation:hover {
  195. border-width: 15px;
  196. width: 140px;
  197. height: 140px;
  198. opacity: 0.8;
  199. -webkit-transition:opacity 0.5s;
  200. }
  201.  
  202. #title:first-letter {
  203. display: inline-block;
  204. padding: 5px;
  205. font-family:cambria;
  206. font-size:16px;
  207. text-transform:uppercase;
  208. margin-right: 4px;
  209. background:{color:Title First letter Background};
  210. color:{color:Title First Letter};
  211. }
  212.  
  213. #title {
  214. padding: 15px;
  215. font-family: Cambria;
  216. font-size: 13;
  217. font-style: italic;
  218. color: {color:Title};
  219. letter-spacing: 1px;
  220. text-align: center;
  221. background-color: {color:sidebar};
  222. }
  223.  
  224. /* POSTS */
  225.  
  226. #container {
  227. width:400px;
  228. text-align:center;
  229. margin-left: 100px;
  230. }
  231.  
  232. #entries {
  233. background-color:{color:Background};
  234. float:left;
  235. margin:5px 0 -10px -70px;
  236. text-align:justify;
  237. }
  238.  
  239. #entry {
  240. width:500px;
  241. padding:1px;
  242. padding-bottom:5px;
  243. margin:0px 0 0px 100px;
  244. text-align:justify;
  245. background-color:{color:Background}
  246. }
  247.  
  248. .postcol {
  249. margin-left: 380px;
  250. width: 500px;
  251. margin-bottom: 45px;
  252. }
  253.  
  254. .posts {
  255. margin-top: 55px;
  256. width: 500px;
  257. max-width: 100%;
  258. word-wrap: normal;
  259. }
  260.  
  261. .posts h2 {
  262. font-size: 12px;
  263. font-style: italic;
  264. text-transform: uppercase;
  265. }
  266.  
  267. .posts img, .posts li, .posts blockquote {
  268. max-width: 100%;
  269. }
  270.  
  271. .permalink {
  272. background-color: {color:Permalink background};
  273. padding: 3px;
  274. padding-bottom: 5px;
  275. margin-top: -5px;
  276. font-family: cambria;
  277. font-size: 8px;
  278. text-transform: uppercase;
  279. text-align: center;
  280. }
  281.  
  282. #tags {
  283. margin-right:5px;
  284. margin-top: 0px;
  285. font-family:cambria;
  286. text-align:center;
  287. text-transform:lowercase;
  288. font-size:9px;
  289. font-style:italic;
  290. }
  291.  
  292.  
  293. #quest {
  294. margin-left:70px;
  295. padding-top:6px;
  296. padding-bottom:6px;
  297. position: relative;
  298. width: 410px;
  299. height: auto;
  300. background: {color:background};
  301. border-bottom:1px solid {color:singlebg};
  302. }
  303.  
  304. #quest:after {
  305. content: "";
  306. position: absolute;
  307. top: 6px;
  308. left: -8px;
  309. border-style: solid;
  310. border-width: 6px 8px 6px 0;
  311. border-color: transparent {color:entriesinfo};
  312. display: block;
  313. width: 0;
  314. z-index: 1;
  315.  
  316. }
  317.  
  318. blockquote {
  319. padding-left:5px;
  320. margin:5px;
  321. border-left:4px solid {color:side2};
  322. }
  323.  
  324. #ans {
  325. margin-top: -10px;
  326. font-family:calibri;
  327. }
  328.  
  329. #askdashimg img {
  330. position:relative;
  331. float: left;
  332. height: 41px;
  333. width: 41px;
  334. border: 10px solid {color:Askborder};
  335. }
  336.  
  337. .quote {
  338. font-family: Cambria;
  339. font-size: 15px;
  340. text-align: center;
  341. }
  342.  
  343. .quotesource {
  344. margin-top: -5px;
  345. text-align: center;
  346. }
  347.  
  348. .links {
  349. font-size: 18px;
  350. text-transform: uppercase;
  351. font-weight: bold;
  352. text-align: center;
  353. padding: 5px;
  354. }
  355.  
  356. .links a {
  357. color: {color:Links};
  358. }
  359.  
  360. .links a:hover {
  361. color: {color:Links hover};
  362. -webkit-transition-duration: 0.5s
  363. }
  364.  
  365. .audio {
  366. position: relative;
  367. z-index: 100;
  368. font-family: Cambria
  369. background-color: {color:Posts};
  370. padding: 3px;
  371. height: 100px;
  372. width: 494px;
  373. }
  374.  
  375. .albumart {
  376. position: relative;
  377. z-index: 100;
  378. height: 100px;
  379. width: 100px;
  380. }
  381.  
  382. .noart {
  383. height: 100px;
  384. width: 100px;
  385. position: relative;
  386. z-index: 100 !important;
  387. }
  388.  
  389. .playbutton {
  390. height: 30px;
  391. width: 100px;
  392. position: absolute;
  393. z-index; 1000;
  394. overflow: hidden;
  395. margin-top: -33px !important;
  396. margin-left: 3px;
  397. }
  398.  
  399. .playbox {
  400. background-color: #000000;
  401. position: absolute;
  402. z-index: 1000;
  403. opacity: 0.5;
  404. -moz-transition-duration: 0.5s;
  405. -o-transition-duration: 0.5s;
  406. -webkit-transition-duration: 0.5s;
  407. transition-duration: 0.5s;
  408. }
  409.  
  410. .playbox:hover {
  411. opacity: 1.0;
  412. -moz-transition-duration: 0.5s;
  413. -o-transition-duration: 0.5s;
  414. -webkit-transition-duration: 0.5s;
  415. transition-duration: 0.5s;
  416. }
  417.  
  418. .trackname {
  419. position: absolute;
  420. z-index: 10000;
  421. margin-top: -100px;
  422. margin-left: 110px;
  423. font-family: Cambria;
  424. font-size: 10px;
  425. text-transform: uppercase;
  426. }
  427.  
  428. #credit {
  429. bottom: 5px;
  430. right: 5px;
  431. position: fixed;
  432. padding: 3px;
  433. color: {color:text}
  434. font-family: Calibri;
  435. font-size: 9px;
  436. text-transform: uppercase;
  437. }
  438.  
  439. #credit a {
  440. color: {color:text};
  441. font-family: Calibri;
  442. padding: 3px;
  443. text-decoration:none;
  444. -webkit-transition-duration: 0.6s;
  445. }
  446.  
  447. #credit a:hover {
  448. color: {color:New URL hover};
  449. }
  450.  
  451. #pagination {
  452. margin-top:7px;
  453. padding:6px 3px;
  454. font-family:cambria;
  455. font-size:10px;
  456. font-style:italic;
  457. letter-spacing:1px;
  458. text-transform:uppercase;
  459. text-align:center;
  460. color: {color:Title};
  461. }
  462.  
  463. #pagination a {
  464. margin-top:7px;
  465. padding:6px 3px;
  466. font-family:cambria;
  467. font-size:10px;
  468. font-style:italic;
  469. letter-spacing:1px;
  470. text-transform:uppercase;
  471. text-align:center;
  472. color: {color:Title};
  473. }
  474.  
  475. </style>
  476.  
  477. <style type="text/css">{CustomCSS}</style>
  478.  
  479. </head>
  480. <div id="container">
  481.  
  482. <div id="sidebar">
  483. <div id="sidebar1">
  484.  
  485. <div align="center" id="sideimg"><img src="{image:Sidebar1}"></div>
  486.  
  487. <div id="description">{Description}</div>
  488.  
  489. <div align="center" id="title">{Title}</div>
  490.  
  491. <div align="center" id="sideimg2"><img src="{image:Sidebar2}"></div>
  492.  
  493. <div id="Navigation"><p>
  494. <a href="/">i.</a>
  495. <a href="/ask">ii.</a>
  496. <a href="/archive">iii.</a><br>
  497. <a href="{text:Link1URL}">iv.</a>
  498. <a href="{text:Link2URL}">v.</a>
  499. <a href="{text:Link3URL}">vi.</a><br>
  500. <a href="{text:Link4URL}">vii.</a>
  501. <a href="{text:Link5URL}">viii.</a>
  502. <a href="http://500daysoflahey.tumblr.com/">c.</a></p>
  503.  
  504. </div>
  505. {block:Pagination}<div id="pagination">
  506. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">&laquo;</a>{/block:PreviousPage}
  507. {block:JumpPagination length="5"}
  508. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  509. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  510. {block:NextPage}<a href="{NextPage}" class="jump_page">&raquo;</a>{/block:NextPage}</div>
  511. {/block:Pagination}
  512.  
  513. </div></div></div>
  514.  
  515. </div></div>
  516.  
  517. <div id="entries">
  518.  
  519. <div id="entry">
  520.  
  521. <!-- Posts -->
  522.  
  523. <div class="postcol">
  524. {block:Posts}
  525. <div class="posts">
  526. {block:Text}
  527. {block:Title}<h2>{Title}</h2>{/block:Title}
  528. {Body}
  529. {/block:Text}
  530.  
  531. <!-- Asks -->
  532.  
  533. {block:Answer}
  534. <div id="askdashimg"><center><img src="{AskerPortraitURL-64}"></div></center>
  535. <div id="quest"><b><div style="padding:1px; background-color:{color:background};">{Asker}:</div></b>
  536. <i>{Question}</i></center></div><br>
  537. <div id="ans"><center>{Answer}</center></div>
  538. {/block:Answer}
  539.  
  540. <!-- Quotes -->
  541.  
  542. {block:Quote}
  543. <div class="quote">❝ <em>{Quote}</em> ❞</div>
  544. {block:Source}<p><div class="quotesource"><em>— {Source}</em></div></p>{/block:Source}
  545. {/block:Quote}
  546.  
  547.  
  548. <!-- Links -->
  549.  
  550. {block:Link}
  551. <div class="links"><a href="{URL}">{Name}</a></div>
  552. {block:Description}{Description}{/block:Description}
  553. {/block:Link}
  554.  
  555.  
  556. <!-- Chats -->
  557.  
  558. {block:Chat}
  559. {block:Title}<h2>{Title}</h2>{/block:Title}
  560. {block:Lines}
  561. {block:Label}<b>{Label}</b> {Line}<br>{/block:Label}
  562. {/block:Lines}
  563. {/block:Chat}
  564.  
  565. <!-- Photos, Photosets, and Videos -->
  566.  
  567. {block:Photo}
  568. {LinkOpenTag}
  569. <img src="{PhotoURL-500}" alt="{PhotoAlt}">
  570. {LinkCloseTag}
  571. {block:Caption}{Caption}{/block:Caption}
  572. {/block:Photo}
  573.  
  574. {block:Photoset}
  575. {Photoset-500}
  576. {block:Caption}{Caption}{/block:Caption}
  577. {/block:Photoset}
  578.  
  579. {block:Video}
  580. {Video-500}
  581. {block:Caption}{Caption}{/block:Caption}
  582. {/block:Video}
  583.  
  584. {block:Audio}
  585. <div class="audio">
  586. {block:AlbumArt}<img src="{AlbumArtURL}" class="albumart">{/block:AlbumArt}
  587.  
  588. <!-- Audio posts -->
  589.  
  590. </div>
  591. <div class="playbutton"><div class="playbox">
  592. {AudioPlayerWhite}
  593. </div></div>
  594. <div class="trackname">
  595. {block:TrackName}<b>TRACK:</b> {TrackName}{/block:TrackName}
  596. {block:Artist}<br><b>ARTIST:</b> {Artist}{/block:Artist}
  597. {block:Album}<br><b>ALBUM:</b> {Album}{/block:Album}
  598. <br>
  599. </div>
  600. {block:Caption}{Caption}{/block:Caption}
  601. {/block:Audio}
  602.  
  603. <!-- Permalink -->
  604.  
  605. <hr size="1px" color="{color:Posts border}">
  606. <div class="permalink">
  607. POSTED <a href="{Permalink}">{TimeAgo}</a> WITH <a href="{Permalink}">{NoteCountWithLabel}</a><div id="tags">{block:Tags} #<a href="{TagURL}">{Tag}</a>{/block:Tags}</div>
  608. </div>{block:PermalinkPage}<p>{PostNotes-16}</p>{/block:PermalinkPage}</div>
  609. {/block:Posts}
  610. </div>
  611.  
  612. </div>
  613.  
  614. <div id="credit">
  615. <a href="http://500daysoflahey.tumblr.com/">© 500daysoflahey</a></div>
  616.  
  617. </body>
  618. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement