resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.styles.less

   1 /*!
   2  * MediaWiki Widgets – PHP DateInputWidget styles.
   3  *
   4  * @copyright 2011-2015 MediaWiki Widgets Team and others; see AUTHORS.txt
   5  * @license The MIT License (MIT); see LICENSE.txt
   6  */
   7
   8 .oo-ui-box-sizing( @type: border-box ) {
   9         -webkit-box-sizing: @type;
  10         -moz-box-sizing: @type;
  11         box-sizing: @type;
  12 }
  13
  14 .oo-ui-inline-spacing( @spacing, @cancelled-spacing: 0 ) {
  15         margin-right: @spacing;
  16
  17         &:last-child {
  18                 margin-right: @cancelled-spacing;
  19         }
  20 }
  21
  22 .mw-widget-dateInputWidget {
  23         &.oo-ui-textInputWidget {
  24                 display: inline-block;
  25                 position: relative;
  26                 width: 21em;
  27                 margin-top: 0.25em;
  28                 .oo-ui-inline-spacing( 0.5em );
  29                 margin-bottom: 0.25em;
  30                 margin-left: 0;
  31         }
  32
  33         // Note that this block applies to both the PHP widget and the JS widget
  34         &-handle,
  35         &.oo-ui-textInputWidget input {
  36                 background-color: #fff;
  37                 display: inline-block;
  38                 position: relative;
  39                 .oo-ui-box-sizing( border-box );
  40                 width: 100%;
  41                 cursor: pointer;
  42                 padding: 0.5em 1em;
  43                 border: 1px solid #a2a9b1;
  44                 border-radius: 2px;
  45                 outline: 0;
  46                 line-height: 1.275;
  47                 /**
  48                  * Ensures non-infused and infused widget have the same height.
  49                  * Equal to line height + top padding + bottom padding
  50                  */
  51                 height: 2.275em;
  52         }
  53 }