1
0
Fork 0
mirror of https://api.glitch.com/git/yaswvc synced 2026-01-12 03:18:10 +00:00

👩📰 Checkpoint

./views/index.html:5975361/3528
./public/style.css:5975361/856
This commit is contained in:
Glitch (peerjs-video) 2020-09-08 16:07:19 +00:00
parent 7e13a1ce11
commit a279345aca
2 changed files with 31 additions and 64 deletions

View file

@ -1,56 +0,0 @@
/* this file is loaded by index.html and styles the page */
* {
box-sizing: border-box;
}
body {
font-family: sans-serif;
margin: 2em 1em;
line-height: 1.5em;
}
h1 {
font-style: italic;
color: #373fff;
max-width: calc(100% - 5rem);
line-height: 1.1;
}
form {
background-color: #eee;
display: grid;
grid-gap: 1em;
padding: 1em;
max-width: 40ch;
}
input {
border: 1px solid silver;
display: block;
font-size: 16px;
margin-bottom: 10px;
padding: 5px;
width: 100%;
}
form button {
background-color: #bbbbf2;
border: 2px solid currentColor;
border-radius: .25em;
cursor: pointer;
font-size: inherit;
line-height: 1.4em;
padding: 0.25em 1em;
max-width: 20ch;
}
form button:hover {
background-color: lavender;
}
footer {
margin-top: 3em;
padding-top: 1.5em;
border-top: 1px solid lightgrey;
}

View file

@ -12,6 +12,7 @@
<link id="favicon" rel="icon" href="https://glitch.com/edit/favicon-app.ico" type="image/x-icon">
<!-- import the webpage's stylesheet -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="/style.css">
<!-- import libraries -->
@ -19,16 +20,38 @@
<!-- import the webpage's client-side javascript file -->
<script src="/main.js" type="module"></script>
</head>
<body>
<h6>
local
</h6>
<video id="localVideo" autoplay></video>
<h6>
remote
</h6>
<video id="remoteVideo" autoplay></video>
<!-- Image and text -->
<nav class="navbar navbar-light bg-light">
<a class="navbar-brand" href="#">
<img src="/docs/4.5/assets/brand/bootstrap-solid.svg" width="30" height="30" class="d-inline-block align-top" alt="" loading="lazy">
Yet Another Simple WebRTC Video Chat
</a>
</nav>
<div class="container pt-3">
<div class="row">
<div class="col-6">
<div class="card">
<video id="localVideo" class="card-img-top" autoplay></video>
<h5 class="card-title">Me</h5>
<div class="card-body">
<p class="card-text"></p>
</div>
</div>
</div>
<div class="col-6">
<div class="card">
<video id="remoteVideo" class="card-img-top" autoplay></video>
<h5 class="card-title">Remote</h5>
<div class="card-body">
<p class="card-text"></p>
</div>
</div>
</div>
</div>
</div>
<input type="text" id="connect-to-peer" />
<button onclick="connectToPeer()">
Connect