iguazio.dashboard-react-controls 3.2.15 → 3.2.17

package/dist/scss/details.scss

@@ -0,0 +1,376 @@
+@use './colors';
+@use './mixins';
+@use './borders';
+@use './shadows';
+
+.table {
+  &__item {
+    position: absolute;
+    top: 0;
+    right: 0;
+    z-index: 2;
+    display: flex;
+    flex-direction: column;
+    width: calc(100% - 250px);
+    height: 100%;
+    padding: 20px 30px;
+    overflow-y: auto;
+    color: colors.$mulledWine;
+    background-color: colors.$white;
+    border: 1px solid colors.$magnoliaWhite;
+    border-radius: 0 4px 4px 0;
+
+    &_big {
+      width: 100%;
+    }
+
+    &-popup {
+      border-radius: 8px;
+    }
+
+    .error {
+      margin-bottom: 10px;
+    }
+
+    .item {
+      &-header {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: flex-start;
+        justify-content: flex-end;
+        margin: 0 0 1em 0;
+
+        &-wrapper {
+          position: sticky;
+          top: 0;
+          left: 0;
+          z-index: 6;
+          background-color: inherit;
+        }
+
+        &__title {
+          display: flex;
+          align-items: center;
+        }
+
+        &__status {
+          color: colors.$topaz;
+          line-height: 25px;
+
+          &-row {
+            display: flex;
+            flex: 1 0 100%;
+            flex-flow: row wrap;
+            align-items: center;
+            margin-bottom: 5px;
+
+            .info-banner {
+              display: flex;
+              gap: 8px;
+              align-items: center;
+              max-width: 100%;
+              height: 36px;
+              padding: 4px 8px;
+              background-color: colors.$magnoliaWhite;
+              border-radius: 4px;
+            }
+          }
+        }
+
+        &__back-btn {
+          margin-right: 5px;
+
+          & > * {
+            margin: 0;
+          }
+        }
+
+        &__navigation-buttons {
+          display: flex;
+        }
+
+        &__pods {
+          &-error {
+            color: colors.$spunPearl;
+          }
+        }
+
+        &__data {
+          flex: 1 0 0;
+          min-width: 250px;
+          margin-right: auto;
+
+          h3 {
+            margin: 0 0 5px 0;
+            font-size: 24px;
+            line-height: 28px;
+          }
+
+          .state {
+            display: inline-block;
+            min-width: 18px;
+
+            i {
+              margin: 0 10px 0 5px;
+            }
+          }
+
+          .error-container {
+            flex: 1;
+            margin-left: 0;
+
+            &:not(:last-child) {
+              margin-right: 1em;
+              padding-right: 1em;
+              border-right: borders.$secondaryBorder;
+            }
+          }
+        }
+
+        &__custom-elements {
+          z-index: 7;
+          display: flex;
+          align-items: center;
+          margin-right: 10px;
+        }
+
+        &__buttons {
+          z-index: 7;
+          display: flex;
+          align-items: center;
+
+          a {
+            display: inline-block;
+            margin: 21px 21px 21px 10px;
+
+            &.details-close-btn {
+              margin: 0;
+            }
+          }
+
+          .btn {
+            margin: 0 0.2rem;
+          }
+
+          .table-actions-container {
+            display: block;
+          }
+
+          .actions-menu {
+            &__container {
+              display: block;
+
+              .btn {
+                padding: 0;
+                border: none;
+
+                &:hover {
+                  background-color: transparent;
+                }
+
+                :first-child {
+                  margin-right: 0;
+                }
+              }
+            }
+          }
+
+          .details-date-picker {
+            margin-right: 12px;
+          }
+        }
+      }
+
+      &__content {
+        border-top: borders.$secondaryBorder;
+      }
+    }
+
+    &_inputs {
+      width: 100%;
+
+      @include mixins.resetSpaces;
+
+      &_item {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        padding: 27px 24px;
+        border-bottom: borders.$secondaryBorder;
+
+        div {
+          min-width: 237px;
+          padding: 0 5px;
+        }
+      }
+    }
+
+    &-logs {
+      position: relative;
+      display: flex;
+      flex: 1;
+      width: 100%;
+      min-height: 200px;
+      padding: 10px 0;
+      color: colors.$white;
+      font-family: 'Source Code Pro', 'Courier New', monospace;
+      white-space: pre-wrap;
+      background-color: colors.$black;
+
+      &:not(:last-child) {
+        margin-bottom: 10px;
+      }
+
+      &-container {
+        display: flex;
+        flex-direction: column;
+        height: 100%;
+      }
+
+      &-content {
+        width: 100%;
+        height: 100%;
+        padding: 0 10px;
+        overflow-y: scroll;
+
+        /* Define the thumb style */
+        &::-webkit-scrollbar-thumb {
+          background: colors.$doveGray;
+          border-radius: 5px;
+        }
+      }
+
+      &-panel {
+        padding: 0 10px;
+
+        .logs-refresh {
+          .btn {
+            min-width: 40px;
+            padding: 0;
+            border-radius: 50%;
+
+            & > * {
+              margin: 0;
+            }
+          }
+        }
+
+        .logs-loader {
+          width: 40px;
+          height: 40px;
+        }
+      }
+    }
+
+    &_artifacts {
+      display: flex;
+      flex: 1;
+      flex-direction: column;
+
+      &_wrapper {
+        width: 100%;
+      }
+    }
+
+    .details-item {
+      &__buttons-block {
+        display: flex;
+      }
+
+      &__apply-btn-wrapper {
+        width: 30px;
+      }
+
+      &__apply-btn {
+        display: block;
+        min-width: 30px;
+        height: 30px;
+        margin: 0;
+        padding: 0;
+      }
+    }
+
+    .preview_container {
+      display: flex;
+      flex-flow: column;
+      width: 100%;
+      height: 100%;
+
+      &__header {
+        display: flex;
+        justify-content: space-between;
+
+        &-text {
+          align-self: center;
+        }
+      }
+
+      .inputs_container {
+        width: 100%;
+      }
+
+      .accordion {
+        &__container {
+          &.open {
+            .accordion__body {
+              overflow: initial;
+            }
+          }
+        }
+      }
+
+      .preview {
+        &_popout {
+          margin: 0;
+          padding: 0;
+          background: colors.$white;
+          border: none;
+          outline: none;
+          cursor: pointer;
+        }
+      }
+
+      .json {
+        padding: 0 15px;
+      }
+
+      .preview-table {
+        display: flex;
+        flex: 1;
+        flex-direction: column;
+        overflow: auto;
+
+        .table-header {
+          top: 0;
+        }
+      }
+    }
+
+    &_code {
+      flex: 1;
+      overflow: auto;
+
+      h3 {
+        text-align: center;
+        vertical-align: middle;
+      }
+
+      pre {
+        padding: 8px 16px;
+        white-space: pre-wrap;
+        word-break: break-word;
+      }
+    }
+
+    &.pop-up-dialog-opened {
+      overflow-y: hidden;
+    }
+
+    .chips {
+      &-wrapper {
+        flex-wrap: wrap;
+        width: 100%;
+      }
+    }
+  }
+}

package/dist/scss/fonts.scss

@@ -0,0 +1,123 @@
+/* roboto-300 - latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 300;
+  src: url('../fonts/roboto-v27-latin-300.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/roboto-v27-latin-300.eot?#iefix') format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/roboto-v27-latin-300.woff2') format('woff2'),
+    /* Modern Browsers */ url('../fonts/roboto-v27-latin-300.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/roboto-v27-latin-300.ttf') format('truetype'),
+    /* Legacy iOS */ url('../fonts/roboto-v27-latin-300.svg#Roboto') format('svg');
+}
+
+/* roboto-regular - latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 400;
+  src: url('../fonts/roboto-v27-latin-regular.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/roboto-v27-latin-regular.eot?#iefix') format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/roboto-v27-latin-regular.woff2') format('woff2'),
+    /* Modern Browsers */ url('../fonts/roboto-v27-latin-regular.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/roboto-v27-latin-regular.ttf') format('truetype'),
+    /* Legacy iOS */ url('../fonts/roboto-v27-latin-regular.svg#Roboto') format('svg');
+}
+
+/* roboto-italic - latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: italic;
+  font-weight: 400;
+  src: url('../fonts/roboto-v27-latin-italic.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/roboto-v27-latin-italic.eot?#iefix') format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/roboto-v27-latin-italic.woff2') format('woff2'),
+    /* Modern Browsers */ url('../fonts/roboto-v27-latin-italic.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/roboto-v27-latin-italic.ttf') format('truetype'),
+    /* Legacy iOS */ url('../fonts/roboto-v27-latin-italic.svg#Roboto') format('svg');
+}
+
+/* roboto-500 - latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 500;
+  src: url('../fonts/roboto-v27-latin-500.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/roboto-v27-latin-500.eot?#iefix') format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/roboto-v27-latin-500.woff2') format('woff2'),
+    /* Modern Browsers */ url('../fonts/roboto-v27-latin-500.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/roboto-v27-latin-500.ttf') format('truetype'),
+    /* Legacy iOS */ url('../fonts/roboto-v27-latin-500.svg#Roboto') format('svg');
+}
+
+/* roboto-500italic - latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: italic;
+  font-weight: 500;
+  src: url('../fonts/roboto-v27-latin-500italic.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/roboto-v27-latin-500italic.eot?#iefix') format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/roboto-v27-latin-500italic.woff2') format('woff2'),
+    /* Modern Browsers */ url('../fonts/roboto-v27-latin-500italic.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/roboto-v27-latin-500italic.ttf') format('truetype'),
+    /* Legacy iOS */ url('../fonts/roboto-v27-latin-500italic.svg#Roboto') format('svg');
+}
+
+/* roboto-700 - latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 700;
+  src: url('../fonts/roboto-v27-latin-700.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/roboto-v27-latin-700.eot?#iefix') format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/roboto-v27-latin-700.woff2') format('woff2'),
+    /* Modern Browsers */ url('../fonts/roboto-v27-latin-700.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/roboto-v27-latin-700.ttf') format('truetype'),
+    /* Legacy iOS */ url('../fonts/roboto-v27-latin-700.svg#Roboto') format('svg');
+}
+
+/* roboto-700italic - latin */
+@font-face {
+  font-family: 'Roboto';
+  font-style: italic;
+  font-weight: 700;
+  src: url('../fonts/roboto-v27-latin-700italic.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/roboto-v27-latin-700italic.eot?#iefix') format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/roboto-v27-latin-700italic.woff2') format('woff2'),
+    /* Modern Browsers */ url('../fonts/roboto-v27-latin-700italic.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/roboto-v27-latin-700italic.ttf') format('truetype'),
+    /* Legacy iOS */ url('../fonts/roboto-v27-latin-700italic.svg#Roboto') format('svg');
+}
+
+/* source-code-pro-regular - latin */
+@font-face {
+  font-family: 'Source Code Pro';
+  font-style: normal;
+  font-weight: 400;
+  src: url('../fonts/source-code-pro-v14-latin-regular.eot'); /* IE9 Compat Modes */
+  src:
+    local(''),
+    /* IE6-IE8 */ url('../fonts/source-code-pro-v14-latin-regular.eot?#iefix')
+      format('embedded-opentype'),
+    /* Super Modern Browsers */ url('../fonts/source-code-pro-v14-latin-regular.woff2')
+      format('woff2'),
+    /* Modern Browsers */ url('../fonts/source-code-pro-v14-latin-regular.woff') format('woff'),
+    /* Safari, Android, iOS */ url('../fonts/source-code-pro-v14-latin-regular.ttf')
+      format('truetype'),
+    /* Legacy iOS */ url('../fonts/source-code-pro-v14-latin-regular.svg#SourceCodePro')
+      format('svg');
+}