MrShi
2024-02-05 5019ed6016b47221321bf395cd102dc4b51b4724
platform/src/components/common/Light.vue
@@ -28,16 +28,13 @@
$cycle-size01: 16px;
$cycle-size02: 6px;
$normal-color: #00CC99;
$shadow-color: #00CCa9;
$warn-color: #FFCC33;
$warn-shadow-color: #FFCbe3;
$danger-color: #FF3300;
$dange-shadowr-color: #FF3310;
@mixin light-status ($cycle-bg) {
  em {
    background: $cycle-bg;
    i {
      background: mix($cycle-bg,  #000030, 0.5);
      background: $cycle-bg - 30;
    }
  }
}
@@ -82,44 +79,44 @@
}
@keyframes shine-normal {
  0% {
    box-shadow: 0 0 5px $shadow-color;
    box-shadow: 0 0 5px $normal-color + 10;
  }
  25% {
    box-shadow: 0 0 10px $shadow-color;
    box-shadow: 0 0 10px $normal-color + 10;
  }
  50% {
    box-shadow: 0 0 15px $shadow-color;
    box-shadow: 0 0 15px $normal-color + 10;
  }
  100% {
    box-shadow: 0 0 20px $shadow-color;
    box-shadow: 0 0 20px $normal-color + 10;
  }
}
@keyframes shine-warn {
  0% {
    box-shadow: 0 0 5px $warn-shadow-color;
    box-shadow: 0 0 5px $warn-color - 50;
  }
  25% {
    box-shadow: 0 0 10px $warn-shadow-color;
    box-shadow: 0 0 10px $warn-color - 50;
  }
  50% {
    box-shadow: 0 0 15px $warn-shadow-color;
    box-shadow: 0 0 15px $warn-color - 50;
  }
  100% {
    box-shadow: 0 0 20px $warn-shadow-color;
    box-shadow: 0 0 20px $warn-color - 50;
  }
}
@keyframes shine-danger {
  0% {
    box-shadow: 0 0 5px $dange-shadowr-color;
    box-shadow: 0 0 5px $danger-color + 10;
  }
  25% {
    box-shadow: 0 0 10px $dange-shadowr-color;
    box-shadow: 0 0 10px $danger-color + 10;
  }
  50% {
    box-shadow: 0 0 15px $dange-shadowr-color;
    box-shadow: 0 0 15px $danger-color + 10;
  }
  100% {
    box-shadow: 0 0 20px $dange-shadowr-color;
    box-shadow: 0 0 20px $danger-color + 10;
  }
}
</style>