typeahead.js-bootstrap3.less icon indicating copy to clipboard operation
typeahead.js-bootstrap3.less copied to clipboard

Make a version for Sass

Open dimroc opened this issue 9 years ago • 7 comments

Please :+1:

dimroc avatar Oct 31 '14 16:10 dimroc

:+1:

mejackreed avatar Apr 08 '15 01:04 mejackreed

Here's what I used: https://gist.github.com/pbeshai/e1317e59d50333bb8812

pbeshai avatar Apr 21 '15 19:04 pbeshai

@pbeshai Hi, Your code is not complete, it doesn't have all the mixins and variables you use in the typehead Sass code. Can you make it complete?

mattiLeBlanc avatar Nov 15 '15 04:11 mattiLeBlanc

This one is better, you do have to make some amendments: http://jitu-blog.blogspot.com.au/2014/02/twitter-bootstrap-3-typeahead-scss.html

mattiLeBlanc avatar Nov 15 '15 04:11 mattiLeBlanc

+1

@mattiLeBlanc ...and those ammendments are?

namtab00 avatar Feb 04 '16 18:02 namtab00

@mattiLeBlanc The mixins are straight from bootstrap's SASS code. Here's an excerpt:

@mixin input-size($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
  #{$parent} {
    height: $input-height;
    padding: $padding-vertical $padding-horizontal;
    font-size: $font-size;
    line-height: $line-height;
    border-radius: $border-radius;
  }

  select#{$parent} {
    height: $input-height;
    line-height: $input-height;
  }

  textarea#{$parent},
  select[multiple]#{$parent} {
    height: auto;
  }
}


@mixin box-shadow($shadow...) {
  -webkit-box-shadow: $shadow; // iOS <4.3 & Android <4.1
          box-shadow: $shadow;
}

@mixin border-top-radius($radius) {
  border-top-right-radius: $radius;
   border-top-left-radius: $radius;
}
@mixin border-right-radius($radius) {
  border-bottom-right-radius: $radius;
     border-top-right-radius: $radius;
}
@mixin border-bottom-radius($radius) {
  border-bottom-right-radius: $radius;
   border-bottom-left-radius: $radius;
}
@mixin border-left-radius($radius) {
  border-bottom-left-radius: $radius;
     border-top-left-radius: $radius;
}

pbeshai avatar Feb 04 '16 19:02 pbeshai

@namtab00 amendments are changing the colour and maybe adding or removing some styles to tailer it to your needs. Honestly I don't even remember for which project I used this :(

mattiLeBlanc avatar Feb 04 '16 22:02 mattiLeBlanc