department-of-veterans-affairs/vets-website

View on GitHub
src/applications/search/components/SearchDropdown/SearchDropdownStyles.scss

Summary

Maintainability
Test Coverage
@import "~@department-of-veterans-affairs/formation/sass/shared-variables";

.search-dropdown-component {
  flex-direction: row;

  &.full-width-suggestions {
    position: relative;
  }

  &.shrink-to-column {
    @media (max-width: $medium-screen) {
      flex-direction: column;
    }
  }
}

.search-dropdown-container {
  position: relative;

  &.full-width-suggestions {
    position: static;
    max-width: 80%;
  }
}

.search-dropdown-options {
  position: absolute;
  box-shadow: 0px 7px 10px -4px var(--vads-color-base);

  &.full-width-suggestions {
    top: 58px;
    right: 0;
  }
}

.suggestion {
  line-height: 24px;
  cursor: pointer;

  strong {
    font-weight: 700;
  }
}

.search-dropdown-input-field {
  height: 42px;
}

.search-dropdown-submit-button {
  height: 42px;
}