feat: add tooltip

This commit is contained in:
Fine 2023-11-17 00:12:42 +08:00
parent 00e1cb1772
commit 91838d1b71
3 changed files with 9 additions and 8 deletions

View File

@ -62,7 +62,7 @@ html {
} }
html.dark { html.dark {
--el-color-primary: rgb(64, 158, 255); --el-color-primary: #409eff;
--theme-background: #212224; --theme-background: #212224;
--font-color: #fafbfc; --font-color: #fafbfc;
--disabled-color: #ccc; --disabled-color: #ccc;

View File

@ -25,9 +25,11 @@ limitations under the License. -->
{{ dateFormat(data.timestamp) }} {{ dateFormat(data.timestamp) }}
</span> </span>
<span v-else-if="item.label === 'tags'" :class="level.toLowerCase()"> > </span> <span v-else-if="item.label === 'tags'" :class="level.toLowerCase()"> > </span>
<span v-else-if="item.label === 'traceId'" :class="noLink ? '' : 'blue'"> <el-tooltip v-else-if="item.label === 'traceId'" content="Trace Link">
<span :class="noLink ? '' : 'blue'">
<Icon v-if="!noLink" iconName="merge" /> <Icon v-if="!noLink" iconName="merge" />
</span> </span>
</el-tooltip>
<span v-else>{{ data[item.label] }}</span> <span v-else>{{ data[item.label] }}</span>
</div> </div>
</div> </div>
@ -89,6 +91,7 @@ limitations under the License. -->
cursor: pointer; cursor: pointer;
width: 20px; width: 20px;
text-align: center; text-align: center;
position: relative;
span { span {
display: inline-block; display: inline-block;
@ -96,7 +99,7 @@ limitations under the License. -->
} }
.blue { .blue {
color: #448dfe; color: var(--el-color-primary);
} }
} }
@ -104,7 +107,7 @@ limitations under the License. -->
width: 15px; width: 15px;
text-align: center; text-align: center;
color: var(--sw-green); color: var(--sw-green);
font-weight: 600; font-weight: 400;
font-size: 14px; font-size: 14px;
} }

View File

@ -287,7 +287,6 @@ limitations under the License. -->
} }
.profiled { .profiled {
// background-color: #eee;
background-color: var(--sw-table-header); background-color: var(--sw-table-header);
position: relative; position: relative;
} }
@ -329,7 +328,6 @@ limitations under the License. -->
} }
.trace-item { .trace-item {
// display: flex;
white-space: nowrap; white-space: nowrap;
position: relative; position: relative;
cursor: pointer; cursor: pointer;