add getting started videos

This commit is contained in:
LordGhostX 2024-05-13 19:40:15 +01:00
parent fc0672d80b
commit 38bc3a0a80
No known key found for this signature in database
GPG Key ID: 520CC5DC4F94FCC7
2 changed files with 22 additions and 4 deletions

View File

@ -47,7 +47,13 @@ Looking for what to build with Waku? Discover a collection of sample ideas and u
## Use cases
## Get started
## Getting started
<div class="video-container">
<iframe class="yt-video two-items" src="https://www.youtube.com/embed/PYQaXCxUCwA" title="Waku Tutorial 001: Introduction to Waku" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
<iframe class="yt-video two-items" src="https://www.youtube.com/embed/sfmMcrbiX0c" title="Build a game using Waku Protocol" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
### Run a Waku node

View File

@ -21,16 +21,28 @@ html[data-theme="dark"] .header-github-link:before {
.video-container {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
justify-content: space-around;
align-items: flex-start;
}
.yt-video {
flex: 1 1 auto;
max-width: 100%;
width: 768px;
height: 432px;
}
.two-items {
width: 100%;
}
/* Media query for tablets and desktops */
@media (min-width: 768px) {
.two-items {
width: 48%;
}
}
.external-link {
margin-top: 0.25rem;
}