API tools faq
paste
Advertisement
olympianthemes

ANCHOR, Theme #2

olympianthemes
Jul 4th, 2013
5,498
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.50 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <!---------------
  4.  
  5. THEME #2 - "ANCHOR" by CREMATA
  6. Rules ad Regulations:
  7. #1: Please DO NOT commit thievery and steal this theme/page. I've worked hard on in so I'd appreciate if you didn't.
  8.  
  9. #2: DO NOT redistribute this theme/page,
  10.  
  11. #3: You can customize to your liking, just make sure that your theme/page is readable and credible for your viewers.
  12.  
  13. --------------->
  14.  
  15. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  16. <head>
  17. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  18.  
  19. <title>{Title}</title>
  20.  
  21. <meta charset="utf-8">
  22.  
  23. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  24.  
  25. <link rel="shortcut icon" href="{Favicon}" />
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  27.  
  28. <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed' rel='stylesheet' type='text/css'>
  29.  
  30. <link href='http://fonts.googleapis.com/css?family=Fjalla+One' rel='stylesheet' type='text/css'>
  31.  
  32. <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
  33.  
  34.  
  35.  
  36.  
  37. <meta name="if:White Player" content"1">
  38.  
  39. <meta name="image:Sidebar" content"1">
  40. <meta name="image:Background" content"">
  41.  
  42. <meta name="color:Accent" content"1">
  43. <meta name="color:Sidebar BG" content"1">
  44. <meta name="color:Sidebar Text" content"1">
  45. <meta name="color:Title Border" content"1">
  46. <meta name="color:Post BG" content"1">
  47. <meta name="color:Post Text" content"1">
  48. <meta name="color:Post Border" content"1">
  49. <meta name="color:Image Border" content"">
  50. <meta name="color:Background" content"">
  51.  
  52. <meta name="text:Link 1" content"">
  53. <meta name="text:Link 1 URL" content"">
  54. <meta name="text:Link 2" content"">
  55. <meta name="text:Link 2 URL" content"">
  56. <meta name="text:Link 3" content"">
  57. <meta name="text:Link 3 URL" content"">
  58. <meta name="text:Link 4" content"">
  59. <meta name="text:Link 4 URL" content"">
  60. <meta name="text:Link 5" content"">
  61. <meta name="text:Link 5 URL" content"">
  62. <meta name="text:Link 6" content"">
  63. <meta name="text:Link 6 URL" content"">
  64.  
  65.  
  66.  
  67.  
  68. </head>
  69. <style type="text/css">
  70. body {
  71. padding: 0;
  72. margin: 0;
  73. list-style: none;
  74. background-color: {color:Background};
  75. background-attachment: fixed;
  76. background-image:url('{image:Background}');
  77. }
  78.  
  79. a {
  80. text-decoration: none;
  81. color: black;
  82. }
  83.  
  84. b,i,strong,em {
  85. color: {color:Accent};
  86. }
  87.  
  88. ::-webkit-scrollbar-thumb:vertical {
  89. height:10px;
  90. background-color: {color:Accent}; }
  91.  
  92. ::-webkit-scrollbar-thumb:horizontal {
  93. height:30px;
  94. background-color:{color:Accent}; }
  95.  
  96. ::-webkit-scrollbar {
  97. height: 10px;
  98. width: 7px;
  99. border-radius: 7px;
  100. background-color: #505050; }
  101.  
  102. /* BEGIN SIDEBAR CODE */
  103.  
  104. #sidebar {
  105. float: left;
  106. padding: 20px;
  107. width: 300px;
  108. height: 100%;
  109. position: fixed;
  110. background-color: {color:Sidebar BG};
  111. border-right: 10px solid {color:Accent};
  112. }
  113.  
  114. .portrait img {
  115. display: block;
  116. padding: 20px;
  117. width: 260px;
  118. height: 200px;
  119. background-color: {color:Image Border};
  120. text-align: center;
  121. }
  122.  
  123. .title {
  124. display: block;
  125. width: 100%;
  126. padding-bottom: 5px;
  127. border-bottom: 3px double {color:Title Border};
  128. font-family: 'Lobster';
  129. font-size: 18px;
  130. color: {color:Accent};
  131. text-align: center;
  132. margin-top: 10px;
  133. }
  134.  
  135. .description {
  136. width: 100%;
  137. height: auto;
  138. overflow: auto;
  139. margin-top: 20px;
  140. text-align: justify;
  141. font-family: cambria;
  142. font-size: 8px;
  143. text-transform: uppercase;
  144. color: {color:Sidebar Text};
  145. }
  146.  
  147. .description a {
  148. color: {color:Accent};
  149. }
  150.  
  151. .description:first-letter {
  152. padding: 5px 15px 5px 13px;
  153. text-align: center;
  154. font-family: 'Lobster';
  155. font-size: 18px;
  156. text-transform: uppercase;
  157. background-color: {color:Accent};
  158. border: 3px double #EEEEEE;
  159. float: left;
  160. color: {color:Sidebar Text};
  161. margin-right: 3px;
  162. }
  163.  
  164. .links {
  165. margin-top: 20px;
  166. display: block;
  167. height: auto;
  168. }
  169.  
  170. .links a {
  171. display: inline-block;
  172. margin: 3px;
  173. width: 85px;
  174. padding: 3px;
  175. font-family: cambria;
  176. font-size: 8px;
  177. text-transform: uppercase;
  178. color: {color:Sidebar Text};
  179. background-color: {color:Accent};
  180. text-align: center;
  181. -webkit-transition: all 0.2s ease-in-out;
  182. -moz-transition: all 0.2s ease-in-out;
  183. -o-transition: all 0.2s ease-in-out;
  184. -ms-transition: all 0.2s ease-in-out;
  185. transition: all 0.2s ease-in-out;
  186. }
  187.  
  188. .links a:hover {
  189. color: {color:Accent};
  190. background-color: {color:Sidebar Text};
  191. }
  192.  
  193. #posts {
  194. position: relative;
  195. display: inline-block;
  196. width: 500px;
  197. padding: 10px;
  198. background-color: {color:Post BG};
  199. margin-bottom: 10px;
  200. margin-top: 20px;
  201. margin-left: 380px;
  202. font-family: cambria;
  203. font-size: 10px;
  204. color: {color:Post Text};
  205. text-align: justify;
  206. border: 3px double {color:Post Border};
  207. }
  208.  
  209. #posts a {
  210. color: {color:Accent};
  211. -webkit-transition: all 0.2s ease-in-out;
  212. -moz-transition: all 0.2s ease-in-out;
  213. -o-transition: all 0.2s ease-in-out;
  214. -ms-transition: all 0.2s ease-in-out;
  215. transition: all 0.2s ease-in-out;
  216. }
  217.  
  218. #posts a:hover {
  219. color: #DDDDDD;
  220. }
  221.  
  222.  
  223. #posts blockquote {
  224. margin-left: 10px;
  225. padding-left: 7px;
  226. padding: 3px 5px 3px 7px;
  227. border-left: 5px solid #202020;
  228. }
  229.  
  230. /* TEXT */
  231.  
  232. .text .texttitle {
  233. display: block;
  234. width: auto;
  235. text-align: left;
  236. font-family: cambria;
  237. font-size: 16px;
  238. color: {color:Accent};
  239. font-style: italic;
  240. margin-top: 0px;
  241. margin-bottom: 10px;
  242. border-left: 50px solid #EEEEEE;
  243. border-right: 90px solid #EEEEEE;
  244. padding-left: 10px;
  245. padding-right: 10px;
  246. -webkit-transition: all 0.5s ease-in-out;
  247. -moz-transition: all 0.5s ease-in-out;
  248. -o-transition: all 0.5s ease-in-out;
  249. -ms-transition: all 0.5s ease-in-out;
  250. transition: all 0.5s ease-in-out;
  251. }
  252.  
  253. .text .texttitle:hover {
  254. border-left: 120px solid {color:Accent};
  255. border-right: 70px solid {color:Accent};
  256. padding-left: 10px;
  257. }
  258.  
  259. .link a {
  260. display: block;
  261. color: {color:Accent};
  262. text-align: center;
  263. font-family: 'Lobster';
  264. font-size: 16px;
  265. letter-spacing: 3px;
  266. -webkit-transition: all 0.2s ease-in-out;
  267. -moz-transition: all 0.2s ease-in-out;
  268. -o-transition: all 0.2s ease-in-out;
  269. -ms-transition: all 0.2s ease-in-out;
  270. transition: all 0.2s ease-in-out;
  271. }
  272.  
  273. .link a:hover {
  274. color: #EEEEEE;
  275. }
  276.  
  277. .chat .convo li {
  278. list-style: none;
  279. text-align: justify;
  280. }
  281.  
  282. .chat h2 {
  283. font-family: 'roboto condensed';
  284. font-size: 20px;
  285. text-align: center;
  286. display: block;
  287. color: {color:Accent};
  288. text-transform: uppercase;
  289. }
  290.  
  291. .line_odd .label {
  292. color: {color:Accent};
  293. }
  294.  
  295. .line_even .label {
  296. color: {color:Sidebar Text};
  297. }
  298.  
  299. .album img {
  300. text-align: left;
  301. position: relative;
  302. width: 100px;
  303. height: 100px;
  304. }
  305.  
  306. .info {
  307. display: inline-block;
  308. width: 325px;
  309. padding: 35px;
  310. {block:IfNotWhitePlayer}background-color: #000;{/block:IfNotWhitePlayer}
  311. {block:IfWhitePlayer}background-color: #FFF;{/block:IfWhitePlayer}
  312. float:left;
  313. position: relative;
  314. height: 30px;
  315. }
  316.  
  317. .music {
  318. width: 20px;
  319. height: 30px;
  320. overflow: hidden;
  321. z-index: 1000;
  322. margin: 15px 24px 13px 16px;
  323. {block:IfNotWhitePlayer}background-color: #000;{/block:IfNotWhitePlayer}
  324. {block:IfWhitePlayer}background-color: #FFF;{/block:IfWhitePlayer}
  325. position: absolute;
  326. margin-top: -67px;
  327. }
  328.  
  329. .track {
  330. text-align: center;
  331. display: block;
  332. font-family: 'lobster';
  333. font-size: 20px;
  334. letter-spacing: 3px;
  335. color:{color:Accent};
  336. margin-top: -10px;
  337. }
  338.  
  339. .artist {
  340. display: block;
  341. font-family: cambria;
  342. font-size: 8px;
  343. {block:IfNotWhitePlayer}color: #FFFFFF;{/block:IfNotWhitePlayer}
  344. {block:IfWhitePlayer}color: #202020;{block:IfWhitePlayer}
  345. letter-spacing: 1px;
  346. text-transform: uppercase;
  347. text-align: center;
  348. }
  349.  
  350. .playcount {
  351. display: block;
  352. font-family: cambria;
  353. font-size: 8px;
  354. {block:IfNotWhitePlayer}color: #FFFFFF;{/block:IfNotWhitePlayer}
  355. {block:IfWhitePlayer}color: #202020;{block:IfWhitePlayer}
  356. letter-spacing: 1px;
  357. text-transform: uppercase;
  358. text-align: center;
  359. }
  360.  
  361. .question {
  362. display: block;
  363. padding: 10px;
  364. text-align: center;
  365. font-family: cambria;
  366. font-size: 10px;
  367. font-style: italic;
  368. color: #202020;
  369. background-color: transparent;
  370. }
  371.  
  372. .answer {
  373. display: block;
  374. text-align: justify;
  375. font-size: 8px;
  376. text-transform: uppercase;
  377. }
  378.  
  379. .asker img {
  380. width: 24px;
  381. height: 24px;
  382. display: block;
  383. text-align: center;
  384. margin: auto;
  385. padding: 10px;
  386. background-color: #DDDDDD;
  387. }
  388.  
  389.  
  390.  
  391. .quote h3 {
  392. display: block;
  393. font-family: 'Lobster';
  394. font-size: 16px;
  395. color: {color:Accent};
  396. text-align: center;
  397. }
  398.  
  399. .quote {
  400. text-align: center;
  401. }
  402.  
  403. .quote .source {
  404. font-size: 8px;
  405. font-family: cambria;
  406. text-transform: uppercase;
  407. }
  408.  
  409. .quote .source a {
  410. color: {color:Accent};
  411. font-size: 8px;
  412. font-family: cambria;
  413. text-transform: uppercase;
  414. font-style: italic;
  415. }
  416.  
  417. #information {
  418. display: block;
  419. position: relative;
  420. background-color: transparent;
  421. width: 525px;
  422. margin-left: 380px;
  423. font-family: cambria;
  424. font-size: 10px;
  425. color: #FFFFFF;
  426. text-transform: uppercase;
  427. margin-bottom: 10px;
  428. }
  429.  
  430. .date {
  431. padding: 3px;
  432. background-color: {color:Accent};
  433. color: #EEEEEE;
  434. margin-right: 5px;
  435. width: 100px;
  436. text-align: center;
  437. float: left;
  438. font-size: 8px;
  439. }
  440.  
  441. .tags {
  442. color: #202020;
  443. }
  444.  
  445. .tags a {
  446. display: inline-block;
  447. margin: 3px;
  448. font-size: 8px;
  449. color: {color:Accent};
  450. }
  451.  
  452. #content {
  453. margin-bottom: 40px;
  454. width: 550px;
  455. }
  456.  
  457. .notes {
  458. width: auto;
  459. height: auto;
  460. padding: 10px;
  461. background-color: transparent;
  462. border: 3px double {color:Post Border};
  463. position: absolute;
  464. margin-left: 540px;
  465. text-align: center;
  466. }
  467.  
  468. .notesnumber {
  469. font-family: 'Lobster';
  470. font-size: 16px;
  471. color: #202020;
  472. }
  473.  
  474. .reblog a {
  475. display: block;
  476. font-family: cambria;
  477. font-size: 8px;
  478. color: #202020;
  479. text-align: center;
  480. text-transform: uppercase;
  481. }
  482.  
  483. #pagination {
  484. text-align: center;
  485. margin-top: 30px;
  486. display: block;
  487. }
  488.  
  489. #pagination a {
  490. padding: 5px 6px;
  491. background-color: {color:Accent};
  492. font-family: cambria;
  493. font-size: 8px;
  494. color: {color:Sidebar Text};
  495. text-transform: uppercase;
  496. margin: 3px;
  497. }
  498.  
  499. #permanotes {
  500. width: 500px;
  501. padding: 5px;
  502. font-family: cambria;
  503. font-size: 10px;
  504. color: {color:Accent};
  505. display: block;
  506. position: relative;
  507. margin: auto;
  508. }
  509.  
  510. ol#permanotes {
  511. padding: 0px;
  512. list-style:square;
  513. }
  514.  
  515.  
  516. </style>
  517. <body>
  518. <div id="sidebar">
  519. <div class="portrait"><img src="{image:Sidebar}" /></div>
  520. <div class="title">{Title}</div>
  521. <div class="description">
  522. {Description}
  523. </div>
  524. <div class="links">
  525. <a href="/">Home</a>
  526. <a href="/ask">Ask</a>
  527. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  528. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  529. <a href="{text:Link 3 URL}">{text:Link 3}</a>
  530. <a href="{text:Link 4 URL}">{text:Link 4}</a>
  531. <a href="{text:Link 5 URL}">{text:Link 5}</a>
  532. <a href="{text:Link 6 URL}">{text:Link 6}</a>
  533. <a href="http://cremata.tumblr.com">&copy; Theme</a>
  534. </div>
  535.  
  536. <div id="pagination">
  537. {block:Pagination}
  538. {block:PreviousPage}<a href="{PreviousPage}">Previous</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}">Next</a>{/block:NextPage}
  539. {/block:Pagination}
  540. </div>
  541. </div>
  542.  
  543. <div id="content">
  544. {block:Posts}
  545. <div id="posts">
  546.  
  547. <div class="notes">
  548. <div class="notesnumber"><a href="{Permalink}">{block:NoteCount}{NoteCount}{/block:NoteCount}</a></div>
  549. <div class="reblog"><a href="{ReblogURL}">Reblog</a></div>
  550. </div>
  551.  
  552. {block:Text}
  553. <div class="text"> {block:Title}<div class="texttitle">{Title}</div>{/block:Title}
  554. {Body}
  555. </div>
  556. {block:Text}
  557.  
  558. {block:Photo}
  559. <center><a href="{Permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}"/></a></center>
  560. {block:Caption}{Caption}{/block:Caption}
  561. {/block:Photo}
  562.  
  563. {block:Link}
  564. <div class="link"> <a href="{URL}"><h3>{Name}</h3></a></div>
  565. {block:Description}{Description}{/block:Description}
  566. {/block:Link}
  567.  
  568. {block:Photoset}
  569. <center>{Photoset-500}</center>
  570. {block:Caption}{Caption}{/block:Caption}
  571. {/block:Photoset}
  572.  
  573. {block:Chat}
  574. <div class="chat">
  575. {block:Title}<h2>{Title}</h2>{/block:Title}
  576. <ul class="convo">{block:Lines}<li class="line_{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}
  577. {Line}</li>{/block:Lines}</ul>
  578. </div>
  579. {/block:Chat}
  580.  
  581. {block:Audio}
  582. <div class="album">{block:AlbumArt}<img src="{AlbumArtURL}" />{block:AlbumArt}
  583. <div class="info">
  584.  
  585. <div class="track">{block:TrackName}{trackName}{/block:TrackName}</div>
  586. <div class="artist">{block:Artist}{Artist}{/block:Artist}</div>
  587. <div class="playcount">{block:PlayCount}{PlayCount}{/block:PlayCount}</div>
  588.  
  589. </div>
  590. <div class="music">{block:AudioPlayer}{block:IfNotWhitePlayer}{AudioPlayerBlack}{/block:IfNotWhitePlayer}{block:IfWhitePlayer}{AudioPlayerWhite}{/block:IfWhitePlayer}{/block:AudioPlayer}</div>
  591. </div>
  592.  
  593. {/block:Audio}
  594.  
  595. {block:Answer}
  596. <div class="question"><div class="asker"><img src="{AskerPortraitURL-24}" /></div><br />{Asker} asked: {Question}</div>
  597. <div class="answer">{Answer}</div>
  598. {/block:Answer}
  599.  
  600. {block:Quote}<div class="quote"><h3>"{Quote}"</h3> <div class="source">-{Source}</div></div>{/block:Quote}
  601.  
  602.  
  603.  
  604. </div>
  605. <div id="information">
  606.  
  607. <div class="date">
  608. {block:Date}{TimeAgo}, {ShortMonth} {DayOfMonth}{/block:Date}
  609. </div>
  610.  
  611.  
  612. <div class="tags">
  613. {block:HasTags}{block:Tags}
  614. #<a href="{TagURL}">{Tag}</a>
  615. {/block:Tags}{/block:HasTags}
  616. </div>
  617.  
  618.  
  619.  
  620. </div>
  621.  
  622.  
  623. {block:PostNotes}
  624. <div id="permanotes">{PostNotes}</div>
  625. {/block:PostNotes}
  626.  
  627.  
  628. {/block:Posts}
  629.  
  630.  
  631. </div>
  632.  
  633.  
  634.  
  635.  
  636.  
  637. </body>
  638. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!