"Fossies" - the Fresh Open Source Software Archive

Member "drupal-8.9.10/core/themes/stable/templates/admin/image-style-preview.html.twig" (26 Nov 2020, 2684 Bytes) of package /linux/www/drupal-8.9.10.tar.gz:


As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) HTML source code syntax highlighting (style: standard) with prefixed line numbers. Alternatively you can here view or download the uninterpreted source code file.

    1 {#
    2 /**
    3  * @file
    4  * Theme override to display a preview of an image style.
    5  *
    6  * Available variables:
    7  * - style_id: The ID of the image style.
    8  * - style_name: The name of the image style.
    9  * - cache_bypass: A timestamp token used to avoid browser caching of images.
   10  * - original: An associative array containing:
   11  *   - url: The URL of the original image.
   12  *   - width: The width in pixels of the original image.
   13  *   - height: The height in pixels of the original image.
   14  *   - rendered: The render array for the original image.
   15  * - derivative: An associative array containing:
   16  *   - url: The URL of the derivative image.
   17  *   - width: The width in pixels of the derivative image.
   18  *   - height: The height in pixels of the derivative image.
   19  *   - rendered:  The rendered derivative image.
   20  * - preview: An associative array containing:
   21  *   - original: An associative array containing:
   22  *     - width: The width in pixels of the original image in the preview.
   23  *     - height: The height in pixels of the original image in the preview.
   24  *   - derivative: An associative array containing:
   25  *     - width: The width in pixels of the derivative image in the preview.
   26  *     - height: The height in pixels of the derivative image in the preview.
   27  *
   28  * @see template_preprocess_image_style_preview()
   29  */
   30 #}
   31 <div class="image-style-preview preview clearfix">
   32   {# Preview of the original image. #}
   33   <div class="preview-image-wrapper">
   34       {{ 'original'|t }} (<a href="{{ original.url }}">{{ 'view actual size'|t }}</a>)
   35       <div class="preview-image original-image" style="width: {{ preview.original.width }}px; height: {{ preview.original.height }}px;">
   36         <a href="{{ original.url }}">
   37           {{ original.rendered }}
   38         </a>
   39       <div class="height" style="height: {{ preview.original.height }}px"><span>{{ original.height }}px</span></div>
   40       <div class="width" style="width: {{ preview.original.width }}px"><span>{{ original.width }}px</span></div>
   41     </div>
   42   </div>
   43 
   44   {# Derivative of the image style. #}
   45   <div class="preview-image-wrapper">
   46     {{ style_name }} (<a href="{{ derivative.url }}?{{ cache_bypass }}">{{ 'view actual size'|t }}</a>)
   47     <div class="preview-image modified-image" style="width: {{ preview.derivative.width }}px; height: {{ preview.derivative.height }}px;">
   48       <a href="{{ derivative.url }}?{{ cache_bypass }}">
   49         {{ derivative.rendered }}
   50       </a>
   51       <div class="height" style="height: {{ preview.derivative.height }}px"><span>{{ derivative.height }}px</span></div>
   52       <div class="width" style="width: {{ preview.derivative.width }}px"><span>{{ derivative.width }}px</span></div>
   53     </div>
   54   </div>
   55 </div>