1
00:00:01,580 --> 00:00:10,310
Hello, in this video, I am going to show you how to implement chords so called R a cooey in bootstrap

2
00:00:10,310 --> 00:00:15,950
of organizing and data together and one I to show you the implementation.

3
00:00:15,980 --> 00:00:16,790
You know what it looks like.

4
00:00:18,020 --> 00:00:24,500
I've seen similar things in other websites, especially social networking websites, blogs, that sort

5
00:00:24,500 --> 00:00:24,740
of thing.

6
00:00:24,740 --> 00:00:26,810
You get some sort of chord system.

7
00:00:27,210 --> 00:00:38,470
OK, so first of all, what you want to do is do in the class called fingerstick court of court and

8
00:00:38,930 --> 00:00:43,970
hear what we want to do is say you can actually put a lot of different stuff.

9
00:00:44,240 --> 00:00:51,380
So if you go to the website for the record section of the link to this with this video, you can see

10
00:00:51,380 --> 00:00:53,090
all the different types of things you can.

11
00:00:53,090 --> 00:00:56,010
And, you know, there's stuff to do, navigation.

12
00:00:56,030 --> 00:00:59,590
I mean, there's a lot of true colors I cover.

13
00:00:59,780 --> 00:01:04,670
You know, I'll say a reasonable amount of it, but just enough to basically get you started.

14
00:01:04,680 --> 00:01:06,930
And so you understand what it is.

15
00:01:07,710 --> 00:01:08,670
I'm going to add an image.

16
00:01:09,070 --> 00:01:10,240
This is just optional.

17
00:01:10,310 --> 00:01:19,130
Could just be purely text or links or button, for example, and not be sort of the second class is

18
00:01:19,220 --> 00:01:26,000
called Ducharme G Top Top, because at the top you can have one at the bottom as well.

19
00:01:26,000 --> 00:01:27,530
Feel free to expand that.

20
00:01:28,190 --> 00:01:34,330
You can have an old tag put on top of it, feel free to make it more contextual.

21
00:01:34,580 --> 00:01:42,200
And so the source of image quality of cued up Kopitar Batman, you can you can read what you want.

22
00:01:42,590 --> 00:01:44,810
OK, so that's next.

23
00:01:44,910 --> 00:01:48,570
Next, we're going to create a picture called Dave.

24
00:01:51,950 --> 00:01:54,410
In court today.

25
00:01:55,860 --> 00:01:59,040
And for page five.

26
00:02:01,250 --> 00:02:07,540
Total collapse equals confidence.

27
00:02:07,860 --> 00:02:15,260
I like to think from next what we're going to do is put a polygraph test and it's just checked again.

28
00:02:15,440 --> 00:02:20,900
Feel free to go to the Bistrot website for more information on cards and all the different things you

29
00:02:20,900 --> 00:02:21,200
can add.

30
00:02:21,210 --> 00:02:26,180
This is just one of the examples that were given, and I'll quite like this example, I think perfectly

31
00:02:26,180 --> 00:02:32,090
illustrates what cards all about so-called duct tape.

32
00:02:32,540 --> 00:02:36,310
And I was going to put some buyoff about Mansori.

33
00:02:36,620 --> 00:02:37,660
Got this VOYCE.

34
00:02:37,670 --> 00:02:39,710
I'm going to put a little bit of that.

35
00:02:39,740 --> 00:02:44,980
Muslims should be as much as you want, but you put too much credit inside the card.

36
00:02:44,990 --> 00:02:50,780
It can just sort of look a bit weird, but feel free to expand on it.

37
00:02:50,930 --> 00:02:57,830
And one more thing and I'll add basically important to feel free to check out my video on button button

38
00:02:57,830 --> 00:03:07,370
groups, that sort of stuff to understand more about and feelings thinking you might be wondering.

39
00:03:12,070 --> 00:03:18,280
But now with all that money, so.

40
00:03:23,840 --> 00:03:31,220
Save them, go back, refresh, and there we have got our card, so if I was to restore the brother,

41
00:03:31,370 --> 00:03:33,860
this is what we get is slowly goes down.

42
00:03:34,070 --> 00:03:36,500
But, you know, she's pretty big on the large screens.

43
00:03:36,710 --> 00:03:45,080
So what we can do, we can customize this as we would like it to be, you know, expand all of the columns

44
00:03:45,260 --> 00:03:54,880
or 12 spaces in the row when it's on small to medium on a book desk fixed.

45
00:03:55,160 --> 00:03:59,770
And when he goes to larger above Algy desperate.

46
00:03:59,780 --> 00:04:01,700
So those are the breakpoints I'm using.

47
00:04:01,910 --> 00:04:03,120
Feel free to experiment.

48
00:04:03,230 --> 00:04:04,790
So stop free at the moment.

49
00:04:04,790 --> 00:04:07,090
Say five free more to sit on the same line.

50
00:04:07,100 --> 00:04:10,550
I'll show you the second and the next one.

51
00:04:10,550 --> 00:04:17,030
It should be half the half the actual container and the half the website, the fluid content.

52
00:04:17,030 --> 00:04:21,800
I'll be half of the width of the browser and now it's gone to the small screen size.

53
00:04:22,220 --> 00:04:24,950
So let me actually duplicate this.

54
00:04:30,840 --> 00:04:32,120
So a few then.

55
00:04:32,220 --> 00:04:35,690
So this is what we get now so that you can see for yourself.

56
00:04:36,000 --> 00:04:37,880
They all look pretty cool.

57
00:04:38,010 --> 00:04:41,660
So it's looking kind of like a social media website.

58
00:04:41,970 --> 00:04:45,380
So I'm pretty sure you see the benefit of using cards.

59
00:04:45,610 --> 00:04:52,360
And you can see, you know, any individual, one of them, by going to the card class and put in know

60
00:04:52,530 --> 00:04:56,660
like big, you know, background checks, for example.

61
00:04:57,990 --> 00:05:00,080
And that's the background, Don.

62
00:05:00,420 --> 00:05:09,350
And you kind of get that information from the which you get on Twitter, Minton's scripture that we

63
00:05:09,390 --> 00:05:10,960
go background color.

64
00:05:11,010 --> 00:05:12,470
You can also the borders as well.

65
00:05:12,480 --> 00:05:15,150
So feel free to check all of that out.

66
00:05:16,410 --> 00:05:18,300
OK, so here's a little test.

67
00:05:18,340 --> 00:05:23,530
We we've only to figure out how to move or actually add a gap here.

68
00:05:23,730 --> 00:05:30,120
So when the cards are on top of each that you want and they'll slide capitaland look good if they're

69
00:05:30,120 --> 00:05:32,190
connected, aesthetically speaking.

70
00:05:32,550 --> 00:05:33,120
So that's it.

71
00:05:33,150 --> 00:05:34,080
Any questions?

72
00:05:34,260 --> 00:05:35,790
Feel free to put me on message.

73
00:05:35,790 --> 00:05:39,260
And as usual, I look forward to seeing you in the next video.