react-redux-express/src/widgets/input/style/search-input.less

React fullstack generator with express,redux, and some components.

@import "../../style/themes/default.less";
@import "../../style/mixins/index.less";
@import "../../button/style/mixin.less";
@import "./mixin.less";

.shield-search-input-wrapper {
  display: inline-block;
  vertical-align: middle;
}

.shield-search-input {
  &.shield-input-group .shield-input:first-child,
  &.shield-input-group .shield-select:first-child {
    border-radius: @border-radius-base;
    position: absolute;
    top: -1px;
    width: 100%;
  }

  .shield-search-btn {
    .btn-default;
    border-radius: 0 @border-radius-base - 1 @border-radius-base - 1 0;
    left: -1px;
    position: relative;
    border-width: 0 0 0 1px;
    z-index: 2;
    padding-left: 8px;
    padding-right: 8px;
    &:hover {
      border-color: @border-color-base;
    }
    form & {
      padding-top: 6px;
      padding-bottom: 6px;
    }
  }
  &&-focus .shield-search-btn-noempty,
  &:hover .shield-search-btn-noempty {
    .btn-primary;
  }
}