Meteor.js значки отсутствуют после обновления

#javascript #html #css #meteor #icons

#javascript #HTML #css #метеор #Значки

Вопрос:

Я обновил свой метеор, и теперь значки не отображаются — до обновления все работало нормально.

структура папок:

-общедоступный

—шрифты

—планшет

—монитор

и я получаю доступ к значкам планшета со следующим кодом:

     @font-face {
      font-family: "Flaticon";
      src: url("fonts/tablet/Flaticon.eot");
      src: url("fonts/tablet/Flaticon.eot?#iefix") format("embedded-opentype"),
           url("fonts/tablet/Flaticon.woff") format("woff"),
           url("fonts/tablet/Flaticon.ttf") format("truetype"),
           url("fonts/tablet/Flaticon.svg#Flaticon") format("svg");
      font-weight: normal;
      font-style: normal;
    }

@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: "Flaticon";
    src: url("fonts/tablet/Flaticon.svg#Flaticon") format("svg");
  }
}

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {
  font-family: Flaticon;
        font-size: 20px;
font-style: normal;
/*margin-left: 20px;*/
}

.flaticon-clock:before { content: "f100";font-size: 60px; }
.flaticon-clock-circular-outline:before { content: "f101"; }
.flaticon-cooking-stove-with-heat:before { content: "f103"; font-size: 60px; color:white;}
.flaticon-one-finger-click-black-hand-symbol:before { content: "f104"; font-size: 60px;  color:white;}

/*Pfanne blau*/
.flaticon-closed-pan-blue-white:before { content: "f102"; color:blue; font-size: 140px;padding:0px; padding-left:10px; padding-right:10px;border:1px solid #e0e0e0;}
.flaticon-closed-pan-white-blue:before { content: "f102"; color:white; background-color:blue; font-size: 140px;padding:0px; padding-left:10px; padding-right:10px;border:1px solid #e0e0e0;}

/*Topf gelb*/
.flaticon-saucepan-yellow-white:before { content: "f105"; color:yellow; font-size: 120px; padding:10px; border:1px solid #e0e0e0;}
.flaticon-saucepan-white-yellow:before { content: "f105"; color:white; font-size: 120px; padding:10px; background-color:yellow; }

/*Topf grün*/
.flaticon-saucepan-green-white:before { content: "f105"; color:green; font-size: 120px;padding:10px; border:1px solid #e0e0e0;}
.flaticon-saucepan-white-green:before { content: "f105"; color:white; background-color:green; font-size: 120px;padding:10px; border:1px solid #e0e0e0;}


/*.flaticon-saucepan-red:before { content: "f105"; color:red; font-size: 120px;padding:10px; border:1px solid #e0e0e0;}*/
 

Странно то, что этот код отлично работал до обновления, но теперь в моем приложении не отображаются значки и изображения.

Кто-нибудь знает о проблеме? Большое вам спасибо.

Ответ №1:

Возможно, вам потребуется добавить начальную косую черту (‘/’) ко всем вашим путям значков.

src: url("fonts/tablet/Flaticon.eot");

возможно, должно быть:

src: url("/fonts/tablet/Flaticon.eot");