API tools faq
paste
Advertisement
kyleerps

PASTEL - theme 01

kyleerps
Jul 30th, 2015
1,441
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.11 KB | None | 0 0
raw download clone embed print report
  1. <!--originally WILDFIRE by hyollyn-->
  2. <!--PASTEL by KYLEERPS-->
  3.  
  4. <!DOCTYPE html>
  5. <head>
  6.  
  7.  
  8. <title>{Title}</title>
  9.  
  10. <link rel="shortcut icon" href="{Favicon}">
  11. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  12. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  13.  
  14. <!--Default Variables-->
  15.  
  16. <meta name="color:background" content="#ffffff"/>
  17. <meta name="color:text" content="#aaaaaa"/>
  18. <meta name="color:link" content="#000000"/>
  19. <meta name="color:scrollbar" content="#000000">
  20. <meta name="color:accent" content="#fcfcfc">
  21. <meta name="color:accent2" content="#444444">
  22.  
  23. <meta name="if:grayscale" content="1"/>
  24.  
  25. <meta name="image:sidebar image" content=""/>
  26.  
  27. <meta name="text:title" content="" />
  28. <meta name="text:header" content="" />
  29. <meta name="text:link 1 URL" content="" />
  30. <meta name="text:link 1" content="" />
  31. <meta name="text:link 2 URL" content="" />
  32. <meta name="text:link 2" content="" />
  33. <meta name="text:link 3 URL" content="" />
  34. <meta name="text:link 3" content="" />
  35. <meta name="text:link 4 URL" content="" />
  36. <meta name="text:link 4" content="" />
  37. <meta name="if:show sidebar image" content="1"/>
  38.  
  39.  
  40. <!-- jquery for tooltips-->
  41.  
  42.  
  43. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  44.  
  45. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  46.  
  47. <script>
  48.  
  49. (function($){
  50.  
  51. $(document).ready(function(){
  52.  
  53. $("a[title]").style_my_tooltips({
  54.  
  55. tip_follows_cursor:true,
  56.  
  57. tip_delay_time:30,
  58.  
  59. tip_fade_speed:300,
  60.  
  61. attribute:"title"
  62.  
  63. });
  64.  
  65. });
  66.  
  67. })(jQuery);
  68.  
  69. </script>
  70.  
  71.  
  72.  
  73.  
  74.  
  75.  
  76. <!--CSS customization here. -->
  77.  
  78. <style type="text/css">
  79.  
  80. {block:IfGrayscale}
  81. img{-webkit-filter: Grayscale(100%); -webkit-transition-duration: 0.8s; -moz-transition-duration:0.8s; transition-duration:0.8s; -o-transition-duration:0.8s;}
  82.  
  83. img:hover{-webkit-filter: Grayscale(0%); -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
  84.  
  85. .photoset {
  86. -webkit-filter: grayscale(100%);
  87. -webkit-transition: all .25s;
  88. ...
  89. }
  90.  
  91. .photoset:hover{-webkit-filter: Grayscale(0%); -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}-
  92.  
  93.  
  94. {/block:IfGrayscale}
  95.  
  96. #s-m-t-tooltip{
  97. position:absolute;
  98. margin-top: 15px;
  99. z-index:9999;
  100. background:{color:background};
  101. }
  102.  
  103. ::-webkit-scrollbar {
  104. width:5.7px;
  105. }
  106.  
  107. ::-webkit-scrollbar-thumb {
  108. background-color:{color:scrollbar};
  109. width:2px;
  110. border:2px solid {color:background};
  111. }
  112.  
  113. ::-webkit-scrollbar-track {
  114. background-color:{color:background};
  115. }
  116.  
  117. /*basics*/
  118. blockquote {padding:5px 0 5px 30px;
  119. border-left:1px solid {color:text};
  120. margin-left:30px;
  121. }
  122.  
  123. body {
  124. background:{color:background};
  125. color:{color:text};
  126. text-shadow: 0px 0px 2px {color:accent2};
  127. font-family:helvetica;
  128. font-size:9px;
  129. text-align:justify;
  130. margin:0;
  131. line-height:16px;}
  132.  
  133.  
  134. a {
  135. color:{color:link};
  136. text-decoration:none;
  137. -moz-transition-duration:0.4s;
  138. -webkit-transition-duration:0.4s;
  139. -o-transition-duration:0.4s;
  140. }
  141.  
  142. a:hover {
  143. color:{color:accent2};
  144. -moz-transition-duration:0.4s;
  145. -webkit-transition-duration:0.4s;
  146. -o-transition-duration:0.4s;
  147. }
  148.  
  149. img{opacity:1;
  150. border:none;
  151. text-decoration:none}
  152.  
  153.  
  154. small {
  155. font-size:9px;}
  156.  
  157. big {
  158. font-size:13px;}
  159.  
  160.  
  161. #title {font-size:14px;
  162. font-family:helvetica;
  163. line-height:18px;
  164. font-style:italic;
  165. margin-bottom:10px;
  166. text-transform:lowercase;
  167. text-align:left;}
  168.  
  169.  
  170. /*sidebar*/
  171. #sidebar {text-align:left;
  172. position:fixed;
  173. margin-left:480px;
  174. margin-top:0px;
  175. width:155px;
  176. }
  177.  
  178. #sidebarim {margin-bottom:-55px;
  179. margin-left: 0px;
  180. border-radius: 100px;
  181. width: 50px;
  182. height: 50px;
  183. }
  184.  
  185. #sidebarim img {
  186. {block:ifshowsidebarimage}
  187. width:50px;
  188. border-radius: 100px;
  189. box-shadow: 1px 1px 2px {color:text};
  190. border: 6px solid #f8f8f8;
  191. height: 50px;
  192. {/block:ifshowsidebarimage}
  193. {block:ifnotshowsidebarimage}
  194. width:0px;
  195. {/block:ifnotshowsidebarimage}
  196. }
  197.  
  198. #blogt {font-size:14px;
  199. width: 140px;
  200. margin-top: 25px;
  201. height: 15px;
  202. padding-right: 5px;
  203. padding-left: 10px;
  204. padding-top: 5px;
  205. padding-bottom: 5px;
  206. border-top-right-radius: 5px;
  207. margin-left: 57px;
  208. border: 1px solid #ccc;
  209. background-color: {color:accent};
  210. text-transform:uppercase;
  211. margin-bottom:25px;
  212. font-family:helvetica;
  213. font-style:italic;}
  214.  
  215. #links {
  216. width:35px;
  217. text-align:left;
  218. line-height:12px;
  219. text-transform:lowercase;
  220. margin-top:-10px;
  221. padding-top:4px;
  222. font-style:italic;
  223. }
  224.  
  225.  
  226. #links a {
  227. margin-right:10px;
  228. display:inline-block;
  229. margin-bottom:5px;
  230. }
  231.  
  232. #links a:hover {
  233. color:{color:accent2};
  234. }
  235.  
  236. #description {
  237. width: 190px;
  238. padding: 10px;
  239. background: #f8f8f8;
  240. border:1px solid #ccc;
  241. box-shadow: 1.5px 0px 0px #ddd;
  242. height: 210px;
  243. border-bottom-right-radius: 5px;
  244. border-bottom-left-radius: 5px;
  245. line-height:15px;
  246. padding-left:10px;
  247. margin:30px 0;
  248. }
  249.  
  250.  
  251. /*pagination*/
  252. #pagination {
  253. margin-top:20px;
  254. border: 1px solid #ccc;
  255. box-shadow: 1.5px 1.5px 0px #ddd;
  256. padding: 10px;
  257. width: 400px;
  258. font-size:14px;
  259. font-family:helvetica;
  260. text-align:center;
  261. text-transform:uppercase;
  262. font-style:italic;
  263. }
  264.  
  265. #pagination a {
  266. padding:0 15px;
  267. }
  268.  
  269. /*container*/
  270. #con {
  271. left:50%;
  272. margin-top: 100px;
  273. margin-left:-300px;
  274. position:absolute;
  275. }
  276.  
  277.  
  278.  
  279. /*posts*/
  280.  
  281. #entries {
  282. margin-top:0px;
  283. position: fixed;
  284. border-top-left-radius: 5px;
  285. border-top-right-radius: 5px;
  286. height: 267px;
  287. overflow: auto;
  288. padding: 20px;
  289. border: 1px solid #ccc;
  290. width:420px;
  291. }
  292.  
  293.  
  294.  
  295. #posts {
  296. width:400px;
  297. background-color: {color:accent};
  298. border: 1px solid #ccc;
  299. box-shadow: 1.5px 1.5px 0px #ddd;
  300. padding: 10px;
  301. {block:IndexPage}
  302. margin-bottom:25px;
  303. {/block:IndexPage}
  304. {block:PermalinkPage}
  305. margin-bottom:50px;
  306. {/block:PermalinkPage}
  307.  
  308. }
  309. #posts img {
  310. max-width:400px;
  311. }
  312.  
  313. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  314. .caption {width:100%;
  315. margin-top:10px;
  316.  
  317. }
  318.  
  319. /*quote*/
  320.  
  321. #titlequote{text-align:left;
  322. font-size:14px;
  323. font-family:helvetica;
  324. line-height:19px;
  325. font-style:italic;
  326. }
  327. #source {
  328. font-weight:bold;
  329. margin-top:15px;
  330. margin-left:15px;}
  331.  
  332. /*audio*/
  333.  
  334. .player {
  335. width:25px;
  336. height:25px;
  337. overflow:hidden;
  338. position:absolute;
  339. background:white;}
  340.  
  341. .audioinfo {
  342. margin-left:50px;
  343. }
  344.  
  345.  
  346. /*asks*/
  347. .q {margin-bottom:10px;
  348. padding:10px;
  349. background-color:{color:accent};
  350. }
  351. .as {
  352. font-weight:bold;}
  353.  
  354. .a {
  355. margin-top:10px;
  356. }
  357.  
  358.  
  359. /*chat*/
  360.  
  361. .chat ol {
  362. padding:0;
  363. list-style:none;
  364. }
  365. .line {padding:5px 0;}
  366.  
  367. .label {font-weight:bold;
  368. }
  369.  
  370.  
  371.  
  372.  
  373.  
  374. /*permalink and notes*/
  375.  
  376. #permalink {
  377. padding:5px;
  378. border-top: 1px solid #ddd;
  379. padding-left:5px;
  380. background-color:{color:background};
  381. margin-top:15px;
  382. font-size:9px;
  383. text-transform:lowercase;
  384. }
  385. #permalink a {margin-right:5px;
  386. margin-left:5px;
  387. }
  388.  
  389.  
  390. .tags {
  391. font-size:9px;
  392. }
  393.  
  394. .pagenotes {
  395. {block:IndexPage}
  396. display: none!important;
  397. {/block:IndexPage}
  398. width:400px;
  399. text-align:left;
  400.  
  401. }
  402. .pagenotes img {
  403. display:none!important;}
  404. .pagenotes li {
  405. list-style-type:none;
  406. padding:5px 0px;
  407. text-align:left;
  408. margin:0 0 0 -40px;
  409. }
  410.  
  411. /*credit*/
  412.  
  413. #credit {
  414. font-size:9px;
  415. line-height:8px;
  416. background-color:transparent;
  417. font-family:helvetica;
  418. letter-spacing:0px;
  419. bottom:7px;
  420. right:0px;
  421. position:fixed;
  422. z-index:1000;
  423. padding:8px 9px;
  424. }
  425.  
  426. #header {
  427. width: 462px;
  428. height: 30px;
  429. margin-top: 410px;
  430. background-color: {color:accent};
  431. margin-left: 337px;
  432. border-bottom-left-radius: 5px;
  433. border-bottom-right-radius: 5px;
  434. box-shadow: 2px 2px 0px #ddd;
  435. position: fixed;
  436. }
  437.  
  438. #headerlink {
  439. width: 190px;
  440. height: 30px;
  441. margin-top: 410px;
  442. background-color: {color:accent};
  443. margin-left: 809px;
  444. border-bottom-left-radius: 5px;
  445. border-bottom-right-radius: 5px;
  446. box-shadow: 2px 2px 0px #ddd;
  447. position: fixed;
  448. }
  449.  
  450. #header-link {
  451. width: 30px;
  452. padding: 7px;
  453. margin-top: 15px;
  454. line-height: 0%;
  455. border: 1px solid #ccc;
  456. background-color: #fff;
  457. margin-left: 220px;
  458.  
  459. }
  460.  
  461. #header-link1 {
  462. width: 31px;
  463. padding: 7px;
  464. line-height: 0%;
  465. border: 1px solid #ccc;
  466. background-color: #fff;
  467. margin-top: -32px;
  468. margin-left: 265px;
  469.  
  470. }
  471.  
  472. #header-link2 {
  473. width: 30px;
  474.  
  475. line-height: 0%;
  476. padding: 7px;
  477. border: 1px solid #ccc;
  478. background-color: #fff;
  479. margin-top: -32px;
  480. margin-left: 311px;
  481.  
  482. }
  483.  
  484. #header-link3 {
  485. width: 30px;
  486. line-height: 0%;
  487. padding: 7px;
  488. border: 1px solid #ccc;
  489. margin-top: -37px;
  490. background-color: #fff;
  491. margin-left: 630px;
  492.  
  493. }
  494.  
  495. #header-link-container {
  496. width: 50px;
  497. padding: 5px;
  498. margin-left: 270px;
  499. margin-top: -25px;
  500.  
  501. }
  502.  
  503. #header-title {
  504. margin-top: 17px;
  505. font-size: 9px;
  506. line-height: 0%;
  507. letter-spacing: 1px;
  508. text-transform: uppercase;
  509. margin-left: 30px;
  510. }
  511.  
  512.  
  513.  
  514.  
  515. {CustomCSS}
  516.  
  517.  
  518. </style>
  519.  
  520.  
  521.  
  522. </head>
  523.  
  524. <body>
  525.  
  526. <div id="header">
  527. <div id="header-title"><i><b>{text:header}</b></i> </div><div id="header-link-container">
  528.  
  529. <div id="header-link"><center><a href="{text:Link 1 URL}"> <b>{text:Link 1}</b></a></center></div>&nbsp;&nbsp;<div id="header-link1"><center><a href="{text:Link 2 URL}"><b>{text:Link 2}</b></a></center></div>&nbsp;&nbsp;<div id="header-link2"><center><a href="{text:Link 3 URL}"> <b>{text:Link 3}</b></a></center></div>&nbsp;&nbsp;
  530. </div><div id="header-link3"><center><a href="{text:Link 4 URL}">{text:Link 4}</a></center></div>&nbsp;&nbsp;
  531. </div>
  532. </div>
  533.  
  534. <div id="con">
  535.  
  536. <div id="sidebar">
  537. <div id="sidebarim"><img src="{image:Sidebar Image}"></div>
  538. <div id="blogt">{text:title}</div>
  539. <div id="description">{Description}</div>
  540. <div id="links">
  541. </div>
  542.  
  543.  
  544.  
  545.  
  546. </div>
  547.  
  548.  
  549.  
  550.  
  551. <div id="entries">
  552.  
  553. {block:Posts}
  554. <div id="posts">
  555.  
  556.  
  557. {block:Quote}
  558.  
  559.  
  560. <div id="titlequote">“{Quote}”</div>
  561. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  562. {/block:Quote}
  563.  
  564.  
  565.  
  566. {block:Text}
  567.  
  568. {block:Title}
  569. <div id="title">{Title}</div>{/block:Title}
  570. {Body}
  571. {/block:Text}
  572.  
  573. {block:Link}
  574. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  575. {/block:Link}
  576.  
  577. {block:Chat}
  578. {block:Title}
  579. <h1>{Title}</h1>
  580. {/block:Title}
  581. <div class="chat">
  582. <ol>{block:Lines}
  583. <li class="line {Alt}">
  584. {block:Label}
  585. <span class="label">
  586. {Label}</span>
  587. {/block:Label}{Line}</li>
  588. {/block:Lines}
  589. </ol></div>
  590. {/block:Chat}
  591.  
  592. {block:Photo}
  593. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
  594. {/block:Photo}
  595.  
  596. {block:Photoset}
  597. {Photoset-400}
  598. {/block:Photoset}
  599.  
  600. {block:Video}
  601. {Video-400}
  602. {/block:Video}
  603.  
  604. {block:Audio}
  605. <div class="player">{AudioPlayerWhite}</div>
  606. <div class="audioinfo">
  607. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}
  608. </div>
  609. {/block:Audio}
  610.  
  611. {block:Answer}
  612. <div class="q">
  613. <div class="as">{Asker} — </div>
  614. {Question}</div>
  615. <div class="a">{Answer}</div>
  616. {/block:Answer}
  617.  
  618. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  619.  
  620. {block:Date}
  621. <div id="permalink">
  622. <a href="{Permalink}" style="text-transform: uppercase;">{Month} {DayOfMonth}</a> / {block:NoteCount}<a href="{Permalink}">{NoteCount}</a>{/block:NoteCount}
  623. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}"><u>{Tag}</u></a>{/block:Tags}</div>{/block:HasTags}
  624. </div>
  625. {/block:Date}
  626.  
  627.  
  628.  
  629. </div>
  630.  
  631.  
  632. {block:PostNotes}
  633. <div class="pagenotes">
  634. {PostNotes}
  635. </div>
  636. {/block:PostNotes}
  637.  
  638.  
  639. {/block:Posts}
  640.  
  641. <div id="pagination">
  642. {block:Pagination}
  643. {block:PreviousPage}
  644. <a href="{PreviousPage}">⇦</a>
  645. {/block:PreviousPage}
  646.  
  647.  
  648. {block:NextPage}
  649. <a href="{NextPage}">⇨</a>
  650. {/block:NextPage}
  651. {/block:Pagination}
  652. </div>
  653.  
  654. <div id="credit"><a href="http://kyleerps.tumblr.com/" title="kylee!!!">@</a> / <div id="credit"><a href="http://hyollyn.tumblr.com/" title="hyollyn!!!">&.</a></div>
  655.  
  656.  
  657.  
  658. </div>
  659.  
  660. </div>
  661.  
  662.  
  663. {block:ContentSource}
  664. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  665. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  666. {/block:SourceLogo}
  667. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  668. {/block:ContentSource}
  669.  
  670. </body></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!