vue components refactoring

2026-04-19 00:22:15 +00:00 · 2022-04-13 16:19:10 +02:00
parent 6a4bfa8bfe
commit 338f8664b7
251 changed files with 1068 additions and 1943 deletions
--- a/resources/js/components/UI/ProgressChart/DotLabel.vue
+++ b/resources/js/components/UI/ProgressChart/DotLabel.vue
@@ -0,0 +1,64 @@
+<template>
+    <div class="label">
+        <span :class="['label-dot', color]"></span>
+        <b class="label-title">
+            {{ title }}
+        </b>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'DotLabel',
+    props: ['color', 'title'],
+}
+</script>
+
+<style lang="scss" scoped>
+.label {
+    display: flex;
+    align-items: center;
+
+    .label-dot {
+        margin-right: 10px;
+        width: 8px;
+        height: 8px;
+        display: block;
+        border-radius: 8px;
+        flex: none;
+
+        &.success {
+            background: #0abb87;
+        }
+
+        &.danger {
+            background: #fd397a;
+        }
+
+        &.warning {
+            background: #ffb822;
+        }
+
+        &.info {
+            background: #5578eb;
+        }
+
+        &.primary {
+            background: red;
+        }
+
+        &.purple {
+            background: #9d66fe;
+        }
+
+        &.secondary {
+            background: #e1e1ef;
+        }
+    }
+
+    .label-title {
+        font-size: 16px;
+        font-weight: 700;
+    }
+}
+</style>