Die Herausforderung, Daten mit Sass-Variablen zu speichern, hat ein Problem.
User Agent ist: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36
.
<style>
$text-color: red;
.header{
text-align: center;
}
.blog-post h2 {
color: $text-color;
}
</style>
<h1 class="header">Learn Sass</h1>
<div class="blog-post">
<h2>Some random title</h2>
<p>This is a paragraph with some random text in it</p>
</div>
<div class="blog-post">
<h2>Header #2</h2>
<p>Here is some more random text.</p>
</div>
<div class="blog-post">
<h2>Here is another header</h2>
<p>Even more random text within a paragraph</p>
</div>
Hallo allerseits, ich glaube, ich habe einen Fehler in der Herausforderung Speichern von Daten mit Sass-Variablen gefunden. Ich glaube, ich habe alles richtig gemacht, aber die Farbe der h2- und .blog-post-Elemente ändert sich nicht in rot. Ich übergebe zwei der User Stories, aber nicht diese:
Ihr .blog-post-Element sollte eine rote Farbe haben.
Ihre H2-Elemente sollten eine rote Farbe haben.
Es ändert sich auch nicht rot. Aber es gibt die User Stories weiter:
Ihr Code sollte eine Sass-Variable haben, die für $ text-color mit dem Wert rot deklariert ist.
Ihr Code sollte die Variable $ text-color verwenden, um die Farbe für die Elemente .blog-post und h2 zu ändern
Vielen Dank im Voraus, und die neuen Dinge in der Beta scheinen erstaunlich, machen Sie weiter so! Ich kann es kaum erwarten, mehr davon durchzuarbeiten! 👍
@ Azbo400 Vielen Dank, dass Sie dieses Problem gemeldet haben. Es sieht so aus, als würden wir das Kompilieren des Sass noch nicht unterstützen 😅
@systimotic Oh haha, das macht Sinn! Danke 😄
Oh, das tut mir leid! Wir hätten den Leuten sagen sollen, dass dieser Abschnitt nicht richtig funktioniert. Vielen Dank für das Problem, @ Azbo400
@HKuz Das ist in Ordnung, kein Problem. 😃
Ja. Es funktioniert nicht. Wird es eine Benachrichtigung geben, wenn dies behoben ist?
Wir unterstützen die "Saas" noch nicht! Lmao !!!
Am 22. Januar 2017, 00:19 Uhr schrieb "Pramod Potdar" [email protected] :
Ja. Es funktioniert nicht. Wird es eine Benachrichtigung geben, wenn dies behoben ist?
- -
Sie erhalten dies, weil Sie diesen Thread abonniert haben.
Antworte direkt auf diese E-Mail und sieh sie dir auf GitHub an
https://github.com/freeCodeCamp/freeCodeCamp/issues/12699#issuecomment-274311826 ,
oder schalten Sie den Thread stumm
https://github.com/notifications/unsubscribe-auth/AVHZeUIbLrZVFpBbIy0z9uTcDlOwHHoDks5rUvULgaJpZM4LqJWk
.
Sie wollen keinen Schwachsinn von dir. Witze
Ich stimme zu, dass es eine gute Idee wäre, die Leute zu warnen, dass Sass noch nicht funktioniert.
In der Zwischenzeit empfehle ich Leuten, die Anleitung der offiziellen Sass-Seite zu befolgen, um einen Sass-Compiler zu installieren, und ihre Anleitung (und / oder die Sass-Tutorials der FCC) auf ihren eigenen Computern zu befolgen. Das Handbuch beginnt hier: http://sass-lang.com/install
Bei der Challenge zum Speichern von Daten mit Sass-Variablen müssen die letzten beiden Tests überarbeitet werden, damit die Verwendung der zugewiesenen Variablen überprüft werden kann
@ahmadabdolsaheb Super - guter Anruf. Haben Sie eine Idee, wie Sie sie umgestalten können?
@ QuincyLarson Ich bin dabei
Das Folgende kann nützlich sein, wenn jemand dieses Problem angehen möchte.
den Ort der zu überarbeitenden Tests:
https://github.com/freeCodeCamp/freeCodeCamp/blob/6d7092928e852755fa0d4d9489b3c8748b466a94/seed/challenges/03-front-end-libraries/sass.json#L25
Das sind vier Tests, die durch die folgenden zwei ersetzt werden sollten.
"tests": [
{
"text": "Your code should have a Sass variable declared for <code>$text-color</code> with a value of red.",
"testString": "assert(code.match(/\\$text-color\\s*?:\\s*?red\\s*?;/g), 'Your code should have a Sass variable declared for <code>$text-color</code> with a value of red.');"
},
{
"text": "Your code should use the <code>$text-color</code> variable to change the <code>color</code> for the <code>.blog-post</code> and <code>h2</code> items.",
"testString": "assert(code.match(/\\.blog-post\\s*?\,\\s*?h2\\s*?{\\s*?color:\\s*?\\$text-color\\s*?;/g), 'Your code should use the <code>$text-color</code> variable to change the <code>color</code> for the <code>.blog-post</code> and <code>h2</code> items.');"
}
]
Bitte testen Sie die Lösung, bevor Sie eine PR erstellen
@ahmadabdolsaheb
Bitte testen Sie die Lösung, bevor Sie eine PR erstellen
Wie soll ich es testen? Wenn ich Änderungen an den Seed-Dateien vornehme, die sich in freecodecamp
repo befinden, wird dies nicht im learn
repo angezeigt, da das Knotenmodul @freecodecamp/curriculum
wird, um die Herausforderungen zu bewältigen.
Selbst wenn ich die Änderungen in curriculum
repo lokal vornehme, wird dies im learn
Repo nicht berücksichtigt.
Ich gehe jetzt durch den Sass-Unterricht.
Ich werde zusätzliche Lektionen veröffentlichen, die kaputt sind.
Die vollständige Liste der Sass-Lektionen mit fehlerhaften Tests:
https://learn.freecodecamp.org/front-end-libraries/sass/store-data-with-sass-variables
https://learn.freecodecamp.org/front-end-libraries/sass/use-for-to-create-a-sass-loop
https://learn.freecodecamp.org/front-end-libraries/sass/use-each-to-map-over-items-in-a-list
https://learn.freecodecamp.org/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while
Hier ist eine visuelle Hilfe:
Ich habe auch bestätigt, dass intermittierende Tests bestanden wurden (durch Spammen von "Run the tests") auf:
https://learn.freecodecamp.org/front-end-libraries/sass/store-data-with-sass-variables
https://learn.freecodecamp.org/front-end-libraries/sass/use-each-to-map-over-items-in-a-list
aber nicht bei den anderen 2 kaputten Sass-Lektionen (diese bestehen immer nicht):
https://learn.freecodecamp.org/front-end-libraries/sass/use-for-to-create-a-sass-loop
https://learn.freecodecamp.org/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while
Ich hatte anfangs mit den gleichen Problemen zu kämpfen, aber bis jetzt muss ich alles bestehen (einschließlich des Beispiels @while - habe die anderen noch nicht ausprobiert) - das Problem scheint ein Leerraum zu sein
Für einige zB musste das Beispiel @while sogar
Versuchen Sie, Leerzeilen zwischen dem Code zu löschen und - falls dies nicht behoben wird - den SASS-Code überhaupt nicht einzurücken.
[Verwenden von FCC mit Safari 11.0.2]
@ MikeForde Dies hat bei mir funktioniert, als ich zu Safari
Ich konnte sie nicht dazu bringen, in Safari oder Chrome 67 zu arbeiten
Entfernen aller Einrückungen und Abstände innerhalb der
Nein, ich bin mehr als nur Leerzeichen. Was mir aufgefallen ist, ist, dass - mit dem Beispiel ausführen " weiter
Hallo zusammen, was auch immer die Probleme sind, sie scheinen behoben zu sein. Die Herausforderung zum ersten Mal bestanden und ich verwende Chrome Version 67.0.3396.87 (Official Build) (64-Bit)
Nein, passiert mir immer noch, wenn ich die Tests versuche. Scheint nur einige Benutzer zu betreffen.
Ist auf dasselbe Problem gestoßen - FireFox 56.0.2.
Räumte alle Leerzeichen aus; Einrückung usw. geprüft.
Die letzten beiden Tests sind immer noch fehlgeschlagen. Der Versuch, die Schaltfläche "Test ausführen" zu "spammen". Bisher kein Glück.
=====
edit: Ich habe es endlich zum Laufen gebracht. Ich kann mich nicht erinnern, ob es an einem kleinen Fehler von meiner Seite lag oder nur geduldig wiederholt auf die Schaltfläche "Tests ausführen" drückte. Nach dieser SASS-Lektion habe ich in mehreren SASS-Lektionen die Methode "Mash the Run Tests" ausgeführt.
Hier Trick für Sass: Verwenden Sie @for , um eine Sass-Schleife zu erstellen:
Es gibt keine zweite Chance, da diese Herausforderung mit Sicherheit einen Fehler enthält.
@for $j from 1 through 5 {
.text-#{$j} { font-size: 10px* $j; }
}
Hello
Hello
Hello
Hello
Hello
Sie können Ihren Div-Tag Ihrem Farbstil hinzufügen. Das funktioniert bei mir.
<div class="blog-post" style="color: red;">
@ mahmoud-coo6 Funktioniert Ihre Methode beim Anwenden eines Stils, bis eine Bedingung erfüllt ist ?
Ich habe hier eine Warnung: Your .text-1 class should have a font-size of 5px.
Ich bin mir ziemlich sicher, dass die Schriftgröße 5px beträgt.
Ich behebe das Anwenden eines Stils, bis eine Bedingung mit @while erfüllt ist. Herausforderung mit Firefox anstelle von Google-Chrome, es hat für mich funktioniert.
Ich hatte den Div-Tags Hintergrundstil hinzugefügt ..... um diese fehlerhaften Sass-Herausforderungen dazu zu bringen, ihren Test zu bestehen .... !!
<div class="blue-bg" style="background-color: blue"></div>
<div class="black-bg" style="background-color: black"></div>
<div class="red-bg" style="background-color: red"></div>
Hier die Lösung @flyfishingbarbara : Es hat einige Zeit nicht funktioniert, weil es einen Fehler in der Website gibt
@each $color in blue,black, red {
.#{$color}-bg { background-color: $color;}
}
div {
height: 200px;
width: 200px;
}
Das Problem ist mit @for
und @each
.
Es würde nicht unter Chrome 68.0.3440.106 und nicht unter Opera 55.0 funktionieren, aber es funktionierte einwandfrei unter Firefox 59.0.2 (alle 64-Bit). Die letzten drei Übungen erforderten allerdings ein wenig "Run the Test" -Schaltflächen-Spaming
@raisedadead @ValeraS
Schließt dies dieses Problem?
https://github.com/freeCodeCamp/freeCodeCamp/pull/27716
@paulywill Dies hängt nicht mit diesem Problem zusammen, und das Problem wurde bereits in der Hauptniederlassung behoben.
lol, ich habe das gleiche Problem getroffen ...
@ZTYZZ Tritt das gleiche Problem auf der Beta-Site auf ?
Unter Firefox Developer Edition (72.0b2 (64-Bit)) funktioniert dies nicht.
@nmichalakis Welche Fehler sehen Sie in der Browserkonsole?
@ RandellDawson Ich habe den "Bug" gefunden, wenn zwischen dem Variablennamen und dem ":" ein Leerzeichen steht, das nicht korrekt kompiliert wird. Passiert das auch bei einfachen .scss-Dateien?
Also zum Beispiel wenn ich renne
$ var-name: color; (ein Leerzeichen vor und nach ":") es wird nicht kompiliert, aber wenn ich das gleiche ausführe
$ var-name: color (kein Leerzeichen direkt nach der $ var-Deklaration, es funktioniert!)
Bitte öffnen Sie eine neue Ausgabe mit diesen Details. Vielen Dank.
@each $ Farbe in blau, schwarz, rot {
. # {$ color} -bg {Hintergrundfarbe: $ color;}
}}
Hilfreichster Kommentar
Sie können Ihren Div-Tag Ihrem Farbstil hinzufügen. Das funktioniert bei mir.