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:
parent
7e13a1ce11
commit
a279345aca
2 changed files with 31 additions and 64 deletions
|
|
@ -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;
|
|
||||||
}
|
|
||||||
|
|
@ -12,6 +12,7 @@
|
||||||
|
|
||||||
<link id="favicon" rel="icon" href="https://glitch.com/edit/favicon-app.ico" type="image/x-icon">
|
<link id="favicon" rel="icon" href="https://glitch.com/edit/favicon-app.ico" type="image/x-icon">
|
||||||
<!-- import the webpage's stylesheet -->
|
<!-- 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">
|
<link rel="stylesheet" href="/style.css">
|
||||||
|
|
||||||
<!-- import libraries -->
|
<!-- import libraries -->
|
||||||
|
|
@ -19,16 +20,38 @@
|
||||||
|
|
||||||
<!-- import the webpage's client-side javascript file -->
|
<!-- import the webpage's client-side javascript file -->
|
||||||
<script src="/main.js" type="module"></script>
|
<script src="/main.js" type="module"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h6>
|
<!-- Image and text -->
|
||||||
local
|
<nav class="navbar navbar-light bg-light">
|
||||||
</h6>
|
<a class="navbar-brand" href="#">
|
||||||
<video id="localVideo" autoplay></video>
|
<img src="/docs/4.5/assets/brand/bootstrap-solid.svg" width="30" height="30" class="d-inline-block align-top" alt="" loading="lazy">
|
||||||
<h6>
|
Yet Another Simple WebRTC Video Chat
|
||||||
remote
|
</a>
|
||||||
</h6>
|
</nav>
|
||||||
<video id="remoteVideo" autoplay></video>
|
<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" />
|
<input type="text" id="connect-to-peer" />
|
||||||
<button onclick="connectToPeer()">
|
<button onclick="connectToPeer()">
|
||||||
Connect
|
Connect
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue