[gentoo-commits] proj/forums:styles/gentoo-dark commit in: theme/

[Jimi Huotari]

commit:     5c04472a63a15dde23b0d1d62f5daa880a6b963f
Author:     Jimi Huotari <chiitoo <AT> gentoo <DOT> org>
AuthorDate: Thu Feb  6 01:36:57 2020 +0000
Commit:     Jimi Huotari <chiitoo <AT> gentoo <DOT> org>
CommitDate: Thu Feb  6 08:46:11 2020 +0000
URL:        https://gitweb.gentoo.org/proj/forums.git/commit/?id=5c04472a

Bring the Light style to the Dark side.

Signed-off-by: Jimi Huotari <chiitoo <AT> gentoo.org>

 theme/colours.css | 276 +++++++++++++++++++++++++-----------------------------
 1 file changed, 130 insertions(+), 146 deletions(-)

diff --git a/theme/colours.css b/theme/colours.css
index 234f4196a..84045929a 100644
--- a/theme/colours.css
+++ b/theme/colours.css
@@ -4,8 +4,8 @@ Colours and backgrounds for common.css
 -------------------------------------------------------------- */
 
 html, body {
-	color: #000000;
-	background-color: #ffffff;
+	color: #afafaf;
+	background-color: #222222;
 }
 
 h1 {
@@ -13,12 +13,12 @@ h1 {
 }
 
 h2 {
-	color: #28313F;
+	color: #afafaf;
 }
 
 h3 {
 	border-bottom-color: #CCCCCC;
-	color: #333333;
+	color: #afafaf;
 }
 
 hr {
@@ -26,21 +26,13 @@ hr {
 	border-top-color: #CCCCCC;
 }
 
-.rightside {
-	color: #efefef;
-}
-
-.responsive-center {
-	color: #333333;
-}
-
 /*
 --------------------------------------------------------------
 Colours and backgrounds for links.css
 -------------------------------------------------------------- */
 
 a {
-	color: #663399;
+	color: #ae6fec;
 }
 
 a:hover {
@@ -63,11 +55,9 @@ a:hover {
 	color: #ff6633;
 }
 
-.quick
-
 /* Links on gradient backgrounds */
 .forumbg .header a, .forabg .header a, th a {
-	color: #efefef;
+	color: #afafaf;
 }
 
 .forumbg .header a:hover, .forabg .header a:hover, th a:hover {
@@ -76,7 +66,7 @@ a:hover {
 
 /* Notification mark read link */
 .dropdown-extended a.mark_read {
-	background-color: #FFFFFF;
+	background-color: #222222;
 }
 
 /* Post body links */
@@ -112,10 +102,6 @@ a:hover {
 /* Boxes and Backgrounds
 ---------------------------------------- */
 
-.wrap {
-	background-color: #ffffff;
-}
-
 #header-wide {
 	background-color: #46357c;
 }
@@ -134,23 +120,24 @@ a:hover {
 }
 
 .forabg, .forumbg, .panel, .post, .responsive {
-	border: 1px solid #333333;
+	border: 1px solid #a9b8c2;
 }
 
 .panel {
-	background-color: #ececec;
+	background-color: #333333;
+	color: #afafaf;
 }
 
 .post:target .content {
-	color: #000000;
+	color: #decafe;
 }
 
 .post:target h3 a {
-	color: #5c2e8a;
+	color: #ae6fec;
 }
 
 .bg1 {
-	background-color: #ececec;
+	background-color: #222222;
 }
 
 table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) {
@@ -158,7 +145,7 @@ table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) {
 }
 
 .bg2 {
-	background-color: #e5e8ea;
+	background-color: #3d3d3d;
 }
 
 table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
@@ -166,7 +153,7 @@ table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
 }
 
 .bg3 {
-	background-color: #ececec;
+	background-color: #333333;
 }
 
 .ucprowbg {
@@ -185,18 +172,14 @@ table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
 ----------------------------------------*/
 
 .stats-area {
-	background-color: #efefef;
-	border: 1px solid #333333;
+	background-color: #222222;
+	border: 1px solid #a9b8c2;
 }
 
 .stats-header h3 {
 	background-image: url("./images/cellpic3.gif");
 	border-bottom-color: #a9b8c2;
-	color: #efefef;
-}
-
-.stats-data {
-	background-color: #efefef;
+	color: #afafaf;
 }
 
 .stats-data h3 {
@@ -215,12 +198,12 @@ table.table1 tbody tr {
 }
 
 table.table1 tbody tr:hover, table.table1 tbody tr.hover {
-	background-color: #dee3e5;
+	background-color: #222444;
 	color: #000;
 }
 
 table.table1 td {
-	color: #536482;
+	color: #efefef;
 }
 
 table.table1 tbody td {
@@ -233,7 +216,7 @@ table.table1 tbody td.posts {
 }
 
 table.table1 tbody td.info {
-	border-right: 1px solid #a9b8c2;
+	border-right: 1px solid #933bea;
 }
 
 table.table1 tbody th {
@@ -249,11 +232,11 @@ table.info tbody th {
 ---------------------------------------- */
 
 dl.details dt {
-	color: #000000;
+	color: #afafaf;
 }
 
 dl.details dd {
-	color: #000000;
+	color: #efefef;
 	font-weight: bold;
 }
 
@@ -297,11 +280,11 @@ dl.details dd a {
 }
 
 .icon.icon-black, a:hover .icon.icon-black{
-	color: #333333;
+	color: #efefef;
 }
 
 .alert_close .icon:before {
-	background-color: #FFFFFF;
+	background-color: #222222;
 }
 
 /* Jumpbox */
@@ -309,6 +292,10 @@ dl.details dd a {
 	border-top-color: #CCCCCC;
 }
 
+.jumpbox .dropdown-contents a {
+	background-color: #222222;
+}
+
 .jumpbox-cat-link {
 	background-color: #d2d5d7;
 	border-top-color: #0076B1;
@@ -384,11 +371,11 @@ Colours and backgrounds for content.css
 -------------------------------------------------------------- */
 
 ul.forums {
-	background-color: #ececec;
+	background-color: #222222;
 }
 
 ul.topiclist li {
-	color: #000000;
+	color: #afafaf;
 }
 
 ul.topiclist dd {
@@ -405,11 +392,11 @@ li.row {
 }
 
 li.row strong {
-	color: #000000;
+	color: #afafaf;
 }
 
 li.row:hover {
-	background-color: #dee3e5;
+	background-color: #222444;
 }
 
 li.row:hover dd {
@@ -422,7 +409,7 @@ li.row:hover dd {
 }
 
 li.header dt, li.header dd {
-	color: #efefef;
+	color: #afafaf;
 }
 
 /* Post body styles
@@ -445,11 +432,11 @@ li.header dt, li.header dd {
 ----------------------------------------*/
 
 .content {
-	color: #333333;
+	color: #efefef;
 }
 
 .content h2, .panel h2 {
-	color: #333333;
+	color: #afafaf;
 	border-bottom-color: #a9b8c2;
 }
 
@@ -469,7 +456,7 @@ dl.faq dt {
 /* Post signature */
 .signature {
 	border-top-color: #a9b8c2;
-	color: #333333;
+	color: #efefef;
 	opacity: 0.7;
 }
 
@@ -487,23 +474,23 @@ dl.faq dt {
 
 /* Quote block */
 blockquote {
-	background-color: #dcdcdc;
-	border-color: #d1d7dc;
+	background-color: #555555;
+	border-color: #dbdbce;
 }
 
 blockquote blockquote {
 	/* Nested quotes */
-	background-color: #ededed;
+	background-color: #444444;
 }
 
 blockquote blockquote blockquote {
 	/* Nested quotes */
-	background-color: #fefefe;
+	background-color: #333333;
 }
 
 /* Code block */
 .codebox {
-	background-color: #FFFFFF;
+	background-color: #333444;
 	border-color: #C9D2D8;
 }
 
@@ -512,15 +499,15 @@ blockquote blockquote blockquote {
 }
 
 .codebox code {
-	color: #2E8B57;
+	color: #afefef;
 }
 
 /* Attachments
 ----------------------------------------*/
 
 .attachbox {
-	background-color: #FFFFFF;
-	border-color: #C9D2D8;
+	background-color: #222222;
+	border-color:  #C9D2D8;
 }
 
 .pm-message .attachbox {
@@ -550,7 +537,7 @@ dl.file dd {
 
 dl.thumbnail img {
 	border-color: #666666;
-	background-color: #FFFFFF;
+	background-color: #222222;
 }
 
 dl.thumbnail dd {
@@ -578,7 +565,7 @@ fieldset.polls dl.voted {
 }
 
 fieldset.polls dd div {
-	color: #FFFFFF;
+	color: #222222;
 }
 
 .rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
@@ -649,12 +636,11 @@ fieldset.polls dd div {
 }
 
 .postprofile {
-	color: #666666;
-	border-color: #999999;
+	border-color: #d5dbe0;
 }
 
 .postprofile strong {
-	color: #000000;
+	color: #e3e3e3;
 }
 
 .online {
@@ -672,36 +658,36 @@ Colours and backgrounds for buttons.css
 
 .button {
 	border-color: #C7C3BF;
-	background-color: #E9E9E9; /* Old browsers */ /* FF3.6+ */
-	background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #E9E9E9 100%);
-	background-image: linear-gradient(to bottom, #FFFFFF 0%, #E9E9E9 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#E9E9E9',GradientType=0 ); /* IE6-9 */
-	box-shadow: 0 0 0 1px #FFFFFF inset;
-	-webkit-box-shadow: 0 0 0 1px #FFFFFF inset;
-	color: #663399;
+	background-color: #222222; /* Old browsers */ /* FF3.6+ */
+	background-image: -webkit-linear-gradient(top, #444444 0%, #222222 100%);
+	background-image: linear-gradient(to bottom, #444444 0%, #222222 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#222222',GradientType=0 ); /* IE6-9 */
+	box-shadow: 0 0 0 1px #222222 inset;
+	-webkit-box-shadow: 0 0 0 1px #222222 inset;
+	color: #ae6fec;
 }
 
 .button:hover,
 .button:focus {
-	border-color: #663399;
-	background-color: #FFFFFF; /* Old browsers */ /* FF3.6+ */
-	background-image: -webkit-linear-gradient(top, #E9E9E9 0%, #FFFFFF 100%);
-	background-image: linear-gradient(to bottom, #E9E9E9 0%, #FFFFFF 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E9E9E9', endColorstr='#FFFFFF',GradientType=0 ); /* IE6-9 */
-	text-shadow: 1px 1px 0 #FFFFFF, -1px -1px 0 #FFFFFF, -1px -1px 0 rgba(188, 42, 77, 0.2);
-	color: #ff6633;
+	border-color: #afefef;
+	background-color: #333333; /* Old browsers */ /* FF3.6+ */
+	background-image: -webkit-linear-gradient(top, #222222 0%, #444444 100%);
+	background-image: linear-gradient(to bottom, #222222 0%, #444444 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#444444',GradientType=0 ); /* IE6-9 */
+	text-shadow: 1px 1px 0 #222222, -1px -1px 0 #222222, -1px -1px 0 rgba(188, 42, 77, 0.2);
+	color: #ae6fec;
 }
 
 .button .icon,
 .button-secondary {
-	color: #663399;
+	color: #ae6fec;
 }
 
 .button-secondary:focus,
 .button-secondary:hover,
 .button:focus .icon,
 .button:hover .icon {
-	color: #ff6633;
+	color: #ae6fec;
 }
 
 .button-search:hover,
@@ -735,14 +721,14 @@ Colours and backgrounds for buttons.css
 .pagination li.active span {
 	background: #4692BF;
 	border-color: #4692BF;
-	color: #FFFFFF;
+	color: #222222;
 }
 
 .pagination li a:hover, .pagination li a:hover .icon, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
-	background: #368AD2;
+	background: #222222;
 	border-color: #368AD2;
 	filter: none;
-	color: #FFFFFF;
+	color: #ae6fec;
 	text-shadow: none;
 }
 
@@ -753,6 +739,8 @@ Colours and backgrounds for buttons.css
 .search-box .inputbox:hover,
 .search-box .inputbox:focus {
 	border-color: #C7C3BF;
+	background-color: #333444;
+	color: #afefef;
 }
 
 .search-header {
@@ -853,46 +841,46 @@ ul.cplist {
 }
 
 .panel-container .panel li.header dd, .panel-container .panel li.header dt {
-	color: #000000;
+/*	color: #000000;*/
 }
 
 .panel-container table.table1 thead th {
-	color: #333333;
+	color: #afafaf;
 	border-bottom-color: #333333;
 }
 
 .cp-main .pm-message {
-	border-color: #333444;
-	background-color: #e0e0e0;
+	border-color: #DBDEE2;
+	background-color: #222222;
 }
 
 /* CP tabbed menu
 ----------------------------------------*/
 
 .tabs .tab > a {
-	background: #ececec;
+	background: #333333;
 	border: 1px solid #a9b8c2;
-	color: #663399;
+	color: #ae6fec;
 }
 
 .tabs .tab > a:hover {
-	background: #dee3e5;
+	background: #222222;
 	color: #ff6633;
 }
 
 .tabs .activetab > a,
 .tabs .activetab > a:hover {
-	background-color: #ced7db; /* Old browsers */ /* FF3.6+ */
-	background-image: -webkit-linear-gradient(top, #ececec 0%, #ced7db 100%);
-	background-image: linear-gradient(to bottom, #ececec 0%, #ced7db 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececec', endColorstr='#ced7db',GradientType=0 ); /* IE6-9 */
-	border-color: #663399;
+	background-color: #333333; /* Old browsers */ /* FF3.6+ */
+	background-image: -webkit-linear-gradient(top, #333333 0%, #222222 100%);
+	background-image: linear-gradient(to bottom, #333333 0%, #222222 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#222222',GradientType=0 ); /* IE6-9 */
+	border-color: #a9b8c2;
 	box-shadow: 0 1px 1px #F2F9FF inset;
-	color: #663399;
+	color: #ae6fec;
 }
 
 .tabs .activetab > a:hover {
-	color: #a0a0d0;
+	color: #ff6633;
 }
 
 /* Mini tabbed menu used in MCP
@@ -924,40 +912,40 @@ ul.cplist {
 
 /* Link styles for the sub-section links */
 .navigation a {
-	color: #663399;
-	background: #cbd5db; /* Old browsers */ /* FF3.6+ */
-	background: -webkit-linear-gradient(left, #cbd5db 50%, #ececec 100%);
-	background: linear-gradient(to right, #cbd5db 50%, #ececec 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cbd5db', endColorstr='#ececec',GradientType=1 ); /* IE6-9 */
+	color: #ae6fec;
+	background: #222222; /* Old browsers */ /* FF3.6+ */
+	background: -webkit-linear-gradient(left, #222222 50%, #333333 100%);
+	background: linear-gradient(to right, #222222 50%, #333333 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#333333',GradientType=1 ); /* IE6-9 */
 }
 
 .rtl .navigation a {
-	background: #663399; /* Old browsers */ /* FF3.6+ */
-	background: -webkit-linear-gradient(left, #cbd5db 50%, #ececec 100%);
-	background: linear-gradient(to right, #cbd5db 50%, #ececec 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cbd5db', endColorstr='#ececec',GradientType=1 ); /* IE6-9 */
+	background: #222222; /* Old browsers */ /* FF3.6+ */
+	background: -webkit-linear-gradient(left, #222222 50%, #333333 100%);
+	background: linear-gradient(to right, #222222 50%, #333333 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#333333',GradientType=1 ); /* IE6-9 */
 }
 
 .navigation a:hover {
-	background: #c7d2d8;
+	background: #333333;
 	color: #ff6633;
 	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 }
 
 .navigation .active-subsection a {
-	background: #ffffff;
-	color: #663399;
+	background: #222222;
+	color: #933bea;
 	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 }
 
 .navigation .active-subsection a:hover {
-	color: #a0a0d0;
+	color: #ff6633;
 }
 
 @media only screen and (max-width: 900px), only screen and (max-device-width: 900px)
 {
 	#navigation a, .rtl #navigation a {
-		background: #cbd5db;
+		/*background: #cbd5db;*/
 	}
 }
 
@@ -965,26 +953,26 @@ ul.cplist {
 ----------------------------------------*/
 
 .panel-container h2 {
-	color: #333333;
+	color: #afafaf;
 }
 
 .panel-container .panel {
-	background-color: #F9F9F9;
+	background-color: #333333;
 }
 
 .cp-main .pm {
-	background-color: #e0e0e0;
+	background-color: #222222;
 }
 
 /* Friends list */
 .cp-mini {
-	background-color: #ffffff;
+	background-color: #333333;
 	border: 1px solid #a9b8c2;
 }
 
 dl.mini dt {
 	border-bottom: 1px solid #a9b8c2;
-	color: #425067;
+	color: #afafaf;
 }
 
 /* PM Styles
@@ -1019,7 +1007,7 @@ dl.mini dt {
 
 /* Avatar gallery */
 .gallery label {
-	background: #FFFFFF;
+	background: #222222;
 	border-color: #CCC;
 }
 
@@ -1036,15 +1024,11 @@ Colours and backgrounds for forms.css
 ----------------------------------------*/
 select {
 	border-color: #666666;
-	background-color: #FAFAFA;
-	color: #000;
+	background-color: #222222;
+	color: #efefef;
 }
 
 label {
-	color: #333333;
-}
-
-.display-options label {
 	color: #efefef;
 }
 
@@ -1056,7 +1040,7 @@ option.disabled-option {
 ---------------------------------------- */
 
 dd label {
-	color: #333;
+	color: #afafaf;
 }
 
 fieldset.fields1 {
@@ -1065,7 +1049,7 @@ fieldset.fields1 {
 
 /* Hover effects */
 fieldset dl:hover dt label {
-	color: #000000;
+	color: #afafef;
 }
 
 fieldset.fields2 dl:hover dt label {
@@ -1074,14 +1058,14 @@ fieldset.fields2 dl:hover dt label {
 
 /* Quick-login on index page */
 fieldset.quick-login input.inputbox {
-	background-color: #F2F3F3;
+	background-color: #333444;
 }
 
 /* Posting page styles
 ----------------------------------------*/
 
 .message-box textarea {
-	color: #333333;
+	color: #afefef;
 }
 
 .message-box textarea.drag-n-drop {
@@ -1096,17 +1080,17 @@ fieldset.quick-login input.inputbox {
 ---------------------------------------- */
 
 .inputbox {
-	background-color: #f5f5f5;
-	border-color: #B4BAC0;
-	color: #333333;
+	background-color: #222444;
+	border-color: #11a3ea;
+	color: #afefef;
 }
 
 .inputbox:-moz-placeholder {
-	color: #333333;
+	color: #efefef;
 }
 
 .inputbox::-webkit-input-placeholder {
-	color: #333333;
+	color: #efefef;
 }
 
 .inputbox:hover {
@@ -1129,11 +1113,11 @@ fieldset.quick-login input.inputbox {
 ---------------------------------------- */
 
 a.button1, input.button1, input.button3, a.button2, input.button2 {
-	color: #000;
-	background-color: #EFEFEF; /* Old browsers */ /* FF3.6+ */
-	background-image: -webkit-linear-gradient(top, #D2D2D2 0%, #EFEFEF 100%);
-	background-image: linear-gradient(to bottom, #D2D2D2 0%, #EFEFEF 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2D2D2', endColorstr='#EFEFEF',GradientType=0 ); /* IE6-9 */
+	color: #ae6fec;
+	background-color: #333333; /* Old browsers */ /* FF3.6+ */
+	background-image: -webkit-linear-gradient(top, #222222 0%, #333333 100%);
+	background-image: linear-gradient(to bottom, #222222 0%, #333333 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#333333',GradientType=0 ); /* IE6-9 */
 }
 
 a.button1, input.button1 {
@@ -1156,12 +1140,12 @@ a.button1, a.button2 {
 
 /* Hover states */
 a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
-	border-color: #D31141;
-	color: #D31141;
-	background-color: #D2D2D2; /* Old browsers */ /* FF3.6+ */
-	background-image: -webkit-linear-gradient(top, #EFEFEF 0%, #D2D2D2 100%);
-	background-image: linear-gradient(to bottom, #EFEFEF 0%, #D2D2D2 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EFEFEF', endColorstr='#D2D2D2',GradientType=0 ); /* IE6-9 */
+	border-color: #afefef;
+	color: #ae6fec;
+	background-color: #222222; /* Old browsers */ /* FF3.6+ */
+	background-image: -webkit-linear-gradient(top, #222222 0%, #444444 100%);
+	background-image: linear-gradient(to bottom, #222222 0%, #444444 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#444444',GradientType=0 ); /* IE6-9 */
 }
 
 /* Focus states */
@@ -1178,7 +1162,7 @@ input.disabled {
 ---------------------------------------- */
 
 .phpbb_alert {
-	background-color: #FFFFFF;
+	background-color: #222222;
 	border-color: #999999;
 }
 
@@ -1230,7 +1214,7 @@ input.disabled {
 }
 
 .dropdown .dropdown-contents {
-	background: #000000;
+	background: #222222;
 	border-color: #B9B9B9;
 	box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
 }
@@ -1263,6 +1247,6 @@ li.notification-reported strong, li.notification-disapproved strong {
 }
 
 .badge {
-	background-color: #D31141;
-	color: #ffffff;
+	background-color: #933bea;
+	color: #afefef;
 }