resources/src/mediawiki.ui/components/utilities.less

   1 // Utilities
   2 //
   3 // Other things which effect the behaviour of components
   4
   5 // Flush left
   6 //
   7 // Used when you want to push an element to the left of its containing element
   8 //
   9 // Markup:
  10 // <div class="mw-ui-vform-field">
  11 //   <label>Username <a href="#" class="mw-ui-flush-left">?</a></label>
  12 //   <input>
  13 // </div>
  14 .mw-ui-flush-left {
  15         float: left;
  16         margin-left: 0;
  17         padding-left: 0;
  18 }
  19
  20 // Flush right
  21 //
  22 // Used when you want to push an element to the right of its containing element
  23 //
  24 // Markup:
  25 // <div class="mw-ui-vform-field">
  26 //   <label>Username <a href="#" class="mw-ui-flush-right">?</a></label>
  27 //   <input>
  28 // </div>
  29 .mw-ui-flush-right {
  30         float: right;
  31         padding-right: 0;
  32         margin-right: 0;
  33 }
  34
  35 // Center block
  36 //
  37 // Centers the element in its containing element
  38 //
  39 // Markup:
  40 // <div>
  41 //   <button class="mw-ui-center-block">click me</button>
  42 // </div>
  43 .mw-ui-center-block {
  44         display: block;
  45         margin-left: auto;
  46         margin-right: auto;
  47 }