From bca265aea67ec62499aaa113a6490ce9ec7fe730 Mon Sep 17 00:00:00 2001 From: lolcat Date: Sat, 22 Jul 2023 14:41:14 -0400 Subject: still missing things on google scraper --- static/client.js | 682 +++++++++++++++++++++++ static/icon/amazon.png | Bin 0 -> 2485 bytes static/icon/appstore.png | Bin 0 -> 2841 bytes static/icon/facebook.png | Bin 0 -> 1575 bytes static/icon/gamespot.png | Bin 0 -> 2434 bytes static/icon/github.png | Bin 0 -> 1250 bytes static/icon/googleplay.png | Bin 0 -> 1469 bytes static/icon/imdb.png | Bin 0 -> 2626 bytes static/icon/instagram.png | Bin 0 -> 3309 bytes static/icon/itunes.png | Bin 0 -> 3016 bytes static/icon/microsoft.png | Bin 0 -> 2147 bytes static/icon/quora.png | Bin 0 -> 1716 bytes static/icon/reddit.png | Bin 0 -> 2009 bytes static/icon/rottentomatoes.png | Bin 0 -> 1084 bytes static/icon/sciencedirect.png | Bin 0 -> 585 bytes static/icon/soundcloud.png | Bin 0 -> 1289 bytes static/icon/spotify.png | Bin 0 -> 2114 bytes static/icon/steam.png | Bin 0 -> 1875 bytes static/icon/twitter.png | Bin 0 -> 1361 bytes static/icon/w3html.png | Bin 0 -> 1542 bytes static/icon/website.png | Bin 0 -> 2854 bytes static/icon/wikipedia.png | Bin 0 -> 1363 bytes static/icon/youtube.png | Bin 0 -> 2363 bytes static/style.css | 1176 ++++++++++++++++++++++++++++++++++++++++ 24 files changed, 1858 insertions(+) create mode 100644 static/client.js create mode 100644 static/icon/amazon.png create mode 100644 static/icon/appstore.png create mode 100644 static/icon/facebook.png create mode 100644 static/icon/gamespot.png create mode 100644 static/icon/github.png create mode 100644 static/icon/googleplay.png create mode 100644 static/icon/imdb.png create mode 100644 static/icon/instagram.png create mode 100644 static/icon/itunes.png create mode 100644 static/icon/microsoft.png create mode 100644 static/icon/quora.png create mode 100644 static/icon/reddit.png create mode 100644 static/icon/rottentomatoes.png create mode 100644 static/icon/sciencedirect.png create mode 100644 static/icon/soundcloud.png create mode 100644 static/icon/spotify.png create mode 100644 static/icon/steam.png create mode 100644 static/icon/twitter.png create mode 100644 static/icon/w3html.png create mode 100644 static/icon/website.png create mode 100644 static/icon/wikipedia.png create mode 100644 static/icon/youtube.png create mode 100644 static/style.css (limited to 'static') diff --git a/static/client.js b/static/client.js new file mode 100644 index 0000000..82ea4df --- /dev/null +++ b/static/client.js @@ -0,0 +1,682 @@ + +/* + Global functions +*/ +function htmlspecialchars(str){ + + var map = { + '&': '&', + '<': '<', + '>': '>', + '"': '"', + "'": ''' + } + + return str.replace(/[&<>"']/g, function(m){return map[m];}); +} + +function htmlspecialchars_decode(str){ + + var map = { + '&': '&', + '<': '<', + '>': '>', + '"': '"', + ''': "'" + } + + return str.replace(/&|<|>|"|'/g, function(m){return map[m];}); +} + +function is_click_within(elem, classname, is_id = false){ + + while(true){ + + if(elem === null){ + + return false; + } + + if( + ( + is_id === false && + elem.className == classname + ) || + ( + is_id === true && + elem.id == classname + ) + ){ + + return elem; + } + + elem = elem.parentElement; + } +} + + + +/* + Prevent GET parameter pollution +*/ +var form = document.getElementsByTagName("form"); + +if( + form.length !== 0 && + window.location.pathname != "/" && + window.location.pathname != "/settings.php" && + window.location.pathname != "/settings" +){ + form = form[0]; + + var scraper_dropdown = document.getElementsByName("scraper")[0]; + + scraper_dropdown.addEventListener("change", function(choice){ + + submit(form); + }); + + form.addEventListener("submit", function(e){ + + e.preventDefault(); + submit(e.srcElement); + }); +} + +function submit(e){ + + var GET = ""; + var first = true; + + if((s = document.getElementsByName("s")).length !== 0){ + + GET += "?s=" + encodeURIComponent(s[0].value).replaceAll("%20", "+"); + first = false; + } + + Array.from( + e.getElementsByTagName("select") + ).concat( + Array.from( + e.getElementsByTagName("input") + ) + ).forEach(function(el){ + + var firstelem = el.getElementsByTagName("option"); + + if( + ( + ( + firstelem.length === 0 || + firstelem[0].value != el.value + ) && + el.name != "" && + el.value != "" && + el.name != "s" + ) || + el.name == "scraper" || + el.name == "nsfw" + ){ + + if(first){ + + GET += "?"; + first = false; + }else{ + + GET += "&"; + } + + GET += encodeURIComponent(el.name).replaceAll("%20", "+") + "=" + encodeURIComponent(el.value).replaceAll("%20", "+"); + } + }); + + window.location.href = GET; +} + + + +/* + Hide show more button when it's not needed on answers +*/ +var answer_div = document.getElementsByClassName("answer"); + +if(answer_div.length !== 0){ + answer_div = Array.from(answer_div); + var spoiler_button_div = Array.from(document.getElementsByClassName("spoiler-button")); + + // execute on pageload + hide_show_more(); + + window.addEventListener("resize", hide_show_more); + + function hide_show_more(){ + + var height = window.innerWidth >= 1000 ? 600 : 200; + + for(i=0; i(' + collection.length + ')' + + '' + + '' + htmlspecialchars(title) + ''; + + popup_body.innerHTML = + ''; + + // make changes to DOM + popup_body.style.display = "block"; + popup_bg.style.display = "block"; + popup_status.style.display = "table"; + + // store for rotation functions & changeimage() + popup_image = document.getElementById("popup-image"); + + scalepopup(collection[collection_index], scale); + centerpopup(); + }else{ + + // click inside the image viewer + // resize image + if(is_click_within(click.target, "popup", true)){ + + if(mouse_move === false){ + scale = 80; + scalepopup(collection[collection_index], scale); + centerpopup(); + } + }else{ + + if(is_click_within(click.target, "popup-status", true) === false){ + + // click outside the popup while its open + // close it + if(is_popup_shown){ + + hidepopup(); + } + } + } + } + }); + + /* + Scale image viewer + */ + popup_body.addEventListener("wheel", function(scroll){ + + event.preventDefault(); + + if( + scroll.altKey || + scroll.ctrlKey || + scroll.shiftKey + ){ + + var increment = 7; + }else{ + + var increment = 14; + } + + if(scroll.wheelDelta > 0){ + + // scrolling up + scale = scale + increment; + }else{ + + // scrolling down + if(scale - increment > 7){ + scale = scale - increment; + } + } + + // calculate relative size before scroll + var pos = popup_body.getBoundingClientRect(); + var x = (scroll.x - pos.x) / pos.width; + var y = (scroll.y - pos.y) / pos.height; + + scalepopup(collection[collection_index], scale); + + // move popup to % we found + pos = popup_body.getBoundingClientRect(); + + movepopup( + popup_body, + scroll.clientX - (x * pos.width), + scroll.clientY - (y * pos.height) + ); + }); + + /* + Keyboard controls + */ + + document.addEventListener("keydown", function(key){ + + // close popup + if( + is_popup_shown && + key.keyCode === 27 + ){ + + hidepopup(); + return; + } + + if(is_popup_shown === false){ + + return; + } + + if( + key.altKey || + key.ctrlKey || + key.shiftKey + ){ + + // mirror image + switch(key.keyCode){ + + case 37: + // left + key.preventDefault(); + mirror_x = true; + break; + + case 38: + // up + key.preventDefault(); + mirror_y = false; + break; + + case 39: + // right + key.preventDefault(); + mirror_x = false; + break; + + case 40: + // down + key.preventDefault(); + mirror_y = true; + break; + } + }else{ + + // rotate image + switch(key.keyCode){ + + case 37: + // left + key.preventDefault(); + rotation = -90; + break; + + case 38: + // up + key.preventDefault(); + rotation = 0; + break; + + case 39: + // right + key.preventDefault(); + rotation = 90; + break; + + case 40: + // down + key.preventDefault(); + rotation = -180; + break; + } + } + + popup_image.style.transform = + "scale(" + + (mirror_x ? "-1" : "1") + + ", " + + (mirror_y ? "-1" : "1") + + ") " + + "rotate(" + + rotation + "deg" + + ")"; + }); +} + +function getproxylink(url){ + + if(url.startsWith("data:")){ + + return htmlspecialchars(url); + }else{ + + console.log(url); + return '/proxy?i=' + encodeURIComponent(url); + } +} + +function hidepopup(){ + + is_popup_shown = false; + popup_status.style.display = "none"; + popup_body.style.display = "none"; + popup_bg.style.display = "none"; +} + +function scalepopup(size, scale){ + + var ratio = + Math.min( + (window.innerWidth * (scale / 100)) / collection[collection_index].width, (window.innerHeight * (scale / 100)) / collection[collection_index].height + ); + + popup_body.style.width = size.width * ratio + "px"; + popup_body.style.height = size.height * ratio + "px"; +} + +function centerpopup(){ + + var size = popup_body.getBoundingClientRect(); + var size = { + "width": parseInt(size.width), + "height": parseInt(size.height) + }; + + movepopup( + popup_body, + (window.innerWidth / 2) - (size.width / 2), + (window.innerHeight / 2) - (size.height / 2) + ); +} + +function movepopup(popup_body, x, y){ + + popup_body.style.left = x + "px"; + popup_body.style.top = y + "px"; +} + +function changeimage(event){ + + // reset rotation params + mirror_x = false; + mirror_y = false; + rotation = 0; + + scale = 60; + + collection_index = parseInt(event.target.value); + + // we set innerHTML otherwise old image lingers a little + popup_body.innerHTML = + ''; + + // store for rotation functions & changeimage() + popup_image = document.getElementById("popup-image"); + + scalepopup(collection[collection_index], scale); + centerpopup(); +} + +/* + Shortcuts +*/ +var searchbox_wrapper = document.getElementsByClassName("searchbox"); + +if(searchbox_wrapper.length !== 0){ + searchbox_wrapper = searchbox_wrapper[0]; + var searchbox = searchbox_wrapper.getElementsByTagName("input")[1]; + + document.addEventListener("keydown", function(key){ + + switch(key.keyCode){ + + case 191: + // 191 = / + if(document.activeElement.tagName == "INPUT"){ + + // already focused, ignore + break; + } + + if( + typeof is_popup_shown != "undefined" && + is_popup_shown + ){ + + hidepopup(); + } + + window.scrollTo(0, 0); + searchbox.focus(); + key.preventDefault(); + break; + } + }); +} diff --git a/static/icon/amazon.png b/static/icon/amazon.png new file mode 100644 index 0000000..75b52a7 Binary files /dev/null and b/static/icon/amazon.png differ diff --git a/static/icon/appstore.png b/static/icon/appstore.png new file mode 100644 index 0000000..46a0be0 Binary files /dev/null and b/static/icon/appstore.png differ diff --git a/static/icon/facebook.png b/static/icon/facebook.png new file mode 100644 index 0000000..e40590c Binary files /dev/null and b/static/icon/facebook.png differ diff --git a/static/icon/gamespot.png b/static/icon/gamespot.png new file mode 100644 index 0000000..a5b781e Binary files /dev/null and b/static/icon/gamespot.png differ diff --git a/static/icon/github.png b/static/icon/github.png new file mode 100644 index 0000000..f0455f4 Binary files /dev/null and b/static/icon/github.png differ diff --git a/static/icon/googleplay.png b/static/icon/googleplay.png new file mode 100644 index 0000000..f59ca3d Binary files /dev/null and b/static/icon/googleplay.png differ diff --git a/static/icon/imdb.png b/static/icon/imdb.png new file mode 100644 index 0000000..8ddb803 Binary files /dev/null and b/static/icon/imdb.png differ diff --git a/static/icon/instagram.png b/static/icon/instagram.png new file mode 100644 index 0000000..f1bf8e6 Binary files /dev/null and b/static/icon/instagram.png differ diff --git a/static/icon/itunes.png b/static/icon/itunes.png new file mode 100644 index 0000000..cf99ab4 Binary files /dev/null and b/static/icon/itunes.png differ diff --git a/static/icon/microsoft.png b/static/icon/microsoft.png new file mode 100644 index 0000000..830fadf Binary files /dev/null and b/static/icon/microsoft.png differ diff --git a/static/icon/quora.png b/static/icon/quora.png new file mode 100644 index 0000000..2bcbb48 Binary files /dev/null and b/static/icon/quora.png differ diff --git a/static/icon/reddit.png b/static/icon/reddit.png new file mode 100644 index 0000000..8f24212 Binary files /dev/null and b/static/icon/reddit.png differ diff --git a/static/icon/rottentomatoes.png b/static/icon/rottentomatoes.png new file mode 100644 index 0000000..01f553a Binary files /dev/null and b/static/icon/rottentomatoes.png differ diff --git a/static/icon/sciencedirect.png b/static/icon/sciencedirect.png new file mode 100644 index 0000000..17e03c0 Binary files /dev/null and b/static/icon/sciencedirect.png differ diff --git a/static/icon/soundcloud.png b/static/icon/soundcloud.png new file mode 100644 index 0000000..9c86c48 Binary files /dev/null and b/static/icon/soundcloud.png differ diff --git a/static/icon/spotify.png b/static/icon/spotify.png new file mode 100644 index 0000000..07fd1f3 Binary files /dev/null and b/static/icon/spotify.png differ diff --git a/static/icon/steam.png b/static/icon/steam.png new file mode 100644 index 0000000..749ba3e Binary files /dev/null and b/static/icon/steam.png differ diff --git a/static/icon/twitter.png b/static/icon/twitter.png new file mode 100644 index 0000000..a6d4389 Binary files /dev/null and b/static/icon/twitter.png differ diff --git a/static/icon/w3html.png b/static/icon/w3html.png new file mode 100644 index 0000000..c010842 Binary files /dev/null and b/static/icon/w3html.png differ diff --git a/static/icon/website.png b/static/icon/website.png new file mode 100644 index 0000000..02b2670 Binary files /dev/null and b/static/icon/website.png differ diff --git a/static/icon/wikipedia.png b/static/icon/wikipedia.png new file mode 100644 index 0000000..18cf9a0 Binary files /dev/null and b/static/icon/wikipedia.png differ diff --git a/static/icon/youtube.png b/static/icon/youtube.png new file mode 100644 index 0000000..6951c84 Binary files /dev/null and b/static/icon/youtube.png differ diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..c7cacfe --- /dev/null +++ b/static/style.css @@ -0,0 +1,1176 @@ + +/* + Global styles +*/ +:root{ + /* background */ + --1d2021: #1d2021; + --282828: #282828; + --3c3836: #3c3836; + --504945: #504945; + + /* font */ + --928374: #928374; + --a89984: #a89984; + --bdae93: #bdae93; + --8ec07c: #8ec07c; + --ebdbb2: #ebdbb2; + + /* code highlighter */ + --comment: #9e8e73; + --default: #d4be98; + --keyword: #d8a657; + --string: #7daea7; +} + +.theme-white{ + /* background */ + --1d2021: #bdae93; + --282828: #a89984; + --3c3836: #a89984; + --504945: #504945; + + /* font */ + --928374: #1d2021; + --a89984: #282828; + --bdae93: #3c3836; + --8ec07c: #52520e; + --ebdbb2: #1d2021; + + /* code highlighter */ + --comment: #6a4400; + --default: #d4be98; + --keyword: #4a4706; + --string: #076678; +} + +.theme-white .autocomplete .entry:hover{ + background:#928374; +} + +audio{ + max-width:100%; +} + +body,html{ + padding:0; + margin:0; +} + +body{ + background:var(--1d2021); + color:var(--a89984); + font-size:16px; + box-sizing:border-box; + font-family:sans-serif; + padding:15px 7% 45px; + word-wrap:anywhere; + line-height:22px; + max-width:2000px; +} + +h1,h2,h3,h4,h5,h6{ + padding:0; + margin:0 0 7px 0; + line-height:initial; + color:var(--bdae93); +} + +h3,h4,h5,h6{ + margin-bottom:14px; +} + +/* + Web styles +*/ +#overflow{ + overflow:hidden; +} + +/* Searchbox */ +.searchbox{ + width:40%; + height:36px; + border:1px solid var(--504945); + background:var(--282828); + border-radius:2px; + margin-bottom:10px; + position:relative; +} + +.searchbox .wrapper{ + overflow:hidden; +} + +.searchbox input[type="text"]{ + width:100%; + padding-left:10px; +} + +.searchbox input[type="text"]::placeholder{ + color:var(--928374); +} + +.searchbox input[type="submit"]{ + float:right; + cursor:pointer; + padding:0 10px; +} + +.searchbox input[type="submit"]:hover{ + text-decoration:underline; +} + +.searchbox input{ + all:unset; + line-height:36px; + box-sizing:border-box; + height:36px; + color:var(--bdae93); +} + +.searchbox:focus-within{ + border:1px solid var(--928374); +} + +.autocomplete{ + display:none; + position:absolute; + top:35px; + left:-1px; + right:-1px; + background:var(--282828); + border:1px solid var(--504945); + border-top:none; + border-radius:0 0 2px 2px; + z-index:10; +} + +.autocomplete .entry{ + overflow:hidden; + padding:4px 10px; + cursor:pointer; +} + +.autocomplete .entry:hover{ + background:var(--3c3836); +} + +.autocomplete .title{ + float:left; +} + +.autocomplete .subtext{ + float:right; + font-size:14px; + color:var(--928374); + margin-left:7px; +} + +/* Tabs */ +.tabs, .filters{ + overflow:hidden; + overflow-x:auto; + white-space:nowrap; +} + +.tabs{ + padding-bottom:10px; +} + +.tabs .tab{ + text-decoration:none; + color:var(--bdae93); + padding:4px 10px; + display:inline-block; +} + +.tabs .tab:hover{ + text-decoration:underline; +} + +.tabs .tab.selected{ + border-bottom:2px solid var(--bdae93); +} + +/* Filters */ +.filters{ + padding-bottom:15px; + margin-bottom:7px; +} + +.filters .filter{ + display:inline-block; + margin-right:7px; + vertical-align:bottom; +} + +.filters .filter .title{ + font-size:13px; + margin:0 4px; +} + +.filters .filter input, +.filters .filter select{ + all:unset; + display:block; + border:1px solid var(--504945); + border-radius:2px; + font-size:14px; + padding:0 4px; + width:127px; + height:24px; +} + + +/* + HOME +*/ +.home{ + min-height:100vh; + margin:0 auto; + display:table; + text-align:center; +} + +.home .logo{ + max-width:400px; + height:100px; + margin:0 auto 17px auto; +} + +.home img{ + line-height:100px; + font-size:60px; + text-align:center; + font-family:Times; + width:100%; + height:100%; + background:var(--282828); + display:block; + object-fit:contain; +} + +.home #center{ + display:table-cell; + vertical-align:middle; + width:500px; +} + +.home .searchbox{ + width:100%; + text-align:left; + margin-bottom:20px; +} + +.home a{ + color:inherit; +} + +.home .subtext{ + margin-top:17px; + line-height:16px; + font-size:12px; +} + + +/* + WEB +*/ + +/* Left wrapper */ +.web .left{ + width:40%; + float:left; +} + +/* infobox */ +.infobox{ + border:1px dashed var(--504945); + padding:10px; + margin-bottom:17px; +} + +.infobox .code{ + white-space:initial; +} + +.infobox ul{ + padding-left:27px; + margin-bottom:0; +} + +.infobox a{ + color:var(--bdae93); +} + +.infobox a:hover{ + text-decoration:underline; +} + +/* text-result */ +.web .text-result{ + margin-bottom:30px; +} + +.web .description{ + white-space:pre-line; +} + +.web .type{ + border:1px solid var(--928374); + background:var(--282828); + padding:0 4px; + border-radius:2px; + font-size:14px; + line-height:16px; + float:left; + margin:2px 7px 0 0; +} + +.web .url{ + position:relative; +} + +.web .url .part{ + font-size:15px; + text-decoration:none; + color:var(--928374); +} + +.web .separator::before{ + content:"/"; + padding:0 4px; + color:var(--504945); + font-size:12px; +} + +.web .part:hover{ + text-decoration:underline; +} + +.web .hover{ + display:block; + text-decoration:none; + color:var(--a89984); + overflow:hidden; + clear:left; + padding-top:7px; +} + +.web .text-result .title{ + font-size:18px; + color:var(--bdae93); + margin-bottom:7px; +} + +.web .text-result a:visited .title{ + color:var(--928374) !important; +} + +.theme-white .web .text-result a:visited .title{ + color:#7c6f64 !important; +} + +.web .text-result .hover:hover .title{ + text-decoration:underline; +} + +.web .text-result .author{ + font-style:italic; +} + +.web .text-result .greentext{ + font-size:14px; + color:var(--8ec07c); +} + +.web .right-right .text-result:last-child, +.web .right-left .text-result:last-child{ + margin-bottom:0; +} + +/* favicon */ +.favicon{ + all:unset; + float:left; + cursor:pointer; +} + +.favicon-dropdown{ + display:none; + position:absolute; + top:25px; + background:var(--282828); + border:1px solid var(--504945); + border-radius:2px; + z-index:3; + word-wrap:normal; +} + +.favicon-dropdown::before{ + content:""; + position:absolute; + top:-10px; + left:2px; + border:5px solid transparent; + border-bottom:5px solid var(--504945); +} + +.favicon-dropdown a{ + text-decoration:none; + color:var(--bdae93); + display:block; + padding:2px 7px 2px 5px; + font-size:13px; +} + +.favicon-dropdown a:hover{ + text-decoration:underline; +} + +.favicon-dropdown:hover, +.favicon:focus + .favicon-dropdown, +.favicon-dropdown:focus-within{ + display:block; +} + +.web .favicon img, +.favicon-dropdown img{ + margin:3px 7px 0 0; + height:16px; + font-size:12px; + line-height:16px; + text-align:center; + display:block; + text-align:left; +} + +.favicon-dropdown img{ + float:left; + margin:2px 7px 0 0; +} + +/* thumbnails */ +.thumb-wrap{ + position:relative; + float:right; + width:160px; + height:90px; + background:var(--282828); + text-align:center; + line-height:87px; + border:1px solid var(--504945); + overflow:hidden; + margin-left:7px; +} + +.duration{ + position:absolute; + right:0; + bottom:0; + padding:1px 2px; + line-height:14px; + background:var(--3c3836); + font-size:12px; + border-left:1px solid var(--504945); + border-top:1px solid var(--504945); + font-family:monospace; +} + +.web .text-result:hover .thumb-wrap .duration{ + display:none; +} + +.thumb-wrap .thumb{ + max-width:100%; + max-height:100%; + text-align:left; + vertical-align:middle; +} + +.thumb-wrap.portrait{ + width:50px; +} + +.thumb-wrap.square{ + width:90px; +} + +/* Next page */ +.nextpage{ + margin:0 0 30px; + text-align:center; + display:block; + padding:10px; + border:1px solid var(--504945); + border-radius:2px; + text-decoration:none; + color:var(--bdae93); +} + +.nextpage:hover{ + text-decoration:underline; +} + +/* Right wrapper */ +.web .right-wrapper{ + width:60%; + float:right; + overflow:hidden; + padding-left:15px; + box-sizing:border-box; +} + +.web .right-right, +.web .right-left{ + float:right; + width:50%; + padding:0 15px; + box-sizing:border-box; + overflow:hidden; + min-height:1px; +} + +.web .right-right{ + padding-right:0; +} + +/* + Tables +*/ +table{ + width:100%; + text-align:left; + border-collapse:collapse; +} + +table td{ + width:50%; + padding:0; + vertical-align:top; +} + +table tr td:first-child{ + padding-right:7px; +} + +table a{ + display:block; + text-decoration:none; + color:var(--a89984); + padding:0 10px 0 0; +} + +table tr a:last-child{ + padding-right:0; +} + +/* Related */ +.related{ + margin-bottom:20px; +} + +.related a{ + padding-bottom:10px; + color:var(--bdae93); +} + +.related a:hover{ + text-decoration:underline; +} + +/* + Answers +*/ +.web .answer{ + max-height:600px; + overflow:hidden; + padding-bottom:17px; + position:relative; +} + +.web .answer::after{ + content:""; + position:absolute; + bottom:0; + width:100%; + height:17px; + background:linear-gradient(transparent, var(--1d2021)); + pointer-events:none; +} + +.web .answer-title{ + text-decoration:none; + color:var(--a89984); +} + +.web .answer-title a:hover{ + text-decoration:underline; +} + +.web .spoiler:checked + .answer{ + overflow:initial; + max-height:initial; +} + +.web .spoiler{ + display:none; +} + +.web .spoiler-button{ + display:block; + border:1px solid var(--504945); + border-radius:2px; + line-height:30px; + padding:0 7px; + text-align:center; + cursor:pointer; +} + +.web .answer-wrapper{ + margin-bottom:27px; +} + +.web .spoiler-button:hover{ + text-decoration:underline; +} + +.web .spoiler-button::before{ + content:"Show more"; +} + +.web .spoiler:checked + .answer + .spoiler-button::before{ + content:"Show less"; +} + +/* Tables on left handside */ +.web .info-table{ + margin:10px 0; + font-size:15px; + color:var(--928374); + background:var(--282828); + border:1px dashed var(--504945); +} + +.web .info-table td{ + padding:4px 10px; +} + +.web .info-table tr td:first-child{ + width:1%; + white-space:nowrap; + padding-right:17px; + color:var(--a89984); +} + +.web .info-table tr:nth-child(even){ + background:var(--1d2021); +} + +.web .sublinks{ + padding:17px 10px 0; + font-size:15px; + color:var(--#928374); +} + +.web .sublinks table td{ + padding-bottom:17px; +} + +.web .sublinks table tr:last-child td:last-child{ + padding-bottom:0; +} + +.web .sublinks a:hover .title{ + text-decoration:underline; +} + +/* Wikipedia head */ +.web .wiki-head .photo{ + float:right; + margin:0 1px 10px 10px; +} +.web .wiki-head .photo img{ + display:block; + max-width:200px; + max-height:200px; + filter:drop-shadow(1px 0 0 var(--504945)) drop-shadow(-1px 0 0 var(--504945)) drop-shadow(0 -1px 0 var(--504945)) drop-shadow(0 1px 0 var(--504945)); +} + +.web .wiki-head .description{ + clear:left; + padding-top:7px; + overflow:hidden; +} + +.web .wiki-head table, .about table{ + margin-top:17px; + border:1px dashed var(--504945); +} + +.web .wiki-head td, .about table td{ + padding:4px 7px; + vertical-align:middle; +} + +.web .wiki-head tr td:first-child, .about table tr td:first-child{ + width:30%; + min-width:150px; +} + +.web .wiki-head tr:nth-child(odd), .about table tr:nth-child(odd){ + background:var(--282828); +} + +.web .wiki-head .socials{ + overflow:hidden; + margin-top:17px; +} + +.web .wiki-head .socials a{ + width:74px; + height:80px; + padding-right:4px; + float:left; + color:var(--bdae93); + text-decoration:none; + display:table; +} + +.web .wiki-head .socials a:hover .title{ + text-decoration:underline; +} + +.web .wiki-head .socials .center{ + display:table-cell; + vertical-align:middle; +} + +.web .wiki-head .socials img{ + margin:0 auto; + display:block; + text-align:center; + width:36px; + height:36px; + line-height:36px; +} + +.web .wiki-head .socials .title{ + margin-top:7px; + text-align:center; + font-size:13px; + line-height:13px; +} + +.web .fullimg{ + display:block; + max-width:100%; + max-height:150px; + margin:7px 0 17px; + box-sizing:border-box; + border:1px solid var(--504945); +} + +/* + Code tags +*/ +.code{ + white-space:pre; + font-family:monospace; + background:var(--3c3836); + color:var(--bdae93); + padding:7px; + margin:4px 0 13px 0; + overflow-x:auto; + border-radius:2px; + border:1px solid var(--504945); +} + +.code-inline{ + display:inline; + font-family:monospace; + background:var(--282828); + color:var(--bdae93); + border:1px solid var(--928374); + padding:0 4px; + border-radius:2px; +} + +/* Wiki-head titles and quotes */ +.web .wiki-head h2{ + font-size:20px; + margin:20px 0 13px 0; +} + +.web .wiki-head h2:first-child{ + margin-top:10px; +} + +.web .wiki-head a{ + color:var(--bdae93); +} + +.quote{ + font-style:italic; + margin:10px 0 13px; + padding-left:10px; + border-left:1px solid #504945; +} + +/* + Web images +*/ +.web .images{ + overflow:hidden; + margin:0 -5px; + font-size:0; +} + +.web .images .duration{ + display:none; + border:1px solid var(--504945); + right:5px; + bottom:5px; +} + +.web .images .image:hover .duration{ + display:block; +} + +.web .images .image{ + width:90px; + height:90px; + padding:5px; + position:relative; + line-height:90px; + display:inline-block; + text-align:center; + color:inherit; +} + +.web .images .image img{ + max-width:100%; + max-height:100%; + vertical-align:middle; +} + + +/* + Images tab +*/ + +#images{ + overflow:hidden; + margin-bottom:10px; +} + +#images .infobox{ + width:40%; + box-sizing:border-box; +} + +#images .image-wrapper{ + line-height:15px; + width:20%; + float:left; +} + +#images .image{ + margin:0 auto; + width:250px; + max-width:100%; + padding:7px 7px 30px 7px; + box-sizing:border-box; + font-size:14px; +} + +#images a{ + color:inherit; + text-decoration:none; + display:block; +} + +#images a:hover .title{ + text-decoration:underline; +} + +#images .thumb{ + display:block; + height:180px; + margin-bottom:10px; + position:relative; +} + +#images .duration{ + display:block; + border:1px solid #504945; +} + +#images .image:hover .duration{ + display:none; +} + +#images img{ + width:100%; + height:100%; + object-fit:contain; +} + +#images .image .title{ + white-space:nowrap; + overflow:hidden; + margin-bottom:7px; + font-weight:bold; +} + +#images .image .description{ + overflow:hidden; + height:45px; +} + +.nextpage.img{ + width:50%; + margin:0 auto 50px; +} + +#popup{ + display:none; + position:fixed; + top:0; + left:0; + cursor:grab; + user-select:none; + pointer-events:none; +} + +#popup:active{ + cursor:grabbing; +} + +#popup-image{ + border:1px solid var(--928374); + display:block; + margin:0 auto; + pointer-events:all; + width:100%; + height:100%; + object-fit:contain; + background:var(--282828); +} + +#popup-status{ + display:none; + position:fixed; + top:0; + left:0; + width:100%; + height:35px; + background:var(--1d2021); + border-bottom:1px solid var(--928374); +} + +#popup-bg{ + background:var(--1d2021); + opacity:.5; + position:fixed; + top:0; + left:0; + width:100%; + height:100%; + display:none; +} + +#popup-status select{ + display:block; + width:250px; +} + +#popup-num, +#popup-title{ + display:table-cell; + width:0; + word-wrap:normal; + padding:0 10px; + line-height:35px; + color:var(--ebdbb2); + text-decoration:none; +} + +#popup-title:hover{ + text-decoration:underline; +} + +#popup-title{ + width:initial; + overflow:hidden; + height:35px; + display:block; +} + +#popup-num{ + font-weight:bold; +} + +#popup-dropdown{ + display:table-cell; + vertical-align:middle; + width:0; +} + +/* + Settings page +*/ +.web .settings{ + margin-top:17px; + border:1px dashed var(--504945); + padding:7px 10px 0; +} + +.web .setting{ + margin-bottom:17px; +} + +.web .setting .title{ + font-size:14px; +} + +.web .settings-submit{ + margin:17px 10px; +} + +.web .settings-submit input{ + float:right; +} + +.web .settings-submit a{ + margin-right:17px; + color:var(--bdae93); +} + +/* + About page +*/ +.about a{ + color:var(--bdae93); +} + +.about h1, .about h2{ + margin-top:17px; +} + +.about table{ + margin-bottom:17px; +} + +.about table a{ + display:inline; +} + + +/* + Syntax highlight +*/ +.c-comment{ + color:var(--comment); +} +.c-default{ + color:var(--default); +} +.c-html{ + color:var(--html); +} +.c-keyword{ + color:var(--keyword); + font-weight:bold; +} +.c-string{ + color:var(--string); +} + +/* + Responsive image +*/ +@media only screen and (max-width: 1454px){ #images .image-wrapper{ width:25%; } } +@media only screen and (max-width: 1161px){ #images .image-wrapper{ width:33.3333%; } } +@media only screen and (max-width: 750px){ #images .image-wrapper{ width:50%; } } +@media only screen and (max-width: 450px){ #images .image-wrapper{ width:100%; } } + + +/* + Responsive design +*/ +@media only screen and (max-width: 1550px){ + + .web .right-right, + .web .right-left{ + float:none; + width:initial; + padding:0 0 0 15px; + } + + .web .left, + .searchbox, + #images .infobox{ + width:60%; + } + + .web .right-wrapper{ + width:40%; + } +} + +@media only screen and (max-width: 1000px){ + + .nextpage.img{ + width:initial; + } + + .web .right-right, + .web .right-left{ + border:none; + padding:0; + } + + .web .right-wrapper{ + float:none; + padding:0; + width:initial; + } + + .web .left, + .searchbox{ + width:100%; + } + + table td{ + display:block; + width:100%; + } + + table a{ + padding:0; + } + + .web.has-answer .left::before{ + display:block; + content:"Results"; + font-size:24px; + font-weight:bold; + margin-bottom:17px; + color:var(--bdae93); + } + + .web .answer{ + max-height:200px; + } + + .web .wiki-head tr td:first-child, + .web .info-table tr td:first-child{ + text-decoration:underline; + } + + #images .infobox{ + width:100%; + } +} -- cgit v1.2.3