diff --git a/frontend/src/container/LogsContextList/LogsContextList.styles.scss b/frontend/src/container/LogsContextList/LogsContextList.styles.scss
index 18bb285140..1b160a65ab 100644
--- a/frontend/src/container/LogsContextList/LogsContextList.styles.scss
+++ b/frontend/src/container/LogsContextList/LogsContextList.styles.scss
@@ -3,34 +3,30 @@
.show-more-button {
position: absolute;
- z-index: 1;
opacity: 1;
+ z-index: 1;
+
+ cursor: pointer;
&.up {
- top: 0;
+ top: -1px;
+ left: -1px;
}
&.down {
- bottom: 0;
+ bottom: -1px;
+ left: -1px;
+ }
+
+ &.disabled {
+ cursor: not-allowed;
}
}
.virtuoso-list {
&::-webkit-scrollbar {
- width: 0.1rem;
- height: 0.1rem;
- }
- }
-
- &.logs-context-list-asc {
- .virtuoso-list {
- padding-top: 16px;
- }
- }
-
- &.logs-context-list-desc {
- .virtuoso-list {
- padding-bottom: 16px;
+ width: 0.3rem;
+ height: 0.3rem;
}
}
}
diff --git a/frontend/src/container/LogsContextList/ShowButton.styles.scss b/frontend/src/container/LogsContextList/ShowButton.styles.scss
index ee765f5c08..408847e10f 100644
--- a/frontend/src/container/LogsContextList/ShowButton.styles.scss
+++ b/frontend/src/container/LogsContextList/ShowButton.styles.scss
@@ -1,31 +1,31 @@
.show-more-button {
- background-color: var(--bg-slate-400);
- color: var(--bg-vanilla-100);
- display: flex;
- padding: 4px 8px;
- align-items: center;
- gap: 3px;
- border: none;
- margin: 0;
+ background-color: var(--bg-slate-400);
+ color: var(--bg-vanilla-100);
+ display: flex;
+ padding: 4px 8px;
+ align-items: center;
+ gap: 3px;
+ border: none;
+ margin: 0;
}
.show-more-button {
- &.disabled {
- background-color: var(--bg-slate-200);
- color: var(--bg-vanilla-400);
- }
+ &.disabled {
+ background-color: var(--bg-slate-200);
+ color: var(--bg-vanilla-400);
+ }
}
.lightMode {
- .show-more-button {
- background-color: var(--bg-vanilla-300);
- color: var(--bg-slate-400);
- }
+ .show-more-button {
+ background-color: var(--bg-vanilla-300);
+ color: var(--bg-slate-400);
+ }
- .show-more-button {
- &.disabled {
- background-color: var(--bg-vanilla-300);
- color: var(--bg-vanilla-400);
- }
- }
-}
\ No newline at end of file
+ .show-more-button {
+ &.disabled {
+ background-color: var(--bg-vanilla-300);
+ color: var(--bg-vanilla-400);
+ }
+ }
+}
diff --git a/frontend/src/container/LogsContextList/ShowButton.tsx b/frontend/src/container/LogsContextList/ShowButton.tsx
index e687a5610d..814d5e8f97 100644
--- a/frontend/src/container/LogsContextList/ShowButton.tsx
+++ b/frontend/src/container/LogsContextList/ShowButton.tsx
@@ -41,7 +41,7 @@ function ShowButton({
onClick={onClick}
icon={getIcons()}
className={cx(
- 'show-more-button',
+ 'show-more-button periscope-btn',
order === ORDERBY_FILTERS.ASC ? 'up' : 'down',
isDisabled && 'disabled',
)}
diff --git a/frontend/src/container/TracesExplorer/Controls/styles.ts b/frontend/src/container/TracesExplorer/Controls/styles.ts
index f91bc43363..be74f2db18 100644
--- a/frontend/src/container/TracesExplorer/Controls/styles.ts
+++ b/frontend/src/container/TracesExplorer/Controls/styles.ts
@@ -5,4 +5,5 @@ export const Container = styled.div`
align-items: center;
justify-content: flex-end;
gap: 0.5rem;
+ margin: 4px 0;
`;
diff --git a/frontend/src/pages/TracesExplorer/TracesExplorer.styles.scss b/frontend/src/pages/TracesExplorer/TracesExplorer.styles.scss
index ae985deb74..5ab2bd07b2 100644
--- a/frontend/src/pages/TracesExplorer/TracesExplorer.styles.scss
+++ b/frontend/src/pages/TracesExplorer/TracesExplorer.styles.scss
@@ -2,6 +2,12 @@
display: flex;
flex-direction: row-reverse;
align-items: center;
- margin: 1rem 0 0.5rem 0;
+ margin: 8px 16px;
gap: 8px;
}
+
+.traces-explorer-views {
+ .ant-tabs-tabpane {
+ padding: 0 8px;
+ }
+}
diff --git a/frontend/src/pages/TracesExplorer/index.tsx b/frontend/src/pages/TracesExplorer/index.tsx
index 22d4b71d2e..3d39aab2cb 100644
--- a/frontend/src/pages/TracesExplorer/index.tsx
+++ b/frontend/src/pages/TracesExplorer/index.tsx
@@ -192,7 +192,7 @@ function TracesExplorer(): JSX.Element {
-
+
- ;
+
);
}