API tools faq
paste
Advertisement
Laighlin

#15: Tile Dream

Laighlin
Mar 8th, 2017
7,351
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 25.53 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <!--[if IE 7]><html lang="en" class="ie7"><![endif]-->
  3. <!--[if IE 8]><html lang="en" class="ie8"><![endif]-->
  4. <!--[if IE 9]><html lang="en" class="ie9"><![endif]-->
  5. <!--[if (gt IE 9)|!(IE)]><html lang="en"><![endif]-->
  6. <!--[if !IE]><html lang="en-US"><![endif]-->
  7. <html>
  8. <head>
  9.  
  10. <!--
  11.  
  12. Tile Dream by Laighlin
  13.  
  14.  
  15. Enjoy! Don't hesitate to contact me at @linthm if you have
  16. any comments or questions.
  17.  
  18. Credits:
  19.  - Alternating blockquote color tutorial by @magistramagi
  20.  - Custom tooltip plugin by Malihu on GitHub
  21.  - Navigation Icons from Font Awesome
  22.  - All fonts from Google Fonts
  23.  - Default sidebar image by John Towner
  24.  
  25. Last edit: 19.06.2017 (Fixed some buggy read mores.)
  26.  
  27. -->
  28.  
  29. <meta charset="utf-8">
  30.  
  31. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  32. <title>{Title}{block:SearchPage} // {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary} // {PostSummary}{/block:PostSummary}</title>
  33. {block:ifCustomFavicon}
  34. <link rel="shortcut icon" href="{image:favicon}">
  35. {/block:ifCustomFavicon}
  36. {block:ifNotCustomFavicon}
  37. <link rel="shortcut icon" href="{Favicon}">
  38. {/block:ifNotCustomFavicon}
  39. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  40. <link href="https://fonts.googleapis.com/css?family=Noto+Sans:400,400i,700,700i|Orbitron:400,700|PT+Sans+Narrow" rel="stylesheet">
  41. <link href="#s-m-t-tooltip" rel="stylesheet" type="text/css" />
  42.  
  43. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  44. <meta name="viewport" content="width=device-width, initial-scale=1">
  45.  
  46. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  47.  
  48. <meta name="image:Sidebar background" content="http://static.tumblr.com/e69668ce603e8589e245f78a5808e00b/xwoxjom/IAYomgqd2/tumblr_static_e0xqxcnj35wg480gcg8w8cg4c.jpg"/>
  49. <meta name="image:Favicon" content=""/>
  50. <meta name="if:Custom favicon" content="0"/>
  51. <meta name="if:500px posts" content="1"/>
  52. <meta name="if:Blurred sidebar image" content="1"/>
  53. <meta name="if:Search bar" content="1"/>
  54. <meta name="if:Borders" content="0"/>
  55. <meta name="if:Rounded corners" content="1"/>
  56. <meta name="if:Hide captions" content="0"/>
  57. <meta name="if:Hide tags" content="0"/>
  58. <meta name="if:Numbered custom links" content="0"/>
  59.  
  60. <meta name="select:Sidebar background size" title="cover" content="no-repeat;background-size:cover"/>
  61. <meta name="select:Sidebar background size" title="tiled" content="repeat"/>
  62.  
  63. <meta name="color:Background color" content="#d7d5d3"/>
  64. <meta name="color:Borders" content="#ccc"/>
  65. <meta name="color:Sidebar background" content="#033e35"/>
  66. <meta name="color:Title" content="#fff"/>
  67. <meta name="color:Title background" content="#3d6d4f"/>
  68. <meta name="color:Description text" content="#333"/>
  69. <meta name="color:Post background" content="#fff"/>
  70. <meta name="color:Post text" content="#333"/>
  71. <meta name="color:Bold" content="#b06b80"/>
  72. <meta name="color:Italic" content="#30b396"/>
  73. <meta name="color:Link" content="#949494"/>
  74. <meta name="color:Link hover" content="#4e978e"/>
  75. <meta name="color:Selection text" content="#fff"/>
  76. <meta name="color:Selection background" content="#2f7b5f"/>
  77. <meta name="color:Scrollbar" content="#255a47"/>
  78. <meta name="color:Extra links background" content="#524139"/>
  79. <meta name="color:Extra links text" content="#fff"/>
  80. <meta name="color:Blockquotes 1" content="#a58975"/>
  81. <meta name="color:Blockquotes 2" content="#298465"/>
  82. <meta name="color:Post footer background" content="#2d5a43"/>
  83. <meta name="color:Post footer text" content="#fff"/>
  84. <meta name="color:Tags" content="#fff"/>
  85. <meta name="color:Tags hover" content="#ddd"/>
  86.  
  87. <!-- text fields -->
  88. <meta name="text:Body font" content="Noto Sans"/>
  89. <meta name="text:Body font size" content="13px"/>
  90.  
  91. <style type="text/css">
  92.  
  93. body {
  94.     margin:0px;
  95.     background:{color:background color};
  96.     color:{color:post text};
  97.     font-family:'{text:body font}', 'noto sans', sans-serif;
  98.     font-size:{text:body font size};
  99.     word-wrap:break-word;
  100. }
  101.  
  102. #desc p:first-child, .pad p:first-child {
  103.     margin-top:-3px;
  104. }
  105.  
  106. #desc p:last-child, .pad p:last-child {
  107.     margin-bottom:-5px;
  108. }
  109.  
  110. a {
  111.     transition:.2s ease-in-out;
  112.     text-decoration:none;
  113.     outline:none;
  114.     -moz-outline-style:none;
  115. }
  116.  
  117. .pad a, #desc a, .media_wrap a {
  118.     color:{color:link};
  119. }
  120.  
  121. .pad a, #desc a {
  122.     border-bottom:1px solid;
  123. }
  124.  
  125. .title a { border:none; color:{color:title} !important; }
  126.  
  127. .pad a:hover, #desc a:hover, .media_wrap a:hover {
  128.     color:{color:link hover};
  129.     border-color:transparent;
  130. }
  131.  
  132. b, strong {
  133.     color:{color:bold};
  134. }
  135.  
  136.  
  137. i, em {
  138.     color:{color:italic};
  139. }
  140.  
  141. img {
  142.     border:none;
  143.     max-height:100%;
  144.     max-width:100%;
  145. }
  146.  
  147.  
  148. blockquote, blockquote blockquote {
  149.     padding-left:7px;
  150.     border-left:4px solid;
  151.     margin-left:2px;
  152.     margin-right:0;
  153. }
  154.  
  155. .tumblr_blog {
  156.     font-weight:bold;
  157.     margin-right:1px;
  158.     letter-spacing:.5px;
  159. }
  160.  
  161. h1 {
  162.     font-size:130%;
  163. }
  164.  
  165. ::selection {
  166.   background: {color:Selection background};
  167.   color: {color:selection text};
  168. }
  169.  
  170. ::-moz-selection {
  171.   background: {color:Selection background};
  172.   color: {color:selection text};
  173. }
  174.  
  175. ::-webkit-scrollbar {
  176.     width:8px;
  177.     height:8px;
  178. }
  179.  
  180. ::-webkit-scrollbar-thumb {
  181.     background:{color:scrollbar};
  182.     background-clip:padding-box;
  183. }
  184.  
  185. ::-webkit-scrollbar-track {
  186.     background:{color:background color};
  187. }
  188.  
  189. #s-m-t-tooltip {
  190.     margin-left:13px;
  191.     background:{color:extra links text};
  192.     color:{color:extra links background};
  193.     padding:5px;
  194.     font:italic 95% 'noto sans';
  195.     border-left:4px solid {color:borders};
  196.     z-index:9999999999;
  197.     pointer-events:none;
  198. }
  199.  
  200. .like {
  201.     position:relative;
  202. }
  203.  
  204. .like svg {
  205.     margin-top:4px;
  206. }
  207.  
  208. .like svg path {
  209.     fill: {color:post footer text};
  210. }
  211.  
  212. .like .like_button {
  213.     position: absolute;
  214.     margin-top: -23px;
  215.     margin-left:3px;
  216.     opacity:0;
  217. }
  218.  
  219. .like .like_button.liked {
  220.     opacity:1;
  221.     z-index:9999;
  222. }
  223.  
  224. .col {
  225.     top:0;
  226. }
  227.  
  228. #middle {
  229.     max-width:550px;
  230.     {block:if500pxPosts}
  231.     left:calc(50% - 155px);
  232.     {/block:if500pxPosts}
  233.     {block:ifNot500pxPosts}
  234.     left:calc(50% - 105px);
  235.     {/block:ifNot500pxPosts}
  236.     position:absolute;
  237. }
  238.  
  239. #lefthand {
  240.     width:300px;
  241.     {block:if500pxPosts}
  242.     left:calc(50% - 485px);
  243.     {/block:if500pxPosts}
  244.     {block:ifNot500pxPosts}
  245.     left:calc(50% - 435px);
  246.     {/block:ifNot500pxPosts}
  247. }
  248.  
  249. #righthand {
  250.     width:100px;
  251.     {block:if500pxPosts}
  252.     left:calc(50% + 385px);
  253.     {/block:if500pxPosts}
  254.     {block:ifNot500pxPosts}
  255.     left:calc(50% + 335px);
  256.     {/block:ifNot500pxPosts}
  257. }
  258.  
  259. #lefthand, #righthand {
  260.     position:fixed;
  261.     height:100%;
  262.     z-index:4;
  263.     overflow:hidden;
  264.     background:{color:sidebar background};
  265.     display:flex;
  266.     flex-flow:column nowrap;
  267.     align-items:center;
  268.     justify-content:center;
  269.     transition:.3s all ease;
  270. }
  271.  
  272. #lefthand:before, #righthand:before {
  273.     content:'';
  274.     position:absolute;
  275.     top:-10px;
  276.     left:-10px;
  277.     bottom:-10px;
  278.     right:-10px;
  279.     background:url({image:sidebar background}) {select:sidebar background size};
  280.     filter:{block:ifBlurredSidebarImage} blur(2px) {/block:ifBlurredSidebarImage} opacity(.8);
  281. }
  282.  
  283. #lefthand:before {
  284.     background-position:left;
  285. }
  286.  
  287. #righthand:before {
  288.     background-position:center;
  289. }
  290.  
  291. {block:ifBlurredSidebarImage}
  292. #lefthand:hover:before, #righthand:hover:before {
  293.     filter:blur(4px) opacity(.8);
  294. }
  295. {/block:ifBlurredSidebarImage}
  296.  
  297. #leftbar {
  298.     max-width:250px;
  299.     z-index:10;
  300. }
  301.  
  302. .title, #title {
  303.     color:{color:title};
  304.     font:bold 120% 'Orbitron', monospace;
  305.     letter-spacing:1px;
  306.     text-transform:uppercase;
  307.     background:{color:Title background};
  308.     text-align:center;
  309. }
  310.  
  311. #title {
  312.     margin-bottom:6px;
  313. }
  314.  
  315. .title.text {
  316.     margin-bottom:-10px;
  317. }
  318.  
  319. .title {
  320.     margin:-10px -10px;
  321.     padding:10px 7px 7px;
  322. }
  323.  
  324. .search_page {
  325.     margin:-10px;
  326. }
  327.  
  328. #desc {
  329.     color:{color:description text};
  330.     background:{color:Post background};
  331.     font-size:95%;
  332.     overflow-y:auto;
  333. }
  334.  
  335. #title, #desc {
  336.     position:relative;
  337.     padding:7px;
  338.     z-index:10;
  339. }
  340.  
  341. #navcont {
  342.     margin:0 -3px 6px;
  343.     display:flex;
  344.     align-items:center;
  345.     justify-content:center;
  346. }
  347.  
  348. a.nav, .a.pag {
  349.     padding:3px 4px 4px;
  350.     background:{color:extra links background};
  351.     color:{color:extra links text};
  352. }
  353.  
  354. a.nav { margin:0 3px; padding:4px; }
  355.  
  356. .nav.fa, .pag.fa {
  357.     width:29px;
  358.     height:29px;
  359.     font-size:22px;
  360.     text-align:center;
  361.     line-height:28px;
  362. }
  363.  
  364. .nav.fa.fa-home {
  365.     font-size:25px;
  366.     line-height:31px;
  367.     margin-left:2px;
  368. }
  369.  
  370. .nav.fa.fa-folder-open {
  371.     line-height:30px;
  372.     width:30px;
  373. }
  374.  
  375. form#search_bar {
  376.     margin-top:6px;
  377.     height:33px;
  378.     display:flex;
  379. }
  380.  
  381. #search_bar input, button {
  382.     padding:2px;
  383.     outline:none;
  384. }
  385.  
  386. #search_bar input {
  387.     background-color:{color:post footer background};
  388.     color:{color:post footer text};
  389.     flex-grow:3;
  390.     font:95% {text:body font};
  391. }
  392.  
  393. #search_bar button {
  394.     width:33px;
  395.     margin-left:6px;
  396.     padding:3px;
  397.     font-size:18px;
  398.     color:{color:extra links text};
  399.     background:{color:extra links background};
  400.     transition:.2s all ease;
  401.     cursor:pointer;
  402. }
  403.  
  404. #search_bar button:hover {
  405.     border-color:transparent;
  406. }
  407.  
  408. .search_query:before {
  409.     content:"\201C";
  410. }
  411.  
  412. .search_query:after {
  413.     content:"\201D";
  414. }
  415.  
  416. #entries {
  417.     margin:auto;
  418.     position:relative;
  419.     {block:if500pxPosts}
  420.     width:508px;
  421.     {/block:if500pxPosts}
  422.     {block:ifNot500pxPosts}
  423.     width:408px;
  424.     {/block:ifNot500pxPosts}
  425. }
  426.  
  427. .pad, .info, .footer_wrap {
  428.     margin-top:6px;
  429.     position:relative;
  430. }
  431.  
  432. .pad {
  433.     padding:10px;
  434.     background:{color:Post background};
  435.     {block:if500pxPosts}
  436.     width:480px;
  437.     {/block:if500pxPosts}
  438.     {block:ifNot500pxPosts}
  439.     width:380px;
  440.     {/block:ifNot500pxPosts}
  441. }
  442.  
  443. .title.text:empty { background:none;margin-bottom:-24px; }
  444.  
  445. .text_body {
  446.     padding:20px 0 0;
  447. }
  448.  
  449. .text_body:empty { margin:0; }
  450.  
  451. .media_wrap {
  452.     background:{color:Post background};
  453. }
  454.  
  455. a.title {
  456.     color:{color:title};
  457. }
  458.  
  459. .media_wrap.pic {
  460.     line-height:0;
  461. }
  462.  
  463. .media_wrap.quo {
  464.     font-family:'pt sans narrow', serif;
  465.     font-size:150%;
  466.     padding:5px;
  467.     letter-spacing:.5px;
  468. }
  469.  
  470. {block:ifHideCaptions}
  471. .pad.caption {
  472.     display:none;
  473.     {block:PermalinkPage}
  474.     display:block;
  475.     {/block:PermalinkPage}
  476. }
  477. {/block:ifHideCaptions}
  478.  
  479. .short {
  480.     {block:if500pxPosts}
  481.     width:380px;
  482.     {/block:if500pxPosts}
  483.     {block:ifNot500pxPosts}
  484.     width:280px;
  485.     {/block:ifNot500pxPosts}
  486.     height:66px;
  487.     overflow-y:auto;
  488.     overflow-x:hidden;
  489.     float:right;
  490.     margin:0;
  491. }
  492.  
  493. .sq {
  494.     width:86px;
  495.     height:86px;
  496.     float:left;
  497. }
  498.  
  499. .sq .fa-link {
  500.     background:{color:Title background};
  501.     color:{color:title};
  502.     font-size:70px;
  503.     text-align:center;
  504.     line-height:90px;
  505.     width:86px;
  506.     height:86px;
  507. }
  508.  
  509. .info {
  510.     text-align:center;
  511.     text-transform:uppercase;
  512.     font:95% 'noto sans',sans-serif;
  513.     display:flex;
  514.     width:calc(100% + 6px);
  515.     margin-left:-3px;
  516. }
  517.  
  518. .inf {
  519.     background:{color:post footer background};
  520.     color:{color:post footer text};
  521.     height:26px;
  522.     display:inline-block;
  523.     margin:0 3px;
  524. }
  525.  
  526. .inf {
  527.     width:26px;
  528.     transition:.3s all ease;
  529. }
  530.  
  531. .inf.note_count {
  532.     font:bold 13px orbitron;
  533.     letter-spacing:.5px;
  534.     padding:0 5px;
  535.     line-height:27px;
  536.     width:auto;
  537. }
  538.  
  539. .fa.inf {
  540.     line-height:26px;
  541.     font-size:20px;
  542. }
  543.  
  544. .inf.stretcher {
  545.     max-width:100%;
  546.     flex-grow:2;
  547.     min-width:3px;
  548.     pointer-events:none;
  549. }
  550.  
  551. .asked {
  552.     font:bold 13px orbitron;
  553.     text-transform:uppercase;
  554.     margin-top:-2px;
  555.     letter-spacing:1px;
  556. }
  557.  
  558. .ans {
  559.     text-align:right;
  560. }
  561.  
  562. .tags {
  563.     display:inline;
  564.     color:{color:tags};
  565.     padding:3px;
  566. }
  567.  
  568. .tags:hover {
  569.     color:{color:tags hover};
  570. }
  571.  
  572. .tag_btn {
  573.     cursor:pointer;
  574. }
  575.  
  576. .tag_cont {
  577.     background:{color:post footer background};
  578.     color:{color:post footer text};
  579.     font-size:95%;
  580.     padding:3px;
  581.     {block:ifHideTags}
  582.     display:none;
  583.     {block:PermalinkPage}
  584.     display:block;
  585.     {/block:PermalinkPage}
  586.     {/block:ifHideTags}
  587. }
  588.  
  589. #note {
  590.     overflow-x:hidden;
  591.     text-align:center;
  592.     margin-top:6px;
  593.     {block:if500pxPosts}
  594.     width:480px;
  595.     {/block:if500pxPosts}
  596.     {block:ifNot500pxPosts}
  597.     width:380px;
  598.     {/block:ifNot500pxPosts}
  599.     max-height:350px;
  600.     overflow-y:auto;
  601.     overflow-x:hidden;
  602. }
  603.  
  604. #note ol.notes {
  605.     list-style-type:none;
  606.     margin:5px;
  607.     padding:5px;
  608. }
  609.  
  610. #note ol.notes img.avatar {
  611.     margin-right: 5px;
  612.     margin-bottom:-3px;
  613.     width: 16px;
  614.     height: 16px;
  615.     border-radius:3px;
  616. }
  617.  
  618. #note ol.notes li {
  619.     padding:3px;
  620. }
  621.  
  622. .aud {
  623.     height:30px;
  624.     width:23px;
  625.     overflow:hidden;
  626.     position:relative;
  627.     margin-top:16px;
  628.     margin-left:14px;
  629. }
  630.  
  631. .audholder {
  632.     position:absolute;
  633.     z-index:30;
  634.     background:#f3f3f3;
  635.     margin-top:17px;
  636.     margin-left:17px;
  637.     width:60px;
  638.     height:60px;
  639.     opacity:.7;
  640.     border-radius:5px;
  641. }
  642.  
  643. #song {
  644.     height:51px;
  645.     padding:15px;
  646.     background:transparent;
  647. }
  648.  
  649. .chat {
  650.     margin:2px -10px;
  651.     padding:1px 4px;
  652.     border-bottom:1px solid {color:borders};
  653. }
  654.  
  655. .chat:first-child {
  656.     margin-top:-4px;
  657. }
  658.  
  659. .chat:last-child {
  660.     border:none;
  661.     margin-bottom:-5px;
  662. }
  663.  
  664. #linkcont {
  665.     position:relative;
  666.     margin-top:3px;
  667.     margin-left:-3px;
  668.     width:256px;
  669.     display:flex;
  670.     flex-flow:row wrap;
  671.     counter-reset:links;
  672.     text-align:right;
  673. }
  674.  
  675. .links {
  676.     {block:ifNumberedCustomLinks}
  677.     padding:4px 5px 5px 35px;
  678.     width:202px;
  679.     {/block:ifNumberedCustomLinks}
  680.     {block:ifNotNumberedCustomLinks}
  681.     padding:4px 5px;
  682.     flex-grow:2;
  683.     {/block:ifNotNumberedCustomLinks}
  684.     display:inline-block;
  685.     position:relative;
  686.     font:13px 'noto sans';
  687.     text-transform:uppercase;
  688.     text-align:center;
  689.     margin:3px;
  690.     transition:.2s all ease;
  691.     letter-spacing:.5px;
  692. }
  693.  
  694. {block:ifNumberedCustomLinks}
  695. .links:before {
  696.     counter-increment:links;
  697.     content:counter(links,decimal-leading-zero)".";
  698.     left:5px;
  699.     top:4px;
  700.     position:absolute;
  701.     background:{color:Title background};
  702.     color:{color:title};
  703.     font:bold 11px orbitron;
  704.     height:17px;
  705.     line-height:17px;
  706.     width:27px;
  707.     padding:5px 0 5px;
  708.     margin-left:-5px;
  709.     margin-top:-4px;
  710. }
  711. {/block:ifNumberedCustomLinks}
  712.  
  713. .links, .nav, .pag {
  714.     background:{color:extra links background};
  715.     color:{color:extra links text};
  716. }
  717.  
  718. a.pag {
  719.     margin:6px;
  720.     display:block;
  721.     padding:3px;
  722. }
  723.  
  724. a.pag.num {
  725.     font:bold 18px orbitron;
  726.     height:29px;
  727.     width:29px;
  728.     text-align:center;
  729.     line-height:28px;
  730. }
  731.  
  732. a.pag.cur {
  733.     font:bold 23px orbitron;
  734.     height:37px;
  735.     width:37px;
  736.     margin-left:2px;
  737.     text-align:center;
  738.     line-height:35px;
  739.     background:{color:extra links text};
  740.     color:{color:extra links background};
  741.     pointer-events:none;
  742. }
  743.  
  744. a.pag.fa {
  745.     background:{color:Title background};
  746.     color:{color:title};
  747. }
  748.  
  749. #rightbar {
  750.     z-index:10;
  751. }
  752.  
  753. .links:hover, .nav:hover, .pag:hover, .inf:hover {
  754.     border-color:transparent;
  755. }
  756.  
  757. .photoset { padding:0; }
  758.  
  759. .post { margin:40px auto; }
  760.  
  761. #title, #desc, a.nav, a.pag, .inf, #search_bar button, #search_bar input, .pad, .media_wrap, .tag_cont, .links {
  762.     {block:ifBorders}
  763.     border:4px solid {color:borders};
  764.     background-clip:padding-box;
  765.     {/block:ifBorders}
  766.     {block:ifNotBorders}
  767.     border:4px solid transparent;
  768.     {/block:ifNotBorders}
  769.     {block:ifRoundedCorners}
  770.     border-radius:4px;
  771.     {/block:ifRoundedCorners}
  772. }
  773.  
  774. {block:ifNotBorders}
  775. a.nav:hover, a.pag:hover, .inf:hover, #search_bar button:hover, #search_bar input:focus, .links:hover {
  776.     border-color:{color:borders};
  777. }
  778. {/block:ifNotBorders}
  779.  
  780. .floclear { clear:both; }
  781.  
  782. {CustomCSS}
  783.  
  784. </style>
  785.  
  786. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  787. <script type="text/javascript">
  788. $(document).ready(function() {
  789.     $("[title]").style_my_tooltips({
  790.         tip_follows_cursor:true,
  791.         tip_delay_time:200,
  792.         tip_fade_speed:300
  793.     });
  794.     $(".tag_btn").click(function() {
  795.         var $info = $(this).parent();
  796.         var $footer_wrap = $info.parent();
  797.         $footer_wrap.children(".tag_cont").slideToggle(150);
  798.     });
  799.     var colors = ["{color:blockquotes 1}","{color:blockquotes 2}"];
  800.     $('body').find('blockquote').each( function (i) {
  801.         $(this).css("border-left-color", colors[i % colors.length]);
  802.     });
  803. })(jQuery);
  804. </script>
  805. <script type="text/javascript" src="https://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  806.  
  807. </head>
  808.  
  809. <body>
  810.  
  811. <div id="main_wrap">
  812.  
  813. <div id="lefthand" class="col">
  814.  
  815. <div class="wrap" id="leftbar">
  816.     <div id="title">
  817.       {Title}
  818.     </div>
  819.     <div id="navcont">
  820.         <a class="nav fa fa-home" href="/" title="{lang:Home}"></a>
  821.         {block:AskEnabled}<a class="nav fa fa-pencil" href="/ask" title="Ask"></a>{/block:AskEnabled}
  822.         {block:SubmissionsEnabled}<a class="nav fa fa-envelope" href="/submit" title="Submit"></a>{/block:SubmissionsEnabled}
  823.         <a class="nav fa fa-folder-open" href="/archive" title="{lang:Archive}"></a>
  824.         <a class="nav fa fa-code" href="http://linthm.tumblr.com/thm" title="Tile Dream &#169; Laighlin"></a>
  825.     </div>
  826.     <div id="desc">
  827.       <p>{Description}</p>
  828.     </div>
  829.  
  830. {block:ifSearchBar}
  831.     <form id="search_bar" action="/search" method="get">
  832.     <input type="text" name="q" value="{URLSafeSearchQuery}"/>
  833.     <button type="submit" value="search" title="{lang:Search}"><span class="fa fa-search"></span></button>
  834.     </form>
  835. {/block:ifSearchBar}
  836.    
  837. {block:HasPages}
  838. <div id="linkcont">
  839.     {block:Pages} <a href="{URL}" class="links">
  840.       {Label}</a>{/block:Pages}
  841.   </div>
  842.   {/block:HasPages}
  843. </div></div>
  844.  
  845.   <div id="middle" class="col">
  846.   <div id="entries">
  847.   {block:SearchPage}
  848.         <div class="post"><div class="pad"><div class="title search_page">
  849.     {block:SearchResults}
  850.         {lang:SearchResultCount results for SearchQuery 2}
  851.     {/block:SearchResults}
  852.     {block:NoSearchResults}
  853.         {lang:No search results for SearchQuery 2}
  854.     {/block:NoSearchResults}
  855.         </div></div></div>
  856.   {/block:SearchPage}
  857.   {block:TagPage}
  858.         <div class="post"><div class="pad"><div class="title search_page">
  859.         {lang:Posts tagged Tag 3}
  860.         </div></div></div>
  861.   {/block:TagPage}
  862.     {block:Posts inlineMediaWidth="350px"}
  863.     <div class="post" id="{PostID}">
  864.       {block:Text}
  865.     <div class="pad">
  866.       <div class="title text">{block:Title}{Title}{/block:Title}</div>
  867.       <div class="text_body">{Body}{block:More}
  868.       <center><a class="read-more" href="{Permalink}">{lang:Keep reading} &nbsp;<span class="fa fa-angle-right"></span></a></center>
  869.       {/block:More}</div></div>
  870.       {/block:Text}
  871.    
  872.       {block:Photo}
  873.       <div class="media_wrap pic">{LinkOpenTag}<img src="{PhotoURL-500}" alt="Image">{LinkCloseTag}</div>
  874.       {block:Caption}<div class="pad caption">{Caption}
  875.       {block:More}
  876.       <center><a class="read-more" href="{Permalink}">{lang:Keep reading} &nbsp;<span class="fa fa-angle-right"></span></a></center>
  877.       {/block:More}</div>{/block:Caption}
  878.       {/block:Photo}
  879.  
  880.       {block:Photoset}<div class="media_wrap pic">
  881.       {block:if500pxPosts}
  882.       {Photoset-500}
  883.       {/block:if500pxPosts}
  884.       {block:ifNot500pxPosts}
  885.       {Photoset-400}
  886.       {/block:ifNot500pxPosts}</div>
  887.       {block:Caption}<div class="pad caption">{Caption}</div>{/block:Caption}{/block:Photoset}
  888.      
  889.       {block:Quote}<div class="media_wrap quo">“{Quote}”</div>
  890.  
  891.       {block:Source}<div class="pad caption" style="text-align:right"><p> &#x2014; {Source}</p></div>{/block:Source}
  892.       {/block:Quote}
  893.      
  894.       {block:Link}
  895.       <div class="media_wrap sq">
  896.         <div class="fa fa-link"></div>
  897.       </div>
  898.       <div class="pad short"><a href="{URL}" class="title link_post" style="display:block" target="{Target}">{Name}</a>
  899.         {block:Excerpt}<div class="text_body"><span style="font-size:95%;font-style:italic">{Excerpt}</span></div>{/block:Excerpt}
  900.       </div>
  901.       <div class="floclear"></div>
  902.       {block:Description}
  903.       <div class="pad">{Description}</div>{/block:Description}{/block:Link} {block:Chat}
  904.  
  905. <div class="pad">
  906.       <div class="title text">{block:Title}{Title}{/block:Title}</div>
  907.       <div class="text_body">{block:Lines}<div class="chat">
  908.         {block:Label}<b>{Label}</b>{/block:Label} {Line}<br>
  909.       </div>
  910.       {/block:Lines}</div></div>{/block:Chat}
  911.      
  912.       {block:Audio}
  913.       <div class="media_wrap sq">
  914.         {block:AlbumArt} <img src="{AlbumArtURL}" alt="{Album}"> {/block:AlbumArt}
  915.       </div>
  916.       <div class="audholder">
  917.         <div class="aud">
  918.           {AudioPlayerBlack}
  919.         </div>
  920.       </div>
  921.  
  922.       <div class="pad short">
  923.       <div style="margin-top:-5px">
  924.         {block:Artist}<span class="asked"><b>Artist:</b></span> {Artist}<br>
  925.         {/block:Artist} {block:TrackName}<span class="asked"><b>Title:</b></span> {TrackName}<br>{/block:TrackName}
  926.         {block:Album}<span class="asked"><b>Album:</b></span>{Album}{/block:Album}
  927.         <p><span class="asked"><b>({PlayCountWithLabel})</b></span></p>
  928.       </div></div>
  929.       <div class="floclear"></div>
  930.       {block:Caption}
  931.       <div class="pad caption">{Caption}</div>{/block:Caption}
  932.       {/block:Audio}
  933.      
  934.       {block:Video} <div class="media_wrap pic">{block:if500pxPosts} {Video-500} {/block:if500pxPosts} {block:ifNot500pxPosts} {Video-400} {/block:ifNot500pxPosts} </div>
  935.       {block:Caption}<div class="pad caption">{Caption}
  936.       {block:More}
  937.       <center><a class="read-more" href="{Permalink}">{lang:Keep reading} &nbsp;<span class="fa fa-angle-right"></span></a></center>
  938.       {/block:More}</div>{/block:Caption}
  939.       {/block:Video}
  940.      
  941.       {block:Answer}
  942.       <div class="media_wrap sq"><div id="asker"><img src="{AskerPortraitURL-96}" alt="Asker name"></div>
  943.       </div>
  944.      
  945.       <div class="pad short">
  946.       <div class="asked">{Asker} says:</div>
  947.       {Question}
  948.       </div>
  949.       <div class="floclear"></div>
  950.       <div class="pad">
  951.       {block:Answerer}
  952.       <div class="ans"><div class="asked">{Answerer} replied:</div> {Answer}
  953.       {block:More}
  954.       <center><a class="read-more" href="{Permalink}">{lang:Keep reading} &nbsp;<span class="fa fa-angle-right"></span></a></center>
  955.       {/block:More}
  956.       </div>{/block:Answerer}
  957.       {Replies}</div>
  958.       {/block:Answer}
  959.      
  960.    
  961.     <div class="footer_wrap">
  962.       {block:HasTags}
  963.       <div class="tag_cont">{block:Tags}
  964.       <a class="tags" href="{TagURL}">#{Tag} </a>
  965.       {/block:Tags}</div>{/block:HasTags}
  966.    
  967.     {block:Date}
  968.     <div class="info">
  969.     <div class="inf stretcher"></div>
  970.     {block:NoteCount}<a class="inf note_count" href="{Permalink}" title="{lang:Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  971.     {block:HasTags}{block:ifHideTags}{block:IndexPage}
  972.     <a class="inf fa fa-tags tag_btn" title="{lang:Tags}"></a>
  973.     {/block:IndexPage}{/block:ifHideTags}{/block:HasTags}
  974.     <a class="inf fa fa-clock-o" href="{Permalink}" title="{DayOfMonth}{DayOfMonthSuffix} {ShortMonth} {Year}"></a>
  975.     {block:RebloggedFrom}
  976.     <a class="inf" href="{ReblogParentURL}" title="{lang:reblogged TimeAgo from ReblogParentName}"><img src="{ReblogParentPortraitURL-40}" alt="{lang:reblogged TimeAgo from ReblogParentName}"></a>
  977.     <a class="inf" href="{ReblogRootURL}" title="{lang:originally from ReblogRootName}"><img src="{ReblogRootPortraitURL-40}" alt="{lang:originally from ReblogRootName}"></a>
  978.     {/block:RebloggedFrom}
  979.  
  980.     <a class="inf fa fa-retweet" href="{ReblogUrl}"></a>
  981.  
  982. <div class="inf" style="cursor:pointer"><div class="like">
  983. <svg width="18" height="18" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  984. {LikeButton color="grey" size="20"}
  985. </div></div>
  986.       </div>{/block:Date}</div>
  987.      
  988.       {block:PostNotes}
  989.       <div class="pad" id="note">
  990.         {PostNotes}
  991.       </div>
  992.       {/block:PostNotes}
  993.    
  994.     </div>
  995.     {/block:Posts}
  996.    
  997.     </div>
  998. </div> <!-- end of post column-->
  999.  
  1000. <div id="righthand" class="col">
  1001. <div class="wrap" id="rightbar">
  1002. {block:Pagination}<div id="pagination"> <!-- regular pagination -->
  1003. {block:PreviousPage}<a href="{PreviousPage}" class="pag fa fa-caret-up" title="{lang:Previous}"></a>{/block:PreviousPage}
  1004.   {block:JumpPagination length="7"}
  1005. {block:CurrentPage}<a class="pag cur">{PageNumber}</a>{/block:CurrentPage}
  1006. {block:JumpPage}<a href="{URL}" class="pag num">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1007.   {block:NextPage}<a href="{NextPage}" class="pag fa fa-caret-down" title="{lang:Next}"></a>{/block:NextPage}
  1008. </div>{/block:Pagination}
  1009. </div>
  1010. </div>
  1011. </div>
  1012.  
  1013. </body>
  1014. </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!