ben.carrasco/next-static-site
1
0
Fork 0
mirror of https://github.com/jambonz/next-static-site.git synced 2025-12-19 04:47:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fluid video wrapper for docs <iframe> embeds

Browse Source
This commit is contained in:
kitajchuk
2021-05-16 11:53:38 -07:00
parent 2d3b9fcad1
commit ea77ea4e14
5 changed files with 28 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/tutorials/getting-started.md
View File

@@ -2,5 +2,7 @@
This video tutorial shows you how to get up and running in minutes on jambonz.org. It takes you through the process of plugging in your carriers and speech services, and then running some basic tests to verify your account is ready to rock!
<iframe width="560" height="315" src="https://www.youtube.com/embed/BVOwpxIKOso" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="video-wrap">
<iframe width="560" height="315" src="https://www.youtube.com/embed/BVOwpxIKOso" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

4
docs/tutorials/nodejs-sdk.md
View File

@@ -2,4 +2,6 @@
This video tutorial shows you how to start building jambonz applications using the Node.js SDK. Examples of building applications that involve handling user speech input as well as integrating with Google Dialogflow and Amazon Lex are covered in this introductory video.
<iframe width="560" height="315" src="https://www.youtube.com/embed/42jcqyvCstU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="video-wrap">
<iframe width="560" height="315" src="https://www.youtube.com/embed/42jcqyvCstU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

4
docs/tutorials/simwood.md
View File

@@ -2,4 +2,6 @@
[Simwood](https://simwood.com) is an innovative company providing an array of telecoms service in the UK, Europe and the UK, including a wholesale SIP trunking service that is perfectly suited for use with jambonz. This video shows you how to plug in Simwood as your preferred carrier for your jambonz.org account.
<iframe width="560" height="315" src="https://www.youtube.com/embed/nTDSAebFPQU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="video-wrap">
<iframe width="560" height="315" src="https://www.youtube.com/embed/nTDSAebFPQU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

4
docs/tutorials/voxbone.md
View File

@@ -2,4 +2,6 @@
[Voxbone](https://www.voxbone.com/) is a great choice for international deployments, offering both voice inbound and outbound services, global SIP trunks, and local phone numbers in almost every country around the world. This video shows you how to plug in Voxbone as your preferred carrier for your jambonz.org account.
<iframe width="560" height="315" src="https://www.youtube.com/embed/ProPBCwwO8c" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="video-wrap">
<iframe width="560" height="315" src="https://www.youtube.com/embed/ProPBCwwO8c" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>

16
styles/_layout.scss
View File

@@ -77,4 +77,20 @@
margin-right: auto;
}
}
}
/******************************************************************************
* Fluid video embeds
*******************************************************************************/
.video-wrap {
position: relative;
padding-bottom: 56.25%;
iframe {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
}