<commit_before>@import 'patternfly-sass/assets/stylesheets/patternfly/color-variables';

.collapsed {
  .step-insert {
    display: none;
  }
}

.clickable {
  cursor: pointer;
  & > * {
    cursor: pointer;
  }
}

.popover-body > div {
  padding: 5px;
}

.flow-view {
  height: 100%;

  syndesis-loading {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: visible;
  }

  .flow-view-container {
    flex: 1 1 auto;
    overflow-y: scroll;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-left: -20px;
    margin-right: -20px;

    width: 320px;
    display: flex;
    flex-direction: column;
    &.collapsed {
      width: 150px;
      align-items: center;
      margin-right: 0;
    }
    .start,
    .finish {
      h5 {
        background-color: #ededed;
        cursor: pointer;
        display: inline;
        padding: 5px;
        text-transform: uppercase;
      }
      ul {
        min-width: 160px;
        padding: 10px 0; // Sub-Menu Items
        &.collapse {
          margin-top: 5px;
          padding: 5px 0;
          li {
            padding: 5px 5px 5px 17px;
            &.active {
              background-color: #d6eefa;
              border-bottom: 1px solid #b8dff3;
              border-top: 1px solid #b8dff3;
            }
            &.inactive {
              color: #d1d1d1;
            }
          }
        }
      }
      .fa {
        font-size: x-small;
        padding-right: 5px;
      }
    }
  }
  .name {
    flex: 0 0 auto;
    margin-top: -10px;
    border-bottom: 1px #d9d9d9 solid;
    .integration-name {
      background: none;
      border: none;
      box-shadow: none;
      color: #363636;
      font-size: 14px;
      font-style: normal;
      &.ng-invalid {
        color: #ff0000;
      }
    }
    .pficon.pficon-edit {
      margin-top: -20px;
    }
  } ////////////////////////////////////////////////////////////////////////////////
  // LEFT-HAND NAV BAR W/ STEPS
  ////////////////////////////////////////////////////////////////////////////////
  .step {
    position: relative;
    flex-wrap: nowrap;
    flex: 0 0 auto;
    min-height: 110px;
    .step-line {
      position: absolute;
      height: 100%;
      top: 0;
      left: 46px;
      width: 2px;
      background-color: #d4d4d4;
    }
    &.finish {
      flex: 0 0 auto;
      min-height: 0px;
    }
    &.step-insert {
      flex: 0 0 auto;
      min-height: 80px;
      /deep/ .popover {
        margin-top: -2px;
        margin-left: 28px !important;
        border-color: $color-pf-black-500;
        &.right > .arrow {
          border-right-color: $color-pf-black-500;
        }
      }
      a {
        text-decoration: none;
      }
      .popover-body {
        a {
          cursor: pointer;
          padding: 10px;
        }
      }
      .square-icon {
        .fa.fa-plus-square {
          color: #158acc;
          background-color: white;
          font-size: x-large;
          margin: 0;
          margin-left: 17px;
          margin-top: 10px;
        }
      }
    }
  }
}<commit_msg>refactor(integration): Better integration flow left alignment<commit_after>@import 'patternfly-sass/assets/stylesheets/patternfly/color-variables';

.collapsed {
  .step-insert {
    display: none;
  }
}

.clickable {
  cursor: pointer;
  & > * {
    cursor: pointer;
  }
}

.popover-body > div {
  padding: 5px;
}

.flow-view {
  height: 100%;

  syndesis-loading {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: visible;
  }

  .flow-view-container {
    flex: 1 1 auto;
    overflow-y: scroll;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-right: -20px;

    width: 320px;
    display: flex;
    flex-direction: column;
    &.collapsed {
      width: 150px;
      align-items: center;
      margin-right: 0;
    }
    .start,
    .finish {
      h5 {
        background-color: #ededed;
        cursor: pointer;
        display: inline;
        padding: 5px;
        text-transform: uppercase;
      }
      ul {
        min-width: 160px;
        padding: 10px 0; // Sub-Menu Items
        &.collapse {
          margin-top: 5px;
          padding: 5px 0;
          li {
            padding: 5px 5px 5px 17px;
            &.active {
              background-color: #d6eefa;
              border-bottom: 1px solid #b8dff3;
              border-top: 1px solid #b8dff3;
            }
            &.inactive {
              color: #d1d1d1;
            }
          }
        }
      }
      .fa {
        font-size: x-small;
        padding-right: 5px;
      }
    }
  }
  .name {
    flex: 0 0 auto;
    margin-top: -10px;
    border-bottom: 1px #d9d9d9 solid;
    .integration-name {
      background: none;
      border: none;
      box-shadow: none;
      color: #363636;
      font-size: 14px;
      font-style: normal;
      &.ng-invalid {
        color: #ff0000;
      }
    }
    .pficon.pficon-edit {
      margin-top: -20px;
    }
  } ////////////////////////////////////////////////////////////////////////////////
  // LEFT-HAND NAV BAR W/ STEPS
  ////////////////////////////////////////////////////////////////////////////////
  .step {
    position: relative;
    flex-wrap: nowrap;
    flex: 0 0 auto;
    min-height: 110px;
    .step-line {
      position: absolute;
      height: 100%;
      top: 0;
      left: 26px;
      width: 2px;
      background-color: #d4d4d4;
    }
    &.finish {
      flex: 0 0 auto;
      min-height: 0px;
    }
    &.step-insert {
      flex: 0 0 auto;
      min-height: 80px;
      /deep/ .popover {
        margin-top: -2px;
        margin-left: 28px !important;
        border-color: $color-pf-black-500;
        &.right > .arrow {
          border-right-color: $color-pf-black-500;
        }
      }
      a {
        text-decoration: none;
      }
      .popover-body {
        a {
          cursor: pointer;
          padding: 10px;
        }
      }
      .square-icon {
        padding-left: 0;
        .fa.fa-plus-square {
          color: #158acc;
          background-color: white;
          font-size: x-large;
          margin: 0;
          margin-left: 17px;
          margin-top: 10px;
        }
      }
    }
  }
}
{'fraction_non_alphanumeric': 0.16890037138704989, 'fraction_numerical': 0.03665428709833683, 'mean_word_length': 1.2272563825961884, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 9, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5831544', 'n_tokens_mistral': 2231, 'n_tokens_neox': 2036, 'n_words': 437}