Simon Hunt | ef31fb2 | 2014-12-19 13:16:44 -0800 | [diff] [blame] | 1 | /* |
Simon Hunt | 8ead3a2 | 2015-01-06 11:00:15 -0800 | [diff] [blame] | 2 | * Copyright 2014,2015 Open Networking Laboratory |
Simon Hunt | ef31fb2 | 2014-12-19 13:16:44 -0800 | [diff] [blame] | 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 -- Topology View -- CSS file |
Simon Hunt | ef31fb2 | 2014-12-19 13:16:44 -0800 | [diff] [blame] | 19 | */ |
| 20 | |
Simon Hunt | 7c8ab8d | 2015-02-03 15:05:15 -0800 | [diff] [blame] | 21 | /* --- Base SVG Layer --- */ |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 22 | |
Simon Hunt | d552ee9 | 2015-04-02 17:06:35 -0700 | [diff] [blame] | 23 | #ov-topo svg { |
| 24 | /* prevents the little cut/copy/paste square that would appear on iPad */ |
| 25 | -webkit-user-select: none; |
| 26 | } |
Simon Hunt | 5ee36e0 | 2015-01-15 10:33:20 -0800 | [diff] [blame] | 27 | .light #ov-topo svg { |
Simon Hunt | 426bd86 | 2015-01-14 16:48:41 -0800 | [diff] [blame] | 28 | background-color: #fff; |
Simon Hunt | 6cc5369 | 2015-01-07 11:33:45 -0800 | [diff] [blame] | 29 | } |
Simon Hunt | 5ee36e0 | 2015-01-15 10:33:20 -0800 | [diff] [blame] | 30 | .dark #ov-topo svg { |
| 31 | background-color: #2b2b2b; |
| 32 | } |
Simon Hunt | 426bd86 | 2015-01-14 16:48:41 -0800 | [diff] [blame] | 33 | |
Simon Hunt | 7c8ab8d | 2015-02-03 15:05:15 -0800 | [diff] [blame] | 34 | |
| 35 | /* --- "No Devices" Layer --- */ |
| 36 | |
| 37 | #ov-topo svg #topo-noDevsLayer { |
| 38 | visibility: hidden; |
| 39 | } |
| 40 | |
| 41 | .light #ov-topo svg .noDevsBird { |
| 42 | fill: #ecd; |
| 43 | } |
| 44 | .dark #ov-topo svg .noDevsBird { |
| 45 | fill: #683434; |
| 46 | } |
| 47 | |
| 48 | #ov-topo svg #topo-noDevsLayer text { |
| 49 | font-size: 60pt; |
| 50 | font-style: italic; |
| 51 | } |
| 52 | .light #ov-topo svg #topo-noDevsLayer text { |
| 53 | fill: #dde; |
| 54 | } |
| 55 | .dark #ov-topo svg #topo-noDevsLayer text { |
| 56 | fill: #3b3b4f; |
| 57 | } |
| 58 | |
| 59 | |
| 60 | /* --- Topo Map --- */ |
| 61 | |
Simon Hunt | 426bd86 | 2015-01-14 16:48:41 -0800 | [diff] [blame] | 62 | #ov-topo svg #topo-map { |
| 63 | stroke-width: 2px; |
Simon Hunt | 426bd86 | 2015-01-14 16:48:41 -0800 | [diff] [blame] | 64 | fill: transparent; |
Simon Hunt | 5ee36e0 | 2015-01-15 10:33:20 -0800 | [diff] [blame] | 65 | } |
| 66 | |
| 67 | .light #ov-topo svg #topo-map { |
Simon Hunt | 445e815 | 2015-02-06 13:00:12 -0800 | [diff] [blame] | 68 | stroke: #eee; |
Simon Hunt | 5ee36e0 | 2015-01-15 10:33:20 -0800 | [diff] [blame] | 69 | } |
| 70 | .dark #ov-topo svg #topo-map { |
| 71 | stroke: #444; |
| 72 | } |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 73 | |
| 74 | |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 75 | /* --- Topo Summary Panel --- */ |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 76 | |
| 77 | #topo-p-summary { |
| 78 | /* Base css from panel.css */ |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 79 | } |
| 80 | |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 81 | /* --- Topo Detail Panel --- */ |
| 82 | |
| 83 | #topo-p-detail { |
| 84 | /* Base css from panel.css */ |
Bri Prebilic Cole | 684bcb7 | 2015-05-11 12:00:24 -0700 | [diff] [blame] | 85 | top: 310px; |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 86 | } |
Bri Prebilic Cole | d874546 | 2015-06-01 16:08:57 -0700 | [diff] [blame^] | 87 | html[data-platform='iPad'] #topo-p-detail { |
| 88 | top: 326px; |
| 89 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 90 | |
Bri Prebilic Cole | f5e48b1 | 2015-04-21 14:52:36 -0700 | [diff] [blame] | 91 | #topo-p-detail .actionBtns .actionBtn { |
| 92 | display: inline-block; |
| 93 | } |
| 94 | #topo-p-detail .actionBtns .actionBtn svg { |
| 95 | width: 30px; |
| 96 | height: 30px; |
| 97 | } |
| 98 | |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 99 | /* --- general topo-panel styling --- */ |
| 100 | |
Bri Prebilic Cole | 8d3de3d | 2015-05-15 16:02:59 -0700 | [diff] [blame] | 101 | .topo-p div.header div.icon { |
| 102 | vertical-align: middle; |
| 103 | display: inline-block; |
| 104 | } |
Bri Prebilic Cole | 684bcb7 | 2015-05-11 12:00:24 -0700 | [diff] [blame] | 105 | .topo-p div.body { |
| 106 | overflow-y: scroll; |
| 107 | } |
| 108 | |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 109 | .topo-p svg { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 110 | display: inline-block; |
| 111 | width: 42px; |
| 112 | height: 42px; |
| 113 | } |
| 114 | |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 115 | .light .topo-p svg .glyph { |
| 116 | fill: #222; |
| 117 | } |
| 118 | |
| 119 | .dark .topo-p svg .glyph.overlay { |
| 120 | fill: #222; |
| 121 | } |
| 122 | |
| 123 | .dark .topo-p svg .glyph { |
| 124 | fill: #ddd; |
| 125 | } |
| 126 | .light .topo-p svg .glyph.overlay { |
| 127 | fill: #fff; |
| 128 | } |
| 129 | |
| 130 | |
| 131 | .topo-p h2 { |
Bri Prebilic Cole | 684bcb7 | 2015-05-11 12:00:24 -0700 | [diff] [blame] | 132 | padding: 0 4px; |
| 133 | margin: 0; |
Bri Prebilic Cole | 8d3de3d | 2015-05-15 16:02:59 -0700 | [diff] [blame] | 134 | word-break: break-all; |
| 135 | display: inline-block; |
| 136 | width: 210px; |
| 137 | vertical-align: middle; |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 138 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 139 | .light .topo-p h2 { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 140 | color: black; |
| 141 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 142 | .dark .topo-p h2 { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 143 | color: #ddd; |
| 144 | } |
| 145 | |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 146 | .topo-p h3 { |
Bri Prebilic Cole | 684bcb7 | 2015-05-11 12:00:24 -0700 | [diff] [blame] | 147 | padding: 0 4px; |
| 148 | margin: 0; |
Bri Prebilic Cole | 8d3de3d | 2015-05-15 16:02:59 -0700 | [diff] [blame] | 149 | word-break: break-all; |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 150 | top: 20px; |
| 151 | left: 50px; |
| 152 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 153 | .light .topo-p h3 { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 154 | color: black; |
| 155 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 156 | .dark .topo-p h3 { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 157 | color: #ddd; |
| 158 | } |
| 159 | |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 160 | .topo-p p, table { |
Bri Prebilic Cole | 684bcb7 | 2015-05-11 12:00:24 -0700 | [diff] [blame] | 161 | padding: 4px; |
| 162 | margin: 0; |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 163 | } |
| 164 | |
Bri Prebilic Cole | 684bcb7 | 2015-05-11 12:00:24 -0700 | [diff] [blame] | 165 | .topo-p td { |
Bri Prebilic Cole | 8d3de3d | 2015-05-15 16:02:59 -0700 | [diff] [blame] | 166 | word-break: break-all; |
Bri Prebilic Cole | 684bcb7 | 2015-05-11 12:00:24 -0700 | [diff] [blame] | 167 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 168 | .topo-p td.label { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 169 | font-style: italic; |
| 170 | padding-right: 12px; |
| 171 | /* works for both light and dark themes ... */ |
| 172 | color: #777; |
| 173 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 174 | .topo-p td.value { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 175 | } |
| 176 | |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 177 | .topo-p hr { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 178 | height: 1px; |
| 179 | border: 0; |
| 180 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 181 | .light .topo-p hr { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 182 | background-color: #ccc; |
| 183 | color: #ccc; |
| 184 | } |
Simon Hunt | 08f841d0 | 2015-02-10 14:39:20 -0800 | [diff] [blame] | 185 | .dark .topo-p hr { |
Simon Hunt | 626d210 | 2015-01-29 11:54:50 -0800 | [diff] [blame] | 186 | background-color: #888; |
| 187 | color: #888; |
| 188 | } |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 189 | |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 190 | /* --- Topo Instance Panel --- */ |
| 191 | |
| 192 | #topo-p-instance { |
| 193 | height: 100px; |
| 194 | } |
| 195 | |
| 196 | #topo-p-instance div.onosInst { |
| 197 | display: inline-block; |
| 198 | width: 170px; |
| 199 | height: 85px; |
| 200 | cursor: pointer; |
| 201 | } |
| 202 | |
| 203 | #topo-p-instance svg rect { |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 204 | stroke-width: 3.5; |
| 205 | } |
| 206 | #topo-p-instance .online svg rect { |
| 207 | opacity: 1; |
Simon Hunt | a57d681 | 2015-02-02 18:34:04 -0800 | [diff] [blame] | 208 | } |
| 209 | .light #topo-p-instance svg rect { |
| 210 | fill: #ccc; |
| 211 | stroke: #aaa; |
| 212 | } |
| 213 | .light #topo-p-instance .online svg rect { |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 214 | fill: #9cf; |
| 215 | stroke: #555; |
| 216 | } |
Simon Hunt | a57d681 | 2015-02-02 18:34:04 -0800 | [diff] [blame] | 217 | .dark #topo-p-instance svg rect { |
| 218 | fill: #666; |
| 219 | stroke: #222; |
| 220 | } |
| 221 | .dark #topo-p-instance .online svg rect { |
| 222 | fill: #9cf; |
| 223 | stroke: #999; |
| 224 | } |
| 225 | |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 226 | |
| 227 | #topo-p-instance svg .glyph { |
| 228 | fill: #888; |
| 229 | fill-rule: evenodd; |
| 230 | } |
| 231 | #topo-p-instance .online svg .glyph { |
| 232 | fill: #000; |
| 233 | } |
| 234 | |
| 235 | #topo-p-instance svg .badgeIcon { |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 236 | fill-rule: evenodd; |
Simon Hunt | a57d681 | 2015-02-02 18:34:04 -0800 | [diff] [blame] | 237 | opacity: 0.4; |
| 238 | } |
| 239 | .light #topo-p-instance svg .badgeIcon { |
| 240 | fill: #777; |
| 241 | } |
| 242 | .dark #topo-p-instance svg .badgeIcon { |
| 243 | fill: #555; |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 244 | } |
| 245 | |
| 246 | #topo-p-instance .online svg .badgeIcon { |
Simon Hunt | a57d681 | 2015-02-02 18:34:04 -0800 | [diff] [blame] | 247 | opacity: 1.0; |
| 248 | } |
| 249 | .light #topo-p-instance .online svg .badgeIcon { |
| 250 | fill: #fff; |
| 251 | } |
| 252 | .dark #topo-p-instance .online svg .badgeIcon { |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 253 | fill: #fff; |
| 254 | } |
| 255 | |
| 256 | #topo-p-instance svg text { |
| 257 | text-anchor: middle; |
Simon Hunt | a57d681 | 2015-02-02 18:34:04 -0800 | [diff] [blame] | 258 | opacity: 0.3; |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 259 | } |
| 260 | #topo-p-instance .online svg text { |
Simon Hunt | a57d681 | 2015-02-02 18:34:04 -0800 | [diff] [blame] | 261 | opacity: 1.0; |
| 262 | } |
| 263 | .light #topo-p-instance svg text { |
| 264 | fill: #444; |
| 265 | } |
| 266 | .light #topo-p-instance .online svg text { |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 267 | fill: #eee; |
| 268 | } |
Simon Hunt | a57d681 | 2015-02-02 18:34:04 -0800 | [diff] [blame] | 269 | .dark #topo-p-instance svg text { |
| 270 | fill: #aaa; |
| 271 | } |
| 272 | .dark #topo-p-instance .online svg text { |
| 273 | fill: #ccc; |
| 274 | } |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 275 | |
| 276 | #topo-p-instance svg text.instTitle { |
| 277 | font-size: 11pt; |
| 278 | font-weight: bold; |
| 279 | } |
| 280 | #topo-p-instance svg text.instLabel { |
| 281 | font-size: 9pt; |
| 282 | font-style: italic; |
| 283 | } |
| 284 | |
| 285 | #topo-p-instance .onosInst.mastership { |
| 286 | opacity: 0.3; |
| 287 | } |
| 288 | #topo-p-instance .onosInst.mastership.affinity { |
| 289 | opacity: 1.0; |
| 290 | } |
Simon Hunt | 0ee2868 | 2015-02-12 20:48:11 -0800 | [diff] [blame] | 291 | .light #topo-p-instance .onosInst.mastership.affinity svg rect { |
| 292 | filter: url(#blue-glow); |
| 293 | } |
| 294 | .dark #topo-p-instance .onosInst.mastership.affinity svg rect { |
| 295 | filter: url(#yellow-glow); |
Simon Hunt | 4b66859 | 2015-01-29 17:33:53 -0800 | [diff] [blame] | 296 | } |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 297 | |
| 298 | |
| 299 | /* --- Topo Nodes --- */ |
| 300 | |
Simon Hunt | a142dd2 | 2015-02-12 22:07:51 -0800 | [diff] [blame] | 301 | #ov-topo svg .suppressed { |
| 302 | opacity: 0.2 !important; |
| 303 | } |
| 304 | |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 305 | #ov-topo svg .node { |
| 306 | cursor: pointer; |
| 307 | } |
| 308 | |
Simon Hunt | 0ee2868 | 2015-02-12 20:48:11 -0800 | [diff] [blame] | 309 | .light #ov-topo svg .node.selected rect, |
| 310 | .light #ov-topo svg .node.selected circle { |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 311 | fill: #f90; |
Simon Hunt | 0ee2868 | 2015-02-12 20:48:11 -0800 | [diff] [blame] | 312 | filter: url(#blue-glow); |
| 313 | } |
| 314 | .dark #ov-topo svg .node.selected rect, |
| 315 | .dark #ov-topo svg .node.selected circle { |
| 316 | fill: #f90; |
| 317 | filter: url(#yellow-glow); |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 318 | } |
| 319 | |
| 320 | #ov-topo svg .node text { |
| 321 | pointer-events: none; |
| 322 | } |
| 323 | |
| 324 | /* Device Nodes */ |
| 325 | |
| 326 | #ov-topo svg .node.device { |
| 327 | } |
| 328 | |
| 329 | #ov-topo svg .node.device rect { |
| 330 | stroke-width: 1.5; |
| 331 | } |
| 332 | |
| 333 | #ov-topo svg .node.device.fixed rect { |
| 334 | stroke-width: 1.5; |
Simon Hunt | 78c10bf | 2015-02-03 21:18:20 -0800 | [diff] [blame] | 335 | } |
| 336 | .light #ov-topo svg .node.device.fixed rect { |
| 337 | stroke: #aaa; |
| 338 | } |
| 339 | .dark #ov-topo svg .node.device.fixed rect { |
Simon Hunt | 1c36711 | 2015-02-05 18:02:46 -0800 | [diff] [blame] | 340 | stroke: #999; |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 341 | } |
| 342 | |
| 343 | /* note: device is offline without the 'online' class */ |
Simon Hunt | 1c36711 | 2015-02-05 18:02:46 -0800 | [diff] [blame] | 344 | .light #ov-topo svg .node.device { |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 345 | fill: #777; |
| 346 | } |
Simon Hunt | 1c36711 | 2015-02-05 18:02:46 -0800 | [diff] [blame] | 347 | .dark #ov-topo svg .node.device { |
| 348 | fill: #555; |
| 349 | } |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 350 | |
Simon Hunt | 1c36711 | 2015-02-05 18:02:46 -0800 | [diff] [blame] | 351 | .light #ov-topo svg .node.device rect { |
| 352 | stroke: #666; |
| 353 | } |
| 354 | .light #ov-topo svg .node.device rect { |
| 355 | stroke: #999; |
| 356 | } |
| 357 | |
| 358 | .light #ov-topo svg .node.device.online { |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 359 | fill: #6e7fa3; |
| 360 | } |
Simon Hunt | 1c36711 | 2015-02-05 18:02:46 -0800 | [diff] [blame] | 361 | .dark #ov-topo svg .node.device.online { |
| 362 | fill: #4E5C7F; |
| 363 | } |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 364 | |
| 365 | /* note: device is offline without the 'online' class */ |
| 366 | #ov-topo svg .node.device text { |
| 367 | fill: #bbb; |
| 368 | font: 10pt sans-serif; |
| 369 | } |
| 370 | |
| 371 | #ov-topo svg .node.device.online text { |
| 372 | fill: white; |
| 373 | } |
| 374 | |
| 375 | #ov-topo svg .node.device .svgIcon rect { |
| 376 | fill: #aaa; |
| 377 | } |
| 378 | #ov-topo svg .node.device .svgIcon use { |
| 379 | fill: #777; |
| 380 | } |
| 381 | #ov-topo svg .node.device.selected .svgIcon rect { |
| 382 | fill: #f90; |
| 383 | } |
| 384 | #ov-topo svg .node.device.online .svgIcon rect { |
| 385 | fill: #ccc; |
| 386 | } |
| 387 | #ov-topo svg .node.device.online .svgIcon use { |
| 388 | fill: #000; |
| 389 | } |
| 390 | #ov-topo svg .node.device.online.selected .svgIcon rect { |
| 391 | fill: #f90; |
| 392 | } |
| 393 | |
| 394 | |
| 395 | /* Host Nodes */ |
| 396 | |
| 397 | #ov-topo svg .node.host { |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 398 | } |
| 399 | |
| 400 | #ov-topo svg .node.host text { |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 401 | stroke: none; |
| 402 | font: 9pt sans-serif; |
| 403 | } |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 404 | .light #ov-topo svg .node.host text { |
| 405 | fill: #846; |
| 406 | } |
| 407 | .dark #ov-topo svg .node.host text { |
| 408 | fill: #BB809D; |
| 409 | } |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 410 | |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 411 | .light svg .node.host circle { |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 412 | stroke: #000; |
| 413 | fill: #edb; |
| 414 | } |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 415 | .dark svg .node.host circle { |
| 416 | stroke: #eee; |
| 417 | fill: #B2A180; |
| 418 | } |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 419 | |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 420 | .light svg .node.host .svgIcon { |
| 421 | fill: #444; |
| 422 | } |
| 423 | .dark svg .node.host .svgIcon { |
| 424 | fill: #222; |
| 425 | } |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 426 | |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 427 | /* --- Topo Links --- */ |
Simon Hunt | ac4c6f7 | 2015-02-03 19:50:53 -0800 | [diff] [blame] | 428 | |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 429 | #ov-topo svg .link { |
| 430 | opacity: .9; |
| 431 | } |
| 432 | |
Simon Hunt | 0c6b2d3 | 2015-03-26 17:46:29 -0700 | [diff] [blame] | 433 | #ov-topo svg .link.selected, |
| 434 | #ov-topo svg .link.enhanced { |
| 435 | stroke-width: 4.5px; |
| 436 | } |
| 437 | .light #ov-topo svg .link.selected, |
Simon Hunt | d526412 | 2015-02-25 10:17:43 -0800 | [diff] [blame] | 438 | .light #ov-topo svg .link.enhanced { |
| 439 | filter: url(#blue-glow); |
| 440 | } |
Simon Hunt | 0c6b2d3 | 2015-03-26 17:46:29 -0700 | [diff] [blame] | 441 | .dark #ov-topo svg .link.selected, |
Simon Hunt | d526412 | 2015-02-25 10:17:43 -0800 | [diff] [blame] | 442 | .dark #ov-topo svg .link.enhanced { |
| 443 | filter: url(#yellow-glow); |
| 444 | } |
| 445 | |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 446 | #ov-topo svg .link.inactive { |
| 447 | opacity: .5; |
| 448 | stroke-dasharray: 8 4; |
| 449 | } |
| 450 | |
| 451 | #ov-topo svg .link.secondary { |
| 452 | stroke-width: 3px; |
| 453 | } |
| 454 | .light #ov-topo svg .link.secondary { |
| 455 | stroke: rgba(0,153,51,0.5); |
| 456 | } |
| 457 | .dark #ov-topo svg .link.secondary { |
| 458 | stroke: rgba(121,231,158,0.5); |
| 459 | } |
| 460 | |
| 461 | #ov-topo svg .link.primary { |
| 462 | stroke-width: 4px; |
| 463 | } |
| 464 | .light #ov-topo svg .link.primary { |
| 465 | stroke: #ffA300; |
| 466 | } |
| 467 | .dark #ov-topo svg .link.primary { |
| 468 | stroke: #D58E0F; |
| 469 | } |
| 470 | |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 471 | #ov-topo svg .link.secondary.optical { |
| 472 | stroke-width: 4px; |
| 473 | } |
| 474 | .light #ov-topo svg .link.secondary.optical { |
| 475 | stroke: rgba(128,64,255,0.5); |
| 476 | } |
| 477 | .dark #ov-topo svg .link.secondary.optical { |
| 478 | stroke: rgba(164,139,215,0.5); |
| 479 | } |
| 480 | |
| 481 | #ov-topo svg .link.primary.optical { |
| 482 | stroke-width: 6px; |
| 483 | } |
| 484 | .light #ov-topo svg .link.primary.optical { |
| 485 | stroke: #74f; |
| 486 | } |
| 487 | .dark #ov-topo svg .link.primary.optical { |
| 488 | stroke: #7352CD; |
| 489 | } |
| 490 | |
Simon Hunt | 1a5301e | 2015-02-25 15:31:25 -0800 | [diff] [blame] | 491 | /* Link Labels */ |
| 492 | |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 493 | #ov-topo svg .linkLabel rect { |
| 494 | stroke: none; |
| 495 | } |
| 496 | .light #ov-topo svg .linkLabel rect { |
| 497 | fill: #eee; |
| 498 | } |
| 499 | .dark #ov-topo svg .linkLabel rect { |
Simon Hunt | 8eb4d3a | 2015-02-23 18:23:29 -0800 | [diff] [blame] | 500 | fill: #555; |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 501 | } |
| 502 | |
| 503 | #ov-topo svg .linkLabel text { |
| 504 | text-anchor: middle; |
| 505 | stroke-width: 0.1; |
| 506 | font-size: 9pt; |
| 507 | } |
| 508 | .light #ov-topo svg .linkLabel text { |
Simon Hunt | 8eb4d3a | 2015-02-23 18:23:29 -0800 | [diff] [blame] | 509 | fill: #444; |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 510 | } |
| 511 | .dark #ov-topo svg .linkLabel text { |
Simon Hunt | 8eb4d3a | 2015-02-23 18:23:29 -0800 | [diff] [blame] | 512 | fill: #eee; |
Simon Hunt | 1894d79 | 2015-02-04 17:09:20 -0800 | [diff] [blame] | 513 | } |
Simon Hunt | eb0fa05 | 2015-02-17 19:20:28 -0800 | [diff] [blame] | 514 | |
Simon Hunt | 1a5301e | 2015-02-25 15:31:25 -0800 | [diff] [blame] | 515 | /* Port Labels */ |
| 516 | |
| 517 | #ov-topo svg .portLabel rect { |
| 518 | stroke: none; |
| 519 | } |
| 520 | .light #ov-topo svg .portLabel rect { |
| 521 | fill: #eee; |
| 522 | } |
| 523 | .dark #ov-topo svg .portLabel rect { |
Simon Hunt | 969b3c9 | 2015-02-25 18:11:31 -0800 | [diff] [blame] | 524 | fill: #222; |
Simon Hunt | 1a5301e | 2015-02-25 15:31:25 -0800 | [diff] [blame] | 525 | } |
| 526 | |
| 527 | #ov-topo svg .portLabel text { |
| 528 | text-anchor: middle; |
| 529 | stroke-width: 0.1; |
Simon Hunt | 969b3c9 | 2015-02-25 18:11:31 -0800 | [diff] [blame] | 530 | font-size: 11pt; |
Simon Hunt | 1a5301e | 2015-02-25 15:31:25 -0800 | [diff] [blame] | 531 | } |
| 532 | .light #ov-topo svg .portLabel text { |
| 533 | fill: #444; |
| 534 | } |
| 535 | .dark #ov-topo svg .portLabel text { |
| 536 | fill: #eee; |
| 537 | } |
| 538 | |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 539 | /* ------------------------------------------------- */ |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 540 | /* Sprite Layer */ |
| 541 | |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 542 | #ov-topo svg #topo-sprites use { |
Simon Hunt | b2c4cc8 | 2015-04-15 17:16:28 -0700 | [diff] [blame] | 543 | stroke-width: 2; |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 544 | } |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 545 | #ov-topo svg #topo-sprites text { |
| 546 | text-anchor: middle; |
Simon Hunt | b2c4cc8 | 2015-04-15 17:16:28 -0700 | [diff] [blame] | 547 | font-size: 20pt; |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 548 | font-style: italic; |
| 549 | } |
| 550 | |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 551 | .light #ov-topo svg #topo-sprites .gold1 use { |
Simon Hunt | 017a7c3 | 2015-04-15 19:23:27 -0700 | [diff] [blame] | 552 | stroke: #fda; |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 553 | fill: none; |
| 554 | } |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 555 | .dark #ov-topo svg #topo-sprites .gold1 use { |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 556 | stroke: #541; |
| 557 | fill: none; |
| 558 | } |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 559 | .light #ov-topo svg #topo-sprites .gold1 text { |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 560 | fill: #eda; |
| 561 | } |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 562 | .dark #ov-topo svg #topo-sprites .gold1 text { |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 563 | fill: #543; |
| 564 | } |
| 565 | |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 566 | .light #ov-topo svg #topo-sprites .blue1 use { |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 567 | stroke: #bbd; |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 568 | fill: none; |
| 569 | } |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 570 | .dark #ov-topo svg #topo-sprites .blue1 use { |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 571 | stroke: #445; |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 572 | fill: none; |
| 573 | } |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 574 | .light #ov-topo svg #topo-sprites .blue1 text { |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 575 | fill: #cce; |
| 576 | } |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 577 | .dark #ov-topo svg #topo-sprites .blue1 text { |
Simon Hunt | 2052e5d | 2015-04-13 17:40:44 -0700 | [diff] [blame] | 578 | fill: #446; |
| 579 | } |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 580 | |
| 581 | .light #ov-topo svg #topo-sprites .gray1 use { |
Simon Hunt | b2c4cc8 | 2015-04-15 17:16:28 -0700 | [diff] [blame] | 582 | stroke: #ccc; |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 583 | fill: none; |
| 584 | } |
| 585 | .dark #ov-topo svg #topo-sprites .gray1 use { |
| 586 | stroke: #333; |
| 587 | fill: none; |
| 588 | } |
| 589 | .light #ov-topo svg #topo-sprites .gray1 text { |
Simon Hunt | b2c4cc8 | 2015-04-15 17:16:28 -0700 | [diff] [blame] | 590 | fill: #ddd; |
Simon Hunt | abf66d9 | 2015-04-15 12:57:31 -0700 | [diff] [blame] | 591 | } |
| 592 | .dark #ov-topo svg #topo-sprites .gray1 text { |
| 593 | fill: #444; |
| 594 | } |
| 595 | |
Simon Hunt | 7f62f7c | 2015-05-11 17:38:02 -0700 | [diff] [blame] | 596 | /* fills */ |
| 597 | .light #ov-topo svg #topo-sprites use.fill-gray2 { |
| 598 | fill: #eee; |
| 599 | } |
| 600 | .dark #ov-topo svg #topo-sprites use.fill-gray2 { |
| 601 | fill: #444; |
| 602 | } |
| 603 | |
| 604 | .light #ov-topo svg #topo-sprites use.fill-blue2 { |
| 605 | fill: #bce; |
| 606 | } |
| 607 | .dark #ov-topo svg #topo-sprites use.fill-blue2 { |
| 608 | fill: #447; |
| 609 | } |
| 610 | |