Grammalecte  Check-in [fc3cf1b18f]

Overview
Comment:[fx] panel ui update
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | fx | webext2
Files: files | file ages | folders
SHA3-256: fc3cf1b18f2dd61a130bea510c72f159b48814e89a415c741e167c7ec0767a95
User & Date: olr on 2017-08-26 18:54:44
Other Links: branch diff | manifest | tags
Context
2017-08-27
05:06
[fx] main panel ui update (add font-awesome) check-in: 6f222d4ea6 user: olr tags: fx, webext2
2017-08-26
18:54
[fx] panel ui update check-in: fc3cf1b18f user: olr tags: fx, webext2
10:33
[fx] remove log check-in: 47f63e5dc0 user: olr tags: fx, webext2
Changes

Added gc_lang/fr/webext/img/Algoo_logo.png version [59954b3904].

cannot compute difference between binary files

Added gc_lang/fr/webext/img/LaMouette.png version [6e35d5964a].

cannot compute difference between binary files

Added gc_lang/fr/webext/img/logo120_text.png version [c438dd0680].

cannot compute difference between binary files

Modified gc_lang/fr/webext/manifest.json from [d8a35b958c] to [a10d68e392].

23
24
25
26
27
28
29
30

31
32
33
34
35
36
37
23
24
25
26
27
28
29

30
31
32
33
34
35
36
37







-
+







             "80": "img/logo-80.png",
             "96": "img/logo-96.png" },

  "browser_action": {
    "default_icon": "img/logo-32.png",
    "default_popup": "panel/main.html",
    "default_title": "Grammalecte [fr]",
    "browser_style": true
    "browser_style": false
  },
  "background": {
    "scripts": [
      "background.js"
    ]
  },
  "content_scripts": [

Modified gc_lang/fr/webext/panel/main.css from [5188cbbc0c] to [d2f84b0dba].

49
50
51
52
53
54
55
56

57
58
59
60
61
62
63
49
50
51
52
53
54
55

56
57
58
59
60
61
62
63







-
+







.blue:hover {   background-color: hsl(210, 60%, 40%); color: hsl(210, 10%, 96%); }


/* links */

a:link, a:visited {
    color: hsl(210, 70%, 40%);
    /*text-decoration: none;*/
    text-decoration: none;
}
a:hover, a:active {
    text-shadow: 0 0 2px hsl(210, 80%, 60%);
}

a.extlink:hover:after {
    content: " >";
81
82
83
84
85
86
87

88
89
90
91
92
93
94
95
96

97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117

118
119
120
121
122
123
124
125
126
127
128
129
130
131
132




133
134

















135


136




137
138
139

140





141
142
143

144





145
146
147
























148
149
150
151
152
153
154
155
156



157
158
159

160

161
162
163
164




165
166
167
168
169
170
171
172
173
174
175
176
177


178
179
180
181
182
183
184
81
82
83
84
85
86
87
88
89
90
91
92
93


94

95



96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115

116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151

152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211

212

213
214
215
216
217
218
219

220
221
222


223
224
225
226
227
228
229
230
231
232

233
234
235
236


237
238
239
240
241
242
243
244
245







+





-
-

-
+
-
-
-


















+

-













+
+
+
+


+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
+

+
+
+
+



+

+
+
+
+
+



+

+
+
+
+
+



+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+






-

-
+
+
+



+
-
+


-
-
+
+
+
+






-




-
-
+
+







    When going over this limit, a scrollbar appears which destructs the
    horizontal balance of elements.
    --> vertical scrolling is done with overflow in #page.
        #page must have the same height than body.
*/

#main {
    display: flex;
    background-color: hsl(210, 0%, 100%);
    min-height: 100%;
}

#menu {
    position: fixed;
    left: 5px;
    width: 50px;
    border-left: solid 2px hsl(210, 0%, 70%);
    border-right: solid 1px hsl(210, 0%, 70%);
    border-bottom: solid 2px hsl(210, 0%, 70%);
    border-right: solid 2px hsl(210, 0%, 70%);
    border-radius: 0 0 5px 5px;
    background-color: hsl(210, 10%, 96%);
    color: hsl(210, 10%, 96%);
}
#logo {
    padding: 10px;
}
#menu li {
    padding: 10px 5px;
    border-bottom: 1px solid hsl(210, 10%, 90%);
    text-align: center;
    cursor: pointer;
    color: hsl(210, 10%, 50%);
    list-style-type: none;
}
#menu li:hover {
    background-color: hsl(210, 10%, 92%);
}


#page {
    padding-left: 60px;
    background-color: hsl(210, 0%, 100%);
    height: 500px;
    overflow: auto;
}
#page h1 {
    margin: 0 0 10px 0;
    color: hsl(210, 70%, 70%);
    font: bold 30px 'Yanone Kaffeesatz', "Liberation Sans Narrow", sans-serif;
}
#page p {
    margin: 10px 0 5px 0;
}


/*
    Home
*/
#home_page {
    display: block;
    background-color: hsl(210, 20%, 92%);
    min-height: 100%;
}
#home_page p {
    margin: 0;
}
#home_page #mainlogo {
    padding: 5px 20px 20px 20px;
    background-color: hsl(210, 20%, 96%);
}
#home_page .notice {
    margin-top: 5px;
    font-size: 12px;
    font-variant-caps: small-caps;
    color: hsl(210, 20%, 50%);
}
#home_page #thanks {
    padding: 20px;
    padding: 20px 0 0 0;
    border-top: 1px solid hsl(210, 20%, 88%);
}

/*
    Help
*/
#help_page {
    display: none;
    padding: 20px;
    background-color: hsl(0, 50%, 90%);
}


/*
    Grammar checking options
*/
#gc_options_page {
    display: none;
    padding: 20px;
    background-color: hsl(0, 50%, 90%);
}


/*
    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%);
}
.dict_section {
    padding: 5px 5px 5px 10px;
    margin-top: 10px;
    border-radius: 5px;
    background-color: hsl(210, 20%, 96%);
}
.dict_section label {
    font-size: 16px;
    line-height: 20px;
    color: hsl(210, 20%, 50%);
    font-weight: bold;
}
.dict_description {
    padding: 0 0 0 20px;
    color: hsl(0, 0%, 0%);
    font-size: 12px;
}


/*
  Test page
*/

#test_page {
  display: none;
    display: none;
    background-color: hsl(210, 20%, 96%);
    min-height: 100%;
}
#test_cmd {
    padding: 15px;
    background-color: hsl(210, 20%, 92%);
    border-bottom: 1px solid hsl(0, 0%, 90%);
    border-bottom: 1px solid hsl(210, 20%, 90%);
}
#test_cmd textarea {
    width: 100%;
    border: 2px solid hsl(0, 0%, 89%);
    width: 95%;
    padding: 5px;
    border: 2px solid hsl(210, 20%, 80%);
    background-color: hsl(210, 20%, 98%);
    border-radius: 3px;
    resize: vertical;
}

#tests_result {
    padding: 15px;
    background-color: hsl(0, 0%, 96%);
}

#test_page .button {
    display: inline-block;
    padding: 5px 10px;
    width: 120px;
    padding: 5px;
    width: 100px;
    border-radius: 3px;
    font-size: 12px;
    text-align: center;
    cursor: pointer;
}


Modified gc_lang/fr/webext/panel/main.html from [e187ec365b] to [2096277c27].

18
19
20
21
22
23
24
25

26
27
28
29


30
31
32
33
34
35
36
37








38
39
40



41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60



















61
62
63
64
65
66
67
68
69
70
71
72

73
74
75
76
77
78
79
80

81
82
83
84
85

86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103

104
105
106
107
108
109
110
111
112
113

114
115
116
117
118
119
120
121
122
123
18
19
20
21
22
23
24

25
26
27
28
29
30
31








32
33
34
35
36
37
38
39



40
41
42
43



















44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73

74
75
76
77
78
79
80
81

82
83
84
85
86

87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104

105
106
107
108
109
110
111
112
113
114

115
116
117
118
119
120
121
122
123
124
125







-
+




+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
-
+
+
+

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+











-
+







-
+




-
+

















-
+









-
+










            <li class="select" data-page="home_page"><i class="fa fa-home icon"></i> 1.</li>
            <li class="select" data-page="help_page"><i class="fa fa-coffee icon"></i> Help</li>
            <li class="select" data-page="gc_options_page"><i class="fa fa-coffee icon"></i> OP1</li>
            <li class="select" data-page="sc_options_page"><i class="fa fa-keyboard-o icon"></i> OP2</li>
            <li class="select" data-page="test_page"><i class="fa fa-keyboard-o icon"></i> TST</li>
          </ul>
        </nav>
      </header> <!-- #left -->
      </header> <!-- #menu -->

      <div id="page">

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

          <div id="mainlogo">
          <p class="center"><img src="../img/logo120_text.png" alt="Grammalecte"></p>
          <p class="underline center">
            <b>Version ${version}</b>
          </p>
          <p class="underline center">
            <b>GPL 3 · <a id="website" class="simplelink" href="#" onclick="return false;">Site web</a></b>
          </p>
          <p id="links" class="center">
            <div class="center" style="width: 100%"><img src="../img/logo120_text.png" alt="Grammalecte"></div>
            <p class="underline center">
              Version ${version}
            </p>
            <p class="center">
              <a id="website" class="simplelink" href="#" onclick="return false;">Site web</a>
            </p>
            <p class="notice center">
            <a id="spelling" class="bluebutton" href="#" onclick="return false;">Options</a> ·
            <a id="conjugueur" class="redbutton" href="#" onclick="return false;">Conjugueur</a>
          </p>
              Grammalecte est un correcteur grammatical open&nbsp;source sous <a href="https://www.gnu.org/licenses/gpl.html">licence GPL 3</a>
            </p>
          </div>
          
          <footer id="thanks">
              <p class="center" data-l10n-id="thanks1">Grammalecte remercie</p>
              <p class="center">
                  <a id="mainsponsor" href="#" onclick="return false;">
                      <img src="../img/LaMouette.png" alt="La Mouette" style="border: 1px solid #C0C0C0" />
                  </a>
              </p>
              <p class="center">
                  <a id="mainsponsor2" href="#" onclick="return false;">
                      <img src="../img/Algoo_logo.png" alt="Algoo" style="border: 1px solid #C0C0C0" />
                  </a>
              </p>
              <p class="center">
                  <a id="othersponsors" class="link" href="https://www.dicollecte.org/#thanks" onclick="return false;">
                      <b>et tous ceux qui l’ont soutenu.</b>
                  </a>
              </p>
          </footer>
        </section>
          <div id="thanks">
            <p class="center" data-l10n-id="thanks1">Grammalecte remercie</p>
            <p class="center">
              <a id="mainsponsor" href="#" onclick="return false;">
                <img src="../img/LaMouette.png" alt="La Mouette" style="border: 1px solid #C0C0C0" />
              </a>
            </p>
            <p class="center">
              <a id="mainsponsor2" href="#" onclick="return false;">
                <img src="../img/Algoo_logo.png" alt="Algoo" style="border: 1px solid #C0C0C0" />
              </a>
            </p>
            <p class="center">
              <a id="othersponsors" class="link" href="https://www.dicollecte.org/#thanks" onclick="return false;">
                et tous ceux qui l’ont soutenu
              </a>
            </p>
          </div>
        </section> <!-- #home_page -->

        <section id="help_page" class="page">
          <h1>AIDE</h1>
          <div id="help_section">
            <p data-l10n-id="useContextMenu"></p>
            <p class="right"><img src="img/contextmenu.png" title="menu contextuel sur zone de texte" /></p>
            <p><b data-l10n-id="shortcuts"></b></p>
            <p><span class="key" data-l10n-id="keyTF"></span> &#10097; <span class="goto" data-l10n-id="keyLabelTF"></span></p>
            <p><span class="key" data-l10n-id="keyGC"></span> &#10097; <span class="goto" data-l10n-id="keyLabelGC"></span></p>
            <p><span class="key" data-l10n-id="keyCJ"></span> &#10097; <span class="goto" data-l10n-id="keyLabelCJ"></span></p>
          </div>
        </section>
        </section> <!-- #help_page -->

        <section id="gc_options_page" class="page">
          <h1>OPTIONS GRAMMATICALES</h1>
          <div id="grammar_options">
            ${optionsHTML}
          </div>
          <p class="center" style="margin: 10px 0;"><a id="default_options" href="#" onclick="return false;">Options par défaut</a></p>
        </section>
        </section> <!-- #gc_options_page -->

        <section id="sc_options_page" class="page">
          <h1>OPTIONS ORTHOGRAPHIQUES</h1>
          <div id="spelling_options">
            <p id="dictionaries_info" data-l10n-id="dictionaries_info"></p>
            <p id="dictionaries_info" data-l10n-id="dictionaries_info">*** non actif ***</p>
            <div class="dict_section" id="fr-FR-modern_box">
                <p><input type="checkbox" id="fr-FR-modern" /> <label for="fr-FR-modern">“Moderne”</label></p>
                <p class="dict_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="dict_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="dict_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>
            </div>
            <div class="dict_section" id="fr-FR-reform_box">
                <p><input type="checkbox" id="fr-FR-reform" /> <label for="fr-FR-reform">“Réforme 1990”</label></p>
                <p class="dict_description">Avec ce dictionnaire, seule l’orthographe réformée est reconnue. Attendu que bon nombre de graphies réformées sont considérées comme erronées par beaucoup, ce dictionnaire est déconseillé. Les graphies passées dans l’usage sont déjà incluses dans le dictionnaire “Moderne”.</p>
            </div>
            <div class="dict_section" id="fr-FR-classic-reform_box">
                <p><input type="checkbox" id="fr-FR-classic-reform" /> <label for="fr-FR-classic-reform">“Toutes variantes”</label></p>
                <p class="dict_description">Ce dictionnaire contient les variantes graphiques, classiques, réformées, ainsi que d’autres plus rares encore. Ce dictionnaire est déconseillé à ceux qui ne connaissent pas très bien la langue française.</p>
            </div>
          </div>
        </section>
        </section> <!-- #sc_options_page -->

        <section id="test_page" class="page">
          <div id="test_cmd">
            <h1>TESTS</h1>
            <div><a href="https://www.dicollecte.org/test.html" target="_blank">Page for tests</a></div>
            <textarea id="text_to_test" rows="10"></textarea>
            <div id="fulltests" class="button blue">Tests complets</div> <div id="text_to_test" class="button green fright">Analyser</div>
          </div>
          <pre id="tests_result"></pre>
        </section>
        </section> <!-- #test_page -->

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

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

    <script src="main.js"></script>
  </body>

</html>