API tools faq
paste
drunkblushed

cruel summer (with muse tab) by drunkblushed

drunkblushed
Oct 13th, 2019 (edited)
1,890
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.71 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. ♡ CRUEL SUMMER BY DRUNKBLUSHED ♡
  4.  
  5. — do not combine with other themes.
  6. — do not take copy or take parts of this theme.
  7. — do not remove credits and redistribute as your own.
  8.  
  9.  
  10. -->
  11.  
  12. <html>
  13. <head>
  14.  
  15.  
  16.  
  17.  
  18. <meta name="color:background" content="#e7e7e7"/>
  19. <meta name="color:posts" content="#e7e7e7"/>
  20. <meta name="color:container" content="#f0f0f0"/>
  21. <meta name="color:borders" content="#ffffff"/>
  22. <meta name="color:accent" content="#93ad9d"/>
  23. <meta name="color:accent2" content="#3c3c3c"/>
  24. <meta name="color:bold" content="#93ad9d"/>
  25. <meta name="color:italic" content="#93ad9d"/>
  26. <meta name="color:text" content="#3c3c3c"/>
  27. <meta name="color:link" content="#93ad9d"/>
  28. <meta name="color:permalink" content="#3c3c3c"/>
  29. <meta name="color:permalink bg" content="#93ad9d"/>
  30.  
  31. <meta name="image:sidebar" content"https://via.placeholder.com/180x420"/>
  32. <meta name="image:graphic" content"https://via.placeholder.com/300x300"/>
  33. <meta name="image:tab image" content"https://via.placeholder.com/390x135"/>
  34.  
  35. <meta name="text:main title" content="LOREM IPSUM" />
  36. <meta name="text:subtitle" content="Lorem ipsum dolor sit amet, consectetur"/>
  37. <meta name="text:subtitle2" content="Vivamus non vestibulum nibh eu dapibus" />
  38. <meta name="text:stats" content"name. age. tz. counter." />
  39. <meta name="text:extra link title" content="" />
  40. <meta name="text:extra link url" content="" />
  41.  
  42.  
  43.  
  44.  
  45. <title>{title}</title>
  46.  
  47. <link href="https://fonts.googleapis.com/css?family=Roboto:400,700,900&display=swap" rel="stylesheet">
  48.  
  49. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  50.  
  51. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  52.  
  53. <script type="text/javascript" src="https://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  54. <script>
  55. (function($){
  56. $(document).ready(function(){
  57. $("[title]").style_my_tooltips();
  58. });
  59. })(jQuery);
  60. </script>
  61.  
  62. <style type="text/css">
  63.  
  64. @font-face { font-family:"tokyoreg"; src: url('https://dl.dropbox.com/s/jgq18n62iha87v6/Tokyo-Regular.ttf'); }
  65. @font-face { font-family: "primetime"; src: url('https://dl.dropboxusercontent.com/s/uzoszwd2yfzqmmx/PRIMETIME.ttf');}
  66. @font-face { font-family: "sv"; src: url('https://dl.dropboxusercontent.com/s/qpgsh740pinr4ic/Serenade%20Demo.ttf') ;}
  67.  
  68.  
  69. body{
  70. background-color: {color:background};
  71. font-family: 'roboto', sans-serif;
  72. color:{color:text};
  73. letter-spacing:1px;
  74. }
  75.  
  76. /*----------------- TEXT STYLES -----------------*/
  77.  
  78. a:link, a:active, a:visited{
  79. color: {color:Link};
  80. text-decoration:none;
  81. -webkit-transition: all 0.2s linear;
  82. -moz-transition: all 0.2s linear;
  83. transition: all 0.2s linear;
  84. }
  85.  
  86. a:hover {
  87. color:{color:Link Hover};
  88. -webkit-transition: all 0.2s linear;
  89. -moz-transition: all 0.2s linear;
  90. transition: all 0.2s linear;
  91. }
  92.  
  93. b,bold,strong{
  94. color:{color:bold};
  95. text-transform:uppercase;
  96. }
  97.  
  98. em,i,italic{
  99. color:{color:italic};
  100. }
  101.  
  102. big{font-size:11px;font-family: 'roboto', sans-serif;}
  103.  
  104. small,sup{
  105. font-size:9px;
  106. }
  107.  
  108. h1{font-family: "primetime";
  109. letter-spacing:1px;
  110. padding:10px;
  111. text-align:center;
  112. font-size: 22px;
  113. text-transform:uppercase;
  114. line-height: 120%;
  115. color:{color:accent};}
  116.  
  117. h2{font-family: "primetime";
  118. letter-spacing:1px;
  119. padding:10px;
  120. text-align:right;
  121. font-size: 18px;
  122. text-transform:uppercase;
  123. line-height: 120%;
  124. color:{color:link};}
  125.  
  126. .posttitle{
  127. font-family: "primetime";
  128. letter-spacing:1px;
  129. padding:10px;
  130. text-align:center;
  131. font-size: 22px;
  132. text-transform:uppercase;
  133. line-height: 120%;
  134. color:{color:permalink bg};
  135. }
  136.  
  137. blockquote{
  138. margin-left:0px;
  139. padding-left:15px;
  140. border-left: 2.5px solid {color:container};
  141. width:95%;
  142. }
  143.  
  144.  
  145. .p { padding-top: 5px;}
  146. .ol, ul { margin-left: 30px; padding: 5px; }
  147. .ul { list-style-type: square; }
  148.  
  149. ::-webkit-scrollbar-thumb {
  150. display: none;
  151. }
  152.  
  153. ::-webkit-scrollbar {
  154. display: none;
  155. }
  156.  
  157. #s-m-t-tooltip {
  158. z-index: 999999999999999999;
  159. background: #fff;
  160. font-size: 8px;
  161. line-height: 13px;
  162. letter-spacing: 1.5px;
  163. text-transform: uppercase;
  164. color: {color:permalink};
  165. font-weight:900;
  166. background-color:{color:permalink bg};
  167. max-width: 150px;
  168. word-wrap: break-word;
  169. padding: 2px 5px 2px 6px;
  170. display: block;
  171. margin: 24px 14px 7px 12px;
  172. -webkit-transition:.3s;
  173. -moz-transition:.3s;
  174. }
  175.  
  176. /*----------------- CONTAINERS & POSTS -----------------*/
  177.  
  178. #bigcont{
  179. margin: auto;
  180. left:0px;
  181. top:0px;
  182. bottom:0px;
  183. right:0px;
  184. }
  185.  
  186. #entries{
  187. padding:30px;
  188. z-index:99;
  189. margin: auto;
  190. left:0px;
  191. top:25px;
  192. bottom:0px;
  193. right:0px;
  194. width:570px;
  195. position:absolute;
  196. height:390px;
  197. overflow-y:scroll;
  198. background-color:{color:container};
  199. overflow-x:hidden;
  200. border:1px solid {color:background};
  201. }
  202.  
  203.  
  204. #post {
  205. font-size:9px;
  206. background-color:{color:posts};padding:25px;
  207. width:300px;z-index:99;
  208. margin-top:0px; margin-bottom:40px;
  209. margin-left:20px;
  210. line-height:150%;
  211. letter-spacing:1.5px;
  212. }
  213.  
  214. #post .tags {position:relative;
  215. text-align:left;opacity:0.5;
  216. color:{color:link};
  217. padding:8px; z-index:999999999999999;
  218. font-size:6.5px;
  219. letter-spacing:2px;
  220. font-family: 'roboto', sans-serif;
  221. text-transform:uppercase;-webkit-transition: all 0.2s linear;
  222. -moz-transition: all 0.2s linear;
  223. transition: all 0.2s linear;
  224. margin-bottom:-20px;
  225. margin-top:5px;
  226. margin-left:-8px;
  227. }
  228.  
  229. #posts .tags a{
  230. color:{color:link};
  231. }
  232.  
  233. #post:hover .tags {position:relative;
  234. text-align:left;opacity:1;
  235. color:{color:link};
  236. padding:8px; width:auto;z-index:999999999999999;
  237. text-transform:uppercase;-webkit-transition: all 0.2s linear;
  238. -moz-transition: all 0.2s linear;
  239. transition: all 0.2s linear;}
  240. .tags a {color:{color:text};text-transform:uppercase;}
  241.  
  242. .tags a:hover {color:{color:link hover};text-transform:uppercase;}
  243.  
  244.  
  245. .info{
  246. background:{color:permalink bg};
  247. position:relative;
  248. padding:12px;
  249. margin-top:20px;
  250. margin-bottom:0px;
  251. text-transform:uppercase;
  252. letter-spacing:2px;
  253. color:{color:permalink};
  254. font-size:8.5px;
  255. line-height:100%;
  256. }
  257.  
  258. .info span{
  259. text-align:left;
  260. padding-left:-20px;
  261. text-transform:uppercase;
  262. margin-top:2px;
  263. padding-right:5px;
  264. }
  265.  
  266. .info rb{
  267. right:0%;
  268. position:absolute;
  269. padding-right:0px;
  270. margin-top:-1px;
  271. }
  272.  
  273. .info b{
  274. font-weight:900;
  275. color:{color:permalink};
  276. }
  277.  
  278. .info a{
  279. margin-left:0px;
  280. font-size:8.5px;
  281. color: {color:permalink};
  282. }
  283.  
  284.  
  285. /*----------------- CUSTOMIZATIONS -----------------*/
  286.  
  287. #maintitle{
  288. font-family:"primetime";
  289. font-size:58px;
  290. position:fixed;
  291. margin-top:-110px;
  292. margin-left:-30px;
  293. -webkit-text-stroke: 1.5px {color:link};
  294. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  295. max-width:460px;
  296. text-align:justify;
  297. word-spacing:-3px;
  298. }
  299.  
  300. #stats{
  301. font-family:"roboto";
  302. font-size:9px;
  303. position:fixed;
  304. margin-top:-70px;
  305. margin-left:425px;
  306. color:{color:link};
  307. max-width:460px;
  308. text-align:center;
  309. word-spacing:0px;
  310. font-weight:400;
  311. font-style:italic;
  312. width:170px;
  313. }
  314.  
  315. #subtitle{
  316. width:350px;
  317. font-size:12px;
  318. transform:rotate(-90deg);
  319. text-transform:uppercase;
  320. margin-left:-170px;
  321. font-family:"tokyoreg";
  322. text-align:center;
  323. margin-top:185px;
  324. overflow:hidden;
  325. position:absolute;
  326. -webkit-filter: blur(0.0000000005px);
  327. }
  328.  
  329. #subtitle span{
  330. background-color:{color:accent2};
  331. padding:0px;
  332. padding-bottom:20px;
  333. font-size:12px;
  334. line-height:25px;
  335. padding:0px 5px 5px 5px;
  336. color:{color:accent};
  337. -webkit-filter: blur(0.0000000005px);
  338. }
  339.  
  340.  
  341. #subtitle2{
  342. width:350px;
  343. font-size:12px;
  344. transform:rotate(90deg);
  345. text-transform:uppercase;
  346. margin-left:210px;
  347. font-family:"tokyoreg";
  348. text-align:center;
  349. margin-top:185px;
  350. overflow:hidden;
  351. position:absolute;
  352. -webkit-filter: blur(0.0000000005px);
  353. }
  354.  
  355. #subtitle2 span{
  356. background-color:{color:accent2};
  357. padding:0px;
  358. font-size:12px;
  359. padding-bottom:20px;
  360. line-height:25px;
  361. padding:0px 5px 5px 5px;
  362. color:{color:accent};
  363. -webkit-filter: blur(0.0000000005px);
  364. }
  365.  
  366. .centerimage {background:{color:accent}; margin-left:-30px; height:400px; margin-top:-30px; width:450px; height:450px; margin-bottom:50px;}
  367.  
  368. .centerimage img { margin-top:75px; margin-left:75px; z-index:999;}
  369.  
  370. .sideimage {position:fixed;z-index:99999999; width:180px; height:420px;margin-left:420px; margin-top:-30px;}
  371.  
  372. .sideimage img {width:180px; height:420px;}
  373.  
  374.  
  375. /*----------------- NAVIGATION & PAGINATION -----------------*/
  376.  
  377. .tabz{
  378. width:160px;
  379. height:10px;
  380. font-size:12px;
  381. z-index:99999999999999999;
  382. position:fixed;
  383. text-transform:uppercase;
  384. margin-left:420px;
  385. text-align:center;
  386. margin-top:390px;
  387. padding:10px;
  388. color:#0b0b0b;
  389. line-height:100%;
  390. color:{color:permalink bg};
  391. background-color:{color:permalink};
  392. }
  393.  
  394. .tabz a{
  395. color:{color:permalink bg};
  396. padding:10px;
  397. }
  398.  
  399.  
  400. #pagination {
  401. font-family: 'roboto', sans-serif;
  402. font-size:10px;
  403. font-weight:900;
  404. width:350px;
  405. color:{color:accent};
  406. margin-left:15px;
  407. text-align:center;
  408. }
  409.  
  410. #pagination a{
  411. display:inline-block;
  412. color:{color:link};
  413. padding:7px 10px 5px 10px;
  414. background-color:{color:background};
  415. }
  416.  
  417. #pagination a:hover{
  418. color:{color:pagination Hover};}
  419.  
  420.  
  421.  
  422. /*----------------- ASK POSTS -----------------*/
  423.  
  424. .qt {
  425. padding:15px;
  426. background-color:transparent;
  427. border: 1px solid {color:borders};
  428. color:{color:text};
  429. padding-left:15px;
  430. margin-top:10px;
  431. margin-left:0px;
  432. width:265px;
  433. padding-bottom:20px;
  434. margin-bottom:20px;
  435. padding-top:20px;
  436. }
  437.  
  438. .as img {
  439. position:absolute;
  440. border-radius:50px;
  441. margin-left:-40px;
  442. margin-right:40px;
  443. margin-top:-5px;
  444. border:3px solid {color:accent};
  445. }
  446.  
  447. .as {
  448. padding-top:6px;
  449. background-color:{color:posts};
  450. padding:5px;
  451. color:{color:accent};
  452. font-size:16px;
  453. letter-spacing:1px;
  454. left:28%;
  455. margin-top:-35px;
  456. display:inline;
  457. position:absolute;
  458. margin-bottom:20px;
  459. text-transform:lowercase;
  460. font-family:"primetime";
  461. }
  462.  
  463. .as a{
  464. color:{color:accent};
  465. }
  466.  
  467. /*----------------- CHAT POSTS -----------------*/
  468.  
  469. .answer span,.convo li{margin:0 0 5px;border-radius:1em;padding:.5em 10px;max-width:75%;clear:both;position:relative}.answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{float:left;background:{color:container};color:{color:text};left:3px}.me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{content:"";position:absolute;left:-.5em;bottom:0;width:.5em;height:1em;border-right:.5em solid {color:container};border-bottom-right-radius:1em .5em}.answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{right:3px;float:right;background-color:{color:link};color:#000}.them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{content:"";position:absolute;right:-.5em;bottom:0;width:.5em;height:1em;border-left:.5em solid {color:link};border-bottom-left-radius:1em .5em}.me p,.answer,.asked span{padding:0;margin:0}.answer{overflow:hidden}
  470. .asked p {
  471. text-align: left;
  472. margin: 0 0px 10px 0px;
  473. padding: 0;
  474. color:{color:text};
  475. font-size: 12px;
  476. line-height: 0px;
  477. }
  478. .footerright .viasrc {
  479. float: left;
  480. }
  481. .asked a {
  482. margin:0;padding:0;
  483. }
  484. .user_4{background-color:{color:container};color{color:text}}.user_4::after{border-color:{color:container}}.user_6{background-color:{color:container};color{color:text}}.user_6::after{border-color:{color:container}}.user_5{background-color:{color:link};color:#000}.user_5::after{border-color:{color:link}}.user_3{background-color:{color:container};color{color:text}}.user_3::after{border-color:{color:container}}.user_7{background-color:{color:container};color{color:text}}.user_7::after{border-color:{color:container}}.user_8{background-color:{color:container};color{color:text}}.user_8::after{border-color:{color:container}}.user_9{background-color:{color:container};color{color:text}}.user_9::after{border-color:{color:container}}
  485. .convo {
  486. overflow: hidden;
  487. list-style-type: none;
  488. padding: 0;
  489. margin: 0;
  490. }
  491.  
  492. /*----------------- PERMALINK PAGE -----------------*/
  493. ol.notes {
  494. width:350px;
  495. padding: 0px;
  496. margin: 0px 0px;
  497. list-style-type: none;
  498. margin-left:20px;
  499. margin-top:-10px;
  500. font-size:9px;}
  501.  
  502. ol.notes li.note {
  503. padding: 10px;
  504. }
  505.  
  506. ol.notes li.note img.avatar {
  507. vertical-align: -4px;
  508. margin-right: 10px;
  509. width: 16px;
  510. height: 16px;
  511. }
  512.  
  513. ol.notes li.note span.action {
  514. font-weight: bold;
  515. }
  516.  
  517. ol.notes li.note .answer_content {
  518. font-weight: normal;
  519. }
  520.  
  521. ol.notes li.note blockquote {
  522. border-color: {color:posts};
  523. padding: 4px 10px;
  524. margin: 10px 0px 0px 25px;
  525. }
  526.  
  527. ol.notes li.note blockquote a {
  528. text-decoration: none;}
  529.  
  530. /*----------------- TABS BASE CODE BY NCIGHBOURHOOD -----------------*/
  531.  
  532.  
  533. .tabzcon { /* tablinks content aka the box under the tablinks */
  534. margin: auto;
  535. left:-180px;
  536. top:25px;
  537. bottom:0px;
  538. right:0px;
  539. padding:30px;
  540. position:absolute;
  541. width:390px;
  542. height:390px;
  543. background-color:{color:accent};
  544. color:#6c4b45;
  545. z-index:99999999999999999999999999999999999999999999999999;
  546. }
  547.  
  548.  
  549. .tabzclose { /* the close button, u prob dont need to touch this */
  550. font-size:10px;
  551. padding:3px;
  552. color:{color:background};
  553. margin-top:-13px;
  554. margin-right:-5px;
  555. float:right;
  556. }
  557.  
  558. .tabzclose:hover {
  559. cursor:pointer;
  560. }
  561.  
  562. .tabzcon img{
  563. width:390px;
  564. height:130px;
  565. background-color:{color:container};
  566. }
  567.  
  568.  
  569. /*----------------- TABS STYLING -----------------*/
  570. #tabsub{
  571. margin-top:-5px;
  572. margin-bottom:0px;
  573. background-color:{color:accent2};
  574. color:{color:accent};
  575. font-family:"tokyoreg";
  576. text-align:center;
  577. padding:4px 6.5px 6.5px 6.5px;
  578. font-size:12px;
  579. }
  580.  
  581. .tabdesc{
  582. margin-top:15px;
  583. width:155px;
  584. height:140px;
  585. border-bottom:15px solid {color:posts};
  586. padding:15px;
  587. background-color:{color:posts};
  588. color:{color:text};
  589. position:fixed;
  590. font-size:9px;
  591. overflow-y:auto;
  592. line-height:150%;
  593. }
  594.  
  595. #tablink{
  596. width:200px;
  597. height:200px;
  598. text-align:left;
  599. margin-left:200px;
  600. margin-top:17.5px;
  601. }
  602.  
  603. #tablink a{
  604. font-size:30px;
  605. font-family:"primetime";
  606. -webkit-text-stroke: 1.5px {color:accent2};
  607. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  608. line-height:115%;
  609. -webkit-transition:.8s;
  610. -moz-transition:.8s;
  611. }
  612.  
  613. #tablink a:hover{
  614. -webkit-text-fill-color: {color:accent2};
  615. -webkit-transition:.8s;
  616. -moz-transition:.8s;
  617. }
  618.  
  619. /*----------------- MUSE TAB -----------------*/
  620.  
  621. #musetitle{
  622. font-size:40px;
  623. color:{color:accent2};
  624. font-family:"primetime";
  625. text-align:center;
  626. margin-top:-10px;
  627. margin-bottom:20px;
  628. }
  629.  
  630. .musename{
  631. font-size:28px;
  632. font-family:"primetime";
  633. -webkit-text-stroke: 1.5px {color:accent2};
  634. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  635. display: inline-block;
  636. margin-left:20px;
  637. margin-top:-10px;
  638. max-width:200px;
  639. }
  640.  
  641. .musedesc{
  642. width:190px;
  643. height:70px;
  644. padding:5px;
  645. overflow:auto;
  646. font-size:9px;
  647. line-height:150%;
  648. color:{color:accent2};
  649. border-left:15px solid {color:accent};
  650. }
  651.  
  652. .musesubtitle{
  653. display: inline-block;
  654. max-width:200px;
  655. font-size:12px;
  656. text-transform:uppercase;
  657. font-family:"tokyoreg";
  658. text-align:center;
  659. margin-left:20px;
  660. margin-top:-5px;
  661. }
  662.  
  663. .musesubtitle span{
  664. background-color:{color:accent2};
  665. font-size:12px;
  666. padding-bottom:20px;
  667. line-height:25px;
  668. padding:0px 5px 5px 5px;
  669. color:{color:accent};
  670. }
  671.  
  672. .museimg img{
  673. width:130px;
  674. height:130px;
  675. float:left;
  676. margin-bottom:20px;
  677. display: inline-block;
  678. }
  679.  
  680. #muselinks{
  681. width:15px;
  682. padding:5px;
  683. height:120px;
  684. margin-left:360px;
  685. margin-top:-145px;
  686. margin-bottom:60px;
  687. }
  688.  
  689. #muselinks a{
  690. display: inline-block;
  691. color:{color:accent2};
  692. font-size:12px;
  693. padding-top:14px;
  694. }
  695.  
  696. /*----------------- CREDITS / DO NOT TOUCH! -----------------*/
  697. #credits{
  698. position:fixed;
  699. bottom:0px;
  700. right:5px;
  701. width:35px;
  702. height:35px;
  703. text-align:center;
  704. }
  705.  
  706. #credits a{
  707. font-family:"primetime";
  708. font-size:18px;
  709. -webkit-text-stroke: 1px {color:accent};
  710. -webkit-text-fill-color: rgba(0, 0, 0, 0);
  711. }
  712.  
  713. #credits a:hover{
  714. font-family:"primetime";
  715. -webkit-text-fill-color: {color:accent};
  716. }
  717.  
  718.  
  719. {CustomCSS}
  720. </style>
  721.  
  722. <link rel="shortcut icon" href="{Favicon}">
  723. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" /><meta name="viewport" content="width=820" />
  724.  
  725.  
  726. </head>
  727.  
  728. <body>
  729.  
  730. <!--TABS BASE CODE BY ALYOFRP. DO NOT REMOVE THIS CREDIT!-->
  731.  
  732.  
  733. <!--NAVIGATION TAB-->
  734. <div id="TabzOne" class="tabzcon alytut" style="display:none">
  735. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  736. <span class="th th-cross"></span></span>
  737. <div style="margin-bottom:10px;"></div>
  738.  
  739. <!--TAB SUBTITLES-->
  740. <div id="tabsub">DEVILS ROLL THE DICE, ANGELS ROLL THEIR EYES.</div>
  741. <img src="{image:tab image}">
  742. <div id="tabsub">WHAT DOESN'T KILL ME MAKES ME WANT YOU MORE.</div>
  743.  
  744. <!--TAB DESCRIPTION-->
  745. <div class="tabdesc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar velit tortor, nec pellentesque elit porta sed. Praesent a sodales est, a accumsan purus. Nulla finibus, augue nec pellentesque mollis, nulla risus dapibus est, a rutrum dui dui fermentum leo. Maecenas sapien dolor, venenatis vel sem ut, eleifend finibus risus. Quisque semper efficitur ante eget aliquam. Nullam et mollis erat. Vivamus ante massa, semper et gravida id, sollicitudin non dolor. </div>
  746.  
  747. <!--TAB LINKS-->
  748. <div id="tablink">
  749. <a href="/link">link one</a><br/>
  750. <a href="/link">link two</a><br/>
  751. <a href="/link">link three</a><br/>
  752. <a href="/link">link four</a><br/>
  753. <a href="/link">link five</a><br/>
  754. </div>
  755.  
  756. </div><!--END NAVIGATION-->
  757.  
  758.  
  759.  
  760. <!--MUSE TAB-->
  761. <div id="TabzTwo" class="tabzcon alytut" style="display:none; overflow:auto;">
  762. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  763. <span class="th th-cross"></span></span>
  764. <div style="margin-bottom:10px;"></div>
  765.  
  766. <!------------TAB SUBTITLES------------>
  767. <div id="musetitle">muses.</div>
  768.  
  769.  
  770. <!------------MUSE ONE------------>
  771. <div class="museimg"><img src="https://via.placeholder.com/130x130"></img></div>
  772.  
  773. <div class="musename">muse name</div>
  774.  
  775. <div class="musesubtitle"><span>fc. age. label. statistic.</span></div>
  776.  
  777. <div class="musedesc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar velit tortor, nec pellentesque elit porta sed. Praesent a sodales est, a accumsan purus. Nulla finibus, augue nec pellentesque mollis, nulla risus dapibus est, a rutrum dui dui fermentum leo.</div>
  778.  
  779. <div id="muselinks">
  780. <a href="/"><span class="th th-heart-1" title="musings"></span></a>
  781. <a href="/"><span class="th th-quote-down" title="interactions"></span></a>
  782. <a href="/"><span class="th th-camera" title="visage"></span></a>
  783. <a href="/"><span class="th th-pinterest-o" title="pinterest"></span></a>
  784. <a href="/"><span class="th th-flash" title="active"></span></a>
  785. </div><!------------END MUSE ONE------------>
  786.  
  787.  
  788.  
  789. <!------------MUSE TWO------------>
  790. <div class="museimg"><img src="https://via.placeholder.com/130x130"></img></div>
  791.  
  792. <div class="musename">muse name</div>
  793.  
  794. <div class="musesubtitle"><span>fc. age. label. statistic.</span></div>
  795.  
  796. <div class="musedesc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar velit tortor, nec pellentesque elit porta sed. Praesent a sodales est, a accumsan purus. Nulla finibus, augue nec pellentesque mollis, nulla risus dapibus est, a rutrum dui dui fermentum leo.</div>
  797.  
  798. <div id="muselinks">
  799. <a href="/"><span class="th th-heart-1" title="musings"></span></a>
  800. <a href="/"><span class="th th-quote-down" title="interactions"></span></a>
  801. <a href="/"><span class="th th-camera" title="visage"></span></a>
  802. <a href="/"><span class="th th-pinterest-o" title="pinterest"></span></a>
  803. <a href="/"><span class="th th-flash" title="active"></span></a>
  804. </div><!------------END MUSE TWO------------>
  805.  
  806.  
  807.  
  808. <!------------MUSE THREE------------>
  809. <div class="museimg"><img src="https://via.placeholder.com/130x130"></img></div>
  810.  
  811. <div class="musename">muse name</div>
  812.  
  813. <div class="musesubtitle"><span>fc. age. label. statistic.</span></div>
  814.  
  815. <div class="musedesc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar velit tortor, nec pellentesque elit porta sed. Praesent a sodales est, a accumsan purus. Nulla finibus, augue nec pellentesque mollis, nulla risus dapibus est, a rutrum dui dui fermentum leo.</div>
  816.  
  817. <div id="muselinks">
  818. <a href="/"><span class="th th-heart-1" title="musings"></span></a>
  819. <a href="/"><span class="th th-quote-down" title="interactions"></span></a>
  820. <a href="/"><span class="th th-camera" title="visage"></span></a>
  821. <a href="/"><span class="th th-pinterest-o" title="pinterest"></span></a>
  822. <a href="/"><span class="th th-flash" title="active"></span></a>
  823. </div><!------------END MUSE THREE------------>
  824.  
  825.  
  826.  
  827. <!------------MUSE FOUR------------>
  828. <div class="museimg"><img src="https://via.placeholder.com/130x130"></img></div>
  829.  
  830. <div class="musename">muse name</div>
  831.  
  832. <div class="musesubtitle"><span>fc. age. label. statistic.</span></div>
  833.  
  834. <div class="musedesc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar velit tortor, nec pellentesque elit porta sed. Praesent a sodales est, a accumsan purus. Nulla finibus, augue nec pellentesque mollis, nulla risus dapibus est, a rutrum dui dui fermentum leo.</div>
  835.  
  836. <div id="muselinks">
  837. <a href="/"><span class="th th-heart-1" title="musings"></span></a>
  838. <a href="/"><span class="th th-quote-down" title="interactions"></span></a>
  839. <a href="/"><span class="th th-camera" title="visage"></span></a>
  840. <a href="/"><span class="th th-pinterest-o" title="pinterest"></span></a>
  841. <a href="/"><span class="th th-flash" title="active"></span></a>
  842. </div><!------------END MUSE FOUR------------>
  843.  
  844.  
  845.  
  846.  
  847. </div><!--END MUSE TAB-->
  848.  
  849.  
  850.  
  851. <div id="entries">
  852.  
  853. {block:IndexPage}
  854. <div id="subtitle"><span>{text:subtitle}</span></div>
  855. <div id="subtitle2"><span>{text:subtitle2}</span></div>
  856. {/block:IndexPage}
  857.  
  858. <div class="tabz">
  859. <a href="/" title="home"><span class="th th-home-o"></span></a>
  860. <a href="/ask" title="message"><span class="th th-chat-bubble-o"></span></a>
  861. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzOne');" title="navigation"><span class="th th-earth-o"></span></a>
  862. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzTwo');" title="muses"><span class="th th-diamond-o"></span></a>
  863. </div>
  864.  
  865. <div class="sideimage"><img src="{image:sidebar}" draggable="false"></div>
  866.  
  867. <div id="maintitle">{text:main title}</div>
  868.  
  869. <div id="stats">{text:stats}</div>
  870.  
  871. {block:IndexPage}
  872. <div class="centerimage">
  873. <img src="{image:graphic}" draggable="false"></div>
  874. {/block:IndexPage}
  875.  
  876. {block:Posts}
  877.  
  878. <div id="post">
  879.  
  880.  
  881. {block:text}
  882. {block:Title}
  883. <div class="posttitle">{Title}</div>
  884. {/block:Title}
  885. {Body}
  886. {/block:text}
  887.  
  888. {block:Link}
  889. <div class="posttitle">
  890. <a href="{URL}">{Name}</a>
  891. </div>
  892. {block:Description}{Description}{/block:Description}
  893. {/block:Link}
  894.  
  895. {block:Photo}
  896. <center>
  897. {LinkOpenTag}
  898. <a href="{permalink}">
  899. <img src="{PhotoURL-400}" alt="{PhotoAlt}" width="300"></a>
  900. {LinkCloseTag}
  901. </center>
  902. {block:Caption}{Caption}{/block:Caption}
  903. {block:ContentSource}
  904. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  905. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  906. {/block:SourceLogo}
  907. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  908. {/block:ContentSource}
  909. {block:ReblogParentURL}
  910. <!-- {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  911. {/block:ReblogParentURL}
  912. {/block:Photo}
  913.  
  914. {block:Photoset}
  915. {Photoset}
  916. {block:Caption}{Caption}{/block:Caption}
  917. {/block:Photoset}
  918.  
  919. {block:Quote}
  920. <div class="posttitle">{Quote}</div>
  921. {block:Source}
  922. <center>- {Source}</center>
  923. {/block:Source}
  924. {/block:Quote}
  925.  
  926. {block:Chat}
  927. {block:Title}
  928. <h1>{Title}</h1>{/block:Title}<br>
  929. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  930. {Line}</li>{/block:Lines}</ul>
  931. {/block:Chat}
  932.  
  933. {block:Audio}
  934. {block:AlbumArt}
  935. <img src="{AlbumArtURL}" width="80px" align="left" style="margin-right:10px" />{/block:AlbumArt}
  936. <span class="audio">{AudioPlayerGrey}<br></span>
  937. {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
  938. {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  939. {/block:ExternalAudio}<b>Played:</b> {PlayCount} times
  940. {block:Caption}{Caption}{/block:Caption}
  941. {/block:Audio}
  942.  
  943. {block:Video}
  944. <center>{Video-250}</center>
  945. {block:Caption}{Caption}{/block:Caption}
  946. {/block:Video}
  947.  
  948. {block:Answer}
  949. <div class="pt"></div>
  950. <div class="qt">{Question}</div>
  951. <div class="as"><img src="{AskerPortraitURL-24}">{Asker}</div>
  952. {Answer}{/block:Answer}
  953.  
  954.  
  955. {block:IndexPage}
  956. <div class="info">
  957. {block:Date}
  958. <span><a href="{Permalink}" title="{TimeAgo}">
  959. <b>{ShortMonth}{DayOfMonthWithZero}{ShortYear}</b></a>
  960. {block:NoteCount}with
  961. <b><a href="{Permalink}">{NoteCountWithLabel}</b></a>{/block:NoteCount}</span>
  962. {/block:Date}
  963. <rb>
  964. <span>
  965.  
  966. {block:RebloggedFrom}
  967. <a href="{reblogparenturl}" title="via"><span class="th th-share-o"></span></a>{/block:RebloggedFrom}
  968.  
  969. {block:ContentSource}
  970. <a href="{SourceURL}" title="source"><span class="th th-push-pin-o"></span></a>{/block:ContentSource}
  971.  
  972. <a href="{ReblogURL}" title="reblog" target="_blank" class="reblog"><span class="th th-reload"></span></a></span></rb>
  973. </div>
  974.  
  975. <div class="tags">{block:HasTags}
  976. {block:Tags}<a href="{TagURL}">#<font style="text-transform:uppercase;">{Tag}</font>&nbsp;</a>
  977. {/block:Tags}
  978. {/block:HasTags}</div>
  979. {/block:IndexPage}
  980.  
  981.  
  982. {block:PermalinkPage}
  983. <div class="info">
  984. {block:Date}<span>
  985. <a href="{Permalink}">
  986. <b>{ShortMonth}{DayOfMonthWithZero}{ShortYear}</b></a> with <b><a href="{Permalink}">{NoteCountWithLabel}</b></a></span>
  987. {/block:Date}
  988. <span>
  989. </span>
  990. </div>
  991.  
  992. <div class="tags">{block:HasTags}
  993. {block:Tags}<a href="{TagURL}">#<font style="text-transform:uppercase;">{Tag}</font>&nbsp;</a>
  994. {/block:Tags}
  995. {/block:HasTags}</div>
  996. {/block:PermalinkPage}
  997.  
  998.  
  999. </div><!----POST END---->
  1000.  
  1001. {block:PostNotes}
  1002. {PostNotes}
  1003. {/block:PostNotes}
  1004. {/block:Posts}
  1005.  
  1006. {block:Pagination}
  1007. <div id="pagination">
  1008. <div style="margin-top:50px;margin-bottom:10px;">
  1009. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page"><span class="th th-chevron-left"></span></a>{/block:PreviousPage}
  1010. {block:JumpPagination length="3"}
  1011. {block:CurrentPage}<a><span class="current_page">{PageNumber}</span></a>{/block:CurrentPage}
  1012. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1013. {block:NextPage}<a href="{NextPage}" class="jump_page"><span class="th th-chevron-right"></span></a>{/block:NextPage}
  1014. </div></div>
  1015. {/block:Pagination}
  1016.  
  1017. </div><!----ENTRIES END---->
  1018. </div>
  1019.  
  1020. <div id="credits">
  1021. <a href="https://drunkblushed.tumblr.com/" title="theme by drunkblushed"><span class="th th-flower-1"></span></a></div>
  1022.  
  1023.  
  1024. </body>
  1025. <script>
  1026. function openAlytut(evt, alytutName) {
  1027. var i, x, tablinks;
  1028. x = document.getElementsByClassName("alytut");
  1029. for (i = 0; i < x.length; i++) {
  1030. x[i].style.display = "none";
  1031. }
  1032. tablinks = document.getElementsByClassName("tablink");
  1033. for (i = 0; i < x.length; i++) {
  1034. tablinks[i].className = tablinks[i].className.replace(" tabzact", "");
  1035. }
  1036. document.getElementById(alytutName).style.display = "block";
  1037. evt.currentTarget.className += " tabzact";
  1038. }
  1039. </script>
  1040.  
  1041. </html>
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!