1
00:00:00,470 --> 00:00:05,690
Not that necessarily created an estimate, it's time to move into cities, as you might know, that

2
00:00:05,750 --> 00:00:08,300
EdgeHTML in in itself won't be doing much.

3
00:00:08,570 --> 00:00:10,580
So far, that bubbles will be needing cities.

4
00:00:11,030 --> 00:00:15,500
And as you are aware that there are different ways in which we can implement cities, and in this case,

5
00:00:15,500 --> 00:00:19,630
we will be making a separate file in which we will be adding all our cities and then importing it and

6
00:00:20,200 --> 00:00:21,370
it are not indexed dodges.

7
00:00:21,860 --> 00:00:26,120
So if you look at that app, you see there are the margins around component margins and bad things.

8
00:00:26,510 --> 00:00:30,290
So far that what was the first thing that they're going to do is remove those margins.

9
00:00:30,290 --> 00:00:35,960
So just select the entire body and after and before and put the margin and padding to zero.

10
00:00:41,850 --> 00:00:44,550
Margin should be zero, as well as the padding.

11
00:00:50,600 --> 00:00:53,240
And will give it a box sizing of budget box.

12
00:00:55,400 --> 00:00:59,720
And this is a murder, and now it's time to move into a body element.

13
00:01:00,830 --> 00:01:05,110
And as you can see, all the madness and bearings have gone.

14
00:01:05,320 --> 00:01:09,000
No, it's not a component is sticking to our window screen now.

15
00:01:09,000 --> 00:01:11,510
We'll give it a body element of a foreign family.

16
00:01:12,850 --> 00:01:13,900
Of Apple system.

17
00:01:16,060 --> 00:01:22,360
And sensitive as the primary ones and will get a background color of Excel, 210, 36 percent and 96

18
00:01:22,360 --> 00:01:22,840
percent.

19
00:01:23,200 --> 00:01:27,940
And the color of Excel to nine, 61 percent and 16 percent.

20
00:01:28,180 --> 00:01:36,300
And a line height of 1.5 and a font family or a font size of 1.5 by 0.7 8.5 firearm.

21
00:01:39,560 --> 00:01:44,300
Now you can see there that unions have already been implemented, you can see that if enforced, that

22
00:01:44,300 --> 00:01:45,260
has been applauded.

23
00:01:47,330 --> 00:01:52,850
Now will target our block plus and give it a minute of 50, which.

24
00:01:57,470 --> 00:02:03,500
And now it's time to make a black banner, a very targeted class that was BCG black and give it a background

25
00:02:03,500 --> 00:02:06,080
of hashtag dozy to E3 when.

26
00:02:07,330 --> 00:02:13,480
Now, if you look at add up, you see that black banner looks kind of similar, but it does, it is

27
00:02:13,480 --> 00:02:14,020
in the same.

28
00:02:18,080 --> 00:02:21,260
And a container of that interview.

29
00:02:22,500 --> 00:02:24,900
And Max, with of 730 pixels.

30
00:02:26,510 --> 00:02:32,960
And a background of hashtag love, it's right, basically, but with a different shade, a margin of

31
00:02:32,960 --> 00:02:33,390
zero.

32
00:02:33,410 --> 00:02:33,950
And auto.

33
00:02:35,490 --> 00:02:38,640
And imagine top of 200 pixels, not 2000 pixels.

34
00:02:39,710 --> 00:02:47,150
And we will give it a border radius of zero point origin and position should be relative.

35
00:02:49,180 --> 00:02:51,370
And we'll give it a text allowing, Senator.

36
00:02:53,400 --> 00:02:54,990
And padding a 1.5m.

37
00:02:56,970 --> 00:03:04,110
And we give it a border, a shadow of zero five pixels, 15 pixels with ogbia zero zero zero and 0.2.

38
00:03:05,670 --> 00:03:06,590
Now we look at add up.

39
00:03:07,090 --> 00:03:09,210
Seems very nice, but still there are ways to go.

40
00:03:09,900 --> 00:03:14,070
So let's move backwards and again target another element.

41
00:03:14,100 --> 00:03:15,360
This time it's going to be container.

42
00:03:26,210 --> 00:03:28,190
Now, will you read the content of empty string?

43
00:03:29,250 --> 00:03:31,470
And a position should be absolute.

44
00:03:36,820 --> 00:03:41,320
Position should be absolute top, should be zero and left should be zero with a rate of 100 percent

45
00:03:42,100 --> 00:03:44,920
and height should be around.

46
00:03:46,360 --> 00:03:47,260
130 meters.

47
00:03:48,580 --> 00:03:53,740
And we'll go to Border Bottom after eight years of zero point of Abraham and saying will go over the

48
00:03:53,740 --> 00:03:56,190
border bottom right radius 0.5 item.

49
00:04:03,300 --> 00:04:09,150
Now seems kind of nice, but we have to make certain moral judgments and regret about at the bottom

50
00:04:09,150 --> 00:04:11,880
of one big stone solid with RGV value.

51
00:04:14,730 --> 00:04:19,220
Now, let's talk about container image, because there are some adjustments that we need to make that

52
00:04:19,530 --> 00:04:26,820
record a 150 pixels and the height of three pixels and a position should be relative to the box and

53
00:04:28,020 --> 00:04:34,520
border areas of 15 percent and padding of five pixels and really the background Pasha Kovalev.

54
00:04:35,130 --> 00:04:39,030
And that's again, that white and borderline pixels already with Ojibway value.

55
00:04:39,600 --> 00:04:42,330
No images, certainly looking good.

56
00:04:42,600 --> 00:04:52,290
Nobody would imagine burden them off to them and box shadow of zero five pixels, 15 pixels and a bit

57
00:04:52,300 --> 00:04:53,070
igb value.

58
00:04:57,210 --> 00:05:00,600
No content has been separated from an image.

59
00:05:05,060 --> 00:05:11,300
Now we're talking to you the title plus of the paragraph, and you were the font size of 18 pixels and

60
00:05:11,300 --> 00:05:15,110
a margin of button margin bottom of zero.

61
00:05:15,950 --> 00:05:18,140
And we will target the user value.

62
00:05:18,650 --> 00:05:25,610
This is this was again the paragraph class and your different age of 20 pixels and then the target are

63
00:05:25,950 --> 00:05:26,480
valueless.

64
00:05:26,600 --> 00:05:28,040
Basically, these are the icons.

65
00:05:29,280 --> 00:05:35,070
And there's a fair amount of work to be done here displaying great and the great template column should

66
00:05:35,070 --> 00:05:38,070
be six repeated with whenever.

67
00:05:42,400 --> 00:05:43,180
Now I can.

68
00:05:44,900 --> 00:05:46,400
I can should be a background.

69
00:05:47,940 --> 00:05:48,720
Transparent.

70
00:05:52,130 --> 00:05:54,920
And borders should be transparent.

71
00:05:56,260 --> 00:05:58,590
And it a quantities of 1.5m.

72
00:06:02,190 --> 00:06:07,710
Now, it seems nice, but we have to make sure that a value element is separated from the rest of the

73
00:06:07,710 --> 00:06:11,300
content of events for timing, let's give it a go.

74
00:06:12,270 --> 00:06:15,870
Now we are having our cursor when we ask when you are hovering over Reagan's.

75
00:06:18,020 --> 00:06:18,350
OK.

76
00:06:19,590 --> 00:06:22,860
Now, I just heard 222, wasn't it, 49 percent?

77
00:06:23,860 --> 00:06:25,320
OK, so now we have a different color.

78
00:06:27,850 --> 00:06:31,630
And the transition of all 0.3 seconds linear.

79
00:06:34,900 --> 00:06:35,590
And then.

80
00:06:37,390 --> 00:06:39,940
As you can see, everything is picture perfect now.

81
00:06:41,620 --> 00:06:47,770
Novel Target the paragraph element and give it a margin bottom of five them so that it can be separated

82
00:06:47,770 --> 00:06:48,640
from our icons.

83
00:06:49,820 --> 00:06:50,870
OK, now it's done.

84
00:06:51,650 --> 00:06:53,090
OK, let's give it a one point zero.

85
00:06:55,950 --> 00:06:57,720
1.5 zero, Jim.

86
00:07:02,730 --> 00:07:04,890
OK, you know, it's looking slightly better.

87
00:07:13,230 --> 00:07:16,830
Let's give it the color of each other, 29, 34 percent and 30 percent.

88
00:07:18,580 --> 00:07:23,050
At paragraph elements and whenever we have our icons, the color should change.

89
00:07:23,650 --> 00:07:29,480
So for that purpose, we are using the superclass and give it a color of excel to a five, 78 percent,

90
00:07:29,480 --> 00:07:30,280
then 60 percent.

91
00:07:30,610 --> 00:07:33,640
So now that you see when you are hovering icons, there's a different color.

92
00:07:37,950 --> 00:07:43,290
No, it's not that only persons from the Windows or PC personally reviewing are Europe.

93
00:07:43,470 --> 00:07:46,380
This is going to be mobile first app, so we have to make sure that it's responsive.

94
00:07:46,740 --> 00:07:54,720
So we'll just make sure that whenever a person is being it from a device that is not mobile, the font

95
00:07:54,720 --> 00:07:57,750
size should not be same as it is on mobile.

96
00:07:58,080 --> 00:08:01,830
So the font size should be wondering whenever the men, whether the device is agent pictures.

97
00:08:02,310 --> 00:08:07,320
And while the user value should increased to 38 pixels, I can say should increase to them.

98
00:08:10,310 --> 00:08:14,890
Now we older and ready to roll, and it's time to add dynamics to our React app.