mirror of
				https://github.com/searxng/searxng.git
				synced 2025-10-31 02:27:06 -04:00 
			
		
		
		
	Merge pull request #812 from kvch/revert-image-modal
Revert CSS image modal
This commit is contained in:
		
						commit
						e8cdaf1170
					
				| @ -4,13 +4,9 @@ $(document).ready(function() { | ||||
|         if ($(document).height() - win.height() == win.scrollTop()) { | ||||
|             var formData = $('#pagination form:last').serialize(); | ||||
|             if (formData) { | ||||
|                 var pageno = $('#pagination input[name=pageno]:last').attr('value'); | ||||
|                 $('#pagination').html('<div class="loading-spinner"></div>'); | ||||
|                 $.post('./', formData, function (data) { | ||||
|                     var lastImageHref = $('.result-images:last a').attr('href'); | ||||
|                     var body = $(data); | ||||
|                     $('a[href^="#open-modal"]:last').attr('href', '#open-modal-1-' + pageno); | ||||
|                     body.find('.modal-image a:first').attr('href', lastImageHref); | ||||
|                     $('#pagination').remove(); | ||||
|                     $('#main_results').append('<hr/>'); | ||||
|                     $('#main_results').append(body.find('.result')); | ||||
|  | ||||
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							| @ -1,77 +0,0 @@ | ||||
| .modal-image { | ||||
|     position: fixed; | ||||
|     top: 0; | ||||
|     right: 0; | ||||
|     bottom: 0; | ||||
|     left: 0; | ||||
|     background: rgba(0,0,0,0.8); | ||||
|     z-index: 1000000001; | ||||
|     opacity:0 !important; | ||||
|     pointer-events: none; | ||||
| 
 | ||||
|     button { | ||||
|         display: none; | ||||
|     } | ||||
| 
 | ||||
|     &:target { | ||||
|         opacity: 1 !important; | ||||
|         pointer-events: auto; | ||||
|     } | ||||
| 
 | ||||
|     & > div { | ||||
|         margin: 2% auto; | ||||
|         width: 97%; | ||||
|         background: @dim-gray; | ||||
|         border: @gray 0.1rem solid; | ||||
|     } | ||||
| 
 | ||||
|     @media (min-width: 769px) { | ||||
|         & > div { | ||||
|             max-width: 60.0rem; | ||||
|         } | ||||
|     } | ||||
| 
 | ||||
|     .image-paging-left { | ||||
|         margin-right: 1.0rem; | ||||
|         margin-top: 0.5rem; | ||||
|         width:15px; | ||||
|         height:15px; | ||||
|         background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAABmJLR0QA/wD/AP+gvaeTAAAACXBI | ||||
| WXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AweDQoOuikqUQAAAB1pVFh0Q29tbWVudAAAAAAAQ3Jl | ||||
| YXRlZCB3aXRoIEdJTVBkLmUHAAAAiElEQVQoz6XTrQ0CQRCG4SesQHI5g6EAqIEewNLSVUACzfAT | ||||
| BApDDSgSBAaJORKyauf2czOZdybzl5SpxR5j3H/OUQHYoMMMNwE1fcUT5hFwUgPuenAxBDxHwRZb | ||||
| HKMgbPDCuiQ4ZfYDU6xwxTNafXDP1dOu3nP1heUJDnmCVAB/cMES7/+v+gIq0Bs3k6NL9AAAAABJ | ||||
| RU5ErkJggg==) 96% no-repeat; | ||||
|     } | ||||
| 
 | ||||
|     .image-paging-right { | ||||
|         margin-left: 1.2rem; | ||||
|         margin-top: 0.5rem; | ||||
|         width:15px; | ||||
|         height:15px; | ||||
|         background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAABmJLR0QA/wD/AP+gvaeTAAAACXBI | ||||
|         WXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AweDQon+JuyPQAAAB1pVFh0Q29tbWVudAAAAAAAQ3Jl | ||||
|         YXRlZCB3aXRoIEdJTVBkLmUHAAAAaklEQVQoz73TsQ2DUAxF0SMWAFEzwGcaWhgpEyAlbQYJMACj | ||||
|         sAINTaiIf8Tt3FzL9jPfDHijdoHiVK9o8EAlQMKM1z8EZUTQHoJnjmDJFUwYr17hTIcN/W2dwzOH | ||||
|         tx2+czhhCZ9oNH/6qh1F2RaYgWxrQwAAAABJRU5ErkJggg==); | ||||
| 
 | ||||
|     } | ||||
| 
 | ||||
|     .image-container::before { | ||||
|         display: block; | ||||
|         min-width: 1.0rem; | ||||
|         max-width: 60.0rem; | ||||
|         min-height: 10.0rem; | ||||
|         height: 30.0rem; | ||||
|         content: ""; | ||||
|     } | ||||
| } | ||||
| 
 | ||||
| .modal-close { | ||||
|     position:fixed; | ||||
|     top: 0; | ||||
|     left: 0; | ||||
|     height: 100% !important; | ||||
|     width: 100% !important; | ||||
|     z-index: -1; | ||||
| } | ||||
| @ -19,5 +19,3 @@ | ||||
| @import "cursor.less"; | ||||
| 
 | ||||
| @import "code.less"; | ||||
| 
 | ||||
| @import "modal-pic.less"; | ||||
|  | ||||
| @ -17,7 +17,3 @@ | ||||
| @import "code.less"; | ||||
| 
 | ||||
| @import "navbar.less"; | ||||
| 
 | ||||
| @import "../logicodev/variables.less"; | ||||
| 
 | ||||
| @import "../logicodev/modal-pic.less"; | ||||
|  | ||||
| @ -1,54 +1,39 @@ | ||||
| <a href="#open-modal-{{ index }}-{{ pageno }}"> | ||||
|     <img src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}" class="img-thumbnail" id="img-result-thumb-{{ index }}" /> | ||||
| {% from 'oscar/macros.html' import draw_favicon %} | ||||
| 
 | ||||
| <a href="{{ result.img_src }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} data-toggle="modal" data-target="#modal-{{ index }}-{{pageno}}"> | ||||
|     <img src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" alt="{{ result.title|striptags }}" title="{{ result.title|striptags }}" class="img-thumbnail"> | ||||
| </a> | ||||
| 
 | ||||
| <style type="text/css" media="screen"> | ||||
| #open-modal-{{ index }}-{{ pageno }}:target .image-container::before { | ||||
|     background: url({{ image_proxify(result.img_src)|safe }}) no-repeat center/contain; | ||||
| } | ||||
| </style> | ||||
| 
 | ||||
| <div id="open-modal-{{ index }}-{{ pageno }}" class="modal-image"> | ||||
|     <div class="container modal-dialog"> | ||||
|         <div class="row"> | ||||
|             <div class="col-md-12 col-sm-12 col-xs-12 modal-header"> | ||||
|                 <a {% if index != 1 %}href="#open-modal-{{ index-1 }}-{{ pageno }}"{% endif %}> | ||||
|                     <span class="pull-left image-paging-left"></span> | ||||
|                  </a> | ||||
|                 <a href="#open-modal-{{ index+1 }}-{{ pageno }}"> | ||||
|                     <span class="pull-right image-paging-right"></span> | ||||
|                 </a> | ||||
|                 <h4 class="modal-title image-title">{{ result.title|striptags }}</h4> | ||||
| <div class="modal fade" id="modal-{{ index }}-{{ pageno }}" tabindex="-1" role="dialog" aria-hidden="true"> | ||||
|     <div class="modal-dialog"> | ||||
|         <div class="modal-wrapper"> | ||||
|             <div class="modal-header"> | ||||
|                 <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> | ||||
|                 <h4 class="modal-title">{% if result.engine~".png" in favicons %}{{ draw_favicon(result.engine) }} {% endif %}{{ result.title|striptags }}</h4> | ||||
|             </div> | ||||
|         </div> | ||||
|         <div class="row"> | ||||
|             <div class="col-md-12 col-sm-12 col-xs-12 modal-body"> | ||||
|                 <a href="{{ result.img_src }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %}><div class="image-container"></div></a> | ||||
|             </div> | ||||
|         </div> | ||||
|         {% if result.content %} | ||||
|         <div class="row"> | ||||
|             <div class="col-md-12 hidden-sm hidden-xs modal-body"> | ||||
|                 <p class="result-content">{{ result.content|safe }}</p> | ||||
|             <div class="modal-body"> | ||||
|                 <img class="img-responsive center-block" src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" alt="{{ result.title|striptags }}"> | ||||
|                 {% if result.author %}<span class="photo-author">{{ result.author }}</span><br />{% endif %} | ||||
|             </div> | ||||
|         </div> | ||||
|                 {% if result.content %} | ||||
|                     <p class="result-content"> | ||||
|                         {{ result.content }} | ||||
|                     </p> | ||||
|                 {% endif %} | ||||
|             </div> | ||||
|             <div class="modal-footer"> | ||||
|             <div class="row"> | ||||
|                 <div class="col-md-10 col-xs-12"> | ||||
|                     <p class="text-muted pull-left">{{ result.pretty_url }}</p> | ||||
|                 </div> | ||||
|                 <div class="col-md-2 hidden-sm hidden-xs"> | ||||
|                 <div class="clearfix"></div> | ||||
|                 <span class="label label-default pull-right">{{ result.engine }}</span> | ||||
|                 </div> | ||||
|             </div> | ||||
|                 <p class="text-muted pull-left">{{ result.pretty_url }}</p> | ||||
|                 <div class="clearfix"></div> | ||||
| 				<div class="row"> | ||||
|                 <a href="{{ result.url }}" class="btn btn-default"> | ||||
|                     {{ _('View source') }} | ||||
|                 </a> | ||||
|                     <div class="col-md-6"> | ||||
|                         <a href="{{ result.img_src }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} class="btn btn-default">{{ _('Get image') }}</a> | ||||
|                     </div> | ||||
|                     <div class="col-md-6"> | ||||
|                         <a href="{{ result.url }}" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} class="btn btn-default">{{ _('View source') }}</a> | ||||
|                     </div> | ||||
|                 </div> | ||||
|             </div> | ||||
|         </div> | ||||
|     </div> | ||||
|     <a href="#img-result-thumb-{{ index }}-{{ pageno }}" class="modal-close"></a> | ||||
| </div> | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user