Merge pull request #2 from mathieux51/dev

v1.0.2
mathieux51 · May 1, 2020 · a116c82 · a116c82
2 parents 7635d65 + 0ea043d
commit a116c82
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 5 deletions.
diff --git a/public/index.html b/public/index.html
@@ -49,11 +49,20 @@
     <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#005064" />
     <meta name="msapplication-TileColor" content="#005064" />
     <meta name="theme-color" content="#005064" />
+    <title>direct podcast</title>
     <meta
       name="description"
-      content="Je clique, je parle et lorsque j’ai terminé je clique une seconde fois pour arrêter mon enregistrement le fichier sonore se télécharge automatiquement."
+      content="Je clique, j'autorise l'accès à mon micro, je parle et lorsque j’ai terminé, je clique une seconde fois pour arrêter mon enregistrement. Le fichier sonore se télécharge automatiquement."
     />
-    <title>direct podcast</title>
+    <link rel="canonical" href="https://directpodcast.fr" />
+    <script type="application/ld+json">
+      {
+        "@context": "https://schema.org/",
+        "@type": "WebSite",
+        "name": "direct podcast",
+        "url": "https://directpodcast.fr"
+      }
+    </script>
   </head>
   <body>
     <noscript

diff --git a/src/components/Footer.js b/src/components/Footer.js
@@ -48,6 +48,10 @@ const BottomNote = styled.span`
   font-size: 15px;
 `
 
+const B = styled.b`
+  font-weight: normal;
+`
+
 const Footer = ({ className }) => {
   const buttonRef = React.createRef()
   const [isVisible, setIsVisible] = React.useState(false)
@@ -80,7 +84,9 @@ const Footer = ({ className }) => {
           <StyledMail />
         </a>
       </SubContainer>
-      <BottomNote>D’après une idée originale de Blandine Schmidt</BottomNote>
+      <BottomNote>
+        D’après une idée originale de <B>Blandine Schmidt</B>
+      </BottomNote>
     </Container>
   )
 }

diff --git a/src/components/Main.js b/src/components/Main.js
@@ -6,6 +6,7 @@ import MicOff from "./MicOff"
 import Timer from "./Timer"
 import Footer from "./Footer"
 import usePrevious from "../hooks/usePrevious"
+import elementInvisible from "../style/elementInvisible"
 
 const addZero = (str) => (str.length === 1 ? `0${str}` : str)
 
@@ -57,6 +58,14 @@ const StyledMicOff = styled(MicOff)`
   }
 `
 
+const H1 = styled.h1`
+  ${elementInvisible}
+`
+
+const H2 = styled.h2`
+  ${elementInvisible}
+`
+
 const handleStopRecording = ({ recorder, setRecorder, a }) => () => {
   const blob = recorder.getBlob()
   const url = window.URL.createObjectURL(blob)
@@ -187,6 +196,8 @@ function Main() {
 
   return (
     <Container>
+      <H1>direct podcast</H1>
+      <H2>Blandine Schmidt</H2>
       <Form onSubmit={handleSubmit}>
         <Button type="submit" aria-label="enregistrer">
           {isRecording ? <StyledMic /> : <StyledMicOff />}

diff --git a/src/components/Tooltip.js b/src/components/Tooltip.js
@@ -1,5 +1,6 @@
 import React from "react"
 import styled from "styled-components"
+import elementInvisible from "../style/elementInvisible"
 
 const Right = styled.span`
   width: 70vw;
@@ -24,8 +25,7 @@ const Container = styled.div`
   position: relative;
   text-align: left;
   & ${Right} {
-    visibility: ${(props) => (props.isVisible ? "visible" : "hidden")};
-    opacity: ${(props) => (props.isVisible ? 1 : 0)};
+    ${(props) => (props.isVisible ? "" : elementInvisible)};
   }
 `
 

diff --git a/src/style/elementInvisible.js b/src/style/elementInvisible.js
@@ -0,0 +1,12 @@
+import { css } from "styled-components"
+
+const elementInvisible = css`
+  position: absolute !important;
+  height: 1px;
+  width: 1px;
+  overflow: hidden;
+  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
+  clip: rect(1px, 1px, 1px, 1px);
+`
+
+export default elementInvisible