Visualize custom check-in rules (#2053)

This commit is contained in:
Raphael Michel
2021-05-05 12:58:00 +02:00
committed by GitHub
parent d900faf5c8
commit f97cd59162
22 changed files with 25175 additions and 484 deletions

View File

@@ -642,18 +642,81 @@ table td > .checkbox input[type="checkbox"] {
#rules-editor {
.checkin-rule {
border-left: 4px solid $brand-primary;
border-left: 4px solid transparentize($brand-primary, .5);
background: rgba(0, 0, 0, 0.05);
padding: 5px 15px 5px 15px;
margin: 5px 0;
position: relative;
&:hover {
border-left-color: $brand-primary;
}
}
.checkin-rule-and {
border-left: 4px solid $brand-danger;
border-left: 4px solid transparentize($brand-danger, .5);
&:hover {
border-left-color: $brand-danger;
}
}
.checkin-rule-or {
border-left: 4px solid $brand-success;
border-left: 4px solid transparentize($brand-success, .5);
&:hover {
border-left-color: $brand-success;
}
}
}
.checkin-rules-visualization {
svg {
width: 100%;
height: auto;
.node {
stroke: $gray-light;
stroke-width: 2px;
fill: #fff;
&:hover {
stroke: $brand-primary;
}
}
.edge {
stroke: $gray-light;
stroke-width: 2px;
fill: none;
}
.check {
fill: $brand-success;
}
.text {
font-size: 12px;
width: 100%;
height: 100%;
overflow-y: auto;
cursor: default;
text-align: center;
}
}
position: relative;
.tools {
position: absolute;
top: 10px;
right: 10px;
}
&.maximized {
background: white;
position: fixed;
top: 51px;
left: 0;
width: 100vw;
max-height: none;
height: 100vh;
height: calc(100vh - 51px);
z-index: 90000;
svg {
height: 100%
}
}
}