small fixes

3 years ago · c9ebed81c6
3 changed files with 39 additions and 40 deletions
--- a/public/index.html
+++ b/public/index.html
@ -5,10 +5,7 @@
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
+    <meta name="description" content="Let's swing Chat!" />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
@ -23,8 +20,5 @@
    -->
    <title>Let's swing chat</title>
  </head>
-  <body style="margin: 0">
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-  </body>
+  <body style="margin: 0"></body>
 </html>
--- a/src/Galleria.js
+++ b/src/Galleria.js
@ -9,6 +9,7 @@ import IconButton from "@mui/material/IconButton";
 import { Stack } from "@mui/system";
 import logoSrc from "./logo_chat.svg";
 import { Fade, LinearProgress } from "@mui/material";
+import { VideoComponent } from "./Proiezione";

 export const Galleria = () => {
  const { evento } = useParams();
@ -66,6 +67,7 @@ export const Galleria = () => {
          style={{ position: "absolute", width: "100vw", top: "50%" }}
        />
      )}
+      {imgIndex === images.length && (
        <div
          style={{
            margin: "0 auto",
@ -81,9 +83,8 @@ export const Galleria = () => {
            textAlign: "center",
          }}
        >
-        {imgIndex === images.length && (
+          <VideoComponent />
          <ContenitoreMessaggio messaggi={messages} />
-        )}

          <img
            src={logoSrc}
@ -96,6 +97,7 @@ export const Galleria = () => {
            }}
          />
        </div>
+      )}
    </div>
  );
 };
@ -105,7 +107,7 @@ const ContenitoreMessaggio = ({ messaggi }) => {
  const messaggioDaMostrare = messaggi[indiceCorrente];
  console.log(indiceCorrente);
  return (
-    <Stack>
+    <Stack sx={{ zIndex: 1 }}>
      <div>
        {messaggioDaMostrare && (
          <ImagePlaceholder
@ -183,7 +185,7 @@ function ImagePlaceholder({ messaggioDaMostrare }) {
            src={messaggioDaMostrare.immagineURL}
            style={{
              maxWidth: "100%",
-              maxHeight: "80vh",
+              maxHeight: "65vh",
            }}
          />
        )}
@ -221,7 +223,10 @@ const Messaggio = ({ messaggioDaMostrare }) => {
        </p>
      )}
      <p style={{ fontFamily: "sans-serif", fontSize: ".8rem", color: "#333" }}>
-        {date.toLocaleString("it-IT")}
+        {date.toLocaleString("it-IT", {
+          timeStyle: "short",
+          dateStyle: "short",
+        })}
      </p>
    </>
  );
--- a/src/Proiezione.js
+++ b/src/Proiezione.js
@ -184,7 +184,7 @@ const Messaggio = ({ messaggiApprovati }) => {
  );
 };

-const VideoComponent = React.memo(() => {
+export const VideoComponent = React.memo(() => {
  return (
    <video autoPlay muted loop id="myVideo">
      <source src={videoSrc} type="video/mp4" />