3d1c905c91
Cleans up AIO's Sass files by: * Switching them all over to the `@use`-based API from Angular Material. * Removing the import of the Material theming API in a bunch of places that weren't using it. * Migrating the new usages of Sass utility functions to the new syntax (e.g. `map.get` vs `map-get`). * Fixing a few files that were using 4 spaces for indentation instead of 2. PR Close #42442
54 lines
1.5 KiB
SCSS
54 lines
1.5 KiB
SCSS
@use 'sass:map';
|
|
@use '../../constants';
|
|
@use '../../mixins';
|
|
|
|
@mixin theme($theme) {
|
|
$is-dark-theme: map.get($theme, is-dark);
|
|
|
|
aio-api-list {
|
|
.api-filter {
|
|
.form-search {
|
|
input {
|
|
box-shadow: 0 2px 2px rgba(constants.$black, 0.24), 0 0 2px rgba(constants.$black, 0.12);
|
|
border: 1px solid if($is-dark-theme, constants.$darkgray, constants.$white);
|
|
background-color: if($is-dark-theme, constants.$darkgray, constants.$white);
|
|
color: if($is-dark-theme, constants.$white, constants.$darkgray);
|
|
|
|
@include mixins.placeholder {
|
|
color: if($is-dark-theme, constants.$offwhite, constants.$mediumgray);
|
|
}
|
|
|
|
&:focus {
|
|
border: 1px solid constants.$blue-400;
|
|
box-shadow: 0 2px 2px rgba(constants.$blue-400, 0.24), 0 0 2px rgba(constants.$blue-400, 0.12);
|
|
}
|
|
}
|
|
|
|
.material-icons {
|
|
color: if($is-dark-theme, constants.$lightblue, constants.$blue-grey-600);
|
|
}
|
|
}
|
|
}
|
|
|
|
.api-list-container {
|
|
|
|
a {
|
|
color: if($is-dark-theme, constants.$warmblue, constants.$blue);
|
|
}
|
|
|
|
.api-list {
|
|
li {
|
|
a {
|
|
color: if($is-dark-theme, constants.$coldblue, constants.$blue-grey-600);
|
|
|
|
&:hover {
|
|
background: if($is-dark-theme, constants.$darkgray, constants.$blue-grey-50);
|
|
color: if($is-dark-theme, constants.$offwhite, constants.$blue-500);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|