Don't like ads? PRO users don't see any ads ;-)

Theme 2 - The Sun Will Rise

By: themesbyamy on Mar 7th, 2012  |  syntax: None  |  size: 12.97 KB  |  hits: 547  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!--
  2. the sun will rise (theme #2) by amy (whoredairs). this theme is dedicated to the hunger games- may the odds be ever in your favor!
  3.                  
  4.                                  "Deep in the meadow, under the willow
  5.                                   A bed of grass, a soft green pillow
  6.                              Lay down your head, and close your sleepy eyes
  7.                               And when again they open, the sun will rise."
  8.                                                      -
  9.                                   THIS THEME IS NOT TO BE USED AS A BASE.
  10.                                  DO NOT REDISTRIBUTE OR REMOVE THE CREDIT.
  11.                                                      -                                              
  12. -->
  13.  
  14. <head>
  15.  
  16. <link href='http://fonts.googleapis.com/css?family=Parisienne' rel='stylesheet' type='text/css'>
  17. <link href='http://fonts.googleapis.com/css?family=Bad+Script' rel='stylesheet' type='text/css'>
  18. <link href='http://fonts.googleapis.com/css?family=Basic' rel='stylesheet' type='text/css'>
  19.  
  20.                                    <!-- DEFAULT VARIABLES -->
  21.  
  22.    <meta name="color:background" content="#CDD9CC" />
  23.    <meta name="color:sidebar" content="#E2EBDD" />
  24.    <meta name="color:sidebar hover" content="F5FCF3" />
  25.    <meta name="color:posts" content="#E2EBDD" />
  26.    <meta name="color:ask" content="F5FCF3" />
  27.    <meta name="color:navigation" content="#E2EBDD" />
  28.    <meta name="color:navigation links" content="#C1CCBC" />
  29.    <meta name="color:info" content="F5FCF3" />
  30.  
  31.    <meta name="color:text" content="#919992" />
  32.    <meta name="color:links" content="#92A587" />
  33.    <meta name="color:links hover" content="#E4EEDE" />
  34.    <meta name="color:scrollbarbg" content="#BCC7BB" />
  35.    <meta name="color:scrollbar" content="#D7EBD5" />
  36.    <meta name="color:selection" content="#D7EBD5" />
  37.  
  38.    <meta name="image:background picture" content=""/>
  39.    <meta name="image:sidebar picture" content=""/>
  40.  
  41.    <meta name="font:body" content="georgia"/>
  42.    <meta name="font:title" content="georgia"/>
  43.  
  44.    <meta name="text:link 1 title" content="title of link" />
  45.    <meta name="text:link 1"  />
  46.    <meta name="text:link 2 title" content="title of link" />
  47.    <meta name="text:link 2"  />
  48.    <meta name="text:link 3 title" content="title of link" />
  49.    <meta name="text:link 3"  />
  50.    <meta name="text:link 4 title" content="title of link" />
  51.    <meta name="text:link 4"  />
  52.  
  53.   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  54.     <title>{Title}{block:SearchPage}, Search results for: {SearchQuery}{/block:SearchPage}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  55.     {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  56.     <link rel="shortcut icon" href="{Favicon}" />
  57.     <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  58.     <style type="text/css">
  59.  
  60. ::-webkit-scrollbar {
  61. width: 12px;
  62. height:auto;
  63. background:{color:scrollbarbg};
  64. }
  65.  
  66. ::-webkit-scrollbar-thumb:vertical {
  67. background:{color:scrollbar};
  68. }
  69.  
  70. ::-webkit-scrollbar-thumb:horizontal {
  71. background:{color:scrollbar};
  72. }
  73.  
  74. ::selection{
  75. color:{color:Text};
  76. background-color:{color:selection}
  77. }
  78.  
  79. body {
  80. color:{color:text};
  81. background-color: {color:background};
  82. background-image: url('{image:Background}');
  83. background-attachment: fixed;
  84. background-repeat: no-repeat;
  85. background-position: center;
  86. font-family: 'Basic', sans-serif; ;
  87. font-size: 10px;
  88. text-align: justify
  89. }
  90.  
  91. a:link, a:active, a:visited{
  92. color: {color:links};
  93. text-decoration:none;
  94. }
  95.  
  96. a:hover{
  97. color:{color:links hover};
  98. }
  99.  
  100. #entries {
  101. margin-right: 210px;
  102. float: right;
  103. text-align: justify;
  104. }
  105.  
  106. #posts {
  107. background-color: {color:posts};
  108. width: 500px;
  109. text-align: justify;
  110. margin-bottom:7px;
  111. padding: 4px;
  112. font-family: 'Basic', sans-serif;
  113. }
  114.  
  115. #posts:hover #info {
  116. opacity:0.8;
  117. }
  118.  
  119. .blogtitle {
  120. color: {color:title};
  121. font-family: 'Parisienne', cursive;
  122. font-size: 21px;
  123. text-align:center;
  124. text-shadow: #FFFFFF -3px 0px 7px;
  125. position:fixed;
  126. line-spacing:80%;
  127. background-color:transparent;
  128. width:260px;
  129. height:auto;
  130. margin-left:240px;
  131. margin-top:90px;
  132. z-index:2;
  133. }
  134.  
  135. .blogtitle:hover {
  136. text-shadow: #EDF2F0 0px 0px 0px {opacity:0.9};
  137. opacity:0.5
  138. }
  139.  
  140. #sidebar {
  141. margin-left:0px;
  142. width:260px;
  143. }
  144.  
  145. #sbar {
  146. width:260px;
  147. margin-left:230px;
  148. top: 130px;
  149. height: 300px;
  150. position:fixed;
  151. background-color: {color:sidebar};
  152. padding:0px;
  153. border-bottom-right-radius: 98px;
  154. -moz-border-radius-bottomright: 98px;
  155. -moz-border-radius-topleft: 99px;
  156. border-top-left-radius: 99px;
  157. }
  158.  
  159. #sidebarpicture img {
  160. width: 260px;
  161. height: 300px;
  162. margin-left:0px;
  163. margin-top:0px;
  164. height: auto;
  165. text-align:center;
  166. opacity:1.0;
  167. filter:alpha(opacity=10);
  168. -moz-border-radius-bottomright: 99px;
  169. border-bottom-right-radius: 99px;
  170. -moz-border-radius-topleft: 99px;
  171. border-top-left-radius: 99px;
  172. }
  173.  
  174. #stext {
  175. top:130px;
  176. margin-left:0px;
  177. position: fixed;
  178. width:250px;
  179. height:217px;
  180. background-color: {color:sidebar};
  181. font-size: 9px;
  182. text-align: center;
  183. font-family: 'Basic', sans-serif;
  184. border-right: 0px solid;
  185. letter-spacing: 1px;
  186. padding: 5px;
  187. padding-top:80px;
  188. filter:alpha(opacity=30);
  189. -moz-opacity:0.3;
  190. -khtml-opacity: 0.2;
  191. opacity: 0.3;
  192. -webkit-transition: all 0.6s ease-out;
  193. -moz-transition: all 0.6s ease-out;
  194. transition: all 0.6s ease-out;
  195. -moz-border-radius-bottom-right: 97.7px;
  196. border-bottom-right-radius: 97.7px;
  197. -moz-border-radius-topleft: 97.7px;
  198. border-top-left-radius: 97.7px;
  199. }
  200.  
  201. #stext:hover{
  202. width:250px;
  203. height:215px;
  204. background-color: {color:sidebar hover};
  205. opacity:0.87;
  206. }
  207.  
  208. #title{
  209. color:{color:title};
  210. font-family: 'Parisienne', cursive;
  211. font-size:17px;
  212. line-height:90%;
  213. letter-spacing: 1.5px;
  214. font-weight:normal;
  215. text-transform:lowercase;
  216. margin-left:5px;
  217. padding-top:2px;
  218. text-align:left
  219. }
  220.  
  221. .ask {
  222. background-color: {color:ask};
  223. height:auto;
  224. width:500px;
  225. font-family:'Bad Script', cursive;
  226. font-size:12px;
  227. text-align:center;
  228. border-bottom:1.5px solid {color:background; width:60%};
  229. padding:2px;
  230. }
  231.  
  232. #answer {
  233. color:{color:font};
  234. }
  235.  
  236. #asker {
  237. margin-left:350px;
  238. font-size:10px;
  239. text-align:left;
  240. text-transform:uppercase;
  241. color:{color:text};
  242. }
  243.  
  244. #navigation {
  245. width:103px;
  246. margin-left: 180px;
  247. margin-top: 220px;
  248. position: fixed;
  249. }
  250.  
  251. #navigation a{
  252. width: 50px;
  253. height: 40px;
  254. display: table;
  255. font-family: 'Bad Script', cursive;
  256. font-size: 12px;
  257. font-color: {color:text}
  258. letter-spacing: 1px;
  259. line-height:40px;
  260. text-align: center;
  261. background-color: {color:navigation};
  262. margin: 2px 0px 2px 0px;
  263. opacity: 0.8;
  264. z-index: 8
  265. }
  266.  
  267. #navigation a:hover{
  268. opacity: 1
  269. -webkit-transition: all 0.5s ease-in-out;
  270. -moz-transition: all 0.5s ease-in-out;
  271. transition: all 0.5s ease-in-out;
  272. -ms-transition: all 0.5s ease-in-out;
  273. -o-transition: all 0.5s ease-in-out;
  274. }
  275.  
  276. #linknav {
  277. margin-top:314px;
  278. margin-left:74px;
  279. position:fixed;
  280. }
  281.  
  282. #linknavtitle {
  283. background-color:{color:navigation links};
  284. opacity:0.7;
  285. height: 5px;
  286. width: 189px;
  287. font-size:13px;
  288. color:{color:text};
  289. font-family: trebuchet ms;
  290. text-align:right;
  291. text-transform:lowercase;
  292. letter-spacing:3px;
  293. line-height:1px;
  294. position:fixed;
  295. padding: 5px;
  296. -webkit-transform: rotate(-90deg);
  297. -moz-transform: rotate(-90deg);
  298. -o-transform: rotate(-90deg);
  299. writing-mode: tb-rl;
  300. z-index:0;
  301. -webkit-transition: all 0.7s ease-in-out;
  302. -moz-transition: all 0.7s ease-in-out;
  303. transition: all 0.7s ease-in-out;
  304. -ms-transition: all 0.7s ease-in-out;
  305. -o-transition: all 0.7s ease-in-out;
  306. -moz-border-radius-top-right: 20px;
  307. border-top-right-radius: 20px;
  308. -moz-border-radius-top-left: 20px;
  309. border-top-left-radius: 20px;
  310. }
  311.  
  312. #linknavtitle:hover {
  313. opacity:1;
  314. -moz-border-radius-top-right: 0px;
  315. border-top-right-radius: 0px;
  316. -moz-border-radius-top-left: 0px;
  317. border-top-left-radius: 0px;
  318. }
  319.  
  320. #linknav:hover #links {
  321. opacity:1;
  322. margin-top:-85px;
  323. z-index:0;
  324. padding-left:15px;
  325.  
  326. }
  327.  
  328. #links {
  329. opacity:0;
  330. margin-left:-10px;
  331. -webkit-transition: all 1.3s ease-in-out;
  332. -moz-transition: all 1.3s ease-in-out;
  333. -o-transition: all 1.3s ease-in-out;
  334. -ms-transition: all 1.3s ease-in-out;
  335. transition: all 1.3s ease-in-out;
  336. }
  337.  
  338. #links a {
  339. width:60px;
  340. height:40px;
  341. margin-left:30px;
  342. margin-top:5px;
  343. display:table;
  344. font-family: 'Bad Script', cursive;
  345. font-size:11px;
  346. font-color: {color:links};
  347. text-align:center;
  348. text-transform:lowercase;
  349. line-height:40px;
  350. background-color:{color:navigation links};
  351. z-index:1;
  352. -webkit-transition: all 0.6s ease-in-out;
  353. -moz-transition: all 0.6s ease-in-out;
  354. -o-transition: all 0.6s ease-in-out;
  355. -ms-transition: all 0.6s ease-in-out;
  356. transition: all 0.6s ease-in-out;
  357. -moz-border-radius-topleft: 2px;
  358. border-top-left-radius: 2px;
  359. }
  360.  
  361. #links a:hover {
  362. color:{color:links};
  363. background-color:{color:navigation};
  364. -webkit-transition: all 0.6s ease-in-out;
  365. -moz-transition: all 0.6s ease-in-out;
  366. -o-transition: all 0.6s ease-in-out;
  367. -ms-transition: all 0.6s ease-in-out;
  368. transition: all 0.6s ease-in-out;
  369. z-index:1
  370. }
  371.  
  372. #audiopost {display:block;
  373. background-color:white;
  374. }
  375.  
  376. #pagination {
  377. width: 49px;
  378. height: 20px;
  379. position:fixed;
  380. font-family: 'Basic', sans-serif;
  381. font-size: 10px;
  382. font-color: {color:links}
  383. letter-spacing: 1px;
  384. text-align: center;
  385. line-height: 20px;
  386. background-color: {color:navigation};
  387. margin-left:181px;
  388. margin-top:400px;
  389. opacity:0.8
  390. }
  391.  
  392. #info {
  393. margin-left:510px;
  394. padding:5px;
  395. width:100px;
  396. height:auto;
  397. background-color: transparent;
  398. font-family: 'Basic', sans-serif;
  399. font-size:11px;
  400. font-weight:bold;
  401. text-align:left;
  402. text-transform:lowercase;
  403. line-height:90%;
  404. letter-spacing: -0.75px;
  405. position:absolute;
  406. opacity:0;
  407. -webkit-transition-duration: 0.7s;
  408. -moz-transition-duration: 0.7s;
  409. -moz-border-radius-topleft: 15px;
  410. border-top-left-radius: 15px;
  411. -moz-border-radius-bottomright: 15px;
  412. border-bottom-right-radius: 15px;
  413. }
  414.  
  415. blockquote {
  416. padding:0px;
  417. padding-left:5px;
  418. margin:5px;
  419. border-left:2px solid {color:text}
  420. }
  421.  
  422. #audio {
  423. background-color:black;
  424. width:500px;
  425. }
  426.  
  427. .user_1 .label {
  428. color:{color:text};
  429. font-weight:bold;
  430. }
  431.  
  432. .user_2 .label {
  433. color:{color:text};
  434. font-weight:bold
  435. }
  436.  
  437. ul.chat, .chat ol, .chat li {
  438. list-style:none;
  439. margin:0px;
  440. padding:0px;
  441. }
  442.  
  443. .notes img{
  444. width:10px;
  445. position:relative;
  446. top:1px
  447. }
  448.  
  449. ol.notes, .notes li{
  450. list-style:none;
  451. margin:0px;
  452. padding:0px
  453. }
  454.  
  455. </style>
  456. </head>
  457. <body>
  458.  
  459. <div id="navigation">
  460. <a href="/">refresh</a>  <a href="/ask">message</a><a href="/archive">past</a> <a href="http://whoredairs.tumblr.com">theme</a></div></div>
  461.  
  462.  
  463. <div id="linknav">
  464. <div id="linknavtitle">links    <b>↑</b></div>
  465. <div id="links">
  466. <a href="{text:link 1}">{text:link 1 title}</a>
  467. <a href="{text:link 2}">{text:link 2 title}</a>
  468. <a href="{text:link 3}">{text:link 3 title}</a>
  469. <a href="{text:link 4}">{text:link 4 title}</a>
  470. </div></div></div>
  471.  
  472. <div id="pagination">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">« </a>{/block:PreviousPage}{CurrentPage}/{TotalPages}{block:NextPage}<a href="{NextPage}"> »</a>{/block:NextPage}{/block:Pagination}</a>
  473. </div>
  474.  
  475. <div id="sidebar">
  476. <div class= "blogtitle""><a href="/">{Title}</a></div>
  477. <div id="sbar">
  478. <div id="sidebarpicture"><img src="{image:sidebar picture}"></div>
  479. <div id="stext">{Description}</div>
  480.  
  481. </div></div>
  482.  
  483. </div>
  484. </div>
  485.  
  486. <div id="entries">
  487. {block:Posts}
  488. <div id="posts">
  489.  
  490. <div id="info">
  491. {block:date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}{block:NoteCount}<br><font color=F0848B>&hearts;</font>{NoteCountWithLabel}{/block:NoteCount}</a>&nbsp;{/block:date}
  492. <br><br>
  493. {block:HasTags}<div id="tags">{block:Tags}<a href="{TagURL}" target="_blank">#{Tag} </a>{/block:Tags}</div>{/block:HasTags}
  494.  
  495. </div>
  496.  
  497. {block:Text}<div id="title">{block:Title}{Title}{/block:Title}</div> <p align=justify>{Body}</p>{/block:Text}
  498.  
  499. {block:Link}<div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}{/block:Link}
  500.  
  501. {block:Quote}<div id="title">"{Quote}"<br></div><br>{block:Source}~ {Source}{/block:Source}{/block:Quote}
  502.  
  503. {block:Answer}<div class= ask><center>{Question}</center><br></div><div id= asker>~ {Asker}</div><div id="answer">{Answer}</div>{/block:Answer}
  504.  
  505. {block:Chat}{block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}<ul class="chat">{block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>{/block:Chat}
  506.  
  507. {block:Audio}<div id="audio">{AudioPlayerBlack}</div><center>{block:Caption}{Caption}{/block:Caption}{PlayCount} plays</center>{/block:Audio}
  508.  
  509. {block:Video}<center>{Video-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  510.  
  511. {block:Photo}{LinkOpenTag}<a href="{Permalink}"><img width="500" src="{PhotoURL-HighRes}"></a>{LinkCloseTag}<br>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  512.  
  513. {block:Photoset}{Photoset-500}<br>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  514. </div>
  515. {/block:posts}
  516.  
  517. <div class="notes">{block:PostNotes}{PostNotes}{/block:PostNotes}
  518.  
  519. </div>
  520.  
  521. </body>