hawthorneys

THEME #07; by nayel

Jan 27th, 2013
2,609
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.58 KB | None | 0 0
  1. <!--Theme 07 By Nayel // http://hawthorneys.tumblr.com
  2. --- THE BREAKFAST CLUB THEME | @ HAWTHORNEYS ---
  3. > please do not steal
  4. > please do not redistribute
  5. > please do not claim as your own
  6. > please do not use this as a base code and take parts of it
  7. > you can edit as long as credit is on there somewhere
  8. -!-->
  9. <html>
  10. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  11. <html xmlns="http://www.w3.org/1999/xhtml">
  12. <head>
  13.  
  14. <!--Colors-->
  15. <meta name="color:background" content="#ffffff"/>
  16. <meta name="color:scrollbar" content="#dfdfdf" />
  17. <meta name="color:desc" content="#202020"/>
  18. <meta name="color:text" content="#828282"/>
  19. <meta name="color:link" content="#8ea089"/>
  20. <meta name="color:link hover" content="#e8e8e8"/>
  21. <meta name="color:border" content="#e8e8e8"/>
  22. <meta name="color:posts" content="#f5f5f5"/>
  23. <meta name="color:side" content="#202020"/>
  24. <meta name="color:side accent" content="#fafafa"/>
  25. <meta name="color:box" content="#fafafa"/>
  26. <meta name="color:info bg" content="#fafafa"/>
  27. <meta name="color:chat" content="#fafafa"/>
  28.  
  29. <!--Links and Options-->
  30. <meta name="text:link 1" content="link" />
  31. <meta name="text:link 1 url" content="/" />
  32. <meta name="text:link 2" content="link" />
  33. <meta name="text:link 2 url" content="/" />
  34. <meta name="text:link 3" content="link" />
  35. <meta name="text:link 3 url" content="/" />
  36. <meta name="text:link 4" content="link" />
  37. <meta name="text:link 4 url" content="/" />
  38. <meta name="if:Show Link1" content="1"/>
  39. <meta name="if:Show Link2" content="1"/>
  40. <meta name="if:Show Link3" content="1"/>
  41. <meta name="if:Show Link4" content="1"/>
  42.  
  43.  
  44. <!--Images-->
  45. <meta name="image:Background" content""/>
  46. <meta name="image:Sidebar" content""/>
  47. <meta name="image:side background" content""/>
  48.  
  49. {block:Description}
  50. <meta name="description" content="{MetaDescription}" />{/block:Description}
  51. <title>
  52. {block:PostSummary}
  53. {PostSummary} - {/block:PostSummary}{Title}</title>
  54. </style>
  55. <link rel="shortcut icon" href="{Favicon}" />
  56. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  57.  
  58. <style type="text/css">
  59.  
  60.  
  61. @font-face {
  62. font-family: 'Inconsolata';
  63. font-style: normal;
  64. font-weight: normal;
  65. src: local('Inconsolata'), url('http://themes.googleusercontent.com/static/fonts/inconsolata/v5/BjAYBlHtW3CJxDcjzrnZCIbN6UDyHWBl620a-IRfuBk.woff') format('woff');}
  66.  
  67.  
  68. @font-face { font-family: 'WebSymbolsRegular'; src: url('http://static.tumblr.com/ekfbsgu/3q1m4j9nx/websymbols-regular-webfont.ttf');}
  69.  
  70. ::-webkit-scrollbar {width: 8px; height:auto; background:{color:background}}
  71. ::-webkit-scrollbar-corner {padding:2px;background:{color:background}}
  72. ::-webkit-scrollbar-button:vertical {height:5px; display: block; background:{color:scrollbar}}
  73. ::-webkit-scrollbar-button:horizontal {width: 7px; height: 5px; display: block; background:{color:scrollbar}}
  74. ::-webkit-scrollbar-thumb:vertical {background:{color:scrollbar};}
  75. ::-webkit-scrollbar-thumb:horizontal {background:{color:background};}
  76. ::-webkit-scrollbar-thumb {background: {color:scrollbar};}
  77.  
  78. body{
  79. background-color: {color:Background};
  80. background-image: url({image:Background});
  81. background-attachment: fixed;
  82. background-repeat: repeat;
  83. background-position: center;
  84. font-family:cambria;
  85. font-size:11px;
  86. line-height:12px;
  87. color:{color:Text};
  88. }
  89.  
  90. a:link, a:active, a:visited{
  91. color: {color:Link};
  92. text-decoration:none;
  93. }
  94.  
  95. a {
  96. color:{color:link};
  97. text-decoration:none;
  98. outline:none;
  99. opacity:1 ;
  100. -webkit-transition: all 0.5s;
  101. -moz-transition: all 0.5s;
  102. transition: all 0.5s;
  103. }
  104.  
  105. a:hover{
  106. color: {color:Link Hover};
  107. }
  108.  
  109. h1{
  110. font-family:inconsolata;
  111. font-size:12px;
  112. text-transform:uppercase;
  113. }
  114.  
  115. h2{
  116. font-family:inconsolata;
  117. font-size:12px;
  118. text-transform:uppercase;
  119. text-align:center;
  120. }
  121. #container {
  122. margin:0px;
  123. width:700px;
  124. }
  125.  
  126. #entry {
  127. position:relative;
  128. width:500px;
  129. margin-left:480px;
  130. margin-top:30px;
  131. margin-bottom:50px;
  132. padding-top:15px;
  133. padding-right:15px;
  134. padding-left:15px;
  135. border:1px solid{color:border};
  136. background-color:{color:posts};
  137. }
  138.  
  139. #entry:hover .tags {
  140. opacity:1;
  141. position:absolute;
  142. margin-left:520px;
  143. -webkit-transition-duration:0.7s;
  144. -moz-transition-duration: 0.7s;
  145. }
  146.  
  147. .tags{
  148. position:absolute; padding-top: 2px; width: 200px; opacity: 0; font-family: inconsolata; font-size:10px; text-transform: none; margin-left:480px; margin-top:-10px;
  149. -webkit-transition: opacity 0.5s linear;
  150. -webkit-transition: all 0.5s ease-in-out;
  151. -moz-transition: all 0.5s ease-in-out;
  152. -o-transition: all 0.5s ease-in-out;
  153. }
  154.  
  155. .tags a{
  156. -webkit-transition: opacity 0.5s linear;
  157. -webkit-transition: all 0.5s ease-in-out;
  158. -moz-transition: all 0.5s ease-in-out;
  159. -o-transition: all 0.5s ease-in-out;
  160. }
  161.  
  162.  
  163. #permalink{
  164. font-family:inconsolata;
  165. text-align:center;
  166. margin-top:5px;
  167. margin-bottom:15px;
  168. padding:5px;
  169. text-transform:uppercase;
  170. font-style:none;
  171. font-size:8px;
  172. line-height:80%;
  173. height:10px;
  174. background-color:{color:info bg};
  175. border-top:1px solid {color:border};
  176. border-bottom:1px solid{color:border};
  177. }
  178.  
  179. #side {
  180. text-align:center;
  181. position:fixed;
  182. width:380px;
  183. height:100%;
  184. margin-top:-30px;
  185. margin-left:-8px;
  186. z-index:1;
  187. padding:4px;
  188. background-color:{color:side};
  189. background-image:url('{image:side background}');
  190. }
  191.  
  192. #side:hover .links {
  193. opacity:1;
  194. -moz-transition-duration:0.6s;
  195. -webkit-transition-duration:0.6s;
  196. -o-transition-duration:0.6s;
  197. }
  198. .sidebar img{
  199. margin-top:45%;
  200. height:auto;
  201. margin-left:-5%;
  202. max-width:140;
  203. border-radius:140px;
  204. opacity:.8;
  205. }
  206.  
  207. .links{
  208. opacity:0;
  209. font-size:8px;
  210. width:160px;
  211. text-align:center;
  212. text-transform:uppercase;
  213. font-family:calibri;
  214. font-style:italic;
  215. margin-left:28%;
  216. margin-top:4px;
  217. margin-bottom:4px;
  218. color:#fff;
  219. -moz-transition-duration:0.6s;
  220. -webkit-transition-duration:0.6s;
  221. -o-transition-duration:0.6s;
  222. }
  223. .links a:hover{
  224. background-color:transparent;
  225. -moz-transition-duration:0.6s;
  226. -webkit-transition-duration:0.6s;
  227. -o-transition-duration:0.6s;
  228. }
  229.  
  230. .navigate{
  231. font-size:75px;
  232. width:50px;
  233. padding:5px;
  234. text-transform:uppercase;
  235. margin-left:1120px;
  236. margin-top:-135px;
  237. margin-bottom:4px;
  238. text-shadow:0px 2px 2px #e8e8e8;
  239. }
  240.  
  241. .desc{
  242. font-family:cambria;
  243. font-style:italic;
  244. font-size:9px;
  245. margin-top:5px;
  246. margin-left:30%;
  247. margin-bottom:-10px;
  248. width:140px;
  249. text-align:justify;
  250. letter-spacing:1px;
  251. background-color:{color:desc};
  252. padding:3px;
  253. }
  254.  
  255. .posttitle{
  256. font-size: 10px;
  257. line-height: 8px;
  258. font-style:none;
  259. font-weight:bold;
  260. text-transform:uppercase;
  261. font-family:calibri;
  262. }
  263.  
  264. .symbols {
  265. font-family:WebSymbolsRegular;
  266. font-size: 6px;
  267. }
  268.  
  269.  
  270. blockquote{
  271. margin-left:10px;
  272. padding-left:4px;
  273. border-left: 3px solid {color:Text};
  274. }
  275.  
  276. #question {
  277. background-color:{color:box};
  278. color: {color:text};
  279. border-top: dotted 1px {color:border};
  280. margin-left:0px;
  281. padding:11px;
  282. margin-top: 5px;
  283. margin-bottom:5px;
  284. font-family:cambria;
  285. font-size:10px;
  286. font-style:italic;
  287. text-align:left;
  288. }
  289.  
  290. .audio {
  291. height:60px;
  292. padding:5px;
  293. margin-bottom:5px; }
  294. .audio-album {
  295. position:absolute;
  296. margin-top:-10px;
  297. margin-left:-5px;
  298. width:60px;
  299. padding:5px;
  300. background-color: #fcfcfc;
  301. border: 1px solid #f8f8f8;
  302. border-radius:5px;}
  303. .audio-player {
  304. opacity:0.6;
  305. filter:alpha(opacity=60);
  306. border:2px solid {color:border};
  307. border-radius:8px;
  308. width:25px;
  309. height:25px;
  310. overflow:hidden;
  311. position:absolute;
  312. z-index:2;
  313. margin-left:15px;
  314. margin-top:15px;}
  315. .audio-info {
  316. font-family:calibri;
  317. text-transform:uppercase;
  318. font-size:8px;
  319. margin-top:-10px;
  320. position:relative;
  321. margin-left:70px;
  322. padding:5px; }
  323. .space { height:{text:entry space};}
  324.  
  325. .chat {line-height:12px; list-style:none; font-family:calibri;text-transform:uppercase; font-size:8px;}
  326. .chat ul {line-height:15px; list-style:none; padding:0px; line-height:20px;}
  327. .person1 {background-color:{color:chat}; padding-left:6px; padding-right:6px;}
  328. .person1 .label {font-weight:bold;}
  329. .person2 {background-color:{color:entries}; padding-left:6px; padding-right:6px;}
  330. .person2 .label {font-weight:bold;}
  331. .person3 {background-color:{color:chat}; padding-left:6px; padding-right:6px;}
  332. .person3 .label {font-weight:bold;}
  333. .person4 {background-color:{color:entries}; padding-left:6px; padding-right:6px;}
  334. .person4 .label {font-weight:bold;}
  335. .person5 {background-color:{color:chat}; padding-left:6px; padding-right:6px;}
  336. .person5 .label {font-weight:bold;}
  337. .person6 {background-color:{color:entries}; padding-left:6px; padding-right:6px;}
  338. .person6 .label {font-weight:bold;}
  339.  
  340. ol {
  341. list-style-type: none;
  342. font-size:8px;
  343. font-family: inconsolata;
  344. text-transform: uppercase;
  345. margin: 0; }
  346.  
  347. ol.notes li {
  348. width: 485px;
  349. padding: 2px;
  350. margin: 0 0 5px -35px; }
  351.  
  352. ol.notes li:hover {
  353. }
  354.  
  355. ol.notes li img {
  356. width:15px;
  357. border-radius:20px;
  358. padding-right: 10px;
  359. margin-bottom: 0px;
  360. opacity: 0.85;
  361. filter:alpha(opacity=85); }
  362.  
  363. ol.notes li img:hover {
  364. opacity: 1;
  365. filter:alpha(opacity=100); }
  366.  
  367. #credit {
  368. position:fixed;
  369. font-family:calibri;
  370. letter-spacing:1px;
  371. text-transform:uppercase;
  372. font-size:8px;
  373. padding:5px;
  374. border:1px solid {color:border};
  375. background-color:{color:background};
  376. text-color:{color:background};
  377. font-weight:bold;
  378. right:10px;
  379. bottom:7px;
  380. text-align:center;
  381. color:{color:text};
  382. -webkit-transition: all 0.8s ease-in-out;
  383. -moz-transition: all 0.8s ease-in-out;
  384. -o-transition: all 0.8s ease-in-out;
  385. -ms-transition: all 0.8s ease-in-out;
  386. transition: all 0.8s ease-in-out;
  387. }
  388. #credit:hover{
  389. background-color:#000000;
  390. color:{color:background};
  391. -webkit-transition: all 0.5s ease-in-out;
  392. -moz-transition: all 0.5s ease-in-out;
  393. -o-transition: all 0.5s ease-in-out;
  394. -ms-transition: all 0.5s ease-in-out;
  395. transition: all 0.5s ease-in-out; }
  396. {CustomCSS}
  397. </style>
  398.  
  399. <link rel="shortcut icon" href="{Favicon}">
  400. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" /><meta name="viewport" content="width=820" />
  401.  
  402.  
  403. <script type="text/javascript"
  404. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  405.  
  406. </head>
  407. <body>
  408. <div id="container">
  409.  
  410. <div id="side">
  411. <div class="sidebar img"><a href="/"><img src="{image:Sidebar}" style="width:145px;height:145px;" ></a></div>
  412.  
  413. <div class="links">
  414. <a href="/">home</a>&nbsp;&nbsp;
  415. <a href="/ask">mssg</a>&nbsp;&nbsp;
  416. {Block:ifShowLink1}<a href="{text:link 1 url}">{text:link 1}</a>{/Block:ifShowLink1}&nbsp;&nbsp;
  417. {Block:ifShowLink2}<a href="{text:link 2 url}">{text:link 2}</a>{/Block:ifShowLink2}&nbsp;&nbsp;
  418. {Block:ifShowLink3}<a href="{text:link 3 url}">{text:link 3}</a>{/Block:ifShowLink3}&nbsp;&nbsp;
  419. {Block:ifShowLink4}<a href="{text:link 4 url}">{text:link 4}</a>{/Block:ifShowLink4}
  420. </div>
  421.  
  422. <div class="desc">{Description}</div>
  423. <br>
  424. <div class="navigate">
  425. {block:Pagination}
  426. {block:NextPage}
  427. <a href="{NextPage}"> » </a>
  428. {/block:NextPage}<br><br><br><br>
  429. {block:PreviousPage}
  430. <a href="{PreviousPage}"> « </a>
  431. {/block:PreviousPage}
  432. {/block:Pagination}
  433. </div>
  434. </div>
  435.  
  436. {block:Posts}
  437. <div id="entry">
  438.  
  439. <div class="tags">{block:Tags}<a href="{TagURL}"><span class="symbols">,</span> {Tag}&nbsp;&nbsp;</a><br>
  440. {/block:Tags}</div>
  441. {/block:HasTags}
  442.  
  443. {block:Text}
  444. {block:Title}
  445. <div class="posttitle">{Title}</div>
  446. {/block:Title}
  447. {Body}
  448. {/block:Text}
  449.  
  450. {block:Link}
  451. <div class="posttitle">
  452. <a href="{URL}">{Name}</a>
  453. </div>
  454. {block:Description}{Description}{/block:Description}
  455. {/block:Link}
  456.  
  457. {block:Photo}
  458. <center>
  459. {LinkOpenTag}
  460. <a href="{permalink}">
  461. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500"></a>
  462. {LinkCloseTag}
  463. </center>
  464. {block:Caption}{Caption}{/block:Caption}
  465. {block:ContentSource}
  466. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  467. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  468. {/block:SourceLogo}
  469. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  470. {/block:ContentSource}
  471. {block:ReblogParentURL}
  472. <!-- {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  473. {/block:ReblogParentURL}
  474. {/block:Photo}
  475.  
  476. {block:Photoset}
  477. {Photoset-500}
  478. {block:Caption}{Caption}{/block:Caption}
  479. {/block:Photoset}
  480.  
  481. {block:Quote}
  482. <h1><big>❝</big>&nbsp;{Quote}<h1>
  483. {block:Source}
  484. <h2>- {Source}</h2>
  485. {/block:Source}
  486. {/block:Quote}
  487.  
  488.  
  489. {block:Chat}
  490. {block:Title}<a href="{Permalink}"><div class="posttitle">{Title}</div></a>{/block:Title}
  491. <div class="chat"><ul>{block:Lines}
  492. <li class="person{UserNumber}">{block:Label}
  493. <span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ul></div>
  494. {/block:Chat}
  495.  
  496. {block:Audio}
  497. <div class="audio">
  498. {block:AlbumArt}<img class="audio-album" src="{AlbumArtURL}">{/block:AlbumArt}
  499. <div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div>
  500. <div class="audio-info">
  501. {block:TrackName}<b>Title:</b> {TrackName}<BR>{/block:TrackName}
  502. {block:Artist}<b>Artist:</b> {Artist}<BR>{/block:Artist}
  503. {block:Album}<b>Album:</b> {Album}<BR>{/block:Album}
  504. {block:PlayCount}<b>Plays:</b> {PlayCount}<BR>{/block:PlayCount}
  505. </div></div> {block:Caption}{Caption}{/block:Caption}
  506. {/block:Audio}
  507.  
  508. {block:Video}
  509. {Video-500}
  510. {block:Caption}{Caption}{/block:Caption}
  511. {/block:Video}
  512.  
  513. {block:Answer}
  514. <img align="right" src="{AskerPortraitURL-40}"style="width:35px;border-radius:160px;"> <div id="question" style="width:430px;font-style:none;"&nbsp;<b>{Asker}</b> asked: <i>{Question}</i></div>
  515. <i>{Answer}</i>
  516. {/block:Answer}
  517.  
  518. {block:IndexPage}
  519. <div id="permalink"><div id="info">
  520. <a href="{ReblogURL}" target="_blank">reblog</a> -
  521. {block:Date} {TimeAgo}{/block:Date} & <a href="{Permalink}">
  522. {NoteCountWithLabel}</a>&nbsp;<a href="{ReblogParentURL}"title="ReblogParentURL">- via </a> {block:RebloggedFrom}- <big>©</big> <a href="{ReblogRootURL}"title="{ReblogRoottitle}">{ReblogRootName}</a><small></small>{/block:RebloggedFrom}
  523. </div>
  524. {/block:IndexPage}
  525.  
  526. {block:PermalinkPage}<div id="permalink"><a href="{Permalink}">{NoteCountWithLabel}</a>
  527. {block:RebloggedFrom} - <a href="{ReblogParentURL}"> via</a>{/block:RebloggedFrom}
  528. {block:ContentSource} - <a href="{SourceURL}"> source</a>
  529. {/block:ContentSource}
  530. {/block:PermalinkPage}</div>
  531.  
  532.  
  533. {block:PostNotes}
  534. {PostNotes}
  535. {/block:PostNotes}
  536. </div>
  537. {/block:Posts}
  538.  
  539. <div id='credit'><a href="http://hawthorneys.tumblr.com">© theme</a></div>
  540. </body>
  541. </html>
Advertisement
Add Comment
Please, Sign In to add comment