[enh] add dark version of oscar/logicodev

searx/static/themes/oscar/gruntfile.js

@@ -37,20 +37,22 @@ module.exports = function(grunt) {
     less: {
         development: {
             options: {
-                paths: ["less/pointhi", "less/logicodev"]
+                paths: ["less/pointhi", "less/logicodev", "less/logicodev-dark"]
                 //banner: '/*! less/oscar/oscar.css | <%= grunt.template.today("dd-mm-yyyy") %> | https://github.com/asciimoo/searx */\n'
             },
             files: {"css/pointhi.css": "less/pointhi/oscar.less",
-                    "css/logicodev.css": "less/logicodev/oscar.less"}
+                    "css/logicodev.css": "less/logicodev-dark/oscar.less",
+                    "css/logicodev-dark.css": "less/logicodev/oscar.less"}
         },
         production: {
             options: {
-                paths: ["less/pointhi", "less/logicodev"],
+                paths: ["less/pointhi", "less/logicodev", "less/logicodev-dark"],
                 //banner: '/*! less/oscar/oscar.css | <%= grunt.template.today("dd-mm-yyyy") %> | https://github.com/asciimoo/searx */\n',
                 cleancss: true
             },
             files: {"css/pointhi.min.css": "less/pointhi/oscar.less",
-                    "css/logicodev.min.css": "less/logicodev/oscar.less"}
+                    "css/logicodev.min.css": "less/logicodev/oscar.less",
+                    "css/logicodev-dark.min.css": "less/logicodev-dark/oscar.less"}
         },
         /*
 	// built with ./manage.sh styles

searx/static/themes/oscar/less/logicodev-dark/oscar.less

@@ -0,0 +1,236 @@
+@import "../logicodev/variables.less";
+@import "../logicodev/footer.less";
+@import "../logicodev/checkbox.less";
+@import "../logicodev/onoff.less";
+@import "../logicodev/results.less";
+@import "../logicodev/infobox.less";
+@import "../logicodev/search.less";
+@import "../logicodev/advanced.less";
+@import "../logicodev/cursor.less";
+@import "../logicodev/code.less";
+@import "../logicodev/preferences.less";
+
+/*Global*/
+body {
+  background:#1d1f21 none !important;
+  color:#D5D8D7 !important;
+}
+
+a {
+  color:#41a2ce !important;
+  text-decoration: none !important;
+}
+
+a:hover {
+  color:#5F89AC !important;
+}
+
+input, button, textarea, select {
+  border: 1px solid #282a2e !important;
+  background-color: #444 !important;
+  color: #BBB !important;
+}
+
+input:focus, button:focus, textarea:focus, select:focus {
+  border: 1px solid #C5C8C6 !important;
+  box-shadow: initial !important;
+}
+
+div#advanced-search-container  div#categories label{
+  background:none;
+  border: 1px solid #282a2e;
+}
+
+ul.nav li a {
+  border: 0 !important;
+  border-bottom: 1px solid #4d3f43 !important;
+}
+
+#categories *, .modal-wrapper * {
+  background:#1d1f21 none !important;
+  color:#D5D8D7 !important;
+}
+
+#categories *, {
+  border: 1px solid #3d3f43 !important;
+}
+
+#categories *:checked + label {
+  border-bottom: 4px solid #3d9f94 !important;
+}
+
+.result-content {
+  color:#B5B8B7 !important;
+}
+
+.external-link {
+  color:#35B887 !important;
+}
+
+.table-striped tr td, .table-striped tr th {
+  border-color: #4d3f43 !important;
+}
+
+.highlight {
+  background: #333333 !important;
+}
+
+/*nav*/
+.navbar{
+  background:#1d1f21 none;
+  border: none;
+}
+
+.navbar .active, .menu {
+  background: none !important;
+}
+
+.label-default {
+  background: none;
+  color: #BBB;
+}
+
+.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus, .nav-tabs.nav-justified > .active > a{
+  background-color: #282a2e !important;
+
+}
+
+/*Search Page*/
+.result-default:hover, .result-code:hover, .result-torrent:hover, .result-videos:hover, .result-map:hover {
+    background-color: #222426;
+}
+
+/*buttons*/
+.btn {
+  color: #BBB;
+  background-color: #444 ;
+  border: 1px solid #282a2e;
+}
+
+.btn:hover {
+  color:#444 !important;
+  background-color: #BBB !important; 
+}
+
+.btn-primary.active {
+  color: #C5C8C6;
+  background-color: #5F89AC;
+  border-color: #5F89AC;
+}
+
+/*Right Pannels*/
+.panel {
+  border: 1px solid #111;
+  background: none;
+}
+
+.panel-heading {
+  color: #C5C8C6 !important;
+  background: #282a2e !important;
+  border-bottom: none;
+}
+
+.panel-body {
+  color: #C5C8C6 !important;
+  background: #1d1f21 !important;
+  border-color: #111 !important;
+}
+
+p.btn.btn-default{
+  background: none;
+}
+
+.table-striped>tbody>tr:nth-child(odd)>td, .table-striped>tbody>tr:nth-child(odd)>th, .table-striped>thead>tr:nth-child(odd)>th {
+  background:#2d2f32 none !important;
+  color:#D5D8D7 !important;
+}
+
+.label-success {
+  background:#1d6f42 none !important;
+}
+
+.label-danger {
+  background:#ad1f12 none !important;
+}
+
+.searx-navbar {
+    background: #333334;
+    height: 2.3rem;
+    font-size: 1.3rem;
+    line-height: 1.3rem;
+    padding: 0.5rem;
+    font-weight: bold;
+    margin-bottom: 0.8rem;
+
+    a, a:hover {
+        margin-right: 2.0rem;
+        color: white;
+        text-decoration: none;
+    }
+
+    .instance a {
+        color: @light-green;
+        margin-left: 2.0rem;
+    }
+}
+
+#main-logo {
+    margin-top: 20vh;
+    margin-bottom: 25px;
+
+    & > img {
+        max-width: 350px;
+        width: 80%;
+    }
+}
+
+.onoffswitch-inner:before, .onoffswitch-inner:after {
+  background:#1d1f21 none !important;
+}
+
+.onoffswitch-switch,  .onoffswitch-label {
+  border: 2px solid #3d3f43 !important;
+}
+
+.nav>li>a:hover, .nav>li>a:focus {
+  background-color: #3d3f43 !important;
+}
+
+/*Images search*/
+.img-thumbnail, .thumbnail {
+    padding: 0px;
+    line-height: 1.42857143;
+    background: none;
+    border: none;
+}
+
+.modal-content {
+  background:#1d1f21 none !important;
+}
+
+/*Preferences*/
+
+.table > thead > tr > td.danger, .table > tbody > tr > td.danger, .table > tfoot > tr > td.danger, .table > thead > tr > th.danger, .table > tbody > tr > th.danger, .table > tfoot > tr > th.danger, .table > thead > tr.danger > td, .table > tbody > tr.danger > td, .table > tfoot > tr.danger > td, .table > thead > tr.danger > th, .table > tbody > tr.danger > th, .table > tfoot > tr.danger > th {
+  background: RGBA(240, 0, 0, 0.56) !important;
+  color: #C5C8C6 !important;
+}
+
+.table-hover > tbody > tr > td.danger:hover, .table-hover > tbody > tr > th.danger:hover, .table-hover > tbody > tr.danger:hover > td, .table-hover > tbody > tr:hover > .danger, .table-hover > tbody > tr.danger:hover > th {
+  background: RGBA(237, 59, 59, 0.61) !important;
+  color: #C5C8C6 !important;
+}
+
+.table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th {
+  background: rgb(102, 105, 110) !important; 
+}
+
+.btn-success {
+  color: #C5C8C6;
+  background: #449d44;
+}
+
+.btn-danger {
+  color: #C5C8C6;
+  background: #d9534f;
+
+}

searx/templates/oscar/preferences.html

@@ -107,6 +107,7 @@
                         <select class="form-control" name='oscar-style'>
                             <option value="logicodev" >Logicodev</option>
                             <option value="pointhi" {% if cookies['oscar-style'] == 'pointhi' %}selected="selected"{% endif %}>Pointhi</option>
+                            <option value="logicodev-dark" {% if cookies['oscar-style'] == 'logicodev-dark' %}selected="selected"{% endif %}>Logicodev dark</option>
                         </select>
                     {{ preferences_item_footer(_('Choose style for this theme'), _('Style'), rtl) }}