src.app.modules.campaign.components.execution.execution-campaign.component.scss Maven / Gradle / Ivy

Go to download
@import 'colors';
@import 'mixins';
@import 'animations';

@include box-shadow-animation(
    $animation_name: history-tile-running-anim,
    $fromOffsetX: 4px,
    $fromOffsetY: 4px,
    $fromBlur: 8px,
    $fromSpread: 0,
    $fromColor: rgba($grisfonce2, 30),
    $toOffsetX: 8px,
    $toOffsetY: 8px,
    $toBlur: 16px,
    $toSpread: 0,
    $toColor: rgba($grisfonce2, 30)
);

.small_text {
    font-size:0.7em;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}

button {
    margin-right: 30px;
}

h1 {
    margin: 0;
}

h1>span {
    line-height: 1.24;
}

h2 {
    font-weight: bold;
    font-size: 15px;
    border: 0 solid grey;
    border-bottom-width: 3px;
    margin-bottom: 20px;
}

h2.current-campaign-report {
    display: inline;
}

h3 {
    font-weight: bold;
    font-size: 20px;
    padding: 10px;
}

.table td {
    vertical-align: middle;
}

.scenario-execute-btn {
    padding-top: 0;
    padding-bottom: 0;
}

.history-panel {
    @extend .noselect;
    padding: 0 5px;

    h2 {
        margin-bottom: 5px;
    }

    .reports {
        margin-right: 15px;
    }

    .title {
        font-weight: bold;
        padding-left: 2px;
        padding-top: 2px;
    }

    .execution-id {
        color: black;
        font-size: 14px;
        font-weight: bold;
        margin-left: 4px;
    }

    .time {
        font-size: 10px;
        color: white;
        padding-top: 6px;
        padding-left: 20px;
        padding-right: 10px;
        line-height: 14px;
        min-height: 40px;
    }

    .tile {
        padding: 0;
        cursor: pointer;
        border-radius: 4px;
        box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3);
        margin: 10px 0 10px 0;
    }

    .tile:hover {
        margin: 10px -20px 10px 20px;
        box-shadow: 8px 8px 16px rgba(0, 0, 0, 0.3);
    }

    .tile-ok {
        background-color: $liens;
    }

    .tile-ko {
        background-color: $labelko;
    }

    .tile-stop {
        background-color: $grisfonce2;
    }

    .tile-selected {
        margin: 10px -20px 10px 20px;
    }

    .tile-running {
        background-color: $grisclair1;
        @include animation(
            $animation_name: history-tile-running-anim,
            $animation_duration: 750ms,
            $animation_timing-function: linear,
            $animation_iteration-count: infinite,
            $animation_direction: alternate);
    }

    .fa-circle {
        background-color: white;
        padding: 5px;
        border-radius: 4px;
    }

    .circle-ok {
        color: #0275d8;
    }

    .circle-ko {
        color: #d9534f;
    }

    .circle-stop {
        color: $grisfonce1;
    }
}

.table-link {
    color: #212529; // Bootstrap table default color
}

.scenario-summary {
    color:white;
    text-align: center;
}

.filter {
    cursor: pointer;
}