Remove hardcoded colors on guides

src/commands/view/ComponentDrag.js

@@ -75,8 +75,8 @@ module.exports = {
       const pfx = editor.getConfig('stylePrefix');
       const elInfoX = document.createElement('div');
       const elInfoY = document.createElement('div');
-      const guideContent = `<div class="${pfx}guide-info__line">
-        <div class="${pfx}guide-info__content"></div>
+      const guideContent = `<div class="${pfx}guide-info__line ${pfx}danger-bg">
+        <div class="${pfx}guide-info__content ${pfx}danger-color"></div>
       </div>`;
       guidesEl = document.createElement('div');
       guidesEl.className = `${pfx}guides`;

src/styles/scss/_gjs_canvas.scss

@@ -7,7 +7,6 @@ $guide_pad: 5px;
     position: absolute;
 
     &__content {
-      color: red;
       position: absolute;
       height: 100%;
       display: flex;
@@ -17,7 +16,6 @@ $guide_pad: 5px;
 
     &__line {
       position: relative;
-      background-color: red;
       margin: auto;
 
       &::before,

src/styles/scss/main.scss

@@ -52,8 +52,14 @@ $prefix: $app-prefix;
 
 @import "gjs_status";
 
+$colorsAll: (one, $primaryColor),
+  (two, $secondaryColor),
+  (three, $tertiaryColor),
+  (four, $quaternaryColor),
+  (danger, $colorRed);
+
 .#{$prefix} {
-  @each $cnum, $ccol in (one, $primaryColor), (two, $secondaryColor), (three, $tertiaryColor), (four, $quaternaryColor) {
+  @each $cnum, $ccol in $colorsAll {
     &#{$cnum} {
       &-bg {
         background-color: $ccol;