API tools faq
paste
Advertisement
Guest User

alicia's theme

a guest
Jun 23rd, 2017
54
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.16 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. ==============================================
  8.  
  9.  
  10. 「 CODES BY POHRORO 」
  11. @ http://pohroro.com
  12. Theme ▸ 106. Square One
  13. Last Updated: 3 November 2016
  14.  
  15. +
  16.  
  17. Inspiration:
  18. ladmilk.tumblr.com/post/56696608746
  19. sugaeri.tumblr.com/post/146102121353
  20.  
  21. Avatar:
  22. joleng.tumblr.com/post/152603185106
  23.  
  24. Masonry + Infinite Scroll + PXU Photosets,
  25. Post Controls:
  26. shythemes.tumblr.com
  27.  
  28.  
  29. ==============================================
  30.  
  31. -->
  32.  
  33. <title>{Title}</title>
  34. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  35. <script type="text/javascript">
  36. $(document).ready(function() {
  37.  
  38. $("#popup1link").click(function() {
  39. $("#popupbg").fadeIn(200);
  40. $("#popup1").fadeIn(1000);
  41. $(".closepopup1").fadeIn(1200);
  42. });
  43. $(".closepopup1").click(function() {
  44. $("#popupbg").fadeOut(1000);
  45. $("#popup1").fadeOut(200);
  46. $(".closepopup1").fadeOut(200);
  47. });
  48.  
  49. });
  50. </script>
  51. <link rel="shortcut icon" href="{Favicon}">
  52. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  53.  
  54. <link href="https://fonts.googleapis.com/css?family=Karla:400,400i,700,700i|Montserrat:400" rel="stylesheet" type="text/css">
  55. <link href="https://static.tumblr.com/yzs4yqx/aSjo8f2eh/reset.css" rel="stylesheet" type="text/css">
  56. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css">
  57.  
  58. <meta name="image:Background" content="">
  59. <meta name="image:Avatar" content="http://i.imgur.com/98g9yMP.png">
  60.  
  61. <meta name="color:Body Font" content="#979797">
  62. <meta name="color:Background" content="#F5F8F8">
  63. <meta name="color:Title" content="#F3B0A6">
  64. <meta name="color:Accent One" content="#D2EB9A">
  65. <meta name="color:Accent Two" content="#F3B0A6">
  66. <meta name="color:Accent Font" content="#FFFFFF">
  67. <meta name="color:Link" content="#F3B0A6">
  68. <meta name="color:Hover Link" content="#D2EB9A">
  69. <meta name="color:Sidebar Background" content="#FFFFFF">
  70. <meta name="color:Post Background" content="#FFFFFF">
  71. <meta name="color:Border" content="#EEEEEE">
  72.  
  73. <meta name="select:Background Type" content="background-repeat: repeat;" title="Repeat Background">
  74. <meta name="select:Background Type" content="background-size: cover;" title="Full Page Background">
  75. <meta name="select:Avatar Shape" content="border-radius: 3px;" title="Square">
  76. <meta name="select:Avatar Shape" content="border-radius: 100%;" title="Circle">
  77. <meta name="if:Infinite Scroll" content="1">
  78. <meta name="if:Show Captions" content="1">
  79. <meta name="if:Show Avatar" content="1">
  80. <meta name="if:Show Title" content="1">
  81. <meta name="if:Show Subtitle" content="1">
  82. <meta name="if:Show Description" content="1">
  83. <meta name="if:Multicolumn" content="1">
  84. <meta name="if:Inverted Controls" content="1">
  85. <meta name="if:Show Tags" content="1">
  86. <meta name="if:Custom Link Three" content="1">
  87. <meta name="if:Custom Link Four" content="1">
  88. <meta name="if:Custom Link Five" content="1">
  89. <meta name="if:Custom Link Six" content="1">
  90. <meta name="if:Custom Link Seven" content="0">
  91. <meta name="if:Custom Link Eight" content="0">
  92.  
  93. <meta name="select:Post Size" content="250px" title="250px">
  94. <meta name="select:Post Size" content="300px" title="300px">
  95. <meta name="select:Post Size" content="400px" title="400px">
  96. <meta name="select:Post Size" content="500px" title="500px">
  97. <meta name="select:Post Size" content="540px" title="540px">
  98.  
  99. <meta name="select:Body Font Size" content="9px" title="9px">
  100. <meta name="select:Body Font Size" content="10px" title="10px">
  101. <meta name="select:Body Font Size" content="11px" title="11px">
  102. <meta name="select:Body Font Size" content="12px" title="12px">
  103. <meta name="select:Body Font Size" content="13px" title="13px">
  104.  
  105. <meta name="text:Title" content="Square One.">
  106. <meta name="text:Subtitle" content="● Whistle like a missle bomb ●">
  107. <meta name="text:Post Margin" content="30px">
  108. <meta name="text:Link One" content="Link One">
  109. <meta name="text:Link One URL" content="Link One URL">
  110. <meta name="text:Link Two" content="Link Three">
  111. <meta name="text:Link Two URL" content="Link Two URL">
  112. <meta name="text:Link Three" content="Link Two">
  113. <meta name="text:Link Three URL" content="Link Three URL">
  114. <meta name="text:Link Four" content="Link Four">
  115. <meta name="text:Link Four URL" content="Link Four URL">
  116. <meta name="text:Link Five" content="Link Five">
  117. <meta name="text:Link Five URL" content="Link Five URL">
  118. <meta name="text:Link Six" content=“javaScript:void(0);” id=“popup1link”>
  119. <meta name="text:Link Six URL" content="Link Six URL">
  120. <meta name="text:Link Seven" content="Link Seven">
  121. <meta name="text:Link Seven URL" content="Link Seven URL">
  122. <meta name="text:Link Eight" content="Link Eight">
  123. <meta name="text:Link Eight URL" content="Link Eight URL">
  124.  
  125. <style>
  126. #popupbg {
  127. position: fixed;
  128. width: 100%;
  129. height: 100%;
  130. background-color: #000000;
  131. opacity: 0.8;
  132. z-index: 99999;
  133. display: none;
  134. }
  135.  
  136. .popup {
  137. position: fixed;
  138. width: 600px;
  139. height: auto;
  140. max-height: 550px;
  141. top: 50%;
  142. left: 50%;
  143. transform: translate(-50%, -50%);
  144. padding: 20px;
  145. background-color: #FFFFFF; /* popup background colour */
  146. color: #000000; /* popup text colour */
  147. z-index: 999999;
  148. display: none;
  149. overflow: hidden;
  150. overflow-y: scroll;
  151. }
  152.  
  153. .popup::-webkit-scrollbar {
  154. width:9px;
  155. height:4px;
  156. background: #FFFFFF; /* also popup background colour */
  157. }
  158.  
  159. .popup::-webkit-scrollbar-thumb {
  160. background-color: #333333; /* popup scrollbar colour */
  161. }
  162.  
  163. .popupclosecont {
  164. position: absolute;
  165. top: -10px;
  166. right: -10px;
  167. width: 80px;
  168. height: 80px;
  169. overflow: hidden;
  170. z-index: 9999999;
  171. display: none;
  172. }
  173. .popupclose {
  174. position: absolute;
  175. top: -30px;
  176. padding: 55px 55px 30px 30px;
  177. border-radius: 50px;
  178. font-size: 12pt;
  179. color: #FFFFFF; /* popup close button x colour */
  180. background-color: #333333; /* popup close button bg colour */
  181. cursor: pointer;
  182. }
  183.  
  184. div#qTip {
  185. font: 8px/10px Karla;
  186. color: {color:Body Font};
  187. text-align: center;
  188. text-transform: uppercase;
  189. background: {color:Sidebar Background};
  190. display: none;
  191. border: 1px solid {color:Border};
  192. max-width: 350px;
  193. position: absolute;
  194. text-align: justify;
  195. z-index: 99;
  196. padding: 2px 4px;
  197. margin: -5px 0 0 20px;
  198. border-radius: 2px;
  199. letter-spacing: 1px;
  200. }
  201.  
  202. .tmblr-iframe {
  203. top: 14px!important;
  204. right: 8px!important;
  205. position: fixed!important;
  206. opacity: 0.2!important;
  207. {block:IfInvertedControls}
  208. white-space: nowrap;
  209. -webkit-filter: invert(100%);
  210. filter: invert(100%);
  211. {block:IfInvertedControls}
  212. }
  213.  
  214. body {
  215. font-family: Karla, Arial;
  216. color: {color:Body Font};
  217. font-size: {select:Body Font Size};
  218. background: {color:Background} url({image:Background});
  219. {select:Background Type}
  220. line-height: 18px;
  221. }
  222.  
  223. sub, sup, small {
  224. font-size: {select:Body Font Size};
  225. }
  226.  
  227. a {
  228. color: {color:Link};
  229. text-decoration: none;
  230. -webkit-transition: all 0.5s ease;
  231. transition: all 0.5s ease;
  232. }
  233.  
  234. a:hover {
  235. color: {color:Hover Link};
  236. }
  237.  
  238. h1 {
  239. font: normal 14px/14px Montserrat;
  240. text-align: center;
  241. width: calc(100% + 20px);
  242. margin-left: -10px;
  243. padding-bottom: 10px;
  244. border-bottom: 1px solid {color:Border};
  245. color: {color:Title};
  246. text-transform: lowercase;
  247. }
  248.  
  249. #bar {
  250. height: 5px;
  251. width: 100%;
  252. position: fixed;
  253. z-index: 9;
  254. background: {color:Accent Two};
  255. top: 0;
  256. left: 0;
  257. }
  258.  
  259. nav#top {
  260. width: 25%;
  261. background: {color:Sidebar Background};
  262. height: 40px;
  263. top: 5px;
  264. position: fixed;
  265. font-size: 8px;
  266. letter-spacing: 1px;
  267. border-bottom: 1px solid {color:Border};
  268. text-transform: uppercase;
  269. }
  270.  
  271. nav#top ul {
  272. padding: 0;
  273. margin: 0;
  274. text-align: center;
  275. }
  276.  
  277. nav#top ul li {
  278. display: inline-block;
  279. list-style-type: none;
  280. line-height: 41px;
  281. padding-right: 25px;
  282. }
  283.  
  284. nav#top ul li:last-of-type {
  285. padding: 0;
  286. }
  287.  
  288. nav#top svg {
  289. width: 11px;
  290. height: 11px;
  291. fill: {color:Accent One};
  292. margin-bottom: -3px;
  293. margin-right: 3px;
  294. }
  295.  
  296. nav#top a {
  297. color: {color:Body Font};
  298. }
  299.  
  300. nav#top a:hover {
  301. color: {color:Accent Two};
  302. }
  303.  
  304. aside {
  305. background: {color:Sidebar Background};
  306. width: 25%;
  307. height: 100%;
  308. position: fixed;
  309. top: 46px;
  310. display: table;
  311. border-right: 1px solid {color:Border};
  312. }
  313.  
  314. #content {
  315. margin: 0 auto;
  316. left: 0;
  317. right: 0;
  318. position: relative;
  319. text-align: justify;
  320. text-align-last: center;
  321. display: table-cell;
  322. vertical-align: middle;
  323. padding-bottom: 40px;
  324. }
  325.  
  326. #avatar img {
  327. width: 120px;
  328. height: 120px;
  329. margin: 0 auto;
  330. position: relative;
  331. border-radius: 3px;
  332. padding: 2px;
  333. border: 1px solid {color:Border};
  334. {select:Avatar Shape}
  335. }
  336.  
  337. #title {
  338. font-size: 24px;
  339. text-transform: lowercase;
  340. letter-spacing: -1px;
  341. font-family: montserrat;
  342. line-height: 24px;
  343. width: 270px;
  344. margin: 0 auto;
  345. margin-top: 15px;
  346. margin-bottom: 2px;
  347. color: {color:Title};
  348. }
  349.  
  350. #subtitle {
  351. background: {color:Accent One};
  352. background: -moz-linear-gradient(left, {color:Accent One} 0%, {color:Accent Two} 100%);
  353. background: -webkit-linear-gradient(left, {color:Accent One} 0%, {color:Accent Two} 100%);
  354. background: linear-gradient(to right, {color:Accent One} 0%, {color:Accent Two} 100%);
  355. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{color:Accent One}', endColorstr='{color:Accent Two}',GradientType=1 );
  356. color: {color:Accent Font};
  357. padding: 2px 5px;
  358. letter-spacing: 2px;
  359. border-radius: 2px;
  360. font-size: 8px;
  361. font-style: italic;
  362. text-transform: uppercase;
  363. display: inline;
  364. width: 270px;
  365. margin: 0 auto;
  366. }
  367.  
  368. #description {
  369. border: 1px solid {color:Border};
  370. padding: 0 12px;
  371. margin: 10px auto;
  372. width: 70%;
  373. }
  374.  
  375. #description span {
  376. display: block;
  377. background: {color:Sidebar Background};
  378. padding: 9px;
  379. position: relative;
  380. line-height: 16px;
  381. margin-top: -1px;
  382. margin-bottom: -1px;
  383. }
  384.  
  385. nav#main {
  386. list-style-type: none;
  387. margin: 0 auto;
  388. padding: 0;
  389. width: 250px;
  390. }
  391.  
  392. nav#main li {
  393. width: 100px;
  394. display: inline-block;
  395. text-transform: uppercase;
  396. font-size: 8px;
  397. letter-spacing: 1px;
  398. border-bottom: 1px solid {color:Border};
  399. padding: 7px;
  400. margin-right: 7px;
  401. margin-top: -1px;
  402. }
  403.  
  404. nav#main b {
  405. color: {color:Accent Two};
  406. font-weight: bold;
  407. margin-right: 4px;
  408. }
  409.  
  410. nav#main a {
  411. color: {color:Body Font};
  412. }
  413.  
  414. nav#main a:hover {
  415. color: {color:Accent One};
  416. }
  417.  
  418. #right-bar {
  419. height: 40px;
  420. top: 5px;
  421. position: fixed;
  422. width: 75%;
  423. left: 25%;
  424. background: {color:Sidebar Background};
  425. border-bottom: 1px solid {color:Border};
  426. border-left: 1px solid {color:Border};
  427. z-index: 9;
  428. }
  429.  
  430. #search {
  431. margin-left: 15px;
  432. margin-top: 10px;
  433. width: 180px;
  434. }
  435.  
  436. #search input[type=text] {
  437. border: 1px solid {color:Border};
  438. width: 150px;
  439. outline: none;
  440. padding: 2px 0 1px 0;
  441. font-family: Karla;
  442. border-radius: 2px;
  443. color: {color:Body Font};
  444. line-height: 15px;
  445. font-size: 11px;
  446. background: {color:Background};
  447. text-align: center;
  448. }
  449.  
  450. #search button {
  451. float: right;
  452. background: none;
  453. outline: none;
  454. margin-left: 70px;
  455. border: none;
  456. cursor: pointer;
  457. margin-top: -20px;
  458. }
  459.  
  460. #search button svg {
  461. width: 15px;
  462. height: 15px;
  463. fill: {color:Accent One};
  464. -webkit-transition: all 0.5s ease;
  465. transition: all 0.5s ease;
  466. }
  467.  
  468. #search button svg:hover {
  469. fill: {color:Accent Two};
  470. }
  471.  
  472. #wrap {
  473. width: 75%;
  474. left: 25%;
  475. top: 35px;
  476. padding-bottom: 35px;
  477. position: absolute;
  478. }
  479.  
  480. #container {
  481. {block:IfMulticolumn}
  482. width: calc(({select:Post Size} * 2}) + ({text:Post Margin} * 4) + 44px);
  483. {/block:IfMulticolumn}
  484. {block:IfNotMulticolumn}
  485. width: calc({select:Post Size} + 20px + ({text:Post Margin} * 2));
  486. {/block:IfNotMulticolumn}
  487. {block:PermalinkPage}
  488. width: 500px;
  489. {/block:PermalinkPage}
  490. margin: 0 auto;
  491. left: 0;
  492. right: 0;
  493. position: absolute;
  494. }
  495.  
  496. #entries {
  497. {block:IndexPage}
  498. width: {select:Post Size};
  499. {/block:IndexPage}
  500. {block:PermalinkPage}
  501. width: 500px;
  502. {/block:PermalinkPage}
  503. text-align: justify;
  504. margin-top: 60px;
  505. margin-bottom: 60px;
  506. }
  507.  
  508. .post {
  509. width: {select:Post Size};
  510. text-align: justify;
  511. background: {color:Post Background};
  512. border: 1px solid {color:Border};
  513. padding: 10px;
  514. padding-bottom: 0;
  515. {block:IndexPage}
  516. {block:IfShowTags}
  517. margin: 0px {text:Post Margin} calc({text:Post Margin} + 30px);
  518. {/block:IfShowTags}
  519. {block:IfNotShowTags}
  520. margin: 0px {text:Post Margin} calc({text:Post Margin} + 10px);
  521. {/block:IfNotShowTags}
  522. {block:IfMulticolumn}
  523. opacity: 0;
  524. z-index: -1;
  525. {/block:IfMulticolumn}
  526. {/block:IndexPage}
  527. {block:PermalinkPage}
  528. margin: 0 auto;
  529. width: 500px;
  530. {/block:PermalinkPage}
  531. }
  532.  
  533. .post-pad {
  534. height: 6px;
  535. }
  536.  
  537. .post img {
  538. max-width: 100%;
  539. height: auto;
  540. {block:IndexPage}
  541. width: {select:Post Size};
  542. {/block:IndexPage}
  543. {block:PermalinkPage}
  544. width: 100%;
  545. {/block:PermalinkPage}
  546. }
  547.  
  548. .post blockquote {
  549. border-left: 1px solid {color:Border};
  550. margin: -8px 10px 10px 10px;
  551. padding: 0 0 0 15px;
  552. }
  553.  
  554. .caption {
  555. width: 100%;
  556. margin-left: -10px;
  557. border-top: 1px solid {color:Border};
  558. padding: 0 10px;
  559. margin-top: 4px;
  560. }
  561.  
  562. .quote {
  563. text-align: center;
  564. font-size: 13px;
  565. font-style: italic;
  566. padding: 5px 0;
  567. }
  568.  
  569. .source {
  570. font-style: normal;
  571. font-size: {select:Body Font Size};
  572. }
  573.  
  574. .player {
  575. position: absolute;
  576. line-height: 0;
  577. z-index: 1;
  578. overflow: hidden;
  579. width: 27px;
  580. height: 27px;
  581. border-radius: 100%;
  582. margin-left: 26px;
  583. margin-top: 28px;
  584. }
  585.  
  586. .art {
  587. width: 80px;
  588. height: 80px;
  589. position: absolute;
  590. z-index: 0;
  591. }
  592.  
  593. .details {
  594. height: 55px;
  595. text-align: center;
  596. line-height: 15px;
  597. padding-top: 25px;
  598. margin-left: 80px;
  599. }
  600.  
  601. .asker {
  602. margin-bottom: 10px;
  603. font-family: Montserrat;
  604. font-size: 13px;
  605. text-transform: lowercase;
  606. }
  607.  
  608. .asker .avatar img {
  609. width: 20px;
  610. height: 20px;
  611. border-radius: 100%;
  612. float: left;
  613. margin-right: 7px;
  614. }
  615.  
  616. .asker a, .asker {
  617. color: {color:Accent Two};
  618. }
  619.  
  620. .question {
  621. border-top: 1px solid {color:Border};
  622. width: 100%;
  623. padding: 10px;
  624. margin-left: -10px;
  625. }
  626.  
  627. #permalink {
  628. text-transform: uppercase;
  629. font-size: 8px;
  630. line-height: 13px;
  631. height: 13px;
  632. border-top: 1px solid {color:Border};
  633. padding: 7px 0 7px 10px;
  634. letter-spacing: 1px;
  635. width: calc({select:Post Size} + 10px);
  636. margin-left: -10px;
  637. margin-top: 4px;
  638. }
  639.  
  640. #permalink a {
  641. color: {color:Body Font};
  642. }
  643.  
  644. #permalink a:hover .time, .controls a:hover {
  645. background: {color:Accent Two};
  646. }
  647.  
  648. .time {
  649. background: {color:Accent One};
  650. color: {color:Accent Font};
  651. padding: 1px 2px 1px 4px;
  652. border-radius: 2px;
  653. margin-right: 2px;
  654. font-size: 8px;
  655. -webkit-transition: all 0.5s ease;
  656. transition: all 0.5s ease;
  657. }
  658.  
  659. .controls {
  660. -webkit-transition: all 0.5s ease;
  661. transition: all 0.5s ease;
  662. float: right;
  663. margin-top: -21px;
  664. margin-right: -1px;
  665. line-height: 20px;
  666. }
  667.  
  668. .controls svg {
  669. width: 7px;
  670. height: 9px;
  671. overflow: visible;
  672. display: inline-block;
  673. border-radius: 100%;
  674. fill: {color:Accent Font};
  675. text-shadow: 0 0;
  676. -webkit-transition: all 0.5s ease;
  677. transition: all 0.5s ease;
  678. margin-left: 4px;
  679. margin-bottom: 1px;
  680. }
  681.  
  682. .controls a {
  683. position: relative;
  684. background: {color:Accent One};
  685. border-radius: 100%;
  686. width: 15px;
  687. height: 15px;
  688. display: inline-block;
  689. margin-right: 1px;
  690. }
  691.  
  692. .controls .reblog svg {
  693. width: 7px;
  694. height: 7px;
  695. margin-bottom: 2px;
  696. margin-left: 4px;
  697. display: inline-block;
  698. }
  699.  
  700. .controls .like .liked + svg path {
  701. fill: {color:Accent Two};
  702. }
  703.  
  704. .controls .like .like_button iframe {
  705. position: absolute;
  706. top: 0;
  707. left: 0;
  708. bottom: 0;
  709. right: 0;
  710. opacity: 0;
  711. z-index: 2;
  712. }
  713.  
  714. #permpage {
  715. text-transform: uppercase;
  716. text-align: center;
  717. margin-top: 5px;
  718. line-height: 16px;
  719. font-size: 9px;
  720. border-top: 1px solid {color:Border};
  721. border-bottom: 1px solid {color:Border};
  722. width: 520px;
  723. margin-left: -10px;
  724. padding: 10px 0;
  725. }
  726.  
  727. .tags {
  728. text-transform: uppercase;
  729. text-align: center;
  730. {block:IndexPage}
  731. position: absolute;
  732. font-size: 7px;
  733. width: {select:Post Size};
  734. margin-top: 10px;
  735. letter-spacing: 1px;
  736. line-height: 11px;
  737. {/block:IndexPage}
  738. }
  739.  
  740. .tags a {
  741. {block:IndexPage}
  742. color: {color:Body Font};
  743. {/block:IndexPage}
  744. margin-right: 3px;
  745. }
  746.  
  747. .tags a:last-of-type {
  748. margin: 0;
  749. }
  750.  
  751. ol.notes {
  752. padding: 0;
  753. margin: 20px 0px;
  754. list-style-type: none;
  755. }
  756.  
  757. ol.notes li.note {
  758. margin-bottom: 10px;
  759. }
  760.  
  761. ol.notes li.note img.avatar {
  762. border-radius: 100%;
  763. vertical-align: -4px;
  764. margin-right: 10px;
  765. width: 16px;
  766. height: 16px;
  767. }
  768.  
  769. .pagination {
  770. margin: 0 auto;
  771. text-align: center;
  772. position: relative;
  773. margin-top: 40px;
  774. display: block;
  775. font-size: 9px;
  776. {block:IfInfiniteScroll}
  777. display: none;
  778. {/block:IfInfiniteScroll}
  779. }
  780.  
  781. .pagination a, .current_page {
  782. margin: 0 4px;
  783. display: inline-block;
  784. width: 20px;
  785. height: 20px;
  786. text-align: center;
  787. border-radius: 100%;
  788. color: {color:Body Font};
  789. line-height: 20px;
  790. border: 1px solid {color:Border};
  791. }
  792.  
  793. .pagination a:hover {
  794. background: {color:Accent Two};
  795. color: {color:Accent Font};
  796. }
  797.  
  798. .pagination svg {
  799. width: 10px;
  800. height: 10px;
  801. display: inline-block;
  802. fill: {color:Body Font};
  803. margin-bottom: -2px;
  804. }
  805.  
  806. .pagination a svg {
  807. margin-top: 5px;
  808. }
  809.  
  810. .pagination a:hover svg {
  811. fill: {color:Accent Font};
  812. }
  813.  
  814. .current_page {
  815. background: {color:Accent One};
  816. color: {color:Sidebar Background};
  817. }
  818.  
  819. ::selection {
  820. background: {color:Link};
  821. color: #FFF;
  822. }
  823.  
  824. #infscr-loading {
  825. opacity: 0;
  826. line-height: 0px;
  827. }
  828.  
  829. </style>
  830. </head>
  831. <body>
  832.  
  833. <div id="bar"></div>
  834.  
  835. <nav id="top">
  836. <ul>
  837. <li><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 9.185l7 6.514v6.301h-3v-5h-8v5h-3v-6.301l7-6.514zm0-2.732l-9 8.375v9.172h7v-5h4v5h7v-9.172l-9-8.375zm12 5.695l-12-11.148-12 11.133 1.361 1.465 10.639-9.868 10.639 9.883 1.361-1.465z"></svg> <a href="/">Home</a></li>
  838. <li><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10 3.002c4.411 0 8 2.849 8 6.35 0 3.035-3.029 6.311-7.925 6.311-1.58 0-2.718-.317-3.718-.561-.966.593-1.256.813-3.006 1.373.415-1.518.362-2.182.331-3.184-.837-1.001-1.682-2.069-1.682-3.939 0-3.501 3.589-6.35 8-6.35zm0-2.002c-5.281 0-10 3.526-10 8.352 0 1.711.615 3.391 1.705 4.695.047 1.527-.851 3.718-1.661 5.312 2.168-.391 5.252-1.258 6.649-2.115 1.181.289 2.312.421 3.382.421 5.903 0 9.925-4.038 9.925-8.313 0-4.852-4.751-8.352-10-8.352zm11.535 11.174c-.161.488-.361.961-.601 1.416 1.677 1.262 2.257 3.226.464 5.365-.021.745-.049 1.049.138 1.865-.892-.307-.979-.392-1.665-.813-2.127.519-4.265.696-6.089-.855-.562.159-1.145.278-1.74.364 1.513 1.877 4.298 2.897 7.577 2.1.914.561 2.933 1.127 4.352 1.385-.53-1.045-1.117-2.479-1.088-3.479 1.755-2.098 1.543-5.436-1.348-7.348zm-15.035-3.763c-.591 0-1.071.479-1.071 1.071s.48 1.071 1.071 1.071 1.071-.479 1.071-1.071-.48-1.071-1.071-1.071zm3.5 0c-.591 0-1.071.479-1.071 1.071s.48 1.071 1.071 1.071 1.071-.479 1.071-1.071-.48-1.071-1.071-1.071zm3.5 0c-.591 0-1.071.479-1.071 1.071s.48 1.071 1.071 1.071 1.071-.479 1.071-1.071-.48-1.071-1.071-1.071z"></svg> <a href="/mailbox">Ask</a></li>
  839. <li><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.508 11.504l.93-2.494 2.998 6.268-6.31 2.779.894-2.478s-8.271-4.205-7.924-11.58c2.716 5.939 9.412 7.505 9.412 7.505zm7.492-9.504v-2h-21v21h2v-19h19zm-14.633 2c.441.757.958 1.422 1.521 2h14.112v16h-16v-8.548c-.713-.752-1.4-1.615-2-2.576v13.124h20v-20h-17.633z"></svg> <a href="/archive">Archive</a></li>
  840. <li><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M24 10.935v2.131l-8 3.947v-2.23l5.64-2.783-5.64-2.79v-2.223l8 3.948zm-16 3.848l-5.64-2.783 5.64-2.79v-2.223l-8 3.948v2.131l8 3.947v-2.23zm7.047-10.783h-2.078l-4.011 16h2.073l4.016-16z"></svg> <a href="http://pohroro.com" title="Codes by Pohroro">Theme</a></li>
  841. </ul>
  842. </nav>
  843.  
  844. <aside>
  845. <div id="content">
  846.  
  847. {block:IfShowAvatar}<div id="avatar"><img src="{image:Avatar}"></div>{/block:IfShowAvatar}
  848. {block:IfShowTitle}<div id="title">{text:Title}</div>{/block:IfShowTitle}
  849. {block:IfShowSubtitle}<div id="subtitle">{text:Subtitle}</div>{/block:IfShowSubtitle}
  850. {block:IfShowDescription}<div id="description"><span>{Description}</span></div>{/block:IfShowDescription}
  851.  
  852. <nav id="main">
  853. <a href="{text:Link One URL}"><li><b>01.</b> {text:Link One}</li></a>
  854. <a href="{text:Link Two URL}"><li><b>02.</b> {text:Link Two}</li></a><br>
  855. {block:IfCustomLinkThree}<a href="{text:Link Three URL}"><li><b>03.</b> {text:Link Three}</li></a>{/block:IfCustomLinkThree}
  856. {block:IfCustomLinkFour}<a href="{text:Link Four URL}"><li><b>04.</b> {text:Link Four}</li></a><br>{/block:IfCustomLinkFour}
  857. {block:IfCustomLinkFive}<a href="{text:Link Five URL}"><li><b>05.</b> {text:Link Five}</li></a>{/block:IfCustomLinkFive}
  858. {block:IfCustomLinkSix}<a href="javaScript:void(0); id=“popup1link”"><li><b>06.</b> {text:Link Six}</li></a><br>{/block:IfCustomLinkSix}
  859. {block:IfCustomLinkSeven}<a href="{text:Link Seven URL}"><li><b>07.</b> {text:Link Seven}</li></a>{/block:IfCustomLinkSeven}
  860. {block:IfCustomLinkEight}<a href="{text:Link Eight URL}"><li><b>08.</b> {text:Link Eight}</li></a>{/block:IfCustomLinkEight}
  861. </ul>
  862. </nav>
  863.  
  864. {block:Pagination}
  865. <div class="pagination">
  866. {block:PreviousPage}
  867. <a href="{PreviousPage}" class="jump_page"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M137.3,43.2c-2.5-2.1-6.3-1.8-8.5,0.7L78,104.1c-1.9,2.2-1.9,5.5,0,7.7l50.8,60.3c1.2,1.4,2.9,2.1,4.6,2.1 c1.4,0,2.7-0.5,3.9-1.4c2.5-2.1,2.9-5.9,0.7-8.5L90.4,108L138,51.6C140.1,49.1,139.8,45.3,137.3,43.2z"/>
  868. </svg></a>
  869. {/block:PreviousPage}
  870.  
  871. {block:JumpPagination length="3"}
  872. {block:CurrentPage}
  873. <span class="current_page">{PageNumber}</span>
  874. {/block:CurrentPage}
  875.  
  876. {block:JumpPage}
  877. <a class="jump_page" href="{URL}">{PageNumber}</a>
  878. {/block:JumpPage}
  879. {/block:JumpPagination}
  880.  
  881. {block:NextPage}
  882. <a href="{NextPage}" class="jump_page"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M78.7,172.8c1.1,0.9,2.5,1.4,3.9,1.4c1.7,0,3.4-0.7,4.6-2.1l50.8-60.3c1.9-2.2,1.9-5.5,0-7.7L87.2,43.9 c-2.1-2.5-5.9-2.9-8.5-0.7c-2.5,2.1-2.9,5.9-0.7,8.5l47.5,56.4L78,164.4C75.9,166.9,76.2,170.7,78.7,172.8z"/></svg></a>
  883. {/block:NextPage}
  884. </div>
  885. {/block:Pagination}
  886.  
  887. </div>
  888. </aside>
  889.  
  890. <div id="right-bar">
  891. <div id="searchbar">
  892. <form action="/search" method="get" id="search">
  893. <input type="text" name="q" value="">
  894. <button type="submit">
  895. <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.172 24l-7.387-7.387c-1.388.874-3.024 1.387-4.785 1.387-4.971 0-9-4.029-9-9s4.029-9 9-9 9 4.029 9 9c0 1.761-.514 3.398-1.387 4.785l7.387 7.387-2.828 2.828zm-12.172-8c3.859 0 7-3.14 7-7s-3.141-7-7-7-7 3.14-7 7 3.141 7 7 7z"></svg>
  896. </svg></button>
  897. </div>
  898.  
  899. </div>
  900.  
  901. <div id="wrap">
  902. <div id="container">
  903. <div id="entries">
  904.  
  905. {block:Posts}
  906. <div class="post" id="{PostID}">
  907. {block:Text}
  908. {block:Title}<h1>{Title}</h1>{/block:Title}
  909. {Body}
  910. {/block:Text}
  911.  
  912. {block:Photo}
  913. {LinkOpenTag}<img src="{PhotoURL-HighRes}" width="100%">{LinkCloseTag}
  914. {/block:Photo}
  915.  
  916. {block:Photoset}
  917. <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>
  918. <div class="post-pad"></div>
  919. {/block:Photoset}
  920.  
  921. {block:Quote}
  922. <div class="quote">
  923. {Quote}<br>
  924. {block:Source}<span class="source">&#8212; {Source}</span>{/block:Source}
  925. </div>
  926. {/block:Quote}
  927.  
  928. {block:Link}
  929. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  930. {block:Description}{Description}{/block:Description}
  931. {/block:Link}
  932.  
  933. {block:Chat}
  934. {block:Title}<h1>{Title}</h1>{/block:Title}
  935. {block:Lines}
  936. {block:Label}<b>{Label}</b>{/block:Label}
  937. {Line}<br>
  938. {/block:Lines}
  939. {/block:Chat}
  940.  
  941. {block:Audio}
  942. <div class="audio">
  943. <div class="player">{AudioPlayerGrey}</div>
  944. <div class="art">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  945. <div class="details">
  946. {block:TrackName}<span class="title">{TrackName}</span>{/block:TrackName}<br>
  947. by {block:Artist}<span class="artist">{Artist}</span>{/block:Artist}</div>
  948. </div>
  949. <div class="post-pad"></div>
  950. {/block:Audio}
  951.  
  952. {block:Video}
  953. <div class="video">{Video-500}</div>
  954. <div class="post-pad"></div>
  955. {/block:Video}
  956.  
  957. {block:ReblogParent}
  958. <!--{SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  959. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  960. {/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}-->
  961. {/block:ReblogParent}
  962.  
  963. {block:Answer}
  964. <div class="asker">
  965. <div class="avatar"><img src="{AskerPortraitURL-24}"></div>
  966. <span>{Asker} asked:</span></div>
  967. <div class="question">{Question}</div>
  968. <div class="caption">{Answer}</div>
  969. {/block:Answer}
  970.  
  971. {block:IfShowCaptions}
  972. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  973. {/block:IfShowCaptions}
  974.  
  975. {block:IndexPage}
  976. <div id="permalink">
  977. <a href="{Permalink}"><span class="time">{TimeAgo}</span> {NoteCountWithLabel}</div></a>
  978. <div class="controls">
  979. <a href="{ReblogURL}" target="_blank" class="reblog" title="Reblog">
  980. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://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>
  981. </a>
  982. <a href="#" class="like" title="Like">{LikeButton}
  983. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://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>
  984. </a>
  985. </div>
  986.  
  987. {block:IfShowTags}
  988. {block:IndexPage}
  989. <div class="tags">
  990. {block:Tags}<a href="{TagURL}">#{Tag} </a>{/block:Tags}
  991. </div>
  992. {/block:IndexPage}
  993. {/block:IfShowTags}
  994.  
  995. </div>
  996. {/block:IndexPage}
  997.  
  998. {block:PermalinkPage}
  999. {block:IfNotShowCaption}{block:Caption}{Caption}{/block:Caption}{block:IfNotShowCaption}
  1000. {block:Date}<div id="permpage">
  1001. Posted {TimeAgo} {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}<br>
  1002. {block:RebloggedFrom}Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>, Source: <a href="{ReblogRootURL}">{ReblogRootName}</a><br>{/block:RebloggedFrom}
  1003. {block:HasTags}Tagged: {block:Tags}<a href="{TagURL}">#{Tag} </a>{/block:Tags}{/block:HasTags}
  1004. </div>{/block:Date}
  1005. {/block:PermalinkPage}
  1006.  
  1007. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1008.  
  1009. {/block:Posts}
  1010.  
  1011. </div>
  1012. </div>
  1013. </div>
  1014.  
  1015. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1016. <script src="https://static.tumblr.com/yzs4yqx/BV3o343ow/smoothscroll.min.js"></script>
  1017. <script src="https://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script>
  1018. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1019. <script src="https://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1020. {block:IndexPage}
  1021. {block:IfMulticolumn}
  1022. <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1023. {/block:IfMulticolumn}
  1024. {block:IfInfiniteScroll}
  1025. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1026. {/block:IfInfiniteScroll}
  1027. {/block:IndexPage}
  1028.  
  1029. <script>
  1030. $(document).ready(function(){
  1031. $('.photo-slideshow').pxuPhotoset({
  1032. lightbox: true,
  1033. rounded: false,
  1034. gutter: '3px',
  1035. photoset: '.photo-slideshow',
  1036. photoWrap: '.photo-data',
  1037. photo: '.pxu-photo'
  1038. });
  1039.  
  1040. {block:IndexPage}
  1041. var $container = $('#container');
  1042.  
  1043. {block:IfMulticolumn}
  1044. $container.masonry({ itemSelector: '.post' });
  1045. $container.imagesLoaded(function(){
  1046. $container.masonry();
  1047. $container.find('.post').animate({ opacity: 1, zIndex: 1 });
  1048. });
  1049. {/block:IfMulticolumn}
  1050.  
  1051. {block:IfInfiniteScroll}
  1052. $container.infinitescroll({
  1053. itemSelector: '.post',
  1054. navSelector: '.pagination',
  1055. nextSelector: '.pagination a',
  1056. loadingImg: '',
  1057. loadingText: '<em></em>',
  1058. bufferPx: 2000
  1059. },
  1060.  
  1061. function( newElements ) {
  1062. var $newElems = $(newElements);
  1063. var $newElemsIDs = $newElems.map(function(){
  1064. return this.id;
  1065. }).get();
  1066. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1067. $newElems.find('.photo-slideshow').pxuPhotoset({
  1068. lightbox: true,
  1069. rounded: false,
  1070. gutter: '3px',
  1071. photoset: '.photo-slideshow',
  1072. photoWrap: '.photo-data',
  1073. photo: '.pxu-photo'
  1074. },
  1075.  
  1076. function(){
  1077. resizeVideos();
  1078. {block:IfMulticolumn}
  1079. },
  1080.  
  1081. function(){
  1082. $container.masonry();
  1083. });
  1084.  
  1085. $newElems.imagesLoaded(function(){
  1086. $container.masonry( 'appended', $newElems );
  1087. $newElems.animate({ opacity: 1, zIndex: 1 });
  1088. {/block:IfMulticolumn}
  1089. });
  1090. });
  1091. {/block:IfInfiniteScroll}
  1092. {/block:IndexPage}
  1093. });
  1094. </script>
  1095. <div id="popupbg"></div>
  1096.  
  1097.  
  1098.  
  1099.  
  1100. <div class="popup" id="popup1"><div class="popupclosecont closepopup1"><div class="popupclose closepopup1">X</div></div>
  1101.  
  1102. <!-- Content goes in here -->
  1103.  
  1104.  
  1105.  
  1106.  
  1107.  
  1108. <h1>Title</h1>
  1109.  
  1110. <p>Here's a paragraph.</p>
  1111.  
  1112. <p>Here's another one.</p>
  1113.  
  1114.  
  1115.  
  1116.  
  1117.  
  1118. <!-- End content -->
  1119.  
  1120. </div>
  1121. </body>
  1122.  
  1123. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!