в Dev. Символы материалов. Контурные значки не загружаются, у меня есть два новых файла CSS с определенными гарнитурами шрифтов и классами CSS, один из которых — Material. Иконки, которые работают (предупреждения с обычными вариациями, но работают) и символы материалов, выделенные также с предупреждением, но не работают, предупреждения есть только для разработчиков.
Кто-нибудь знает, что я делаю неправильно?
Предупреждения:
Не удалось декодировать шрифт: ...
Ошибка анализа OTS: недопустимая sfntVersion: 1008821359
Предупреждения разработчиковлокальные заголовки
локальная сеть
на вкладке «Просмотр» — нормальная загрузка шрифтов
Заголовки Dev
в Вкладка «Предварительный просмотр» — пустая белая страница
Сеть разработчиков
Src/assets
styles.scss
Код: Выделить всё
@import 'src/assets/styles/material-icons.scss';
@import 'src/assets/styles/material-symbols-outlined.css';
Код: Выделить всё
@font-face {
font-family: 'Material Symbols Outlined';
font-style: normal;
font-weight: 100 700;
src: url('/assets/icons-package/material-symbols-outlined2.woff2') format('woff2');
}
.material-symbols-outlined {
font-family: 'Material Symbols Outlined';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
Код: Выделить всё
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url('/assets/icons-package/mat-icons.woff2') format('woff2'),
local('MaterialIcons-Regular'),
url('/assets/icons-package/MaterialIcons-Regular.d1b99623aaa86364.woff2') format('woff2'),
url('/assets/icons-package/MaterialIcons-Regular.14b0bb77466d9f38.woff') format('woff'),
url('/assets/icons-package/MaterialIcons-Regular.fa58bcb97f2ed321.ttf') format('truetype');
}
@font-face {
font-family: 'Material Icons Outlined';
font-style: normal;
font-weight: 400;
src: url('/assets/icons-package/mat-icons-outlined.woff2') format('woff2');
}
/* v108 */
@font-face {
font-family: 'Material Icons Round';
font-style: normal;
font-weight: 400;
src: url('/assets/icons-package/mat-icons-round.woff2') format('woff2');
}
/* v109 */
@font-face {
font-family: 'Material Icons Sharp';
font-style: normal;
font-weight: 400;
src: url('/assets/icons-package/mat-icons-sharp.woff2') format('woff2');
}
/* v112 */
@font-face {
font-family: 'Material Icons Two Tone';
font-style: normal;
font-weight: 400;
src: url('/assets/icons-package/mat-icons-two-tone.woff2') format('woff2');
}
body {
--google-font-color-materialiconstwotone:none;
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
.material-icons-outlined {
font-family: 'Material Icons Outlined';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
.material-icons-round {
font-family: 'Material Icons Round';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
.material-icons-sharp {
font-family: 'Material Icons Sharp';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
.material-icons-two-tone {
font-family: 'Material Icons Two Tone';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
Подробнее здесь: https://stackoverflow.com/questions/787 ... dev-server
Мобильная версия