superfrown

Theme #20

Jun 22nd, 2015
640
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.32 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4.  
  5. <title>{Title}</title>
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  8. {block:Description}
  9. <meta name="description" content="{MetaDescription}" />
  10. {/block:Description}
  11.  
  12. <head>
  13. <!----
  14.  
  15. Theme #20
  16. by: superfrown.tumblr.com
  17.  
  18. You may:
  19. Edit as much as you like
  20. Move the credit to a secondary page
  21.  
  22. You may not:
  23. Claim as your own
  24. Remove the credit
  25.  
  26. ---->
  27.  
  28.  
  29.  
  30.  
  31. <meta name="image:Background" content=""/>
  32. <meta name="image:Sidebar Image" content="" />
  33.  
  34. <meta name="color:Background" content="#f8f8f8" />
  35. <meta name="color:Sidebar Background" content="#000000" />
  36. <meta name="color:Post Background" content="#ffc9e3" />
  37. <meta name="color:Text" content="#5a5a5a" />
  38. <meta name="color:Bold" content="#5a5a5a" />
  39. <meta name="color:Italic" content="#929292" />
  40. <meta name="color:Link" content="#980222" />
  41. <meta name="color:Link hover" content="#a5a5a5" />
  42. <meta name="color:Blog Name" content="#f89bc7" />
  43. <meta name="color:Blog Name Hover" content="#ffffff" />
  44. <meta name="color:Description Text Color" content="#a5a5a5" />
  45. <meta name="color:Sidebar Links" content="#f89bc7" />
  46. <meta name="color:Sidebar Links Hover" content="#ffffff" />
  47.  
  48.  
  49. <meta name="if:500px" content="1">
  50. <meta name="if:Show Tags" content="1">
  51. <meta name="if:Show Submit" content="1">
  52. <meta name="if:Show Archive" content="1">
  53. <meta name="if:Show Link1" content="1">
  54. <meta name="if:Show Link2" content="1">
  55. <meta name="if:Show Link3" content="1">
  56. <meta name="if:Show Link4" content="1">
  57. <meta name="if:Show Link5" content="1">
  58.  
  59.  
  60. <meta name="text:Text Size" content="11px" />
  61. <meta name="text:Description Text Size" content="11px" />
  62.  
  63. <meta name="text:Link 1 URL" content="http://" />
  64. <meta name="text:Link 1" content="Link 1" />
  65. <meta name="text:Link 2 URL" content="http://" />
  66. <meta name="text:Link 2" content="Link 2" />
  67. <meta name="text:Link 3 URL" content="http://" />
  68. <meta name="text:Link 3" content="Link 3" />
  69. <meta name="text:Link 4 URL" content="http://" />
  70. <meta name="text:Link 4" content="Link 4" />
  71. <meta name="text:Link 5 URL" content="http://" />
  72. <meta name="text:Link 5" content="Link 5" />
  73.  
  74.  
  75. <style type="text/css">
  76.  
  77. /* MAIN */
  78.  
  79. body {
  80. background-color:{color:Background};
  81. background-image: url('{image:Background}');
  82. background-attachment: fixed;
  83. background-repeat: repeat;
  84. color:{color:Text};
  85. font-family:calibri;
  86. font-weight:0px;
  87. font-style:0px;
  88. letter-spacing:1px;
  89. font-size: {text:Text Size};}
  90.  
  91. a:link, a:active {
  92. text-decoration:none;
  93. color: {color:Link};
  94. -webkit-transition: all 0.4s ease-in-out;
  95. -moz-transition: all 0.4s ease-in-out;
  96. -o-transition: all 0.4s ease-in-out;
  97. transition: all 0.4s ease-in-out;}
  98.  
  99. a:visited {
  100. text-decoration:none;
  101. color: {color:Link};
  102. -webkit-transition: all 0.4s ease-in-out;
  103. -moz-transition: all 0.4s ease-in-out;
  104. -o-transition: all 0.4s ease-in-out;
  105. transition: all 0.4s ease-in-out;}
  106.  
  107. a:hover {
  108. text-decoration:none;
  109. color: {color:Link hover};
  110. -webkit-transition: all 0.4s ease-in-out;
  111. -moz-transition: all 0.4s ease-in-out;
  112. -o-transition: all 0.4s ease-in-out;
  113. transition: all 0.4s ease-in-out;}
  114.  
  115. b, strong, .strong {color:{color:Bold};}
  116.  
  117. blockquote {
  118. margin-left:18px;
  119. margin-bottom:18px;
  120. border-left:2px solid {color:Text};
  121. padding-left:8px; }
  122.  
  123. #tumblr_controls{ position:fixed!important; right: 0px; top:0px;}
  124.  
  125. i, em, .em {color:{color:Italic};}
  126.  
  127. ::-webkit-scrollbar {
  128. height:8px;
  129. width:8px;
  130. background-color: {color:Background};}
  131.  
  132. ::-webkit-scrollbar-thumb:vertical {
  133. background-color: {color:Sidebar Background};}
  134.  
  135. ::-webkit-scrollbar-thumb:horizontal {
  136. background-color: {color:Sidebar Background};}
  137.  
  138.  
  139. /* CONTENT */
  140.  
  141. .contentwhole {
  142. {block:if500px}width:554px;{/block:if500px}
  143. margin-top:80px;
  144. margin-bottom:80px;
  145. margin-left:460px;
  146. }
  147.  
  148. .content {
  149. {block:if500px}width:500px;{/block:if500px}
  150. {block:ifnot500px}width:400px;{/block:ifnot500px}
  151. margin-top:50px;
  152. margin-left:0px;
  153. padding:20px 20px 0px 20px;
  154. background-color: {color:Post Background};}
  155.  
  156.  
  157. .info {
  158. {block:if500px}width:500px;{/block:if500px}
  159. {block:ifnot500px}width:400px;{/block:ifnot500px}
  160. font-size:11px;
  161. text-align:right;
  162. letter-spacing:1px;
  163. text-transform:lowercase;
  164. padding-top:5px;
  165. padding-bottom:5px;
  166. }
  167.  
  168.  
  169. .tags {
  170. {block:if500px}width:540px;{/block:if500px}
  171. {block:ifnot500px}width:440px;{/block:ifnot500px}
  172. font-size:10px;
  173. text-align:center;
  174. letter-spacing:1px;
  175. margin-top:2px;
  176. }
  177.  
  178.  
  179. .title {
  180. font-size: 13px;
  181. letter-spacing:2px;
  182. font-weight:bold;
  183. text-align: left;}
  184.  
  185. #pn {
  186. width:520px;
  187. text-align:left;
  188. margin:0 auto;
  189. }
  190.  
  191.  
  192. /* Asks */
  193. .questions {
  194. text-align:left;
  195. padding:6px;
  196. border-bottom:1px solid {color:Text};}
  197.  
  198. .reply {
  199. padding: 6px;}
  200.  
  201.  
  202. /* Quote */
  203. #quote {
  204. font-size: 13px;}
  205. #source {
  206. font-size: 11px;
  207. letter-spacing:1px;
  208. margin-top: 10px;}
  209.  
  210.  
  211. /* Audio */
  212. .playerbuttonbg {
  213. position: absolute;
  214. left: 14px;
  215. top: 14px;
  216. width: 30px;
  217. height: 30px;
  218. background-color: #ffffff;
  219. padding: 10px;
  220. opacity: .4;
  221. filter: alpha(opacity=40);
  222. -moz-opacity: 0.4;
  223. -khtml-opacity: 0.4;
  224. transition: opacity .7s ease-in-out;
  225. -moz-transition: opacity .7s ease-in-out;
  226. -webkit-transition: opacity .7s ease-in-out;
  227. }
  228.  
  229. .playerbuttonbg:hover {
  230. opacity: 1;
  231. filter: alpha(opacity=100);
  232. -moz-opacity: 1;
  233. -khtml-opacity: 1;
  234. }
  235.  
  236. .newplayerbutton {
  237. position: relative;
  238. width: 30px;
  239. height: 30px;
  240. overflow: hidden;
  241. }
  242.  
  243. .playerbuttonhug {
  244. position: absolute;
  245. top: -29px;
  246. left: -9px;
  247. }
  248.  
  249. .tumblr_audio_player {
  250. height: 90px;
  251. width: 270px;
  252. -moz-transform: scale(0.60, 0.60);
  253. -webkit-transform: scale(0.60, 0.60);
  254. -o-transform: scale(0.60, 0.60);
  255. -ms-transform: scale(0.60, 0.60);
  256. transform: scale(0.60, 0.60);
  257. -moz-transform-origin: top left;
  258. -webkit-transform-origin: top left;
  259. -o-transform-origin: top left;
  260. -ms-transform-origin: top left;
  261. transform-origin: top left;
  262. }
  263.  
  264. .audioimgwrapper {
  265. position: absolute;
  266. left: 0px;
  267. top: 0px;
  268. overflow: hidden;
  269. width: 79px;
  270. height: 79px;
  271. }
  272.  
  273. .audioimgwrapper img {
  274. width: 100%;
  275. height: auto;
  276. }
  277.  
  278. .trackdetails {
  279. width: auto;
  280. display:inline-block;
  281. margin-left: 90px;
  282. min-height: 85px;
  283. }
  284.  
  285. .audiowrapper {
  286. position: relative;
  287. display:inline-block;
  288. }
  289.  
  290.  
  291.  
  292. /* BLOGNAME */
  293.  
  294. #blogname {
  295. width:120px;
  296. position:fixed;
  297. bottom:15px;
  298. margin-left:15px;
  299. text-align:left;}
  300.  
  301. #blogname a {
  302. font-size:18px;
  303. font-family:calibri;
  304. letter-spacing:4px;
  305. font-weight:bold;
  306. text-transform:lowercase;
  307. color: {color:Blog Name};
  308. -webkit-transition: all 0.5s ease-in-out;
  309. -moz-transition: all 0.5s ease-in-out;
  310. -o-transition: all 0.5s ease-in-out;
  311. transition: all 0.5s ease-in-out;}
  312.  
  313. #blogname a:hover {
  314. color: {color:Blog Name Hover};
  315. -webkit-transition: all 0.5s ease-in-out;
  316. -moz-transition: all 0.5s ease-in-out;
  317. -o-transition: all 0.5s ease-in-out;
  318. transition: all 0.5s ease-in-out;}
  319.  
  320.  
  321.  
  322. /* SIDEBAR */
  323.  
  324. .sidebar {
  325. z-index:999999;
  326. width:400px;
  327. height:100%;
  328. top:0px;
  329. left:0px;
  330. position:fixed;
  331. background-color:{color:Sidebar Background};
  332. background-image: url('{image:Sidebar Image}');}
  333.  
  334. .sidebar2 {
  335. width:252px;
  336. height:auto;
  337. bottom:10px;
  338. margin-left:140px;
  339. position:fixed;
  340. }
  341.  
  342.  
  343. /* DESCRIPTION */
  344.  
  345. .description {
  346. margin-top:10px;
  347. margin-left:0px;
  348. text-align:right;
  349. width: 250px;
  350. font-family:calibri;
  351. font-size:{text:Description Text Size};
  352. letter-spacing:1px;
  353. color: {color:Description Text Color};}
  354.  
  355.  
  356.  
  357. /* PAGINATION */
  358.  
  359. #pagination {
  360. margin-top:15px;
  361. margin-left:50px;
  362. text-align:right;
  363. width:200px;
  364. letter-spacing:2px;
  365. font-family:calibri;
  366. font-size:10px;
  367. padding-top:6px;
  368. padding-bottom:6px;}
  369.  
  370. #pagination a {
  371. display:inline-block;
  372. width:50px;
  373. margin:1px;
  374. text-align:center;
  375. text-transform:lowercase;
  376. color: {color:Blog Name};
  377. -webkit-transition: all 0.5s ease-in-out;
  378. -moz-transition: all 0.5s ease-in-out;
  379. -o-transition: all 0.5s ease-in-out;
  380. transition: all 0.5s ease-in-out;}
  381.  
  382. #pagination a:hover {
  383. color: {color:Blog Name Hover};
  384. -webkit-transition: all 0.5s ease-in-out;
  385. -moz-transition: all 0.5s ease-in-out;
  386. -o-transition: all 0.5s ease-in-out;
  387. transition: all 0.5s ease-in-out;}
  388.  
  389.  
  390. /* NAVIGATION */
  391.  
  392. #navigation {
  393. width:220px;
  394. margin-left:20px;
  395. text-align:right;
  396. }
  397.  
  398.  
  399. #navigation a {
  400. display:inline-block;
  401. margin-top:2px;
  402. margin-bottom:3px;
  403. margin-left:3px;
  404. margin-right:2px;
  405. font-family:calibri;
  406. font-size:11px;
  407. letter-spacing:2px;
  408. text-transform:lowercase;
  409. color: {color:Sidebar Links};
  410. -webkit-transition: all 0.5s ease-in-out;
  411. -moz-transition: all 0.5s ease-in-out;
  412. -o-transition: all 0.5s ease-in-out;
  413. transition: all 0.5s ease-in-out;}
  414.  
  415. #navigation a:hover {
  416. color:{color:Sidebar Links Hover};
  417. -webkit-transition: all 0.5s ease-in-out;
  418. -moz-transition: all 0.5s ease-in-out;
  419. -o-transition: all 0.5s ease-in-out;
  420. transition: all 0.5s ease-in-out;}
  421.  
  422.  
  423.  
  424.  
  425. /* CREDIT */
  426.  
  427. #credit {
  428. bottom:8px;
  429. right:5px;
  430. text-align:center;
  431. position: fixed;}
  432.  
  433. #credit a {
  434. padding:3px;
  435. font-size:11px;
  436. color: {color:Link};
  437. background-color: {color:Post Background};
  438. -webkit-transition: all 0.4s ease-in-out;
  439. -moz-transition: all 0.4s ease-in-out;
  440. -o-transition: all 0.4s ease-in-out;
  441. transition: all 0.4s ease-in-out;}
  442.  
  443. #credit a:hover {
  444. color: {color:Link Hover};
  445. -webkit-transition: all 0.4s ease-in-out;
  446. -moz-transition: all 0.4s ease-in-out;
  447. -o-transition: all 0.4s ease-in-out;
  448. transition: all 0.4s ease-in-out;}
  449.  
  450.  
  451.  
  452. </style>
  453.  
  454.  
  455. </head>
  456.  
  457. <body>
  458.  
  459. <div id="credit">
  460. <a href="http://superfrown.tumblr.com"> theme </a>
  461. </div>
  462.  
  463. <div class="sidebar">
  464.  
  465.  
  466. <div id="blogname">
  467. <a href="/">{title}.</a>
  468. </div>
  469.  
  470.  
  471.  
  472. <div class="sidebar2">
  473.  
  474. <div id="navigation">
  475. <a href="/"> Home </a>
  476. <a href="/ask"> Message </a>
  477. {block:IfShowSubmit}<a href="/submit"> Submit </a>{/block:IfShowSubmit}
  478. {block:IfShowArchive}<a href="/archive"> Archive </a>{/block:IfShowArchive}
  479. {block:IfShowLink1}<a href="{text:Link 1 url}">{text:Link 1} </a>{/block:IfShowLink1}
  480. {block:IfShowLink2}<a href="{text:Link 2 url}">{text:Link 2} </a>{/block:IfShowLink2}
  481. {block:IfShowLink3}<a href="{text:Link 3 url}">{text:Link 3} </a>{/block:IfShowLink3}
  482. {block:IfShowLink4}<a href="{text:Link 4 url}">{text:Link 4} </a>{/block:IfShowLink4}
  483. {block:IfShowLink5}<a href="{text:Link 5 url}">{text:Link 5} </a>{/block:IfShowLink5}
  484.  
  485. </div>
  486.  
  487.  
  488.  
  489. <div class="description">
  490. {description}
  491. </div>
  492.  
  493.  
  494. <div id="pagination">
  495. {block:PreviousPage}<a href="{PreviousPage}"> prev </a>{/block:PreviousPage}
  496. {block:NextPage}<a href="{NextPage}"> next </a>{/block:NextPage}
  497. </div>
  498.  
  499. </div>
  500.  
  501.  
  502. </div>
  503.  
  504.  
  505.  
  506.  
  507. <div class="contentwhole">
  508.  
  509. {block:Posts}
  510.  
  511.  
  512. <div class="content">
  513.  
  514.  
  515. <div class="title">
  516. {block:Title}
  517. {Title}
  518. {/block:Title}
  519. </div>
  520.  
  521. {block:Text}
  522. {Body}
  523. {/block:Text}
  524.  
  525. {block:Photo}
  526. {LinkOpenTag}{block:if500px}<img src="{PhotoURL-500}">{/block:if500px}
  527. {block:ifnot500px}<img src="{PhotoURL-400}">{/block:ifnot500px}{LinkCloseTag}
  528. {block:Caption}{Caption}{/block:Caption}
  529. {/block:Photo}
  530.  
  531. {block:Photoset}
  532. {block:if500px}{Photoset-500}{/block:if500px}
  533. {block:ifnot500px}{Photoset-400}{/block:ifnot500px}
  534. {block:Caption}{Caption}{/block:Caption}
  535. {/block:Photoset}
  536.  
  537. {block:Quote}
  538. <div id="quote">
  539.  
  540. <center>
  541. "{Quote}"
  542. </center>
  543.  
  544. </div>
  545. {block:Source}
  546. <div id="source">
  547. <center>
  548. - {Source}
  549. </center>
  550. </div>{/block:Source}
  551. {/block:Quote}
  552.  
  553. {block:Link}
  554. <a href="{URL}" target="{Target}" class="title"> {Name} → </a>
  555. {block:Description}{Description}{/block:Description}
  556. {/block:Link}
  557.  
  558. {block:Chat}
  559. {block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>
  560.  
  561. {/block:Lines}
  562. {/block:Chat}
  563.  
  564.  
  565. {block:Audio}
  566. {block:AudioPlayer}
  567. <div class="audiowrapper">
  568. {block:AlbumArt}
  569. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  570. {/block:AlbumArt}
  571.  
  572. <div class="playerbuttonbg">
  573. <div class="newplayerbutton">
  574. <div class="playerbuttonhug">
  575.  
  576. {AudioPlayerWhite}
  577.  
  578. </div>
  579. </div>
  580. </div>
  581.  
  582. <div class="trackdetails">
  583.  
  584. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  585. {block:Artist} <b>Artist:</b> {Artist}{/block:Artist}<br/>
  586. {block:Album} <b>Album:</b> {Album}{/block:Album}<br/>
  587. <b>Played:</b> {PlayCount} times
  588.  
  589. </div>
  590. </div>
  591. {/block:AudioPlayer}
  592.  
  593. {block:Caption}{Caption}{/block:Caption}
  594. {/block:Audio}
  595.  
  596. {block:Video}
  597. {block:if500px}{Video-500}{/block:if500px}
  598. {block:ifnot500px}{Video-400}{/block:ifnot500px}
  599. {block:Caption}{Caption}{/block:Caption}
  600. {/block:Video}
  601.  
  602. {block:Answer}
  603. <div class="questions"><i><b>{Asker}</b> asked:</i> {Question}
  604. </div>
  605. <div class="reply">{Answer}</div>
  606. {/block:Answer}
  607.  
  608. <div class="info">
  609. {block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}
  610. {block:NoteCount}&nbsp;/&nbsp;<a href="{Permalink}"> {NoteCount} notes</a>{/block:NoteCount}
  611. {block:RebloggedFrom}&nbsp;/&nbsp;<a href="{ReblogParentURL}"> via </a>{/block:RebloggedFrom}
  612. {block:ContentSource}&nbsp;/&nbsp;<a href="{SourceURL}"> source </a>{/block:ContentSource}
  613. </div>
  614.  
  615. </div>
  616.  
  617.  
  618.  
  619. <div class="tags">
  620. {block:IfShowTags}{block:HasTags}{block:Tags} #<a href="{TagURL}">{Tag} </a>{/block:Tags}{/block:HasTags}{/block:IfShowTags}
  621. </div>
  622.  
  623.  
  624.  
  625. <div id="pn">
  626. {block:PostNotes}{PostNotes}{/block:PostNotes}
  627. </div>
  628.  
  629. {/block:Posts}
  630.  
  631.  
  632.  
  633. </div>
  634.  
  635. </body>
  636. </html>
Advertisement
Add Comment
Please, Sign In to add comment