94 lines
2.3 KiB
SCSS
94 lines
2.3 KiB
SCSS
@import "extends";
|
|
|
|
//
|
|
// Format suggestions on three lines, in dense mode
|
|
//
|
|
// From angular-material/src/components/list/list.scss
|
|
//
|
|
|
|
$dense-baseline-grid: $baseline-grid / 2 !default;
|
|
|
|
$list-h3-margin: 0 0 0 0 !default;
|
|
$list-h4-margin: 3px 0 1px 0 !default;
|
|
$list-h4-font-weight: 400 !default;
|
|
$list-header-line-height: 1.2em !default;
|
|
$list-p-margin: 0 0 0 0 !default;
|
|
$list-p-line-height: 1.6em !default;
|
|
|
|
$list-item-dense-three-line-height: 19 * $dense-baseline-grid !default;
|
|
$list-item-dense-header-font-size: round($subhead-font-size-base * .8) !default;
|
|
$list-item-dense-font-size: round($body-font-size-base * .85) !default;
|
|
$list-item-dense-line-height: 1.05 !default;
|
|
|
|
.md-autocomplete-suggestions.md-3-line {
|
|
li {
|
|
@include ie11-min-height-flexbug($list-item-dense-three-line-height);
|
|
height: $list-item-dense-three-line-height;
|
|
line-height: $list-item-dense-line-height;
|
|
min-height: $list-item-dense-three-line-height;
|
|
}
|
|
}
|
|
|
|
.md-autocomplete-suggestions.md-2-line,
|
|
.md-autocomplete-suggestions.md-3-line {
|
|
li {
|
|
display: flex;
|
|
flex: 1 1 auto;
|
|
align-items: center;
|
|
|
|
.md-list-item-text {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
h3,
|
|
h4,
|
|
p {
|
|
line-height: $list-item-dense-line-height;
|
|
font-size: $list-item-dense-font-size;
|
|
}
|
|
|
|
h3 {
|
|
font-size: $list-item-dense-header-font-size;
|
|
}
|
|
|
|
h3 {
|
|
font-weight: 400;
|
|
letter-spacing: .010em;
|
|
line-height: $list-header-line-height;
|
|
margin: $list-h3-margin;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
h4 {
|
|
font-weight: $list-h4-font-weight;
|
|
letter-spacing: .010em;
|
|
line-height: $list-header-line-height;
|
|
margin: $list-h4-margin;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
p {
|
|
font-weight: 500;
|
|
letter-spacing: .010em;
|
|
line-height: $list-p-line-height;
|
|
margin: $list-p-margin;
|
|
}
|
|
}
|
|
}
|
|
|
|
md-autocomplete .ng-invalid:not(.ng-empty) {
|
|
text-decoration: underline;
|
|
color: $colorRedA700 !important;
|
|
}
|
|
|
|
@media (max-width: $layout-breakpoint-xs) {
|
|
// Enlarge the autocompletion menu on small devices to fit the entire screen
|
|
.md-autocomplete-suggestions-container {
|
|
right: $baseline-grid*2;
|
|
}
|
|
}
|