kmelve

#progresswrapper {
	position: fixed;
	top: 0px;
	height: 2px;
	width: 100%;
	z-index: 1000; 
}
#progressbar {
	top: 0;
	position: fixed;

stereokai

.rounded-corners-gradient-borders {
  width: 300px;
  height: 80px;
  border: double 4px transparent;
  border-radius: 80px;
  background-image: linear-gradient(white, white), radial-gradient(circle at top left, #f00,#3020ff);
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

atomkirk

<video id="player" autoplay muted playsinline> </video>
<button id="capture">Capture</button>
<canvas id="canvas" width=320 height=240></canvas>
<script>
  const player = document.getElementById('player');
  const canvas = document.getElementById('canvas');
  const context = canvas.getContext('2d');
  const captureButton = document.getElementById('capture');

  const constraints = {