Bläddra i källkod

style after merge

sunguroku 5 år sedan
förälder
incheckning
5631ab5db4

+ 0 - 1
dashboard/src/main/home/dashboard/expanded-chart/ExpandedChart.tsx

@@ -149,7 +149,6 @@ export default class ExpandedChart extends Component<PropsType, StateType> {
         />
       );
     } else if (this.state.currentTab === 'values') {
-      console.log(chart)
       return (
         <ValuesYaml
           currentChart={chart}

+ 30 - 2
dashboard/src/main/home/dashboard/expanded-chart/log/LogSection.tsx

@@ -29,7 +29,13 @@ export default class LogSection extends Component<PropsType, StateType> {
 
   renderPodTabs = () => {
     return this.state.pods.map((pod, i) => {
-      return <div key={i}>{pod}</div>
+      return (
+        <Tab key={i} onClick={() => {
+          this.setState({selectedPod: pod})
+        }}>
+          {pod}
+        </Tab>
+      )
     })
   }
 
@@ -47,7 +53,9 @@ export default class LogSection extends Component<PropsType, StateType> {
   render() {
     return (
       <StyledLogSection>
-        {this.renderPodTabs()}
+        <TabWrapper>
+          {this.renderPodTabs()}
+        </TabWrapper>
         {this.renderLogs()}
       </StyledLogSection>
     );
@@ -56,6 +64,26 @@ export default class LogSection extends Component<PropsType, StateType> {
 
 LogSection.contextType = Context;
 
+const TabWrapper = styled.div`
+  display: flex;
+  flexDirection: row;
+  overflow: hidden;
+`
+
+const Tab = styled.div`
+  height: 100%;
+  align-items: center;
+  justify-content: center;
+  font-size: 13px;
+  background-color: red;
+  color: white;
+  border-radius: 20px;
+  text-shadow: 0px 0px 8px none;
+  cursor: pointer;
+  :hover {
+    color: #aaaabb99;
+  }
+`;
 
 const StyledLogSection = styled.div`
   width: 100%;

+ 4 - 3
dashboard/src/main/home/dashboard/expanded-chart/log/Logs.tsx

@@ -42,9 +42,9 @@ export default class Logs extends Component<PropsType, StateType> {
 
   render() {
     return (
-      <StyledLogSection ref={this.scrollRef}>
+      <LogStream ref={this.scrollRef}>
         {this.renderLogs()}
-      </StyledLogSection>
+      </LogStream>
     );
   }
 }
@@ -52,11 +52,12 @@ export default class Logs extends Component<PropsType, StateType> {
 Logs.contextType = Context;
 
 
-const StyledLogSection = styled.div`
+const LogStream = styled.div`
   width: 100%;
   height: 100%;
   background: #202227;
   position: relative;
   padding: 0px;
   user-select: text;
+  overflow: auto;
 `;