1 00:00:00,940 --> 00:00:01,490 ‫Hey, there. 2 00:00:01,540 --> 00:00:02,290 ‫Welcome back. 3 00:00:02,470 --> 00:00:04,990 ‫Now let us quickly fix our icon. 4 00:00:05,410 --> 00:00:07,830 ‫So how do you see this size is pretty different? 5 00:00:08,660 --> 00:00:10,900 ‫And had we are getting pretty big size? 6 00:00:11,080 --> 00:00:14,800 ‫So what I'm going to do is I'm going to click on Inspect now here. 7 00:00:14,800 --> 00:00:18,160 ‫Currently, this image is dependent on this logo. 8 00:00:18,970 --> 00:00:20,410 ‫There are a few things we can do. 9 00:00:20,650 --> 00:00:22,840 ‫The first thing is definitely what we did here. 10 00:00:22,840 --> 00:00:24,200 ‫We can add our size. 11 00:00:24,580 --> 00:00:30,010 ‫So if we jump, here we are at our size as height for the Pixel because this was dependant on height. 12 00:00:30,610 --> 00:00:36,400 ‫Here we can add some changes, like maybe weight, or maybe we can just define fix my size. 13 00:00:37,090 --> 00:00:43,690 ‫Most companies do that, and we can also define that all we can to find some percentage that maybe we 14 00:00:43,690 --> 00:00:48,940 ‫are depending on the width of our current level, we can define percentage accordingly. 15 00:00:49,420 --> 00:00:54,130 ‫Also, since we are utilizing flex it out this way, it will change. 16 00:00:54,580 --> 00:01:01,090 ‫So remember that since we are utilizing Flex it up, you can see this is somewhat responsive, but we 17 00:01:01,090 --> 00:01:02,770 ‫need to make certain changes. 18 00:01:02,770 --> 00:01:04,240 ‫But this is responsive. 19 00:01:05,270 --> 00:01:12,440 ‫OK, so let me jump here, jump onto our EMG, which is going to be our portable container and then 20 00:01:12,440 --> 00:01:19,280 ‫I'm going to have my logo section, so I'm going to go with water, then I'm going to have my logo. 21 00:01:20,930 --> 00:01:24,260 ‫Now, all the changes regarding our image and logo will be done here. 22 00:01:24,620 --> 00:01:26,510 ‫I don't think I have any change. 23 00:01:26,540 --> 00:01:33,560 ‫The first change I need to do is with the word itself because here our image is somewhat dependent on 24 00:01:33,560 --> 00:01:34,070 ‫the world. 25 00:01:34,460 --> 00:01:37,690 ‫So let me try to have our fixed size. 26 00:01:37,690 --> 00:01:39,890 ‫So with the logo? 27 00:01:39,920 --> 00:01:43,150 ‫Let me jump on to our IMG head. 28 00:01:43,160 --> 00:01:47,180 ‫Let me add our work as a 70 percent. 29 00:01:47,330 --> 00:01:48,290 ‫Save this one. 30 00:01:48,860 --> 00:01:49,760 ‫Get back here. 31 00:01:50,910 --> 00:01:58,650 ‫Much better, so we defined this is the logo section, which is going to have this word and we are covering 32 00:01:58,650 --> 00:01:59,880 ‫this 70 percent. 33 00:02:00,510 --> 00:02:03,150 ‫We can utilize this and this is going to work fine. 34 00:02:04,300 --> 00:02:04,810 ‫OK. 35 00:02:05,380 --> 00:02:11,500 ‫If I try to change this, maybe by trying to decrease the size here, it's still working. 36 00:02:11,500 --> 00:02:12,070 ‫Why? 37 00:02:12,080 --> 00:02:18,880 ‫Because we are utilizing Flex Container and this is going to be carried away with extra space. 38 00:02:18,910 --> 00:02:19,720 ‫Remember that? 39 00:02:20,080 --> 00:02:23,650 ‫So our logo section is only having this amount of space. 40 00:02:23,890 --> 00:02:28,420 ‫And we are just utilizing the 70 percent. 41 00:02:28,540 --> 00:02:29,590 ‫Remember this point? 42 00:02:30,630 --> 00:02:36,990 ‫Now, if by any chance we add Flex grow here, this is going to take extra space. 43 00:02:37,320 --> 00:02:44,670 ‫If we are to flex grow with our logo, then this is going to take extra space and my size is going to 44 00:02:44,670 --> 00:02:45,540 ‫get affected. 45 00:02:46,200 --> 00:02:51,990 ‫So either you can add fig size or you can utilize this property and this is going to work fine for now. 46 00:02:53,220 --> 00:02:59,220 ‫OK, this looks fine, there are still certain changes that we have to do now if we compare both the 47 00:02:59,220 --> 00:03:03,870 ‫current development and the clone, you will observe that there is some shift here. 48 00:03:04,940 --> 00:03:09,950 ‫And the reason is that specific space that are current social fiction is taking. 49 00:03:10,310 --> 00:03:16,820 ‫So if you observe this, this is at this center somewhere and this is added on or some site. 50 00:03:17,180 --> 00:03:19,940 ‫So what we can do is we can add flex grow. 51 00:03:20,270 --> 00:03:25,760 ‫So instead of taking that means instead of giving all this space to our second section, we can give 52 00:03:25,760 --> 00:03:28,190 ‫some space to our social section as well. 53 00:03:28,970 --> 00:03:35,840 ‫Remember all these to our child so long ways a child link as a child, as well as social as a child 54 00:03:36,350 --> 00:03:40,760 ‫we have given growth to here we can give flex grew one here. 55 00:03:41,000 --> 00:03:45,550 ‫That means social is also going to take some space on hand. 56 00:03:45,620 --> 00:03:48,380 ‫What I can do is I can add further. 57 00:03:50,150 --> 00:03:52,370 ‫And then I can directly select the social. 58 00:03:54,430 --> 00:03:57,430 ‫And had a Canada property flex grow. 59 00:03:57,850 --> 00:04:00,250 ‫And let me give one, save this one. 60 00:04:02,590 --> 00:04:04,840 ‫Now you can see it's working fine. 61 00:04:05,290 --> 00:04:12,280 ‫So what we're doing is Flex crew is utilized when we have some extra space within our container and 62 00:04:12,280 --> 00:04:15,220 ‫we can then distribute it at this point of time. 63 00:04:15,370 --> 00:04:20,320 ‫We had enough of extra space when we first initialize all three containers. 64 00:04:20,860 --> 00:04:28,360 ‫So what happened is I utilized the two parts here and one part here, and I hope you got the idea how 65 00:04:28,360 --> 00:04:28,900 ‫we did it. 66 00:04:29,590 --> 00:04:32,650 ‫The only thing remaining is adding a power to them. 67 00:04:33,310 --> 00:04:35,800 ‫So if you see here, we have our part. 68 00:04:37,280 --> 00:04:42,890 ‫Also, Howard, to this, so let me get back the question, I'm going to do this, I and how are you? 69 00:04:43,640 --> 00:04:46,310 ‫So simply just need to change the course. 70 00:04:51,330 --> 00:04:52,190 ‫Save this one. 71 00:04:52,230 --> 00:04:54,690 ‫Get back here walking by fine. 72 00:04:55,880 --> 00:05:00,800 ‫Also, I need to do something similar with a light dog, so get back here. 73 00:05:05,270 --> 00:05:10,520 ‫And how about I also need to change the font color as well as change because. 74 00:05:12,000 --> 00:05:12,810 ‫Get back here. 75 00:05:15,090 --> 00:05:16,080 ‫Working fine. 76 00:05:16,350 --> 00:05:18,780 ‫OK, I don't want this for my heading. 77 00:05:18,930 --> 00:05:24,000 ‫So what I can do is I can separately are out for my heading. 78 00:05:28,510 --> 00:05:32,980 ‫And change my color to default color, which currently my heading has. 79 00:05:33,430 --> 00:05:41,440 ‫And also I can change the point and also because at this point in time, I am getting this winter car, 80 00:05:41,440 --> 00:05:44,830 ‫so I don't want winter car set off on my heading. 81 00:05:45,400 --> 00:05:51,100 ‫What I can do is I can change the car set here and I can call this as text. 82 00:05:51,820 --> 00:05:52,640 ‫Save this one. 83 00:05:52,660 --> 00:05:53,470 ‫Get back here. 84 00:05:55,150 --> 00:06:00,160 ‫OK, now it's working fine, so these are pointers, and this is next. 85 00:06:01,280 --> 00:06:02,280 ‫Looks good to us. 86 00:06:02,300 --> 00:06:03,470 ‫This section is done. 87 00:06:03,780 --> 00:06:09,380 ‫The two are remaining, which is going to be about our location as well as our extras. 88 00:06:10,160 --> 00:06:16,160 ‫So I hope you got the idea till now, what we did about Flex, nested flex and a few other changes. 89 00:06:16,970 --> 00:06:20,330 ‫OK, thank you for calling and I see you guys in the next one. 90 00:06:20,550 --> 00:06:26,510 ‫And if there will be any other changes we will do in future section because we need to make it responsive, 91 00:06:26,510 --> 00:06:29,240 ‫so there will be certain changes and future as well. 92 00:06:29,870 --> 00:06:31,280 ‫OK, see you in the next one.