API tools faq
paste
emmzzmeow

021 : chic

emmzzmeow
Oct 10th, 2021 (edited)
890
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.80 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <!--
  4.  
  5. chic .
  6.  
  7.  
  8.  
  9. ' A TUMBLR THEME . . . by gordonramsei ,
  10.  
  11.  
  12.  
  13. * USER NOTES !
  14.  
  15. - title is best with one word . if it's long
  16. u can adjust the size , i've created a drop -
  17. down menu that will change the title size .
  18.  
  19.  
  20.  
  21.  
  22. ' IMG SIZE :
  23. UPDATE ICON : 50x50
  24.  
  25.  
  26. NOTE : it DON'T resize , use exact
  27. dimensions unless u want it to look
  28. ugly .
  29.  
  30.  
  31. ' FULL RULES & REGULATIONS . . .
  32.  
  33. 001 . this theme is 100% free . ur literally getting
  34. free content so PLEASE support me by liking and
  35. reblogging this . it makes all the difference .
  36. i also have a ko - fi if u feel like tipping me
  37. for my work .
  38. 002 . u MAY edit this theme to ur heart's content but
  39. u may NOT remove the credit . go ahead and make
  40. it fit ur aesthetic if u please but if i see that
  41. u have removed it entirely , imma pray that u
  42. stub ur toe so hard . for real . don't combine
  43. my codes with anyone else's , either .
  44. 003 . this is NOT a base code . don't treat it as one .
  45. 004 . taking my fonts that i have uploaded myself is
  46. stealing and i will call u out on that shit .
  47. 005 . my preview graphics aren't for u to steal !
  48. don't be that person .
  49.  
  50. ' FULL CREDITS . . .
  51.  
  52. 001 . TABS SCRIPT / FILTER : coded by gordonramsei
  53. 002 . ICONS : cappuccicons icons by suiomi , fontawesome
  54. 003 . ANIMATIONS : by animista ( see full credit below )
  55. 005 . IMESSAGE CHAT STYLE BASE : by animalites
  56. 006 . PINNED POST INSPIRED BY : valcntines
  57.  
  58.  
  59. ' FONTS USED . . .
  60.  
  61. 001 . BODY FONT : saira
  62. 002 . TITLE FONT : drawpen
  63.  
  64.  
  65. πš–πš’πšœπšœ 𝚞 πš–πšŠπš•πšŒπš˜πš– . . .
  66.  
  67.  
  68. /* ----------------------------------------------
  69. * Generated by Animista on 2021-3-4 16:41:54
  70. * Licensed under FreeBSD License.
  71. * See http://animista.net/license for more info.
  72. * w: http://animista.net, t: @cssanimista
  73. * ---------------------------------------------- */
  74. -->
  75. <html>
  76.  
  77. <head>
  78.  
  79.  
  80. <title>{Title}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description}
  81.  
  82. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  83.  
  84.  
  85.  
  86. <!-- colors -->
  87.  
  88. <meta name="color:background" content="#000000"/>
  89. <meta name="color:text" content="#ffffff"/>
  90. <meta name="color:title" content="#7f9494"/>
  91. <meta name="color:links" content="#baae9e"/>
  92. <meta name="color:link hover" content="#ae6b55"/>
  93. <meta name="color:posts" content="#0e0d0d"/>
  94. <meta name="color:accent" content="#4d544b"/>
  95. <meta name="color:bold" content="#ae6b55"/>
  96. <meta name="color:italic" content="#baae9e"/>
  97.  
  98.  
  99. <!-- images -->
  100.  
  101. <meta name="image:background" content=""/>
  102. <meta name="image:update img" content="https://via.placeholder.com/50"/>
  103.  
  104.  
  105.  
  106. <!-- text -->
  107.  
  108. <meta name="text:title" content="ur title">
  109. <meta name="select:title size" content="260" title="normal" />
  110. <meta name="select:title size" content="200" title="medium" />
  111. <meta name="select:title size" content="150" title="small" />
  112. <meta name="text:update bar title" content="welcome .">
  113. <meta name="text:update blurb" content="about u blurb here , it will scroll . about u blurb here , it will scroll . about u blurb here , it will scroll . about u blurb here , it will scroll . about u blurb here , it will scroll .">
  114.  
  115.  
  116. <!-- links -->
  117.  
  118. <meta name="text:free link title" content="free link title">
  119. <meta name="text:free link url" content="/">
  120. <meta name="text:link 1" content="link title">
  121. <meta name="text:link 1 url" content="/">
  122. <meta name="text:link 2" content="link title">
  123. <meta name="text:link 2 url" content="/">
  124. <meta name="text:link 3" content="link title">
  125. <meta name="text:link 3 url" content="/">
  126. <meta name="text:link 4" content="link title">
  127. <meta name="text:link 4 url" content="/">
  128. <meta name="text:link 5" content="link title">
  129. <meta name="text:link 5 url" content="/">
  130. <meta name="text:link 6" content="link title">
  131. <meta name="text:link 6 url" content="/">
  132.  
  133.  
  134. <!-- various scripts : ie , suiomi icons and tooltip u will also place ur links to any google fonts here -->
  135.  
  136. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"> </script>
  137.  
  138. <script src="https://kit.fontawesome.com/12b100d5e1.js" crossorigin="anonymous"></script>
  139.  
  140. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  141.  
  142. <link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet">
  143.  
  144. <link rel="preconnect" href="https://fonts.gstatic.com">
  145. <link href="https://fonts.googleapis.com/css2?family=Saira&display=swap" rel="stylesheet">
  146.  
  147. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  148.  
  149. <script src="//pull.cappuccicons.com/cpf.js"></script>
  150.  
  151.  
  152.  
  153. <!-- tooltip script , keep here -->
  154.  
  155. <script>
  156. (function($){
  157. $(document).ready(function() {
  158. $("a[title]").style_my_tooltips({
  159. tip_follows_cursor:false,
  160. tip_delay_time:90,
  161. tip_fade_speed:600,
  162. attribute:"title"
  163. });
  164. });
  165. })(jQuery);
  166. </script>
  167.  
  168. <!-- popup by themekid -->
  169.  
  170. <script type="text/javascript" src="https://static.tumblr.com/8pnyeus/10hors8sn/themekid-popup.min.js"></script>
  171. <script type="text/javascript">
  172. $(document).ready(function(){
  173. popUp(true);
  174. });
  175. </script>
  176.  
  177.  
  178. <style type="text/css">
  179.  
  180. /* custom fonts */
  181.  
  182. @font-face { font-family:drawpen; src:url('https://dl.dropbox.com/s/4n384yb5jnw443t/Drawpen.ttf?dl=0') }
  183.  
  184.  
  185. @-ms-viewport{
  186. width: device-width;
  187. }
  188.  
  189. /* tooltip styling + scroll bar */
  190.  
  191. #s-m-t-tooltip {
  192. max-width:250px;
  193. height:auto;
  194. z-index:999999999999999999999999999999999999999999999999999999999;
  195. padding:5px;
  196. border-radius:5px;
  197. margin-left:15px;
  198. margin-bottom:20px;
  199. font-size:9px;
  200. letter-spacing:3px;
  201. line-height:12px;
  202. background-color:{color:posts};
  203. background-image:url('{image:background}');
  204. text-transform:lowercase;
  205. font-style:italic;
  206. color:{color:text};
  207. border-bottom:1px solid {color:italic};
  208. box-shadow: 1px 16px 15px -15px {color:italic};
  209.  
  210.  
  211. }
  212.  
  213.  
  214. ::-webkit-scrollbar {
  215. display: none;
  216. }
  217.  
  218.  
  219. ::selection {
  220. background-color: {color:accent};
  221. color: {color:text};
  222. }
  223.  
  224.  
  225. /* body + font styles */
  226.  
  227.  
  228.  
  229. body {
  230. background:{color:background};
  231. color:{color:text};
  232. font-family: 'Saira', sans-serif;
  233. font-size:10.5px;
  234. line-height:14px;
  235. letter-spacing:1.5px;
  236. background-image:url('{image:background}');
  237. background-size:repeat; /* change repeat to cover if you have a full img for ur background */
  238. overflow:hidden;
  239. text-align:justify;
  240. margin:0px;
  241. }
  242.  
  243. a {
  244. text-shadow:none;
  245. text-decoration:none;
  246. color:{color:links};
  247. -webkit-transition: all 0.8s ease-in-out;
  248. -moz-transition: all 0.8s ease-in-out;
  249. -o-transition: all 0.8s ease-in-out;
  250. -ms-transition: all 0.8s ease-in-out;
  251. transition: all 0.8s ease-in-out;
  252.  
  253. }
  254.  
  255. a:hover {
  256. color:{color:link hover};
  257. text-shadow: 0px 0px 2px {color:link hover};
  258. -webkit-transition: all 0.8s ease-in-out;
  259. -moz-transition: all 0.8s ease-in-out;
  260. -o-transition: all 0.8s ease-in-out;
  261. -ms-transition: all 0.8s ease-in-out;
  262. transition: all 0.8s ease-in-out;
  263. }
  264.  
  265. blockquote {
  266. border-left:1px solid {color:italic};
  267. margin-left:5px;
  268. padding-left:10px;
  269. width:92.5%;
  270. }
  271.  
  272. blockquote blockquote {
  273. border-left:1px solid {color:italic};
  274. margin-left:5px;
  275.  
  276.  
  277. }
  278.  
  279. small {
  280. font-size:10.5px;
  281.  
  282. }
  283.  
  284. sub, sup {
  285. font-size:10px;
  286.  
  287. }
  288.  
  289. b, strong {
  290. letter-spacing:2px;
  291. font-weight:600;
  292. font-size:14.5px;
  293. color:{color:bold};
  294. text-transform:lowercase;
  295. text-shadow: 0px 0px 2px {color:bold};
  296. font-family: 'Saira', sans-serif;
  297.  
  298.  
  299. }
  300.  
  301. i, em {
  302. color:{color:italic};
  303. text-shadow: 0px 0px 3px {color:italic};
  304. font-size:11px;
  305. letter-spacing:2px;
  306. font-weight:400;
  307. text-transform:lowercase;
  308.  
  309. }
  310.  
  311.  
  312. h3 {
  313. font-size:35px;
  314. text-align:left;
  315. color:{color:title};
  316. text-shadow: 0px 0px 3px {color:title};
  317. line-height:25px;
  318. letter-spacing:2px;
  319. line-height:35px;
  320.  
  321.  
  322. }
  323.  
  324.  
  325. h1, h2 {
  326. text-align:center;
  327. font-size:55px;
  328. letter-spacing:2px;
  329. color:{color:italic};
  330. text-shadow: 0px 0px 3px {color:italic};
  331. font-style:italic;
  332. line-height:50px;
  333. font-weight:500;
  334. padding:14px;
  335. }
  336.  
  337.  
  338. big {
  339. font-size:16.5px;
  340. color:{color:title};
  341. text-shadow: 0px 0px 6px {color:title};
  342.  
  343. }
  344.  
  345. /* container + extras */
  346.  
  347. #container {
  348. position:fixed;
  349. width:750px ;
  350. height:500px ;
  351. background-color:transparent;
  352. left:50%;
  353. margin-left:-350px;
  354. top:47%;
  355. margin-top:-200px ;
  356. border-radius:10px;
  357. z-index:999;
  358. overflow:visible;
  359. z-index:-99999999999999999999999999999999999;
  360. }
  361.  
  362. .leftbar {
  363. position:absolute;
  364. background-color:{color:posts};
  365. border-radius:10px;
  366. width:200px;
  367. height:90px;
  368. padding:10px;
  369. left:10px;
  370. top:10px;
  371. opacity:.3;
  372. filter: grayscale(1);
  373. -webkit-transition: all 0.8s ease-in-out;
  374. -moz-transition: all 0.8s ease-in-out;
  375. -o-transition: all 0.8s ease-in-out;
  376. -ms-transition: all 0.8s ease-in-out;
  377. transition: all 0.8s ease-in-out;
  378. }
  379.  
  380.  
  381. .leftbar:hover {
  382. -webkit-transition: all 0.8s ease-in-out;
  383. -moz-transition: all 0.8s ease-in-out;
  384. -o-transition: all 0.8s ease-in-out;
  385. -ms-transition: all 0.8s ease-in-out;
  386. transition: all 0.8s ease-in-out;
  387. filter: grayscale(0);
  388. opacity:1;
  389. }
  390.  
  391.  
  392. .leftbarimg {
  393. position:absolute;
  394. background-image:url('{image:update img}');
  395. width:50px;
  396. height:50px;
  397. left:20px;
  398. top:36px;
  399. border-radius:100%;
  400. box-shadow: 1px 16px 15px -18px {color:accent};
  401.  
  402.  
  403. }
  404.  
  405.  
  406. .leftbartitle {
  407. color:{color:bold};
  408. text-shadow: 0px 0px 6px {color:bold};
  409. font-size:14px;
  410. padding:5px;
  411. text-align:Center;
  412. letter-spacing:2px;
  413. font-weight:600;
  414. text-transform:lowercase;
  415.  
  416. }
  417.  
  418.  
  419. .leftbarblurb {
  420. position:absolute;
  421. width:100px;
  422. height:45px;
  423. left:100px;
  424. top:40px;
  425. overflow:scroll;
  426. line-height:11px;
  427. font-size:9px;
  428. }
  429.  
  430.  
  431. .leftbarblurb i {
  432. font-size:9px;
  433. text-shadow:0px 0px 3px;
  434.  
  435. }
  436.  
  437.  
  438. .leftbarblurb b {
  439. font-size:11px;
  440. text-decoration: underline solid {color:accent};
  441. text-shadow:0px 0px 2px;
  442. }
  443.  
  444.  
  445.  
  446. /* posts styling */
  447.  
  448.  
  449. .postholder {
  450. position:absolute;
  451. z-index:-9999999999999999999999999999999999999;
  452. width:450px;
  453. height:525px;
  454. top:-20px;
  455. padding:15px;
  456. overflow:auto;
  457. overflow-x:hidden;
  458. margin-top:-10px;
  459. border-radius:10px;
  460. opacity:.7;
  461. left:375px;
  462. -webkit-transition: all 0.8s ease-in-out;
  463. -moz-transition: all 0.8s ease-in-out;
  464. -o-transition: all 0.8s ease-in-out;
  465. -ms-transition: all 0.8s ease-in-out;
  466. transition: all 0.8s ease-in-out;
  467.  
  468. }
  469.  
  470. .postholder:hover {
  471. opacity:1;
  472. -webkit-transition: all 0.8s ease-in-out;
  473. -moz-transition: all 0.8s ease-in-out;
  474. -o-transition: all 0.8s ease-in-out;
  475. -ms-transition: all 0.8s ease-in-out;
  476. transition: all 0.8s ease-in-out;
  477. }
  478.  
  479.  
  480. .posts {
  481. position:relative;
  482. z-index:9999999999999999999999999999999999999999999999;
  483. background-color:{color:posts};
  484. width:400px;
  485. border-radius:10px;
  486. padding:15px;
  487. padding-bottom:15px;
  488. overflow-x:none;
  489. overflow-y:none;
  490. -webkit-animation: slide-in-bottom 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  491. animation: slide-in-bottom 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  492. }
  493.  
  494. @-webkit-keyframes slide-in-bottom {
  495. 0% {
  496. -webkit-transform: translateY(1000px);
  497. transform: translateY(1000px);
  498. opacity: 0;
  499. }
  500. 100% {
  501. -webkit-transform: translateY(0);
  502. transform: translateY(0);
  503. opacity: 1;
  504. }
  505. }
  506. @keyframes slide-in-bottom {
  507. 0% {
  508. -webkit-transform: translateY(1000px);
  509. transform: translateY(1000px);
  510. opacity: 0;
  511. }
  512. 100% {
  513. -webkit-transform: translateY(0);
  514. transform: translateY(0);
  515. opacity: 1;
  516. }
  517. }
  518.  
  519.  
  520.  
  521. .tags {
  522. text-align:justify;
  523. font-size:9px;
  524. text-transform:lowercase;
  525. color:{color:text};
  526. margin-top:15px;
  527. width:425px;
  528. -webkit-animation: slide-in-bottom 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  529. animation: slide-in-bottom 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  530. }
  531.  
  532. @-webkit-keyframes slide-in-bottom {
  533. 0% {
  534. -webkit-transform: translateY(1000px);
  535. transform: translateY(1000px);
  536. opacity: 0;
  537. }
  538. 100% {
  539. -webkit-transform: translateY(0);
  540. transform: translateY(0);
  541. opacity: 1;
  542. }
  543. }
  544. @keyframes slide-in-bottom {
  545. 0% {
  546. -webkit-transform: translateY(1000px);
  547. transform: translateY(1000px);
  548. opacity: 0;
  549. }
  550. 100% {
  551. -webkit-transform: translateY(0);
  552. transform: translateY(0);
  553. opacity: 1;
  554. }
  555. }
  556.  
  557.  
  558. .tags a:hover {
  559. -webkit-transition: all 0.8s ease-in-out;
  560. -moz-transition: all 0.8s ease-in-out;
  561. -o-transition: all 0.8s ease-in-out;
  562. -ms-transition: all 0.8s ease-in-out;
  563. transition: all 0.8s ease-in-out;
  564. text-shadow: -4px 0 5px {color:links};
  565. color:{color:links};
  566. }
  567.  
  568.  
  569.  
  570. .tags b {
  571. font-size:10px;
  572.  
  573. }
  574.  
  575.  
  576. .permalink {
  577. text-transform:uppercase;
  578. width:100.5%;
  579. padding:15px;
  580. font-size:9.5px;
  581. background-color:{color:accent};
  582. height:100%;
  583. padding:15px;
  584. margin-left:-16px;
  585. margin-top:-16px;
  586. border-top-right-radius:5px;
  587. border-top-left-radius:5px;
  588. -webkit-transition: all 0.8s ease-in-out;
  589. -moz-transition: all 0.8s ease-in-out;
  590. -o-transition: all 0.8s ease-in-out;
  591. -ms-transition: all 0.8s ease-in-out;
  592. transition: all 0.8s ease-in-out;
  593. }
  594.  
  595.  
  596. .permalink a:hover {
  597. text-shadow: 0px 0px 6px {color:italic};
  598. -webkit-transition: all 0.8s ease-in-out;
  599. -moz-transition: all 0.8s ease-in-out;
  600. -o-transition: all 0.8s ease-in-out;
  601. -ms-transition: all 0.8s ease-in-out;
  602. transition: all 0.8s ease-in-out;
  603. }
  604.  
  605.  
  606. .pinnedposts {
  607. text-transform:uppercase;
  608. position:absolute;
  609. left:325px;
  610. top:8px;
  611. font-size:9.5px;
  612. letter-spacing:1px;
  613. font-style:italic;
  614. z-index:99999999999999999999999999999999999999999999999;
  615. padding:6px;
  616.  
  617. }
  618.  
  619.  
  620. .pinnedposts b {
  621. color:{color:text};
  622. }
  623.  
  624.  
  625.  
  626. #pagination a {
  627. position:relative;
  628. z-index:999999999999999999999999999999999999999999;
  629. padding:5px;
  630. border-radius:5px;
  631. font-size:12px;
  632. text-align:center;
  633. top:450px;
  634. left:275px;
  635. color:{color:title};
  636. font-style:italic;
  637. letter-spacing:3px;
  638. text-transform:lowercase;
  639.  
  640. }
  641.  
  642.  
  643. #pagination a:hover {
  644. color:{color:bold};
  645. letter-spacing:4px;
  646. text-shadow: none;
  647. -webkit-transition: all 0.8s ease-in-out;
  648. -moz-transition: all 0.8s ease-in-out;
  649. -o-transition: all 0.8s ease-in-out;
  650. -ms-transition: all 0.8s ease-in-out;
  651. transition: all 0.8s ease-in-out;
  652.  
  653. }
  654.  
  655. iframe {
  656. max-width:400px;
  657. opacity:.6;
  658. filter: grayscale(1);
  659. z-index:9999999999999999999999999999999999999999;
  660. -webkit-transition: all 0.8s ease-in-out;
  661. -moz-transition: all 0.8s ease-in-out;
  662. -o-transition: all 0.8s ease-in-out;
  663. -ms-transition: all 0.8s ease-in-out;
  664. transition: all 0.8s ease-in-out;
  665.  
  666. }
  667.  
  668. iframe:hover {
  669. max-width:400px;
  670. opacity:1;
  671. filter: grayscale(0);
  672. z-index:9999999999999999999999999999999999999999;
  673. -webkit-transition: all 0.8s ease-in-out;
  674. -moz-transition: all 0.8s ease-in-out;
  675. -o-transition: all 0.8s ease-in-out;
  676. -ms-transition: all 0.8s ease-in-out;
  677. transition: all 0.8s ease-in-out;
  678.  
  679. }
  680.  
  681.  
  682. .iframe-controls--desktop {
  683. transition: none;
  684. }
  685.  
  686.  
  687. .posts img {
  688. max-width:400px;
  689. padding:none;
  690. border-radius:10px;
  691. opacity:.6;
  692. filter: grayscale(1);
  693. height:auto;
  694. -webkit-transition: all 0.8s ease-in-out;
  695. -moz-transition: all 0.8s ease-in-out;
  696. -o-transition: all 0.8s ease-in-out;
  697. -ms-transition: all 0.8s ease-in-out;
  698. transition: all 0.8s ease-in-out;
  699.  
  700. }
  701.  
  702. .posts img:hover {
  703. max-width:400px;
  704. height:auto;
  705. opacity:1;
  706. filter: grayscale(0);
  707. -webkit-transition: all 0.8s ease-in-out;
  708. -moz-transition: all 0.8s ease-in-out;
  709. -o-transition: all 0.8s ease-in-out;
  710. -ms-transition: all 0.8s ease-in-out;
  711. transition: all 0.8s ease-in-out;
  712.  
  713. }
  714.  
  715.  
  716. li{
  717. list-style-type: none;
  718. margin-left:-35px;
  719. padding:5px;
  720.  
  721. }
  722.  
  723. li:before {
  724. content:'ΛšΛ–β‹†';
  725. margin-right:20px;
  726. font-size:15px;
  727. color:{color:title};
  728. text-shadow: 0px 0px 6px {color:title};
  729. }
  730.  
  731.  
  732. ul {
  733. list-style-type: none;
  734.  
  735. }
  736.  
  737. .readmore {
  738. position:absolute;
  739. left:40%;
  740. color:{color:text};
  741. text-transform:lowercase;
  742. font-size:12px;
  743. letter-spacing:3px;
  744. font-style:italic;
  745.  
  746. }
  747.  
  748. .readmore a {
  749. color:{color:text};
  750. -webkit-transition: all 0.8s ease-in-out;
  751. -moz-transition: all 0.8s ease-in-out;
  752. -o-transition: all 0.8s ease-in-out;
  753. -ms-transition: all 0.8s ease-in-out;
  754. transition: all 0.8s ease-in-out;
  755. }
  756.  
  757.  
  758.  
  759. .readmore a:hover {
  760. text-shadow: 0px 0 5px {color:text};
  761. -webkit-transition: all 0.8s ease-in-out;
  762. -moz-transition: all 0.8s ease-in-out;
  763. -o-transition: all 0.8s ease-in-out;
  764. -ms-transition: all 0.8s ease-in-out;
  765. transition: all 0.8s ease-in-out;
  766. }
  767.  
  768.  
  769.  
  770. /* title + description styling */
  771.  
  772. #sidebar {
  773. position:absolute;
  774. margin-top:255px;
  775. left:-265px;
  776. width:350px;
  777. height:300px;
  778. }
  779.  
  780.  
  781.  
  782.  
  783. .title {
  784. width:335px;
  785. font-size:{select:title size}px;
  786. color:{color:title};
  787. height:auto;
  788. font-family:drawpen;
  789. position:absolute;
  790. line-height:55px;
  791. text-shadow: 0px 0px 8px {color:title};
  792. word-break: break-all;
  793. z-index:999999999999999999999999999999999999999999999;
  794. font-weight:500;
  795. letter-spacing:2px;
  796. font-style:italic;
  797. text-align:Center;
  798.  
  799. }
  800.  
  801.  
  802.  
  803.  
  804.  
  805. /* tabs styling by emily , keep this credit intact ! */
  806.  
  807.  
  808. /* tabs styling */
  809.  
  810.  
  811. .tab {
  812. overflow: visible;
  813. background-color: {color:posts};
  814. z-index:999999999999999999999999999999999999999999;
  815. position:absolute;
  816. width:auto;
  817. height:auto;
  818. margin-top:455px;
  819. left:-190px;
  820. border-radius:10px;
  821. border-bottom:1px solid {color:accent};
  822. padding:20px;
  823. box-shadow: 1px 16px 15px -15px {color:accent};
  824. -webkit-animation: fadeInOut ease 1s;
  825. -moz-animation: fadeInOut ease 1s;
  826. -o-animation: fadeInOut ease 1s;
  827. -ms-animation: fadeInOut ease 1s;
  828. animation: bounce 3.5s;
  829. animation-direction: alternate;
  830. animation-iteration-count: infinite;
  831. }
  832.  
  833. @keyframes bounce {
  834. 0% { transform: translateY(0); }
  835. 100% { transform: translateY(-50px); }
  836. }
  837.  
  838.  
  839. .tab:hover {
  840. -webkit-animation-play-state:paused;
  841. -moz-animation-play-state:paused;
  842. -o-animation-play-state:paused;
  843. animation-play-state:paused;
  844. }
  845.  
  846.  
  847. .tablink {
  848. font-size:10px;
  849. font-weight:bold;
  850. text-align:Center;
  851. cursor: pointer;
  852. font-weight:500;
  853. text-shadow: 0px 0px 6px {color:italic};
  854. transition: 0.5s;
  855. color:{color:italic};
  856. z-index:9999999999999999999999999999999999999;
  857.  
  858.  
  859. }
  860.  
  861.  
  862. .tablink:hover{
  863. color:{color:italic};
  864. text-shadow: 0px 0px 10px {color:italic};
  865. -webkit-animation: fadeInOut ease 1s;
  866. -moz-animation: fadeInOut ease 1s;
  867. -o-animation: fadeInOut ease 1s;
  868. -ms-animation: fadeInOut ease 1s;
  869.  
  870. }
  871.  
  872.  
  873. .tabcontent {
  874. z-index:99999999999999999999999999999999999999999999999999999999;
  875. height:480px;
  876. border-radius:10px;
  877. width:480px;
  878. overflow:hidden;
  879. display:none;
  880. padding:15px;
  881. position:absolute;
  882. top:40px;
  883. left:375px;
  884. background-color:transparent;
  885. -webkit-animation: fade-in 3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
  886. animation: fade-in 3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
  887. }
  888.  
  889. @-webkit-keyframes fade-in {
  890. 0% {
  891. opacity: 0;
  892. }
  893. 100% {
  894. opacity: 1;
  895. }
  896. }
  897. @keyframes fade-in {
  898. 0% {
  899. opacity: 0;
  900. }
  901. 100% {
  902. opacity: 1;
  903. }
  904. }
  905.  
  906.  
  907.  
  908.  
  909. .tabsclose {
  910. position:absolute;
  911. font-size:13px;
  912. cursor: pointer;
  913. z-index:99999999999999999999999999999999999999999;
  914. color:{color:bold};
  915. top:450px;
  916. text-align:Center;
  917. width:auto;
  918. left:200px;
  919. background-color:transparent;
  920. letter-spacing:3px;
  921.  
  922. }
  923.  
  924.  
  925. /* nav styling */
  926.  
  927.  
  928.  
  929.  
  930. .navlink {
  931. position:absolute;
  932. top:145px;
  933. width:450px;
  934. text-align:center;
  935. left:0px;
  936. font-size:35px;
  937. z-index:999999999999999;
  938.  
  939. }
  940.  
  941.  
  942. .navlink a {
  943. z-index:999999999999999;
  944. text-align:center;
  945. margin: 0 auto;
  946. color:{color:accent};
  947. text-shadow:0px 0px 6px {color:accent};
  948. font-weight:400;
  949. -webkit-transition: all 1.2s ease-in-out;
  950. -moz-transition: all 1.2s ease-in-out;
  951. -o-transition: all 1.2s ease-in-out;
  952. -ms-transition: all 1.2s ease-in-out;
  953. transition: all 1.2s ease-in-out;
  954. }
  955.  
  956.  
  957.  
  958. .navlink a:hover {
  959. -webkit-transition: all 1.2s ease-in-out;
  960. -moz-transition: all 1.2s ease-in-out;
  961. -o-transition: all 1.2s ease-in-out;
  962. -ms-transition: all 1.2s ease-in-out;
  963. transition: all 1.2s ease-in-out;
  964. color:{color:title};
  965. text-shadow: 0px 0 10px {color:title};
  966.  
  967.  
  968. }
  969.  
  970.  
  971. .navimg {
  972. position:absolute;
  973. width:90px;
  974. height:90px;
  975. background-image:url('{image:nav img}');
  976. opacity:.7;
  977. border-radius:100%;
  978. left:260px;
  979. border:1px solid {color:accent};
  980. top:290px;
  981. box-shadow: 1px 16px 15px -15px {color:accent};
  982.  
  983. }
  984.  
  985.  
  986. /* ask styling */
  987.  
  988. .askerbar {
  989. background-color:transparent;
  990. text-align:center;
  991. padding:8px;
  992. border-bottom-left-radius:5px;
  993. border-bottom-right-radius:5px;
  994.  
  995.  
  996. }
  997.  
  998. .topper {
  999. font-style:italic;
  1000. letter-spacing:3px;
  1001. font-size:8.5px;
  1002. color:{color:title};
  1003. text-shadow: 0px 0 2px {color:title};
  1004. }
  1005.  
  1006. .topper i {
  1007. text-shadow: 0px 0 5px {color:italic};
  1008. font-size:11px;
  1009.  
  1010. }
  1011.  
  1012. .asker {
  1013. letter-spacing: 1px;
  1014. font-size:25px;
  1015. font-style:italic;
  1016. z-index:999999999;
  1017. text-shadow: 0px 0px 2px {color:text};
  1018. line-height:24px;
  1019. text-align:Center;
  1020. vertical-align: middle;
  1021. text-transform:lowercase;
  1022.  
  1023. }
  1024.  
  1025. .asker a:hover {
  1026. text-shadow:none;
  1027. }
  1028.  
  1029.  
  1030. .asker b {
  1031. color:{color:italic};
  1032. text-transform:lowercase;
  1033. text-shadow:0px 0 5px {color:italic};
  1034.  
  1035. }
  1036.  
  1037. .asker i {
  1038. font-size:20px;
  1039.  
  1040. }
  1041.  
  1042.  
  1043. .qanswer {
  1044. margin-top:25px;
  1045. }
  1046.  
  1047. .question {
  1048. position: relative;
  1049. background:{color:posts};
  1050. border-radius:5px;
  1051. padding:10px;
  1052. font-size:9;
  1053. text-transform:lowercase;
  1054.  
  1055.  
  1056. }
  1057.  
  1058.  
  1059.  
  1060.  
  1061. /* quote styling */
  1062.  
  1063.  
  1064. #quote {
  1065. color:{color:text};
  1066. padding-top:20px;
  1067. padding-left:10px;
  1068. padding-right:20px;
  1069. font-size:15px;
  1070. line-height:33px;
  1071. text-align:center;
  1072. letter-spacing:1px;
  1073. font-style:italic;
  1074. text-shadow: 0px 0px 2px {color:text};
  1075.  
  1076. }
  1077.  
  1078. .source {
  1079. color:{color:bold};
  1080. margin-top:15px;
  1081. font-size:55px;
  1082. font-weight:500;
  1083. text-align:center;
  1084. letter-spacing:1px;
  1085. text-transform:lowercase;
  1086. padding-bottom:5px;
  1087. text-shadow: 0px 0px 3px {color:bold};
  1088. font-family:drawpen;
  1089.  
  1090.  
  1091. }
  1092.  
  1093.  
  1094.  
  1095. /* chat styling */
  1096.  
  1097.  
  1098. .answer span,.convo li {
  1099. margin:0 0 5px;
  1100. border-radius:1em;
  1101. padding:.5em 10px;
  1102. max-width:75%;
  1103. clear:both;
  1104. position:relative;
  1105.  
  1106.  
  1107. }
  1108.  
  1109. .convo li:before {
  1110. content:"";
  1111. }
  1112.  
  1113. .answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11 {
  1114. float:left;
  1115. background:{color:bold};
  1116. color:{color:text};
  1117. left:3px;
  1118.  
  1119. }
  1120.  
  1121. .me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after {
  1122. content:"";
  1123. position:absolute;
  1124. left:-.5em;
  1125. bottom:0;
  1126. width:.5em;
  1127. height:1em;
  1128. border-right:.5em solid {color:bold};
  1129. border-bottom-right-radius:1em .5em;
  1130.  
  1131. }
  1132.  
  1133. .answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12 {
  1134. right:3px;
  1135. float:right;
  1136. background-color:{color:bold};
  1137. color:{color:text};
  1138.  
  1139. }
  1140.  
  1141. .them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after {
  1142. content:"";
  1143. position:absolute;
  1144. right:-.5em;
  1145. bottom:0;
  1146. width:.5em;
  1147. height:1em;
  1148. border-left:.5em solid {color:bold};
  1149. border-bottom-left-radius:1em .5em;
  1150.  
  1151.  
  1152. }
  1153.  
  1154. .me p,.answer,.asked span {
  1155. padding:0;
  1156. margin:0;
  1157.  
  1158. }
  1159.  
  1160. .answer {
  1161. overflow:hidden;
  1162.  
  1163. }
  1164.  
  1165. .asked p {
  1166. text-align: left;
  1167. margin: 0 0px 10px 0px;
  1168. padding: 0;
  1169. color: {color:text};
  1170. font-size: 12px;
  1171. line-height: 0px;
  1172. }
  1173.  
  1174. .footerright .viasrc {
  1175. float: left;
  1176. }
  1177.  
  1178.  
  1179. .asked a {
  1180. margin:0;
  1181. padding:0;
  1182. }
  1183.  
  1184. .user_4 {
  1185. background-color:{color:bold};
  1186. color:{color:text};
  1187.  
  1188. }
  1189.  
  1190. .user_4::after {
  1191. border-color:{color:bold};
  1192.  
  1193. }
  1194.  
  1195. .user_6 {
  1196. background-color:{color:bold};
  1197. color:{color:text};
  1198.  
  1199. }
  1200.  
  1201. .user_6::after {
  1202. border-color:{color:bold};
  1203. }
  1204.  
  1205. .user_5 {
  1206. background-color:{color:bold};
  1207. color:{color:text};
  1208.  
  1209. }
  1210.  
  1211. .user_5::after {
  1212. border-color:{color:bold};
  1213.  
  1214. }
  1215.  
  1216. .user_3 {
  1217. background-color:{color:bold};
  1218. color:{color:text};
  1219.  
  1220. }
  1221.  
  1222. .user_3::after {
  1223. border-color:{color:bold};
  1224.  
  1225. }
  1226.  
  1227. .user_7 {
  1228. background-color:{color:bold};
  1229. color:{color:text};
  1230.  
  1231. }
  1232.  
  1233. .user_7::after {
  1234. border-color:{color:bold};
  1235.  
  1236. }
  1237.  
  1238. .user_8 {
  1239. background-color:{color:bold};
  1240. color:{color:text};
  1241.  
  1242. }
  1243.  
  1244. .user_8::after {
  1245. border-color:{color:bold};
  1246.  
  1247. }
  1248.  
  1249. .user_9 {
  1250. background-color:{color:bold};
  1251. color:{color:text};
  1252.  
  1253. }
  1254.  
  1255. .user_9::after {
  1256. border-color:{color:bold};
  1257.  
  1258. }
  1259.  
  1260. .convo {
  1261. overflow: hidden;
  1262. list-style-type: none;
  1263. padding: 0;
  1264. margin: 0;
  1265. }
  1266.  
  1267. .convo b, strong {
  1268. color:{color:text};
  1269. }
  1270.  
  1271.  
  1272. /* audio styling */
  1273.  
  1274. .play {
  1275. position:relative;
  1276. margin-top:-10px;
  1277. margin-left:140px;
  1278. z-index:9999999999999;
  1279. width:32px;
  1280. height:25px;
  1281. overflow:hidden;
  1282. opacity:1;
  1283. border-radius:5px;
  1284.  
  1285. }
  1286.  
  1287.  
  1288.  
  1289. .info {
  1290.  
  1291. color:{color:text};
  1292. position:relative;
  1293. height:auto;
  1294. display:block;
  1295. margin-left:15px;
  1296. background-color:transparent;
  1297. margin-top:40px;
  1298.  
  1299. }
  1300.  
  1301. .musicsymbol {
  1302. margin-left:10px;
  1303. font-size:80px;
  1304. margin-top:-55px;
  1305. color:{color:bold};
  1306. text-shadow: 0px 0px 3px {color:bold};
  1307.  
  1308. }
  1309.  
  1310. .details {
  1311. font-size:15px;
  1312. text-transform:lowercase;
  1313. margin-left:133px;
  1314. font-style:italic;
  1315. letter-spacing:3px;
  1316. margin-top:-115px;
  1317. text-shadow: 0px 0px 2px {color:text};
  1318.  
  1319. }
  1320.  
  1321.  
  1322.  
  1323. .artist {
  1324. font-family:drawpen;
  1325. font-size:65px;
  1326. margin-top:10px;
  1327. color:{color:title};
  1328. text-shadow: 0px 0px 3px {color:title};
  1329. }
  1330.  
  1331.  
  1332.  
  1333.  
  1334. /* credits ; DO NOT EDIT / REMOVE */
  1335.  
  1336. #credit a {
  1337. right:20px;
  1338. bottom:20px;
  1339. position:fixed;
  1340. color:{color:accent};
  1341. background-color:transparent;
  1342. text-shadow: 0px 0px 6px {color:accent};
  1343. padding:8px;
  1344. border-radius:10px;
  1345. font-size:16px;
  1346. -webkit-transition: all 1s ease-in-out;
  1347. -moz-transition: all 1s ease-in-out;
  1348. -o-transition: all 1s ease-in-out;
  1349. -ms-transition: all 1s ease-in-out;
  1350. transition: all 1s ease-in-out;
  1351.  
  1352.  
  1353. }
  1354.  
  1355. #credit a:hover {
  1356. text-shadow: 0px 0px 10px {color:title};
  1357. color:{color:title};
  1358. -webkit-transition: all 1s ease-in-out;
  1359. -moz-transition: all 1s ease-in-out;
  1360. -o-transition: all 1s ease-in-out;
  1361. -ms-transition: all 1s ease-in-out;
  1362. transition: all 1s ease-in-out;
  1363.  
  1364. }
  1365.  
  1366.  
  1367.  
  1368. </style>
  1369.  
  1370.  
  1371.  
  1372.  
  1373.  
  1374. </head>
  1375.  
  1376.  
  1377. <body>
  1378.  
  1379. <div class="leftbar">
  1380.  
  1381. <div class="leftbartitle">{text:update bar title}</div>
  1382.  
  1383. <div class="leftbarimg"></div>
  1384.  
  1385. <div class="leftbarblurb">{text:update blurb}</div>
  1386.  
  1387. </div>
  1388.  
  1389.  
  1390. <div id="container">
  1391.  
  1392. <div id="pagination">{block:Pagination}{block:NextPage}<a href="{NextPage}">back</a>
  1393. {/block:NextPage}
  1394. {block:PreviousPage}<a href="{PreviousPage}">forth</a>&nbsp;&nbsp;&nbsp;{/block:PreviousPage}
  1395. {/block:Pagination}</div>
  1396.  
  1397.  
  1398. <!-- tabs code by emily !! do not replicate and / or steal
  1399. KEEP THIS CREDIT INTACT -->
  1400.  
  1401. <div id="sidebar">
  1402.  
  1403.  
  1404.  
  1405. <div class="title">{text:title}
  1406. </div>
  1407.  
  1408. </div>
  1409.  
  1410. <div class="tab">
  1411.  
  1412.  
  1413. <a href="/" class="tablink" title="refresh">01</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  1414.  
  1415. <a href="/ask" class="tablink" title="ask">02</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  1416.  
  1417. <a href="#" class="tablink" onclick="openPage('navigate')" title="directory"> 03</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  1418.  
  1419. <a href="{text:free link url}" class="tablink" title="{text:free link title}">04</a>
  1420.  
  1421.  
  1422. </div><!-- end of tabs -->
  1423.  
  1424. <!-- tabs content code by emily !! do not replicate and / or steal
  1425. KEEP THIS CREDIT INTACT .-->
  1426.  
  1427.  
  1428. <!-- begin navi --><div id="navigate" class="tabcontent"> <span onclick="this.parentElement.style.display='none'" class="tabsclose">close</span>
  1429.  
  1430.  
  1431. <div class="navlink">
  1432. <a href="{text:link 1 url}" title="{text:link 1}">LINK 1</a>&nbsp;&nbsp;&nbsp;<a href="{text:link 2 url}" title="{text:link 2}">LINK 2</a>&nbsp;&nbsp;&nbsp;<a href="{text:link 3 url}" title="{text:link 3}">LINK 3</a><br><br> <br><br><BR><br>
  1433. <a href="{text:link 4 url}" title="{text:link 4}">LINK 4</a>&nbsp;&nbsp;&nbsp;<a href="{text:link 5 url}" title="{text:link 5}">LINK 5</a> &nbsp;&nbsp;<a href="{text:link 6 url}" title="{text:link 6}">LINK 6</a>
  1434.  
  1435. </div>
  1436.  
  1437.  
  1438. </div> <!-- end of navi -->
  1439.  
  1440.  
  1441.  
  1442. <!-- end of tabs content -->
  1443.  
  1444. <div class="postholder">
  1445.  
  1446.  
  1447. {block:Posts}
  1448.  
  1449.  
  1450.  
  1451. <div class="posts">
  1452.  
  1453. <!-- pinned -->
  1454.  
  1455.  
  1456. {block:PinnedPostLabel}<div class="pinnedposts"><span><span class="cp cp-pin-o"></span> i'm pinned ! </span></div> {/block:PinnedPostLabel}
  1457.  
  1458.  
  1459. <!-- permalink
  1460. reblog , source , date & notes-->
  1461.  
  1462. <div class="permalink">
  1463. <a href="{Permalink}"><span style="font-size:7px;">{DayOfMonthWithZero} {ShortMonth}</a></span></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  1464.  
  1465. <a href="{Permalink}"><span style="font-size:7px;">{NoteCountWithLabel}</a></span></a> &nbsp;&nbsp;&nbsp;&nbsp;
  1466. {block:RebloggedFrom}{/block:RebloggedFrom}
  1467. <a href="{ReblogURL}"><span style="font-size:7px;">reblog</a></span></a> &nbsp;&nbsp;&nbsp;&nbsp;
  1468. {block:ContentSource}
  1469. <a href="{SourceURL}"><span style="font-size:7px;">source</a></span></a>
  1470. {/block:ContentSource}
  1471. </div>
  1472. <br>
  1473.  
  1474. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  1475.  
  1476. <!-- pictures , videos , photoset -->
  1477.  
  1478.  
  1479. {block:Photo}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  1480.  
  1481. {block:Panorama}{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Panorama}
  1482.  
  1483. {block:Photoset}<div class="photoset">{Photoset-400}</div>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  1484.  
  1485. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  1486.  
  1487. <!-- quotes -->
  1488.  
  1489.  
  1490. {block:Quote}<div id="quote">{Quote} </div> {/block:Quote} {block:Source}
  1491. <div class="source">xo , {Source}</div>
  1492. {/block:Source}
  1493.  
  1494.  
  1495.  
  1496. <!-- links -->
  1497.  
  1498.  
  1499. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  1500.  
  1501. <!-- chat -->
  1502.  
  1503. {block:Chat}
  1504. {block:Title}
  1505. <h1>{Title}\</h1>{/block:Title}
  1506. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span style='color:{color:text};font-size:7.5px;'>( read )</span><span class="label" style="color:{color:text};font-size:13px;text-shadow:0px 0px 5px {color:accent};">&nbsp;&nbsp;{Label}</span>{/block:Label}
  1507. {Line}</li>{/block:Lines}</ul>
  1508. {/block:Chat}
  1509.  
  1510.  
  1511. <!-- audio -->
  1512.  
  1513.  
  1514. {block:Audio}
  1515. {block:AudioPlayer}
  1516. <div class="info">
  1517. <div class="play">{AudioPlayer}</div>
  1518. <br><Br>
  1519. <div class="musicsymbol"><span class="cp cp-microphone-o"></span>
  1520. </div><br><BR><br><BR><BR><BR>
  1521. <div class="details">{block:TrackName}{TrackName}{/block:TrackName}
  1522. <br>
  1523. <div class="artist">{block:Artist}{Artist}{/block:Artist}</div><br>
  1524. </div></div><br>
  1525. {/block:AudioPlayer}
  1526. {/block:Audio}
  1527.  
  1528. <!-- ask -->
  1529.  
  1530.  
  1531. {block:Answer}
  1532. <div class="question">{Question} </div>
  1533. <div class="asker">{Asker}</div>
  1534. <div class="askerbar"><div class="topper">THANKS 4 STOPPING BY !</div></div>
  1535.  
  1536. <div class="qanswer">{Answer}</div>
  1537. {/block:Answer}
  1538.  
  1539. <!-- readmore -->
  1540.  
  1541.  
  1542. {block:More}
  1543. <div class="readmore"><a href="{Permalink}"> read more .</a> </div>
  1544. {/block:More}
  1545. <br>
  1546.  
  1547.  
  1548. </div> <!-- end of posts -->
  1549.  
  1550. <!-- tags -->
  1551.  
  1552. <div class="tags">{block:HasTags}<B>ΛšΛ–β‹†&nbsp;{PostAuthorName} says :</B>&nbsp;{block:Tags}<span style="font-size:7.5px; color:{color:italic}"><span class="cp cp-hashtag"></span></span><a href="{TagUrl}">{Tag}</a>&nbsp;&nbsp;{/block:Tags}{/block:HasTags}</div>
  1553. {block:PostNotes}
  1554. {PostNotes}
  1555. {/block:PostNotes}
  1556.  
  1557. <br>
  1558. <br>
  1559. <br>
  1560. <br>
  1561. <br>
  1562. <br>
  1563. <br>
  1564. <br>
  1565. {/block:Posts}
  1566.  
  1567.  
  1568. </div> <!-- end of postholder -->
  1569.  
  1570.  
  1571.  
  1572. </div> <!-- end of container -->
  1573.  
  1574. <!-- credits -->
  1575.  
  1576.  
  1577. <div id="credit" data="credit"><a href="https://gordonramsei.tumblr.com/" title="theme by emily"><span class="fas fa-joint"></span>
  1578.  
  1579. </a></div>
  1580.  
  1581. </body>
  1582.  
  1583.  
  1584. <!-- begin tabs script -->
  1585.  
  1586. <script>
  1587.  
  1588. function openPage(pageName, elmnt, color) {
  1589. var i, tabcontent, tablink;
  1590. tabcontent = document.getElementsByClassName("tabcontent");
  1591. for (i = 0; i < tabcontent.length; i++) {
  1592. tabcontent[i].style.display = "none";}
  1593.  
  1594. tablinks = document.getElementsByClassName("tablink");
  1595. for (i = 0; i < tablinks.length; i++) {
  1596. tablinks[i].style.backgroundColor = "";
  1597. }
  1598.  
  1599. document.getElementById(pageName).style.display = "block";
  1600.  
  1601. elmnt.style.backgroundColor = color;
  1602. }
  1603. document.getElementById("defaultOpen").click();
  1604.  
  1605. </script>
  1606.  
  1607. <!-- end tabs script -->
  1608.  
  1609.  
  1610. <!-- begin tabs filter script -->
  1611.  
  1612. <!-- this filter script will dictate the parts of ur theme that will be visible when ur on ur tabs . for example , if u don't want ur posts to be visible bc ur tab content will be there , u will hide the posts with :
  1613.  
  1614. $(".posts").hide();
  1615.  
  1616. and u also need to specify that u want ur posts to REAPPEAR once ur no longer on an active tab :
  1617.  
  1618. $(".posts").show();
  1619.  
  1620. -->
  1621.  
  1622. <script>
  1623.  
  1624. function myFunction() {
  1625. var desc = document.getElementById("myDescription");
  1626. desc.classList.toggle("show");
  1627.  
  1628.  
  1629. }
  1630. </script>
  1631.  
  1632. <script>
  1633. $(document).ready(function(){
  1634. $(".tablink").click(function(){
  1635. $(".posts").hide();
  1636. $(".permalink").hide();
  1637. $(".tags").hide();
  1638. });
  1639. $(".tabsclose").click(function(){
  1640. $(".posts").show();
  1641. $(".permalink").show();
  1642. $(".tags").show();
  1643.  
  1644. });
  1645. });
  1646. </script>
  1647.  
  1648. <!-- end tabs filter script -->
  1649.  
  1650. <script>
  1651. $(document).ready(function(){
  1652. $(".title").hover(function(){
  1653. $(".titlesub").fadeIn("2000");
  1654. });
  1655. $(".title").mouseleave(function(){
  1656. $(".titlesub").fadeOut("2000");
  1657.  
  1658. });
  1659. });
  1660. </script>
  1661.  
  1662.  
  1663.  
  1664. </html>
  1665.  
  1666.  
  1667.  
Advertisement
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!