1 00:00:01,480 --> 00:00:02,000 ‫Hit her. 2 00:00:02,050 --> 00:00:02,770 ‫Welcome back. 3 00:00:03,040 --> 00:00:06,160 ‫Now let us continue with the remaining part of our section. 4 00:00:07,270 --> 00:00:12,820 ‫The first thing I'm going to do is I'm going to now walk with button, because then we can arrange a 5 00:00:12,820 --> 00:00:13,210 ‫lot of. 6 00:00:13,990 --> 00:00:16,510 ‫So they're going to get back here and here. 7 00:00:16,510 --> 00:00:19,050 ‫Let me introduce the important part. 8 00:00:19,240 --> 00:00:24,400 ‫So I'm going to go that section doc banner and then I just need to select the button. 9 00:00:25,440 --> 00:00:28,380 ‫Now, but it has a lot of things adding color. 10 00:00:28,530 --> 00:00:29,220 ‫Not often. 11 00:00:29,520 --> 00:00:34,950 ‫So the first thing I'm going to do is add on background color so we can specify what type of content 12 00:00:34,950 --> 00:00:39,690 ‫we need, so we can specify the remaining thing here. 13 00:00:39,690 --> 00:00:41,460 ‫I'm going with the green. 14 00:00:41,580 --> 00:00:42,390 ‫Get back here. 15 00:00:43,140 --> 00:00:48,810 ‫OK, now I'm going to remove the border since we are going to have something like this. 16 00:00:49,710 --> 00:00:54,780 ‫So this doesn't require any type of border and that text color symbol, which is the blue itself. 17 00:00:55,710 --> 00:00:56,790 ‫Let me get back here. 18 00:00:58,440 --> 00:01:01,380 ‫Remove the border, and I'm going to call this one none. 19 00:01:01,560 --> 00:01:04,350 ‫The second thing is I'm going to make the gloves. 20 00:01:04,440 --> 00:01:09,660 ‫So what I'm going to do is I'm going to add a border radius and let's try to ram. 21 00:01:11,270 --> 00:01:16,610 ‫The third thing is, I'm going to change the text colors, I'm going to use color and I'm going to utilize 22 00:01:16,610 --> 00:01:17,660 ‫deep background color. 23 00:01:18,590 --> 00:01:19,940 ‫For now, this looks fine. 24 00:01:19,970 --> 00:01:20,810 ‫Get back here. 25 00:01:22,040 --> 00:01:27,260 ‫Looks fine to me, I need to change the font weight because this is pretty bold. 26 00:01:27,950 --> 00:01:33,530 ‫Let me get back here and let me change one way to 600 hundred. 27 00:01:35,340 --> 00:01:38,850 ‫Now, the next thing is, let me add some padding as well as margin. 28 00:01:39,090 --> 00:01:43,970 ‫So for now will take part in this program that will be added on all this side. 29 00:01:44,490 --> 00:01:47,640 ‫So this is the text, and here we have padding off to them. 30 00:01:48,120 --> 00:01:53,040 ‫But if you observe this, this binding is greater than this padding. 31 00:01:54,410 --> 00:02:00,950 ‫So I'm going to have two different finding, the first one should be around one point atrium and then 32 00:02:00,950 --> 00:02:03,470 ‫the second one should be around 2.7m. 33 00:02:03,950 --> 00:02:04,760 ‫Get back here. 34 00:02:05,730 --> 00:02:06,540 ‫Much better. 35 00:02:06,900 --> 00:02:09,300 ‫I think I need to change this border area. 36 00:02:09,390 --> 00:02:11,090 ‫This is pretty much more of. 37 00:02:11,460 --> 00:02:15,120 ‫So that means I can utilize maybe freedom. 38 00:02:17,210 --> 00:02:18,170 ‫It back here. 39 00:02:19,400 --> 00:02:21,640 ‫OK off, and this looks fine now. 40 00:02:21,860 --> 00:02:23,420 ‫There is some gap at the top. 41 00:02:24,170 --> 00:02:30,410 ‫What I can do is I can add a margin of error or I think I should add margin and then that will add more 42 00:02:30,410 --> 00:02:32,990 ‫top and bottom and then it'll save this one. 43 00:02:33,140 --> 00:02:34,250 ‫Get back here again. 44 00:02:36,070 --> 00:02:37,680 ‫Okay, much better. 45 00:02:37,780 --> 00:02:39,790 ‫Now you can see its exact clone. 46 00:02:40,480 --> 00:02:46,510 ‫We are still pending with the background thing, but if I scroll up, you can see now it's working great. 47 00:02:46,780 --> 00:02:49,690 ‫I think there is some size issue with Button right now. 48 00:02:51,130 --> 00:02:58,330 ‫Maybe I need to change some padding or maybe the font size, so if I get back had changed to one size. 49 00:03:00,680 --> 00:03:03,980 ‫And go with 1.4m, save this one. 50 00:03:04,100 --> 00:03:05,060 ‫Get back here. 51 00:03:07,510 --> 00:03:14,620 ‫Oh, looks fine now, so now we have the exact clone for this part, the next part is about the background, 52 00:03:14,980 --> 00:03:20,140 ‫so background is specifically a separate topic we'll be discussing in the next lecture. 53 00:03:20,440 --> 00:03:22,990 ‫But before that, let me add the Howard effect also. 54 00:03:24,380 --> 00:03:28,290 ‫So let me get back and select the selector. 55 00:03:30,820 --> 00:03:31,610 ‫How a effect. 56 00:03:34,600 --> 00:03:36,730 ‫Now, there are two things that are changing. 57 00:03:36,760 --> 00:03:43,720 ‫The first is about the size of this button, and the second thing is about Devinder, so going that 58 00:03:43,720 --> 00:03:49,450 ‫a simple just down the over winter and the seasons change and you see. 59 00:03:50,670 --> 00:03:52,380 ‫These sizes are increasing. 60 00:03:53,010 --> 00:03:56,280 ‫So let me try to increase the font size and see what happens. 61 00:03:56,640 --> 00:04:03,660 ‫So I just jump at the font size and head if I see five, currently it's 1.4. 62 00:04:04,140 --> 00:04:06,990 ‫So if I go with one point five, get back here. 63 00:04:10,740 --> 00:04:12,510 ‫It's about I don't want this. 64 00:04:12,690 --> 00:04:13,740 ‫What can we do? 65 00:04:14,250 --> 00:04:20,370 ‫So there is a property called TRANSCOM, I discussed this earlier on Sunday is going to be a specific 66 00:04:20,370 --> 00:04:21,750 ‫lecture on Transform. 67 00:04:22,200 --> 00:04:25,170 ‫But what we can do is we can control the whole part. 68 00:04:25,650 --> 00:04:32,610 ‫When I say, OK, change the text size that is going to affect the text size only you can see excise 69 00:04:32,610 --> 00:04:36,270 ‫increases, then it affect the margin, and that's why the burden is increasing. 70 00:04:36,750 --> 00:04:41,070 ‫But what I want is I want to scale this whole button equally. 71 00:04:42,030 --> 00:04:44,790 ‫So what we can do is we can utilize the transform. 72 00:04:45,570 --> 00:04:49,170 ‫And this has multiple option, but we are going to go with scale. 73 00:04:49,860 --> 00:04:53,580 ‫If you just want to increase horizontally, then use X. 74 00:04:53,580 --> 00:04:55,860 ‫If you want to go with vertical use, why? 75 00:04:56,070 --> 00:05:00,450 ‫If you want to do both use scale and then you can pass two values. 76 00:05:00,780 --> 00:05:04,500 ‫The first one will be horizontally, the second one will be vertically. 77 00:05:04,830 --> 00:05:13,380 ‫So if I say 104 percent, that means I'm going to change the size from 100 percent to 100 for I see 78 00:05:13,560 --> 00:05:14,430 ‫it back here. 79 00:05:15,150 --> 00:05:18,180 ‫You can see now it's walking exactly the same. 80 00:05:19,910 --> 00:05:25,220 ‫Suppose if I change it to 80 percent, that means the original size was 100. 81 00:05:25,430 --> 00:05:27,150 ‫And now we have changed it to 80. 82 00:05:27,170 --> 00:05:30,290 ‫So if I hold whatever over this, you can see it's decreasing. 83 00:05:30,920 --> 00:05:32,500 ‫So that's how the scale works. 84 00:05:32,510 --> 00:05:35,180 ‫We can change size according to our requirements. 85 00:05:35,990 --> 00:05:38,390 ‫Let me go back to one 04. 86 00:05:39,380 --> 00:05:40,610 ‫This looks quite. 87 00:05:42,080 --> 00:05:47,270 ‫OK, that's all for this lecture now, only one thing is remaining with this section, which is background 88 00:05:47,990 --> 00:05:53,060 ‫on in the next lecture, we will understand about background specifically and will add a background 89 00:05:53,060 --> 00:05:54,500 ‫for this specific part. 90 00:05:55,160 --> 00:05:56,690 ‫I hope this lecture was helpful. 91 00:05:56,840 --> 00:05:57,890 ‫Thank you for calling. 92 00:05:58,040 --> 00:05:59,810 ‫And I see you guys in the next one.