Lens app source code (#119)

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

dashboard/client/components/+workloads-pods/pod-logs-dialog.scss

@@ -0,0 +1,110 @@
+.PodLogsDialog {
+  --log-line-height: 16px;
+
+  .Wizard {
+    width: 90vw;
+    max-height: none;
+
+    .WizardStep {
+      & > .step-content.scrollable {
+        max-height: none;
+      }
+
+      & > :last-child {
+        padding: $padding * 2;
+      }
+    }
+  }
+
+  .log-controls {
+    padding-bottom: $padding * 2;
+
+    .time-range {
+      flex-grow: 2;
+      text-align: center;
+    }
+
+    .controls {
+      width: 100%;
+    }
+
+    .control-buttons {
+      margin-right: 0;
+      white-space: nowrap;
+
+      .Icon {
+        border-radius: $radius;
+        padding: 3px;
+
+        &:hover {
+          color: $textColorPrimary;
+          background: #f4f4f4;
+        }
+
+        &.active {
+          color: $primary;
+          background: #f4f4f4;
+        }
+      }
+    }
+
+    @include media("<=desktop") {
+      flex-direction: column;
+      align-items: start;
+
+      .container {
+        width: 100%;
+      }
+
+      .controls {
+        margin-top: $margin * 2;
+
+        .time-range {
+          text-align: left;
+        }
+      }
+    }
+  }
+
+  .logs-area {
+    position: relative;
+    @include custom-scrollbar;
+
+    // fix for `this.logsArea.scrollTop = this.logsArea.scrollHeight`
+    // `overflow: overlay` don't allow scroll to the last line
+    overflow: auto;
+
+    color: #C5C8C6;
+    background: #1D1F21;
+    line-height: var(--log-line-height);
+    border-radius: 2px;
+    height: 45vh;
+    padding: $padding / 4 $padding;
+    font-family: $font-monospace;
+    font-size: smaller;
+    white-space: pre;
+
+    .no-logs {
+      text-align: center;
+    }
+  }
+
+  .new-logs-sep {
+    position: relative;
+    display: block;
+    height: 0;
+    border-top: 1px solid $primary;
+    margin: $margin * 2;
+
+    &:after {
+      position: absolute;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      content: 'new';
+      background: $primary;
+      color: white;
+      padding: $padding / 3 $padding /2;
+      border-radius: $radius;
+    }
+  }
+}