alithegreat

AGLEERPH | #18 | ENDLESSLY

Jul 19th, 2016
338
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.80 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  6.  
  7.  
  8. <head>
  9.  
  10. <title>{Title}</title>
  11. <link rel="shortcut icon" href="{Favicon}">
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  13. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  14.  
  15. <!----
  16.  
  17. agleerph / #18: endlessly.
  18.  
  19. --->
  20.  
  21. <meta name="image:Sidebar1" content=""/>
  22. <meta name="image:Sidebar2" content=""/>
  23. <meta name="image:Background" content=""/>
  24. <meta name="image:Pattern" content=""/>
  25.  
  26. <meta name="color:Pattern Alt" content=""/>
  27. <meta name="color:Background" content=""/>
  28. <meta name="color:Blockquote" content=""/>
  29. <meta name="color:Border" content=""/>
  30. <meta name="color:Entries" content=""/>
  31. <meta name="color:Header Background" content=""/>
  32. <meta name="color:Header Text" content=""/>
  33. <meta name="color:Link" content=""/>
  34. <meta name="color:Navigation" content=""/>
  35. <meta name="color:Navigation Hover" content=""/>
  36. <meta name="color:Navigation Links" content=""/>
  37. <meta name="color:Pre BG" content=""/>
  38. <meta name="color:Pre Border" content=""/>
  39. <meta name="color:Pre Text" content=""/>
  40. <meta name="color:Question1" content=""/>
  41. <meta name="color:Question2" content=""/>
  42. <meta name="color:Scrollbar1" content=""/>
  43. <meta name="color:Scrollbar2" content=""/>
  44. <meta name="color:Sidebar" content=""/>
  45. <meta name="color:Text" content=""/>
  46. <meta name="color:Title" content=""/>
  47.  
  48. <meta name="text:link one URL" content="/"/>
  49. <meta name="text:link one hover" content="link one hover"/>
  50. <meta name="text:link two URL" content="/"/>
  51. <meta name="text:link two hover" content="link two hover"/>
  52. <meta name="text:link three URL" content="/"/>
  53. <meta name="text:link three hover" content="link three hover"/>
  54. <meta name="text:link four URL" content="/"/>
  55. <meta name="text:link four hover" content="link four hover"/>
  56. <meta name="text:link five URL" content="/"/>
  57. <meta name="text:link five hover" content="link five hover"/>
  58. <meta name="text:link six URL" content="/"/>
  59. <meta name="text:link six hover" content="link six hover"/>
  60.  
  61. <meta name="text:first title" content="this is your first title"/>
  62. <meta name="text:second title" content="this is your second title"/>
  63.  
  64.  
  65. <style type="text/css">
  66.  
  67.  
  68. ::-webkit-scrollbar-thumb {
  69. height:auto;
  70. background-color:{color:Scrollbar2};
  71. }
  72.  
  73. ::-webkit-scrollbar {
  74. height:3px;
  75. width:3px;
  76. background-color:{color:Scrollbar1};
  77. }
  78.  
  79.  
  80. body {
  81. background: {color:Background};
  82. font-family: cambria;
  83. font-size: 10px;
  84. line-height:14px;
  85. color: {color:Text};
  86. background-image:url('{image:Background}');
  87. background-attachment:fixed;
  88.  
  89. }
  90.  
  91. blockquote {
  92. border-left:2px solid {color:blockquote};
  93. padding: 2px 10px;
  94. margin: 10px;
  95. }
  96.  
  97.  
  98. li {
  99. padding-left: 1.2em;
  100. list-style: none;
  101. }
  102.  
  103. li:before {
  104. color: {color:title};
  105. content: "\f105";
  106. font-family: FontAwesome;
  107. font-size:10px;
  108. display: inline-block;
  109. margin-left: -1.2em;
  110. width: 1.2em;
  111. }
  112.  
  113.  
  114. a {
  115. text-decoration: none;
  116. color: {color:Link};
  117. }
  118.  
  119. pre {
  120. font-family:cambria;
  121. font-size:9px;
  122. padding:5px;
  123. text-transform:uppercase;
  124. border-bottom:1px solid {color:Pre Border};
  125. text-align:center;
  126. color:{color:Pre Text};
  127. background-color:{color:Pre BG};
  128. word-wrap:break-word;
  129. }
  130.  
  131. pre a {
  132. color:{color:pre text};
  133. }
  134.  
  135. pre b,strong {
  136. color:{color:pre text};
  137. }
  138.  
  139. pre i,em {
  140. color:{color:pre text};
  141. }
  142.  
  143.  
  144. small, sub {
  145. font-size:10px;
  146. }
  147.  
  148. b, strong {
  149. color:{color:Title};
  150. }
  151.  
  152.  
  153. #sidephoto {
  154. position:fixed;
  155. margin-left:24px;
  156. margin-top:32px;
  157. border:1px solid {color:border};
  158. width:200px;
  159. height:550px;
  160. }
  161.  
  162. #bottomphoto {
  163. position:fixed;
  164. margin-left:229px;
  165. margin-top:282px;
  166. border:1px solid {color:border};
  167. width:270px;
  168. height:150px;
  169. }
  170.  
  171. #backbar {
  172. position:fixed;
  173. margin-left:20px;
  174. margin-top:28px;
  175. width:483px;
  176. height:558px;
  177. border:1px solid {color:border};
  178. background-image:url('{image:Pattern}');
  179. background-color:{color:pattern alt};
  180. background-attachment:fixed;
  181. }
  182.  
  183. #sidebar {
  184. position:fixed;
  185. margin-top:58px;
  186. margin-left:229px;
  187. border:1px solid {color:border};
  188. width:250px;
  189. height:199px;
  190. background-color:{color:Sidebar};
  191. padding:10px;
  192. line-height:12px;
  193. text-align:justify;
  194. }
  195.  
  196. #pagination {
  197. margin-top:15px;
  198. font-size:10px;
  199. font-family:cambria;
  200. letter-spacing:0px;
  201. line-height:12px;
  202. text-align:center;
  203. text-transform:uppercase;
  204. color:{color:text};
  205. }
  206.  
  207. #pagination a {
  208. color:{color:link};
  209. }
  210.  
  211. #navbar {
  212. margin-left:229px;
  213. margin-top:437px;
  214. width:270px;
  215. background-color:{color:sidebar};
  216. border:1px solid {color:border};
  217. height:119px;
  218. position:fixed;
  219. }
  220.  
  221. #navigation {
  222. margin-top:3px;
  223. text-align:center;
  224. }
  225.  
  226. #navigation a {
  227. display:inline-block;
  228. text-align:center;
  229. width:129px;
  230. height:24px;
  231. line-height:24px;
  232. text-transform:lowercase;
  233. font-family:cambria;
  234. font-size:9px;
  235. margin-bottom:3px;
  236. border:1px solid {color:border};
  237. background-color:{color:navigation};
  238. color:{color:navigation links};
  239. -webkit-transition: all 0.5s ease-in-out;
  240. -moz-transition: all 0.5s ease-in-out;
  241. -o-transition: all 0.5s ease-in-out;
  242. }
  243.  
  244. #navigation a:hover {
  245. color:{color:navigation hover};
  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. }
  250.  
  251. #entries {
  252. position:absolute;
  253. width:528px;
  254. margin-left:566px;
  255. padding:0px;
  256. margin-top:28px;
  257. }
  258.  
  259. #entrybg {
  260. padding:3px;
  261. margin-bottom:20px;
  262. background-color:{color:pattern alt};
  263. border:1px solid {color:Border};
  264. background-image:url('{image:Pattern}');
  265. background-attachment:absolute;
  266. }
  267.  
  268. #entry {
  269. background-color:{color:Entries};
  270. margin-bottom:0px;
  271. padding:8px;
  272. border:1px solid {color:Border};
  273. }
  274.  
  275.  
  276. #posttitles {
  277. text-align: center;
  278. font-size: 14px;
  279. line-height:130%;
  280. text-transform:uppercase;
  281. font-family:cambria;
  282. font-weight:300;
  283. padding:0px;
  284. color: {color:title};
  285. }
  286.  
  287.  
  288. #posttitles a {
  289. color:{color:title};
  290. }
  291.  
  292. #ask {
  293. z-index:10;
  294. font-family:cambria;
  295. font-size:16px;
  296. text-align:center;
  297. text-transform:lowercase;
  298. color:{color:question2};
  299. background-color:{color:question1};
  300. margin-right:0px;
  301. padding:10px;
  302. padding-left:10px;
  303. border-bottom:1px solid {color:text};
  304. }
  305.  
  306. #ask a {
  307. color:{color:question2};
  308. }
  309.  
  310.  
  311. #question {
  312. background-color:{color:Question1};
  313. color:{color:Question2};
  314. font-size:10px;
  315. z-index:10;
  316. text-align:center;
  317. padding:10px;
  318. }
  319.  
  320. .playerbuttonbg {
  321. position: absolute;
  322. left: 20px;
  323. top: 20px;
  324. width: 19px;
  325. height: 19px;
  326. background-color: #ffffff;
  327. padding: 10px;
  328. -webkit-border-radius: 40px;
  329. -moz-border-radius: 40px;
  330. border-radius: 40px;
  331. opacity: .4;
  332. filter: alpha(opacity=40);
  333. opacity: 0.4;
  334. -khtml-opacity: 0.4;
  335. transition: opacity .7s ease-in-out;
  336. -moz-transition: opacity .7s ease-in-out;
  337. -webkit-transition: opacity .7s ease-in-out;
  338. }
  339.  
  340. .playerbuttonbg:hover {
  341. opacity: 1;
  342. filter: alpha(opacity=100);
  343. -moz-opacity: 1;
  344. -khtml-opacity: 1;
  345. }
  346.  
  347. .newplayerbutton {
  348. position: relative;
  349. width: 19px;
  350. height: 19px;
  351. overflow: hidden;
  352. }
  353.  
  354. .playerbuttonhug {
  355. position: absolute;
  356. top: -18px;
  357. left: -7px;
  358. }
  359.  
  360. .tumblr_audio_player {
  361. height: 90px;
  362. width: 270px;
  363. -moz-transform: scale(0.60, 0.60);
  364. -webkit-transform: scale(0.60, 0.60);
  365. -o-transform: scale(0.60, 0.60);
  366. -ms-transform: scale(0.60, 0.60);
  367. transform: scale(0.60, 0.60);
  368. -moz-transform-origin: top left;
  369. -webkit-transform-origin: top left;
  370. -o-transform-origin: top left;
  371. -ms-transform-origin: top left;
  372. transform-origin: top left;
  373. }
  374.  
  375. .audioimgwrapper {
  376. position: absolute;
  377. left: 0px;
  378. top: 0px;
  379. -webkit-border-radius: 40px;
  380. -moz-border-radius: 40px;
  381. border-radius: 40px;
  382. overflow: hidden;
  383. width: 79px;
  384. height: 79px;
  385. }
  386.  
  387. .audioimgwrapper img {
  388. width: 100%;
  389. height: auto;
  390. -webkit-border-radius: 40px;
  391. -moz-border-radius: 40px;
  392. border-radius: 40px;
  393. }
  394.  
  395. .trackdetails {
  396. width: auto;
  397. display:inline-block;
  398. margin-left: 90px;
  399. min-height: 85px;
  400. }
  401.  
  402. .audiowrapper {
  403. position: relative;
  404. display:inline-block;
  405. }
  406.  
  407. #permalink {
  408. text-align: right;
  409. border-top: 1px solid {color:Border};
  410. border-bottom:1px solid {color:Border};
  411. background-color:{color:entries};
  412. position: relative;
  413. font-size:9px;
  414. letter-spacing:0px;
  415. text-transform:lowercase;
  416. margin-top: 3px;
  417. margin-left:-3px;
  418. margin-right:-3px;
  419. padding-right:10px;
  420. padding-bottom:5px;
  421. padding-top: 5px;
  422. }
  423.  
  424. #titleheader1 {
  425. background-color:{color:header background};
  426. border:1px solid {color:border};
  427. font-family: arial;
  428. font-size:9px;
  429. text-transform:uppercase;
  430. font-weight:bold;
  431. position:fixed;
  432. width:255px;
  433. height:15px;
  434. line-height:15px;
  435. margin-top:32px;
  436. margin-left:229px;
  437. padding-left:5px;
  438. padding-top:5px;
  439. padding-bottom:5px;
  440. padding-right:10px;
  441. text-align:right;
  442. color:{color:header text};
  443. }
  444.  
  445. #titleheader2 {
  446. background-color:{color:header background};
  447. border:1px solid {color:border};
  448. font-family: arial;
  449. font-size:9px;
  450. text-transform:uppercase;
  451. font-weight:bold;
  452. position:fixed;
  453. width:255px;
  454. height:15px;
  455. line-height:15px;
  456. margin-top:557px;
  457. margin-left:229px;
  458. padding-left:5px;
  459. padding-top:5px;
  460. padding-bottom:5px;
  461. padding-right:10px;
  462. text-align:right;
  463. color:{color:header text};
  464. }
  465.  
  466. #credit {
  467. font-size:10px;
  468. float:center;
  469. position:fixed;
  470. font-family:cambria;
  471. font-weight:bold;
  472. bottom:15px;
  473. right:15px;
  474. padding:10px;
  475. text-transform:uppercase;
  476. border:1px solid {color:border};
  477. background-color:{color:entries};
  478. color:{color:title};
  479. }
  480.  
  481. #credit a {
  482. color:{color:title};
  483. }
  484.  
  485. cred {
  486. padding-left: 1.2em;
  487. list-style: none;
  488. }
  489.  
  490. cred:before {
  491. color: {color:title};
  492. content: "\f105";
  493. font-family: FontAwesome;
  494. font-size:10px;
  495. display: inline-block;
  496. margin-left: -1.2em;
  497. width: 1.2em;
  498. }
  499.  
  500.  
  501. </style>
  502.  
  503. </head>
  504.  
  505. <body>
  506.  
  507. <div id="backbar"></div>
  508.  
  509. <div id="sidephoto"><img src="{image:Sidebar1}"></div>
  510.  
  511. <div id="bottomphoto"><img src="{image:Sidebar2}"></div>
  512.  
  513. <div id="sidebar">
  514.  
  515. <div style="overflow:auto; padding-right:5px; width: 250px; height: 172px; text-align: justify;">{description}</div>
  516.  
  517. <div id="pagination">
  518. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">&laquo;</a>{/block:PreviousPage} {CurrentPage} out of {TotalPages} {block:NextPage}&nbsp;<a href="{NextPage}">&raquo;</a>{/block:NextPage}{/block:Pagination}
  519. </div>
  520. </div>
  521.  
  522. <div id="navbar">
  523. <div id="navigation">
  524. <a href="/" title="index">001.</a>
  525. <a href="/ask" title="inquire">002.</a><br>
  526. <a href="{text:link one url}" title="{text:link one hover}">003.</a>
  527. <a href="{text:link two url}" title="{text:link two hover}">004.</a><br>
  528. <a href="{text:link three url}" title="{text:link three hover}">005.</a>
  529. <a href="{text:link four url}" title="{text:link four hover}">006.</a><br>
  530. <a href="{text:link five url}" title="{text:link five hover}">007.</a>
  531. <a href="{text:link six url}" title="{text:link six hover}">008.</a>
  532. </div>
  533. </div>
  534.  
  535. <div id="titleheader1">{text:first title}</div>
  536. <div id="titleheader2">{text:second title}</div>
  537.  
  538.  
  539. <div id="entries">
  540. {block:Posts}
  541. <div id="entrybg">
  542. <div id="entry">
  543.  
  544.  
  545. {block:Text}
  546. {block:Title}<div id="posttitles">{Title}</div>{/block:Title}
  547. {Body}
  548. {/block:Text}
  549.  
  550. {block:Photo}
  551. {LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
  552. {block:Caption}{Caption}{/block:Caption}
  553. {/block:Photo}
  554.  
  555. {block:Photoset}
  556. {Photoset-500}
  557. {block:Caption}{Caption}{/block:Caption}
  558. {/block:Photoset}
  559.  
  560. {block:Quote}
  561. <div id="posttitles">{Quote}</div>
  562. {block:Source}<br>—{Source}{/block:Source}
  563. {/block:Quote}
  564.  
  565. {block:Link}
  566. <div id="posttitles"><a href="{URL}" {Target}>{Name}</a></div>
  567. {block:Description}{Description}{/block:Description}
  568. {/block:Link}
  569.  
  570. {block:Chat}
  571. {block:Title}<div id="posttitles">{Title}</div>{/block:Title}
  572. {block:Lines}
  573. {block:Label}<b>{Label}</b>{/block:Label} {Line}<br>
  574. {/block:Lines}
  575. {/block:Chat}
  576.  
  577. {block:Audio}{block:AudioPlayer}
  578. <div class="audiowrapper">
  579. {block:AlbumArt}
  580. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  581. {/block:AlbumArt}
  582.  
  583. <div class="playerbuttonbg">
  584. <div class="newplayerbutton">
  585. <div class="playerbuttonhug">
  586.  
  587. {AudioPlayerWhite}
  588.  
  589. </div>
  590. </div>
  591. </div>
  592.  
  593. <div class="trackdetails">
  594.  
  595. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  596. {block:Artist}Artist: {Artist}{/block:Artist}<br/>
  597. {block:Album}Album: {Album}{/block:Album}<br/>
  598. {PlayCountWithLabel}
  599.  
  600. </div>
  601. </div>
  602. {/block:AudioPlayer}
  603.  
  604. {block:Caption}{Caption}{/block:Caption}{/block:Audio}
  605.  
  606. {block:Video}
  607. {Video-500}
  608. {block:Caption}{Caption}{/block:Caption}
  609. {/block:Video}
  610.  
  611. {block:Answer}
  612. <div id="ask">{Asker} sent:</div><div id="question">{Question}</div>
  613. <br>{Answer}
  614. {/block:Answer}
  615.  
  616.  
  617.  
  618.  
  619.  
  620.  
  621. </div> <!-- /div entry ---><div id="permalink">
  622. {block:Date}{TimeAgo}{/block:Date} & <a href="{Permalink}">
  623. {NoteCountWithLabel}</a> & <a href="{ReblogURL}" target="_blank">Reblog</a>
  624.  
  625. {block:RebloggedFrom} & <a href="{ReblogParentURL}"title="{ReblogParentTitle}">via</a> / <a href="{ReblogRootURL}"title="{ReblogRoottitle}">source</a>{/block:RebloggedFrom}
  626.  
  627. <br>{block:HasTags} {block:Tags} #<a href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}
  628. </div> </div>
  629.  
  630. {/block:Posts}{block:PostNotes}{PostNotes}{/block:PostNotes}
  631.  
  632. <div id="credit"> <a href="http://agleerph.tumblr.com/" title="theme 18 by agleerph"><cred>agrph</cred></a></div>
  633.  
  634. </body>
  635.  
  636. </html>
Add Comment
Please, Sign In to add comment