1
00:00:03,560 --> 00:00:08,385
Wir kommen zum endgültigen Auftrag dieses Kurses.

2
00:00:08,385 --> 00:00:10,255
In dieser vierten Aufgabe

3
00:00:10,255 --> 00:00:13,185
werden Sie mit Bootstraps,

4
00:00:13,185 --> 00:00:19,075
jQuery-Unterstützung und auch ein wenig Sass arbeiten.

5
00:00:19,075 --> 00:00:23,910
Diese Zuordnung besteht aus vier Aufgaben.

6
00:00:23,910 --> 00:00:28,370
Ihre erste Aufgabe wäre es, alle diese

7
00:00:28,370 --> 00:00:36,120
Datenattribute sowohl aus dem Login-Link hier als auch aus der Reserve der Tabellen hier zu entfernen.

8
00:00:36,120 --> 00:00:38,910
Nun, in dieser Zuweisung,

9
00:00:38,910 --> 00:00:43,285
werden wir die Modelle mit JavaScript-Code auslösen.

10
00:00:43,285 --> 00:00:44,915
Um dies zu tun,

11
00:00:44,915 --> 00:00:46,990
entfernen wir zuerst die Datenattribute,

12
00:00:46,990 --> 00:00:54,895
sowohl aus dem Reservemodell als auch aus dem Login-Modell als unsere erste Aufgabe in dieser Zuweisung.

13
00:00:54,895 --> 00:00:59,470
Ihre zweite Aufgabe besteht darin,

14
00:00:59,470 --> 00:01:07,050
entsprechenden JavaScript-Code hinzuzufügen, indem Sie die Model-Methoden verwenden,

15
00:01:07,050 --> 00:01:08,985
JavaScript-Methoden, die verfügbar sind,

16
00:01:08,985 --> 00:01:13,300
so dass, wenn auf das Reserve-Tabellenmuster geklickt wird,

17
00:01:13,300 --> 00:01:18,375
dann das entsprechende Reserve-Modell angezeigt wird, wie hier zu sehen.

18
00:01:18,375 --> 00:01:23,250
Wir sehen also, dass dieses Ein- und Ausblenden des Modells

19
00:01:23,250 --> 00:01:28,800
vollständig mit den JavaScript-Methoden dieses Modells ausgelöst wird.

20
00:01:28,800 --> 00:01:33,185
Ihre dritte Aufgabe wäre es, wieder den

21
00:01:33,185 --> 00:01:42,985
entsprechenden Code in das Skript einzufügen, so dass, wenn Sie hier auf den Login-Link klicken,

22
00:01:42,985 --> 00:01:45,805
das Login-Modell angezeigt wird.

23
00:01:45,805 --> 00:01:47,995
Damit dies funktioniert,

24
00:01:47,995 --> 00:01:52,140
müssen Sie die entsprechenden IDs sowohl der Reserve-Tabellenschaltfläche als auch

25
00:01:52,140 --> 00:01:57,850
dem Login-Link angeben, so dass sie dann in Ihrem JavaScript-Code referenziert werden können.

26
00:01:57,850 --> 00:02:00,085
Also, das ist ein Hinweis für Sie,

27
00:02:00,085 --> 00:02:05,590
wie Sie mit der Implementierung fortfahren können.

28
00:02:05,590 --> 00:02:12,955
Die Verwendung der JavaScript-Methoden sollte ziemlich unkompliziert sein.

29
00:02:12,955 --> 00:02:17,669
Der Link zur Bootstrap-Dokumentation, in

30
00:02:17,669 --> 00:02:19,840
der die JavaScript-Methoden beschrieben werden, finden

31
00:02:19,840 --> 00:02:24,120
Sie im Abschnitt „Zusätzliche Ressourcen“ dieser Zuweisung.

32
00:02:24,120 --> 00:02:29,700
Wie Sie vielleicht schon gemerkt haben, dass diese Modelle jetzt viel bunter aussehen.

33
00:02:29,700 --> 00:02:32,435
Also hier ist das Reserve-Tabellenmodell,

34
00:02:32,435 --> 00:02:34,590
und hier ist das Login-Modell.

35
00:02:34,590 --> 00:02:40,620
Also, als Teil der vierten Aufgabe dieser Zuweisung,

36
00:02:40,620 --> 00:02:46,235
werden Sie in einigen SCSS-Code in die Stile starten SCSS-Datei hinzufügen,

37
00:02:46,235 --> 00:02:50,115
so dass die Farben entsprechend eingestellt sind.

38
00:02:50,115 --> 00:02:53,500
Hier sehen Sie also, dass dieser Modellkopf

39
00:02:53,500 --> 00:03:00,940
die dunkle Hintergrundfarbe eingestellt hat und der Text hier in weißer Farbe angezeigt wird.

40
00:03:00,940 --> 00:03:05,700
Und auch diese bestimmte Klasse,

41
00:03:05,700 --> 00:03:11,850
indem Sie eine verschachtelte Klasse hier in Ihrem SCSS-Code verwenden,

42
00:03:11,850 --> 00:03:17,160
können Sie dies auch definieren, um hier eine flache oder weiße Farbe zu verwenden.

43
00:03:17,160 --> 00:03:26,135
Dann verwendet der Modellkörper selbst die blasse Hintergrundfarbe.

44
00:03:26,135 --> 00:03:30,620
Fügen Sie also den entsprechenden SCSS-Code in Ihre

45
00:03:30,620 --> 00:03:36,710
Format-Start-SCSS-Datei ein, damit dies für das Reservemodell von Header und Körper funktioniert,

46
00:03:36,710 --> 00:03:42,005
so dass Sie sehen können, dass die gleiche dunkle Hintergrundfarbe auf die Kopfzeile angewendet

47
00:03:42,005 --> 00:03:48,435
wird und die blasse Hintergrundfarbe auf den Körper Ihres Modells angewendet wird.

48
00:03:48,435 --> 00:03:51,450
Und wenn Sie diese Zuweisung abgeschlossen

49
00:03:51,450 --> 00:03:59,370
haben, möchten Sie möglicherweise einen guten Kommentar machen, um Ihre Änderungen mit der Nachrichtenzuweisung vier zu speichern.