API tools faq
paste
Advertisement
alinarps

THEME 006: "COURTNEY" // ALINARPS

alinarps
Feb 1st, 2015
475
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 18.64 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!--
  4.  
  5. THEME 006: "COURTNEY" by ALINARPS
  6. - Please don't steal or redistribute, I worked very hard on this.
  7. - You can edit to your own liking, but don't repost any edited versions unless you have talked to me first.
  8. - If you have any questions regarding this page, feel free to ask!
  9. - Have fun with it!
  10.  
  11. -->
  12.  
  13. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  14.  
  15.  
  16. <head>
  17.  
  18. <title>{Title}</title>
  19.  
  20. <link rel="shortcut icon" href="{Favicon}" />
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  22. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  23.  
  24. <meta name="color:Background" content="#ffffff"/>
  25. <meta name="color:Text" content="#000000"/>
  26. <meta name="color:Links" content="#aaaaaa"/>
  27. <meta name="color:Hover" content="#ffffff"/>
  28. <meta name="color:Info Links" content="#000000"/>
  29. <meta name="color:accent" content="#aaaaaa"/>
  30. <meta name="color:PostBG" content="#cccccc"/>
  31. <meta name="color:scrollbar" content="#aaaaaa"/>
  32. <meta name="color:scrollbarBG" content="#cccccc"/>
  33. <meta name="color:LinksBG" content="#ffffff"/>
  34. <meta name="color:SidebarBG" content="#cccccc"/>
  35.  
  36. <meta name="image:Background" content=""/>
  37. <meta name="image:Sidebar" content=""/>
  38. <meta name="image:Sidebar 2" content=""/>
  39. <meta name="image:Icon 1" content=""/>
  40. <meta name="image:Icon 2" content=""/>
  41. <meta name="image:Icon 3" content=""/>
  42.  
  43. <meta name="if:Background" content=""/>
  44.  
  45. <meta name="text:Link 1" content="one"/>
  46. <meta name="text:Link 1 URL" content="/"/>
  47. <meta name="text:Link 2" content="two"/>
  48. <meta name="text:Link 2 URL" content="/"/>
  49. <meta name="text:Link 3" content="three"/>
  50. <meta name="text:Link 3 URL" content="/"/>
  51. <meta name="text:Link 4" content="four"/>
  52. <meta name="text:Link 4 URL" content="/"/>
  53. <meta name="text:Link 5" content="five"/>
  54. <meta name="text:Link 5 URL" content="/"/>
  55. <meta name="text:Link 6" content="six"/>
  56. <meta name="text:Link 6 URL" content="/"/>
  57.  
  58. <style type="text/css">
  59.  
  60. /*BASICS*/
  61.  
  62. body {
  63. background-color:{color:Background};
  64. {block:IfBackground}
  65. background-image:url('{image:Background}');
  66. background-attachment:fixed;
  67. background-size:cover;
  68. {/block:IfBackground}
  69. font-family:'arial';
  70. font-size:12px;
  71. text-align:justify;
  72. color:{color:text};
  73. }
  74.  
  75. a {
  76. text-decoration:none;
  77. color:{color:Links};
  78. -webkit-transition: all 0.5s ease-out;
  79. -moz-transition: all 0.5s ease-out;
  80. transition: all 0.5s ease-out;
  81. }
  82.  
  83. a:hover {
  84. text-decoration:none;
  85. color:{color:Hover};
  86. -webkit-transition: all 0.5s ease-out;
  87. -moz-transition: all 0.5s ease-out;
  88. transition: all 0.5s ease-out;
  89. }
  90.  
  91. blockquote {
  92. background-color:{color:accent};
  93. margin-left:40px;
  94. color:{color:text};
  95. border-left:1px solid {color:text};
  96. padding:10px;
  97. }
  98.  
  99. pre {
  100. padding:5px;
  101. width:98%;
  102. white-space:normal;
  103. background-color:{color:text};
  104. color:{color:PostBG};
  105. border-bottom:2px solid {color:Accent};
  106. font-family:arial;
  107. text-align:center;
  108. }
  109.  
  110. h1{
  111. background-color:{color:background};
  112. color:{color:text};
  113. padding:5px;
  114. border-bottom:5px solid {color:accent};
  115. font-size:12px;
  116. text-align:center;
  117. text-transform:uppercase;
  118. white-space:normal;
  119. }
  120.  
  121.  
  122. /*POSTS*/
  123.  
  124. .entries {
  125. margin-top:15px;
  126. margin-left:420px;
  127. position:absolute;
  128. overflow:auto;
  129. height:565px;
  130. width:560px;
  131. }
  132.  
  133. .post{
  134. padding:10px;
  135. background-color:{color:postbg};
  136. margin-top:15px;
  137. margin-bottom:15px;
  138. width:500px;
  139. }
  140.  
  141. ::-webkit-scrollbar-thumb {
  142. height:9px;
  143. background-color:{color:scrollbar};
  144. border:1px solid {color:scrollbar};
  145. }
  146.  
  147. ::-webkit-scrollbar {
  148. margin-right:5px;
  149. width:7px;
  150. height:5px;
  151. background-color:{color:scrollbarbg};
  152. }
  153.  
  154. /*SIDEBAR & PAGINATION*/
  155.  
  156. .sbg{
  157. width:925px;
  158. opacity:0.5;
  159. height:590px;
  160. background-color:{color:SidebarBG};
  161. position:fixed;
  162. margin-top:10px;
  163. margin-left:75px;
  164. z-index:-99999999999999;
  165. }
  166.  
  167. .sidebar{
  168. background-color:{color:postbg};
  169. width:300px;
  170. height:400px;
  171. border:5px solid {color:accent};
  172. position:fixed;
  173. margin-top:45px;
  174. margin-left:95px;
  175. }
  176.  
  177. .desc{
  178. margin-left:95px;
  179. margin-top:455px;
  180. width:290px;
  181. height:81px;
  182. overflow:auto;
  183. padding:10px;
  184. background-color:{color:text};
  185. color:{color:background};
  186. position:fixed;
  187. }
  188.  
  189. .pagination{
  190. background-color:{color:postbg};
  191. padding:5px;
  192. width:300px;
  193. position:fixed;
  194. margin-top:556px;
  195. margin-left:95px;
  196. color:{color:background};
  197. text-align:center;
  198. }
  199.  
  200. .pagination a{
  201. color:{color:text};
  202. padding:2px;
  203. background-color:{color:background};
  204. font-weight:600;
  205. text-decoration:none;
  206. -moz-transition-duration:0.7s;
  207. -webkit-transition-duration:0.7s;
  208. -o-transition-duration:0.7s;
  209. transition: all 0.5s ease-out;
  210. }
  211.  
  212. .pagination a:hover{
  213. color:{color:hover};
  214. background-color:{color:text};
  215. text-decoration:none;
  216. -moz-transition-duration:0.7s;
  217. -webkit-transition-duration:0.7s;
  218. -o-transition-duration:0.7s;
  219. transition: all 0.5s ease-out;
  220. }
  221.  
  222. /*SIDEBAR HOVER*/
  223.  
  224. .shover{
  225. background-color:{color:postbg};
  226. border:5px solid {color:accent};
  227. margin-top:45px;
  228. margin-left:95px;
  229. width:280px;
  230. height:380px;
  231. padding:10px;
  232. position:fixed;
  233. z-index:-999;
  234. }
  235.  
  236. .links{
  237. text-align:left;
  238. margin-left:7px;
  239. }
  240.  
  241. .links a{
  242. margin-bottom:5px;
  243. margin-right:2px;
  244. padding:5px;
  245. width:120px;
  246. background-color:{color:LinksBG};
  247. color:{color:links};
  248. display:inline-block;
  249. text-align:center;
  250. -moz-transition-duration:0.7s;
  251. -webkit-transition-duration:0.7s;
  252. -o-transition-duration:0.7s;
  253. transition: all 0.5s ease-out;
  254. }
  255.  
  256. .links a:hover{
  257. background-color:{color:links};
  258. color:{color:postbg};
  259. -moz-transition-duration:0.7s;
  260. -webkit-transition-duration:0.7s;
  261. -o-transition-duration:0.7s;
  262. transition: all 0.5s ease-out;
  263. }
  264.  
  265. /*NAVIGATION (BUTTON)*/
  266.  
  267. .nav{
  268. margin-top:30px;
  269. margin-left:95px;
  270. width:304px;
  271. padding:3px;
  272. text-transform:uppercase;
  273. position:fixed;
  274. text-align:center;
  275. background-color:{color:accent};
  276. color:{color:text};
  277. -moz-transition-duration:0.7s;
  278. -webkit-transition-duration:0.7s;
  279. -o-transition-duration:0.7s;
  280. transition: all 0.5s ease-out;
  281. }
  282.  
  283. .nav a{
  284. color:{color:text};
  285. -moz-transition-duration:0.7s;
  286. -webkit-transition-duration:0.7s;
  287. -o-transition-duration:0.7s;
  288. transition: all 0.5s ease-out;
  289. }
  290.  
  291. .nav a:hover{
  292. color:{color:background};
  293. -moz-transition-duration:0.7s;
  294. -webkit-transition-duration:0.7s;
  295. -o-transition-duration:0.7s;
  296. transition: all 0.5s ease-out;
  297. }
  298.  
  299. /*POST INFO & TAGS */
  300.  
  301. .pinfo{
  302. padding:5px;
  303. background-color:{color:accent};
  304. color:{color:text};
  305. margin-top:5px;
  306. border-top:5px solid {color:background};
  307. border-bottom:5px solid {color:background};
  308. text-align:center;
  309. z-index:-999;
  310. margin-bottom:5px;
  311. -moz-transition-duration:0.7s;
  312. -webkit-transition-duration:0.7s;
  313. -o-transition-duration:0.7s;
  314. transition: all 0.5s ease-out;
  315. }
  316.  
  317. .pinfo a{
  318. color:{color:postbg};
  319. text-decoration:none;
  320. -moz-transition-duration:0.7s;
  321. -webkit-transition-duration:0.7s;
  322. -o-transition-duration:0.7s;
  323. transition: all 0.5s ease-out;
  324. }
  325.  
  326. .pinfo a:hover{
  327. color:{color:Hover};
  328. text-decoration:none;
  329. -moz-transition-duration:0.7s;
  330. -webkit-transition-duration:0.7s;
  331. -o-transition-duration:0.7s;
  332. transition: all 0.5s ease-out;
  333. }
  334.  
  335. .tags{
  336. padding:5px;
  337. background-color:{color:background};
  338. color:{color:text};
  339. text-align:center;
  340. opacity:0;
  341. margin-top:-35px;
  342. z-index:9999999999;
  343. line-height:1.4;
  344. -moz-transition-duration:0.7s;
  345. -webkit-transition-duration:0.7s;
  346. -o-transition-duration:0.7s;
  347. transition: all 0.5s ease-out;
  348. }
  349.  
  350. .tags a{
  351. display:inline-block;
  352. text-decoration:none;
  353. margin-right:5px;
  354. background-color:{color:Info links};
  355. padding:3px;
  356. -moz-transition-duration:1.7s;
  357. -webkit-transition-duration:1.7s;
  358. -o-transition-duration:1.7s;
  359. transition: all 1.5s ease-out;
  360. }
  361.  
  362. .post:hover .tags{
  363. opacity:1;
  364. margin-top:-10px;
  365. -moz-transition-duration:0.7s;
  366. -webkit-transition-duration:0.7s;
  367. -o-transition-duration:0.7s;
  368. transition: all 0.5s ease-out;
  369. }
  370.  
  371. /*AUDIO POSTS*/
  372.  
  373. .playbutton {
  374. width: 10px;
  375. height: 20px;
  376. overflow: hidden;
  377. position: relative;
  378. z-index: 1000;
  379. margin: 15px 24px 13px 16px;
  380. -webkit-transition: all 0.5s ease-out;
  381. -moz-transition: all 0.5s ease-out;
  382. transition: all 0.5s ease-out;
  383. }
  384.  
  385. .playbox {
  386. background-color: #000;
  387. position: absolute;
  388. z-index: 1000;
  389. margin-top: 22px;
  390. margin-left: 20px;
  391. opacity:0.3;
  392. -webkit-transition: all 0.5s ease-out;
  393. -moz-transition: all 0.5s ease-out;
  394. transition: all 0.5s ease-out;
  395. }
  396.  
  397. .playbox:hover{
  398. opacity:1;
  399. -webkit-transition: all 0.5s ease-out;
  400. -moz-transition: all 0.5s ease-out;
  401. transition: all 0.5s ease-out;
  402. }
  403.  
  404. /*QUESTION POSTS*/
  405.  
  406. .question{
  407. background-color:{color:text};
  408. color:{color:background};
  409. padding:10px;
  410. }
  411. .asker{
  412. background-color:{color:background};
  413. color:{color:text};
  414. padding:5px;
  415. text-align:right;
  416. }
  417.  
  418. /*CREDIT -- DON'T REMOVE PLEASE OR I'LL KILL YOU THANKS*/
  419.  
  420. #credit{
  421. position:fixed;
  422. right:10px;
  423. bottom:10px;
  424. padding:5px;
  425. background-color:{color:accent};
  426. z-index:9999999999;
  427. -webkit-transition: all 0.5s ease-out;
  428. -moz-transition: all 0.5s ease-out;
  429. transition: all 0.5s ease-out;
  430. }
  431.  
  432. #credit:hover{
  433. background-color:{color:postbg};
  434. z-index:9999999999;
  435. -webkit-transition: all 0.5s ease-out;
  436. -moz-transition: all 0.5s ease-out;
  437. transition: all 0.5s ease-out;
  438. }
  439.  
  440. </style>
  441.  
  442. <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  443.  
  444. </head>
  445.  
  446. <body>
  447.  
  448. <div class="sbg"></div>
  449.  
  450. <div class="nav"><b><a href="#">CLICK FOR NAVIGATION</a></b></div>
  451.  
  452. <div class="sidebar"><img src="{image:Sidebar}"/></div>
  453.  
  454. <div class="shover">
  455.  
  456. <img src="{image:Sidebar 2}" style="width:280px;height:150px;margin-bottom:0px;"/>
  457.  
  458. <h1>{Title}</h1>
  459.  
  460. <div class="links">
  461. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  462. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  463. <a href="{text:Link 3 URL}">{text:Link 3}</a>
  464. <a href="{text:Link 4 URL}">{text:Link 4}</a>
  465. <a href="{text:Link 5 URL}">{text:Link 5}</a>
  466. <a href="{text:Link 6 URL}">{text:Link 6}</a>
  467. </div>
  468.  
  469. <img src="{image:Icon 1}" style="width:80px;height:80px;border:5px solid {color:text};margin-right:2px;margin-top:7px;"/>
  470.  
  471. <img src="{image:Icon 2}" style="width:80px;height:80px;border:5px solid {color:text};margin-right:2px;margin-top:7px;"/>
  472.  
  473. <img src="{image:Icon 3}" style="width:80px;height:80px;border:5px solid {color:text};margin-top:7px;"/>
  474.  
  475. </div>
  476.  
  477. <div class="desc">{Description}</div>
  478.  
  479. <div class="pagination">
  480. &nbsp;
  481. {block:Pagination}
  482. {block:PreviousPage}
  483. <a href="{PreviousPage}">PREV</a>
  484. {/block:PreviousPage}
  485. &nbsp;&bull; &nbsp;
  486. {block:NextPage}
  487. <a href="{NextPage}">NEXT</a>
  488. {/block:NextPage}
  489. {/block:Pagination}
  490. &nbsp;
  491. </div>
  492. </div>
  493.  
  494.  
  495. <div class="entries">
  496.  
  497. {block:Posts}
  498. <div class="post">
  499.  
  500. {block:Text}
  501. {block:Title}<pre>{Title}</pre>{/block:Title}
  502. {Body}
  503. {/block:Text}
  504.  
  505. {block:Photo}
  506. {LinkOpenTag}<img src="{PhotoURL-500}" width="500">{LinkCloseTag}
  507. {block:Caption}{Caption}{/block:Caption}
  508. {/block:Photo}
  509.  
  510. {block:Photoset}
  511. {Photoset-500}
  512. {block:Caption}{Caption}{/block:Caption}
  513. {/block:Photoset}
  514.  
  515. {block:Link}
  516. <pre><a href="{URL}" {Target}>{Name}</a></pre>
  517. {block:Description}{Description}{/block:Description}
  518. {/block:Link}
  519.  
  520. {block:Quote}
  521. <pre>"{Quote}"</pre>
  522. {block:Source}<div align="right"> —{Source}</div>{/block:Source}
  523. {/block:Quote}
  524.  
  525. {block:Chat}
  526. {block:Title}<pre>{Title}</pre>{/block:Title}
  527. {block:Lines}
  528. <div style="background-color:{color:background};padding:5px;margin-top:3px;margin-bottom:3px;">
  529. {block:Label}<b>{Label}</b>{/block:Label}
  530. {Line}<br>
  531. </div>
  532. {/block:Lines}
  533. {/block:Chat}
  534.  
  535. {block:Audio}
  536. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
  537. {block:AlbumArt}
  538. <img src="{AlbumArtURL}" style="float:left;border:10px solid {color:text};width:70px;margin-right:10px;">
  539. {/block:AlbumArt}
  540. <div style="background-color:{color:background};height:70px;padding:10px;">
  541. {block:TrackName}<b>{TrackName}</b>{/block:TrackName}
  542. {block:Artist}<em>by {Artist}</em>{/block:Artist}
  543. <br /><br />
  544. {block:Album}{Album}{/block:Album}
  545. <br /><br />
  546. {block:PlayCount}Played {FormattedPlayCount} times{/block:PlayCount}
  547. </div>
  548. {block:Caption}{Caption}{/block:Caption}
  549. {/block:Audio}
  550.  
  551. {block:Video}
  552. {Video-500}
  553. {block:Caption}{Caption}{/block:Caption}
  554. {/block:Video}
  555.  
  556. {block:Answer}
  557. <div class="question">❝{Question}❞</div>
  558. <div class="asker">inquired {Asker}</div>
  559. {Answer}
  560. {/block:Answer}
  561.  
  562. <div class="pinfo">
  563. posted <a href="{Permalink}">{TimeAgo}</a> with {NoteCountWithLabel} {block:RebloggedFrom} via <a href="{ReblogParentURL}">{ReblogParentName}</a> from <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  564.  
  565.  
  566. {block:PostNotes}<br />{PostNotes}{/block:PostNotes}
  567. </div>
  568.  
  569. {block:HasTags}<div class="tags"> {block:Tags} <a href="{TagURL}">#{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  570.  
  571. </div>
  572.  
  573. {/block:Posts}
  574.  
  575.  
  576. </div>
  577.  
  578. <!-----DO NOT TOUCH THIS!!!!---->
  579. <div id="credit"><a href="http://alinarps.tumblr.com/">ALINARPS</a></div>
  580.  
  581. <script>
  582. $( ".nav" ).click(function() {
  583. $( ".sidebar" ).fadeToggle( "slow" );
  584. });
  585. </script>
  586.  
  587. </body>
  588.  
  589. </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!