API tools faq
paste
Advertisement
deathkostis

Untitled

deathkostis
Oct 23rd, 2016
36
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.59 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3.  
  4.  
  5. <html>
  6.  
  7. <title>
  8. Home
  9. </title>
  10.  
  11. <head>
  12. <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
  13. </head>
  14.  
  15.  
  16. <style type="text/css">
  17.  
  18. :root{
  19.  
  20. /*
  21. Use these to change colours
  22. */
  23.  
  24. --text:#888;
  25. --main-bg:#1a1a1a;
  26. --fg-one:#cacaca;
  27. --fg-two:#cacaca;
  28. --fg-three:#4d4d4d;
  29. --shadow:#100908;
  30. --bar-bg:#312c38;
  31.  
  32. /*
  33. I should have labeled the varibles better, but fuck it.
  34. You can figure them out.
  35. */
  36. }
  37.  
  38.  
  39. * {
  40. text-decoration: none;
  41. color: var(--text);
  42. }
  43.  
  44. html {
  45. background: url("wall24.jpg") ;
  46.  
  47. background-repeat: no-repeat;
  48. color: var(--text);
  49. font-family: "monaco", monospace;
  50. font-size: 18px;
  51. background-position: center center;
  52. background-attachment: fixed;
  53. background-size: cover;
  54. }
  55. body {
  56. background-color: var(--main-bg);
  57. box-shadow: 5px 5px 5px var(--shadow);
  58. margin-right: auto;
  59. margin-top: 2%;
  60. margin-bottom: 2%;
  61. margin-left: auto;
  62. text-align: center;
  63. height: 600px;
  64. padding: 10px 10px 10px 10px;
  65. position: static ;
  66. z-index: -1;
  67. width: 200px;
  68. }
  69.  
  70. input, select, textarea{
  71. background: var(--fg-one);
  72. width: 75%;
  73. height: 30px;
  74. padding: 0px 10px 0px 10px;
  75. margin: auto;
  76. margin-top: -5px;
  77.  
  78. }
  79.  
  80. #wrap {
  81. background: var(--fg-three);
  82. width: 400px;
  83. z-index: 1;
  84. position: relative;
  85. margin: 10px 10px 10px -100px ;
  86. height: 6%;
  87. box-shadow: 5px 5px 5px var(--shadow);
  88. padding: 18px 0px 5px 0px;
  89.  
  90. }
  91.  
  92. .links {
  93. background: var(--fg-three);
  94. width: 280px;
  95. z-index: 1;
  96. position: relative;
  97. margin: 40px 10px 10px -40px ;
  98. box-shadow: 5px 5px 5px var(--shadow);
  99. padding: 20px 0px 5px 0px;
  100. text-align: center;
  101. height: 30px;
  102. overflow: hidden;
  103. white-space: nowrap;
  104. -webkit-transition-duration: 0.4s;
  105. -moz-transition-duration: 0.4s;
  106. -o-transition-duration: 0.4s;
  107. transition-duration: 0.4s;
  108. }
  109.  
  110. a:hover {
  111. text-shadow: 1px 1px var(--shadow);
  112. }
  113.  
  114. .hv:hover table {
  115. visibility: visible;
  116. }
  117.  
  118. td:hover {
  119. background: var(--fg-two);
  120. }
  121.  
  122. .hv:hover b {
  123. color: var(--fg-two);
  124. }
  125.  
  126. b{
  127. padding: 0px 0px 2px 0px;
  128. text-align: center;
  129. position: absolute;
  130. left: 30%;
  131. right: 30%;
  132. background: var(--fg-three);
  133. z-index: 3
  134. }
  135. #q {
  136. border: 0; border-radius: 1px;
  137. font-family: "monaco", monospace;
  138. color: var(--text);
  139. text-align: center;
  140. box-shadow: 2px 2px 2px var(--main-bg);
  141. }
  142.  
  143. #left,#right{
  144. padding: 5px 0px 5px 0px;
  145. display: none;
  146. white-space: nowrap;
  147. }
  148.  
  149. #left{
  150. position: absolute;
  151. left: 20px;
  152. top: 15px;
  153. /*
  154. margin-right: 120px;
  155. margin-left: 10px;
  156. /**/
  157. }
  158.  
  159. #right {
  160. position: absolute;
  161. right: 20px;
  162. top: 15px;
  163. /*
  164. margin-left: 100px;
  165. /**/
  166. }
  167.  
  168. .links:hover{
  169. width: 540px;
  170. margin-left: -170px;
  171. -webkit-transition-duration: 0.4s;
  172. -moz-transition-duration: 0.4s;
  173. -o-transition-duration: 0.4s;
  174. transition-duration: 0.4s;
  175. }
  176.  
  177. #two:hover{
  178. width: 600px;
  179. margin-left: -200px;
  180. -webkit-transition-duration: 0.4s;
  181. -moz-transition-duration: 0.4s;
  182. -o-transition-duration: 0.4s;
  183. transition-duration: 0.4s;
  184. }
  185.  
  186. #two>#left{
  187. margin-right: 100px;
  188. }
  189.  
  190. #three:hover{
  191. width: 660px;
  192. margin-left: -230px;
  193. -webkit-transition-duration: 0.4s;
  194. -moz-transition-duration: 0.4s;
  195. -o-transition-duration: 0.4s;
  196. transition-duration: 0.4s;
  197. }
  198.  
  199. #four:hover{
  200. width: 600px;
  201. margin-left: -200px;
  202. -webkit-transition-duration: 0.4s;
  203. -moz-transition-duration: 0.4s;
  204. -o-transition-duration: 0.4s;
  205. transition-duration: 0.4s;
  206. }
  207.  
  208. /*#four>#left{
  209. margin-right: 100px;
  210. margin-left: 20px;
  211. }
  212.  
  213. #four>#right{
  214. margin-left: 150px;
  215. }
  216.  
  217. /**/
  218.  
  219. .links:hover #left,.links:hover #right{
  220. display: inline;
  221. }
  222.  
  223. a{
  224. padding: 0px 5px 0px 5px;
  225. }
  226.  
  227.  
  228. #block{
  229. position: absolute;
  230. z-index: 0;
  231. background: #885d39;
  232. top: 200px;
  233. margin: auto;
  234. right: 45%;
  235. width:100px;
  236. height: 400px;
  237. box-shadow: 5px 5px 5px var(--main-bg);
  238. }
  239.  
  240. </style>
  241.  
  242. <script type="text/javascript" language="javascript">
  243. var $=function(id) { return document.getElementById(id); };
  244.  
  245. var search=[ // Search engines
  246. ["", "https://www.google.com/#q="], // Google (Default)
  247. ["!g", "https://www.google.com/#q="], // Google
  248. ["!i", "https://www.google.com/search?tbm=isch&q="], // Google Images
  249. ["!y", "https://www.youtube.com/results?search_query="], // YouTube
  250. ["!w", "http://en.wikipedia.org/w/index.php?search="], // Wikipedia
  251. ["!m", "http://www.imdb.com/find?q="], // IMDb
  252. ["!u", "http://www.urbandictionary.com/define.php?term="], // Urban Dictionary
  253. ["!n", "http://www.nyaa.se/?page=search&cats=0_0&filter=0&term="], // Nyaa
  254. ["!t", "http://shop.tcgplayer.com/magic/product/show?ProductName="],// TCGplayer
  255. ["!a", "https://aur.archlinux.org/packages/?O=0&K="], // AUR
  256. ];
  257.  
  258.  
  259. var ss="";
  260. function init() {
  261. for(var i=0;i<search.length;i++) if(search[i][0]=="") ss=search[i][1];
  262. if(ss=="") alert("Error: Missing default search engine!");
  263.  
  264. build();
  265.  
  266. $('q').value="";
  267. $('q').focus();
  268. }
  269. function handleQuery(e,q) { // Handle search query
  270. var key=e.keyCode || e.which;
  271.  
  272. if(key==13) { // enter
  273. if(q.lastIndexOf("!")!=-1) {
  274. var x=q.lastIndexOf("!"),found=false;
  275.  
  276. for(var i=0;i<search.length;i++) {
  277. if(search[i][0]==q.substr(x)) { // Find "!?"
  278. found=true; window.location=search[i][1]+q.substr(0,x).replace(/&/g,"%26");
  279. }
  280. }
  281. if(!found) { // Invalid "!?", use default
  282. window.location=ss+q.substr(0,x).replace(/&/g,"%26");
  283. }
  284. } else { // "!?" where not specified, use default
  285. window.location=ss+q.replace(/&/g,"%26");
  286. }
  287. }
  288. }
  289.  
  290. </script>
  291.  
  292. <body onload="javascript:init();">
  293. <h1 id="header">良い一日を</h1>
  294. <div id="wrap">
  295. <input autofocus type="text" id="q" value="" placeholder="" onkeypress="javascript:handleQuery(event,this.value);" onfocus="this.value=this.value" />
  296. </div>
  297. <div class="links">
  298. <div id="left">
  299. <a href="http://boards.4chan.org/g/">/g/</a>
  300. <a href="https://boards.4chan.org/w/">/w/</a>
  301. <a href="https://boards.4chan.org/wg/">/wg/</a>
  302. </div>
  303. <b>4chan</b>
  304. <div id="right">
  305. <a href="https://boards.4chan.org/r9k/">/r9k/</a>
  306. <a href="https://boards.4chan.org/sci/">/sci/</a>
  307. <a href="https://boards.4chan.org/lit/">/lit/</a>
  308. </div>
  309. </div>
  310. <div class="links" id="two">
  311. <div id="left">
  312. <a href="https://www.youtube.com/feed/subscriptions">YouTube</a>
  313. <a href="https://www.twitch.tv/directory/following">Twitch</a>
  314. <a href="http://www.google.com"> </a>
  315. </div>
  316. <b>Media</b>
  317. <div id="right">
  318. <a href="https://mail.google.com/mail/u/0/?tab=wm#inbox">Gmail</a>
  319. <a href="https://twitter.com/">Twitter</a>
  320. <a href="http://www.google.com"></a>
  321. </div>
  322. </div>
  323. <div class="links" id="three">
  324. <div id="left">
  325. <a href="https://nhentai.net/language/english/">Nhentai</a>
  326. <a href="http://www.hentai.ms/">Hentaims</a>
  327. <a href="http://www.google.com"> </a>
  328. </div>
  329. <b>Fun</b>
  330. <div id="right">
  331. <a href="http://play.typeracer.com/">Typer</a>
  332. <a href="https://chaturbate.com/">Chaturbate</a>
  333. <a href="http://www.google.com"> </a>
  334. </div>
  335. </div>
  336. <div class="links" id="four">
  337. <div id="left">
  338. <a href="https://www.reddit.com/r/unixporn/new/">/unix/</a>
  339. <a href="http://www.google.com"> </a>
  340. <a href="https://www.reddit.com/r/battlestations/new/">/bst/</a>
  341. </div>
  342. <b>Reddit</b>
  343. <div id="right">
  344. <a href="https://www.reddit.com/r/MusicBattlestations/new/">/mbst/</a>
  345. <a href="https://www.reddit.com/r/pcmasterrace/">/pcmr/</a>
  346. <a href="http://www.google.com"> </a>
  347. </div>
  348. </div>
  349. </body>
  350.  
  351. http://imgur.com/a/u6Uv1
  352. http://imgur.com/RhavPpk
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!