{
+ toggleTagsActive(message.id);
+ }}
+ >
+
+ {formatDate(message.timestamp)}
+ {message.text}
+
+ {message.tags && (
+
+
+
+ )}
+
+ );
+}
diff --git a/src/components/DataView/consts/consts.js b/src/components/DataView/consts/consts.js
index 936604e8..f2d24937 100644
--- a/src/components/DataView/consts/consts.js
+++ b/src/components/DataView/consts/consts.js
@@ -1,8 +1,8 @@
-export const TAGS_LEVEL = {
- critical: ["emerg", "fatal", "alert", "crit", "critical"],
- error: ["err", "eror", "error", "warning"],
- warning: ["warn", "warning"],
- info: ["info", "information", "notice"],
- debug: ["dbug", "debug"],
- trace: ["trace"],
-};
\ No newline at end of file
+export const TAGS_LEVEL = {
+ critical: ["emerg", "fatal", "alert", "crit", "critical"],
+ error: ["err", "eror", "error"],
+ warning: ["warn", "warning"],
+ info: ["info", "information", "notice"],
+ debug: ["dbug", "debug"],
+ trace: ["trace"],
+};
diff --git a/src/components/DataView/styled/index.js b/src/components/DataView/styled/index.js
index 7ed2ed64..17208569 100644
--- a/src/components/DataView/styled/index.js
+++ b/src/components/DataView/styled/index.js
@@ -1,5 +1,4 @@
import styled from "@emotion/styled";
-import { THEME_COLORS } from '../theme/theme';
import { CircularProgress } from "@mui/material";
import darkTheme from "../../../theme/dark";
@@ -44,14 +43,18 @@ export const DataViewCont = styled.div`
`;
export const LogRow = styled.div`
- padding: 0.3rem;
+ font-family: monospace;
color: white;
font-size: 12px;
cursor: pointer;
- margin-bottom: 4px;
padding-left: 0.5rem;
margin-left: 0.25rem;
transition: 0.2s all;
+ display: flex;
+ flex-direction: column;
+ border-left: 4px solid ${(props) => props.rowColor};
+ margin-bottom: 2px;
+ margin-top: 2px;
&:hover {
background: black;
}
@@ -59,13 +62,14 @@ export const LogRow = styled.div`
p {
display: inline-block;
}
-
- border-left: 4px solid ${(props) => props.rowColor};
+ .log-ts-row {
+ display: flex;
+ }
`;
export const RowLogContent = styled.span`
font-size: 12px;
- font-family: monospace;
+
color: ${theme.textWhite};
line-height: 1.5;
`;
@@ -74,6 +78,8 @@ export const RowTimestamp = styled.span`
position: relative;
color: ${theme.textColor};
margin-right: 0.25rem;
+ white-space: nowrap;
+ line-height: 1.5;
`;
export const Loader = styled(CircularProgress)`
diff --git a/src/components/DataView/theme/theme.js b/src/components/DataView/theme/theme.js
index 0137ae4a..db2fab4c 100644
--- a/src/components/DataView/theme/theme.js
+++ b/src/components/DataView/theme/theme.js
@@ -1,19 +1,17 @@
-
-export const THEME_COLORS = {
- logsTimestamp: "#e8e8e8",
- scrollbarThumb: "#616161",
- logContent: "#ddd",
- dataViewBackground: "#1a1a1a",
- emptyViewMessage: "#aaa",
-};
-
-
-export const LEVEL_COLORS = {
- critical: "purple",
- error: "red",
- warning: "yellow",
- info: "green",
- debug: "blue",
- trace: "lightblue",
- unknown: "gray",
-};
\ No newline at end of file
+export const THEME_COLORS = {
+ logsTimestamp: "#e8e8e8",
+ scrollbarThumb: "#616161",
+ logContent: "#ddd",
+ dataViewBackground: "#1a1a1a",
+ emptyViewMessage: "#aaa",
+};
+
+export const LEVEL_COLORS = {
+ critical: "purple",
+ error: "red",
+ warning: "orange",
+ info: "green",
+ debug: "blue",
+ trace: "lightblue",
+ unknown: "gray",
+};