API tools faq
paste
planthed

Let it sleep

planthed
Jul 27th, 2016
1,482
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.04 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3.  
  4. Let it sleep @ planthed
  5.  
  6.  
  7. — DO NOT delete the credit.
  8. — Do not copy or steal any code.
  9. — Do not claim as yours.
  10. — Full credits at @painthemes/c
  11.  
  12.  
  13. -->
  14.  
  15. <html lang="en">
  16. <head>
  17. <title>{block:PostSummary}{PostSummary}: {/block:PostSummary}{Title}</title>
  18. <link rel="shortcut icon" href="{favicon}">
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20. {block:hidden}
  21. <!--Default Variables-->
  22. <meta name="image:Background" content=""/>
  23. <meta name="image:Sidebar" content=""/>
  24.  
  25. <meta name="color:Background" content="#ffffff"/>
  26. <meta name="color:Text" content="#000000"/>
  27. <meta name="color:Accent" content="#BDC0DA"/>
  28. <meta name="color:Accent text" content="#000000"/>
  29. <meta name="color:Navigation hover" content="#BDC0DA"/>
  30. <meta name="color:Navigation hover text" content="#000000"/>
  31.  
  32. <meta name="text:Blogtitle" content="" />
  33. <meta name="text:Home label" content="home" />
  34. <meta name="text:Ask label" content="ask"/>
  35. <meta name="text:Archive label" content="Past" />
  36. <meta name="text:Extra link 1" content="" />
  37. <meta name="text:Extra link 1 URL" content="http://" />
  38. <meta name="text:Extra link 2" content="" />
  39. <meta name="text:Extra link 2 URL" content="http://" />
  40.  
  41. <meta name="if:White Tiny cursor" content="" />
  42. <meta name="if:Black Tiny cursor" content="" />
  43.  
  44. {/block:hidden}
  45.  
  46.  
  47. <!---pxu script--->
  48. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  49.  
  50. <!--- tooltips script --->
  51. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  52. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  53. <script>
  54. (function($){
  55. $(document).ready(function(){
  56. $("a[title]").style_my_tooltips({
  57. tip_follows_cursor:true,
  58. tip_delay_time:90,
  59. tip_fade_speed:600,
  60. attribute:"title"
  61. });
  62. });
  63. })(jQuery);
  64. </script>
  65.  
  66.  
  67. <!-------
  68.  
  69. A FEW RULES YOU NEED TO KNOW BEFORE START EDITING THE THEME:
  70.  
  71. > You CAN'T use my themes as base
  72. > You CAN'T remove my credits, even if you edited the theme a lot.
  73. > Don't use any part of my codes without permission.
  74. > You can edit the theme as your own like and make it look too different as the original one but if you edit the theme a lot and you're having problems with it, I'll not allowed to help you.
  75.  
  76.  
  77. YOU ARE NOT ALLOWED TO USE MY CODES FOR YOUR OWN THEME OR ANY OTHER THEME
  78. BY OTHER THEME MAKER WITHOUT PERMISSION, IF YOU WANNA USE ONE OF MY CODES
  79. ASK FIRST, DON'T CLAIM AS YOURS, DON'T BE A BITCH.
  80.  
  81. ---------->
  82.  
  83.  
  84.  
  85. <style type="text/css">
  86.  
  87. /*tooltips style*/
  88. #s-m-t-tooltip{
  89. max-width:300px;
  90. padding:7px;
  91. min-height:7px;
  92. background:{color:Accent};
  93. color:{color:Accent text};
  94. font-style:italic;
  95. margin:20px 0px 0px 20px;
  96. line-height:100%;
  97. word-wrap:break-word;
  98. word-break:break-all;
  99. opacity:1;
  100. z-index:9999999999999999999;
  101. }
  102.  
  103.  
  104. /*tumblr controls and lightbox*/
  105.  
  106.  
  107. #tumblr_controls, .tmblr-iframe{ z-index:999999999999999999!important; -webkit-filter:invert(100%); -moz-filter:invert(100%); -o-filter:invert(100%); -ms-filter:invert(100%); filter:invert(100%); position:fixed!important; top:25px!important; right:5px!important; opacity:.5;
  108. -webkit-transition:all 0.6s ease-out;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out}
  109.  
  110. #tumblr_controls, .tmblr-iframe:hover{
  111. opacity:.9;webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;
  112. -webkit-transition:all 0.6s ease-out;-webkit-filter:invert(80%); -moz-filter:invert(80%); -o-filter:invert(80%); -ms-filter:invert(80%); filter:invert(80%);
  113. }
  114.  
  115.  
  116. #tumblr_lightbox,.tmblr-lightbox{
  117. background:rgba({RGBcolor:background}, 0.8)!important;}
  118.  
  119. #vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{
  120. opacity:0!important;
  121. }
  122.  
  123. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image, .lightbox-image {
  124. box-shadow:none!important;
  125. border-radius:0px!important;
  126. padding:0px!important;
  127. background:{color:post background}!important;
  128. }
  129.  
  130.  
  131. ::-webkit-scrollbar{
  132. height:3px;
  133. width:11px;
  134. background:inherit;
  135. background:#eee;
  136. border:5px solid {color:background};
  137. }
  138.  
  139. ::-webkit-scrollbar-track {background:transparent;}
  140.  
  141. ::-webkit-scrollbar-thumb {
  142. height:150px!important;
  143. background:{color:Accent};
  144. border:5px solid {color:background};
  145. }
  146.  
  147.  
  148. /*tiny cursor*/
  149.  
  150.  
  151. html, body, img, a {
  152. {block:ifWhiteTinycursor}
  153. cursor:url(http://static.tumblr.com/vmteopo/fhxo3gbrd/small_white_cursor.png), auto;
  154. {/block:ifWhiteTinycursor}
  155. {block:ifBlackTinyCursor}
  156. cursor: url('http://33.media.tumblr.com/tumblr_lqs4qdUu8n1qfoi4t.png'), auto;
  157. {/block:ifBlackTinyCursor}
  158. }
  159.  
  160. a:hover, a:active, iframe{
  161. {block:ifWhiteTinycursor}cursor:url(http://static.tumblr.com/vmteopo/RQ9o3gbth/small_white_cursor_help.png), crosshair;
  162. {/block:ifWhiteTinycursor}
  163. {block:ifBlackTinyCursor}
  164. cursor:url(http://static.tumblr.com/vmteopo/DH3njhg50/help_cursor.png), crosshair;
  165. {/block:ifBlackTinyCursor}
  166. }
  167.  
  168.  
  169.  
  170. ::-moz-selection{
  171. color:{color:Accent text};
  172. background:{color:Accent};
  173. }
  174.  
  175. ::selection{
  176. color:{color:Accent text};
  177. background:{color:Accent};
  178. }
  179.  
  180.  
  181. /*main structure*/
  182.  
  183.  
  184. body{
  185. background-color:{color:background};
  186. background-image:url({image:Background});
  187. background-attachment:fixed;
  188. background-repeat:repeat;
  189. font-family:source sans pro, sans-serif;
  190. font-size:11px;
  191. color:{color:text};
  192. line-height:1.5em;
  193. -moz-osx-font-smoothing:grayscale;
  194. -webkit-font-smoothing:antialiased;
  195. font-smoothing:antialiased;
  196. }
  197.  
  198.  
  199. a:link, a:active, a:visited{
  200. color:{color:Accent};
  201. text-decoration:none;
  202. -webkit-transition:all 0.5s linear;
  203. -moz-transition:all 0.5s linear;
  204. transition:all 0.5s linear;
  205. }
  206.  
  207. a:hover {color:{color:text};}
  208.  
  209. .center {
  210. position:relative;
  211. margin:50px auto;
  212. width:calc(500px + 120px);
  213. {block:PermalinkPage}
  214. width:450px;
  215. {/block:PermalinkPage}
  216. }
  217.  
  218. #posts{
  219. position:relative;
  220. {block:PermalinkPage}
  221. margin-top:100px;
  222. {/block:PermalinkPage}
  223. }
  224.  
  225. .entry {
  226. margin:40px;
  227. overflow:hidden;
  228. background:{color:background};
  229. {block:indexpage}
  230. width:230px;
  231. opacity:0;
  232. z-index:-1;
  233. {/block:indexpage}
  234. {block:PermalinkPage}
  235. width:400px;
  236. {/block:PermalinkPage}
  237. }
  238.  
  239. .entry img{
  240. max-width:100%;
  241. position:relative;
  242. overflow:hidden;
  243. display:block;
  244. }
  245.  
  246.  
  247. #move {
  248. position:relative;
  249. overflow:hidden;
  250. opacity:1;
  251. background:{color:Accent};
  252. }
  253.  
  254. #move img {
  255. display:block;
  256. height:auto;
  257. -webkit-transition:opacity 0.3s linear;
  258. -webkit-transition:all 0.3s linear;
  259. -moz-transition:all 0.3s linear;
  260. transition:all 0.3s linear;
  261.  
  262. }
  263.  
  264. .entry:hover #move img {
  265. -ms-transform:translate(0px,-40px);
  266. -webkit-transform:translate(0px,-40px);
  267. transform:translate(0px,-40px);
  268. -webkit-filter: grayscale(70%);
  269. }
  270.  
  271. .perm1 a, .perm2 a, .perm3 a{
  272. color:{color:Accent text};
  273. }
  274.  
  275. .perm1 {
  276. width:20px;
  277. height:20px;
  278. text-align:center;
  279. position:absolute;
  280. z-index:100;
  281. bottom:-100px;
  282. font-size:15px;
  283. margin-left:10px;
  284. opacity:0;
  285. display:inline-block;
  286. -webkit-transition:opacity 0.3s linear;
  287. -webkit-transition:all 0.3s linear;
  288. -moz-transition:all 0.3s linear;
  289. transition:all 0.3s linear;
  290. }
  291.  
  292. .entry:hover .perm1{
  293. opacity:1;
  294. bottom:6px;
  295. -webkit-transition:all .5s ease-in-out;
  296. -moz-transition:all .5s ease-in-out;
  297. -o-transition:all .5s ease-in-out;
  298. }
  299.  
  300. .perma1{
  301. position:absolute;
  302. text-transform:uppercase;
  303. font-family:roboto;
  304. font-weight:300;
  305. font-style:normal;
  306. font-size:14px;
  307. letter-spacing:1px;
  308. margin-top:-15px;
  309. margin-left:140px;
  310. width:150px;
  311. opacity:0;
  312. visibility:hidden;
  313. -webkit-transition:opacity 0.3s linear;
  314. -webkit-transition:all 0.3s linear;
  315. -moz-transition:all 0.3s linear;
  316. transition:all 0.3s linear;
  317. }
  318.  
  319. .perm1:hover .perma1{
  320. opacity:1;
  321. visibility:visible;
  322. margin-left:80px;
  323. }
  324.  
  325. .perm2 {
  326. width:20px;
  327. height:20px;
  328. text-align:center;
  329. position:absolute;
  330. z-index:100;
  331. bottom:-100px;
  332. font-size:15px;
  333. margin-left:40px;
  334. opacity:0;
  335. display:inline-block;
  336. -webkit-transition:opacity 0.3s linear;
  337. -webkit-transition:all 0.3s linear;
  338. -moz-transition:all 0.3s linear;
  339. transition:all 0.3s linear;
  340. }
  341.  
  342. .entry:hover .perm2 {
  343. opacity:1;
  344. bottom:6px;
  345. -webkit-transition:all 1s ease-in-out;
  346. -moz-transition:all 1s ease-in-out;
  347. -o-transition:all 1s ease-in-out;
  348. }
  349.  
  350.  
  351. .perma2{
  352. position:absolute;
  353. text-transform:uppercase;
  354. font-family:roboto;
  355. font-weight:300;
  356. font-style:normal;
  357. font-size:14px;
  358. letter-spacing:1px;
  359. margin-top:-15px;
  360. margin-left:100px;
  361. width:150px;
  362. opacity:0;
  363. visibility:hidden;
  364. -webkit-transition:opacity 0.3s linear;
  365. -webkit-transition:all 0.3s linear;
  366. -moz-transition:all 0.3s linear;
  367. transition:all 0.3s linear;
  368. }
  369.  
  370. .perm2:hover .perma2{
  371. opacity:1;
  372. visibility:visible;
  373. margin-left:40px;
  374. }
  375.  
  376. .perm3 {
  377. width:20px;
  378. height:20px;
  379. text-align:center;
  380. position:absolute;
  381. z-index:100;
  382. bottom:-100px;
  383. font-size:15px;
  384. margin-left:70px;
  385. opacity:0;
  386. display:inline-block;
  387. -webkit-transition:opacity 0.3s linear;
  388. -webkit-transition:all 0.3s linear;
  389. -moz-transition:all 0.3s linear;
  390. transition:all 0.3s linear;
  391. }
  392.  
  393. .entry:hover .perm3 {
  394. opacity:1;
  395. bottom:6px;
  396. -webkit-transition:all 1.5s ease-in-out;
  397. -moz-transition:all 1.5s ease-in-out;
  398. -o-transition:all 1.5s ease-in-out;
  399. }
  400.  
  401.  
  402. .perma3{
  403. position:absolute;
  404. text-transform:uppercase;
  405. font-family:roboto;
  406. font-weight:300;
  407. font-style:normal;
  408. font-size:14px;
  409. letter-spacing:1px;
  410. margin-top:-15px;
  411. margin-left:80px;
  412. width:150px;
  413. opacity:0;
  414. visibility:hidden;
  415. -webkit-transition:opacity 0.3s linear;
  416. -webkit-transition:all 0.3s linear;
  417. -moz-transition:all 0.3s linear;
  418. transition:all 0.3s linear;
  419. }
  420.  
  421. .perm3:hover .perma3{
  422. opacity:1;
  423. visibility:visible;
  424. margin-left:15px;
  425. }
  426.  
  427.  
  428.  
  429. pre {
  430. white-space: pre-wrap;
  431. white-space: -moz-pre-wrap;
  432. white-space: -pre-wrap;
  433. white-space: -o-pre-wrap;
  434. word-wrap: break-word;
  435. }
  436.  
  437. p {margin:5px 0;}
  438.  
  439. p:first-of-type {
  440. margin-top:0;
  441. padding-top:0;
  442. }
  443.  
  444. p:last-of-type {
  445. margin-bottom:0;
  446. padding-bottom:0;
  447. }
  448.  
  449.  
  450. small, big {font-size:1em;}
  451.  
  452. h1, h2, h3, h4 {
  453. font-size:2em;
  454. margin:0;
  455. line-height:22px;
  456. padding:0;
  457. }
  458.  
  459.  
  460. .back{
  461. margin-top:3px;
  462. {block:IndexPage}
  463. padding:10px;
  464. border:1px solid rgba({RGBcolor:Accent}, 0.7);{/block:IndexPage}
  465. }
  466.  
  467. .back a, .a a{
  468. color:{color:text};
  469. border-bottom:1px solid rgba({RGBcolor:Accent}, 0.5);
  470. }
  471.  
  472. .back a:hover, .a a:hover{
  473. color:{color:Accent};
  474. border-bottom:1px solid {color:Accent};
  475. }
  476.  
  477. .ptext{
  478. right:5px;
  479. margin-top:7px;
  480. display:block;
  481. font-size:12px;
  482. text-align:right;
  483. word-spacing:5px;
  484. }
  485.  
  486. /*audio player*/
  487.  
  488.  
  489. #audio {
  490. width:auto;
  491. margin:0px;
  492. height:auto;
  493. min-height:60px;
  494. line-height:20px;
  495. }
  496. .cover {
  497. z-index:1;
  498. width:70px;
  499. height:70px;
  500. position:absolute;
  501. }
  502. .cover img {
  503. float:left;
  504. position:absolute;
  505. border-radius:0px;
  506. width:70px;
  507. height:70px;
  508. }
  509.  
  510. .playbox {
  511. position:absolute;
  512. z-index:9;
  513. background:black;
  514. opacity:0;
  515. width:70px;
  516. height:70px;
  517. -webkit-transition:opacity 0.5s linear;
  518. -webkit-transition:all 0.5s linear;
  519. -moz-transition:all 0.5s linear;
  520. transition:all 0.5s linear;
  521. }
  522.  
  523. .entry:hover .playbox{
  524. opacity:.8;
  525. -webkit-transition:opacity 0.5s linear;
  526. -webkit-transition:all 0.5s linear;
  527. -moz-transition:all 0.5s linear;
  528. transition:all 0.5s linear;
  529. }
  530.  
  531. .button {
  532. position:relative;
  533. z-index: 1000;
  534. overflow:hidden;
  535. width:25px;
  536. height:25px;
  537. margin:20px 20px 20px 20px;
  538. }
  539.  
  540.  
  541. .info {
  542. margin-left:70px;
  543. margin-top:0px;
  544. font-size:12px;
  545. letter-spacing:1px;
  546. text-align:right;
  547. text-transform:uppercase;
  548. line-height:20px;
  549. font-weight:300;
  550. background:{color:Accent};
  551. color:{color:Accent text};
  552. padding:10px;
  553. padding-left:5px;
  554. }
  555.  
  556. /*title*/
  557.  
  558. .title{
  559. background:{color:Accent};
  560. text-align:center;
  561. padding:7px;
  562. padding-bottom:5px;
  563. color:{color:Accent text};
  564. font-weight:300;
  565. margin-bottom:7px;
  566. font-style:normal;
  567. font-family:roboto;
  568. font-size:13px;
  569. text-transform:uppercase;
  570. letter-spacing:2px;
  571. line-height:30px;
  572. }
  573.  
  574. .title a{
  575. color:{color:Accent text};
  576. }
  577. .title a:hover{
  578. letter-spacing:3px
  579. }
  580.  
  581. /*blockquote & quote*/
  582.  
  583. blockquote{
  584. border-left:1px solid rgba({RGBcolor:Accent}, 0.5);
  585. margin:5px;
  586. padding-left:10px;
  587. line-height:15px;
  588. }
  589.  
  590. .quote{
  591. font-size:10px;
  592. font-weight:300;
  593. color:{color:Title};
  594. font-style:italic;
  595. text-transform:uppercase;
  596. letter-spacing:2px;
  597. line-height:20px;
  598. padding:7px;
  599. background:{color:Accent};
  600. color:{color:Accent text};
  601. }
  602.  
  603. .cite{
  604. line-height:15px;
  605. text-align:right;
  606. font-family:9px;
  607. font-style:italic;
  608. padding-top:5px;
  609. padding-right:5px;
  610. }
  611.  
  612. /*ask style*/
  613.  
  614.  
  615. .as{
  616. letter-spacing:0px;
  617. text-transform:uppercase;
  618. letter-spacing:1px;
  619. padding:10px;
  620. text-align:center;
  621. font-style:normal;
  622. overflow:hidden;
  623. background:{color:Accent};
  624. color:{color:Accent text};
  625. }
  626.  
  627. .as a{color:{color:Accent text};}
  628.  
  629. .q{
  630. margin-top:10px;
  631. margin-bottom:10px;
  632. line-height:14px;
  633. font-style:italic;
  634. }
  635.  
  636. .qline{
  637. height:1px;
  638. display:block;
  639. width:50%;
  640. margin-left:25%;
  641. background:{color:Accent};
  642. }
  643.  
  644. .a{
  645. line-height:14px;
  646. margin-top:10px;
  647. }
  648.  
  649. .a img{
  650. width:100%;
  651. height:auto;
  652. }
  653.  
  654. .video, .video iframe{
  655. display:block;
  656. {block:indexpage}
  657. width:230px;
  658. height:auto;
  659. {/block:indexpage}
  660. {block:PermalinkPage}
  661. width:400px;
  662. height:auto;
  663. {/block:PermalinkPage}
  664. }
  665. #reblogged {
  666. bottom:30px!important;
  667. right:30px!important;
  668. }
  669. /*chat styling*/
  670.  
  671. .user_1, .user_3, .user_5, .user_7, .user_9, .user_11, .user_13, .user_15, .user_17, .user_19, .user_21, .user_23, .user_25, .user_27, .user_29, .user_31, .user_33, .user_35, .user_37, .user_39, .user_41, .user_43, .user_45, .user_47, .user_49, .user_51, .user_53, .user_55, .user_57, .user_59, .user_61, .user_63, .user_65, .user_67, .user_69, .user_71, .user_73, .user_75, .user_77, .user_79, .user_81, .user_83, .user_85, .user_87, .user_89, .user_91, .user_93, .user_95, .user_97, .user_99, .user_101, .user_103, .user_105, .user_107, .user_109, .user_111, .user_113, .user_115, .user_117, .user_119, .user_121, .user_123, .user_125, .user_127, .user_129, .user_131, .user_133, .user_135, .user_137, .user_139, .user_141, .user_143, .user_145, .user_147, .user_149{
  672. background:{color:Accent};
  673. padding:5px;
  674. color:{color:Accent text};}
  675.  
  676. .user_2, .user_4, .user_6, .user_8, .user_10, .user_12, .user_14, .user_16, .user_18, .user_20, .user_22, .user_24, .user_26, .user_28, .user_30, .user_32, .user_34, .user_36, .user_38, .user_40, .user_42, .user_44, .user_46, .user_48, .user_50, .user_52, .user_54, .user_56, .user_58, .user_60, .user_62, .user_64, .user_66, .user_68, .user_70, .user_72, .user_74, .user_76, .user_78, .user_80, .user_82, .user_84, .user_86, .user_88, .user_90, .user_92, .user_94, .user_96, .user_98, .user_100, .user_102, .user_104, .user_106, .user_108, .user_110, .user_112, .user_114, .user_116, .user_118, .user_120, .user_122, .user_124, .user_126, .user_128, .user_130, .user_132, .user_134, .user_136, .user_138, .user_140, .user_142, .user_144, .user_146, .user_148, .user_150{
  677. background:rgba({RGBcolor:Accent}, 0.8);
  678. padding:5px;
  679. color:{color:Accent text};}
  680.  
  681.  
  682. li{position:relative;display:block;}
  683. li:before{content:'―';font-size:10px;position:absolute;left:-15px;color:{color:borders};top:0px;}
  684.  
  685.  
  686. /*permalink notes*/
  687.  
  688. .caption{
  689. margin-top:10px;
  690. }
  691.  
  692. .inf{
  693. border-top:1px solid {color:Accent};
  694. display:block;
  695. margin-top:10px;
  696. font-style:italic;
  697. padding-top:10px;
  698. padding-bottom:10px;
  699. margin-bottom:10px;
  700. line-height:17px;
  701. }
  702.  
  703. .tg{display:block;}
  704. .tg a:after{content:',';}
  705. .tg a:last-of-type:after {content:'.';}
  706. .inf a, .tg a{color:{color:Accent text};}
  707. .inf a:hover, .nt a:hover, .tg a:hover{color:{color:text};}
  708. .nt a{color:{color:Accent};}
  709.  
  710. .nt{
  711. padding:0px;
  712. font-style:italic;
  713. margin-top:0px;
  714. display:none;
  715. color:{color:text};
  716. }
  717.  
  718. ol.notes{padding:0px;margin:0px;list-style-type:none;}
  719. ol.notes li.note{padding:8px;text-align:left;border-top:1px solid {color:Accent};}
  720. ol.notes li.note img.avatar {border-radius:100%;float:right;}
  721. ol.notes li.note blockquote a {text-decoration:none;}
  722. li.more_notes_link_container {text-transform: uppercase;font-size:1em;line-height:150%;letter-spacing:1px;}
  723. li.more_notes_link_container:hover{letter-spacing:4px;}
  724. img:not(.lightbox-image) {max-width:100%;height:auto;}
  725.  
  726. #infscr-loading { display:none!important; }
  727.  
  728.  
  729.  
  730. #left{
  731. position:fixed;
  732. top:0px;
  733. left:0px;
  734. width:20px;
  735. height:100%;
  736. background:{color:Accent};
  737. z-index:999999;
  738. }
  739.  
  740. #top{
  741. position:fixed;
  742. top:0px;
  743. left:0px;
  744. width:100%;
  745. height:20px;
  746. background:{color:Accent};
  747. z-index:999999;
  748. }
  749.  
  750. #sidebar{
  751. position:fixed;
  752. top:140px;
  753. margin-left:calc(100px - 340px);
  754. width:175px;
  755. background:{color:Accent};
  756. z-index:999;
  757. }
  758.  
  759.  
  760. #sidebar img{
  761. width:175px;
  762. }
  763.  
  764.  
  765. .blogtitle{
  766. position:absolute;
  767. margin-top:-25px;
  768. font-family:roboto;
  769. font-size:16px;
  770. font-weight:300;
  771. width:175px;
  772. text-align:center;
  773. font-style:normal;
  774. color:{color:Accent};
  775. text-transform:uppercase;
  776. letter-spacing:2px;
  777. line-height:20px;
  778. z-index:999999999999999;
  779. }
  780.  
  781.  
  782. .desc{
  783. position:absolute;
  784. margin-top:30px;
  785. margin-left:-20px;
  786. font-style:italic;
  787. width:175px;
  788. opacity:0;
  789. visibility:hidden;
  790. -webkit-transition: all 0.3s ease;
  791. -moz-transition: all 0.3s ease;
  792. -o-transition: all 0.3s ease;
  793. transition: all 0.3s ease;
  794. }
  795.  
  796. #sidebar:hover .desc{
  797. opacity:1;
  798. margin-left:0px;
  799. visibility:visible;
  800. }
  801.  
  802. .desc a{
  803. color:{color:description text};
  804. }
  805.  
  806. .nav{
  807. line-height:10px;
  808. margin-top:-4px;
  809. overflow:hidden;
  810. }
  811.  
  812. .nav a{
  813. display:inline-block;
  814. padding:9px;
  815. width:17px;
  816. height:10px;
  817. text-align:center;
  818. margin-left:-1px;
  819. margin-right:-1px;
  820. font-size:11px;
  821. color:{color:Accent text};
  822. -webkit-transition: all 0.5s ease;
  823. -moz-transition: all 0.5s ease;
  824. -o-transition: all 0.5s ease;
  825. transition: all 0.5s ease;
  826. }
  827.  
  828. .nav a:hover{
  829. color:{color:Navigation hover text};
  830. background:{color:Navigation hover};
  831. }
  832.  
  833.  
  834. </style>
  835. </head>
  836.  
  837. <body>
  838.  
  839. <div id="left"></div>
  840. <div id="top"></div>
  841.  
  842. <div class="center">
  843.  
  844. <div id="sidebar">
  845. <div class="blogtitle">{text:blogtitle}</div>
  846. <img src="{image:sidebar}">
  847. <div class="desc">
  848. {description}
  849. </div>
  850. <div class="nav">
  851. <a title="{text:Home Label}" href="/"><i class="fa fa-home"></i></a>
  852. <a title="{text:Ask Label}" href="/ask"><i class="fa fa-envelope"></i></a>
  853. <a title="{text:Extra link 1}" href="{text:Extra link 1 URL}"><i class="fa fa-tags"></i></a>
  854. <a title="{text:Extra link 2}" href="{text:Extra link 2 URL}"><i class="fa fa-user"></i></a>
  855. <a title="{text:Archive Label}" href="/archive"><i class="fa fa-calendar"></i></a>
  856. </div>
  857. </div>
  858.  
  859. <div id="posts">
  860. {block:Posts}
  861. <div class="entry">
  862.  
  863. {block:Text}
  864. {block:Title}<div class="title">{Title}</div>{/block:Title}
  865. <div class="back">{Body}</div>
  866. {block:IndexPage}
  867. <div class="ptext">
  868. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  869. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  870. {/block:IndexPage}
  871. {/block:Text}
  872.  
  873.  
  874. {block:Link}
  875. <div class="title">
  876. <a href="{URL}">{Name} <i class="fa fa-angle-right"></i></a></div>
  877. <div class="back">{block:Description}{Description}{/block:Description}
  878. </div>{block:IndexPage}
  879. <div class="ptext">
  880. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  881. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  882. {/block:IndexPage}
  883. {block:Link}
  884.  
  885.  
  886. {block:Photo}
  887. {block:IndexPage}
  888. <div id="move"><div class="perm1">
  889. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a>
  890. <div class="perma1"><a href="{ReblogURL}" target="_blank">reblog this</a></div>
  891. </div>
  892. <div class="perm2">
  893. <a href="{Permalink}" target="_blank"><i class="fa fa-calendar"></i></a>
  894. <div class="perma2">
  895. <a href="{Permalink}" target="_blank">{Month} {DayOfMonth}</a></div>
  896. </div>
  897. <div class="perm3">
  898. <a href="{Permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  899. <div class="perma3"><a href="{Permalink}" target="_blank">{NoteCountWithLabel}</a></div>
  900. </div>
  901. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></div>
  902. {/block:IndexPage}
  903. {block:PermalinkPage}
  904. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/>
  905. {/block:PermalinkPage}
  906. {/block:Photo}
  907.  
  908.  
  909. {block:Photoset}
  910. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  911. {block:IndexPage}
  912. <div class="ptext">
  913. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  914. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  915. {/block:IndexPage}
  916. {/block:Photoset}
  917.  
  918.  
  919. {block:Quote}
  920. <div class="quote">❝&nbsp;{quote}</div>
  921. <div class="cite">&mdash; {Source}</div>
  922. {block:IndexPage}
  923. <div class="ptext">
  924. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  925. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  926. {/block:IndexPage}
  927. {/block:Quote}
  928.  
  929. {block:Chat}
  930. <div class="chat">
  931. {block:Title}<span class="title">{Title}</span></span>{/block:Title}
  932. {block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<i>{Label}</i> {/block:Label}{Line}</div></div>{/block:Lines}
  933. </div>
  934. {block:IndexPage}
  935. <div class="ptext">
  936. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  937. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  938. {/block:IndexPage}
  939. {/block:Chat}
  940.  
  941. {block:Audio}
  942. <div id="audio">
  943. <div class="cover"><img src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>
  944. {block:AlbumArt}
  945. <div class="cover"><img src="{AlbumArtURL}"></div>
  946. {/block:AlbumArt}
  947. <div class="playbox">
  948. <div class="button">
  949. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
  950. <div class="info">
  951. <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}
  952. <div style="margin-top:10px;text-transform:uppercase;font-size:10px;letter-spacing:1px;color:{color:Accent text};font-family:{select:Font};">
  953. <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}</div>
  954. </div>
  955. </div>
  956. {block:IndexPage}
  957. <div class="ptext">
  958. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  959. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  960. {/block:IndexPage}
  961. {/block:Audio}
  962.  
  963.  
  964. {block:Video}
  965. <div class="video">{Video-500}</div>
  966. {block:IndexPage}
  967. <div class="ptext">
  968. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  969. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  970. {/block:IndexPage}
  971. {/block:Video}
  972.  
  973.  
  974. {block:Answer}
  975. <div class="as">{Asker} asked:</div>
  976. <div class="q">{Question}</div>
  977. <div class="qline"></div>
  978. <div class="a">{Answer}</div>
  979. {block:IndexPage}
  980. <div class="ptext">
  981. <a title="{timeago} with {notecountwithlabel}" href="{permalink}" target="_blank"><i class="fa fa-comments"></i></a>
  982. <a title="reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  983. {/block:IndexPage}
  984. {/block:Answer}
  985.  
  986. {block:ContentSource}<!-- {SourceURL}
  987. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  988. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  989. {/block:ContentSource}
  990.  
  991. <!-- {block:NoRebloggedFrom}
  992. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  993. {/block:NoRebloggedFrom} -->
  994.  
  995. {block:PermalinkPage}
  996. <div class="caption">{block:Caption}{Caption}{/block:Caption}</div>
  997. {block:Date}
  998. <div class="inf">
  999. <div style="padding:10px;color:{color:Accent text};background:{color:Accent};">Posted on {month} {dayofmonth}{dayofmonthsuffix} at {12hour}:{minutes}{ampm} <br>
  1000. {block:RebloggedFrom}
  1001. source: <a href="{ReblogRootURL}">{ReblogRootName}</a> <br> via: <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  1002. {/block:RebloggedFrom}
  1003. <div class="tg">
  1004. {block:HasTags}
  1005. tags: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;
  1006. {/block:Tags}{/block:HasTags}
  1007. </div>
  1008. <div class="show">
  1009. <a title="show notes">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</a></div></div>
  1010. <div class="nt">
  1011. {block:PostNotes}
  1012. {PostNotes}
  1013. {/block:PostNotes}
  1014. {/block:Date}
  1015. </div>
  1016. {/block:PermalinkPage}
  1017. </div>
  1018. {/block:Date}
  1019. {/block:Posts}
  1020. </div>
  1021.  
  1022.  
  1023. <div class="pagination">
  1024. {block:Pagination}
  1025. {block:PreviousPage}
  1026. <a href="{PreviousPage}"></a>
  1027. {/block:PreviousPage}
  1028.  
  1029. {block:NextPage}
  1030. <a href="{NextPage}" class="next"></a>
  1031. {/block:NextPage}
  1032. {/block:Pagination}</div></div>
  1033.  
  1034. <!--Like seriously guys, DON'T TOUCH any of this scripts unless you know what it does or you will ruin your whole theme--->
  1035. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
  1036. <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  1037. <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700|Source+Sans+Pro:400,700|Hind:400,700|Dancing+Script:400,700|Open+Sans:400,700|Muli|Kurale|PT+Serif:400,700|Old+Standard+TT:400,700|Roboto:400,700|Roboto+Condensed:400,700|Lato:400,700|Raleway:400,700,300|Montez|Karla:400,700|Quicksand:400,700|Petit+Formal+Script|Clicker+Script|Mako|Maven+Pro:400,700' rel='stylesheet' type='text/css'>
  1038. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
  1039. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1040. <script src ="http://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1041. <link rel="stylesheet" href="http://static.tumblr.com/8pnyeus/29To2og0o/styles.css">
  1042. <script src="http://static.tumblr.com/8pnyeus/nfIo2oh8w/l-script.js" type="text/javascript"></script>
  1043. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1044. {block:IndexPage}
  1045. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1046. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1047. {/block:IndexPage}
  1048. <script>
  1049. $(document).ready(function(){
  1050. $(".show").click(function(){
  1051. $(".nt").slideToggle("slow");
  1052. });
  1053. });
  1054.  
  1055. $(document).ready(function(){
  1056. $('.photo-slideshow').pxuPhotoset({
  1057. lightbox: true,
  1058. rounded: false,
  1059. gutter: '6px',
  1060. photoset: '.photo-slideshow',
  1061. photoWrap: '.photo-data',
  1062. photo: '.pxu-photo'
  1063. });
  1064. {block:IndexPage}
  1065. var $container = $('#posts');
  1066. $container.masonry({ itemSelector: '.entry' });
  1067. $container.imagesLoaded(function(){
  1068. $container.masonry();
  1069. $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
  1070. });
  1071. $container.infinitescroll({
  1072. itemSelector: '.entry',
  1073. navSelector: '.pagination',
  1074. nextSelector: '.next',
  1075. loadingImg: '',
  1076. loadingText: '<em></em>',
  1077. bufferPx: 2000
  1078. },
  1079. function( newElements ) {
  1080. var $newElems = $( newElements );
  1081. $newElems.find('.photo-slideshow').pxuPhotoset({
  1082. lightbox: true,
  1083. rounded: false,
  1084. gutter: '6px',
  1085. photoset: '.photo-slideshow',
  1086. photoWrap: '.photo-data',
  1087. photo: '.pxu-photo'
  1088. },
  1089.  
  1090. function(){
  1091. resizeVideos(); },
  1092.  
  1093. function(){
  1094. $container.masonry();
  1095. });
  1096. $newElems.imagesLoaded(function(){
  1097. $container.masonry( 'appended', $newElems );
  1098. $newElems.animate({ opacity: 1, zIndex: 1 });
  1099. });
  1100. });
  1101. {/block:IndexPage}
  1102. });
  1103. </script>
  1104. </body>
  1105. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
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!