jamidanielle_

OLEANDER 2.0

Jun 2nd, 2016
352
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.83 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <html>
  4. <head>
  5.  
  6. <title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8.  
  9.  
  10. <!--------------------------------->
  11. <!----------[OLEANDER 2.0]--------->
  12. <!-----THEME BY FOLKLORE THEMES---->
  13. <!------------JUNE 2016------------>
  14. <!--DO NOT STEAL OR REMOVE CREDIT-->
  15. <!--------------------------------->
  16. <!--------------------------------->
  17.  
  18. <meta name="image:Sidebar Image" content=""/>
  19. <meta name="image:Background" content=""/>
  20. <meta name="color:Background" content=""/>
  21. <meta name="color:Sidebar" content=""/>
  22. <meta name="color:Container" content=""/>
  23. <meta name="color:Border" content=""/>
  24. <meta name="color:Text" content=""/>
  25. <meta name="color:Links" content=""/>
  26. <meta name="color:Link Hover" content=""/>
  27. <meta name="color:Border" content=""/>
  28. <meta name="color:Scrollbar" content=""/>
  29. <meta name="text:Link 1 URL" content=""/>
  30. <meta name="text:Link 1 Title" content=""/>
  31. <meta name="text:Link 2 URL" content=""/>
  32. <meta name="text:Link 2 Title" content=""/>
  33. <meta name="text:Link 3 URL" content=""/>
  34. <meta name="text:Link 3 Title" content=""/>
  35. <meta name="if:Infinite Scroll" content=""/>
  36.  
  37. <meta name="if:Background Cover" content="0"/>
  38.  
  39.  
  40. <link href='https://fonts.googleapis.com/css?family=Karla' rel='stylesheet' type='text/css'>
  41.  
  42.  
  43.  
  44. <style type="text/css">
  45.  
  46. ::-webkit-scrollbar-thumb:vertical {
  47.  
  48. background-color:{color:Scrollbar};
  49. /*scrollbar's slider color*/
  50. height:100px;
  51. padding:2px;
  52. -moz-border-radius: 0px; /*these make bar rounded*/
  53. border-radius: 0px;
  54. }
  55.  
  56. ::-webkit-scrollbar-thumb:horizontal {
  57. background-color:#fff; /*scrollbar's slider color*/
  58. height:100px !important;
  59. }
  60.  
  61. ::-webkit-scrollbar {
  62. height:10px;
  63. padding:2px;
  64. width:4px; /*width of slider*/
  65. background-color:#fff;
  66. /*scrollbar's main color*/
  67. }
  68.  
  69.  
  70. body{
  71. background: {color:Background} url('{image:Background}') top left fixed; {block:ifbackgroundcover} background-repeat:no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; {/block:ifbackgroundcover} {block:ifnotbackgroundcover} background-repeat:repeat;{block:ifnotbackgroundcover}
  72. font-family:'Karla',arial,sans-serif;
  73. width:100%;
  74. }
  75.  
  76.  
  77. a {
  78. text-decoration:none;
  79. color:{color:Links};
  80. -moz-transition-duration: 0.5s;
  81. -o-transition-duration: 0.5s;
  82. -webkit-transition-duration: 0.5s;
  83. transition-duration: 0.5s;
  84. }
  85.  
  86. a:hover{
  87.  
  88. -moz-transition-duration: 0.5s;
  89. -o-transition-duration: 0.5s;
  90. -webkit-transition-duration: 0.5s;
  91. transition-duration: 0.5s;
  92. color:{color:Link Hover};
  93. }
  94.  
  95.  
  96.  
  97.  
  98. #sb{
  99. height:auto;
  100. width:250px;
  101. border:1px solid {color:Border};
  102. float:left;
  103. margin-top:100px;
  104. position:fixed;
  105. margin-left:150px;
  106. background-color:{color:Container};
  107. border:1px solid {color:Border};
  108. }
  109.  
  110.  
  111. #sb img{
  112. width:180px;
  113. height:auto;
  114. margin:20px 35px 10px 35px;
  115. position:relative;
  116.  
  117.  
  118.  
  119.  
  120.  
  121. }
  122.  
  123.  
  124. #title{
  125. text-transform:uppercase;
  126. text-align:center;
  127. margin-top:20px;
  128. font-size:18px;
  129. }
  130.  
  131.  
  132.  
  133.  
  134. #desc{
  135. font-size:13px;
  136. text-align:justify;
  137. margin-top:10px;
  138. padding:5px 30px 20px 30px;
  139. }
  140.  
  141.  
  142.  
  143.  
  144. .navlinks{
  145. font-size:14px;
  146. padding:10px 35px;
  147. text-align:center;
  148. text-transform:uppercase;
  149. margin-top:-20px;
  150. margin-bottom:5px;
  151. }
  152.  
  153.  
  154.  
  155. .pagination{
  156. text-align:center;
  157. margin-top:-8px;
  158. margin-bottom:8px;
  159. }
  160.  
  161.  
  162. #wrapper{
  163. border:1px solid {color:Border};
  164. width:500px;
  165. height:500px;
  166. position:fixed;
  167. margin-left:500px;
  168. overflow-y:auto;
  169. overflow-x:hidden;
  170. margin-top:40px;
  171. background-color:{color:Container};
  172.  
  173.  
  174.  
  175. }
  176.  
  177. .posts {
  178.  
  179.  
  180. width:350px;
  181. margin:40px auto;
  182. position:relative;
  183. padding:7px;
  184.  
  185.  
  186.  
  187.  
  188. }
  189.  
  190.  
  191.  
  192. .posts img {
  193.  
  194. margin:0 auto;
  195. width:100%;
  196. }
  197.  
  198.  
  199. .posts .title {
  200. color:{color:Links};
  201. font-size:14px;
  202.  
  203. padding:3px 2px 2px 2px;
  204.  
  205.  
  206. }
  207.  
  208. .posts .text {
  209. font-size:11px;
  210. font-family:arial;
  211.  
  212. }
  213.  
  214. .posts h2 {
  215. font-size:14px;
  216. font-weight:normal;
  217. margin:0px;
  218.  
  219. }
  220.  
  221. .posts h2 a {
  222. font-size:12px;
  223. }
  224.  
  225. blockquote {
  226. border-left: solid 1px {color:Text};
  227. margin: 0;
  228. padding-left: 10px;
  229. }
  230.  
  231.  
  232. .posts .photocap {
  233.  
  234. font-size:11px;
  235. padding-bottom:2px;
  236.  
  237.  
  238. }
  239.  
  240.  
  241.  
  242.  
  243.  
  244. .posts .qut {
  245. font-size:14px;
  246. font-style:italic;
  247. text-align:center;
  248.  
  249. }
  250.  
  251. .posts .src {
  252. text-align:right;
  253. margin-top:-7px;
  254. font-size:11px;
  255.  
  256.  
  257. }
  258.  
  259. .posts .qtmrk1 {
  260. font-size:30px;
  261. text-align:center;
  262. font-family:serif;
  263. margin-bottom:4px;
  264. }
  265.  
  266. .posts .qtmrk2 {
  267. font-size:30px;
  268. text-align:center;
  269. font-family:serif;
  270. margin-top:8px;
  271. }
  272.  
  273.  
  274. .posts .photoset {
  275. width:100%
  276. padding-right:2px;
  277.  
  278. margin:0 auto;
  279.  
  280.  
  281. }
  282.  
  283. .posts .label{
  284. font-family:arial;
  285. display:inline;
  286. font-size:11px;
  287. padding-right:2px;
  288.  
  289. }
  290.  
  291. .posts .lines{
  292. font-family:arial;
  293. display:inline;
  294. font-size:11px;
  295.  
  296. }
  297.  
  298. .question {
  299. font-size:12px;
  300. color:{color:Text};
  301. font-family:arial;
  302. text-align:left;
  303.  
  304. }
  305.  
  306. .asker {
  307. font-size:11px;
  308. color:{color:Links};
  309. font-family:arial;
  310. text-align:left;
  311. padding-top:4px;
  312. padding-bottom:10px;
  313. display:inline;
  314. }
  315.  
  316. .answer {
  317. font-size:12px;
  318. color:{color:Text};
  319. font-family:arial;
  320. text-align:center;
  321.  
  322.  
  323. }
  324.  
  325.  
  326. td img{
  327. max-height:40px;
  328. max-width:40px;
  329. }
  330.  
  331. img {
  332. max-width:100%;
  333. }
  334.  
  335.  
  336.  
  337.  
  338.  
  339. .playerbuttonbg {
  340. position: absolute;
  341. left: 20px;
  342. top: 20px;
  343. width: 19px;
  344. height: 19px;
  345. background-color: #ffffff;
  346. padding: 10px;
  347. -webkit-border-radius: 40px;
  348. -moz-border-radius: 40px;
  349. border-radius: 40px;
  350. opacity: .4;
  351. filter: alpha(opacity=40);
  352. -moz-opacity: 0.4;
  353. -khtml-opacity: 0.4;
  354. transition: opacity .7s ease-in-out;
  355. -moz-transition: opacity .7s ease-in-out;
  356. -webkit-transition: opacity .7s ease-in-out;
  357. }
  358.  
  359. .playerbuttonbg:hover {
  360. opacity: 1;
  361. filter: alpha(opacity=100);
  362. -moz-opacity: 1;
  363. -khtml-opacity: 1;
  364. }
  365.  
  366. .newplayerbutton {
  367. position: relative;
  368. width: 19px;
  369. height: 19px;
  370. overflow: hidden;
  371. }
  372.  
  373. .playerbuttonhug {
  374. position: absolute;
  375. top: -18px;
  376. left: -7px;
  377. }
  378.  
  379. .tumblr_audio_player {
  380. height: 90px;
  381. width: 270px;
  382. -moz-transform: scale(0.60, 0.60);
  383. -webkit-transform: scale(0.60, 0.60);
  384. -o-transform: scale(0.60, 0.60);
  385. -ms-transform: scale(0.60, 0.60);
  386. transform: scale(0.60, 0.60);
  387. -moz-transform-origin: top left;
  388. -webkit-transform-origin: top left;
  389. -o-transform-origin: top left;
  390. -ms-transform-origin: top left;
  391. transform-origin: top left;
  392. }
  393.  
  394. .audioimgwrapper {
  395. position: absolute;
  396. left: 0px;
  397. top: 0px;
  398. -webkit-border-radius: 40px;
  399. -moz-border-radius: 40px;
  400. border-radius: 40px;
  401. overflow: hidden;
  402. width: 79px;
  403. height: 79px;
  404. }
  405.  
  406. .audioimgwrapper img {
  407. width: 100%;
  408. height: auto;
  409. -webkit-border-radius: 40px;
  410. -moz-border-radius: 40px;
  411. border-radius: 40px;
  412. }
  413.  
  414. .trackdetails {
  415. width: auto;
  416.  
  417. display:inline-block;
  418. margin-left: 90px;
  419. min-height: 85px;
  420. font-size:12px;
  421. font-family:sans-serif;
  422. color:{color:Text};
  423. }
  424.  
  425. .audiowrapper {
  426. position: relative;
  427. display:inline-block;
  428. }
  429.  
  430.  
  431. .info{
  432. font-size:11px;
  433.  
  434.  
  435. padding:7px 0 15px 0;
  436. text-align:right;
  437. text-transform:uppercase;
  438.  
  439.  
  440.  
  441. }
  442.  
  443.  
  444.  
  445.  
  446. .posts .tags{
  447. opacity:0;
  448. font-size:10px;
  449. transition:0.5s ease;
  450. -o-transition:0.5s ease;
  451. -moz-transition:0.5s ease;
  452. -webkit-transition:0.5s ease;
  453.  
  454.  
  455.  
  456. }
  457.  
  458. .posts:hover .tags{
  459. opacity:1;
  460.  
  461. transition:0.5s ease;
  462. -o-transition:0.5s ease;
  463. -moz-transition:0.5s ease;
  464. -webkit-transition:0.5s ease;
  465.  
  466. }
  467.  
  468.  
  469.  
  470.  
  471. #notecontainer {
  472. margin: 20px auto;
  473. width: 100%;
  474. font-size: 11px;
  475. }
  476.  
  477. #notecontainer ol.notes {
  478. list-style-type: none;
  479. margin: 0;
  480. padding: 0;
  481. }
  482.  
  483. #notecontainer img.avatar {
  484. margin-right: 10px;
  485. width: 16px;
  486. height: 16px;
  487. }
  488.  
  489. #cred{
  490. position:fixed;
  491. right:5px;
  492. bottom:5px;
  493.  
  494. font-size:12px;
  495.  
  496. }
  497.  
  498.  
  499.  
  500. </style>
  501. <script src="http://code.jquery.com/jquery-2.0.0.js"></script>
  502. {block:IfInfiniteScroll}
  503.  
  504. <script type="text/javascript" src="http://static.tumblr.com/zsyodlv/4jVo6i2h3/esz.js"></script>
  505.  
  506. {/block:IfInfiniteScroll}
  507.  
  508. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  509.  
  510.  
  511. </head>
  512.  
  513.  
  514. <body>
  515.  
  516. <div id="sb">
  517.  
  518. <div id="title"><a href="/">{Title}</a></div>
  519.  
  520. <img src="{image:Sidebar Image}"/>
  521.  
  522. <div id="desc">{Description}</div>
  523.  
  524.  
  525.  
  526. <div class="navlinks">
  527. <a href="/">home</a>&nbsp;&nbsp;
  528. <a href="/ask">inbox</a><br>
  529. <a href="{text:Link 1 URL}">{text:Link 1 Title}</a>&nbsp;&nbsp;
  530. <a href="{text:Link 2 URL}">{text:Link 2 Title}</a>&nbsp;&nbsp;
  531. <a href="{text:Link 3 URL}">{text:Link 3 Title}</a>
  532.  
  533.  
  534. </div>
  535. {block:IfNotInfiniteScroll}
  536.  
  537. <div class="pagination">
  538. {block:PreviousPage}<a href="{PreviousPage}"> ←</a>{/block:PreviousPage}
  539. {block:NextPage}<a href="{NextPage}"> →</a>{/block:NextPage}
  540. </div>
  541. {/block:IfNotInfiniteScroll}
  542. </div>
  543.  
  544.  
  545.  
  546.  
  547. <div id="wrapper">
  548.  
  549.  
  550.  
  551.  
  552.  
  553.  
  554.  
  555. {block:Posts}
  556.  
  557.  
  558.  
  559.  
  560.  
  561.  
  562.  
  563. <div class="posts">
  564.  
  565. {block:Photo}
  566. {LinkOpenTag}<img src="{PhotoURL-500}" />{LinkCloseTag}
  567. {block:PermalinkPage}
  568. {block:Caption}<div class="photocap">{Caption}</div>{/block:Caption}
  569. {/block:PermalinkPage}
  570. {/block:Photo}
  571.  
  572. {block:Photoset}<div class="photoset">
  573. {Photoset}<!-- edited~ -->
  574. {block:PermalinkPage}
  575. {block:Caption}<div class="photocap">{Caption}</div>{/block:Caption}
  576. {/block:PermalinkPage}
  577. </div>
  578. {/block:Photoset}
  579.  
  580. {block:Video}
  581. <div class="video">{Video-500}</div>
  582. {block:PermalinkPage}
  583. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  584. {/block:PermalinkPage}
  585. {/block:Video}
  586.  
  587. {block:Audio}
  588. {block:AudioPlayer}
  589. <div class="audiowrapper">
  590. {block:AlbumArt}
  591. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  592. {/block:AlbumArt}
  593.  
  594. <div class="playerbuttonbg">
  595. <div class="newplayerbutton">
  596. <div class="playerbuttonhug">
  597.  
  598. {AudioPlayerWhite}
  599.  
  600. </div>
  601. </div>
  602. </div>
  603.  
  604. <div class="trackdetails">
  605.  
  606. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  607. {block:Artist}Artist: {Artist}{/block:Artist}<br/>
  608. {block:Album}Album: {Album}{/block:Album}<br/>
  609. {PlayCountWithLabel}
  610.  
  611. </div>
  612. </div>
  613. {/block:AudioPlayer}
  614.  
  615. {block:PermalinkPage} {block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  616. {/block:Audio}
  617.  
  618. {block:Quote}
  619. <div class="qut"><div class="qtmrk1">“</div>{Quote}<div class="qtmrk2">”</div></div>
  620. {block:Source}<div class="src"><br>&mdash; {Source}</div>{/block:Source}
  621. {/block:Quote}
  622.  
  623. {block:Text}
  624. {block:Title}<div class="title">{Title}</div>{/block:Title}
  625. <div class="text">{Body}</div>
  626. {/block:Text}
  627.  
  628. {block:Answer}
  629. <table style="border-bottom:1px solid {color:Border};padding-bottom:5px;margin-bottom:5px;">
  630. <tr>
  631. <td style="vertical-align:top;padding-right:10px;"><img src="{AskerPortraitURL-40}"></td>
  632. <td style="vertical-align:top;"><div class="asker">{Asker} </div><span style="font-size:11px;">asked: </span> <div class="question"><em>{Question}</em></div></td>
  633. </tr>
  634. </table>
  635. <div class="answer">{Answer}</div>
  636. {/block:Answer}
  637.  
  638.  
  639.  
  640. {block:Chat}
  641. {block:Title}<h1>{Title}</h1>{/block:Title}
  642. {block:Lines}{block:Label}<div class="label"><b>{Label}</b></div>{/block:Label}<div class="lines">{Line}</div><br>{/block:Lines}
  643. {/block:Chat}
  644.  
  645. {block:Link}
  646. <div class="title"><a href="{URL}">{Name}</a></div>
  647. {block:Description}
  648. <div class="text">{Description}</div>
  649. {/block:Description}
  650. {/block:Link}
  651.  
  652.  
  653.  
  654.  
  655.  
  656. {block:PostNotes}
  657. <div id="notecontainer">{PostNotes}</div>
  658. {/block:PostNotes}
  659.  
  660. <div class="info">
  661. <a href="{Permalink}">{block:Date}{ShortMonth} {DayOfMonthWithZero}, {Year}{/block:Date}</a>&nbsp; <span style="color:{color:Links};">/ </span> &nbsp;<a href="{Permalink}" >{block:NoteCount}<span style="color:{color:Links};font-size:11px;">♡ </span>{NoteCount}&nbsp;{/block:NoteCount}</a>
  662.  
  663.  
  664. {block:HasTags}<div class="tags">
  665. {block:Tags}
  666. <a href="{TagURL}"> #{Tag}&nbsp;</a>
  667. {/block:Tags}
  668. </div>
  669. {/block:HasTags}
  670.  
  671.  
  672. </div>
  673. </div>
  674.  
  675.  
  676.  
  677.  
  678. {/block:Posts}
  679.  
  680.  
  681.  
  682. {block:PermalinkPage}
  683. {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  684. &nbsp; {block:ContentSource} <a href="{SourceURL}"><a href="{SourceURL}">source</a>{/block:ContentSource}
  685. {block:RebloggedFrom} <a href="{ReblogParentURL}" ></a>{/block:RebloggedFrom}{/block:PermalinkPage}
  686.  
  687. </div>
  688.  
  689. <div id="cred"><a href="http://folklorethemes.tumblr.com">FLT.</a>
  690. </div>
  691.  
  692.  
  693. </body>
  694.  
  695. </html>
Advertisement
Add Comment
Please, Sign In to add comment