mirror of
https://github.com/amir20/dozzle.git
synced 2025-12-21 21:33:18 +01:00
0e5830df20
* Makes changes to log streamer to guess the event level * Updates diff * Adds log class for level * Groups messages by level * Fixes bugs for grouping * Fixes tests * Fixes json bug * Updates logic to support other kind of levels * Fixes mobile view
57 lines
883 B
Vue
57 lines
883 B
Vue
<template>
|
|
<div :class="level" :data-position="position"></div>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { Position } from "@/models/LogEntry";
|
|
|
|
defineProps<{
|
|
level?: string;
|
|
position?: Position;
|
|
}>();
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
div {
|
|
display: inline-block;
|
|
width: 0.7em;
|
|
height: 0.7em;
|
|
border-radius: 0.5em;
|
|
|
|
&[data-position="middle"] {
|
|
border-radius: 0;
|
|
height: 2em;
|
|
margin: -0.5em 0;
|
|
}
|
|
|
|
&[data-position="start"] {
|
|
border-radius: 0.5em 0.5em 0 0;
|
|
height: 1.2em;
|
|
margin-bottom: -0.4em;
|
|
}
|
|
|
|
&[data-position="end"] {
|
|
border-radius: 0 0 0.5em 0.5em;
|
|
height: 1.4em;
|
|
margin-top: -0.4em;
|
|
}
|
|
|
|
&.debug,
|
|
&.trace {
|
|
background-color: #9c27b0;
|
|
}
|
|
|
|
&.info {
|
|
background-color: #00b5ad;
|
|
}
|
|
|
|
&.error,
|
|
&.fatal {
|
|
background-color: #f44336;
|
|
}
|
|
|
|
&.warn {
|
|
background-color: #ff9800;
|
|
}
|
|
}
|
|
</style>
|