Grammalecte  Check-in [3571664e26]

/*
    Spell checking options
*/
#sc_options_page {
    display: none;
    padding: 20px;
}
.dictionaries_info {
    margin: 10px 0;
    padding: 10px;
    border-radius: 3px;
    background-color: hsl(0, 50%, 40%);
    color: hsl(0, 10%, 96%);
}
#sc_options_page h2 {
    margin-top: 20px;
    font: normal 22px 'Yanone Kaffeesatz', "Oswald", "Liberation Sans Narrow", sans-serif;
    color: hsl(210, 50%, 50%);
}

/*
    Options
*/
.option_section {
    padding: 10px;
    margin-top: 10px;

    width: 100px;
    border-radius: 3px;
    font-size: 12px;
    text-align: center;
    cursor: pointer;
}


#info_page {
    display: none;
    padding: 20px;
}
#info_page h2 {
    margin-top: 20px;
    font: bold 18px "Trebuchet MS", "Fira Sans", "Liberation Sans", sans-serif;
    color: hsl(210, 50%, 50%);
}
#info_page h3 {
    margin-top: 20px;
    font: bold 16px "Trebuchet MS", "Fira Sans", "Liberation Sans", sans-serif;
    color: hsl(210, 20%, 50%);
}
#info_page p {
    font-size: 14px;
}


/*
    CSS Spinner
    Double bounce
    http://tobiasahlin.com/spinkit/
*/
.spinner {

              <p class="select" data-page="ui_options_page"><i class="select select_icon fa fa-cube" data-page="ui_options_page"></i></p>
              <p class="select select_label" data-page="ui_options_page">Interface</p>
            </div>
            <div class="select select_block" data-page="gc_options_page">
              <p class="select" data-page="gc_options_page"><i class="select select_icon fa fa-cog" data-page="gc_options_page"></i></p>
              <p class="select select_label" data-page="gc_options_page">Grammaire</p>
            </div>
            <div class="select select_block" data-page="sc_options_page">
              <p class="select" data-page="sc_options_page"><i class="select select_icon fa fa-book" data-page="sc_options_page"></i></p>
              <p class="select select_label" data-page="sc_options_page">Dictionnaires</p>
            </div>
            <div class="select select_block" data-page="info_page">
              <p class="select" data-page="info_page"><i class="select select_icon fa fa-info-circle" data-page="info_page"></i></p>
              <p class="select select_label" data-page="info_page">Informations</p>
            </div>
            <div class="select select_block" data-page="test_page">
              <p class="select" data-page="test_page"><i class="select select_icon fa fa-flask" data-page="test_page"></i></p>
              <p class="select select_label" data-page="test_page">Zone de test</p>
            </div>
          </ul>
        </nav>
      </header> <!-- #menu -->

      <div id="page">

        <section id="home_page" class="page">

          <div id="mainlogo">
            <div class="center"><img src="../img/logo150_text.png" alt="Grammalecte"></div>
            <p class="underline center">
              Version ${version}
            </p>
            <p id="link_website" class="link center" data-url="http://grammalecte.net/?from=grammalecte-fx">Site web</p>
            <div class="notice center">

              <div id="conj_button">Conjugueur</div>
            </div>
          </div>
          
          <div id="thanks">
            <p class="center">Grammalecte remercie</p>
            <p class="center"><img id="link_sponsor1" class="link border" src="../img/LaMouette.png" alt="La Mouette" data-url="http://www.lamouette.org/?from=grammalecte-fx" /></p>
            <p class="center"><img id="link_sponsor2" class="link border" src="../img/Algoo_logo.png" alt="Algoo" data-url="https://www.algoo.fr/?from=grammalecte-fx" /></p>
            <p id="link_othersponsors" class="link center" data-url="http://grammalecte.net/?thanks">
              et tous ceux qui l’ont soutenu
            </p>
          </div>
        </section> <!-- #home_page -->

          <h1>OPTIONS GRAMMATICALES</h1>
          <div id="grammar_options">
            ${webextOptionsHTML}
          </div>
          <div id="default_options_button" class="button blue center">Options par défaut</div>
        </section> <!-- #gc_options_page -->

        <section id="sc_options_page" class="page">
          <h1>OPTIONS ORTHOGRAPHIQUES</h1>
          <div id="hunspell_options">
            <h2>DICTIONNAIRES DE GRAMMALECTE</h2>
            <p class="dictionaries_info">Les dictionnaires de Grammalecte ne sont utilisées que lors de l’analyse grammaticale.</p>
            <div class="option_section" id="personal_dic_box">
                <p><input type="checkbox" id="personal_dic" data-dictionary="personal" /> <label for="personal_dic">Utiliser le dictionnaire personnel</label></p>
                <p class="option_description">Ce dictionnaire est créé et édité via l’éditeur lexical.</p>
            </div>
          </div>

          <div id="hunspell_options" style="opacity: .25">
            <h2>DICTIONNAIRES HUNSPELL (FIREFOX)</h2>
            <p class="dictionaries_info">Les dictionnaires Hunspell ne sont utilisées que pour la correction orthographique proposée par Firefox (soulignement rouge).<br/><br/>Section inactive.<br/>Le système d’extension <i>WebExtension</i> ne propose pas encore d’interface de programmation pour le correcteur orthographique.</p>
            <div class="option_section" id="fr-FR-modern_box">
                <p><input type="checkbox" id="fr-FR-modern" /> <label for="fr-FR-modern">“Moderne”</label></p>
                <p class="option_description">Ce dictionnaire propose l’orthographe telle qu’elle est écrite aujourd’hui le plus couramment. C’est le dictionnaire recommandé si le français n’est pas votre langue maternelle ou si vous ne désirez qu’une seule graphie correcte par mot.</p>
            </div>
            <div class="option_section" id="fr-FR-classic_box">
                <p><input type="checkbox" id="fr-FR-classic" /> <label for="fr-FR-classic">“Classique” (recommandé)</label></p>
                <p class="option_description">Il s’agit du dictionnaire “Moderne”, avec des graphies classiques en sus, certaines encore communément utilisées, d’autres désuètes. C’est le dictionnaire recommandé si le français est votre langue maternelle.</p>

            <p>Section de contrôle pour le développement du logiciel…</p>
            <p id="link_testpage" class="link" data-url="https://www.dicollecte.org/test.html">Page de test</p>
            <textarea id="text_to_test" rows="10"></textarea>
            <div id="fulltests_button" class="button blue">Tests complets</div> <div id="text_to_test_button" class="button green fright">Analyser</div>
          </div>
          <pre id="tests_result"></pre>
        </section> <!-- #test_page -->

        <section id="info_page" class="page">
          <h1>INFORMATIONS</h1>

          <h2>Licence d’utilisation</h2>
          <p>Grammalecte est un correcteur grammatical <i>open&nbsp;source</i> sous <span id="link_gpl" class="link" data-url="https://www.gnu.org/licenses/gpl.html">licence GPL 3</span>.</p>

          <h2>Droits demandés sur Firefox</h2>
          <p>Grammalecte ne modifie aucune option de vos réglages de Firefox, ne vous espionne pas et ne communique aucune information de quelque sorte à quiconque, pas même à l’auteur du logiciel.</p>

          <h3>“Accéder à vos données pour tous les sites web”</h3>
          <p>Il est nécessaire de pouvoir lire ce que contient une page web pour proposer la correction grammaticale de celle-ci. Ceci ne se fait qu’à la demande de l’utilisateur.</p>

          <h3>“Télécharger des fichiers et consulter et modifier l’historique des téléchargements du navigateur”</h3>
          <p>Grammalecte requiert les droits de l’interface “downloads” pour pouvoir exporter votre dictionnaire personnel sur le disque dur (par une astuce de programmation).</p>
          <p>Mais l’extension ne télécharge rien et ne consulte ni ne modifie votre historique de téléchargement.</p>
        </section> <!-- #info_page -->

      </div> <!-- #page -->

    </div> <!-- #main -->

    <script src="../grammalecte/graphspell/helpers.js"></script>
    <script src="main.js"></script>
  </body>

</html>