From dd61e5386f58ca18f0dab35f98449370c06fd0c3 Mon Sep 17 00:00:00 2001 From: ian ramzy Date: Sat, 28 Mar 2020 12:36:59 -0400 Subject: [PATCH] add logo to top right --- public/chat.html | 5 +++++ public/css/chat.css | 48 +++++++++++++++++++++++++++++++++++++++++++-- public/js/chat.js | 7 ++----- 3 files changed, 53 insertions(+), 7 deletions(-) diff --git a/public/chat.html b/public/chat.html index edf5c8e..5049ec6 100644 --- a/public/chat.html +++ b/public/chat.html @@ -28,6 +28,11 @@ + +

Waiting for peer to connect...

diff --git a/public/css/chat.css b/public/css/chat.css index b4700f4..72bbe87 100644 --- a/public/css/chat.css +++ b/public/css/chat.css @@ -1,9 +1,27 @@ @import url("https://fonts.googleapis.com/css?family=Fira+Sans:600|Heebo:400,500,700&display=swap"); + +/*Fade in page on load*/ +@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } } +@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } } +@keyframes fadeIn { from { opacity:0; } to { opacity:1; } } +/*Fade in page on load*/ + + body { background: #16171B; margin: 0; padding: 0; + opacity:0; /* make things invisible upon start */ + -webkit-animation:fadeIn ease-in 1; + -moz-animation:fadeIn ease-in 1; + animation:fadeIn ease-in 1; + -webkit-animation-fill-mode:forwards; + -moz-animation-fill-mode:forwards; + animation-fill-mode:forwards; + -webkit-animation-duration:0.3s; + -moz-animation-duration:0.3s; + animation-duration:0.3s; } @@ -11,6 +29,27 @@ video { background: #16171a; } +#header { + position: absolute; + color: white; + font-family: "Fira Sans", sans-serif; + font-weight: 600; + white-space: nowrap; + top: 40px; + left: 80px; + margin-left: 30px; + margin-top: 30px; + -ms-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + float: left; +} + +#header p, img { + float: left; + padding: 7px; +} + + #moveable { z-index: 100; right: 14px; @@ -35,7 +74,6 @@ video { background: rgba(0, 0, 0, 0.38); padding: 10px; transition: 0.5s; - } #local-video { @@ -136,4 +174,10 @@ button:hover { margin: 0 auto; } -/*Neomorphic buttons*/ \ No newline at end of file +/*Neomorphic buttons*/ + + + + + + diff --git a/public/js/chat.js b/public/js/chat.js index 15e2dfd..b6ca6ad 100644 --- a/public/js/chat.js +++ b/public/js/chat.js @@ -420,11 +420,8 @@ function switchStreamHelper(stream) { } -// auto get media -VideoChat.requestMediaStream(); - - $("#moveable").draggable({containment: 'window'}); -setInterval(() => console.log(VideoChat.remoteVideo.srcObject), 2000); \ No newline at end of file +// auto get media +VideoChat.requestMediaStream();