<NME> bootstrap4.less
<BEF> ADDFILE
<MSG> wip a bootstrap v4 theme

<DFF> @@ -0,0 +1,142 @@
+
+@gray-darker:            #292b2c;
+@gray-dark:              #464a4c;
+@gray:                   #636c72;
+@gray-light:             #eceeef;
+@gray-lighter:           #f7f7f9;
+
+@font-size:              1em;
+@font-family:            inherit;
+@text-color:             @gray-dark;
+
+
+@border-radius:             0.25rem;
+@border-radius-sm:          0.2rem;
+
+@widget-bg:                 #fff;
+@widget-border:             rgba(0,0,0,.15);
+
+@btn-bg:                    #fff;
+@btn-color:                 @text-color;
+@btn-border:                #ccc;
+@btn-active-box-shadow:     inset 0 3px 5px rgba(0,0,0,.125);
+
+@icon-color: inherit;
+
+//
+// Widget States
+//
+@state-bg-select:           #337ab7;
+@state-border-select:       @state-bg-select;
+@state-color-select:        white;
+
+@state-bg-hover:            darken(@btn-bg, 10%);
+@state-border-hover:        @state-bg-hover;
+@state-color-hover:         @text-color;
+
+@state-bg-focus:            transparent;
+@state-border-focus:        #66afe9;
+@state-color-focus:         @text-color;
+
+
+
+//
+// Picker inputs
+//
+@input-color:               @gray;
+@input-height:              2.429em; // 2.5em is good for 16px roots
+@input-padding-horizontal:  0.857em;
+@input-box-shadow:          inset 0 1px 1px rgba(0,0,0,.075);
+
+@input-bg:                  @widget-bg;
+@input-bg-disabled:         @gray-lighter;
+@input-color-placeholder:   #999;
+
+@input-border-radius:       @border-radius;
+@input-border:              @widget-border;
+@input-border-width:        1px;
+
+@input-bg-hover:            @gray-lighter;
+@input-border-hover:        @input-border;
+
+@input-border-focus:        @state-border-focus;
+@input-focus-color:         rgba(red(@input-border-focus), green(@input-border-focus), blue(@input-border-focus), .6);
+@input-focus-box-shadow:    0 0 8px @input-focus-color;
+
+
+//
+// List
+//
+@list-font-size:            @font-size;
+
+@list-bg-hover:             @state-bg-hover;
+@list-border-hover:         @state-border-hover;
+@list-color-hover:          @state-color-hover;
+
+@list-bg-focus:             @state-bg-focus;
+@list-border-focus:         @state-border-focus;
+@list-color-focus:          @state-color-focus;
+
+@list-bg-select:            @state-bg-select;
+@list-border-select:        @state-border-select;
+@list-color-select:         @state-color-select;
+
+@list-text-color:           @text-color;
+@list-padding-vertical:     0.143em;
+@list-padding-horizontal:   0.750em;
+
+
+//
+// Popup
+//
+@popup-bg:                  @widget-bg;
+@popup-border:              @widget-border;
+@popup-box-shadow-offset:   6px;
+@popup-box-shadow:          0 (@popup-box-shadow-offset - 1px) @popup-box-shadow-offset rgba(0,0,0,0.2);
+@popup-box-shadow-up:       0 -2px @popup-box-shadow-offset rgba(0,0,0,0.2);
+
+@popup-zindex:              1005;
+@popup-zindex-focused:      @popup-zindex + 1;
+
+
+
+//
+// Calendar
+//
+@calendar-bg:           @widget-bg;
+@calendar-cell-align:   center;
+@calendar-cell-padding: .25em;
+@calendar-cell-border-radius: @input-border-radius;
+
+@calendar-cell-bg-hover:             @state-bg-hover;
+@calendar-cell-border-hover:         @state-border-hover;
+@calendar-cell-color-hover:          @state-color-hover;
+
+@calendar-cell-bg-focus:             @state-bg-focus;
+@calendar-cell-border-focus:         @state-border-focus;
+@calendar-cell-color-focus:          @state-color-focus;
+
+@calendar-cell-bg-select:            @state-bg-select;
+@calendar-cell-border-select:        @state-border-select;
+@calendar-cell-color-select:         @state-color-select;
+
+
+//
+// Multiselect
+//
+@multiselect-gutter-pt:           0.115;
+@multiselect-tag-padding-left:    0.35em;
+@multiselect-tag-padding-right:   0.35em;
+@multiselect-tag-color:           inherit;
+@multiselect-tag-border:          @btn-border;
+@multiselect-tag-bg:              @gray-lighter;
+@multiselect-tag-height-pt:       1 - (@multiselect-gutter-pt * 2);
+@multiselect-tag-gutter-fallback: @input-height * @multiselect-gutter-pt;
+@multiselect-tag-gutter:          ~"calc(@{multiselect-tag-gutter-fallback} - @{input-border-width})";
+@multiselect-tag-height:          @input-height * @multiselect-tag-height-pt;
+@multiselect-tag-border-radius:   @border-radius-sm;
+
+@multiselect-tag-bg-hover:             @state-bg-hover;
+@multiselect-tag-border-hover:         @state-border-hover;
+@multiselect-tag-color-hover:          @state-color-hover;
+

wip a bootstrap v4 theme