nuxt-glorious 1.2.9-9-4 → 1.2.9-9-6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/module.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "nuxt-glorious",
3
3
  "configKey": "glorious",
4
- "version": "1.2.9-9-4"
4
+ "version": "1.2.9-9-6"
5
5
  }
@@ -1,12 +1,19 @@
1
1
  <script lang="ts" setup>
2
- const modelValue = defineModel()
2
+ import { useId } from '#imports'
3
+
4
+ const filler = ref(true)
5
+ const id = useId()
6
+ const value = [5, 4, 3, 2, 1]
7
+ const modelValue: any = defineModel()
3
8
  const computeModelValue = (event: Event) => {
9
+ const check = document.querySelectorAll(`input[name=star-name${id}]`)
10
+ check.forEach((item) => {
11
+ item.nextElementSibling?.classList.remove('checked')
12
+ })
13
+ filler.value = false
4
14
  const target = event.target as HTMLInputElement
5
15
  modelValue.value = target.value
6
16
  }
7
-
8
- const id = useId()
9
- const value = [5, 4, 3, 2, 1]
10
17
  </script>
11
18
 
12
19
  <template>
@@ -15,6 +22,7 @@ const value = [5, 4, 3, 2, 1]
15
22
  v-for="(item, index) in 5"
16
23
  :key="index"
17
24
  >
25
+ {{ value[index] < modelValue }}
18
26
  <input
19
27
  type="radio"
20
28
  :id="`star${item}-${id}`"
@@ -22,7 +30,10 @@ const value = [5, 4, 3, 2, 1]
22
30
  :value="value[index]"
23
31
  @input="computeModelValue"
24
32
  />
25
- <label :for="`star${item}-${id}`"></label>
33
+ <label
34
+ :for="`star${item}-${id}`"
35
+ :class="[value[index] < modelValue + 1 && filler ? 'checked' : '']"
36
+ />
26
37
  </template>
27
38
  </div>
28
39
  </template>
@@ -21,6 +21,10 @@
21
21
  .rating input:checked ~ label,
22
22
  .rating label:hover,
23
23
  .rating label:hover ~ label {
24
- color: #ffd700;
24
+ color: #ffd700 !important;
25
25
  transition: color 0.3s;
26
+ }
27
+
28
+ label.checked {
29
+ color: #ffd700;
26
30
  }
@@ -20,6 +20,10 @@
20
20
  .rating input:checked ~ label,
21
21
  .rating label:hover,
22
22
  .rating label:hover ~ label {
23
- color: #ffd700;
23
+ color: #ffd700 !important;
24
24
  transition: color 0.3s;
25
25
  }
26
+
27
+ label.checked {
28
+ color: #ffd700;
29
+ }
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.2.9-9-4",
2
+ "version": "1.2.9-9-6",
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",