astraeacodes

sound and fury by astraeacodes

Oct 27th, 2017
7,922
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.50 KB | None | 0 0
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd">
  2.  
  3.  
  4. <!---------✧ ☾ ☆ ☄ ⁛ THEMES BY ASTRAEAWRITES / ASTRAEACODES ⁛ ☄ ☾ ✧
  5. DO NOT STEAL OR CLAIM AS YOURS!
  6. report problems or questions @ astraeacodes.tumblr.com
  7.  
  8. TUMBLR CONTROLS BY @CYANTISTS
  9. CHAT BUBBLES BY ANIMALITES.TUMBLR.COM (DEACTIVATED)
  10. NEW TUMBLR AUDIO POSTS BACKGROUND COLOR TUTORIAL @ROXIESTHEMES
  11. ICON FONT BY @SATURNTHMS
  12. REBLOG AND LIKE BUTTON BY @SHYTHEMES
  13. GUTTER SIZE FIX FROM @BYCHLOETHEMES & @SHYTHEMES
  14. VIDEO RESIZING SCRIPT @SHYTHEMES
  15. INSTAGRAM RESIZING FIX BY ME-------------------->
  16.  
  17. <html>
  18. <head>
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{Favicon}">
  21.  
  22.  
  23. <!------------------SCRIPTS------------------>
  24.  
  25. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  26.  
  27. <link href="https://fonts.googleapis.com/css?family=Crimson+Text|Inconsolata|Karla|Lato|Lora|Merriweather|Open+Sans|Playfair+Display|Roboto|Source+Sans+Pro" rel="stylesheet">
  28.  
  29. <link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
  30.  
  31. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("a[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:90,tip_fade_speed:600,attribute:"title"});});})(jQuery);</script>
  32.  
  33. <script>$(document).ready(function() { $('iframe.tumblr_audio_player').load( function() { $('iframe.tumblr_audio_player').contents().find("head") .append($("<style type='text/css'> .audio-player{background:{color:accent one} !important} </style>")); }); });</script>
  34.  
  35.  
  36. <!------------------META TAGS------------------>
  37.  
  38. <meta name="image:sidebar" content="">
  39.  
  40. <meta name="if:postbg" content="1">
  41. <meta name="if:tags" content="1">
  42. <meta name="if:imessagechats" content="0">
  43. <meta name="if:sidebar" content="1">
  44.  
  45. <meta name="select:font" content="karla">
  46. <meta name="select:font" content="open sans">
  47. <meta name="select:font" content="lato">
  48. <meta name="select:font" content="roboto">
  49. <meta name="select:font" content="source sans pro">
  50.  
  51. <meta name="select:grayscale" content="none">
  52. <meta name="select:grayscale" content="0.5">
  53. <meta name="select:grayscale" content="0.7">
  54. <meta name="select:grayscale" content="0.9">
  55. <meta name="select:grayscale" content="1">
  56.  
  57. <meta name="select:font size" content="9px">
  58. <meta name="select:font size" content="9.5px">
  59. <meta name="select:font size" content="10px">
  60. <meta name="select:font size" content="11px">
  61. <meta name="select:font size" content="12px">
  62.  
  63. <meta name="select:gutter size" content="1px">
  64. <meta name="select:gutter size" content="2px">
  65. <meta name="select:gutter size" content="3px">
  66. <meta name="select:gutter size" content="4px">
  67. <meta name="select:gutter size" content="5px">
  68.  
  69. <meta name="select:post width" content="400px" title="400px" />
  70. <meta name="select:post width" content="500px" title="500px" />
  71. <meta name="select:post width" content="540px" title="540px" />
  72.  
  73. <meta name="color:background" content="#fbfbfb">
  74. <meta name="color:titles" content="#3a3a3a">
  75. <meta name="color:text" content="#2c2c2c">
  76. <meta name="color:links" content="#000">
  77. <meta name="color:links hover" content="#545454">
  78. <meta name="color:post bg" content="#f6f6f6">
  79. <meta name="color:accent one" content="#d3d3d3">
  80. <meta name="color:accent two" content="#b2b2b2">
  81. <meta name="color:borders" content="#e3e3e3">
  82. <meta name="color:selection" content="#bbb">
  83. <meta name="color:scroll" content="#767676">
  84. <meta name="color:scroll bg" content="#ffffff">
  85.  
  86. <meta name="text:main title" content="i feel my heart bend">
  87. <meta name="text:subtitle" content="as if bracing for impact">
  88.  
  89. <meta name="text:Link 1" content="refresh">
  90. <meta name="text:Link 1 URL" content="/">
  91. <meta name="text:Link 2" content="message">
  92. <meta name="text:Link 2 URL" content="/ask">
  93. <meta name="text:Link 3" content="archive">
  94. <meta name="text:Link 3 URL" content="/archive">
  95. <meta name="text:Link 4" content="creations">
  96. <meta name="text:Link 4 URL" content="URL">
  97. <meta name="text:Link 5" content="navigate">
  98. <meta name="text:Link 5 URL" content="URL">
  99. <meta name="text:Link 6" content="extra">
  100. <meta name="text:Link 6 URL" content="URL">
  101.  
  102.  
  103. <style type="text/css">
  104.  
  105.  
  106. /* TOOLTIPS, SCROLLBAR, SELECTION */
  107.  
  108. #s-m-t-tooltip {
  109. max-width:400px;
  110. background-color:{color:post bg};
  111. font-size:8.5px;
  112. color:{color:text};
  113. text-transform:uppercase;
  114. border:1px solid {color:borders};
  115. padding:6.5px;
  116. line-height:100%;
  117. margin:20px 0px 0px 20px;
  118. z-index:99999999999999999999999999999999;
  119. border-radius:1px;
  120. box-shadow:1px 1px 3px rgba(0,0,0,.0);
  121. }
  122.  
  123. ::-webkit-scrollbar-thumb:vertical {
  124. background-color:{color:scroll};
  125. height:auto;
  126. border-radius:0px;
  127. }
  128.  
  129. ::-webkit-scrollbar-thumb:horizontal {
  130. height:auto !important;
  131. border-radius:0px;
  132. }
  133.  
  134. ::-webkit-scrollbar {
  135. height:auto;
  136. width:3.5px;
  137. background-color:{color:scroll bg};
  138. border-radius:0px;
  139. }
  140.  
  141. ::selection {
  142. background-color:{color:selection};
  143. color: #fff;
  144. }
  145.  
  146.  
  147. /* BODY STYLING */
  148.  
  149. @font-face { font-family: astra; src: url('https://dl.dropboxusercontent.com/s/j0iytzfyqq6ecti/The%20Braggest_Demo.ttf') ;}
  150.  
  151. body{
  152. background-color:{color:background};
  153. font-size:{select:font size};
  154. font-family:"{select:font}";
  155. color:{color:text};
  156. line-height:160%;
  157. }
  158.  
  159. p:empty{
  160. display:none;
  161. }
  162.  
  163. small , sub, sup{
  164. font-size:{select:font size};
  165. line-height:160%;
  166. }
  167.  
  168. a{
  169. text-decoration:none;
  170. color:{color:links};
  171. -webkit-transition: all 0.6s ease-in-out;
  172. -moz-transition: all 0.6s ease-in-out;
  173. -o-transition: all 0.6s ease-in-out;
  174. -ms-transition: all 0.6s ease-in-out;
  175. transition: all 0.6s ease-in-out;
  176. }
  177.  
  178. a:hover{
  179. -webkit-transition: all 0.6s ease-in-out;
  180. -moz-transition: all 0.6s ease-in-out;
  181. -o-transition: all 0.6s ease-in-out;
  182. -ms-transition: all 0.6s ease-in-out;
  183. transition: all 0.6s ease-in-out;
  184. color:{color:links hover};
  185. }
  186.  
  187. ol, ul{
  188. padding-left:15.5px;
  189. }
  190.  
  191. pre{
  192. white-space: pre-wrap;
  193. white-space: -moz-pre-wrap;
  194. white-space: -pre-wrap;
  195. white-space: -o-pre-wrap;
  196. word-wrap: break-word;
  197. font-family:"inconsolata";
  198. background:{color:accent one};
  199. }
  200.  
  201. .title{
  202. font-size:calc({select:font size} + 4px);
  203. font-family:"{select:font}";
  204. font-weight:600;
  205. text-transform:uppercase;
  206. margin:5px 5px 10px 5px;
  207. text-align:center;
  208. color:{color:titles};
  209. }
  210.  
  211. h1{
  212. font-size:calc({select:font size} + 4px);
  213. font-family:"{select:font}";
  214. font-weight:600;
  215. text-transform:uppercase;
  216. margin:0px 5px 10px 5px;
  217. text-align:center;
  218. padding-top:0px;
  219. color:{color:titles};
  220. }
  221.  
  222. h2{
  223. font-size:calc({select:font size} + 3px);
  224. font-family:"{select:font}";
  225. font-weight:600;
  226. color:{color:titles};
  227. margin-bottom:10px;
  228. }
  229.  
  230. h3{
  231. font-size:calc({select:font size} + 2px);
  232. font-family:"{select:font}";
  233. font-weight:600;
  234. color:{color:titles};
  235. margin-bottom:10px;
  236. }
  237.  
  238. h4, h5, h6{
  239. font-size:calc({select:font size} + 1px);
  240. font-family:"{select:font}";
  241. font-weight:600;
  242. color:{color:titles};
  243. margin-bottom:10px;
  244. }
  245.  
  246. hr{
  247. border:none;
  248. box-shadow:0;
  249. margin:0px auto;
  250. padding:10px;
  251. width:30%;
  252. border-top:1px solid {color:borders};
  253. margin-bottom:-10px;
  254. margin-top:20px;
  255. }
  256.  
  257. blockquote {
  258. padding-left:10px;
  259. margin-left:0px;
  260. border-left:1px solid {color:borders};
  261. width:96%;
  262. padding-top:0px;
  263. padding-bottom:0px;
  264. word-wrap:break-word;
  265. }
  266.  
  267. img{
  268. max-width:100%;
  269. height:auto;
  270. -webkit-filter: grayscale({select:grayscale});
  271. -webkit-transition: all 0.9s ease-in-out;
  272. -moz-transition: all 0.9s ease-in-out;
  273. -o-transition: all 0.9s ease-in-out;
  274. -ms-transition: all 0.9s ease-in-out;
  275. transition: all 0.9s ease-in-out;
  276. }
  277.  
  278. img:hover {
  279. -webkit-filter: none;
  280. -webkit-transition: all 0.9s ease-in-out;
  281. -moz-transition: all 0.9s ease-in-out;
  282. -o-transition: all 0.9s ease-in-out;
  283. -ms-transition: all 0.9s ease-in-out;
  284. transition: all 0.9s ease-in-out;
  285. }
  286.  
  287.  
  288. /* CONTAINER */
  289.  
  290. #everything{
  291. width:900px;
  292. margin:0 auto;
  293. background:white;
  294. }
  295.  
  296.  
  297. /* SIDEBAR */
  298.  
  299. #sidebar{
  300. top:18.5%;
  301. position:fixed;
  302. width:200px;
  303. height:auto;
  304. border-right:1px solid {color:borders};
  305. padding-right:20px;
  306. padding-top:25px;
  307. padding-bottom:25px;
  308. }
  309.  
  310. .maintitle{
  311. width:195px;
  312. height:auto;
  313. padding:7.5px;
  314. padding-top:0px;
  315. padding-left:2.5px;
  316. padding-right:2.5px;
  317. text-align:center;
  318. text-transform:lowercase;
  319. font-family:"astra";
  320. font-size:30px;
  321. font-weight:100;
  322. line-height:10px;
  323. margin-bottom:5.5px;
  324. color:{color:text};
  325. }
  326.  
  327. .maintitle a:hover{
  328. color:{color:text};
  329. }
  330.  
  331. .subtitle{
  332. font-family:"{select:font}";
  333. font-size:12px;
  334. text-transform:uppercase;
  335. width:200px;
  336. text-align:center;
  337. margin-top:-15.5px;
  338. margin-bottom:0px;
  339. padding:7.5px;
  340. padding-left:0px;
  341. padding-right:0px;
  342. color:{color:text};
  343. cursor:default;
  344. }
  345.  
  346. .description{
  347. font-size:{select:font size};
  348. font-family:"{select:font}";
  349. padding:7.5px;
  350. margin-top:5.5px;
  351. padding-top:12.5px;
  352. border-top:1px solid {color:borders};
  353. }
  354.  
  355. #sidebar img{
  356. width:200px;
  357. margin-top:5px;
  358. margin-bottom:12.5px;
  359. }
  360.  
  361. .accordion {
  362. overflow:hidden;
  363. margin-top:7.5px;
  364. margin-bottom:0px;
  365. padding-bottom:0px;
  366. }
  367.  
  368. .accordion-section-title span{
  369. font-size:calc({select:font size} - 0.5px);
  370. display:inline-flex;
  371. vertical-align:middle;
  372. margin-top:-0.5px;
  373. margin-right:12.5px;
  374. margin-left:5px;
  375. }
  376.  
  377. .accordion-section-title {
  378. width:183px;
  379. padding:7.5px;
  380. display:inline-block;
  381. background:{color:post bg};
  382. transition:all linear 0.15s;
  383. font-size:calc({select:font size} + 0.5px);
  384. color:{color:text};
  385. border:1px solid {color:borders};
  386. font-family:"{select:font}";
  387. text-transform:uppercase;
  388. border-radius:2px;
  389. }
  390.  
  391. .accordion-section-title.active, .accordion-section-title:hover {
  392. background:{color:accent one};
  393. border:1px solid {color:borders};
  394. text-decoration:none;
  395. color:{color:text};
  396. }
  397.  
  398. .accordion-section-content {
  399. padding:0px;
  400. display:none;
  401. }
  402.  
  403. .accordion-section-content ul{
  404. list-style-type:none;
  405. margin:0px;
  406. padding:0px;
  407. }
  408. .accordion-section-content li{
  409. width:96.5px;
  410. max-width:96.5px;
  411. display:inline-block;
  412. margin:0px 1px;
  413. }
  414. .accordion-section-content{
  415. font-weight:100;
  416. width:200px;
  417. text-align:center;
  418. }
  419.  
  420. .accordion-section-content a{
  421. margin-top:5px;
  422. margin-bottom:0px;
  423. display:block;
  424. padding:5px;
  425. text-transform:lowercase;
  426. font-size:{select:font size};
  427. background:{color:post bg};
  428. border:1px solid {color:borders};
  429. color:{color:text};
  430. font-family:"{select:font}";
  431. border-radius:2px;
  432. }
  433.  
  434. .pagination{
  435. text-align:center;
  436. margin-top:15px;
  437. margin-bottom:-2.5px;
  438. padding-bottom:0px;
  439. }
  440.  
  441. .pagination a{
  442. font-size:{select:font size};
  443. font-family:"{select:font}";
  444. text-transform:uppercase;
  445. font-weight:600;
  446. }
  447.  
  448. a.back{
  449. margin:0px 10px;
  450. }
  451.  
  452. a.next{
  453. margin:0px 10px;
  454. }
  455.  
  456.  
  457. /* ENTRIES */
  458.  
  459. #entries{
  460. {block:ifPostBG}
  461. border:1px solid {color:borders};
  462. background:{color:post bg};
  463. {/block:ifPostBG}
  464. width:{select:post width};
  465. padding:2.5px 5px 2.5px 5px;
  466. border-radius:2px;
  467. margin-top:80px;
  468. margin-bottom:80px;
  469. position:justify;
  470. right:0%;
  471. }
  472.  
  473. #posts{
  474. margin-left:320px;
  475. position:absolute;
  476. }
  477.  
  478.  
  479. /* IFRAMES & POST STYLING */
  480.  
  481. iframe.tmblr-iframe {
  482. z-index:99999999999999!important;
  483. top:0!important;
  484. right:0!important;
  485. opacity:0.4;
  486. /* delete invert(1) from here */
  487. filter:invert(1) contrast(150%);
  488. -webkit-filter:invert(1) contrast(150%);
  489. -o-filter:invert(1) contrast(150%);
  490. -moz-filter:invert(1) contrast(150%);
  491. -ms-filter:invert(1) contrast(150%);
  492. /* to here if your blog has a dark background */
  493. transform:scale(0.65);
  494. transform-origin:100% 0;
  495. -webkit-transform:scale(0.65);
  496. -webkit-transform-origin:100% 0;
  497. -o-transform:scale(0.65);
  498. -o-transform-origin:100% 0;
  499. -moz-transform:scale(0.65);
  500. -moz-transform-origin:100% 0;
  501. -ms-transform:scale(0.65);
  502. -ms-transform-origin:100% 0;}
  503.  
  504. iframe.tmblr-iframe:hover {
  505. opacity:0.6!important;}
  506.  
  507. .photoset iframe{
  508. width:100%!important;
  509. max-width:100%!important;
  510. }
  511.  
  512. .audio iframe{
  513. max-width:100%;
  514. height:85px;
  515. padding-bottom:0px;
  516. margin-bottom:0px;
  517. }
  518.  
  519. .html_photoset {
  520. -webkit-filter: grayscale({select:grayscale});
  521. -webkit-transition: all 0.9s ease-in-out;
  522. -moz-transition: all 0.9s ease-in-out;
  523. -o-transition: all 0.9s ease-in-out;
  524. -ms-transition: all 0.9s ease-in-out;
  525. transition: all 0.9s ease-in-out;
  526. }
  527.  
  528. .html_photoset:hover {
  529. -webkit-filter: none;
  530. }
  531.  
  532. .video{
  533. padding:0px;
  534. }
  535.  
  536. .video iframe[src*="instagram.com"]{
  537. width:100%;
  538. display: block;
  539. min-width:calc({select:post width} - 2.5px);
  540. max-width:calc({select:post width} - 2.5px);
  541. }
  542.  
  543. .video iframe{
  544. margin:-1px 0.5px;
  545. width:100%;
  546. min-width:calc({select:post width});
  547. max-width:calc({select:post width});
  548. }
  549.  
  550.  
  551. /* POST INFO */
  552.  
  553. .topinfo{
  554. border-bottom:1px solid {color:borders};
  555. text-transform:uppercase;
  556. line-height:150%;
  557. padding:7.5px 7.5px 9px 7.5px;
  558. font-size:calc({select:font size} + 0.5px);
  559. color:{color:text};
  560. font-family:"{select:font}";
  561. text-transform:uppercase;
  562. margin-bottom:7.5px;
  563. }
  564. .topinfo i{
  565. font-size:calc({select:font size} - 1.5px);
  566. display:inline-flex;
  567. vertical-align:top;
  568. margin-top:3px;
  569. margin-right:7.5px;
  570. margin-left:0px;
  571. }
  572.  
  573. .topinfo svg {
  574. width:9.5px;
  575. height:auto;
  576. opacity:.5;
  577. padding:1px;
  578. display:block;
  579. overflow:visible;
  580. }
  581.  
  582. .topinfo rbandlike a {
  583. position:relative;
  584. display:inline-block;
  585. overflow:hidden;
  586. padding:5px;
  587. width:12px;
  588. height:12px;
  589. }
  590.  
  591. .topinfo rbandlike .reblog {
  592. opacity:1;
  593. }
  594.  
  595. .topinfo rbandlike .reblog svg {
  596. width:8.5px;
  597. margin-top:1px;
  598. }
  599.  
  600. .topinfo rbandlike .like .liked + svg {
  601. opacity:1;
  602. }
  603.  
  604. .topinfo rbandlike .like .liked + svg path {
  605. fill:#ec5a5a;
  606. }
  607.  
  608. .topinfo rbandlike .like .like_button {
  609. position:relative;
  610. }
  611.  
  612. .topinfo rbandlike .like .like_button iframe {
  613. position:absolute;
  614. top:0;
  615. left:0;
  616. bottom:0;
  617. right:0;
  618. z-index:2;
  619. opacity:0;
  620. }
  621.  
  622. .topinfo rbandlike{
  623. right:0px;
  624. float:right;
  625. margin-right:-5px;
  626. display:inline-flex;
  627. vertical-align:top;
  628. margin-top:-3px;
  629. }
  630.  
  631. .bottominfo{
  632. padding:7.5px;
  633. border-top:1px solid {color:borders};
  634. font-size:calc({select:font size} - 0.5px);
  635. text-transform:uppercase;
  636. margin-top:7.5px;
  637. margin-bottom:0px;
  638. }
  639. .bottominfo srcandvia{
  640. font-size:calc({select:font size} - 0.5px);
  641. text-transform:uppercase;
  642. float:right;
  643. }
  644.  
  645. .bottominfo srcandvia a{
  646. margin-left:10px;
  647. }
  648.  
  649. .tags{
  650. padding:7.5px 7.5px 7.5px 7.5px;
  651. margin:0px;
  652. margin-bottom:0;
  653. line-height:145%;
  654. border-top:1px dotted {color:borders};
  655. font-size:calc({select:font size} - 0.5px);
  656. }
  657.  
  658. .tags b{
  659. margin-right:5px;
  660. }
  661.  
  662. .tags a{
  663. padding-left:0px;
  664. padding-right:7.5px;
  665. }
  666.  
  667. .notesbox{
  668. width:{select:post width};
  669. margin:0px auto;
  670. position:justify;
  671. margin-bottom:100px;
  672. margin-top:-10px;
  673. {block:ifPostBG}
  674. border:1px solid {color:borders};
  675. border-radius:2px;
  676. background:{color:post bg};
  677. {/block:ifPostBG}
  678. }
  679.  
  680. .notes{
  681. overflow-x:hidden;
  682. width:calc({select:post width} - 10px);
  683. padding:5px;
  684. padding-bottom:0px;
  685. }
  686.  
  687. ol.notes, .notes li {
  688. text-transform:uppercase;
  689. list-style:none;
  690. font-size:calc({select:font size} - 1px);
  691. padding:5px 10px 5px 10px;
  692. }
  693.  
  694. .notes blockquote{
  695. margin-left:3.5px;
  696. }
  697.  
  698. .notes img{
  699. width:calc({select:font size} + 1px);
  700. height:calc({select:font size} + 1px);
  701. margin-right:5px;
  702. overflow:hidden;
  703. border-radius:50%;
  704. vertical-align:middle;
  705. margin-bottom:2px;
  706. }
  707.  
  708.  
  709. /* BLOCKS */
  710.  
  711. .caption{
  712. padding:1px 7.5px 1px 7.5px;
  713. margin-bottom:-2.5px;
  714. }
  715. .caption2{
  716. margin:10px 7.5px 10px 7.5px;
  717. }
  718.  
  719. .quotes{
  720. font-size:calc({select:font size} + 3.5px);
  721. font-weight:100;
  722. font-family:"lora";
  723. line-height:20px;
  724. padding-left:1em;
  725. padding-right:1em;
  726. font-style:italic;
  727. text-align:left;
  728. text-indent:-0.5em;
  729. }
  730.  
  731. .quotes p{
  732. text-indent:0em;
  733. }
  734.  
  735. .quotes p:first-child, .quotes p:last-child{
  736. display:inline;
  737. }
  738.  
  739. .source{
  740. text-align:center;
  741. padding:5px;
  742. font-style:normal;
  743. font-size:calc({select:font size} + 1px);
  744. }
  745.  
  746. {block:ifiMessageChats}
  747. .answer span,.convo li{
  748. margin-top:0px;
  749. margin-bottom:5px;
  750. border-radius:1em;
  751. padding:8px 15px;
  752. max-width:75%;
  753. clear:both;
  754. position:relative;
  755. }
  756.  
  757. .answer li:before, .convo li:before{
  758. visibility:hidden;
  759. }
  760.  
  761. .answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{
  762. float:left;
  763. background:{color:accent one};
  764. color:{color:text};
  765. left:3px;
  766. top:0px;
  767. }
  768.  
  769. .me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{
  770. content:"";
  771. position:absolute;
  772. left:-.5em;
  773. bottom:0;
  774. width:.5em;
  775. height:1em;
  776. border-right:.5em solid {color:accent one};
  777. border-bottom-right-radius:1em .5em;
  778. }
  779.  
  780. .answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{
  781. right:3px;
  782. top:0px;
  783. float:right;
  784. background-color:{color:accent two};
  785. color:{color:text};
  786. }
  787.  
  788. .them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{
  789. content:"";
  790. position:absolute;
  791. right:-.5em;
  792. bottom:0;
  793. width:.5em;
  794. height:1em;
  795. border-left:.5em solid {color:accent two};
  796. border-bottom-left-radius:1em .5em;
  797. }
  798.  
  799. .convo {
  800. overflow: hidden;
  801. list-style-type: none;
  802. padding:-0px 10px;
  803. margin:0px;
  804. margin-top:-8px;
  805. display:block;
  806. }
  807. {/block:ifIMessageChats}
  808.  
  809. .answer span,.convo li{
  810. margin-top:0px;
  811. margin-bottom:5px;
  812. padding:5px 10px;
  813. clear:both;
  814. width:100%;
  815. position:relative;
  816. }
  817.  
  818. .answer li:before, .convo li:before{
  819. visibility:hidden;
  820. }
  821.  
  822. .answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{
  823. background:{color:accent one};
  824. color:{color:text};
  825. top:0px;
  826. }
  827. .answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{
  828. top:0px;
  829. background-color:{color:accent two};
  830. color:{color:text};
  831. }
  832.  
  833. .convo {
  834. overflow: hidden;
  835. list-style-type: none;
  836. padding:0px;
  837. margin:0px;
  838. margin-top:-8px;
  839. display:block;
  840. }
  841.  
  842.  
  843. .questions{
  844. padding:0px;
  845. margin-top:10px;
  846. padding-left:2.5px;
  847. padding-right:2.5px;
  848. }
  849.  
  850. .questions span{
  851. font-weight:900;
  852. font-size:calc({select:font size} + 1px);
  853. text-transform:uppercase;
  854. margin-right:5px;
  855. margin-left:5px;
  856. }
  857.  
  858. .question{
  859. font-size:calc({select:font size} + 1px);
  860. padding:5px;
  861. background:{color:accent two};
  862. margin-top:10px;
  863. margin-left:2.5px;
  864. border-radius:1px;
  865. width:calc({select:post width} - 18.5px);
  866. }
  867.  
  868. .answered{
  869. padding-left:5px;
  870. padding-right:5px;
  871. padding-top:0px;
  872. padding-bottom:0;
  873. margin-top:12.5px;
  874. margin-bottom:12.5px;
  875. }
  876.  
  877. /*---------------CREDIT, DO NOT MOVE OR MAKE LESS VISIBLE!!---------------*/
  878.  
  879. .credit a{
  880. font-size:calc({select:font size} +0.5px);
  881. position:fixed;
  882. font-family:"{select:font}";
  883. font-weight:600;
  884. text-align:right;
  885. right:12.5px;
  886. bottom:12.5px;
  887. text-transform:uppercase;
  888. color:{color:text};
  889. -webkit-transition: all 0.5s ease-in-out;
  890. -moz-transition: all 0.5s ease-in-out;
  891. -o-transition: all 0.5s ease-in-out;
  892. -ms-transition: all 0.5s ease-in-out;
  893. transition: all 0.5s ease-in-out;
  894. }
  895.  
  896. .credit a:hover{
  897. color:{color:links hover};
  898. text-decoration:none;
  899. -webkit-transition: all 0.5s ease-in-out;
  900. -moz-transition: all 0.5s ease-in-out;
  901. -o-transition: all 0.5s ease-in-out;
  902. -ms-transition: all 0.5s ease-in-out;
  903. transition: all 0.5s ease-in-out;
  904. }
  905.  
  906.  
  907.  
  908. {CustomCSS}
  909. </style>
  910.  
  911.  
  912. <!------------------SCRIPTS------------------>
  913.  
  914. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  915. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  916.  
  917. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  918.  
  919. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  920.  
  921. <script>
  922. $(document).ready(function(){
  923. $('.photo-slideshow').pxuPhotoset({
  924. lightbox: true,
  925. rounded: false,
  926. gutter: '{select:gutter size}',
  927. borderRadius: '0px',
  928. photoset: '.photo-slideshow',
  929. photoWrap: '.photo-data',
  930. photo: '.pxu-photo'
  931. });
  932. });
  933. </script>
  934.  
  935. <script>
  936. $(document).ready(function() {
  937. function close_accordion_section() {
  938. $('.accordion .accordion-section-title').removeClass('active');
  939. $('.accordion .accordion-section-content').slideUp(300).removeClass('open');
  940. }
  941.  
  942. $('.accordion-section-title').click(function(e) {
  943. // Grab current anchor value
  944. var currentAttrValue = $(this).attr('href');
  945.  
  946. if($(e.target).is('.active')) {
  947. close_accordion_section();
  948. }else {
  949. close_accordion_section();
  950.  
  951. // Add active class to section title
  952. $(this).addClass('active');
  953. // Open up the hidden content panel
  954. $('.accordion ' + currentAttrValue).slideDown(300).addClass('open');
  955. }
  956.  
  957. e.preventDefault();
  958. });
  959. });
  960. </script>
  961.  
  962. </head>
  963. <body>
  964.  
  965.  
  966. <!------------------EVERYTHING------------------>
  967.  
  968. <div id="everything">
  969.  
  970. <!--------------SIDEBAR-------------->
  971.  
  972. <div id="sidebar">
  973. <div class="maintitle"><a href="/">{text:main title}</a></div>
  974. <div class="subtitle">{text:subtitle}</div>
  975. {block:ifSidebar}<img src="{image:sidebar}">{/block:ifSidebar}
  976. <div class="description">{Description}</div>
  977.  
  978. <div class="accordion">
  979. <div class="accordion-section">
  980. <a class="accordion-section-title" href="#accordion-1"><span class="sf sf-diamond-o"></span> navigation</a>
  981.  
  982. <div id="accordion-1" class="accordion-section-content">
  983. <ul>
  984. {block:ifLink1}<li><a href="{text:Link 1 URL}">
  985. {text:Link 1}</a></li>{/block:ifLink1}
  986. {block:ifLink2}<li><a href="{text:Link 2 URL}">
  987. {text:Link 2}</a></li>{/block:ifLink2}
  988. {block:ifLink3}<li><a href="{text:Link 3 URL}">
  989. {text:Link 3}</a></li>{/block:ifLink3}
  990. {block:ifLink4}<li><a href="{text:Link 4 URL}">
  991. {text:Link 4}</a></li>{/block:ifLink4}
  992. {block:ifLink5}<li><a href="{text:Link 5 URL}">
  993. {text:Link 5}</a></li>{/block:ifLink5}
  994. {block:ifLink6}<li><a href="{text:Link 6 URL}">
  995. {text:Link 6}</a></li>{/block:ifLink6}
  996. </ul>
  997. </div>
  998. </div>
  999. </div>
  1000.  
  1001. {block:Pagination}
  1002. <div class="pagination">
  1003. {block:PreviousPage}
  1004. <a href="{PreviousPage}" class="back">back</a>
  1005. {/block:PreviousPage}
  1006. {block:NextPage}
  1007. <a href="{NextPage}" class="next">next</a>
  1008. {/block:NextPage}
  1009. </div>
  1010. {/block:Pagination}
  1011.  
  1012. </div>
  1013.  
  1014.  
  1015. <!------------------ENTRIES------------------>
  1016.  
  1017. <div id="posts">
  1018. {block:Posts}
  1019. <div id="entries">
  1020.  
  1021. <!----------- TOP INFO----------->
  1022.  
  1023. {block:Date}
  1024. <div class="topinfo">
  1025. <i class="sf sf-clock-3-o"></i>
  1026. <a href="{Permalink}">{TimeAgo}</a>
  1027. <rbandlike>
  1028. <div class="controls">
  1029. <a href="{ReblogURL}" target="_blank" class="reblog"><svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 361.095 361.095" style="enable-background:new 0 0 361.095 361.095;" xml:space="preserve"><g><g><path d="M182.595,325.678c-63.183,0-120.133-42.217-138.267-102.567c-2.833-9.067-12.183-14.167-21.25-11.333 c-9.067,2.833-14.167,12.183-11.333,21.25c22.95,75.933,91.517,126.65,170.85,126.65c98.317,0,178.5-80.183,178.5-178.5 s-80.183-178.5-178.5-178.5c-55.817,0-108.233,26.633-141.667,69.7l-7.083-56.1c-1.133-9.35-9.633-15.867-18.983-14.733 C5.511,2.678-1.005,11.178,0.128,20.528l13.317,103.7c1.133,8.5,8.5,14.733,16.717,14.733c0.567,0,1.417,0,1.983,0l102.567-11.617 c9.35-1.133,16.15-9.35,15.017-18.7s-9.35-16.15-18.7-15.017l-68.85,7.65c26.633-39.95,71.683-64.6,120.417-64.6 c79.617,0,144.5,64.883,144.5,144.5S262.211,325.678,182.595,325.678z"/></g></g></svg></a>
  1030. <a href="#" class="like">{LikeButton}<svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 442.403 442.403" style="enable-background:new 0 0 442.403 442.403;" xml:space="preserve"><g><g><path d="M213.05,422.652c2.833,1.7,5.95,2.833,9.35,2.833c3.117,0,6.517-0.85,9.35-2.833c7.65-5.1,187.283-123.533,207.683-243.95 c10.483-62.333-8.783-100.867-26.633-122.117c-20.967-24.933-52.133-39.667-83.017-39.667c-10.2,0-20.117,1.7-28.9,5.1 c-43.067,16.15-72.25,44.767-88.117,64.317c-15.583-19.267-42.217-47.033-74.517-58.083c-9.917-3.4-20.683-5.1-32.017-5.1 c-28.9,0-56.383,11.9-75.367,32.867c-16.717,18.417-35.7,53.55-29.75,114.75C13.016,291.185,204.833,417.268,213.05,422.652z M56.083,78.685c17.283-18.983,38.817-21.817,50.15-21.817c7.367,0,14.45,1.133,20.967,3.4 c39.383,13.317,70.833,63.467,71.4,63.75c3.117,5.1,8.783,8.217,14.733,7.933c5.95,0,11.333-3.4,14.45-8.5 c0.283-0.567,28.617-48.733,85.283-69.983c4.817-1.7,10.767-2.833,16.717-2.833c20.967,0,42.217,10.483,56.95,27.767 c19.267,22.667,25.783,55.533,18.983,94.633c-7.367,43.067-42.5,94.633-101.717,149.317c-33.433,30.883-66.3,54.683-81.6,65.45 c-16.15-11.05-51-36.55-86.417-68.85C74.216,262.285,39.366,209.868,35.116,167.368C31.433,128.552,38.516,97.952,56.083,78.685z"/></g></g></svg></a>
  1031. </div>
  1032. </rbandlike>
  1033. </div>
  1034. {/block:Date}
  1035.  
  1036. <!-----------BLOCKS----------->
  1037.  
  1038. {block:Link}
  1039. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  1040. {block:Description}{Description}{/block:Description}
  1041. {/block:Link}
  1042.  
  1043. {block:Quote}
  1044. <div class="quotes">“ {Quote} ”</div>
  1045. {block:Source}<div class="source"><strike>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</strike> {Source}</div>{/block:Source}
  1046. {/block:Quote}
  1047.  
  1048. {block:Text}
  1049. {block:Title}
  1050. <div class="title">{Title}</div>{/block:Title}<div class="caption2">{Body}</div>
  1051. {/block:Text}
  1052.  
  1053. {block:Photo}
  1054. {LinkOpenTag}<img src="{PhotoURL-HighRes}" width="{select:post width}">{LinkCloseTag}
  1055. {block:Caption}
  1056. <div class="caption">{Caption}</div>
  1057. {/block:Caption}
  1058. {/block:Photo}
  1059.  
  1060. {block:Photoset}<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>
  1061. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1062. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}
  1063. {/block:Photoset}
  1064.  
  1065. {block:Video}
  1066. <div class="video">{Video-500}</div>
  1067. {block:Caption}
  1068. <div class="caption">{Caption}</div>
  1069. {/block:Caption}
  1070. {/block:Video}
  1071.  
  1072. {block:Audio}
  1073. <div class="audio">{AudioEmbed-640}</div>
  1074. {block:Caption}
  1075. <div class="caption">{Caption}</div>
  1076. {/block:Caption}
  1077. {/block:Audio}
  1078.  
  1079. {block:Answer}
  1080. <div class="questions">
  1081. <span>{Asker} asked:</span>
  1082. <br><div class="question">{Question}</div>
  1083. <div class="answered">{Answer}</div>
  1084. </div>
  1085. {/block:Answer}
  1086.  
  1087. {block:Chat}
  1088. {block:Title}
  1089. <h1>{Title}</h1>{/block:Title}<br>
  1090. <ul class="convo">
  1091. {block:Lines}<li class="line_{Alt} user_{UserNumber}">
  1092. {block:Label}<span class="label"><b>{Label}</b></span>{/block:Label}
  1093. {Line}
  1094. {/block:Lines}</ul>
  1095. {/block:Chat}
  1096.  
  1097. <!----------- BOTTOM INFO----------->
  1098.  
  1099. {block:Date}
  1100. <div class="bottominfo">
  1101. <a href="{Permalink}">{NoteCountWithLabel}</a>
  1102. {block:RebloggedFrom}
  1103. <srcandvia>
  1104. <a href="{ReblogRootURL}" title="{ReblogRootName}">src</a>
  1105. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  1106. </srcandvia>
  1107. {/block:RebloggedFrom}
  1108. </div>
  1109. {/block:Date}
  1110.  
  1111.  
  1112. {block:ifTags}
  1113. {block:HasTags}
  1114. <div class="tags"><b>TAGGED AS:</b>
  1115. {block:Tags}
  1116. <a href="{TagUrl}"># {Tag}</a>
  1117. {/block:Tags}
  1118. </div>
  1119. {/block:HasTags}
  1120. {/block:ifTags}
  1121.  
  1122. </div>
  1123. {/block:Posts}
  1124.  
  1125. <!----------- POST NOTES----------->
  1126.  
  1127. {block:PostNotes}
  1128. <div class="notesbox">
  1129. <div class="notes">
  1130. {PostNotes}
  1131. </div>
  1132. </div>
  1133. {/block:PostNotes}
  1134.  
  1135. </div>
  1136.  
  1137. <!---------------CREDIT // DO NOT REMOVE OR ALTER PLS !! ------------------>
  1138.  
  1139. <div class="credit"><a href="https://astraeawrites.tumblr.com/" title="astraea"><span class="sf sf-heart-o"></span></a></div>
  1140.  
  1141.  
  1142. </body>
  1143. </html>
Advertisement
Add Comment
Please, Sign In to add comment