src/app/service-graph/components/fine-grained/fine-grained.component.scss

/*
 * Copyright 2017-present Open Networking Foundation

 * 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.
 */


@import './../../../style/vars.scss';
@import '../../../../../node_modules/bootstrap-sass/assets/stylesheets/bootstrap/variables';

xos-fine-grained-tenancy-graph {
  display: block;
  height: 100%;
  // background: $color-accent;

  svg {
    height: 90%;
    width: 100%;
    background-color: $panel-filled-bg;
    border-radius: 3px;
  }

  .node-group {

    .node {
      cursor: pointer;
    }

    .node .symbol {
        fill-rule: evenodd;
        stroke: #bbddff;
        stroke-width: 4.0px;
        fill: none;
    }
    .node .symbol-bg {
        fill-rule: evenodd;
        stroke: none;
        fill: $background-color;
    }

    .node {
      rect, circle {
        stroke: $color-accent;
        fill: $background-color;
      }

      &.network > circle{
        stroke: blue;
      }

      &.tenant, &.serviceinstance > rect{
        stroke: green;
      }

      &.subscriber > rect,
      &.tenantroot > rect{
        stroke: red;
      }
    }

    .node > text {
      fill: #fff;
      font-size: 20px;
    }
  }

  .link-group {
    line {
      stroke: $color-accent;

      &.ext-service-instance {
        stroke: green;
      }

      &.ext-owner {
        stroke: green;
        stroke-dasharray: 5;
      }
    }
  }
  .arrow-marker {
    stroke: $color-accent;
    fill: $color-accent;
  }
}