circodata.svelte

<script lang="ts">
  import { session } from "$app/stores"
  import OpenGraph from "$lib/components/transverse_pages/OpenGraph.svelte"
</script>

<svelte:head>
  <title>LexImpact recrute ! | {$session.title}</title>
</svelte:head>
<OpenGraph
  description="Les données publiques agrégées par circonscription."
  image="open-graph-image-circodata.png"
  title="LexImpact - CircoData"
  titleSuffix={null}
  url="circodata"
/>

<main class="lg:flex justify-center">
  <div class="bg-white p-8 lg:p-10  lg:w-1/2 2xl:w-1/3 shadow-lg z-20">
    <h1 class="text-center font-serif font-bold  leading-none">
      <span class="text-black text-3xl">CircoData</span>
      <br />
      <span class="text-gray-700 font-light italic text-lg pb-5"
        >Des données publiques agrégées par circonscription</span
      >
    </h1>
    <div class="flex gap-8 pb-6 border-b">
      <p class="w-2/3 leading-normal pt-6 text-lg text-gray-700 ">
        LexImpact agrège par circonscription des données publiques et ouvertes,
        et les restitue sous forme de PDF composés de cartes et de tableaux.
      </p>
      <p class=" w-1/3 leading-normal pt-6 text-lg text-black font-bold ">
        Cliquez sur la carte pour télécharger le PDF de la circo.<span
          class="hidden lg:flex">👉</span
        ><span class="flex lg:hidden">👇</span>
      </p>
    </div>
    <div class="hidden lg:block mt-2">
      <h2 class="pb-3 pt-5 text-lg text-gray-700 font-bold">
        Quelles circonscriptions sont disponibles ?
      </h2>
      <p class="leading-normal  text-base ">
        <span class="font-bold">Presque toutes !</span><br />Le traitement de la
        donnée effectué par le service LexImpact est identique pour toutes les
        circonscrpitions. En revanche, la disponibilité des données n'est pas
        uniforme sur tout le territoire français. <br />Par conséquent, les PDF
        CircoData des circonscriptions :
      </p>
      <ul class="list-inside list-disc pb-3">
        <li class="leading-normal">
          des départements d'outre-mer, proposent moins de données&nbsp;;
        </li>
        <li class="leading-normal">
          des collectivités d'outre-mer et des français de l'étranger, sont
          indisponibles.
        </li>
      </ul>

      <h2 class="pb-3 pt-5 text-lg text-gray-700 font-bold">
        Quelles thématiques sont concernées ?
      </h2>
      <div class="flex gap-8">
        <div>
          <p class="italic">Déja disponibles :</p>
          <ul class="list-inside list-disc">
            <li class="leading-normal">Population</li>
            <li class="leading-normal">Entreprises</li>
            <li class="leading-normal">Santé</li>
            <li class="leading-normal">Logement</li>
          </ul>
        </div>