Grammalecte  Check-in [b6be32c3ca]

Overview
Comment:[fx] main panel: label to menu items
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk | fx
Files: files | file ages | folders
SHA3-256: b6be32c3caa7537c73262d4df3357a59412de463b7acb5cb48e085673a3178c4
User & Date: olr on 2018-03-02 23:23:33
Original Comment: [fr] main panel: label to menu items
Other Links: manifest | tags
Context
2018-03-02
23:36
[fx] main panel: fix label check-in: e78ddb114f user: olr tags: trunk, fx
23:23
[fx] main panel: label to menu items check-in: b6be32c3ca user: olr tags: trunk, fx
18:51
[fx] CSS: media print: hide grammalecte menu check-in: 2f3395cefd user: olr tags: trunk, fx
Changes

Modified gc_lang/fr/webext/panel/main.css from [6bbd4a3da0] to [7f70e2ba37].

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



126

127
128
129
130

131
132
133
134
135
136
137
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
126
127
128
129

130
131
132
133

134
135
136
137
138
139
140
141







-
+




-
+

















-
+






+

-
+
+





-


-
+




+
+
+
-
+



-
+










/* Main classes */

html {
    box-sizing: border-box;
    width: 400px;
    width: 450px;
    height: 500px;
    font-family: "Trebuchet MS", "Fira Sans", "Liberation Sans", sans-serif;
}
body {
    width: 400px;
    width: 450px;
    height: 500px;
}
/* 
    Maximal height of a panel in WebExtention seems to be 500px.
    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 {
    width: 50px;
    width: 100px;
    border-right: solid 1px hsl(210, 0%, 70%);
    background-color: hsl(210, 10%, 96%);
    color: hsl(210, 10%, 96%);
}
#logo {
    padding: 10px;
    text-align: center;
}
#menu li {
#menu .select_block {
    min-width: 100px;
    padding: 10px 0;
    border-bottom: 1px solid hsl(210, 10%, 90%);
    text-align: center;
    cursor: pointer;
    color: hsl(210, 10%, 50%);
    list-style-type: none;
    font-size: 20px;
}
#menu li:hover {
#menu .select_block:hover {
    background-color: hsl(210, 10%, 92%);
    color: hsl(210, 80%, 50%);
    text-shadow: 0px 0px 1px hsl(210, 100%, 70%);
}
.select_label {
    font-size: 12px;
    font-variant-caps: small-caps;

}

#page {
    background-color: hsl(210, 0%, 100%);
    min-width: calc(100% - 51px);
    min-width: calc(100% - 101px);
    height: 500px;
    overflow: auto;
}
#page h1 {
    margin: 0 0 10px 0;
    color: hsl(210, 50%, 50%);
    font: bold 30px 'Yanone Kaffeesatz', "Oswald", "Liberation Sans Narrow", sans-serif;

Modified gc_lang/fr/webext/panel/main.html from [8d14026cb9] to [7538b33473].

12
13
14
15
16
17
18

19
20
21
22
23



















24
25
26
27
28
29
30
12
13
14
15
16
17
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







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








      <header id="menu">
        <nav>
          <header id="logo">
            <img src="../img/logo-32.png">
          </header>
          <ul>
            <div class="select select_block" data-page="home_page">
            <li class="select" data-page="home_page"><i class="select fa fa-star icon" data-page="home_page" title="Accueil"></i></li>
            <li class="select" data-page="ui_options_page"><i class="select fa fa-cube icon" data-page="ui_options_page" title="Options d’interface"></i></li>
            <li class="select" data-page="gc_options_page"><i class="select fa fa-cog icon" data-page="gc_options_page" title="Options grammaticales"></i></li>
            <li class="select" data-page="sc_options_page"><i class="select fa fa-book icon" data-page="sc_options_page" title="Options orthographiques"></i></li>
            <li class="select" data-page="test_page"><i class="select fa fa-flask icon" data-page="test_page" title="Tests"></i></li>
              <p class="select" data-page="home_page"><i class="select select_icon fa fa-star" data-page="home_page"></i></p>
              <p class="select select_label" data-page="home_page">Accueil</p>
            </div>
            <div class="select select_block" data-page="ui_options_page">
              <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="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 tests</p>
            </div>
          </ul>
        </nav>
      </header> <!-- #menu -->

      <div id="page">

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