1 00:00:00,330 --> 00:00:05,490 In this video, we'll see the styling part in the CSIS hairstyle of the company. 2 00:00:05,980 --> 00:00:07,410 It's about the state of the art CSF. 3 00:00:08,430 --> 00:00:09,700 Then I'll be starting, though. 4 00:00:10,500 --> 00:00:16,290 So basically, this veto will only deal with the styling part if you want to just copy and paste, since 5 00:00:16,290 --> 00:00:17,450 styling is not that important. 6 00:00:18,520 --> 00:00:24,000 And the main thing is reacting react like learning reaction concepts like state management, how to 7 00:00:24,000 --> 00:00:28,860 pass props using or use effect and use that looks every day. 8 00:00:29,220 --> 00:00:31,260 These things come using the map filter. 9 00:00:31,260 --> 00:00:33,780 Reduce functions been coming to business logic. 10 00:00:34,050 --> 00:00:37,560 These are the important things when you are want to become a reactor developer or want to learn. 11 00:00:37,870 --> 00:00:42,210 Lipman says this is also important, but that is not as much as important as we are. 12 00:00:42,480 --> 00:00:48,030 So if you want to just follow the code along with me, you can George W. I don't. 13 00:00:48,030 --> 00:00:53,760 You can skip to the last two end of the video and you can use the resources that are provided in the 14 00:00:53,760 --> 00:00:54,480 resource section. 15 00:00:55,710 --> 00:00:58,200 So I'll be using the footer. 16 00:01:00,200 --> 00:01:01,700 The position will be up to a new. 17 00:01:05,190 --> 00:01:05,880 Absolute. 18 00:01:08,320 --> 00:01:11,250 Next, a line will be sent. 19 00:01:12,730 --> 00:01:14,110 Bottom will be zero. 20 00:01:16,220 --> 00:01:16,850 And then we're. 21 00:01:18,610 --> 00:01:19,900 This will be 100 percent. 22 00:01:22,060 --> 00:01:22,720 It will be. 23 00:01:25,450 --> 00:01:26,720 Two point five audience. 24 00:01:30,050 --> 00:01:32,330 After 4.0 paragraph instead of. 25 00:01:34,170 --> 00:01:39,940 Paragraph typically adds the color of Ash, that CCC. 26 00:01:46,810 --> 00:01:54,060 Then, after further than military style are not important, but not since it is a class we are using 27 00:01:54,060 --> 00:01:58,060 did not operate since 14 paragraph HDMI attacks. 28 00:01:58,080 --> 00:02:04,680 We should not no need to use, not if we want to target the target using the name of the class, then 29 00:02:04,680 --> 00:02:06,720 we have to use this not when it. 30 00:02:08,120 --> 00:02:11,270 So bad going will be hashtag, etc.. 31 00:02:14,300 --> 00:02:15,380 Border radius. 32 00:02:17,200 --> 00:02:18,520 Will be seven pixels. 33 00:02:21,060 --> 00:02:22,560 But shadow will be. 34 00:02:23,580 --> 00:02:25,650 Veto two pixels. 35 00:02:26,790 --> 00:02:28,610 I think since and. 36 00:02:29,890 --> 00:02:31,030 I start to see things. 37 00:02:35,230 --> 00:02:36,610 Browning will be Britain makes sense. 38 00:02:40,760 --> 00:02:42,680 Well, it will be too far to make sense. 39 00:02:44,640 --> 00:02:51,000 The margin for this will be 16 pixels, 16 pixels stop a top left bottom and right every minute. 40 00:02:51,330 --> 00:02:53,970 If you want to look at top and bottom should be one variant left and right. 41 00:02:53,970 --> 00:02:58,170 That should be one value that in the first barometer, you can give the value for top and bottom. 42 00:02:58,500 --> 00:03:03,180 The second bet, I'm going to give the value far left and right, but we want everything to be safe, 43 00:03:03,200 --> 00:03:07,440 so I'm giving 16 pixels that will be left. 44 00:03:12,780 --> 00:03:16,320 You can see the copyright is affected at Brentford bottom of the screen. 45 00:03:17,100 --> 00:03:17,460 OK. 46 00:03:19,660 --> 00:03:20,500 So now we need to. 47 00:03:22,330 --> 00:03:23,080 Target the. 48 00:03:24,600 --> 00:03:25,830 Paragraph inserted the note. 49 00:03:28,220 --> 00:03:31,290 Font size will be 1.1 p.m.. 50 00:03:33,770 --> 00:03:36,350 Margin bottom will be an epic sense. 51 00:03:37,970 --> 00:03:41,360 White space we need in Europe. 52 00:03:43,810 --> 00:03:45,040 And would probably be. 53 00:03:46,500 --> 00:03:46,720 One. 54 00:03:49,860 --> 00:03:51,060 We're done with the paragraph. 55 00:03:51,890 --> 00:03:53,190 We want to get to the bottom. 56 00:03:54,370 --> 00:03:56,500 Oh, I think we haven't thought about it. 57 00:03:56,800 --> 00:03:59,200 Ones are even targeting the hedge fund. 58 00:04:01,440 --> 00:04:01,950 It's one. 59 00:04:03,030 --> 00:04:06,150 Should have a font size of 1.1 in. 60 00:04:09,670 --> 00:04:10,990 Margin bottom will be. 61 00:04:13,090 --> 00:04:13,960 Ben, since. 62 00:04:16,960 --> 00:04:23,320 So it will be six pixels for a truck and pixels, this photo, nor a paragraph inside the Note six figures. 63 00:04:23,500 --> 00:04:25,420 And the final thing we are left with is the button. 64 00:04:27,240 --> 00:04:27,930 Not not. 65 00:04:30,310 --> 00:04:30,700 Bottom. 66 00:04:33,180 --> 00:04:34,650 So this will have a position. 67 00:04:36,510 --> 00:04:37,140 And they do. 68 00:04:39,180 --> 00:04:40,470 Lord will be right. 69 00:04:43,630 --> 00:04:44,890 Bob, Jim Wright will be. 70 00:04:47,710 --> 00:04:48,520 Ben Bigfoots. 71 00:04:51,430 --> 00:04:57,970 Fallout will be a five year fix or one be along the border will be done. 72 00:05:04,000 --> 00:05:05,910 Which will be thirty six pixels. 73 00:05:10,620 --> 00:05:12,330 Height will also be the same as the. 74 00:05:16,620 --> 00:05:17,930 Carson will be appointed. 75 00:05:20,680 --> 00:05:21,610 Outlined will be done. 76 00:05:26,780 --> 00:05:31,670 So I think I've converted everything like if you take the note component, we are adding a component 77 00:05:31,670 --> 00:05:33,590 glass and all that one paragraph and button. 78 00:05:34,070 --> 00:05:37,490 So we basically ignored that one paragraph and bottom. 79 00:05:37,850 --> 00:05:40,670 So let me check by reflecting balloonist. 80 00:05:42,220 --> 00:05:43,660 Testing seniors this. 81 00:05:45,240 --> 00:05:50,250 Now you can see, like we have got the perfect how do it actually look like? 82 00:05:50,760 --> 00:05:57,510 So if you can see it also, we are having this heading content and also the delete icon also adding 83 00:05:57,510 --> 00:05:59,790 the adding content and the delete iconic 50 countries. 84 00:05:59,790 --> 00:06:02,250 It is deleted, but we have completed the signing. 85 00:06:02,250 --> 00:06:02,550 But. 86 00:06:03,970 --> 00:06:09,040 And the final thing we are left with, the last and final thing of this project is using the animations 87 00:06:09,040 --> 00:06:15,100 inside this create area so that if you see this, this is a big star, but we're going to do it whenever 88 00:06:15,580 --> 00:06:21,400 whenever you've seen any of the bears get standard for the first time, seeing only one like one small 89 00:06:21,400 --> 00:06:23,770 box when you click on this, then it will expand. 90 00:06:24,100 --> 00:06:28,900 So how to do that, how to do this expansion, using the business logic and everything, and also the 91 00:06:28,900 --> 00:06:33,310 summarization of the project, the last thing we'll see in the last and final video that is the next 92 00:06:33,310 --> 00:06:33,610 freedom.