superfrown

Theme #21

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