Merge pull request #2131 from MarcAbonce/infobox_style

Make infobox shorter by default and add an expand toggle

1 files changed, 50 insertions, 0 deletions

diff --git a/searx/static/themes/oscar/css/pointhi.css b/searx/static/themes/oscar/css/pointhi.css
index 4e167687c..4cfecb70a 100644
--- a/searx/static/themes/oscar/css/pointhi.css
+++ b/searx/static/themes/oscar/css/pointhi.css
@@ -156,6 +156,9 @@ input[type=checkbox]:not(:checked) + .label_hide_if_checked + .label_hide_if_not
   outline: 0 none;
   position: relative;
 }
+.infobox img {
+  max-height: 250px;
+}
 .infobox .infobox_part {
   margin-bottom: 20px;
   word-wrap: break-word;
@@ -164,6 +167,42 @@ input[type=checkbox]:not(:checked) + .label_hide_if_checked + .label_hide_if_not
 .infobox .infobox_part:last-child {
   margin-bottom: 0;
 }
+.infobox .header_url {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: block;
+}
+.infobox .infobox_toggle {
+  width: 100%;
+  text-align: center;
+  margin-bottom: 0px;
+}
+.infobox .infobox_checkbox ~ .infobox_body {
+  max-height: 300px;
+  overflow: hidden;
+}
+.infobox .infobox_checkbox:checked ~ .infobox_body {
+  max-height: none;
+}
+.infobox .infobox_checkbox ~ .infobox_toggle .infobox_label_down {
+  display: block;
+}
+.infobox .infobox_checkbox ~ .infobox_toggle .infobox_label_up {
+  display: none;
+}
+.infobox .infobox_checkbox:checked ~ .infobox_toggle .infobox_label_up {
+  display: block;
+}
+.infobox .infobox_checkbox:checked ~ .infobox_toggle .infobox_label_down {
+  display: none;
+}
+.infobox .infobox_checkbox ~ .infobox_body img.infobox_part {
+  display: none;
+}
+.infobox .infobox_checkbox:checked ~ .infobox_body img.infobox_part {
+  display: block;
+}
 .search_categories,
 #categories {
   text-transform: capitalize;
@@ -202,6 +241,17 @@ input[type=checkbox]:not(:checked) + .label_hide_if_checked + .label_hide_if_not
   font-weight: bold;
   background-color: #EEE;
 }
+.visually-hidden {
+  position: absolute !important;
+  height: 1px;
+  width: 1px;
+  overflow: hidden;
+  clip: rect(1px 1px 1px 1px);
+  /* IE6, IE7 */
+  clip: rect(1px, 1px, 1px, 1px);
+  white-space: nowrap;
+  /* added line */
+}
 #advanced-search-container {
   display: none;
   text-align: center;