Merge branch 'master' into format-improvements

client/src/lib/components/MonCompteProButton/MonCompteProButton.svelte

@@ -1,43 +1,22 @@
-<script lang="ts">
-  import franceConnect from "$lib/assets/france-connect.svg";
-</script>
-
-<div>
-  <button class="fr-mb-1w" aria-label="s'identifier avec MonComptePro" on:click>
-    <img class="padlock" alt="" src={franceConnect} />
-
-    <p class="fr-pl-1w">
-      S'identifier avec <br />
-      <span class="fr-text--bold">MonComptePro</span>
-    </p>
+<div class="fr-connect-group">
+  <button class="fr-connect" on:click>
+    <span class="fr-connect__login">S’identifier avec</span>
+    <span class="fr-connect__brand">FranceConnect</span>
   </button>
-
-  <a
-    class="fr-link fr-link--sm"
-    href="http://mon-compte-pro.beta.gouv.fr/"
-    target="_blank"
-  >
-    Qu'est-ce que MonComptePro ?</a
-  >
+  <p>
+    <a
+      href="http://mon-compte-pro.beta.gouv.fr/"
+      target="_blank"
+      rel="noopener"
+      title="Qu’est-ce que MonComptePro ? - nouvelle fenêtre"
+    >
+      Qu'est-ce que MonComptePro ?</a
+    >
+  </p>
 </div>
 
 <style>
-  button {
-    background-color: #006adc;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: 4px 8px;
-  }
-
-  button:hover {
-    background-color: #3e89da;
-  }
-
-  p {
-    margin: 0;
-    padding: 0;
-    color: white;
-    line-height: 1 !important;
+  .fr-connect:before {
+    background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2235%22%20height%3D%2236%22%20viewBox%3D%220%200%2035%2036%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url%28%23clip0_328_78339%29%22%3E%3Cpath%20d%3D%22M11.9341%2029.4951C11.9207%2029.0928%2012.001%2028.7038%2012.1752%2028.3417L17.1992%2018.3504C17.3465%2018.0553%2017.2662%2017.7334%2017.0518%2017.492C15.1628%2015.534%2014.7877%2012.4762%2016.6231%2010.1159C17.8422%208.54675%2019.9188%207.70185%2021.9552%207.86278C19.5571%209.17708%2017.9896%2011.6984%2018.137%2014.5282C18.2442%2016.5264%2019.1954%2018.2833%2020.6423%2019.5171C20.5887%2019.5574%2020.5217%2019.5976%2020.4815%2019.6781L18.6863%2023.2455C18.271%2023.5137%2016.891%2022.9504%2016.6767%2023.3796C16.4623%2023.8087%2017.7753%2024.4793%2017.8288%2024.9621C17.8422%2025.123%2017.6681%2025.4181%2017.5475%2025.5254C17.1992%2025.807%2015.9666%2025.5924%2015.7657%2025.9948C15.5647%2026.3971%2016.7035%2026.9872%2016.6901%2027.4298C16.6901%2027.7248%2016.5025%2027.9394%2016.248%2028.1003C15.8327%2028.3686%2014.9082%2028.0064%2014.6939%2028.4356C14.4795%2028.8648%2015.3504%2029.3342%2015.3905%2029.8036C15.4173%2030.0584%2015.1494%2030.5948%2014.9216%2030.7423C14.091%2031.2788%2012.5503%2031.8555%2012.5503%2031.8555C12.336%2031.9091%2011.9876%2031.1983%2012.001%2030.8899L11.9341%2029.5085V29.4951Z%22%20fill%3D%22%23C9191E%22%2F%3E%3Cpath%20d%3D%22M19.919%203.78575C20.0797%203.87963%2020.3209%203.8394%2020.4147%203.66505C21.3659%202.14958%2023.0807%201.2108%2024.8626%201.2108C27.7698%201.2108%2030.1277%203.55776%2030.1277%206.468C30.1277%207.64818%2029.7258%208.73449%2029.0693%209.61964C28.4798%2010.4243%2027.6492%2011.0412%2026.6846%2011.3899C26.1219%2011.6045%2025.5056%2011.7252%2024.8626%2011.7252C24.675%2011.7252%2024.5276%2011.8861%2024.5276%2012.0739C24.5276%2012.2616%2024.675%2012.4226%2024.8626%2012.4226C25.5726%2012.4226%2026.2291%2012.3019%2026.8454%2012.0739C27.3947%2011.8861%2027.8904%2011.6179%2028.3325%2011.296C28.5736%2011.1351%2028.788%2010.9473%2028.9889%2010.7462C29.1765%2010.5316%2029.3641%2010.317%2029.5516%2010.1024C30.3554%209.11001%2030.8244%207.83594%2030.8244%206.45459C30.8244%203.16883%2028.1583%200.5%2024.8492%200.5C22.8128%200.5%2020.8836%201.55949%2019.8118%203.28954C19.6912%203.45047%2019.7448%203.66505%2019.9056%203.78575H19.919Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M18.9676%2012.9859C19.4365%2010.5853%2021.4729%208.62723%2023.938%208.21148C25.7199%207.91644%2027.3811%208.38583%2028.6673%209.31121C28.0912%2010.0622%2027.3141%2010.6389%2026.4031%2010.9608C26.0682%2010.5719%2025.5993%2010.317%2025.0366%2010.317C24.0586%2010.317%2023.2548%2011.1083%2023.2548%2012.0739C23.2548%2013.0261%2024.0586%2013.8174%2025.0366%2013.8174C25.8404%2013.8174%2026.4969%2013.2943%2026.7246%2012.597C27.984%2012.208%2029.0826%2011.457%2029.8864%2010.4377C30.717%2011.4704%2031.2127%2012.7579%2031.2127%2014.1661C31.2127%2016.7544%2029.5515%2018.9807%2027.1936%2019.8256C26.9792%2019.9061%2026.8318%2020.0938%2026.8318%2020.3218V24.4793C26.5773%2024.9085%2025.0768%2024.9755%2025.0768%2025.4717C25.0768%2025.968%2026.5773%2026.035%2026.8318%2026.4642C26.9122%2026.6117%2026.8988%2026.9604%2026.8318%2027.1213C26.6443%2027.5371%2025.4251%2027.8723%2025.4251%2028.3417C25.4251%2028.7977%2026.7246%2028.8782%2026.9256%2029.2939C27.0596%2029.5756%2026.9926%2029.8572%2026.8318%2030.112C26.5773%2030.5412%2025.5725%2030.6082%2025.5725%2031.1044C25.5725%2031.6007%2026.5773%2031.6677%2026.8318%2032.0969C26.9658%2032.3383%2026.9658%2032.9552%2026.8318%2033.1832C26.3227%2034.0415%2025.184%2035.2619%2025.184%2035.2619C25.0098%2035.4095%2024.3801%2034.873%2024.2462%2034.5914L23.5495%2033.3173C23.3485%2032.9552%2023.2414%2032.5395%2023.2414%2032.1237V20.523C23.2414%2020.1877%2023.027%2019.9061%2022.7189%2019.7854C20.1064%2018.7527%2018.3782%2016.0436%2018.9676%2013.0127V12.9859Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M13.7027%206.69596C15.5917%205.12685%2018.4051%204.91227%2020.5754%206.17292C21.3525%206.6289%2021.4597%206.60208%2021.9554%207.25923C19.6778%206.37409%2017.5343%207.56769%2015.8998%209.56596C13.984%2011.8995%2014.2117%2015.2791%2016.3285%2017.3713C16.1276%2017.3177%2015.9132%2017.2774%2015.7122%2017.2104C15.4979%2017.1299%2015.2701%2017.1835%2015.1228%2017.3579L12.4835%2020.5632C12.0146%2020.7375%2010.8088%2019.8256%2010.5007%2020.2145C10.1926%2020.6034%2011.3045%2021.6092%2011.2242%2022.0921C11.1974%2022.253%2010.9562%2022.5212%2010.8088%2022.5883C10.3935%2022.7894%209.24136%2022.2798%208.94662%2022.6285C8.65188%2022.9772%209.61648%2023.8623%209.49591%2024.3183C9.41553%2024.6134%209.18777%2024.7877%208.90643%2024.895C8.43753%2025.0693%207.62029%2024.4792%207.31216%2024.8548C7.00402%2025.2303%207.72747%2025.9277%207.64709%2026.4239C7.6069%2026.6921%207.20498%2027.1749%206.95043%2027.2688C6.01262%2027.6175%204.36476%2027.8321%204.36476%2027.8321C4.137%2027.8321%203.98963%2027.0274%204.07002%2026.7189L4.33796%2025.2973C4.41835%2024.8816%204.59251%2024.5061%204.86046%2024.1842L12.2156%2015.2255C12.4299%2014.9707%2012.4433%2014.6086%2012.2825%2014.3135C10.916%2011.8593%2011.3045%208.66741%2013.6759%206.69596H13.7027Z%22%20fill%3D%22%230071BC%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_328_78339%22%3E%3Crect%20width%3D%2235%22%20height%3D%2235%22%20fill%3D%22white%22%20transform%3D%22translate%280%200.5%29%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E) !important;
   }
 </style>

client/src/lib/components/OrganizationCard/OrganizationCard.svelte

@@ -4,7 +4,7 @@
   export let status: "catalog" | "registered" | "pending";
 </script>
 
-<div class="fr-card">
+<div class="fr-card fr-card--sm ">
   <div class="fr-card__body">
     <div class="fr-card__content">
       <h3 class="fr-card__title">
@@ -18,7 +18,7 @@
             {:else if status == "registered"}
               <p class="fr-badge fr-badge--info">Enregistré</p>
             {:else if status == "pending"}
-              <p class="fr-badge fr-badge--new">En cours</p>
+              <p class="fr-badge fr-badge--new">Organisation enregistrée</p>
             {/if}
           </li>
         </ul>
@@ -34,10 +34,8 @@
 
 <style>
   .card-image {
-    display: flex;
-    justify-content: center;
-    max-width: 20rem;
-    margin: 0 auto;
-    object-fit: cover;
+    width: 100%;
+    height: auto;
+    object-fit: contain;
   }
 </style>