jamidanielle_

YOUNGBLOOD

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