| /* |
| * Copyright 2014,2015 Open Networking Laboratory |
| * |
| * Licensed under the Apache License, Version 2.0 (the "License"); |
| * you may not use this file except in compliance with the License. |
| * You may obtain a copy of the License at |
| * |
| * http://www.apache.org/licenses/LICENSE-2.0 |
| * |
| * Unless required by applicable law or agreed to in writing, software |
| * distributed under the License is distributed on an "AS IS" BASIS, |
| * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| * See the License for the specific language governing permissions and |
| * limitations under the License. |
| */ |
| |
| /* |
| ONOS GUI -- Topology View -- CSS file |
| */ |
| |
| /* --- Base SVG Layer --- */ |
| |
| #ov-topo svg { |
| /* prevents the little cut/copy/paste square that would appear on iPad */ |
| -webkit-user-select: none; |
| } |
| .light #ov-topo svg { |
| background-color: #fff; |
| } |
| .dark #ov-topo svg { |
| background-color: #2b2b2b; |
| } |
| |
| |
| /* --- "No Devices" Layer --- */ |
| |
| #ov-topo svg #topo-noDevsLayer { |
| visibility: hidden; |
| } |
| |
| .light #ov-topo svg .noDevsBird { |
| fill: #ecd; |
| } |
| .dark #ov-topo svg .noDevsBird { |
| fill: #683434; |
| } |
| |
| #ov-topo svg #topo-noDevsLayer text { |
| font-size: 60pt; |
| font-style: italic; |
| } |
| .light #ov-topo svg #topo-noDevsLayer text { |
| fill: #dde; |
| } |
| .dark #ov-topo svg #topo-noDevsLayer text { |
| fill: #3b3b4f; |
| } |
| |
| |
| /* --- Topo Map --- */ |
| |
| #ov-topo svg #topo-map { |
| stroke-width: 2px; |
| fill: transparent; |
| } |
| |
| .light #ov-topo svg #topo-map { |
| stroke: #ddd; |
| } |
| .dark #ov-topo svg #topo-map { |
| stroke: #444; |
| } |
| |
| |
| /* --- Topo Summary Panel --- */ |
| |
| #topo-p-summary { |
| /* Base css from panel.css */ |
| } |
| |
| /* --- Topo Detail Panel --- */ |
| |
| #topo-p-detail { |
| /* Base css from panel.css */ |
| top: 338px; |
| } |
| html[data-platform='iPad'] #topo-p-detail { |
| top: 354px; |
| } |
| |
| #topo-p-detail .actionBtns .actionBtn { |
| display: inline-block; |
| } |
| #topo-p-detail .actionBtns .actionBtn svg { |
| width: 30px; |
| height: 30px; |
| } |
| |
| |
| /* --- general topo-panel styling --- */ |
| |
| .topo-p div.header div.icon { |
| vertical-align: middle; |
| display: inline-block; |
| } |
| .topo-p div.body { |
| overflow-y: scroll; |
| } |
| |
| .topo-p div.body::-webkit-scrollbar { |
| display: none; |
| } |
| |
| .topo-p svg { |
| display: inline-block; |
| width: 42px; |
| height: 42px; |
| } |
| |
| .light .topo-p svg .glyph { |
| fill: #222; |
| } |
| |
| .dark .topo-p svg .glyph.overlay { |
| fill: #222; |
| } |
| |
| .dark .topo-p svg .glyph { |
| fill: #ddd; |
| } |
| .light .topo-p svg .glyph.overlay { |
| fill: #fff; |
| } |
| |
| |
| .topo-p h2 { |
| padding: 0 4px; |
| margin: 0; |
| word-wrap: break-word; |
| display: inline-block; |
| width: 210px; |
| vertical-align: middle; |
| } |
| .light .topo-p h2 { |
| color: black; |
| } |
| .dark .topo-p h2 { |
| color: #ddd; |
| } |
| |
| .topo-p h3 { |
| padding: 0 4px; |
| margin: 0; |
| word-wrap: break-word; |
| top: 20px; |
| left: 50px; |
| } |
| .light .topo-p h3 { |
| color: black; |
| } |
| .dark .topo-p h3 { |
| color: #ddd; |
| } |
| |
| .topo-p p, table { |
| padding: 4px; |
| margin: 0; |
| } |
| |
| .topo-p td { |
| word-wrap: break-word; |
| } |
| .topo-p td.label { |
| font-style: italic; |
| padding-right: 12px; |
| /* works for both light and dark themes ... */ |
| color: #777; |
| } |
| .topo-p td.value { |
| } |
| |
| .topo-p hr { |
| height: 1px; |
| border: 0; |
| } |
| .light .topo-p hr { |
| background-color: #ccc; |
| color: #ccc; |
| } |
| .dark .topo-p hr { |
| background-color: #888; |
| color: #888; |
| } |
| |
| /* --- Topo Instance Panel --- */ |
| |
| #topo-p-instance { |
| height: 100px; |
| } |
| |
| #topo-p-instance div.onosInst { |
| display: inline-block; |
| width: 170px; |
| height: 85px; |
| cursor: pointer; |
| } |
| |
| #topo-p-instance svg rect { |
| stroke-width: 3.5; |
| } |
| #topo-p-instance .online svg rect { |
| opacity: 1; |
| } |
| .light #topo-p-instance svg rect { |
| fill: #ccc; |
| stroke: #aaa; |
| } |
| .light #topo-p-instance .online svg rect { |
| fill: #9cf; |
| stroke: #555; |
| } |
| .dark #topo-p-instance svg rect { |
| fill: #666; |
| stroke: #222; |
| } |
| .dark #topo-p-instance .online svg rect { |
| fill: #9cf; |
| stroke: #999; |
| } |
| |
| |
| #topo-p-instance svg .glyph { |
| fill: #888; |
| fill-rule: evenodd; |
| } |
| #topo-p-instance .online svg .glyph { |
| fill: #000; |
| } |
| |
| #topo-p-instance svg .badgeIcon { |
| fill-rule: evenodd; |
| opacity: 0.4; |
| } |
| .light #topo-p-instance svg .badgeIcon { |
| fill: #777; |
| } |
| .dark #topo-p-instance svg .badgeIcon { |
| fill: #555; |
| } |
| |
| #topo-p-instance .online svg .badgeIcon { |
| opacity: 1.0; |
| } |
| .light #topo-p-instance .online svg .badgeIcon { |
| fill: #fff; |
| } |
| .dark #topo-p-instance .online svg .badgeIcon { |
| fill: #fff; |
| } |
| |
| #topo-p-instance svg text { |
| text-anchor: middle; |
| opacity: 0.3; |
| } |
| #topo-p-instance .online svg text { |
| opacity: 1.0; |
| } |
| .light #topo-p-instance svg text { |
| fill: #444; |
| } |
| .light #topo-p-instance .online svg text { |
| fill: #eee; |
| } |
| .dark #topo-p-instance svg text { |
| fill: #aaa; |
| } |
| .dark #topo-p-instance .online svg text { |
| fill: #ccc; |
| } |
| |
| #topo-p-instance svg text.instTitle { |
| font-size: 11pt; |
| font-weight: bold; |
| } |
| #topo-p-instance svg text.instLabel { |
| font-size: 9pt; |
| font-style: italic; |
| } |
| |
| #topo-p-instance .onosInst.mastership { |
| opacity: 0.3; |
| } |
| #topo-p-instance .onosInst.mastership.affinity { |
| opacity: 1.0; |
| } |
| .light #topo-p-instance .onosInst.mastership.affinity svg rect { |
| filter: url(#blue-glow); |
| } |
| .dark #topo-p-instance .onosInst.mastership.affinity svg rect { |
| filter: url(#yellow-glow); |
| } |
| .light.firefox #topo-p-instance .onosInst.mastership.affinity svg rect { |
| filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"blue-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.7 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#blue-glow"); |
| } |
| .dark.firefox #topo-p-instance .onosInst.mastership.affinity svg rect { |
| filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"yellow-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 1.0 0 0 0 0 1.0 0 0 0 0 0.3 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#yellow-glow"); |
| } |
| |
| |
| /* --- Toolbar --- */ |
| |
| #toolbar-topo-tbar .tbar-row.right { |
| width: 100%; |
| } |
| |
| #toolbar-topo-tbar .tbar-row-text { |
| height: 21px; |
| text-align: right; |
| padding: 8px 60px 0 0; |
| font-style: italic; |
| } |
| |
| |
| /* --- Topo Nodes --- */ |
| |
| #ov-topo svg .suppressed { |
| opacity: 0.5 !important; |
| } |
| |
| #ov-topo svg .suppressedmax { |
| opacity: 0.2 !important; |
| } |
| |
| #ov-topo svg .node { |
| cursor: pointer; |
| } |
| |
| .light #ov-topo svg .node.selected rect, |
| .light #ov-topo svg .node.selected circle { |
| fill: #f90; |
| filter: url(#blue-glow); |
| } |
| .dark #ov-topo svg .node.selected rect, |
| .dark #ov-topo svg .node.selected circle { |
| fill: #f90; |
| filter: url(#yellow-glow); |
| } |
| .light.firefox #ov-topo svg .node.selected rect, |
| .light.firefox #ov-topo svg .node.selected circle { |
| filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"blue-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.7 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#blue-glow"); |
| } |
| .dark.firefox #ov-topo svg .node.selected rect, |
| .dark.firefox #ov-topo svg .node.selected circle { |
| filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"yellow-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 1.0 0 0 0 0 1.0 0 0 0 0 0.3 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#yellow-glow"); |
| } |
| |
| #ov-topo svg .node text { |
| pointer-events: none; |
| } |
| |
| /* Device Nodes */ |
| |
| #ov-topo svg .node.device { |
| } |
| |
| #ov-topo svg .node.device rect { |
| stroke-width: 1.5; |
| } |
| |
| #ov-topo svg .node.device.fixed rect { |
| stroke-width: 1.5; |
| } |
| .light #ov-topo svg .node.device.fixed rect { |
| stroke: #aaa; |
| } |
| .dark #ov-topo svg .node.device.fixed rect { |
| stroke: #999; |
| } |
| |
| /* note: device is offline without the 'online' class */ |
| .light #ov-topo svg .node.device { |
| fill: #777; |
| } |
| .dark #ov-topo svg .node.device { |
| fill: #555; |
| } |
| |
| .light #ov-topo svg .node.device rect { |
| stroke: #666; |
| } |
| .light #ov-topo svg .node.device rect { |
| stroke: #999; |
| } |
| |
| .light #ov-topo svg .node.device.online { |
| fill: #6e7fa3; |
| } |
| .dark #ov-topo svg .node.device.online { |
| fill: #4E5C7F; |
| } |
| |
| /* note: device is offline without the 'online' class */ |
| #ov-topo svg .node.device text { |
| fill: #bbb; |
| font: 10pt sans-serif; |
| } |
| |
| #ov-topo svg .node.device.online text { |
| fill: white; |
| } |
| |
| #ov-topo svg .node.device .svgIcon rect { |
| fill: #aaa; |
| } |
| #ov-topo svg .node.device .svgIcon use { |
| fill: #777; |
| } |
| #ov-topo svg .node.device.selected .svgIcon rect { |
| fill: #f90; |
| } |
| #ov-topo svg .node.device.online .svgIcon rect { |
| fill: #ccc; |
| } |
| #ov-topo svg .node.device.online .svgIcon use { |
| fill: #000; |
| } |
| #ov-topo svg .node.device.online.selected .svgIcon rect { |
| fill: #f90; |
| } |
| |
| /* Badges */ |
| /* (... works for both light and dark themes...) */ |
| #ov-topo svg .node .badge circle { |
| stroke: #aaa; |
| } |
| |
| #ov-topo svg .node .badge.badgeInfo circle { |
| fill: #99d; |
| } |
| |
| #ov-topo svg .node .badge.badgeWarn circle { |
| fill: #da2; |
| } |
| |
| #ov-topo svg .node .badge.badgeError circle { |
| fill: #e44; |
| } |
| |
| #ov-topo svg .node .badge use { |
| fill: white !important; |
| } |
| |
| #ov-topo svg .node .badge.badgeInfo use { |
| fill: #448; |
| } |
| |
| #ov-topo svg .node .badge text { |
| fill: white !important; |
| } |
| |
| #ov-topo svg .node .badge.badgeInfo text { |
| fill: #448; |
| } |
| |
| /* Host Nodes */ |
| |
| #ov-topo svg .node.host { |
| } |
| |
| #ov-topo svg .node.host text { |
| stroke: none; |
| font: 9pt sans-serif; |
| } |
| .light #ov-topo svg .node.host text { |
| fill: #846; |
| } |
| .dark #ov-topo svg .node.host text { |
| fill: #BB809D; |
| } |
| |
| .light svg .node.host circle { |
| stroke: #000; |
| fill: #edb; |
| } |
| .dark svg .node.host circle { |
| stroke: #eee; |
| fill: #B2A180; |
| } |
| |
| .light svg .node.host .svgIcon { |
| fill: #444; |
| } |
| .dark svg .node.host .svgIcon { |
| fill: #222; |
| } |
| |
| /* --- Topo Links --- */ |
| |
| #ov-topo svg .link { |
| opacity: .9; |
| } |
| |
| #ov-topo svg .link.selected, |
| #ov-topo svg .link.enhanced { |
| stroke-width: 4.5px; |
| } |
| .light #ov-topo svg .link.selected, |
| .light #ov-topo svg .link.enhanced { |
| filter: url(#blue-glow); |
| } |
| .dark #ov-topo svg .link.selected, |
| .dark #ov-topo svg .link.enhanced { |
| filter: url(#yellow-glow); |
| } |
| .light.firefox #ov-topo svg .link.selected, |
| .light.firefox #ov-topo svg .link.enhanced { |
| filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"blue-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.7 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#blue-glow"); |
| } |
| .dark.firefox #ov-topo svg .link.selected, |
| .dark.firefox #ov-topo svg .link.enhanced { |
| filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"yellow-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 1.0 0 0 0 0 1.0 0 0 0 0 0.3 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#yellow-glow"); |
| |
| } |
| |
| #ov-topo svg .link.inactive { |
| opacity: .5; |
| stroke-dasharray: 8 4; |
| } |
| /* FIXME: Review for not-permitted links */ |
| #ov-topo svg .link.not-permitted { |
| stroke: rgb(255,0,0); |
| stroke-width: 5.0; |
| stroke-dasharray: 8 4; |
| } |
| |
| #ov-topo svg .link.secondary { |
| stroke-width: 3px; |
| } |
| .light #ov-topo svg .link.secondary { |
| stroke: rgba(0,153,51,0.5); |
| } |
| .dark #ov-topo svg .link.secondary { |
| stroke: rgba(121,231,158,0.5); |
| } |
| |
| /* Port traffic color visualization for Kbps, Mbps, and Gbps */ |
| |
| .light #ov-topo svg .link.secondary.port-traffic-Kbps { |
| stroke: rgb(0,153,51); |
| stroke-width: 5.0; |
| } |
| .dark #ov-topo svg .link.secondary.port-traffic-Kbps { |
| stroke: rgb(98, 153, 118); |
| stroke-width: 5.0; |
| } |
| |
| .light #ov-topo svg .link.secondary.port-traffic-Mbps { |
| stroke: rgb(128,145,27); |
| stroke-width: 6.5; |
| } |
| .dark #ov-topo svg .link.secondary.port-traffic-Mbps { |
| stroke: rgb(91, 109, 54); |
| stroke-width: 6.5; |
| } |
| |
| .light #ov-topo svg .link.secondary.port-traffic-Gbps { |
| stroke: rgb(255, 137, 3); |
| stroke-width: 8.0; |
| } |
| .dark #ov-topo svg .link.secondary.port-traffic-Gbps { |
| stroke: rgb(174, 119, 55); |
| stroke-width: 8.0; |
| } |
| |
| .light #ov-topo svg .link.secondary.port-traffic-Gbps-choked { |
| stroke: rgb(183, 30, 21); |
| stroke-width: 8.0; |
| } |
| .dark #ov-topo svg .link.secondary.port-traffic-Gbps-choked { |
| stroke: rgb(127, 40, 39); |
| stroke-width: 8.0; |
| } |
| |
| |
| #ov-topo svg .link.animated { |
| stroke-dasharray: 8 5; |
| animation: ants 5s infinite linear; |
| /* below line will be added via Javascript based on path */ |
| /*animation-direction: reverse;*/ |
| } |
| @keyframes ants { |
| from { |
| stroke-dashoffset: 0; |
| } |
| to { |
| stroke-dashoffset: 400; |
| } |
| } |
| |
| #ov-topo svg .link.primary { |
| stroke-width: 4px; |
| } |
| .light #ov-topo svg .link.primary { |
| stroke: #ffA300; |
| } |
| .dark #ov-topo svg .link.primary { |
| stroke: #D58E0F; |
| } |
| |
| #ov-topo svg .link.secondary.optical { |
| stroke-width: 4px; |
| } |
| .light #ov-topo svg .link.secondary.optical { |
| stroke: rgba(128,64,255,0.5); |
| } |
| .dark #ov-topo svg .link.secondary.optical { |
| stroke: rgba(164,139,215,0.5); |
| } |
| |
| #ov-topo svg .link.primary.optical { |
| stroke-width: 6px; |
| } |
| .light #ov-topo svg .link.primary.optical { |
| stroke: #74f; |
| } |
| .dark #ov-topo svg .link.primary.optical { |
| stroke: #7352CD; |
| } |
| |
| /* Link Labels */ |
| |
| #ov-topo svg .linkLabel rect { |
| stroke: none; |
| } |
| .light #ov-topo svg .linkLabel rect { |
| fill: #eee; |
| } |
| .dark #ov-topo svg .linkLabel rect { |
| fill: #555; |
| } |
| |
| #ov-topo svg .linkLabel text { |
| text-anchor: middle; |
| stroke-width: 0.1; |
| font-size: 9pt; |
| } |
| .light #ov-topo svg .linkLabel text { |
| fill: #444; |
| } |
| .dark #ov-topo svg .linkLabel text { |
| fill: #eee; |
| } |
| |
| /* Port Labels */ |
| |
| #ov-topo svg .portLabel rect { |
| stroke: none; |
| } |
| .light #ov-topo svg .portLabel rect { |
| fill: #eee; |
| } |
| .dark #ov-topo svg .portLabel rect { |
| fill: #222; |
| } |
| |
| #ov-topo svg .portLabel text { |
| text-anchor: middle; |
| stroke-width: 0.1; |
| font-size: 11pt; |
| } |
| .light #ov-topo svg .portLabel text { |
| fill: #444; |
| } |
| .dark #ov-topo svg .portLabel text { |
| fill: #eee; |
| } |
| |
| /* Number of Links Labels */ |
| #ov-topo line.numLinkHash { |
| stroke-width: 3; |
| } |
| |
| #ov-topo text.numLinkText { |
| font-size: 15pt; |
| } |
| |
| #ov-topo text.numLinkText { |
| text-anchor: middle; |
| } |
| |
| .light #ov-topo text.numLinkText { |
| fill: #444; |
| } |
| .dark #ov-topo text.numLinkText { |
| fill: #eee; |
| } |
| |
| /* ------------------------------------------------- */ |
| /* Sprite Layer */ |
| |
| #ov-topo svg #topo-sprites use { |
| stroke-width: 2; |
| } |
| #ov-topo svg #topo-sprites text { |
| text-anchor: middle; |
| font-size: 20pt; |
| font-style: italic; |
| } |
| |
| .light #ov-topo svg #topo-sprites .gold1 use { |
| stroke: #fda; |
| fill: none; |
| } |
| .dark #ov-topo svg #topo-sprites .gold1 use { |
| stroke: #541; |
| fill: none; |
| } |
| .light #ov-topo svg #topo-sprites .gold1 text { |
| fill: #eda; |
| } |
| .dark #ov-topo svg #topo-sprites .gold1 text { |
| fill: #543; |
| } |
| |
| .light #ov-topo svg #topo-sprites .blue1 use { |
| stroke: #bbd; |
| fill: none; |
| } |
| .dark #ov-topo svg #topo-sprites .blue1 use { |
| stroke: #445; |
| fill: none; |
| } |
| .light #ov-topo svg #topo-sprites .blue1 text { |
| fill: #cce; |
| } |
| .dark #ov-topo svg #topo-sprites .blue1 text { |
| fill: #446; |
| } |
| |
| .light #ov-topo svg #topo-sprites .gray1 use { |
| stroke: #ccc; |
| fill: none; |
| } |
| .dark #ov-topo svg #topo-sprites .gray1 use { |
| stroke: #333; |
| fill: none; |
| } |
| .light #ov-topo svg #topo-sprites .gray1 text { |
| fill: #ddd; |
| } |
| .dark #ov-topo svg #topo-sprites .gray1 text { |
| fill: #444; |
| } |
| |
| /* fills */ |
| .light #ov-topo svg #topo-sprites use.fill-gray2 { |
| fill: #eee; |
| } |
| .dark #ov-topo svg #topo-sprites use.fill-gray2 { |
| fill: #444; |
| } |
| |
| .light #ov-topo svg #topo-sprites use.fill-blue2 { |
| fill: #bce; |
| } |
| .dark #ov-topo svg #topo-sprites use.fill-blue2 { |
| fill: #447; |
| } |
| |
| .notReady .readyBadge { |
| visibility: hidden; |
| } |
| |
| .map-list { |
| padding: 10px; |
| } |
| |
| .map-list select { |
| font-size: 20px; |
| } |
| |