Separating theme from layout for CSS files.
Change-Id: I4c3cec28b30de8026df4298f65ebf6ad92faf68f (cherry picked from commit 11f662f6)
Showing
47 changed files
with
1335 additions
and
834 deletions
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Dialog Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light .dialog h2 { | ||
22 | + color: black; | ||
23 | +} | ||
24 | +.dark .dialog h2 { | ||
25 | + color: #ddd; | ||
26 | +} | ||
27 | + | ||
28 | +.dialog .dialog-button { | ||
29 | + /* color works for both light and dark themes */ | ||
30 | + background-color: #c55; | ||
31 | + color: white; | ||
32 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Dialog Service -- CSS file | 18 | + ONOS GUI -- Dialog Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | .dialog h2 { | 21 | .dialog h2 { |
... | @@ -26,12 +26,6 @@ | ... | @@ -26,12 +26,6 @@ |
26 | width: 210px; | 26 | width: 210px; |
27 | vertical-align: middle; | 27 | vertical-align: middle; |
28 | } | 28 | } |
29 | -.light .dialog h2 { | ||
30 | - color: black; | ||
31 | -} | ||
32 | -.dark .dialog h2 { | ||
33 | - color: #ddd; | ||
34 | -} | ||
35 | 29 | ||
36 | .dialog .dialog-button { | 30 | .dialog .dialog-button { |
37 | border-radius: 3px; | 31 | border-radius: 3px; |
... | @@ -41,8 +35,4 @@ | ... | @@ -41,8 +35,4 @@ |
41 | padding: 6px 8px 2px 8px; | 35 | padding: 6px 8px 2px 8px; |
42 | margin: 4px; | 36 | margin: 4px; |
43 | float: right; | 37 | float: right; |
44 | - /* color works for both light and dark themes */ | ||
45 | - background-color: #c55; | ||
46 | - color: white; | ||
47 | } | 38 | } |
48 | - | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Flash Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #flash svg g.flashItem rect { | ||
22 | + fill: #ccc; | ||
23 | +} | ||
24 | +.dark #flash svg g.flashItem rect { | ||
25 | + fill: #555; | ||
26 | +} | ||
27 | + | ||
28 | +.light #flash svg g.flashItem text { | ||
29 | + fill: #333; | ||
30 | +} | ||
31 | +.dark #flash svg g.flashItem text { | ||
32 | + fill: #999; | ||
33 | +} | ||
34 | + | ||
35 | +.light .centered { | ||
36 | + box-shadow: 2px 2px 24px 5px #888; | ||
37 | + background-color: #eee; | ||
38 | +} | ||
39 | +/* TODO: confirm / fix dark*/ | ||
40 | +.dark .centered { | ||
41 | + box-shadow: 2px 2px 24px 5px #888; | ||
42 | + background-color: #eee; | ||
43 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Flash Service -- CSS file | 18 | + ONOS GUI -- Flash Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #flash { | 21 | #flash { |
... | @@ -28,22 +28,20 @@ | ... | @@ -28,22 +28,20 @@ |
28 | opacity: 0.8; | 28 | opacity: 0.8; |
29 | } | 29 | } |
30 | 30 | ||
31 | -.light #flash svg g.flashItem rect { | ||
32 | - fill: #ccc; | ||
33 | -} | ||
34 | -.dark #flash svg g.flashItem rect { | ||
35 | - fill: #555; | ||
36 | -} | ||
37 | - | ||
38 | #flash svg g.flashItem text { | 31 | #flash svg g.flashItem text { |
39 | stroke: none; | 32 | stroke: none; |
40 | text-anchor: middle; | 33 | text-anchor: middle; |
41 | alignment-baseline: middle; | 34 | alignment-baseline: middle; |
42 | font-size: 16pt; | 35 | font-size: 16pt; |
43 | } | 36 | } |
44 | -.light #flash svg g.flashItem text { | 37 | + |
45 | - fill: #333; | 38 | +/* Used for temp div */ |
46 | -} | 39 | +.centered { |
47 | -.dark #flash svg g.flashItem text { | 40 | + position: fixed; |
48 | - fill: #999; | 41 | + top: 50%; |
42 | + left: 50%; | ||
43 | + -webkit-transform: translate(-50%, -50%); | ||
44 | + transform: translate(-50%, -50%); | ||
45 | + margin: 0; | ||
46 | + padding: 10px; | ||
49 | } | 47 | } | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Panel Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light .floatpanel { | ||
22 | + background-color: rgba(255,255,255,0.8); | ||
23 | + color: black; | ||
24 | + box-shadow: 0 2px 12px #777; | ||
25 | +} | ||
26 | +.dark .floatpanel { | ||
27 | + background-color: rgba(50,50,50,0.8); | ||
28 | + color: #ccc; | ||
29 | + box-shadow: 0 2px 12px #000; | ||
30 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Panel Service -- CSS file | 18 | + ONOS GUI -- Panel Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | .floatpanel { | 21 | .floatpanel { |
... | @@ -41,14 +41,3 @@ | ... | @@ -41,14 +41,3 @@ |
41 | html[data-platform='iPad'] .floatpanel { | 41 | html[data-platform='iPad'] .floatpanel { |
42 | top: 80px; | 42 | top: 80px; |
43 | } | 43 | } |
44 | - | ||
45 | -.light .floatpanel { | ||
46 | - background-color: rgba(255,255,255,0.8); | ||
47 | - color: black; | ||
48 | - box-shadow: 0 2px 12px #777; | ||
49 | -} | ||
50 | -.dark .floatpanel { | ||
51 | - background-color: rgba(50,50,50,0.8); | ||
52 | - color: #ccc; | ||
53 | - box-shadow: 0 2px 12px #000; | ||
54 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Quick Help Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +#quickhelp svg g.help rect { | ||
22 | + fill: black; | ||
23 | + opacity: 0.7; | ||
24 | +} | ||
25 | + | ||
26 | +#quickhelp svg text.title { | ||
27 | + fill: #999; | ||
28 | +} | ||
29 | + | ||
30 | +#quickhelp svg g.keyItem { | ||
31 | + fill: white; | ||
32 | +} | ||
33 | + | ||
34 | +#quickhelp svg g line.qhrowsep { | ||
35 | + stroke: #888; | ||
36 | + stroke-dasharray: 2 2; | ||
37 | +} | ||
38 | + | ||
39 | +#quickhelp svg text.key { | ||
40 | + fill: #add; | ||
41 | +} | ||
42 | + | ||
43 | +#quickhelp svg text.desc { | ||
44 | + fill: #ddd; | ||
45 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Quick Help Service -- CSS file | 18 | + ONOS GUI -- Quick Help Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #quickhelp { | 21 | #quickhelp { |
... | @@ -28,37 +28,13 @@ | ... | @@ -28,37 +28,13 @@ |
28 | opacity: 1; | 28 | opacity: 1; |
29 | } | 29 | } |
30 | 30 | ||
31 | -#quickhelp svg g.help rect { | ||
32 | - fill: black; | ||
33 | - opacity: 0.7; | ||
34 | -} | ||
35 | - | ||
36 | #quickhelp svg text.title { | 31 | #quickhelp svg text.title { |
37 | font-size: 10pt; | 32 | font-size: 10pt; |
38 | font-style: italic; | 33 | font-style: italic; |
39 | text-anchor: middle; | 34 | text-anchor: middle; |
40 | - fill: #999; | ||
41 | -} | ||
42 | - | ||
43 | -#quickhelp svg g.keyItem { | ||
44 | - fill: white; | ||
45 | -} | ||
46 | - | ||
47 | -#quickhelp svg g line.qhrowsep { | ||
48 | - stroke: #888; | ||
49 | - stroke-dasharray: 2 2; | ||
50 | } | 35 | } |
51 | 36 | ||
52 | #quickhelp svg text { | 37 | #quickhelp svg text { |
53 | font-size: 7pt; | 38 | font-size: 7pt; |
54 | alignment-baseline: middle; | 39 | alignment-baseline: middle; |
55 | } | 40 | } |
56 | - | ||
57 | -#quickhelp svg text.key { | ||
58 | - fill: #add; | ||
59 | -} | ||
60 | - | ||
61 | -#quickhelp svg text.desc { | ||
62 | - fill: #ddd; | ||
63 | -} | ||
64 | - | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Veil Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #veil { | ||
22 | + background-color: rgba(0,0,0,0.75); | ||
23 | +} | ||
24 | +.dark #veil { | ||
25 | + background-color: rgba(64,64,64,0.75); | ||
26 | +} | ||
27 | + | ||
28 | +#veil .msg p { | ||
29 | + color: #ddd; | ||
30 | +} | ||
31 | + | ||
32 | +#veil svg .glyph { | ||
33 | + fill: #222; | ||
34 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Veil Service -- CSS file | 18 | + ONOS GUI -- Veil Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #veil { | 21 | #veil { |
... | @@ -26,13 +26,6 @@ | ... | @@ -26,13 +26,6 @@ |
26 | left: 0; | 26 | left: 0; |
27 | } | 27 | } |
28 | 28 | ||
29 | -.light #veil { | ||
30 | - background-color: rgba(0,0,0,0.75); | ||
31 | -} | ||
32 | -.dark #veil { | ||
33 | - background-color: rgba(64,64,64,0.75); | ||
34 | -} | ||
35 | - | ||
36 | #veil .msg { | 29 | #veil .msg { |
37 | position: absolute; | 30 | position: absolute; |
38 | padding: 60px; | 31 | padding: 60px; |
... | @@ -42,9 +35,4 @@ | ... | @@ -42,9 +35,4 @@ |
42 | display: block; | 35 | display: block; |
43 | font-size: 14pt; | 36 | font-size: 14pt; |
44 | font-style: italic; | 37 | font-style: italic; |
45 | - color: #ddd; | ||
46 | -} | ||
47 | - | ||
48 | -#veil svg .glyph { | ||
49 | - fill: #222; | ||
50 | } | 38 | } | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Masthead (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #mast { | ||
22 | + background-color: #bbb; | ||
23 | + box-shadow: 0 2px 8px #777; | ||
24 | +} | ||
25 | +.dark #mast { | ||
26 | + background-color: #444; | ||
27 | + box-shadow: 0 2px 8px #222; | ||
28 | +} | ||
29 | + | ||
30 | + | ||
31 | +.light #mast .nav-menu-button:hover { | ||
32 | + background-color: #ddd; | ||
33 | +} | ||
34 | +.dark #mast .nav-menu-button:hover { | ||
35 | + background-color: #777; | ||
36 | +} | ||
37 | + | ||
38 | +#mast img.logo:hover { | ||
39 | + /* need something better */ | ||
40 | + /*background-color: #888;*/ | ||
41 | +} | ||
42 | + | ||
43 | +.light #mast .title { | ||
44 | + color: #369; | ||
45 | +} | ||
46 | +.dark #mast .title { | ||
47 | + color: #eee; | ||
48 | +} | ||
49 | + | ||
50 | +.light #mast-right a { | ||
51 | + color: #369; | ||
52 | +} | ||
53 | + | ||
54 | +.dark #mast-right a { | ||
55 | + color: #eee; | ||
56 | +} | ||
57 | + | ||
58 | +.light #mast nav { | ||
59 | + color: #369; | ||
60 | +} | ||
61 | + | ||
62 | +.dark #mast nav { | ||
63 | + color: #eee; | ||
64 | +} | ||
65 | + | ||
66 | + | ||
67 | +/* Theme styles for drop down menu */ | ||
68 | + | ||
69 | +.light #mast .dropdown { | ||
70 | + background-color: #bbb; | ||
71 | + box-shadow: 0 2px 8px #777; | ||
72 | +} | ||
73 | + | ||
74 | +.dark #mast .dropdown { | ||
75 | + background-color: #444; | ||
76 | + box-shadow: 0 2px 8px #111; | ||
77 | +} | ||
78 | + | ||
79 | +.light #mast .dropdown a { | ||
80 | + color: #369; | ||
81 | + border-bottom: solid #ccc 1px; | ||
82 | +} | ||
83 | + | ||
84 | +.dark #mast .dropdown a { | ||
85 | + color: #eee; | ||
86 | + border-bottom: solid #333 1px; | ||
87 | +} | ||
88 | + | ||
89 | +.light #mast .dropdown a:hover { | ||
90 | + background-color: #ddd; | ||
91 | +} | ||
92 | + | ||
93 | +.dark #mast .dropdown a:hover { | ||
94 | + background-color: #777; | ||
95 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Masthead -- CSS file | 18 | + ONOS GUI -- Masthead (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #mast { | 21 | #mast { |
... | @@ -28,15 +28,6 @@ html[data-platform='iPad'] #mast { | ... | @@ -28,15 +28,6 @@ html[data-platform='iPad'] #mast { |
28 | padding-top: 16px; | 28 | padding-top: 16px; |
29 | } | 29 | } |
30 | 30 | ||
31 | -.light #mast { | ||
32 | - background-color: #bbb; | ||
33 | - box-shadow: 0 2px 8px #777; | ||
34 | -} | ||
35 | -.dark #mast { | ||
36 | - background-color: #444; | ||
37 | - box-shadow: 0 2px 8px #222; | ||
38 | -} | ||
39 | - | ||
40 | #mast .nav-menu-button { | 31 | #mast .nav-menu-button { |
41 | width: 30px; | 32 | width: 30px; |
42 | height: 30px; | 33 | height: 30px; |
... | @@ -44,12 +35,6 @@ html[data-platform='iPad'] #mast { | ... | @@ -44,12 +35,6 @@ html[data-platform='iPad'] #mast { |
44 | margin-bottom: 4px; | 35 | margin-bottom: 4px; |
45 | cursor: pointer; | 36 | cursor: pointer; |
46 | } | 37 | } |
47 | -.light #mast .nav-menu-button:hover { | ||
48 | - background-color: #ddd; | ||
49 | -} | ||
50 | -.dark #mast .nav-menu-button:hover { | ||
51 | - background-color: #777; | ||
52 | -} | ||
53 | 38 | ||
54 | #mast img.logo { | 39 | #mast img.logo { |
55 | height: 38px; | 40 | height: 38px; |
... | @@ -57,23 +42,12 @@ html[data-platform='iPad'] #mast { | ... | @@ -57,23 +42,12 @@ html[data-platform='iPad'] #mast { |
57 | padding-right: 8px; | 42 | padding-right: 8px; |
58 | } | 43 | } |
59 | 44 | ||
60 | -#mast img.logo:hover { | ||
61 | - /* need something better */ | ||
62 | - /*background-color: #888;*/ | ||
63 | -} | ||
64 | - | ||
65 | #mast .title { | 45 | #mast .title { |
66 | font-size: 14pt; | 46 | font-size: 14pt; |
67 | font-style: italic; | 47 | font-style: italic; |
68 | vertical-align: 12px; | 48 | vertical-align: 12px; |
69 | } | 49 | } |
70 | 50 | ||
71 | -.light #mast .title { | ||
72 | - color: #369; | ||
73 | -} | ||
74 | -.dark #mast .title { | ||
75 | - color: #eee; | ||
76 | -} | ||
77 | 51 | ||
78 | #mast-right { | 52 | #mast-right { |
79 | display: inline-block; | 53 | display: inline-block; |
... | @@ -84,21 +58,6 @@ html[data-platform='iPad'] #mast { | ... | @@ -84,21 +58,6 @@ html[data-platform='iPad'] #mast { |
84 | line-height: 44px; | 58 | line-height: 44px; |
85 | } | 59 | } |
86 | 60 | ||
87 | -.light #mast-right a { | ||
88 | - color: #369; | ||
89 | -} | ||
90 | - | ||
91 | -.dark #mast-right a { | ||
92 | - color: #eee; | ||
93 | -} | ||
94 | - | ||
95 | -.light #mast nav { | ||
96 | - color: #369; | ||
97 | -} | ||
98 | - | ||
99 | -.dark #mast nav { | ||
100 | - color: #eee; | ||
101 | -} | ||
102 | 61 | ||
103 | /* | 62 | /* |
104 | MAST HEAD DROPDOWN MENU | 63 | MAST HEAD DROPDOWN MENU |
... | @@ -145,33 +104,3 @@ html[data-platform='iPad'] #mast { | ... | @@ -145,33 +104,3 @@ html[data-platform='iPad'] #mast { |
145 | html[data-platform='iPad'] #mast .dropdown { | 104 | html[data-platform='iPad'] #mast .dropdown { |
146 | top: 57px; | 105 | top: 57px; |
147 | } | 106 | } |
148 | - | ||
149 | -/* Theme styles for drop down menu */ | ||
150 | - | ||
151 | -.light #mast .dropdown { | ||
152 | - background-color: #bbb; | ||
153 | - box-shadow: 0 2px 8px #777; | ||
154 | -} | ||
155 | - | ||
156 | -.dark #mast .dropdown { | ||
157 | - background-color: #444; | ||
158 | - box-shadow: 0 2px 8px #111; | ||
159 | -} | ||
160 | - | ||
161 | -.light #mast .dropdown a { | ||
162 | - color: #369; | ||
163 | - border-bottom: solid #ccc 1px; | ||
164 | -} | ||
165 | - | ||
166 | -.dark #mast .dropdown a { | ||
167 | - color: #eee; | ||
168 | - border-bottom: solid #333 1px; | ||
169 | -} | ||
170 | - | ||
171 | -.light #mast .dropdown a:hover { | ||
172 | - background-color: #ddd; | ||
173 | -} | ||
174 | - | ||
175 | -.dark #mast .dropdown a:hover { | ||
176 | - background-color: #777; | ||
177 | -} | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Navigation (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #nav { | ||
22 | + background-color: #bbb; | ||
23 | + box-shadow: 0 2px 8px #777; | ||
24 | +} | ||
25 | +.dark #nav { | ||
26 | + background-color: #444; | ||
27 | + box-shadow: 0 2px 8px #111; | ||
28 | +} | ||
29 | + | ||
30 | +.light #nav .nav-hdr { | ||
31 | + color: #ddd; | ||
32 | + border-bottom: solid 1px #999; | ||
33 | + background-color: #aaa; | ||
34 | +} | ||
35 | +.dark #nav .nav-hdr { | ||
36 | + color: #888; | ||
37 | + border-bottom: solid 1px #444; | ||
38 | + background-color: #555; | ||
39 | +} | ||
40 | + | ||
41 | +.light #nav a { | ||
42 | + color: #369; | ||
43 | + border-bottom: solid #ccc 1px; | ||
44 | +} | ||
45 | +.dark #nav a { | ||
46 | + color: #eee; | ||
47 | + border-bottom: solid #333 1px; | ||
48 | +} | ||
49 | + | ||
50 | +.light #nav a:hover { | ||
51 | + background-color: #ddd; | ||
52 | +} | ||
53 | +.dark #nav a:hover { | ||
54 | + background-color: #777; | ||
55 | +} | ||
56 | + | ||
57 | +#nav a div svg.embeddedIcon g.icon .glyph { | ||
58 | + fill: #c66; | ||
59 | +} | ||
60 | + |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Navigation -- CSS file | 18 | + ONOS GUI -- Navigation (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #nav { | 21 | #nav { |
... | @@ -31,31 +31,11 @@ html[data-platform='iPad'] #nav { | ... | @@ -31,31 +31,11 @@ html[data-platform='iPad'] #nav { |
31 | top: 57px; | 31 | top: 57px; |
32 | } | 32 | } |
33 | 33 | ||
34 | -.light #nav { | ||
35 | - background-color: #bbb; | ||
36 | - box-shadow: 0 2px 8px #777; | ||
37 | -} | ||
38 | -.dark #nav { | ||
39 | - background-color: #444; | ||
40 | - box-shadow: 0 2px 8px #111; | ||
41 | -} | ||
42 | - | ||
43 | #nav .nav-hdr { | 34 | #nav .nav-hdr { |
44 | font-style: italic; | 35 | font-style: italic; |
45 | padding: 6px 8px 6px 8px; | 36 | padding: 6px 8px 6px 8px; |
46 | } | 37 | } |
47 | 38 | ||
48 | -.light #nav .nav-hdr { | ||
49 | - color: #ddd; | ||
50 | - border-bottom: solid 1px #999; | ||
51 | - background-color: #aaa; | ||
52 | -} | ||
53 | -.dark #nav .nav-hdr { | ||
54 | - color: #888; | ||
55 | - border-bottom: solid 1px #444; | ||
56 | - background-color: #555; | ||
57 | -} | ||
58 | - | ||
59 | #nav a { | 39 | #nav a { |
60 | text-decoration: none; | 40 | text-decoration: none; |
61 | font-size: 14pt; | 41 | font-size: 14pt; |
... | @@ -63,28 +43,8 @@ html[data-platform='iPad'] #nav { | ... | @@ -63,28 +43,8 @@ html[data-platform='iPad'] #nav { |
63 | padding: 8px 16px 6px 12px; | 43 | padding: 8px 16px 6px 12px; |
64 | } | 44 | } |
65 | 45 | ||
66 | -.light #nav a { | ||
67 | - color: #369; | ||
68 | - border-bottom: solid #ccc 1px; | ||
69 | -} | ||
70 | -.dark #nav a { | ||
71 | - color: #eee; | ||
72 | - border-bottom: solid #333 1px; | ||
73 | -} | ||
74 | - | ||
75 | -.light #nav a:hover { | ||
76 | - background-color: #ddd; | ||
77 | -} | ||
78 | -.dark #nav a:hover { | ||
79 | - background-color: #777; | ||
80 | -} | ||
81 | - | ||
82 | #nav a div { | 46 | #nav a div { |
83 | display: inline-block; | 47 | display: inline-block; |
84 | vertical-align: middle; | 48 | vertical-align: middle; |
85 | padding-right: 4px; | 49 | padding-right: 4px; |
86 | } | 50 | } |
87 | - | ||
88 | -#nav a div svg.embeddedIcon g.icon .glyph { | ||
89 | - fill: #c66; | ||
90 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Glyph Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light svg .glyph, | ||
22 | +.dark svg .glyph.overlay { | ||
23 | + fill: black; | ||
24 | +} | ||
25 | + | ||
26 | +.dark svg .glyph, | ||
27 | +.light svg .glyph.overlay { | ||
28 | + fill: white; | ||
29 | +} |
... | @@ -15,20 +15,10 @@ | ... | @@ -15,20 +15,10 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Glyph Service -- CSS file | 18 | + ONOS GUI -- Glyph Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | svg .glyph { | 21 | svg .glyph { |
22 | stroke: none; | 22 | stroke: none; |
23 | fill-rule: evenodd; | 23 | fill-rule: evenodd; |
24 | } | 24 | } |
25 | - | ||
26 | -.light svg .glyph, | ||
27 | -.dark svg .glyph.overlay { | ||
28 | - fill: black; | ||
29 | -} | ||
30 | - | ||
31 | -.dark svg .glyph, | ||
32 | -.light svg .glyph.overlay { | ||
33 | - fill: white; | ||
34 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Icon Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light svg.embeddedIcon g.icon .glyph { | ||
22 | + fill: white; | ||
23 | +} | ||
24 | +.dark svg.embeddedIcon g.icon .glyph { | ||
25 | + fill: white; | ||
26 | +} | ||
27 | + | ||
28 | + | ||
29 | +/* Sortable table headers */ | ||
30 | +.light div.tableColSort svg.embeddedIcon .icon .glyph { | ||
31 | + fill: black; | ||
32 | +} | ||
33 | +.dark div.tableColSort svg.embeddedIcon .icon .glyph { | ||
34 | + fill: #ccc; | ||
35 | +} | ||
36 | + | ||
37 | +.light svg.embeddedIcon .icon.active .glyph { | ||
38 | + fill: green; | ||
39 | +} | ||
40 | +.dark svg.embeddedIcon .icon.active .glyph { | ||
41 | + fill: #308C10; | ||
42 | +} | ||
43 | + | ||
44 | +.light table svg.embeddedIcon { | ||
45 | + fill: #ccc; | ||
46 | +} | ||
47 | +.dark table svg.embeddedIcon { | ||
48 | + fill: #222; | ||
49 | +} | ||
50 | +.light table svg.embeddedIcon .glyph { | ||
51 | + fill: #333; | ||
52 | +} | ||
53 | +.dark table svg.embeddedIcon .glyph { | ||
54 | + fill: #ccc; | ||
55 | +} | ||
56 | + | ||
57 | +.light svg.embeddedIcon .icon.active .glyph { | ||
58 | + fill: green; | ||
59 | +} | ||
60 | +.light svg.embeddedIcon .icon.inactive .glyph { | ||
61 | + fill: darkred; | ||
62 | +} | ||
63 | +.dark svg.embeddedIcon .icon.active .glyph { | ||
64 | + fill: #308C10; | ||
65 | +} | ||
66 | +.dark svg.embeddedIcon .icon.inactive .glyph { | ||
67 | + fill: #AD2D2D; | ||
68 | +} | ||
69 | + |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Icon Service -- CSS file | 18 | + ONOS GUI -- Icon Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | svg#IconLibDefs { | 21 | svg#IconLibDefs { |
... | @@ -37,56 +37,9 @@ svg.embeddedIcon g.icon rect { | ... | @@ -37,56 +37,9 @@ svg.embeddedIcon g.icon rect { |
37 | 37 | ||
38 | svg.embeddedIcon g.icon .glyph { | 38 | svg.embeddedIcon g.icon .glyph { |
39 | stroke: none; | 39 | stroke: none; |
40 | - fill: white; | ||
41 | fill-rule: evenodd; | 40 | fill-rule: evenodd; |
42 | } | 41 | } |
43 | 42 | ||
44 | - | ||
45 | -/* Sortable table headers */ | ||
46 | -.light div.tableColSort svg.embeddedIcon .icon .glyph { | ||
47 | - fill: black; | ||
48 | -} | ||
49 | -.dark div.tableColSort svg.embeddedIcon .icon .glyph { | ||
50 | - fill: #ccc; | ||
51 | -} | ||
52 | - | ||
53 | - | ||
54 | -/* color schemes for specific icon classes */ | ||
55 | - | ||
56 | svg.embeddedIcon .icon.appInactive .glyph { | 43 | svg.embeddedIcon .icon.appInactive .glyph { |
57 | fill: none; | 44 | fill: none; |
58 | } | 45 | } |
59 | - | ||
60 | -.light svg.embeddedIcon .icon.active .glyph { | ||
61 | - fill: green; | ||
62 | -} | ||
63 | -.dark svg.embeddedIcon .icon.active .glyph { | ||
64 | - fill: #308C10; | ||
65 | -} | ||
66 | - | ||
67 | - | ||
68 | -.light table svg.embeddedIcon { | ||
69 | - fill: #ccc; | ||
70 | -} | ||
71 | -.dark table svg.embeddedIcon { | ||
72 | - fill: #222; | ||
73 | -} | ||
74 | -.light table svg.embeddedIcon .glyph { | ||
75 | - fill: #333; | ||
76 | -} | ||
77 | -.dark table svg.embeddedIcon .glyph { | ||
78 | - fill: #ccc; | ||
79 | -} | ||
80 | - | ||
81 | -.light svg.embeddedIcon .icon.active .glyph { | ||
82 | - fill: green; | ||
83 | -} | ||
84 | -.light svg.embeddedIcon .icon.inactive .glyph { | ||
85 | - fill: darkred; | ||
86 | -} | ||
87 | -.dark svg.embeddedIcon .icon.active .glyph { | ||
88 | - fill: #308C10; | ||
89 | -} | ||
90 | -.dark svg.embeddedIcon .icon.inactive .glyph { | ||
91 | - fill: #AD2D2D; | ||
92 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Button Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | + | ||
22 | +/* Selected button color */ | ||
23 | +.light .button svg.embeddedIcon .icon rect, | ||
24 | +.light .toggleButton.selected svg.embeddedIcon .icon rect, | ||
25 | +.light .radioButton.selected svg.embeddedIcon .icon rect { | ||
26 | + fill: #838383; | ||
27 | +} | ||
28 | + | ||
29 | +.light .button:hover svg.embeddedIcon .icon rect, | ||
30 | +.light .toggleButton.selected:hover svg.embeddedIcon .icon rect | ||
31 | + /* NOTE: selected radio button should NOT have hover highlight */ | ||
32 | +{ | ||
33 | + fill: #444444; | ||
34 | +} | ||
35 | + | ||
36 | +.light .button svg.embeddedIcon .glyph, | ||
37 | +.light .toggleButton.selected svg.embeddedIcon .glyph, | ||
38 | +.light .radioButton.selected svg.embeddedIcon .glyph { | ||
39 | + fill: white; | ||
40 | +} | ||
41 | + | ||
42 | +.dark .button svg.embeddedIcon .icon rect, | ||
43 | +.dark .toggleButton.selected svg.embeddedIcon .icon rect, | ||
44 | +.dark .radioButton.selected svg.embeddedIcon .icon rect { | ||
45 | + fill: #151515; | ||
46 | +} | ||
47 | + | ||
48 | +.dark .button:hover svg.embeddedIcon .icon rect, | ||
49 | +.dark .toggleButton.selected:hover svg.embeddedIcon .icon rect | ||
50 | + /* NOTE: selected radio button should NOT have hover highlight */ | ||
51 | +{ | ||
52 | + fill: #444; | ||
53 | +} | ||
54 | + | ||
55 | +.dark .button svg.embeddedIcon .glyph, | ||
56 | +.dark .toggleButton.selected svg.embeddedIcon .glyph, | ||
57 | +.dark .radioButton.selected svg.embeddedIcon .glyph { | ||
58 | + fill: #B2B2B2; | ||
59 | +} | ||
60 | + | ||
61 | +/* Unselected button color */ | ||
62 | +.light .toggleButton svg.embeddedIcon .icon rect, | ||
63 | +.light .radioButton svg.embeddedIcon .icon rect { | ||
64 | + fill: #eee; | ||
65 | +} | ||
66 | + | ||
67 | +.light .toggleButton:hover svg.embeddedIcon .icon rect, | ||
68 | +.light .radioButton:hover:not(.selected) svg.embeddedIcon .icon rect { | ||
69 | + fill: #ccc; | ||
70 | +} | ||
71 | + | ||
72 | +.light .toggleButton svg.embeddedIcon .glyph, | ||
73 | +.light .radioButton svg.embeddedIcon .glyph { | ||
74 | + fill: #bbb; | ||
75 | +} | ||
76 | +.light .toggleButton:hover:not(.selected) svg.embeddedIcon .glyph, | ||
77 | +.light .radioButton:hover:not(.selected) svg.embeddedIcon .glyph { | ||
78 | + fill: #999; | ||
79 | +} | ||
80 | + | ||
81 | +.dark .toggleButton svg.embeddedIcon .icon rect, | ||
82 | +.dark .radioButton svg.embeddedIcon .icon rect { | ||
83 | + fill: #303030; | ||
84 | +} | ||
85 | + | ||
86 | +.dark .toggleButton:hover:not(.selected) svg.embeddedIcon .icon rect, | ||
87 | +.dark .radioButton:hover:not(.selected) svg.embeddedIcon .icon rect { | ||
88 | + fill: #555; | ||
89 | +} | ||
90 | + | ||
91 | +.dark .toggleButton svg.embeddedIcon .glyph, | ||
92 | +.dark .radioButton svg.embeddedIcon .glyph { | ||
93 | + fill: #565656; | ||
94 | +} | ||
95 | + | ||
96 | +.dark .toggleButton:hover:not(.selected) svg.embeddedIcon .glyph, | ||
97 | +.dark .radioButton:hover:not(.selected) svg.embeddedIcon .glyph { | ||
98 | + fill: #777; | ||
99 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Button Service -- CSS file | 18 | + ONOS GUI -- Button Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | .button, | 21 | .button, |
... | @@ -39,82 +39,3 @@ | ... | @@ -39,82 +39,3 @@ |
39 | .radioButton svg.embeddedIcon .icon rect{ | 39 | .radioButton svg.embeddedIcon .icon rect{ |
40 | stroke: none; | 40 | stroke: none; |
41 | } | 41 | } |
42 | - | ||
43 | -/* Selected button color */ | ||
44 | -.light .button svg.embeddedIcon .icon rect, | ||
45 | -.light .toggleButton.selected svg.embeddedIcon .icon rect, | ||
46 | -.light .radioButton.selected svg.embeddedIcon .icon rect { | ||
47 | - fill: #838383; | ||
48 | -} | ||
49 | - | ||
50 | -.light .button:hover svg.embeddedIcon .icon rect, | ||
51 | -.light .toggleButton.selected:hover svg.embeddedIcon .icon rect | ||
52 | -/* NOTE: selected radio button should NOT have hover highlight */ | ||
53 | -{ | ||
54 | - fill: #444444; | ||
55 | -} | ||
56 | - | ||
57 | -.light .button svg.embeddedIcon .glyph, | ||
58 | -.light .toggleButton.selected svg.embeddedIcon .glyph, | ||
59 | -.light .radioButton.selected svg.embeddedIcon .glyph { | ||
60 | - fill: white; | ||
61 | -} | ||
62 | - | ||
63 | -.dark .button svg.embeddedIcon .icon rect, | ||
64 | -.dark .toggleButton.selected svg.embeddedIcon .icon rect, | ||
65 | -.dark .radioButton.selected svg.embeddedIcon .icon rect { | ||
66 | - fill: #151515; | ||
67 | -} | ||
68 | - | ||
69 | -.dark .button:hover svg.embeddedIcon .icon rect, | ||
70 | -.dark .toggleButton.selected:hover svg.embeddedIcon .icon rect | ||
71 | -/* NOTE: selected radio button should NOT have hover highlight */ | ||
72 | -{ | ||
73 | - fill: #444; | ||
74 | -} | ||
75 | - | ||
76 | -.dark .button svg.embeddedIcon .glyph, | ||
77 | -.dark .toggleButton.selected svg.embeddedIcon .glyph, | ||
78 | -.dark .radioButton.selected svg.embeddedIcon .glyph { | ||
79 | - fill: #B2B2B2; | ||
80 | -} | ||
81 | - | ||
82 | -/* Unselected button color */ | ||
83 | -.light .toggleButton svg.embeddedIcon .icon rect, | ||
84 | -.light .radioButton svg.embeddedIcon .icon rect { | ||
85 | - fill: #eee; | ||
86 | -} | ||
87 | - | ||
88 | -.light .toggleButton:hover svg.embeddedIcon .icon rect, | ||
89 | -.light .radioButton:hover:not(.selected) svg.embeddedIcon .icon rect { | ||
90 | - fill: #ccc; | ||
91 | -} | ||
92 | - | ||
93 | -.light .toggleButton svg.embeddedIcon .glyph, | ||
94 | -.light .radioButton svg.embeddedIcon .glyph { | ||
95 | - fill: #bbb; | ||
96 | -} | ||
97 | -.light .toggleButton:hover:not(.selected) svg.embeddedIcon .glyph, | ||
98 | -.light .radioButton:hover:not(.selected) svg.embeddedIcon .glyph { | ||
99 | - fill: #999; | ||
100 | -} | ||
101 | - | ||
102 | -.dark .toggleButton svg.embeddedIcon .icon rect, | ||
103 | -.dark .radioButton svg.embeddedIcon .icon rect { | ||
104 | - fill: #303030; | ||
105 | -} | ||
106 | - | ||
107 | -.dark .toggleButton:hover:not(.selected) svg.embeddedIcon .icon rect, | ||
108 | -.dark .radioButton:hover:not(.selected) svg.embeddedIcon .icon rect { | ||
109 | - fill: #555; | ||
110 | -} | ||
111 | - | ||
112 | -.dark .toggleButton svg.embeddedIcon .glyph, | ||
113 | -.dark .radioButton svg.embeddedIcon .glyph { | ||
114 | - fill: #565656; | ||
115 | -} | ||
116 | - | ||
117 | -.dark .toggleButton:hover:not(.selected) svg.embeddedIcon .glyph, | ||
118 | -.dark .radioButton:hover:not(.selected) svg.embeddedIcon .glyph { | ||
119 | - fill: #777; | ||
120 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* ------ for summary-list tables (theme) ------ */ | ||
18 | + | ||
19 | +.light div.summary-list tr:nth-child(even) { | ||
20 | + background-color: #ddd; | ||
21 | +} | ||
22 | +.light div.summary-list tr:nth-child(odd) { | ||
23 | + background-color: #eee; | ||
24 | +} | ||
25 | +.dark div.summary-list tr:nth-child(even) { | ||
26 | + background-color: #333; | ||
27 | +} | ||
28 | +.dark div.summary-list tr:nth-child(odd) { | ||
29 | + background-color: #444; | ||
30 | +} | ||
31 | + | ||
32 | +.light div.summary-list tr.selected { | ||
33 | + background-color: deepskyblue !important; | ||
34 | +} | ||
35 | + | ||
36 | +.dark div.summary-list tr.selected { | ||
37 | + background-color: #304860; | ||
38 | +} | ||
39 | + | ||
40 | +/* highlighting */ | ||
41 | +.light div.summary-list tr.data-change { | ||
42 | + background-color: #FDFFDC; | ||
43 | +} | ||
44 | +.dark div.summary-list tr.data-change { | ||
45 | + background-color: #5A5600; | ||
46 | +} | ||
47 | + | ||
48 | +.light div.summary-list .table-header td { | ||
49 | + background-color: #bbb; | ||
50 | +} | ||
51 | +.dark div.summary-list .table-header td { | ||
52 | + background-color: #222; | ||
53 | + color: #ccc; | ||
54 | +} | ||
55 | + | ||
56 | +.dark div.summary-list td { | ||
57 | + color: #ccc; | ||
58 | +} | ||
59 | + | ||
60 | +/* Inactive */ | ||
61 | +.light .ctrl-btns div g.icon rect, | ||
62 | +.light .ctrl-btns div:hover g.icon rect { | ||
63 | + fill: #eee; | ||
64 | +} | ||
65 | +.dark .ctrl-btns div g.icon rect, | ||
66 | +.dark .ctrl-btns div:hover g.icon rect { | ||
67 | + fill: #222; | ||
68 | +} | ||
69 | + | ||
70 | +.light .ctrl-btns div g.icon use { | ||
71 | + fill: #ddd; | ||
72 | +} | ||
73 | +.dark .ctrl-btns div g.icon use { | ||
74 | + fill: #333; | ||
75 | +} | ||
76 | + | ||
77 | +/* Active hover */ | ||
78 | +.light .ctrl-btns div.active:hover g.icon rect { | ||
79 | + fill: #800; | ||
80 | +} | ||
81 | + | ||
82 | +.dark .ctrl-btns div.active:hover g.icon rect { | ||
83 | + fill: #CE5650; | ||
84 | +} | ||
85 | + | ||
86 | +/* Active */ | ||
87 | +.light .ctrl-btns div.active g.icon use { | ||
88 | + fill: #fff; | ||
89 | +} | ||
90 | +.dark .ctrl-btns div.active g.icon use { | ||
91 | + fill: #eee; | ||
92 | +} | ||
93 | + | ||
94 | +.light .ctrl-btns div.active g.icon rect { | ||
95 | + fill: #bbb; | ||
96 | +} | ||
97 | +.dark .ctrl-btns div.active g.icon rect { | ||
98 | + fill: #444; | ||
99 | +} | ||
100 | + | ||
101 | +/* Refresh button specific */ | ||
102 | +.light .ctrl-btns div.refresh.active g.icon rect { | ||
103 | + fill: #964949; | ||
104 | +} | ||
105 | + | ||
106 | +.dark .ctrl-btns div.refresh.active g.icon rect { | ||
107 | + fill: #9B4641; | ||
108 | +} | ||
109 | +.light .ctrl-btns div.refresh:hover g.icon rect { | ||
110 | + fill: #964949; | ||
111 | +} | ||
112 | + | ||
113 | +.dark .ctrl-btns div.refresh:hover g.icon rect { | ||
114 | + fill: #9B4641; | ||
115 | +} | ||
116 | + |
... | @@ -14,7 +14,7 @@ | ... | @@ -14,7 +14,7 @@ |
14 | * limitations under the License. | 14 | * limitations under the License. |
15 | */ | 15 | */ |
16 | 16 | ||
17 | -/* ------ for summary-list tables ------ */ | 17 | +/* ------ for summary-list tables (layout) ------ */ |
18 | 18 | ||
19 | div.summary-list { | 19 | div.summary-list { |
20 | margin: 0 20px 16px 10px; | 20 | margin: 0 20px 16px 10px; |
... | @@ -42,37 +42,11 @@ div.summary-list tr.no-data td { | ... | @@ -42,37 +42,11 @@ div.summary-list tr.no-data td { |
42 | font-style: italic; | 42 | font-style: italic; |
43 | } | 43 | } |
44 | 44 | ||
45 | -.light div.summary-list tr:nth-child(even) { | ||
46 | - background-color: #ddd; | ||
47 | -} | ||
48 | -.light div.summary-list tr:nth-child(odd) { | ||
49 | - background-color: #eee; | ||
50 | -} | ||
51 | -.dark div.summary-list tr:nth-child(even) { | ||
52 | - background-color: #333; | ||
53 | -} | ||
54 | -.dark div.summary-list tr:nth-child(odd) { | ||
55 | - background-color: #444; | ||
56 | -} | ||
57 | - | ||
58 | -.light div.summary-list tr.selected { | ||
59 | - background-color: deepskyblue !important; | ||
60 | -} | ||
61 | - | ||
62 | -.dark div.summary-list tr.selected { | ||
63 | - background-color: #304860; | ||
64 | -} | ||
65 | 45 | ||
66 | /* highlighting */ | 46 | /* highlighting */ |
67 | div.summary-list tr { | 47 | div.summary-list tr { |
68 | transition: background-color 500ms; | 48 | transition: background-color 500ms; |
69 | } | 49 | } |
70 | -.light div.summary-list tr.data-change { | ||
71 | - background-color: #FDFFDC; | ||
72 | -} | ||
73 | -.dark div.summary-list tr.data-change { | ||
74 | - background-color: #5A5600; | ||
75 | -} | ||
76 | 50 | ||
77 | div.summary-list td { | 51 | div.summary-list td { |
78 | padding: 6px; | 52 | padding: 6px; |
... | @@ -92,23 +66,11 @@ div.summary-list .table-header td:last-child { | ... | @@ -92,23 +66,11 @@ div.summary-list .table-header td:last-child { |
92 | border-radius: 0 8px 0 0; | 66 | border-radius: 0 8px 0 0; |
93 | } | 67 | } |
94 | 68 | ||
95 | -.light div.summary-list .table-header td { | ||
96 | - background-color: #bbb; | ||
97 | -} | ||
98 | -.dark div.summary-list .table-header td { | ||
99 | - background-color: #222; | ||
100 | - color: #ccc; | ||
101 | -} | ||
102 | - | ||
103 | /* rows are selectable */ | 69 | /* rows are selectable */ |
104 | div.summary-list .table-body td { | 70 | div.summary-list .table-body td { |
105 | cursor: pointer; | 71 | cursor: pointer; |
106 | } | 72 | } |
107 | 73 | ||
108 | -.dark div.summary-list td { | ||
109 | - color: #ccc; | ||
110 | -} | ||
111 | - | ||
112 | /* Tabular view upper right control buttons */ | 74 | /* Tabular view upper right control buttons */ |
113 | 75 | ||
114 | div.ctrl-btns { | 76 | div.ctrl-btns { |
... | @@ -119,7 +81,6 @@ div.ctrl-btns { | ... | @@ -119,7 +81,6 @@ div.ctrl-btns { |
119 | margin-top: 7px; | 81 | margin-top: 7px; |
120 | } | 82 | } |
121 | 83 | ||
122 | - | ||
123 | div.ctrl-btns div { | 84 | div.ctrl-btns div { |
124 | display: inline-block; | 85 | display: inline-block; |
125 | padding: 4px; | 86 | padding: 4px; |
... | @@ -131,60 +92,3 @@ div.ctrl-btns div.separator { | ... | @@ -131,60 +92,3 @@ div.ctrl-btns div.separator { |
131 | width: 24px; | 92 | width: 24px; |
132 | border: none; | 93 | border: none; |
133 | } | 94 | } |
134 | - | ||
135 | -/* Inactive */ | ||
136 | -.light .ctrl-btns div g.icon rect, | ||
137 | -.light .ctrl-btns div:hover g.icon rect { | ||
138 | - fill: #eee; | ||
139 | -} | ||
140 | -.dark .ctrl-btns div g.icon rect, | ||
141 | -.dark .ctrl-btns div:hover g.icon rect { | ||
142 | - fill: #222; | ||
143 | -} | ||
144 | - | ||
145 | -.light .ctrl-btns div g.icon use { | ||
146 | - fill: #ddd; | ||
147 | -} | ||
148 | -.dark .ctrl-btns div g.icon use { | ||
149 | - fill: #333; | ||
150 | -} | ||
151 | - | ||
152 | -/* Active hover */ | ||
153 | -.light .ctrl-btns div.active:hover g.icon rect { | ||
154 | - fill: #800; | ||
155 | -} | ||
156 | - | ||
157 | -.dark .ctrl-btns div.active:hover g.icon rect { | ||
158 | - fill: #CE5650; | ||
159 | -} | ||
160 | - | ||
161 | -/* Active */ | ||
162 | -.light .ctrl-btns div.active g.icon use { | ||
163 | - fill: #fff; | ||
164 | -} | ||
165 | -.dark .ctrl-btns div.active g.icon use { | ||
166 | - fill: #eee; | ||
167 | -} | ||
168 | - | ||
169 | -.light .ctrl-btns div.active g.icon rect { | ||
170 | - fill: #bbb; | ||
171 | -} | ||
172 | -.dark .ctrl-btns div.active g.icon rect { | ||
173 | - fill: #444; | ||
174 | -} | ||
175 | - | ||
176 | -/* Refresh button specific */ | ||
177 | -.light .ctrl-btns div.refresh.active g.icon rect { | ||
178 | - fill: #964949; | ||
179 | -} | ||
180 | - | ||
181 | -.dark .ctrl-btns div.refresh.active g.icon rect { | ||
182 | - fill: #9B4641; | ||
183 | -} | ||
184 | -.light .ctrl-btns div.refresh:hover g.icon rect { | ||
185 | - fill: #964949; | ||
186 | -} | ||
187 | - | ||
188 | -.dark .ctrl-btns div.refresh:hover g.icon rect { | ||
189 | - fill: #9B4641; | ||
190 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Toolbar Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light .tbar-arrow svg.embeddedIcon .icon .glyph { | ||
22 | + fill: #838383; | ||
23 | +} | ||
24 | +.dark .tbar-arrow svg.embeddedIcon .icon .glyph { | ||
25 | + fill: #B2B2B2; | ||
26 | +} | ||
27 | + | ||
28 | +.tbar-arrow svg.embeddedIcon .icon rect { | ||
29 | + stroke: none; | ||
30 | +} | ||
31 | +.light .tbar-arrow svg.embeddedIcon .icon rect { | ||
32 | + fill: none; | ||
33 | +} | ||
34 | +.dark .tbar-arrow svg.embeddedIcon .icon rect { | ||
35 | + fill: none; | ||
36 | +} | ||
37 | + | ||
38 | +.light .separator { | ||
39 | + border-color: #ddd; | ||
40 | +} | ||
41 | +.dark .separator { | ||
42 | + border-color: #1A1A1A; | ||
43 | +} |
... | @@ -15,17 +15,9 @@ | ... | @@ -15,17 +15,9 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Toolbar Service -- CSS file | 18 | + ONOS GUI -- Toolbar Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | -.light .tbar-arrow svg.embeddedIcon .icon .glyph { | ||
22 | - fill: #838383; | ||
23 | -} | ||
24 | -.dark .tbar-arrow svg.embeddedIcon .icon .glyph { | ||
25 | - fill: #B2B2B2; | ||
26 | -} | ||
27 | - | ||
28 | - | ||
29 | div.tbar-arrow { | 21 | div.tbar-arrow { |
30 | position: absolute; | 22 | position: absolute; |
31 | top: 53%; | 23 | top: 53%; |
... | @@ -42,17 +34,6 @@ div.tbar-arrow { | ... | @@ -42,17 +34,6 @@ div.tbar-arrow { |
42 | margin-right: -3%; | 34 | margin-right: -3%; |
43 | } | 35 | } |
44 | 36 | ||
45 | -.tbar-arrow svg.embeddedIcon .icon rect { | ||
46 | - stroke: none; | ||
47 | -} | ||
48 | -.light .tbar-arrow svg.embeddedIcon .icon rect { | ||
49 | - fill: none; | ||
50 | -} | ||
51 | -.dark .tbar-arrow svg.embeddedIcon .icon rect { | ||
52 | - fill: none; | ||
53 | -} | ||
54 | - | ||
55 | - | ||
56 | .toolbar { | 37 | .toolbar { |
57 | line-height: 125%; | 38 | line-height: 125%; |
58 | } | 39 | } |
... | @@ -60,8 +41,6 @@ div.tbar-arrow { | ... | @@ -60,8 +41,6 @@ div.tbar-arrow { |
60 | display: inline-block; | 41 | display: inline-block; |
61 | } | 42 | } |
62 | 43 | ||
63 | - | ||
64 | - | ||
65 | .separator { | 44 | .separator { |
66 | border: 1px solid; | 45 | border: 1px solid; |
67 | margin: 0 4px 0 4px; | 46 | margin: 0 4px 0 4px; |
... | @@ -69,9 +48,3 @@ div.tbar-arrow { | ... | @@ -69,9 +48,3 @@ div.tbar-arrow { |
69 | height: 23px; | 48 | height: 23px; |
70 | width: 0; | 49 | width: 0; |
71 | } | 50 | } |
72 | -.light .separator { | ||
73 | - border-color: #ddd; | ||
74 | -} | ||
75 | -.dark .separator { | ||
76 | - border-color: #1A1A1A; | ||
77 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Tooltip Service (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | + | ||
22 | +.light #tooltip { | ||
23 | + background-color: #ddd; | ||
24 | + color: #444; | ||
25 | + border-color: #ccc; | ||
26 | +} | ||
27 | + | ||
28 | +.dark #tooltip { | ||
29 | + background-color: #151515; | ||
30 | + color: #B2B2B2; | ||
31 | + border-color: #252525; | ||
32 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Tooltip Service -- CSS file | 18 | + ONOS GUI -- Tooltip Service (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #tooltip { | 21 | #tooltip { |
... | @@ -28,17 +28,3 @@ | ... | @@ -28,17 +28,3 @@ |
28 | display: none; | 28 | display: none; |
29 | pointer-events: none; | 29 | pointer-events: none; |
30 | } | 30 | } |
31 | - | ||
32 | -/* colors subject to change */ | ||
33 | - | ||
34 | -.light #tooltip { | ||
35 | - background-color: #ddd; | ||
36 | - color: #444; | ||
37 | - border-color: #ccc; | ||
38 | -} | ||
39 | - | ||
40 | -.dark #tooltip { | ||
41 | - background-color: #151515; | ||
42 | - color: #B2B2B2; | ||
43 | - border-color: #252525; | ||
44 | -} | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
web/gui/src/main/webapp/app/onos-theme.css
0 → 100644
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- core (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +body.light { | ||
22 | + background-color: white; | ||
23 | +} | ||
24 | +body.dark { | ||
25 | + background-color: #2b2b2b; | ||
26 | +} | ||
27 | + | ||
28 | +.light #view h2 { | ||
29 | + color: #800; | ||
30 | +} | ||
31 | +.dark #view h2 { | ||
32 | + color: #CE5650; | ||
33 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- core -- CSS file | 18 | + ONOS GUI -- core (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | html { | 21 | html { |
... | @@ -35,13 +35,6 @@ body { | ... | @@ -35,13 +35,6 @@ body { |
35 | overflow: hidden; | 35 | overflow: hidden; |
36 | } | 36 | } |
37 | 37 | ||
38 | -body.light { | ||
39 | - background-color: white; | ||
40 | -} | ||
41 | -body.dark { | ||
42 | - background-color: #2b2b2b; | ||
43 | -} | ||
44 | - | ||
45 | #view { | 38 | #view { |
46 | padding: 6px; | 39 | padding: 6px; |
47 | width: 100%; | 40 | width: 100%; |
... | @@ -52,21 +45,3 @@ body.dark { | ... | @@ -52,21 +45,3 @@ body.dark { |
52 | padding-left: 12px; | 45 | padding-left: 12px; |
53 | } | 46 | } |
54 | 47 | ||
55 | -.light #view h2 { | ||
56 | - color: #800; | ||
57 | -} | ||
58 | -.dark #view h2 { | ||
59 | - color: #CE5650; | ||
60 | -} | ||
61 | - | ||
62 | -.centered { | ||
63 | - position: fixed; | ||
64 | - top: 50%; | ||
65 | - left: 50%; | ||
66 | - -webkit-transform: translate(-50%, -50%); | ||
67 | - transform: translate(-50%, -50%); | ||
68 | - box-shadow: 2px 2px 24px 5px #888; | ||
69 | - background-color: #eee; | ||
70 | - margin: 0; | ||
71 | - padding: 10px; | ||
72 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Applications View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #app-dialog p { | ||
22 | + color: darkred; | ||
23 | +} | ||
24 | +.dark #app-dialog p { | ||
25 | + color: #c55; | ||
26 | +} | ||
27 | + | ||
28 | +.light #app-dialog p.strong { | ||
29 | + color: red; | ||
30 | + background-color: #ff0; | ||
31 | +} | ||
32 | +.dark #app-dialog p.strong { | ||
33 | + color: #c55; | ||
34 | + background-color: #dd4; | ||
35 | +} | ||
36 | + | ||
37 | + | ||
38 | +.light #app-dialog.floatpanel.dialog { | ||
39 | + background-color: #fff; | ||
40 | +} | ||
41 | +.dark #app-dialog.floatpanel.dialog { | ||
42 | + background-color: #444; | ||
43 | +} | ||
44 | + | ||
45 | +.light #application-details-panel.floatpanel { | ||
46 | + background-color: rgb(229, 234, 237); | ||
47 | +} | ||
48 | +.dark #application-details-panel.floatpanel { | ||
49 | + background-color: #3A4042; | ||
50 | +} | ||
51 | + | ||
52 | +.light .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
53 | + fill: #aaa; | ||
54 | +} | ||
55 | +.dark .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
56 | + fill: #ccc; | ||
57 | +} | ||
58 | + | ||
59 | +#application-details-panel td.label, | ||
60 | +#application-details-panel .app-url i { | ||
61 | + /* works for both light and dark themes ... */ | ||
62 | + color: #777; | ||
63 | +} | ||
64 | + | ||
65 | +.light #application-details-panel hr { | ||
66 | + opacity: .5; | ||
67 | + border-color: #FFF; | ||
68 | +} | ||
69 | +.dark #application-details-panel hr { | ||
70 | + border-color: #666; | ||
71 | +} | ||
72 | + | ||
73 | +.light #application-details-panel .bottom tr:nth-child(odd) { | ||
74 | + background-color: #f9f9f9; | ||
75 | +} | ||
76 | +.light #application-details-panel .bottom tr:nth-child(even) { | ||
77 | + background-color: #EBEDF2; | ||
78 | +} | ||
79 | +.dark #application-details-panel .bottom tr:nth-child(odd) { | ||
80 | + background-color: #333; | ||
81 | +} | ||
82 | +.dark #application-details-panel .bottom tr:nth-child(even) { | ||
83 | + background-color: #555; | ||
84 | +} | ||
85 | + | ||
86 | +.light div.dropping { | ||
87 | + border: solid 3px deepskyblue; | ||
88 | +} | ||
89 | + | ||
90 | +.dark div.dropping { | ||
91 | + border: solid 3px deepskyblue; | ||
92 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Applications View -- CSS file | 18 | + ONOS GUI -- Applications View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-app h2 { | 21 | #ov-app h2 { |
... | @@ -34,32 +34,10 @@ | ... | @@ -34,32 +34,10 @@ |
34 | #app-dialog p { | 34 | #app-dialog p { |
35 | font-size: 12pt; | 35 | font-size: 12pt; |
36 | } | 36 | } |
37 | -.light #app-dialog p { | ||
38 | - color: darkred; | ||
39 | -} | ||
40 | -.dark #app-dialog p { | ||
41 | - color: #c55; | ||
42 | -} | ||
43 | 37 | ||
44 | #app-dialog p.strong { | 38 | #app-dialog p.strong { |
45 | font-weight: bold; | 39 | font-weight: bold; |
46 | } | 40 | } |
47 | -.light #app-dialog p.strong { | ||
48 | - color: red; | ||
49 | - background-color: #ff0; | ||
50 | -} | ||
51 | -.dark #app-dialog p.strong { | ||
52 | - color: #c55; | ||
53 | - background-color: #dd4; | ||
54 | -} | ||
55 | - | ||
56 | - | ||
57 | -.light #app-dialog.floatpanel.dialog { | ||
58 | - background-color: #fff; | ||
59 | -} | ||
60 | -.dark #app-dialog.floatpanel.dialog { | ||
61 | - background-color: #444; | ||
62 | -} | ||
63 | 41 | ||
64 | #application-details-panel.floatpanel { | 42 | #application-details-panel.floatpanel { |
65 | -moz-border-radius: 0; | 43 | -moz-border-radius: 0; |
... | @@ -67,12 +45,6 @@ | ... | @@ -67,12 +45,6 @@ |
67 | z-index: 0; | 45 | z-index: 0; |
68 | } | 46 | } |
69 | 47 | ||
70 | -.light #application-details-panel.floatpanel { | ||
71 | - background-color: rgb(229, 234, 237); | ||
72 | -} | ||
73 | -.dark #application-details-panel.floatpanel { | ||
74 | - background-color: #3A4042; | ||
75 | -} | ||
76 | 48 | ||
77 | #application-details-panel .container { | 49 | #application-details-panel .container { |
78 | padding: 0 10px; | 50 | padding: 0 10px; |
... | @@ -84,12 +56,6 @@ | ... | @@ -84,12 +56,6 @@ |
84 | top: 0; | 56 | top: 0; |
85 | cursor: pointer; | 57 | cursor: pointer; |
86 | } | 58 | } |
87 | -.light .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
88 | - fill: #aaa; | ||
89 | -} | ||
90 | -.dark .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
91 | - fill: #ccc; | ||
92 | -} | ||
93 | 59 | ||
94 | #application-details-panel .app-icon { | 60 | #application-details-panel .app-icon { |
95 | display: inline-block; | 61 | display: inline-block; |
... | @@ -127,8 +93,6 @@ | ... | @@ -127,8 +93,6 @@ |
127 | #application-details-panel .app-url i { | 93 | #application-details-panel .app-url i { |
128 | font-style: italic; | 94 | font-style: italic; |
129 | padding-right: 12px; | 95 | padding-right: 12px; |
130 | - /* works for both light and dark themes ... */ | ||
131 | - color: #777; | ||
132 | } | 96 | } |
133 | 97 | ||
134 | #application-details-panel td.value-bold { | 98 | #application-details-panel td.value-bold { |
... | @@ -143,13 +107,6 @@ | ... | @@ -143,13 +107,6 @@ |
143 | width: 95%; | 107 | width: 95%; |
144 | margin: 10px auto; | 108 | margin: 10px auto; |
145 | } | 109 | } |
146 | -.light #application-details-panel hr { | ||
147 | - opacity: .5; | ||
148 | - border-color: #FFF; | ||
149 | -} | ||
150 | -.dark #application-details-panel hr { | ||
151 | - border-color: #666; | ||
152 | -} | ||
153 | 110 | ||
154 | #application-details-panel .bottom table { | 111 | #application-details-panel .bottom table { |
155 | border-spacing: 0; | 112 | border-spacing: 0; |
... | @@ -161,27 +118,8 @@ | ... | @@ -161,27 +118,8 @@ |
161 | text-align: left; | 118 | text-align: left; |
162 | } | 119 | } |
163 | 120 | ||
164 | -.light #application-details-panel .bottom tr:nth-child(odd) { | ||
165 | - background-color: #f9f9f9; | ||
166 | -} | ||
167 | -.light #application-details-panel .bottom tr:nth-child(even) { | ||
168 | - background-color: #EBEDF2; | ||
169 | -} | ||
170 | -.dark #application-details-panel .bottom tr:nth-child(odd) { | ||
171 | - background-color: #333; | ||
172 | -} | ||
173 | -.dark #application-details-panel .bottom tr:nth-child(even) { | ||
174 | - background-color: #555; | ||
175 | -} | ||
176 | 121 | ||
177 | .dropping { | 122 | .dropping { |
178 | 123 | ||
179 | } | 124 | } |
180 | 125 | ||
181 | -.light div.dropping { | ||
182 | - border: solid 3px deepskyblue; | ||
183 | -} | ||
184 | - | ||
185 | -.dark div.dropping { | ||
186 | - border: solid 3px deepskyblue; | ||
187 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Device View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #ov-device .current-view use { | ||
22 | + fill: white; | ||
23 | +} | ||
24 | +.dark #ov-device .current-view use { | ||
25 | + fill: #304860; | ||
26 | +} | ||
27 | + | ||
28 | +.light #ov-device .current-view rect { | ||
29 | + fill: deepskyblue; | ||
30 | +} | ||
31 | +.dark #ov-device .current-view rect { | ||
32 | + fill: #eee; | ||
33 | +} | ||
34 | + | ||
35 | +.light #device-details-panel.floatpanel { | ||
36 | + background-color: rgb(229, 234, 237); | ||
37 | +} | ||
38 | +.dark #device-details-panel.floatpanel { | ||
39 | + background-color: #3A4042; | ||
40 | +} | ||
41 | + | ||
42 | +.light .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
43 | + fill: #aaa; | ||
44 | +} | ||
45 | +.dark .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
46 | + fill: #ccc; | ||
47 | +} | ||
48 | + | ||
49 | +.light .dev-icon svg.embeddedIcon .glyph { | ||
50 | + fill: rgb(0, 172, 229); | ||
51 | +} | ||
52 | +.dark .dev-icon svg.embeddedIcon .glyph { | ||
53 | + fill: #486D91; | ||
54 | +} | ||
55 | + | ||
56 | +#device-details-panel .editable { | ||
57 | + cursor: pointer; | ||
58 | + border-bottom: 1px dashed darkgreen; | ||
59 | +} | ||
60 | + | ||
61 | +#device-details-panel td.label { | ||
62 | + /* works for both light and dark themes ... */ | ||
63 | + color: #777; | ||
64 | +} | ||
65 | + | ||
66 | +.light #device-details-panel hr { | ||
67 | + opacity: .5; | ||
68 | + border-color: #FFF; | ||
69 | +} | ||
70 | +.dark #device-details-panel hr { | ||
71 | + border-color: #666; | ||
72 | +} | ||
73 | + | ||
74 | +.light #device-details-panel .bottom th { | ||
75 | + background-color: #CCC; | ||
76 | + /* default text color */ | ||
77 | +} | ||
78 | +.dark #device-details-panel .bottom th { | ||
79 | + background-color: #131313; | ||
80 | + color: #ccc; | ||
81 | +} | ||
82 | + | ||
83 | +.light #device-details-panel .bottom tr:nth-child(odd) { | ||
84 | + background-color: #f9f9f9; | ||
85 | +} | ||
86 | +.light #device-details-panel .bottom tr:nth-child(even) { | ||
87 | + background-color: #EBEDF2; | ||
88 | +} | ||
89 | +.dark #device-details-panel .bottom tr:nth-child(odd) { | ||
90 | + background-color: #333; | ||
91 | +} | ||
92 | +.dark #device-details-panel .bottom tr:nth-child(even) { | ||
93 | + background-color: #555; | ||
94 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Device View -- CSS file | 18 | + ONOS GUI -- Device View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-device h2 { | 21 | #ov-device h2 { |
... | @@ -25,19 +25,6 @@ | ... | @@ -25,19 +25,6 @@ |
25 | #ov-device div.ctrl-btns { | 25 | #ov-device div.ctrl-btns { |
26 | } | 26 | } |
27 | 27 | ||
28 | -.light #ov-device .current-view use { | ||
29 | - fill: white; | ||
30 | -} | ||
31 | -.dark #ov-device .current-view use { | ||
32 | - fill: #304860; | ||
33 | -} | ||
34 | - | ||
35 | -.light #ov-device .current-view rect { | ||
36 | - fill: deepskyblue; | ||
37 | -} | ||
38 | -.dark #ov-device .current-view rect { | ||
39 | - fill: #eee; | ||
40 | -} | ||
41 | 28 | ||
42 | /* More in generic panel.css */ | 29 | /* More in generic panel.css */ |
43 | 30 | ||
... | @@ -47,12 +34,6 @@ | ... | @@ -47,12 +34,6 @@ |
47 | z-index: 0; | 34 | z-index: 0; |
48 | } | 35 | } |
49 | 36 | ||
50 | -.light #device-details-panel.floatpanel { | ||
51 | - background-color: rgb(229, 234, 237); | ||
52 | -} | ||
53 | -.dark #device-details-panel.floatpanel { | ||
54 | - background-color: #3A4042; | ||
55 | -} | ||
56 | 37 | ||
57 | #device-details-panel .container { | 38 | #device-details-panel .container { |
58 | padding: 0 12px; | 39 | padding: 0 12px; |
... | @@ -64,34 +45,18 @@ | ... | @@ -64,34 +45,18 @@ |
64 | top: 0; | 45 | top: 0; |
65 | cursor: pointer; | 46 | cursor: pointer; |
66 | } | 47 | } |
67 | -.light .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
68 | - fill: #aaa; | ||
69 | -} | ||
70 | -.dark .close-btn svg.embeddedIcon .icon.plus .glyph { | ||
71 | - fill: #ccc; | ||
72 | -} | ||
73 | 48 | ||
74 | #device-details-panel .dev-icon { | 49 | #device-details-panel .dev-icon { |
75 | display: inline-block; | 50 | display: inline-block; |
76 | padding: 0 6px 0 0; | 51 | padding: 0 6px 0 0; |
77 | vertical-align: middle; | 52 | vertical-align: middle; |
78 | } | 53 | } |
79 | -.light .dev-icon svg.embeddedIcon .glyph { | ||
80 | - fill: rgb(0, 172, 229); | ||
81 | -} | ||
82 | -.dark .dev-icon svg.embeddedIcon .glyph { | ||
83 | - fill: #486D91; | ||
84 | -} | ||
85 | 54 | ||
86 | #device-details-panel h2 { | 55 | #device-details-panel h2 { |
87 | display: inline-block; | 56 | display: inline-block; |
88 | margin: 8px 0; | 57 | margin: 8px 0; |
89 | } | 58 | } |
90 | 59 | ||
91 | -#device-details-panel .editable { | ||
92 | - cursor: pointer; | ||
93 | - border-bottom: 1px dashed darkgreen; | ||
94 | -} | ||
95 | 60 | ||
96 | #device-details-panel h2 input { | 61 | #device-details-panel h2 input { |
97 | font-size: 1.0em; | 62 | font-size: 1.0em; |
... | @@ -108,8 +73,6 @@ | ... | @@ -108,8 +73,6 @@ |
108 | #device-details-panel td.label { | 73 | #device-details-panel td.label { |
109 | font-style: italic; | 74 | font-style: italic; |
110 | padding-right: 12px; | 75 | padding-right: 12px; |
111 | - /* works for both light and dark themes ... */ | ||
112 | - color: #777; | ||
113 | } | 76 | } |
114 | 77 | ||
115 | #device-details-panel .actionBtns div { | 78 | #device-details-panel .actionBtns div { |
... | @@ -121,13 +84,6 @@ | ... | @@ -121,13 +84,6 @@ |
121 | margin: 0 auto; | 84 | margin: 0 auto; |
122 | } | 85 | } |
123 | 86 | ||
124 | -.light #device-details-panel hr { | ||
125 | - opacity: .5; | ||
126 | - border-color: #FFF; | ||
127 | -} | ||
128 | -.dark #device-details-panel hr { | ||
129 | - border-color: #666; | ||
130 | -} | ||
131 | 87 | ||
132 | #device-details-panel .bottom table { | 88 | #device-details-panel .bottom table { |
133 | border-spacing: 0; | 89 | border-spacing: 0; |
... | @@ -137,14 +93,6 @@ | ... | @@ -137,14 +93,6 @@ |
137 | letter-spacing: 0.02em; | 93 | letter-spacing: 0.02em; |
138 | } | 94 | } |
139 | 95 | ||
140 | -.light #device-details-panel .bottom th { | ||
141 | - background-color: #CCC; | ||
142 | - /* default text color */ | ||
143 | -} | ||
144 | -.dark #device-details-panel .bottom th { | ||
145 | - background-color: #131313; | ||
146 | - color: #ccc; | ||
147 | -} | ||
148 | 96 | ||
149 | #device-details-panel .bottom th, | 97 | #device-details-panel .bottom th, |
150 | #device-details-panel .bottom td { | 98 | #device-details-panel .bottom td { |
... | @@ -152,15 +100,3 @@ | ... | @@ -152,15 +100,3 @@ |
152 | text-align: center; | 100 | text-align: center; |
153 | } | 101 | } |
154 | 102 | ||
155 | -.light #device-details-panel .bottom tr:nth-child(odd) { | ||
156 | - background-color: #f9f9f9; | ||
157 | -} | ||
158 | -.light #device-details-panel .bottom tr:nth-child(even) { | ||
159 | - background-color: #EBEDF2; | ||
160 | -} | ||
161 | -.dark #device-details-panel .bottom tr:nth-child(odd) { | ||
162 | - background-color: #333; | ||
163 | -} | ||
164 | -.dark #device-details-panel .bottom tr:nth-child(even) { | ||
165 | - background-color: #555; | ||
166 | -} | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Flow View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | + | ||
22 | +.light #ov-flow .current-view use { | ||
23 | + fill: white; | ||
24 | +} | ||
25 | +.dark #ov-flow .current-view use { | ||
26 | + fill: #304860; | ||
27 | +} | ||
28 | + | ||
29 | +.light #ov-flow .current-view rect { | ||
30 | + fill: deepskyblue; | ||
31 | +} | ||
32 | +.dark #ov-flow .current-view rect { | ||
33 | + fill: #eee; | ||
34 | +} | ||
35 | + | ||
36 | +.light #ov-flow tr:nth-child(6n + 1), | ||
37 | +.light #ov-flow tr:nth-child(6n + 2), | ||
38 | +.light #ov-flow tr:nth-child(6n + 3) { | ||
39 | + background-color: #eee; | ||
40 | +} | ||
41 | +.light #ov-flow tr:nth-child(6n + 4), | ||
42 | +.light #ov-flow tr:nth-child(6n + 5), | ||
43 | +.light #ov-flow tr:nth-child(6n) { | ||
44 | + background-color: #ddd; | ||
45 | +} | ||
46 | +.dark #ov-flow tr:nth-child(6n + 1), | ||
47 | +.dark #ov-flow tr:nth-child(6n + 2), | ||
48 | +.dark #ov-flow tr:nth-child(6n + 3) { | ||
49 | + background-color: #444; | ||
50 | +} | ||
51 | +.dark #ov-flow tr:nth-child(6n + 4), | ||
52 | +.dark #ov-flow tr:nth-child(6n + 5), | ||
53 | +.dark #ov-flow tr:nth-child(6n) { | ||
54 | + background-color: #333; | ||
55 | +} | ||
56 | + | ||
57 | +/* highlighted color */ | ||
58 | +.light #ov-flow tr:nth-child(6n + 1).data-change, | ||
59 | +.light #ov-flow tr:nth-child(6n + 2).data-change, | ||
60 | +.light #ov-flow tr:nth-child(6n + 3).data-change, | ||
61 | +.light #ov-flow tr:nth-child(6n + 4).data-change, | ||
62 | +.light #ov-flow tr:nth-child(6n + 5).data-change, | ||
63 | +.light #ov-flow tr:nth-child(6n).data-change { | ||
64 | + background-color: #FDFFDC; | ||
65 | +} | ||
66 | +.dark #ov-flow tr:nth-child(6n + 1).data-change, | ||
67 | +.dark #ov-flow tr:nth-child(6n + 2).data-change, | ||
68 | +.dark #ov-flow tr:nth-child(6n + 3).data-change, | ||
69 | +.dark #ov-flow tr:nth-child(6n + 4).data-change, | ||
70 | +.dark #ov-flow tr:nth-child(6n + 5).data-change, | ||
71 | +.dark #ov-flow tr:nth-child(6n).data-change { | ||
72 | + background-color: #5A5600; | ||
73 | +} | ||
74 | + | ||
75 | +#ov-flow td.selector, | ||
76 | +#ov-flow td.treatment { | ||
77 | + opacity: 0.65; | ||
78 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Flow View -- CSS file | 18 | + ONOS GUI -- Flow View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-flow h2 { | 21 | #ov-flow h2 { |
... | @@ -25,59 +25,6 @@ | ... | @@ -25,59 +25,6 @@ |
25 | #ov-flow div.ctrl-btns { | 25 | #ov-flow div.ctrl-btns { |
26 | } | 26 | } |
27 | 27 | ||
28 | -.light #ov-flow .current-view use { | ||
29 | - fill: white; | ||
30 | -} | ||
31 | -.dark #ov-flow .current-view use { | ||
32 | - fill: #304860; | ||
33 | -} | ||
34 | - | ||
35 | -.light #ov-flow .current-view rect { | ||
36 | - fill: deepskyblue; | ||
37 | -} | ||
38 | -.dark #ov-flow .current-view rect { | ||
39 | - fill: #eee; | ||
40 | -} | ||
41 | - | ||
42 | -.light #ov-flow tr:nth-child(6n + 1), | ||
43 | -.light #ov-flow tr:nth-child(6n + 2), | ||
44 | -.light #ov-flow tr:nth-child(6n + 3) { | ||
45 | - background-color: #eee; | ||
46 | -} | ||
47 | -.light #ov-flow tr:nth-child(6n + 4), | ||
48 | -.light #ov-flow tr:nth-child(6n + 5), | ||
49 | -.light #ov-flow tr:nth-child(6n) { | ||
50 | - background-color: #ddd; | ||
51 | -} | ||
52 | -.dark #ov-flow tr:nth-child(6n + 1), | ||
53 | -.dark #ov-flow tr:nth-child(6n + 2), | ||
54 | -.dark #ov-flow tr:nth-child(6n + 3) { | ||
55 | - background-color: #444; | ||
56 | -} | ||
57 | -.dark #ov-flow tr:nth-child(6n + 4), | ||
58 | -.dark #ov-flow tr:nth-child(6n + 5), | ||
59 | -.dark #ov-flow tr:nth-child(6n) { | ||
60 | - background-color: #333; | ||
61 | -} | ||
62 | - | ||
63 | -/* highlighted color */ | ||
64 | -.light #ov-flow tr:nth-child(6n + 1).data-change, | ||
65 | -.light #ov-flow tr:nth-child(6n + 2).data-change, | ||
66 | -.light #ov-flow tr:nth-child(6n + 3).data-change, | ||
67 | -.light #ov-flow tr:nth-child(6n + 4).data-change, | ||
68 | -.light #ov-flow tr:nth-child(6n + 5).data-change, | ||
69 | -.light #ov-flow tr:nth-child(6n).data-change { | ||
70 | - background-color: #FDFFDC; | ||
71 | -} | ||
72 | -.dark #ov-flow tr:nth-child(6n + 1).data-change, | ||
73 | -.dark #ov-flow tr:nth-child(6n + 2).data-change, | ||
74 | -.dark #ov-flow tr:nth-child(6n + 3).data-change, | ||
75 | -.dark #ov-flow tr:nth-child(6n + 4).data-change, | ||
76 | -.dark #ov-flow tr:nth-child(6n + 5).data-change, | ||
77 | -.dark #ov-flow tr:nth-child(6n).data-change { | ||
78 | - background-color: #5A5600; | ||
79 | -} | ||
80 | - | ||
81 | #ov-flow td { | 28 | #ov-flow td { |
82 | text-align: center; | 29 | text-align: center; |
83 | } | 30 | } |
... | @@ -88,5 +35,4 @@ | ... | @@ -88,5 +35,4 @@ |
88 | #ov-flow td.treatment { | 35 | #ov-flow td.treatment { |
89 | text-align: left; | 36 | text-align: left; |
90 | padding-left: 36px; | 37 | padding-left: 36px; |
91 | - opacity: 0.65; | ||
92 | } | 38 | } | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Group View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #ov-group .current-view use { | ||
22 | + fill: white; | ||
23 | +} | ||
24 | +.dark #ov-group .current-view use { | ||
25 | + fill: #304860; | ||
26 | +} | ||
27 | + | ||
28 | +.light #ov-group .current-view rect { | ||
29 | + fill: deepskyblue; | ||
30 | +} | ||
31 | +.dark #ov-group .current-view rect { | ||
32 | + fill: #eee; | ||
33 | +} | ||
34 | + | ||
35 | +.light #ov-group tr:nth-child(4n + 1), | ||
36 | +.light #ov-group tr:nth-child(4n + 2) { | ||
37 | + background-color: #eee; | ||
38 | +} | ||
39 | +.light #ov-group tr:nth-child(4n + 3), | ||
40 | +.light #ov-group tr:nth-child(4n) { | ||
41 | + background-color: #ddd; | ||
42 | +} | ||
43 | +.dark #ov-group tr:nth-child(4n + 1), | ||
44 | +.dark #ov-group tr:nth-child(4n + 2) { | ||
45 | + background-color: #444; | ||
46 | +} | ||
47 | +.dark #ov-group tr:nth-child(4n + 3), | ||
48 | +.dark #ov-group tr:nth-child(4n) { | ||
49 | + background-color: #333; | ||
50 | +} | ||
51 | + | ||
52 | +/* highlighted color */ | ||
53 | +.light #ov-group tr:nth-child(4n + 1).data-change, | ||
54 | +.light #ov-group tr:nth-child(4n + 2).data-change, | ||
55 | +.light #ov-group tr:nth-child(4n + 3).data-change, | ||
56 | +.light #ov-group tr:nth-child(4n).data-change { | ||
57 | + background-color: #FDFFDC; | ||
58 | +} | ||
59 | +.dark #ov-group tr:nth-child(4n + 1).data-change, | ||
60 | +.dark #ov-group tr:nth-child(4n + 2).data-change, | ||
61 | +.dark #ov-group tr:nth-child(4n + 3).data-change, | ||
62 | +.dark #ov-group tr:nth-child(4n).data-change { | ||
63 | + background-color: #5A5600; | ||
64 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Group View -- CSS file | 18 | + ONOS GUI -- Group View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-group h2 { | 21 | #ov-group h2 { |
... | @@ -25,50 +25,7 @@ | ... | @@ -25,50 +25,7 @@ |
25 | #ov-group div.ctrl-btns { | 25 | #ov-group div.ctrl-btns { |
26 | } | 26 | } |
27 | 27 | ||
28 | -.light #ov-group .current-view use { | ||
29 | - fill: white; | ||
30 | -} | ||
31 | -.dark #ov-group .current-view use { | ||
32 | - fill: #304860; | ||
33 | -} | ||
34 | - | ||
35 | -.light #ov-group .current-view rect { | ||
36 | - fill: deepskyblue; | ||
37 | -} | ||
38 | -.dark #ov-group .current-view rect { | ||
39 | - fill: #eee; | ||
40 | -} | ||
41 | - | ||
42 | -.light #ov-group tr:nth-child(4n + 1), | ||
43 | -.light #ov-group tr:nth-child(4n + 2) { | ||
44 | - background-color: #eee; | ||
45 | -} | ||
46 | -.light #ov-group tr:nth-child(4n + 3), | ||
47 | -.light #ov-group tr:nth-child(4n) { | ||
48 | - background-color: #ddd; | ||
49 | -} | ||
50 | -.dark #ov-group tr:nth-child(4n + 1), | ||
51 | -.dark #ov-group tr:nth-child(4n + 2) { | ||
52 | - background-color: #444; | ||
53 | -} | ||
54 | -.dark #ov-group tr:nth-child(4n + 3), | ||
55 | -.dark #ov-group tr:nth-child(4n) { | ||
56 | - background-color: #333; | ||
57 | -} | ||
58 | 28 | ||
59 | -/* highlighted color */ | ||
60 | -.light #ov-group tr:nth-child(4n + 1).data-change, | ||
61 | -.light #ov-group tr:nth-child(4n + 2).data-change, | ||
62 | -.light #ov-group tr:nth-child(4n + 3).data-change, | ||
63 | -.light #ov-group tr:nth-child(4n).data-change { | ||
64 | - background-color: #FDFFDC; | ||
65 | -} | ||
66 | -.dark #ov-group tr:nth-child(4n + 1).data-change, | ||
67 | -.dark #ov-group tr:nth-child(4n + 2).data-change, | ||
68 | -.dark #ov-group tr:nth-child(4n + 3).data-change, | ||
69 | -.dark #ov-group tr:nth-child(4n).data-change { | ||
70 | - background-color: #5A5600; | ||
71 | -} | ||
72 | 29 | ||
73 | #ov-group td { | 30 | #ov-group td { |
74 | text-align: center; | 31 | text-align: center; | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Intent View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #ov-intent tr:nth-child(6n + 1), | ||
22 | +.light #ov-intent tr:nth-child(6n + 2), | ||
23 | +.light #ov-intent tr:nth-child(6n + 3) { | ||
24 | + background-color: #eee; | ||
25 | +} | ||
26 | +.light #ov-intent tr:nth-child(6n + 4), | ||
27 | +.light #ov-intent tr:nth-child(6n + 5), | ||
28 | +.light #ov-intent tr:nth-child(6n) { | ||
29 | + background-color: #ddd; | ||
30 | +} | ||
31 | +.dark #ov-intent tr:nth-child(6n + 1), | ||
32 | +.dark #ov-intent tr:nth-child(6n + 2), | ||
33 | +.dark #ov-intent tr:nth-child(6n + 3) { | ||
34 | + background-color: #444; | ||
35 | +} | ||
36 | +.dark #ov-intent tr:nth-child(6n + 4), | ||
37 | +.dark #ov-intent tr:nth-child(6n + 5), | ||
38 | +.dark #ov-intent tr:nth-child(6n) { | ||
39 | + background-color: #333; | ||
40 | +} | ||
41 | + | ||
42 | +.light #ov-intent tr:nth-child(6n + 1).data-change, | ||
43 | +.light #ov-intent tr:nth-child(6n + 2).data-change, | ||
44 | +.light #ov-intent tr:nth-child(6n + 3).data-change, | ||
45 | +.light #ov-intent tr:nth-child(6n + 4).data-change, | ||
46 | +.light #ov-intent tr:nth-child(6n + 5).data-change, | ||
47 | +.light #ov-intent tr:nth-child(6n).data-change { | ||
48 | + background-color: #FDFFDC; | ||
49 | +} | ||
50 | +.dark #ov-intent tr:nth-child(6n + 1).data-change, | ||
51 | +.dark #ov-intent tr:nth-child(6n + 2).data-change, | ||
52 | +.dark #ov-intent tr:nth-child(6n + 3).data-change, | ||
53 | +.dark #ov-intent tr:nth-child(6n + 4).data-change, | ||
54 | +.dark #ov-intent tr:nth-child(6n + 5).data-change, | ||
55 | +.dark #ov-intent tr:nth-child(6n).data-change { | ||
56 | + background-color: #5A5600; | ||
57 | +} | ||
58 | + | ||
59 | +#ov-intent td.resources, | ||
60 | +#ov-intent td.details { | ||
61 | + opacity: 0.65; | ||
62 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Intent View -- CSS file | 18 | + ONOS GUI -- Intent View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-intent h2 { | 21 | #ov-intent h2 { |
... | @@ -25,46 +25,8 @@ | ... | @@ -25,46 +25,8 @@ |
25 | #ov-intent div.ctrl-btns { | 25 | #ov-intent div.ctrl-btns { |
26 | } | 26 | } |
27 | 27 | ||
28 | -.light #ov-intent tr:nth-child(6n + 1), | ||
29 | -.light #ov-intent tr:nth-child(6n + 2), | ||
30 | -.light #ov-intent tr:nth-child(6n + 3) { | ||
31 | - background-color: #eee; | ||
32 | -} | ||
33 | -.light #ov-intent tr:nth-child(6n + 4), | ||
34 | -.light #ov-intent tr:nth-child(6n + 5), | ||
35 | -.light #ov-intent tr:nth-child(6n) { | ||
36 | - background-color: #ddd; | ||
37 | -} | ||
38 | -.dark #ov-intent tr:nth-child(6n + 1), | ||
39 | -.dark #ov-intent tr:nth-child(6n + 2), | ||
40 | -.dark #ov-intent tr:nth-child(6n + 3) { | ||
41 | - background-color: #444; | ||
42 | -} | ||
43 | -.dark #ov-intent tr:nth-child(6n + 4), | ||
44 | -.dark #ov-intent tr:nth-child(6n + 5), | ||
45 | -.dark #ov-intent tr:nth-child(6n) { | ||
46 | - background-color: #333; | ||
47 | -} | ||
48 | - | ||
49 | -.light #ov-intent tr:nth-child(6n + 1).data-change, | ||
50 | -.light #ov-intent tr:nth-child(6n + 2).data-change, | ||
51 | -.light #ov-intent tr:nth-child(6n + 3).data-change, | ||
52 | -.light #ov-intent tr:nth-child(6n + 4).data-change, | ||
53 | -.light #ov-intent tr:nth-child(6n + 5).data-change, | ||
54 | -.light #ov-intent tr:nth-child(6n).data-change { | ||
55 | - background-color: #FDFFDC; | ||
56 | -} | ||
57 | -.dark #ov-intent tr:nth-child(6n + 1).data-change, | ||
58 | -.dark #ov-intent tr:nth-child(6n + 2).data-change, | ||
59 | -.dark #ov-intent tr:nth-child(6n + 3).data-change, | ||
60 | -.dark #ov-intent tr:nth-child(6n + 4).data-change, | ||
61 | -.dark #ov-intent tr:nth-child(6n + 5).data-change, | ||
62 | -.dark #ov-intent tr:nth-child(6n).data-change { | ||
63 | - background-color: #5A5600; | ||
64 | -} | ||
65 | 28 | ||
66 | #ov-intent td.resources, | 29 | #ov-intent td.resources, |
67 | #ov-intent td.details { | 30 | #ov-intent td.details { |
68 | padding-left: 36px; | 31 | padding-left: 36px; |
69 | - opacity: 0.65; | ||
70 | } | 32 | } | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Meter View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #ov-meter .current-view use { | ||
22 | + fill: white; | ||
23 | +} | ||
24 | +.dark #ov-meter .current-view use { | ||
25 | + fill: #304860; | ||
26 | +} | ||
27 | + | ||
28 | +.light #ov-meter .current-view rect { | ||
29 | + fill: deepskyblue; | ||
30 | +} | ||
31 | +.dark #ov-meter .current-view rect { | ||
32 | + fill: #eee; | ||
33 | +} | ||
34 | + | ||
35 | +.light #ov-meter tr:nth-child(4n + 1), | ||
36 | +.light #ov-meter tr:nth-child(4n + 2) { | ||
37 | + background-color: #eee; | ||
38 | +} | ||
39 | +.light #ov-meter tr:nth-child(4n + 3), | ||
40 | +.light #ov-meter tr:nth-child(4n) { | ||
41 | + background-color: #ddd; | ||
42 | +} | ||
43 | +.dark #ov-meter tr:nth-child(4n + 1), | ||
44 | +.dark #ov-meter tr:nth-child(4n + 2) { | ||
45 | + background-color: #444; | ||
46 | +} | ||
47 | +.dark #ov-meter tr:nth-child(4n + 3), | ||
48 | +.dark #ov-meter tr:nth-child(4n) { | ||
49 | + background-color: #333; | ||
50 | +} | ||
51 | + | ||
52 | +/* highlighted color */ | ||
53 | +.light #ov-meter tr:nth-child(4n + 1).data-change, | ||
54 | +.light #ov-meter tr:nth-child(4n + 2).data-change, | ||
55 | +.light #ov-meter tr:nth-child(4n + 3).data-change, | ||
56 | +.light #ov-meter tr:nth-child(4n).data-change { | ||
57 | + background-color: #FDFFDC; | ||
58 | +} | ||
59 | +.dark #ov-meter tr:nth-child(4n + 1).data-change, | ||
60 | +.dark #ov-meter tr:nth-child(4n + 2).data-change, | ||
61 | +.dark #ov-meter tr:nth-child(4n + 3).data-change, | ||
62 | +.dark #ov-meter tr:nth-child(4n).data-change { | ||
63 | + background-color: #5A5600; | ||
64 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Meter View -- CSS file | 18 | + ONOS GUI -- Meter View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-meter h2 { | 21 | #ov-meter h2 { |
... | @@ -25,51 +25,6 @@ | ... | @@ -25,51 +25,6 @@ |
25 | #ov-meter div.ctrl-btns { | 25 | #ov-meter div.ctrl-btns { |
26 | } | 26 | } |
27 | 27 | ||
28 | -.light #ov-meter .current-view use { | ||
29 | - fill: white; | ||
30 | -} | ||
31 | -.dark #ov-meter .current-view use { | ||
32 | - fill: #304860; | ||
33 | -} | ||
34 | - | ||
35 | -.light #ov-meter .current-view rect { | ||
36 | - fill: deepskyblue; | ||
37 | -} | ||
38 | -.dark #ov-meter .current-view rect { | ||
39 | - fill: #eee; | ||
40 | -} | ||
41 | - | ||
42 | -.light #ov-meter tr:nth-child(4n + 1), | ||
43 | -.light #ov-meter tr:nth-child(4n + 2) { | ||
44 | - background-color: #eee; | ||
45 | -} | ||
46 | -.light #ov-meter tr:nth-child(4n + 3), | ||
47 | -.light #ov-meter tr:nth-child(4n) { | ||
48 | - background-color: #ddd; | ||
49 | -} | ||
50 | -.dark #ov-meter tr:nth-child(4n + 1), | ||
51 | -.dark #ov-meter tr:nth-child(4n + 2) { | ||
52 | - background-color: #444; | ||
53 | -} | ||
54 | -.dark #ov-meter tr:nth-child(4n + 3), | ||
55 | -.dark #ov-meter tr:nth-child(4n) { | ||
56 | - background-color: #333; | ||
57 | -} | ||
58 | - | ||
59 | -/* highlighted color */ | ||
60 | -.light #ov-meter tr:nth-child(4n + 1).data-change, | ||
61 | -.light #ov-meter tr:nth-child(4n + 2).data-change, | ||
62 | -.light #ov-meter tr:nth-child(4n + 3).data-change, | ||
63 | -.light #ov-meter tr:nth-child(4n).data-change { | ||
64 | - background-color: #FDFFDC; | ||
65 | -} | ||
66 | -.dark #ov-meter tr:nth-child(4n + 1).data-change, | ||
67 | -.dark #ov-meter tr:nth-child(4n + 2).data-change, | ||
68 | -.dark #ov-meter tr:nth-child(4n + 3).data-change, | ||
69 | -.dark #ov-meter tr:nth-child(4n).data-change { | ||
70 | - background-color: #5A5600; | ||
71 | -} | ||
72 | - | ||
73 | #ov-meter td { | 28 | #ov-meter td { |
74 | text-align: center; | 29 | text-align: center; |
75 | } | 30 | } | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Port View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #ov-port .current-view use { | ||
22 | + fill: white; | ||
23 | +} | ||
24 | +.dark #ov-port .current-view use { | ||
25 | + fill: #304860; | ||
26 | +} | ||
27 | + | ||
28 | +.light #ov-port .current-view rect { | ||
29 | + fill: deepskyblue; | ||
30 | +} | ||
31 | +.dark #ov-port .current-view rect { | ||
32 | + fill: #eee; | ||
33 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Port View -- CSS file | 18 | + ONOS GUI -- Port View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-port h2 { | 21 | #ov-port h2 { |
... | @@ -25,20 +25,6 @@ | ... | @@ -25,20 +25,6 @@ |
25 | #ov-port div.ctrl-btns { | 25 | #ov-port div.ctrl-btns { |
26 | } | 26 | } |
27 | 27 | ||
28 | -.light #ov-port .current-view use { | ||
29 | - fill: white; | ||
30 | -} | ||
31 | -.dark #ov-port .current-view use { | ||
32 | - fill: #304860; | ||
33 | -} | ||
34 | - | ||
35 | -.light #ov-port .current-view rect { | ||
36 | - fill: deepskyblue; | ||
37 | -} | ||
38 | -.dark #ov-port .current-view rect { | ||
39 | - fill: #eee; | ||
40 | -} | ||
41 | - | ||
42 | #ov-port td { | 28 | #ov-port td { |
43 | text-align: center; | 29 | text-align: center; |
44 | } | 30 | } | ... | ... |
1 | +/* | ||
2 | + * Copyright 2016-present Open Networking Laboratory | ||
3 | + * | ||
4 | + * Licensed under the Apache License, Version 2.0 (the "License"); | ||
5 | + * you may not use this file except in compliance with the License. | ||
6 | + * You may obtain a copy of the License at | ||
7 | + * | ||
8 | + * http://www.apache.org/licenses/LICENSE-2.0 | ||
9 | + * | ||
10 | + * Unless required by applicable law or agreed to in writing, software | ||
11 | + * distributed under the License is distributed on an "AS IS" BASIS, | ||
12 | + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
13 | + * See the License for the specific language governing permissions and | ||
14 | + * limitations under the License. | ||
15 | + */ | ||
16 | + | ||
17 | +/* | ||
18 | + ONOS GUI -- Processor View (theme) -- CSS file | ||
19 | + */ | ||
20 | + | ||
21 | +.light #ov-processor .current-view use { | ||
22 | + fill: white; | ||
23 | +} | ||
24 | +.dark #ov-processor .current-view use { | ||
25 | + fill: #304860; | ||
26 | +} | ||
27 | + | ||
28 | +.light #ov-processor .current-view rect { | ||
29 | + fill: deepskyblue; | ||
30 | +} | ||
31 | +.dark #ov-processor .current-view rect { | ||
32 | + fill: #eee; | ||
33 | +} |
... | @@ -15,7 +15,7 @@ | ... | @@ -15,7 +15,7 @@ |
15 | */ | 15 | */ |
16 | 16 | ||
17 | /* | 17 | /* |
18 | - ONOS GUI -- Processor View -- CSS file | 18 | + ONOS GUI -- Processor View (layout) -- CSS file |
19 | */ | 19 | */ |
20 | 20 | ||
21 | #ov-processor h2 { | 21 | #ov-processor h2 { |
... | @@ -26,20 +26,6 @@ | ... | @@ -26,20 +26,6 @@ |
26 | width: 40px; | 26 | width: 40px; |
27 | } | 27 | } |
28 | 28 | ||
29 | -.light #ov-processor .current-view use { | ||
30 | - fill: white; | ||
31 | -} | ||
32 | -.dark #ov-processor .current-view use { | ||
33 | - fill: #304860; | ||
34 | -} | ||
35 | - | ||
36 | -.light #ov-processor .current-view rect { | ||
37 | - fill: deepskyblue; | ||
38 | -} | ||
39 | -.dark #ov-processor .current-view rect { | ||
40 | - fill: #eee; | ||
41 | -} | ||
42 | - | ||
43 | #ov-processor td.number { | 29 | #ov-processor td.number { |
44 | text-align: right; | 30 | text-align: right; |
45 | } | 31 | } | ... | ... |
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
... | @@ -93,21 +93,35 @@ | ... | @@ -93,21 +93,35 @@ |
93 | 93 | ||
94 | <!-- TODO: use a single catenated-minified file here --> | 94 | <!-- TODO: use a single catenated-minified file here --> |
95 | <link rel="stylesheet" href="app/onos.css"> | 95 | <link rel="stylesheet" href="app/onos.css"> |
96 | + <link rel="stylesheet" href="app/onos-theme.css"> | ||
96 | <link rel="stylesheet" href="app/common.css"> | 97 | <link rel="stylesheet" href="app/common.css"> |
97 | <link rel="stylesheet" href="app/fw/mast/mast.css"> | 98 | <link rel="stylesheet" href="app/fw/mast/mast.css"> |
99 | + <link rel="stylesheet" href="app/fw/mast/mast-theme.css"> | ||
98 | <link rel="stylesheet" href="app/fw/svg/glyph.css"> | 100 | <link rel="stylesheet" href="app/fw/svg/glyph.css"> |
101 | + <link rel="stylesheet" href="app/fw/svg/glyph-theme.css"> | ||
99 | <link rel="stylesheet" href="app/fw/svg/icon.css"> | 102 | <link rel="stylesheet" href="app/fw/svg/icon.css"> |
103 | + <link rel="stylesheet" href="app/fw/svg/icon-theme.css"> | ||
100 | <link rel="stylesheet" href="app/fw/layer/panel.css"> | 104 | <link rel="stylesheet" href="app/fw/layer/panel.css"> |
105 | + <link rel="stylesheet" href="app/fw/layer/panel-theme.css"> | ||
101 | <link rel="stylesheet" href="app/fw/layer/dialog.css"> | 106 | <link rel="stylesheet" href="app/fw/layer/dialog.css"> |
107 | + <link rel="stylesheet" href="app/fw/layer/dialog-theme.css"> | ||
102 | <link rel="stylesheet" href="app/fw/layer/flash.css"> | 108 | <link rel="stylesheet" href="app/fw/layer/flash.css"> |
109 | + <link rel="stylesheet" href="app/fw/layer/flash-theme.css"> | ||
103 | <link rel="stylesheet" href="app/fw/layer/quickhelp.css"> | 110 | <link rel="stylesheet" href="app/fw/layer/quickhelp.css"> |
111 | + <link rel="stylesheet" href="app/fw/layer/quickhelp-theme.css"> | ||
104 | <link rel="stylesheet" href="app/fw/layer/veil.css"> | 112 | <link rel="stylesheet" href="app/fw/layer/veil.css"> |
113 | + <link rel="stylesheet" href="app/fw/layer/veil-theme.css"> | ||
105 | <link rel="stylesheet" href="app/fw/layer/loading.css"> | 114 | <link rel="stylesheet" href="app/fw/layer/loading.css"> |
106 | <link rel="stylesheet" href="app/fw/nav/nav.css"> | 115 | <link rel="stylesheet" href="app/fw/nav/nav.css"> |
116 | + <link rel="stylesheet" href="app/fw/nav/nav-theme.css"> | ||
107 | <link rel="stylesheet" href="app/fw/widget/button.css"> | 117 | <link rel="stylesheet" href="app/fw/widget/button.css"> |
118 | + <link rel="stylesheet" href="app/fw/widget/button-theme.css"> | ||
108 | <link rel="stylesheet" href="app/fw/widget/toolbar.css"> | 119 | <link rel="stylesheet" href="app/fw/widget/toolbar.css"> |
120 | + <link rel="stylesheet" href="app/fw/widget/toolbar-theme.css"> | ||
109 | <link rel="stylesheet" href="app/fw/widget/tooltip.css"> | 121 | <link rel="stylesheet" href="app/fw/widget/tooltip.css"> |
122 | + <link rel="stylesheet" href="app/fw/widget/tooltip-theme.css"> | ||
110 | <link rel="stylesheet" href="app/fw/widget/table.css"> | 123 | <link rel="stylesheet" href="app/fw/widget/table.css"> |
124 | + <link rel="stylesheet" href="app/fw/widget/table-theme.css"> | ||
111 | 125 | ||
112 | <!-- Builtin views javascript. --> | 126 | <!-- Builtin views javascript. --> |
113 | <script src="app/view/topo/topo.js"></script> | 127 | <script src="app/view/topo/topo.js"></script> |
... | @@ -148,18 +162,27 @@ | ... | @@ -148,18 +162,27 @@ |
148 | 162 | ||
149 | <!-- Builtin views stylesheets. --> | 163 | <!-- Builtin views stylesheets. --> |
150 | <link rel="stylesheet" href="app/view/topo/topo.css"> | 164 | <link rel="stylesheet" href="app/view/topo/topo.css"> |
165 | + <link rel="stylesheet" href="app/view/topo/topo-theme.css"> | ||
151 | <link rel="stylesheet" href="app/view/device/device.css"> | 166 | <link rel="stylesheet" href="app/view/device/device.css"> |
167 | + <link rel="stylesheet" href="app/view/device/device-theme.css"> | ||
152 | <link rel="stylesheet" href="app/view/flow/flow.css"> | 168 | <link rel="stylesheet" href="app/view/flow/flow.css"> |
169 | + <link rel="stylesheet" href="app/view/flow/flow-theme.css"> | ||
153 | <link rel="stylesheet" href="app/view/port/port.css"> | 170 | <link rel="stylesheet" href="app/view/port/port.css"> |
171 | + <link rel="stylesheet" href="app/view/port/port-theme.css"> | ||
154 | <link rel="stylesheet" href="app/view/group/group.css"> | 172 | <link rel="stylesheet" href="app/view/group/group.css"> |
173 | + <link rel="stylesheet" href="app/view/group/group-theme.css"> | ||
155 | <link rel="stylesheet" href="app/view/meter/meter.css"> | 174 | <link rel="stylesheet" href="app/view/meter/meter.css"> |
175 | + <link rel="stylesheet" href="app/view/meter/meter-theme.css"> | ||
156 | <link rel="stylesheet" href="app/view/link/link.css"> | 176 | <link rel="stylesheet" href="app/view/link/link.css"> |
157 | <link rel="stylesheet" href="app/view/host/host.css"> | 177 | <link rel="stylesheet" href="app/view/host/host.css"> |
158 | <link rel="stylesheet" href="app/view/intent/intent.css"> | 178 | <link rel="stylesheet" href="app/view/intent/intent.css"> |
179 | + <link rel="stylesheet" href="app/view/intent/intent-theme.css"> | ||
159 | <link rel="stylesheet" href="app/view/app/app.css"> | 180 | <link rel="stylesheet" href="app/view/app/app.css"> |
181 | + <link rel="stylesheet" href="app/view/app/app-theme.css"> | ||
160 | <link rel="stylesheet" href="app/view/settings/settings.css"> | 182 | <link rel="stylesheet" href="app/view/settings/settings.css"> |
161 | <link rel="stylesheet" href="app/view/cluster/cluster.css"> | 183 | <link rel="stylesheet" href="app/view/cluster/cluster.css"> |
162 | <link rel="stylesheet" href="app/view/processor/processor.css"> | 184 | <link rel="stylesheet" href="app/view/processor/processor.css"> |
185 | + <link rel="stylesheet" href="app/view/processor/processor-theme.css"> | ||
163 | <link rel="stylesheet" href="app/view/tunnel/tunnel.css"> | 186 | <link rel="stylesheet" href="app/view/tunnel/tunnel.css"> |
164 | 187 | ||
165 | <!-- Contributed stylesheets injected here --> | 188 | <!-- Contributed stylesheets injected here --> | ... | ... |
-
Please register or login to post a comment