resources/src/mediawiki.special/mediawiki.special.search.interwikiwidget.styles.less

   1 /* interwiki search results */
   2 /*==========================*/
   3
   4 @import 'mediawiki.ui/variables.less';
   5 @import 'mediawiki.mixins';
   6
   7 .mw-searchresults-has-iw {
   8
   9         .iw-headline {
  10                 font-weight: bold;
  11         }
  12
  13         .iw-results {
  14                 list-style: none;
  15                 margin: 0;
  16         }
  17
  18         .iw-resultset {
  19                 .box-sizing(border-box);
  20                 padding: 0.5em;
  21                 vertical-align: top;
  22                 width: 100%;
  23                 float: left;
  24                 background-color: @colorGray15;
  25                 margin-bottom: 1em;
  26                 word-break: break-word;
  27         }
  28
  29         .iw-result__title {
  30                 font-size: 108%; /* matching regular search title */
  31         }
  32
  33         .iw-result:after,
  34         .iw-result__content:after { /* clearfix */
  35                 visibility: hidden;
  36                 display: block;
  37                 font-size: 0;
  38                 content: ' ';
  39                 clear: both;
  40                 height: 0;
  41         }
  42
  43         .iw-result__footer {
  44                 float: right;
  45                 font-size: 97%; /* matching main search result font-size */
  46                 margin-top: 0.5em;
  47         }
  48         .iw-result__footer a {
  49                 vertical-align: middle;
  50                 color: @colorGray7;
  51                 font-style: italic;
  52         }
  53
  54         .oo-ui-icon-favicon {
  55                 padding-right: 1em;
  56         }
  57
  58         /* image search result */
  59         .iw-result__mini-gallery {
  60                 position: relative;
  61                 float: left;
  62                 width: 100%;
  63                 height: 200px;
  64                 .box-sizing(border-box);
  65                 padding: 0.25rem;
  66         }
  67
  68         /* second and third images are small */
  69         .iw-result__mini-gallery:nth-child( 2 ),
  70         .iw-result__mini-gallery:nth-child( 3 ) { /* stylelint-disable-line indentation */
  71                 width: 50%;
  72                 height: 100px;
  73         }
  74
  75         .iw-result__mini-gallery__image {
  76                 display: block;
  77                 position: relative;
  78                 width: 100%;
  79                 height: 100%;
  80                 background-size: 100% auto;
  81                 background-size: cover;
  82                 background-repeat: no-repeat;
  83                 background-position: center center;
  84         }
  85
  86         /* image gallery text */
  87         .iw-result__mini-gallery__image > .iw-result__mini-gallery__caption {
  88                 visibility: hidden;
  89                 position: absolute;
  90                 bottom: 0;
  91                 left: 0;
  92                 text-align: center;
  93                 color: #fff;
  94                 font-size: 0.8em;
  95                 padding: 0.5em;
  96                 background-color: rgba( 0, 0, 0, 0.5 );
  97         }
  98
  99         .iw-result__mini-gallery__image:hover > .iw-result__mini-gallery__caption {
 100                 visibility: visible;
 101         }
 102
 103         /* tablet and up */
 104
 105         @media only screen and ( min-width: @deviceWidthTablet ) {
 106
 107                 #mw-interwiki-results {
 108                         width: 30%;
 109                         display: inline-block; /* used to align interwiki sidebar with the top of the main search results */
 110                         margin-left: 8%; /* since inline-block causes whitespace issues, this is 8 instead of 10% */
 111                 }
 112                 .mw-search-createlink,
 113                 .mw-search-nonefound,
 114                 .mw-search-results,
 115                 .mw-search-interwiki-header {
 116                         float: left;
 117                         width: 60%;
 118                         clear: left;
 119                         max-width: 60%;
 120                 }
 121         }
 122 }