+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Anpassungen (https://www.mybb.de/forum/forum-47.html)
+--- Forum: Theme-Diskussionen (https://www.mybb.de/forum/forum-84.html)
+--- Thema: Font Awesome 5 Ladezeit (/thread-37255.html)
Seiten: Seiten:
1
2
RE: Font Awesome 5 Ladezeit - Blockadefan - 25.04.2021
Danke, Sven. Das war aber nicht die Info die ich gesucht habe, da die dort beschriebene Methode funktioniert. Probleme machen Icons, die so definiert werden:
Code:
.thread_status {
display: inline-block;
width: 16px;
height: 16px;
background-repeat: no-repeat;
}
.thread_status.dot_folder {
position:relative;
}
.thread_status.dot_folder:before {
color: #fff;
position: absolute;
background-position: 0 0;
content: "\f114";
text-shadow: #000 0px 1px 1px;
font-family: FontAwesome;
font-weight: 900;
font-size: 16px;
}RE: Font Awesome 5 Ladezeit - SvePu - 26.04.2021
Ok, hast du das auch genau so eingetragen:
Code:
font-family: 'Font Awesome 5 Free';RE: Font Awesome 5 Ladezeit - Blockadefan - 26.04.2021
Habe ich gerade probiert, leider ohne Erfolg.
RE: Font Awesome 5 Ladezeit - SvePu - 26.04.2021
Versuche es bitte mal hiermit:
Code:
.thread_status.dot_folder:before {
color: #fff;
position: absolute;
background-position: 0 0;
content: "\f07b";
text-shadow: #000 0px 1px 1px;
font-family: 'Font Awesome 5 Free';
font-size: 16px;
}Denn so wie es ausschaut haben sich die IDs einiger Icons geändert.
RE: Font Awesome 5 Ladezeit - Blockadefan - 26.04.2021
Hallo Sven,
viele Dank, das war tatsächlich das Problem!
Was aber auch noch eine Rolle spielt, ist das font-weight. Der Code, der nun bei mir funktioniert sieht also so aus:
Code:
.thread_status.dot_folder:before {
color: #3f9889;
position: absolute;
background-position: 0 0;
content: "\f07b";
text-shadow: #000 0px 1px 1px;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 16px;
}Wenn ich aus der 900 eine 400 mache, habe ich statt eines ausgefüllten Icons ein holes. Jetzt muss ich nur noch hier die neuen Unicode-Zeichen raussuchen: https://fontawesome.com/icons?d=gallery&p=2&m=free , und alles ist schick.
Eine Frage zum Verständnis habe ich noch: Warum steht die font-family jetzt in ' '? In der alten css steht: font-family: 'FontAwesome'; , in der neuen: font-family: 'Font Awesome 5 Free';. Liegt das an den Freizeichen und mit der alten css hätte es auch mit ' ' funktioniert?
RE: Font Awesome 5 Ladezeit - SvePu - 26.04.2021
Schön, dass es geklappt hat.
Das mit den Anführungszeichen liegt höchstwahrscheinlich an den Leerzeichen im Namen der font-family.
RE: Font Awesome 5 Ladezeit - [ExiTuS] - 27.04.2021
Der Name der Sdhriftfamilie (font-family="...") ist abhängig davon, unter welchem definierten Namen diese Schrift eingebunden wird. Diese muss genauso gewählt werden.
Übrigens mein Tipp: Lade die FA-Schriften auf deinen eigenen Webspace, um unabhängig von fremden Ressourcen zu bleiben. Dann steht es dir sogar frei, deinen eigenen definierten Namen für diese Schrift zu wählen, z.B.: font-family="FA5Free", wenn du die Font unter diesem Namen einbindest.
[ExiTuS]
RE: Font Awesome 5 Ladezeit - Blockadefan - 27.04.2021
Danke, das habe ich auch getan. Ich habe das Paket, das ich bei fontawesome.com heruntergeladen habe, auf den Webserver kopiert und im "header_include" Template den Pfad zur css-Datei meines Servers eingetragen. Die Zeile mit dem Link zur css, die im Netz liegt, habe ich gelöscht.
Vier Probleme waren es, die dafür sorgten, dass ich nicht weiter kam:
- ich habe in dem Zug von FA 4 auf FA 5 gewechselt, also zwei Dinge auf einmal geändert
- der Unicode zu dem Icon, an dem ich das Ganze gestestet habe, war in der neuen css nicht mehr definiert
- im Template, in dem die Icons per Unicode definiert werden, stand FontAwesome ohne ' ', daher hatte ich die neue Familie auch ohne Hochkomma angegeben
- ich habe ziemlich wenig Ahnung von der Materie, daher bin ich aus der Sache nicht schlau geworden
Aber nun funktioniert es und ich habe wieder was gelernt.