v1.5.2/release

- notification timer
- auto rejoin
- mic permission overlay
- fullscreen support
- loading for call
- gif ui update
- netflix player listener update
- room migrate fix
- update player fix

app/src/index.css

@@ -44,6 +44,7 @@ body.visible .watch-party-fab {
 }
 body.visible .party-notification-container {
   display: block !important;
+  max-width: var(--party-width);
 }
 
 body.netflix.visible .AkiraPlayer, /* NETFLIX */
@@ -247,6 +248,7 @@ body.amazon .fyysciv.f1lobqlo.fk0j80b {
 }
 .party-create-container .brand-title {
   padding: 36px;
+  letter-spacing: 3.5px !important;
 }
 
 .party-create-container .create-input-card {
@@ -364,17 +366,11 @@ textarea::-webkit-scrollbar {
   margin-top: 18px;
 }
 .party-controls .MuiButton-startIcon {
-  margin-right: 0px !important;
+  margin-right: 8px !important;
 }
 .party-control-button-text {
   font-size: 10px !important;
-  display: none;
-}
-.party-controls button:hover .party-control-button-text {
-  display: initial;
-}
-.party-controls button:hover .MuiButton-startIcon {
-  margin-right: 8px !important;
+  transition: all ease-out 0.3s;
 }
 .party-controls-users-container {
   max-height: 100px;
@@ -417,8 +413,8 @@ textarea::-webkit-scrollbar {
   flex-direction: row;
 }
 .media-info-icon {
-  width: 48px !important;
-  height: 48px !important;
+  width: 2em !important;
+  height: 2em !important;
 }
 .media-info-right {
   flex: 1;
@@ -436,12 +432,14 @@ textarea::-webkit-scrollbar {
 
 .giphy-carousel::before {
   position: relative;
-  bottom: 40%;
+  bottom: 90px;
+  margin-left: 40px;
   content: url('./Giphy.png');
 }
 .giphy-carousel {
   margin-top: 1rem;
   min-height: fit-content;
+  padding-bottom: 3rem;
 }
 .giphy-carousel img {
   border-radius: 1rem;
@@ -456,14 +454,13 @@ textarea::-webkit-scrollbar {
 
 .giphy-carousel::-webkit-scrollbar {
   width: 5px;
-  height: 5px;
+  height: 12px;
 }
 .giphy-carousel::-webkit-scrollbar-track {
   background-color: rgb(90, 90, 90);
-  border-radius: 1rem;
 }
 .giphy-carousel::-webkit-scrollbar-thumb {
-  background-color: rgb(118, 182, 255);
+  background-color: #c0f300;
   border-radius: 13px;
 }
 .message-send svg {
@@ -482,6 +479,26 @@ textarea::-webkit-scrollbar {
   margin: 0 15px 15px 15px;
   border-radius: 26px;
 }
+.text-phone-panel .icon-button {
+  width: 15px !important;
+  height: 15px !important;
+  margin: 7.5px !important;
+}
+.text-phone-panel .gif-button.gif-close {
+  padding: 12px 0 !important;
+}
+.text-phone-panel .gif-button {
+  border-radius: 0 !important;
+  height: 1.75em !important;
+}
+.text-phone-panel .gif-button svg {
+  width: 1.75em !important;
+  height: 1.75em !important;
+}
+.text-phone-panel .gif-button.gif-close svg {
+  width: 0.75em !important;
+  height: 0.75em !important;
+}
 
 .MuiTooltip-popper {
   z-index: 99999 !important;
@@ -532,7 +549,7 @@ body.amazon-prime .notification-switch .MuiSwitch-thumb {
   text-transform: uppercase;
 }
 
-.mic-permission-overlay {
+#mic-permission-overlay {
   position: fixed;
   width: 100%;
   height: 100%;
@@ -543,4 +560,24 @@ body.amazon-prime .notification-switch .MuiSwitch-thumb {
   z-index: 9999;
   color: white;
   font-size: 95px;
+  backdrop-filter: blur(10px);
+}
+#mic-highlight {
+  width: 320px;
+  height: 124px;
+  box-shadow: 0px 0px 520px #c0f300;
+  left: 107px;
+  position: absolute;
+  border: 2px solid #c0f300;
+}
+#mic-text {
+  width: 100%;
+  text-align: center;
+  font-size: 15px;
+  font-family: sans-serif;
+  text-transform: uppercase;
+  font-weight: 300;
+  letter-spacing: 1.5px;
+  position: absolute;
+  top: 50%;
 }