1

I'm trying to override the ngxTypeahead bootstrap styles locally in my SCSS file.

http://run.plnkr.co/preview/cjdla5ty8000cfilltbx80wpz/

Here in this plunker if we inspect the style of typeahead result, we can see this

They have it in this format

<div class ="search-results style-3">
    <input></input>
    <section class="list-group results"></section>
</div>

In the list group, they have these properties

.list-group {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
}

I wanted to add bottom: 60px!important; to this class.

I gave the same class directly in my local SCSS file where I'm using this typeahead and added bottom

.list-group {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    bottom:60px !important;
}

But it is not taking my local class. It has only the bootstrap style.

Should I add it in any other way in SCSS?

WebDevBooster
  • 14,674
  • 9
  • 66
  • 70
Ramya S
  • 2,954
  • 5
  • 14
  • 24

0 Answers0