nuxt-glorious 1.2.1-5 → 1.2.1-7

Sign up to get free protection for your applications and to get access to all the features.
package/dist/module.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "glorious",
3
3
  "configKey": "glorious",
4
- "version": "1.2.1-5"
4
+ "version": "1.2.1-7"
5
5
  }
@@ -0,0 +1,77 @@
1
+ .glorious-simple-table {
2
+ @apply overflow-x-auto;
3
+ }
4
+ .glorious-simple-table.color-orange > table {
5
+ @apply border border-orange-400;
6
+ }
7
+ .glorious-simple-table.color-orange > table > thead {
8
+ @apply rounded-t-md overflow-hidden;
9
+ @apply bg-orange-400;
10
+ }
11
+ .glorious-simple-table.color-orange > table > tbody > tr:nth-child(even) {
12
+ @apply bg-orange-50;
13
+ }
14
+ .glorious-simple-table.color-orange > table > tbody > tr > td {
15
+ @apply px-4 py-1 text-center;
16
+ }
17
+ .glorious-simple-table.color-blue > table {
18
+ @apply border border-blue-400;
19
+ }
20
+ .glorious-simple-table.color-blue > table > thead {
21
+ @apply rounded-t-md overflow-hidden;
22
+ @apply bg-blue-400;
23
+ }
24
+ .glorious-simple-table.color-blue > table > tbody > tr:nth-child(even) {
25
+ @apply bg-blue-50;
26
+ }
27
+ .glorious-simple-table.color-blue > table > tbody > tr > td {
28
+ @apply px-4 py-1 text-center;
29
+ }
30
+ .glorious-simple-table.color-gray > table {
31
+ @apply border border-gray-400;
32
+ }
33
+ .glorious-simple-table.color-gray > table > thead {
34
+ @apply rounded-t-md overflow-hidden;
35
+ @apply bg-gray-400;
36
+ }
37
+ .glorious-simple-table.color-gray > table > tbody > tr:nth-child(even) {
38
+ @apply bg-gray-50;
39
+ }
40
+ .glorious-simple-table.color-gray > table > tbody > tr > td {
41
+ @apply px-4 py-1 text-center;
42
+ }
43
+ .glorious-simple-table.color-red > table {
44
+ @apply border border-red-400;
45
+ }
46
+ .glorious-simple-table.color-red > table > thead {
47
+ @apply rounded-t-md overflow-hidden;
48
+ @apply bg-red-400;
49
+ }
50
+ .glorious-simple-table.color-red > table > tbody > tr:nth-child(even) {
51
+ @apply bg-red-50;
52
+ }
53
+ .glorious-simple-table.color-red > table > tbody > tr > td {
54
+ @apply px-4 py-1 text-center;
55
+ }
56
+ .glorious-simple-table.color-green > table {
57
+ @apply border border-green-400;
58
+ }
59
+ .glorious-simple-table.color-green > table > thead {
60
+ @apply rounded-t-md overflow-hidden;
61
+ @apply bg-green-400;
62
+ }
63
+ .glorious-simple-table.color-green > table > tbody > tr:nth-child(even) {
64
+ @apply bg-green-50;
65
+ }
66
+ .glorious-simple-table.color-green > table > tbody > tr > td {
67
+ @apply px-4 py-1 text-center;
68
+ }
69
+ .glorious-simple-table > table {
70
+ @apply w-full;
71
+ }
72
+ .glorious-simple-table > table > thead > tr > th {
73
+ @apply px-4 py-2 text-center;
74
+ }
75
+ .glorious-simple-table > table > tbody > tr > td {
76
+ @apply px-4 py-1 text-center;
77
+ }
@@ -30,7 +30,7 @@ const emits = defineEmits(["update:modelValue"]);
30
30
  <input
31
31
  type="checkbox"
32
32
  :disabled="props.disabled"
33
- @input="emits('update:modelValue', $event.currentTarget.checked)"
33
+ @input="emits('update:modelValue', $event?.currentTarget.checked)"
34
34
  />
35
35
  <div></div>
36
36
  </label>
@@ -0,0 +1,119 @@
1
+ <script lang="ts" setup>
2
+ type simpleTableInterface = {
3
+ head: Array<String>;
4
+ body: Array<any>;
5
+ };
6
+
7
+ const props = defineProps({
8
+ color: {
9
+ required: false,
10
+ default: "blue",
11
+ type: String as () => "orange" | "blue" | "gray" | "red" | "green",
12
+ },
13
+ table: {
14
+ required: true,
15
+ type: Object as () => simpleTableInterface,
16
+ },
17
+ });
18
+ </script>
19
+
20
+ <template>
21
+ <div class="glorious-simple-table" :class="[`color-${props.color}`]">
22
+ <table>
23
+ <thead>
24
+ <tr>
25
+ <th v-for="(headItem, index) in props.table.head" :key="index">
26
+ {{ headItem }}
27
+ </th>
28
+ </tr>
29
+ </thead>
30
+ <tbody>
31
+ <tr v-for="(bodyItem, index) in props.table.body" :key="index">
32
+ <td v-for="(bodyRecord, rIndex) in bodyItem" :key="rIndex">
33
+ {{ bodyRecord }}
34
+ </td>
35
+ </tr>
36
+ </tbody>
37
+ </table>
38
+ </div>
39
+ </template>
40
+
41
+ <style>
42
+ .glorious-simple-table {
43
+ @apply overflow-x-auto;
44
+ }
45
+ .glorious-simple-table.color-orange > table {
46
+ @apply border border-orange-400;
47
+ }
48
+ .glorious-simple-table.color-orange > table > thead {
49
+ @apply rounded-t-md overflow-hidden;
50
+ @apply bg-orange-400;
51
+ }
52
+ .glorious-simple-table.color-orange > table > tbody > tr:nth-child(even) {
53
+ @apply bg-orange-50;
54
+ }
55
+ .glorious-simple-table.color-orange > table > tbody > tr > td {
56
+ @apply px-4 py-1 text-center;
57
+ }
58
+ .glorious-simple-table.color-blue > table {
59
+ @apply border border-blue-400;
60
+ }
61
+ .glorious-simple-table.color-blue > table > thead {
62
+ @apply rounded-t-md overflow-hidden;
63
+ @apply bg-blue-400;
64
+ }
65
+ .glorious-simple-table.color-blue > table > tbody > tr:nth-child(even) {
66
+ @apply bg-blue-50;
67
+ }
68
+ .glorious-simple-table.color-blue > table > tbody > tr > td {
69
+ @apply px-4 py-1 text-center;
70
+ }
71
+ .glorious-simple-table.color-gray > table {
72
+ @apply border border-gray-400;
73
+ }
74
+ .glorious-simple-table.color-gray > table > thead {
75
+ @apply rounded-t-md overflow-hidden;
76
+ @apply bg-gray-400;
77
+ }
78
+ .glorious-simple-table.color-gray > table > tbody > tr:nth-child(even) {
79
+ @apply bg-gray-50;
80
+ }
81
+ .glorious-simple-table.color-gray > table > tbody > tr > td {
82
+ @apply px-4 py-1 text-center;
83
+ }
84
+ .glorious-simple-table.color-red > table {
85
+ @apply border border-red-400;
86
+ }
87
+ .glorious-simple-table.color-red > table > thead {
88
+ @apply rounded-t-md overflow-hidden;
89
+ @apply bg-red-400;
90
+ }
91
+ .glorious-simple-table.color-red > table > tbody > tr:nth-child(even) {
92
+ @apply bg-red-50;
93
+ }
94
+ .glorious-simple-table.color-red > table > tbody > tr > td {
95
+ @apply px-4 py-1 text-center;
96
+ }
97
+ .glorious-simple-table.color-green > table {
98
+ @apply border border-green-400;
99
+ }
100
+ .glorious-simple-table.color-green > table > thead {
101
+ @apply rounded-t-md overflow-hidden;
102
+ @apply bg-green-400;
103
+ }
104
+ .glorious-simple-table.color-green > table > tbody > tr:nth-child(even) {
105
+ @apply bg-green-50;
106
+ }
107
+ .glorious-simple-table.color-green > table > tbody > tr > td {
108
+ @apply px-4 py-1 text-center;
109
+ }
110
+ .glorious-simple-table > table {
111
+ @apply w-full;
112
+ }
113
+ .glorious-simple-table > table > thead > tr > th {
114
+ @apply px-4 py-2 text-center;
115
+ }
116
+ .glorious-simple-table > table > tbody > tr > td {
117
+ @apply px-4 py-1 text-center;
118
+ }
119
+ </style>
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.2.1-5",
2
+ "version": "1.2.1-7",
3
3
  "name": "nuxt-glorious",
4
4
  "description": "This package provides many things needed by a project, including server requests and authentication, SEO and other requirements of a project.",
5
5
  "repository": "sajadhzj/nuxt-glorious",