add themes

2 files changed, 1146 insertions, 0 deletions

diff --git a/static/themes/gentoo.css b/static/themes/gentoo.css
new file mode 100644
index 0000000..b727108
--- /dev/null
+++ b/static/themes/gentoo.css
@@ -0,0 +1,20 @@
+:root{
+	/* background */
+	--1d2021: #21222d;
+	--282828: #393657;
+	--3c3836: #27273c;
+	--504945: #aa85e1;
+	
+	/* font */
+	--928374: #906be3;
+	--a89984: #9794ac;
+	--bdae93: #cec0f2;
+	--8ec07c: #5db6e1;
+	--ebdbb2: #b194f5;
+	
+	/* code highlighter */
+	--comment: #a0c0a4;
+	--default: #f00;
+	--keyword: #9376e4;
+	--string: #ecd78f;
+}
diff --git a/static/themes/gore's shitty theme.css b/static/themes/gore's shitty theme.css
new file mode 100644
index 0000000..230a412
--- /dev/null
+++ b/static/themes/gore's shitty theme.css
@@ -0,0 +1,1126 @@
+:root{
+	--1d2021: #1d2021;
+	--282828: #282828;
+	--3c3836: #3c3836;
+	--504945: #504945;
+	
+	/* font */
+	--928374: #928374;
+	--a89984: #c9c5bf;
+	--bdae93: #bdae93;
+	--8ec07c: #8ec07c;
+	--ebdbb2: #ebdbb2;
+}
+
+.theme-white{
+	--1d2021: #bdae93;
+	--282828: #a89984;
+	--3c3836: #a89984;
+	--504945: #504945;
+	
+	/* font */
+	--928374: #1d2021;
+	--a89984: #282828;
+	--bdae93: #3c3836;
+	--8ec07c: #52520e;
+	--ebdbb2: #1d2021;
+}
+
+.theme-white .autocomplete .entry:hover{
+	background:#928374;
+}
+
+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 4% 40px;
+	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;
+  border-left: 1px solid var(--504945);
+  background: #723c0b;
+}
+
+.searchbox input[type="submit"]:hover{
+	text-decoration:underline;
+}
+
+.searchbox input{
+	all:unset;
+	line-height:36px;
+	box-sizing:border-box;
+	height:36px;
+}
+
+.searchbox:focus-within{
+	border:1px solid #ee8a9c;
+}
+
+.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:0px;
+}
+
+.tabs .tab{
+	text-decoration:none;
+	color:#d3d0c1;
+	padding:0px 10px;
+	display:inline-block;
+}
+
+.tabs .tab:hover{
+	text-decoration:underline;
+}
+
+.tabs .tab.selected{
+	border-bottom:2px solid #fc92a5;
+}
+
+/* Filters */
+.filters{
+	padding-bottom:12px;
+	padding-top:7px;
+	margin-bottom:7px;
+	background-color:#232525
+}
+
+.filters .filter{
+	display:inline-block;
+	margin-right:7px;
+}
+
+.filters .filter .title{
+	font-size:13px;
+}
+
+.filters .filter input,
+.filters .filter select{
+	all:unset;
+	display:block;
+	border:1px solid var(--504945);
+	border-radius:2px;
+	font-size:14px;
+	padding:0 2px;
+	width:127px;
+	height:22px;
+}
+
+
+/*
+	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 */
+.web .infobox{
+	border:1px dashed var(--504945);
+	padding:10px;
+	margin-bottom:17px;
+}
+
+.web .infobox .code{
+	white-space:initial;
+}
+
+.web .infobox ul{
+	padding-left:27px;
+	margin-bottom:0;
+}
+
+.web .infobox a{
+	color:var(--bdae93);
+}
+
+.web .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:#90c186;
+}
+
+.web .separator::before{
+	content:"/";
+	padding:0 4px;
+	color:#5ab442;
+	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:3px;
+}
+
+.web .text-result .title{
+	font-size:18px;
+	color:#81b5f4;
+	margin-bottom:5px;
+}
+
+.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(--bdae93);
+}
+
+.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:#d3d0c1;
+	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;;
+	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;
+	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 .text-result .sublinks:last-child{
+	padding-bottom:0;
+}
+
+.web .sublinks a:hover .title{
+	text-decoration:underline;
+}
+
+/* Wikipedia head */
+.wiki-head{
+	padding:5px;
+	background-color: #322f2b
+}
+
+.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{
+	line-height:15px;
+	overflow:hidden;
+	margin-bottom:10px;
+}
+
+#images .image-wrapper{
+	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;
+    color:var(--bdae93);
+}
+
+#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-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:#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;
+}
+
+/*
+	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:25%; } }
+@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{
+		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;
+	}
+}
+
+    .type{
+    color:var(--bdae93);
+    }