API tools faq
paste
Advertisement
quagmath

marui theme

quagmath
Mar 24th, 2023 (edited)
1,793
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 30.63 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <!--
  3.  
  4.  ____  _____    _    ____      __  __ _____
  5. |  _ \| ____|  / \  |  _ \    |  \/  | ____|
  6. | |_) |  _|   / _ \ | | | |   | |\/| |  _|  
  7. |  _ <| |___ / ___ \| |_| |   | |  | | |___
  8. |_| \_\_____/_/   \_\____/    |_|  |_|_____|
  9.  
  10. ***************************************
  11.  
  12. MARUI THEME v1.0
  13.  
  14. theme made by @eeyes
  15. if something goes wrong, feel free to message/inbox me there!
  16. :^)
  17. https://pastebin.com/9678wJXt
  18.  
  19. https://eeyes.tumblr.com/tagged/my%20theme
  20. https://ko-fi.com/yanadose
  21.  
  22. ***************************************
  23.  
  24. if you're using the pop up sidebar links:
  25. you can repurpose the navigation and about buttons into any custom page, but the navigation page is only 160px tall, while the about page is 260px tall! after that, they'll scroll.
  26.  
  27. if you're having trouble working around the double quotes, try "escaping" your html on a site like this:
  28. https://www.lambdatest.com/free-online-tools/html-escape
  29.  
  30. -->
  31. <head>
  32.  
  33. <meta name="image:background" content="">
  34. <meta name="image:sidebar" content="">
  35. <meta name="image:cursor" content="">
  36. <meta name="image:favicon" content="">
  37.  
  38. <meta name="color:background" content="#BADBFF">
  39. <meta name="color:text" content="#000000">
  40. <meta name="color:link" content="#0000FF">
  41. <meta name="color:link hover" content="#7878FF">
  42. <meta name="color:sidebar bg" content="#FFFFCA">
  43. <meta name="color:posts bg" content="#F0B9B9">
  44. <meta name="color:posts border" content="#4D6593">
  45. <meta name="color:posts border 2" content="#30405E">
  46. <meta name="color:blockquote bg" content="#FFFFCA">
  47. <meta name="color:web box" content="#D3D3D3">
  48. <meta name="color:web shadow" content="#696969">
  49. <meta name="color:web mid" content="#808080">
  50. <meta name="color:web hilite" content="#F5F5F5">
  51. <meta name="color:web border" content="#000">
  52. <meta name="color:button 1" content="#ff0000">
  53. <meta name="color:button 2" content="#0000ff">
  54. <meta name="color:like reblog buttons" content="#fff">
  55. <meta name="color:selection bg" content="#0000FF">
  56.  
  57. <meta name="text:name 1" content="なまえ">
  58. <meta name="text:feature 1" content="空白">
  59. <meta name="text:name 2" content="ねんれい">
  60. <meta name="text:feature 2" content="空白">
  61. <meta name="text:note label" content="★">
  62. <meta name="text:buttons nav url" content="/links">
  63. <meta name="text:buttons nav title" content="navigation">
  64. <meta name="text:nav content" content="&lt;p&gt;&lt;a href=&#039;/about&#039;&gt;full about&lt;/a&gt; / &lt;a href=&#039;/byf&#039;&gt;byf&lt;/a&gt; / &lt;a href=&#039;/tags&#039;&gt;tags&lt;/a&gt; / &lt;a href=&#039;/blacklist&#039;&gt;blacklist&lt;/a&gt; / &lt;a href=&#039;/more&#039;&gt;etc&lt;/a&gt;&lt;/p&gt;">
  65. <meta name="text:buttons about url" content="/about">
  66. <meta name="text:buttons about title" content="about">
  67. <meta name="text:about content" content="&lt;p&gt;this is my about. hi!&lt;/p&gt;
  68. &lt;p&gt;you can put any html here. just be sure not to use double quotes, or you&#039;ll break it! &#039;single quotes&#039; are fine, though.&lt;/p&gt;
  69. &lt;p&gt;alternatively, you can replace double quotes with &amp; quot ; (without the spaces).&lt;/p&gt;">
  70.  
  71. <meta name="select:font" title="marumoji 12px" content="marumoji f12" >
  72. <meta name="select:font" title="courier new 12px" content="courier f12">
  73. <meta name="select:font" title="courier new 14px" content="courier f14">
  74. <meta name="select:font" title="courier new 16px" content="courier f16">
  75. <meta name="select:font" title="consolas 12px" content="consolas f12">
  76. <meta name="select:font" title="consolas 14px" content="consolas f14">
  77. <meta name="select:font" title="consolas 16px" content="consolas f16">
  78. <meta name="select:font" title="arial 12px" content="arial f12">
  79. <meta name="select:font" title="arial 14px" content="arial f14">
  80. <meta name="select:font" title="arial 16px" content="arial f16">
  81.  
  82. <meta name="if:custom cursor" content="0">
  83. <meta name="if:250px" content="1">
  84. <meta name="if:400px" content="0">
  85. <meta name="if:500px" content="0">
  86. <meta name="if:pop up sidebar links" content="1">
  87. <meta name="if:hover bar for sidebar links" content="1">
  88.  
  89. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  90. <title>{Title}{block:SearchPage} | {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary} | {PostSummary}{/block:PostSummary}</title>
  91. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  92. <link rel="shortcut icon" href="{image:Favicon}" />
  93. <link rel="apple-touch-icon" href="{PortraitURL-128}"/>
  94. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  95.  
  96. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
  97.  
  98. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  99. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  100. <script>
  101. (function($){
  102. $(document).ready(function(){
  103. $("a[title]").style_my_tooltips({
  104. tip_follows_cursor:true,
  105. tip_delay_time:60,
  106. tip_fade_speed:450,
  107. attribute:"title"
  108. });
  109. });
  110. })(jQuery);
  111. </script>
  112.  
  113. <style type="text/css">
  114. @import url(https://quagmath.neocities.org/JF-Dot-ShinonomeMaru12.woff);
  115. @import url(https://quagmath.neocities.org/JF-Dot-ShinonomeMaru12B.woff);
  116. @import url(https://quagmath.neocities.org/JF-Dot-Shinonome16.woff);
  117. @import url(https://quagmath.neocities.org/JF-Dot-Shinonome16B.woff);
  118.  
  119. .tooltip {
  120.     display: inline;
  121.     position: relative;
  122. }
  123.  
  124. #s-m-t-tooltip {
  125.     max-width: 300px;
  126.     padding: 3px;
  127.     margin: 20px 7px -2px 20px;
  128.     background: #ffffff;
  129.     font-family: 'JF Dot Shinonome Marumoji 12', courier new, monospace;
  130.     font-size: 12px;
  131.     text-transform: uppercase;
  132.     color: {color:link};
  133.     border: 2px ridge {color:link};
  134.     z-index: 999999999;
  135. }
  136.  
  137. body {
  138.     background: {color:background} url({image:background});
  139.     font-family: 'JF Dot Shinonome Marumoji 12', courier new, monospace;
  140.     font-size: 12px;
  141.     color: {color:text};
  142.     word-wrap: break-word;
  143. }
  144. ::selection {
  145.     background: {color:selection bg};
  146.     color: white;
  147. }
  148. ::-moz-selection {
  149.     background: {color:selection bg};
  150.     color: white;
  151. }
  152. a, a:link, a:visited {
  153.     color: {color:link};
  154. }
  155. a:hover {
  156.     color: {color:link hover};
  157. }
  158. body, #wrapper, a, a:hover, #sidebar, #content {
  159.     {block:ifcustomcursor}cursor: url({image:cursor}), auto;{/block:ifcustomcursor}
  160. }
  161. #cursor {
  162.     z-index: -1000;
  163.     position: fixed;
  164.     top: 0px;
  165.     left: 0px;
  166.     width: 100%;
  167.     height: 100%;
  168.     {block:ifcustomcursor}cursor: url({image:cursor}), auto;{/block:ifcustomcursor}
  169. }
  170.  
  171. #container {
  172.     margin: 0 auto;
  173.     {block:if250px}width: 600px;{/block:if250px}
  174.     {block:if400px}width: 750px;{/block:if400px}
  175.     {block:if500px}width: 850px;{/block:if500px}
  176. }
  177.  
  178. .f12 { font-size: 12px; }
  179. .f14 { font-size: 14px; }
  180. .f16 { font-size: 16px; }
  181. .courier { font-family: courier new, andale mono, monospace; }
  182. .consolas { font-family: consolas, monaco, andale mono, monospace; }
  183. .arial { font-family: arial, sans-serif; }
  184. .marumoji { font-size: 12px; font-family: 'JF Dot Shinonome Marumoji 12', courier new, monospace; }
  185. .spec-marumoji { font-family: 'JF Dot Shinonome Gothic 16', courier new, monospace; }
  186. .spec-courier { font-family: courier new, andale mono, monospace; }
  187. .spec-consolas { font-family: consolas, monaco, andale mono, monospace; }
  188. .spec-arial { font-family: arial, sans-serif; }
  189. .marumoji b, .marumoji i { font-family: 'JF Dot Shinonome Marumoji 12', courier new, monospace; font-weight: bold; font-style: normal; }
  190.  
  191.  
  192. /**********************/
  193.  
  194.  
  195. #sidebar { float: left; width: 250px; }
  196. #sidebar .title {
  197.     padding: 5px;
  198.     font-size: 24px;
  199.     font-weight: bold;
  200.     background: linear-gradient(to right, {color:web hilite}, {color:web mid});
  201.     margin-bottom: 20px;
  202.     border-width: 1px;
  203.     border-style: solid;
  204.     border-color: {color:web box} {color:web border} {color:web border} {color:web shadow};
  205.     box-shadow: 1px 1px rgba(0,0,0,0.75);
  206. }
  207. #sidebar .title a {
  208.     text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
  209.     font-size: 24px;
  210. }
  211.  
  212. #sidebar .sb-box {
  213.     background: {color:sidebar bg};
  214.     padding: 5px;
  215.     border: 2px ridge {color:posts border};
  216.     box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
  217. }
  218. #sidebar .avatar {
  219.     float: left;
  220.     width: 100px;
  221.     height: 100px;
  222.     background: url({image:sidebar});
  223.     background-size: contain;
  224.     border: 2px ridge {color:posts border};
  225.     box-shadow: inset 0 0 5px rgba(0,0,0,0.25);
  226. }
  227. #sidebar .profile {
  228.     float: right;
  229.     margin: 0;
  230. }
  231. #sidebar .profile li {
  232.     width: 115px;
  233.     list-style: none;
  234.     margin-left: -40px;
  235.     padding: 0 5px;
  236. }
  237. #sidebar .profile .name {
  238.     font-size: 12px;
  239.     letter-spacing: 2px;
  240.     line-height: 20px;
  241.     color: {color:web hilite};
  242.     background: {color:web shadow};
  243.     border: 1px ridge {color:web border};
  244.     box-shadow: inset 3px 3px 3px rgba(0,0,0,0.5);
  245. }
  246. #sidebar .profile .feature {
  247.     font-size: 16px;
  248.     font-weight: bold;
  249.     padding-top: 5px;
  250.     color: {color:button 1};
  251.     border: solid {color:button 2};
  252.     border-width: 0 1px 1px 1px;
  253.     background: {color:web hilite};
  254.     box-shadow: inset 0 3px 3px rgba(0,0,0,0.25);
  255.     text-shadow: 1px 1px 2px rgba(0,0,0,0.1), -1px -1px 2px rgba(0,0,0,0.1), -1px 1px 2px rgba(0,0,0,0.1), 1px -1px 2px rgba(0,0,0,0.1);
  256. }
  257. #sidebar .profile li:nth-child(3) {
  258.     margin-top: 9px;
  259. }
  260. #sidebar .description {
  261.     clear: left;
  262.     padding-top: 10px;
  263. }
  264.  
  265. #sidebar .search-box form .search-text {
  266.     border: 2px groove;
  267.     border-color: {color:web mid} white white {color:web mid};
  268.     background: white;
  269.     font-family: arial, helvetica, sans-serif;
  270.     width: 150px;
  271. }
  272. #sidebar .search-box form .search-submit {
  273.     border-width: 1px 2px 2px 1px;
  274.     border-style: solid ridge ridge solid;
  275.     border-color: white {color:web mid} {color:web mid} white;
  276.     background: {color:web box};
  277.     font-family: arial, helvetica, sans-serif;
  278.     position: relative;
  279.     top: -1px;
  280. }
  281.  
  282. #sidebar .buttons { display: inline-flex; margin-top: 10px; position: relative; }
  283. .circ1:nth-of-type(1), .circ1:nth-of-type(2), .circ1:nth-of-type(3) {
  284.     margin-right: 12px;
  285. }
  286. #sidebar .buttons .circ1 {
  287.     width: 40px;
  288.     height: 40px;
  289.     border-radius: 200px;
  290.     background: {color:button 2};
  291. }
  292. #sidebar .buttons .circ1 dt {
  293.     width: 40px;
  294.     height: 40px;
  295.     border-radius: 200px;
  296.     background: linear-gradient(135deg, rgba(0,0,0,0.5) 0%, rgba(255,255,255,0.5) 100%);
  297. }
  298. #sidebar .buttons .circ1 .circ2 {
  299.     width: 28px;
  300.     height: 28px;
  301.     border-radius: 200px;
  302.     background: {color:button 1};
  303.     position: relative;
  304.     top: -35px;
  305.     left: 5px;
  306.     border: 1px solid {color:button 2};
  307. }
  308. #sidebar .buttons .circ1 .circ2 dt {
  309.     width: 28px;
  310.     height: 28px;
  311.     border-radius: 200px;
  312.     background: linear-gradient(135deg, rgba(255,255,255,0.5) 0%, rgba(0,0,0,0.5) 100%);
  313. }
  314. #sidebar .buttons .circ1:hover dt {
  315.     background: linear-gradient(135deg, rgba(255,255,255,0.5) 0%, rgba(0,0,0,0.5) 100%);
  316. }
  317. #sidebar .buttons .circ1:hover .circ2 dt {
  318.     background: linear-gradient(135deg, rgba(0,0,0,0.5) 0%, rgba(255,255,255,0.5) 100%);
  319. }
  320. #sidebar .buttons .where {
  321.     position: absolute;
  322.     top: 65px;
  323.     left: 40px;
  324.     opacity: 0;
  325.     color: white;
  326.     font-size: 16px;
  327.     width: 90px;
  328.     height: 16px;
  329.     padding: 5px 5px 5px 15px;
  330.     background: linear-gradient(to right, {color:web box}, {color:web mid});
  331.     border: 1px solid;
  332.     border-color: {color:web hilite} {color:web border} {color:web border} {color:web hilite};
  333.     border-radius: 10px;
  334.     text-shadow: -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 1px 1px 0 #000;
  335. }
  336. #sidebar .buttons .where .bar {
  337.     height: 2px;
  338.     width: 40px;
  339.     background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1));
  340.     position: absolute;
  341.     left: -40px;
  342.     top: 13px;
  343. }
  344. #sidebar .buttons .linko:hover .where {
  345.     opacity: 1;
  346.     transition: opacity .5s ease-in-out;
  347. }
  348.  
  349.  
  350. /***********************/
  351.  
  352.  
  353. #content {
  354.     float: right;
  355.     {block:if250px}width: 324px;{/block:if250px}
  356.     {block:if400px}width: 474px;{/block:if400px}
  357.     {block:if500px}width: 574px;{/block:if500px}
  358.     background: linear-gradient(to bottom, {color:posts border} 0%, {color:posts border} 15%, {color:posts border 2} 50%, {color:posts border} 85%, {color:posts border} 100%);
  359.     border-radius: 15px;
  360.     border: 2px solid;
  361.     border-color: rgba(255,255,255,0.25) rgba(0,0,0,0.25) rgba(0,0,0,0.25) rgba(255,255,255,0.25);
  362.     box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
  363. }
  364. #content .posts {
  365.     border: 10px solid {color:posts bg};
  366.     height: 500px;
  367.     {block:if250px}width: 290px;{/block:if250px}
  368.     {block:if400px}width: 440px;{/block:if400px}
  369.     {block:if500px}width: 540px;{/block:if500px}
  370.     overflow-y: auto;
  371.     overflow-x: hidden;
  372.     margin: 7px auto;
  373.     border-radius: 15px;
  374.     background: {color:posts bg};
  375. }
  376. #content .post {
  377.     padding: 3px;
  378.     margin-left: 7px;
  379.     {block:if250px}width: 250px;{/block:if250px}
  380.     {block:if400px}width: 400px;{/block:if400px}
  381.     {block:if500px}width: 500px;{/block:if500px}
  382. }
  383.  
  384. .footer {
  385.     margin-bottom: 50px;
  386.     padding: none;
  387. }
  388. .footer .top, .footer .bottom {
  389.     margin: 0;
  390. }
  391. .footer .top, .footer .bottom {
  392.     display: inline-flex;
  393.     {block:if250px}width:250px;{/block:if250px}
  394.     {block:if400px}width:400px;{/block:if400px}
  395.     {block:if500px}width:500px;{/block:if500px}
  396. }
  397.     .footer .top .left {
  398.     float: left;
  399.     {block:if250px}width:125px;{/block:if250px}
  400.     {block:if400px}width:200px;{/block:if400px}
  401.     {block:if500px}width:245px;{/block:if500px}
  402. }
  403.     .footer .top .right {
  404.     float: right;
  405.     text-align: right;
  406.     {block:if250px}width:125px;{/block:if250px}
  407.     {block:if400px}width:200px;{/block:if400px}
  408.     {block:if500px}width:250px;{/block:if500px}
  409. }
  410.    
  411. ol.notes li.note {
  412.     list-style: none;
  413.     margin: 0 0 5px -30px;
  414. }
  415. ol.notes li.note .avatar {
  416.     margin-right: 10px;
  417. }
  418. ol.notes li.more_notes_link_container {
  419.     text-transform: lowercase;
  420. }
  421. .footer .tag {
  422.     word-wrap: break-word;
  423. }
  424.  
  425.  
  426. /******************/
  427.  
  428.  
  429. .post .text h2 { margin: 5px 0 5px 10px; }
  430.  
  431. .post .photo img, .post .photoset img {
  432.     text-align: center;
  433.     margin: none;
  434.     height: auto;
  435.     {block:if250px}max-width: 250px;{/block:if250px}
  436.     {block:if400px}max-width: 400px;{/block:if400px}
  437.     {block:if500px}max-width: 500px;{/block:if500px}
  438. }
  439.  
  440. .post .quote {
  441.     font-size: 16px;
  442. }
  443. .post .source {
  444.     padding-left: 40px;
  445.     padding-bottom: 10px
  446. }
  447.  
  448. .post .ask .q, .post .ask .a {
  449.     width: calc(100% - 20px);
  450.     margin: 0 auto;
  451. }
  452. .post .ask .q .question, .post .ask .a .answer {
  453.     border-width: 1px 2px 2px 1px;
  454.     border-style: solid ridge ridge solid;
  455.     border-color: white {color:web mid} {color:web mid} white;
  456.     background: {color:web box};
  457.     padding: 5px;
  458. }
  459. .post .ask .q .asker, .post .ask .a .answerer {
  460.     margin-bottom: 0;
  461. }
  462.  
  463. .post .chat {
  464.     margin: 10px 10px 0 -40px;
  465. }
  466. .post .chat .lines {
  467.     margin-left: 6px;
  468.     list-style: none;
  469.     background-color: {color:web border};
  470.     border-width: 1px 2px 2px 1px;
  471.     border-style: solid ridge ridge solid;
  472.     border-color: white {color:web mid} {color:web mid} white;
  473. }
  474. .post .chat .lines .line {
  475.     margin-bottom: 1px;
  476.     padding: 3px 5px;
  477.     border-top: 1px solid white;
  478.     background: {color:web box};
  479. }
  480.  
  481. .post .audio .album-art img {
  482.     width: 100px; height: 100px; float: left;
  483.     border-width: 1px;
  484.     border-style: solid;
  485.     border-color: {color:web box} {color:web border} {color:web border} {color:web shadow};
  486.     box-shadow: 1px 1px rgba(0,0,0,0.75);
  487. }
  488. .post .audio .player {
  489.     height: 90px;
  490.     overflow: hidden;
  491.     {block:if250px}width: 136px;{/block:if250px}
  492.     {block:if400px}width: 286px;{/block:if400px}
  493.     {block:if500px}width: 386px;{/block:if500px}
  494.     padding: 5px;
  495.     background: linear-gradient(to right, {color:web hilite}, {color:web mid});
  496.     border-width: 1px;
  497.     border-style: solid;
  498.     border-color: {color:web box} {color:web border} {color:web border} {color:web shadow};
  499.     box-shadow: 1px 1px rgba(0,0,0,0.75);
  500. }
  501. .post .audio .audio_player iframe {
  502.     width: 34px;
  503.     border-radius: 5px;
  504.     border: 2px groove;
  505.     border-color: white {color:web mid} {color:web mid} white;
  506. }
  507.  
  508. .post .body img {
  509.     max-width: 100%;
  510.     height: auto;
  511. }
  512. blockquote {
  513.     margin: 5px 0 5px 5px;
  514.     padding-left: 5px;
  515.     border-left: 4px solid #fff;
  516.     border: 2px ridge {color:posts border};
  517.     box-shadow: 2px 2px 2px rgba(0,0,0,0.5);
  518.     background: {color:blockquote bg};
  519. }
  520.  
  521.  
  522. /*****************/
  523.  
  524.  
  525. #content #nav {
  526.     background: linear-gradient(to bottom, {color:posts border} 0%, {color:posts border 2} 100%);
  527.     padding: 18px 0 25px 0;
  528.     text-align: center;
  529.     font-size: 24px !important;
  530.     color: #fff;
  531.     border-radius: 0 0 15px 15px;
  532. }
  533. #content #nav a, #content #nav span {
  534.     font-size: 24px !important;
  535. }
  536.  
  537.  
  538. /****************/
  539. /*mini popup*/
  540. /****************/
  541.  
  542.  
  543. #fade { /*--Transparent background layer--*/
  544.     display: none; /*--hidden by default--*/
  545.     background: #000;
  546.     position: fixed;
  547.     left: 0;
  548.     top: 0;
  549.     width: 100%;
  550.     height: 100%;
  551.     opacity: .8;
  552.     z-index: 9999;
  553. }
  554. .popup_block {
  555.     display: none; /*--hidden by default--*/
  556.     background: linear-gradient(to bottom, {color:posts border}, {color:posts border 2});
  557.     height: 340px;
  558.     border-radius: 15px;
  559.     padding: 7px;
  560.     border: 2px solid;
  561.     border-color: rgba(255,255,255,0.25) rgba(0,0,0,0.25) rgba(0,0,0,0.25) rgba(255,255,255,0.25);
  562.     font-size: 12px;
  563.     position: fixed;
  564.     top: 50%;
  565.     left: 50%;
  566.     z-index: 99999;
  567. }
  568. .popup_block .inner {
  569.     background: rgba(255,255,255,0.5);
  570.     padding: 5px;
  571.     overflow-y: auto;
  572.     overflow-x: hidden;
  573.     height: 260px;
  574. }
  575. .popup_block .inner img {
  576.     max-width: 473px;
  577. }
  578. .spec-courier .inner {
  579.     font-family: courier new, andale mono, monospace;
  580. }
  581. /*resume*/
  582. .popup_block h1 {
  583.     font-size: 24px;
  584.     font-weight: bold;
  585. }
  586. .popup_block h2 {
  587.     text-align: center;
  588.     font-size: 16px;
  589.     font-weight: lighter;
  590.     height: 20px;
  591.     width: 300px;
  592.     margin: 7px auto;
  593.     padding: 4px 0 2px 0;
  594.     background: {color:posts bg} url(https://i.imgur.com/siDS5w9.png);
  595.     border: 2px solid;
  596.     border-radius: 10px;
  597.     border-color: rgba(255,255,255,0.5) rgba(0,0,0,0.5) rgba(0,0,0,0.5) rgba(255,255,255,0.5);
  598. }
  599. .popup_links {
  600.     height: 240px;
  601.     font-size: 16px;
  602.     text-align: center;
  603. }
  604. .popup_links .inner {
  605.     height: 160px;
  606. }
  607. .btn_close {
  608.     border-width: 1px 2px 2px 1px;
  609.     border-style: solid ridge ridge solid;
  610.     border-color: white {color:web mid} {color:web mid} white;
  611.     background: {color:web box};
  612.     font-family: arial, helvetica, sans-serif;
  613.     color: #000;
  614.     text-align: center;
  615.     width: 60px;
  616.     margin-left: calc(50% - 13px);
  617.     margin-top: 7px;
  618. }
  619. .close {
  620.     text-decoration: none;
  621. }
  622.  
  623.  
  624. /******************/
  625.  
  626.  
  627. #credit * {transition: all 0.5s;}
  628. #credit {position: fixed; bottom: 2px; left: 2px; z-index: 99999999; font-size: 15px; font-family: arial;}
  629. #credit a {color: black; text-shadow: -1px -1px white, -1px 1px white, 1px -1px white, 1px 1px white; background: none !important; text-decoration: none;}
  630. #credit a:hover {color: black; text-shadow: -1px -1px white, -1px 1px white, 1px -1px white, 1px 1px white !important;}
  631. #credit img {filter: drop-shadow(0 0 1px white);}
  632. #credit .hidden {opacity: 0; margin: 0 0 2px 2px;}
  633. #credit:hover .hidden {opacity: 1;}
  634. </style>
  635. <style type="text/css">{CustomCSS}</style>
  636.  
  637. <!-- mini popup script -->
  638. <script type="text/javascript"
  639. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  640. <script>
  641. $(document).ready(function() {
  642. //
  643. $('a.poplight[href^=#]').click(function() {
  644. var popID = $(this).attr('rel'); //Get Popup Name
  645. var popURL = $(this).attr('href'); //Get Popup href to define size
  646. var query= popURL.split('?');
  647. var dim= query[1].split('&');
  648. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  649. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).append('<a href="#" class="close"><input class="btn_close" type="submit" value="Close" /></a>');
  650. var popMargTop = ($('#' + popID).height() + 80) / 2;
  651. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  652. //Apply Margin to Popup
  653. $('#' + popID).css({
  654. 'margin-top' : -popMargTop,
  655. 'margin-left' : -popMargLeft
  656. });
  657. $('body').append('<div id="fade"></div>');
  658. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  659. return false;
  660. });
  661. $('a.close, #fade').live('click', function() {
  662. $('#fade , .popup_block').fadeOut(function() {
  663. $('#fade, a.close').remove(); //fade them both out
  664. });
  665. return false;
  666. });
  667. });
  668. </script>
  669. </head>
  670.  
  671.  
  672. <body>
  673. <div id="cursor"></div>
  674. <div id="container" class="{select:font}">
  675. <div id="sidebar">
  676. <div class="title">
  677. <a href="/" class="spec-{select:font}">{Title}</a>
  678. </div>
  679.  
  680. <div class="sb-box">
  681. <div class="top">
  682.     <div class="avatar"></div>
  683.     <ul class="profile">
  684.         <li class="name">{text:name 1}</li>
  685.         <li class="feature spec-{select:font}">{text:feature 1}</li>
  686.         <li class="name">{text:name 2}</li>
  687.         <li class="feature spec-{select:font}">{text:feature 2}</li>
  688.     </ul>
  689. </div>
  690. <div class="description">{Description}</div>
  691. <div class="search-box">
  692.     <form action="/search" method="get">
  693.     <input class="search-text" type="text" name="query-text" value="{SearchQuery}"/>
  694.     <button class="search-submit" type="submit" value="Search">Search</button>
  695.     </form>
  696. </div>
  697. </div> <!-- end .sb-box -->
  698. <div class="buttons">
  699.     <div class="linko">
  700.         <a {block:ifpopupsidebarlinks}href="#?w=500"{/block:ifpopupsidebarlinks}{block:ifnotpopupsidebarlinks}href="/ask"{/block:ifnotpopupsidebarlinks} {block:ifnothoverbarforsidebarlinks}title="ask"{/block:ifnothoverbarforsidebarlinks} rel="01" class="poplight"><dl class="circ1"><dt></dt><dl class="circ2"><dt></dt></dl></dl></a>
  701.         {block:ifhoverbarforsidebarlinks}<div class="where spec-{select:font}"><div class="bar"></div>ask</div>{/block:ifhoverbarforsidebarlinks}
  702.     </div>
  703.     <div class="linko">
  704.         <a {block:ifpopupsidebarlinks}href="#?w=500"{/block:ifpopupsidebarlinks}{block:ifnotpopupsidebarlinks}href="{text:buttons nav url}"{/block:ifnotpopupsidebarlinks} {block:ifnothoverbarforsidebarlinks}title="{text:buttons nav title}"{/block:ifnothoverbarforsidebarlinks} rel="02" class="poplight"><dl class="circ1"><dt></dt><dl class="circ2"><dt></dt></dl></dl></a>
  705.         {block:ifhoverbarforsidebarlinks}<div class="where spec-{select:font}"><div class="bar"></div>{text:buttons nav title}</div>{/block:ifhoverbarforsidebarlinks}
  706.     </div>
  707.     <div class="linko">
  708.         <a {block:ifpopupsidebarlinks}href="#?w=500"{/block:ifpopupsidebarlinks}{block:ifnotpopupsidebarlinks}href="{text:buttons about url}"{/block:ifnotpopupsidebarlinks} {block:ifnothoverbarforsidebarlinks}title="{text:buttons about title}"{/block:ifnothoverbarforsidebarlinks} rel="03" class="poplight"><dl class="circ1"><dt></dt><dl class="circ2"><dt></dt></dl></dl></a>
  709.         {block:ifhoverbarforsidebarlinks}<div class="where spec-{select:font}"><div class="bar"></div>{text:buttons about title}</div>{/block:ifhoverbarforsidebarlinks}
  710.     </div>
  711.     <div class="linko">
  712.         <a href="/archive" {block:ifnothoverbarforsidebarlinks}title="archive"{/block:ifnothoverbarforsidebarlinks}><dl class="circ1"><dt></dt><dl class="circ2"><dt></dt></dl></dl></a>
  713.         {block:ifhoverbarforsidebarlinks}<div class="where spec-{select:font}"><div class="bar"></div>archive</div>{/block:ifhoverbarforsidebarlinks}
  714.     </div>
  715. </div>
  716. </div> <!-- end #sidebar -->
  717.  
  718.  
  719.  
  720. <div id="content">
  721. <div class="posts">
  722. {block:Posts}
  723. <div class="post">
  724.  
  725. {block:Photo}
  726.     <div class="photo">
  727.         <figure>
  728.             {LinkOpenTag}
  729.                 <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{block:if500px}{PhotoWidth-500}{/block:if500px}{block:if400px}{PhotoWidth-400}{/block:if400px}{block:if250px}{PhotoWidth-250}{/block:if250px}" height="{PhotoAlt}" width="{block:if500px}{PhotoHeight-500}{/block:if500px}{block:if400px}{PhotoHeight-400}{/block:if400px}{block:if250px}{PhotoHeight-250}{/block:if250px}">
  730.             {LinkCloseTag}
  731.             {block:Caption}
  732.                 <figcaption class="body">{Caption}</figcaption>
  733.             {/block:Caption}
  734.         </figure>
  735.     </div>
  736. {/block:Photo}
  737.  
  738. {block:Photoset}
  739.     <div class="photoset">
  740.         <figure>
  741.             {Photoset}
  742.             {block:Caption}
  743.                 <figcaption class="body">{Caption}</figcaption>
  744.             {/block:Caption}
  745.         </figure>
  746.     </div>
  747. {/block:Photoset}
  748.  
  749. {block:Video}
  750.     <div class="video">
  751.         <figure>
  752.             <div class="embed">
  753.                 {block:if500px}{Video-500}{/block:if500px}
  754.                 {block:if400px}{Video-400}{/block:if400px}
  755.                 {block:if250px}{Video-250}{/block:if250px}
  756.             </div>
  757.             {block:Caption}
  758.                 <figcaption class="body">{Caption}</figcaption>
  759.             {/block:Caption}
  760.         </figure>
  761.     </div>
  762. {/block:Video}
  763.  
  764. {block:Audio}
  765.     <div class="audio">
  766.         <div class="album-art">
  767.             {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  768.         </div>
  769.         <div class="player">
  770.             {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  771.             <div class="meta">
  772.                 {block:PlayCount}{PlayCountWithLabel}{/block:PlayCount}
  773.                 {block:Artist}{Artist}{/block:Artist}{block:TrackName} - {TrackName}{/block:TrackName}
  774.                 {block:ExternalAudio}<span> &bull; <a href="{ExternalAudioURL}">{lang:Download}</a></span>{/block:ExternalAudio}
  775.             </div>
  776.         </div>
  777.        
  778.         {block:Caption}
  779.             <div class="body">{Caption}</div>
  780.         {/block:Caption}
  781.     </div>
  782. {/block:Audio}
  783.  
  784. {block:Quote}
  785.     <div class="quote {Length} spec-{select:font}">
  786.         &ldquo;{Quote}&rdquo;
  787.     </div>
  788.     {block:Source}
  789.         <div class="source">&mdash; {Source}</div>
  790.     {/block:Source}
  791. {/block:Quote}
  792.  
  793. {block:Text}
  794.     <div class="text">
  795.         {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
  796.         {block:Body}<div class="body">{Body}</div>{/block:Body}
  797.     </div>
  798. {/block:Text}
  799.  
  800. {block:Answer}
  801.     <div class="ask">
  802.         <div class="q">
  803.             <p class="asker">{lang:Asker asked 2}:</p>
  804.             <div class="box">
  805.                 <div class="question">{Question}</div>
  806.             </div>
  807.         </div>
  808.  
  809.         {block:Answerer}
  810.         <div class="a">
  811.             <p class="answerer">{Answerer} answered:</p>
  812.             <div class="box">
  813.                 <div class="answer">{Answer}</div>
  814.             </div>
  815.         </div>
  816.         {/block:Answerer}
  817.  
  818.         <div class="body">
  819.             <p>{Replies}</p>
  820.         </div>
  821.     </div>
  822. {/block:Answer}
  823.  
  824. {block:Chat}
  825.     <div class="chat">
  826.         {block:Title}
  827.             <h2><a href="{Permalink}">{Title}</a></h2>
  828.         {/block:Title}
  829.         <ul class="conversation">
  830.             <div class="lines">
  831.                 {block:Lines}
  832.                     <li class="line {Alt}">
  833.                         {block:Label}<b>{Label}</b>{/block:Label}
  834.                         {Line}
  835.                     </li>
  836.                 {/block:Lines}
  837.             </div>
  838.         </ul>
  839.     </div>
  840. {/block:Chat}
  841.  
  842. {block:Link}
  843.     <div class="link">
  844.         <h2>
  845.             <a {Target} href="{URL}"><span class="title">{Name}</span></a>
  846.         </h2>
  847.         {block:Description}
  848.             <div class="body">{Description}</div>
  849.         {/block:Description}
  850.     </div>
  851. {/block:Link}
  852.  
  853. {block:Date}
  854.     <div class="footer">
  855.         <dl class="top">
  856.             <dt class="left"><a href="{Permalink}" title="{TimeAgo}" style="text-transform: uppercase;">{DayOfMonth}.{MonthNumberWithZero}.{ShortYear}</a></dt>
  857.             <dt class="right"><a href="{Permalink}" title="permalink">{block:NoteCount}{NoteCount} {/block:NoteCount}{text:note label}</a></dt>
  858.         </dl>
  859.         {block:PermalinkPage}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{block:ContentSource} | <a href="{ReblogRootURL}" title="{ReblogRootName}">src</a>{/block:ContentSource}{/block:RebloggedFrom}{/block:PermalinkPage}
  860.         <dl class="bottom">
  861.             {block:HasTags}{block:Tags}<span class="tag"><a href="{TagURL}">#{Tag}</a></span>&nbsp;{/block:Tags}{/block:HasTags}
  862.         </dl>
  863.     </div> <!-- end .footer -->
  864. {/block:Date}
  865.  
  866. {block:PermalinkPage}{block:PostNotes}<div class="notes">{PostNotes}</div>{/block:PostNotes}{/block:PermalinkPage}
  867.  
  868. </div> <!-- end .post -->
  869. {/block:Posts}
  870. </div> <!-- end .posts -->
  871.  
  872. <div id="nav" class="spec-{select:font}">
  873.     {block:PreviousPage}<a href="{PreviousPage}">{/block:PreviousPage}<span style="font-family: courier new, andale mono, monospace; padding: 0 5px;">&laquo;</span>{block:PreviousPage}</a>{/block:PreviousPage}
  874.     {block:JumpPagination length="5"}
  875.         {block:CurrentPage}<span class="current spec-{select:font}" style="padding: 0 5px;">{PageNumber}</span>{/block:CurrentPage}
  876.         {block:JumpPage}<a href="{URL}" class="spec-{select:font}" style="padding: 0 5px;">{PageNumber}</a>{/block:JumpPage}
  877.     {/block:JumpPagination}
  878.     {block:NextPage}<a href="{NextPage}">{/block:NextPage}<span style="font-family: courier new, andale mono, monospace; padding: 0 5px;">&raquo;</span>{block:NextPage}</a>{/block:NextPage}
  879. </div>
  880.  
  881. </div> <!-- end #content -->
  882. </div> <!-- end #container -->
  883.  
  884. <div id="credit"><div class="hidden"><a href="http://eeyes.tumblr.com/tagged/my%20theme">&copy; eeyes</a></div><div class="credimg"><a href="http://eeyes.tumblr.com/tagged/my%20theme"><img src="https://dreamy.neocities.org/walkee.png"></a></div></div>
  885.  
  886. <script>
  887. $(document).ready(function(){
  888.     $('[data-toggle="tooltip"]').tooltip();  
  889. });
  890. </script>
  891.  
  892. </body>
  893.  
  894. <!--popup blocks-->
  895.  
  896. <div id="02" class="popup_block popup_links spec-{select:font}">
  897.     <h2 class="spec-{select:font}">{text:buttons nav title}</h2>
  898.     <div class="inner">
  899.         {text:nav content}
  900.     </div>
  901. </div></div>
  902.  
  903. <div id="03" class="popup_block">
  904.     <h2 class="spec-{select:font}">{text:buttons about title}</h2>
  905.     <div class="inner">
  906.         {text:about content}
  907.     </div>
  908. </div></div>
  909.  
  910. <div id="01" class="popup_block">
  911.     <div class="inner">
  912.     <h1 class="spec-{select:font}">{AskLabel}</h1>
  913.     <iframe frameborder="0" scrolling="yes" width="100%" height="150" src="https://www.tumblr.com/ask_form/{name}" style="background-color:transparent; overflow:hidden;" id="ask_form"></div>
  914. </div></div></div></div></div></div></div></div></div>
  915.  
  916.  
  917. </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!