@dcrackel/hematournamentui 1.0.690 → 1.0.692
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/HemaTournamentUI-lib.es.js +39 -39
- package/dist/HemaTournamentUI-lib.umd.js +1 -1
- package/package.json +1 -1
- package/src/stories/Organisms/Cards/BoutCard/Variants/BoutCardInactive/BoutCardInactive.vue +24 -15
- package/src/stories/Organisms/Cards/DirectorAssignmentCard/DirectorAssignmentCard.vue +31 -26
package/package.json
CHANGED
|
@@ -61,39 +61,51 @@
|
|
|
61
61
|
|
|
62
62
|
<!-- Mobile -->
|
|
63
63
|
<section
|
|
64
|
-
class="relative flex md:hidden items-
|
|
64
|
+
class="relative flex md:hidden items-center border rounded-md bg-poolBox transition overflow-hidden"
|
|
65
65
|
:class="[reorderMode ? 'cursor-grab ring-2 ring-dashed ring-slate-300' : '']"
|
|
66
66
|
>
|
|
67
67
|
<!-- main tappable area -->
|
|
68
|
-
<div class="flex flex-1 items-center p-4" @click="onCardClick">
|
|
68
|
+
<div class="flex flex-1 items-center p-4 min-w-0" @click="onCardClick">
|
|
69
69
|
<!-- left portrait or index when reordering -->
|
|
70
|
-
<div v-if="!reorderMode" class="relative flex flex-col items-center">
|
|
70
|
+
<div v-if="!reorderMode" class="relative flex flex-col items-center flex-none">
|
|
71
71
|
<img :src="fencer1Portrait" alt="Portrait" class="w-12 h-12 rounded-full"/>
|
|
72
72
|
<div :class="`w-4 h-4 rounded-full bg-${card.fencer1.colorDot} relative -mt-4 ml-9 z-10`"></div>
|
|
73
73
|
</div>
|
|
74
74
|
|
|
75
|
-
<div v-if="reorderMode" class="flex flex-col items-center -mt-3 select-none">
|
|
75
|
+
<div v-if="reorderMode" class="flex flex-col items-center -mt-3 select-none flex-none">
|
|
76
76
|
<BaseText text="bout" size="xs" color="quinary" weight="bold"/>
|
|
77
77
|
<BaseText :text="`${(c.ids.orderIndex ?? 0) + 1}`" size="3xl" color="quaternary" weight="bold"/>
|
|
78
78
|
</div>
|
|
79
79
|
|
|
80
80
|
<!-- center -->
|
|
81
|
-
<div class="text-center flex-1 mx-4 flex flex-col items-center justify-center leading-none">
|
|
81
|
+
<div class="text-center flex-1 mx-4 min-w-0 flex flex-col items-center justify-center leading-none">
|
|
82
82
|
<div class="flex items-center justify-center">
|
|
83
|
-
<div :class="`mr-2 bg-${card.fencer1.colorDot} w-3 h-3`"></div>
|
|
84
|
-
<BaseText
|
|
83
|
+
<div :class="`mr-2 bg-${card.fencer1.colorDot} w-3 h-3 flex-none`"></div>
|
|
84
|
+
<BaseText
|
|
85
|
+
:text="c.fencer1.name"
|
|
86
|
+
size="sm"
|
|
87
|
+
color="quinary"
|
|
88
|
+
weight="bold"
|
|
89
|
+
class="leading-none truncate max-w-full"
|
|
90
|
+
/>
|
|
85
91
|
</div>
|
|
86
92
|
|
|
87
93
|
<BaseText text="vs" size="xs" color="quaternary"/>
|
|
88
94
|
|
|
89
95
|
<div class="flex items-center justify-center">
|
|
90
|
-
<div :class="`mr-2 bg-${card.fencer2.colorDot} w-3 h-3`"></div>
|
|
91
|
-
<BaseText
|
|
96
|
+
<div :class="`mr-2 bg-${card.fencer2.colorDot} w-3 h-3 flex-none`"></div>
|
|
97
|
+
<BaseText
|
|
98
|
+
:text="c.fencer2.name"
|
|
99
|
+
size="sm"
|
|
100
|
+
color="quinary"
|
|
101
|
+
weight="bold"
|
|
102
|
+
class="leading-none truncate max-w-full"
|
|
103
|
+
/>
|
|
92
104
|
</div>
|
|
93
105
|
</div>
|
|
94
106
|
|
|
95
107
|
<!-- right portrait -->
|
|
96
|
-
<div class="relative w-12 h-12">
|
|
108
|
+
<div class="relative w-12 h-12 flex-none">
|
|
97
109
|
<img :src="fencer2Portrait" alt="Portrait" class="w-12 h-12 rounded-full"/>
|
|
98
110
|
<div :class="`absolute -mt-4 -right-1 w-4 h-4 rounded-full bg-${card.fencer2.colorDot} ring-2 ring-white`"></div>
|
|
99
111
|
</div>
|
|
@@ -103,18 +115,15 @@
|
|
|
103
115
|
<button
|
|
104
116
|
v-if="isAdmin && isScheduled && !reorderMode"
|
|
105
117
|
type="button"
|
|
106
|
-
class="w-10 flex items-center justify-center
|
|
118
|
+
class="flex-none w-10 h-full flex items-center justify-center bg-white/60 hover:bg-white"
|
|
107
119
|
@click.stop="$emit('assign', c.ids)"
|
|
108
|
-
aria-label="
|
|
120
|
+
aria-label="Assign director"
|
|
109
121
|
title="Assign director"
|
|
110
122
|
>
|
|
111
123
|
<BaseIcon icon-name="fa-chevron-right" size="sm" color="quinary" hover="primary" />
|
|
112
124
|
</button>
|
|
113
125
|
</section>
|
|
114
126
|
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
127
|
</section>
|
|
119
128
|
</template>
|
|
120
129
|
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
@click="selectDirector"
|
|
6
6
|
>
|
|
7
7
|
<!-- Portrait -->
|
|
8
|
-
<div class="flex mr-3">
|
|
8
|
+
<div class="flex mr-3 flex-none">
|
|
9
9
|
<div
|
|
10
10
|
v-if="!portraitURL"
|
|
11
11
|
class="w-10 h-10 rounded-xl bg-dropdownSelect flex items-center justify-center"
|
|
@@ -20,30 +20,38 @@
|
|
|
20
20
|
/>
|
|
21
21
|
</div>
|
|
22
22
|
|
|
23
|
-
<!-- Name +
|
|
24
|
-
<div class="flex flex-col flex-1 text-left">
|
|
25
|
-
<BaseText
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
weight="bold"
|
|
33
|
-
/>
|
|
34
|
-
<BaseText
|
|
35
|
-
v-else
|
|
36
|
-
text="No ring"
|
|
37
|
-
size="xs"
|
|
38
|
-
color="quinary"
|
|
39
|
-
weight="normal"
|
|
40
|
-
/>
|
|
41
|
-
</div>
|
|
42
|
-
</div>
|
|
23
|
+
<!-- Name + Ring (left aligned, stacked) -->
|
|
24
|
+
<div class="flex flex-col flex-1 text-left min-w-0">
|
|
25
|
+
<BaseText
|
|
26
|
+
:text="director.DisplayName"
|
|
27
|
+
size="sm"
|
|
28
|
+
color="quaternary"
|
|
29
|
+
weight="bold"
|
|
30
|
+
class="truncate"
|
|
31
|
+
/>
|
|
43
32
|
|
|
33
|
+
<BaseText
|
|
34
|
+
v-if="ringName"
|
|
35
|
+
:text="ringName"
|
|
36
|
+
size="xs"
|
|
37
|
+
color="primaryHighlight"
|
|
38
|
+
weight="bold"
|
|
39
|
+
class="truncate"
|
|
40
|
+
/>
|
|
41
|
+
<BaseText
|
|
42
|
+
v-else
|
|
43
|
+
text="No ring"
|
|
44
|
+
size="xs"
|
|
45
|
+
color="quinary"
|
|
46
|
+
weight="normal"
|
|
47
|
+
class="truncate"
|
|
48
|
+
/>
|
|
49
|
+
</div>
|
|
44
50
|
|
|
45
51
|
<!-- Chevron -->
|
|
46
|
-
<
|
|
52
|
+
<div class="flex-none ml-3">
|
|
53
|
+
<BaseIcon icon-name="fa-chevron-right" size="sm" color="quinary" hover="primary" />
|
|
54
|
+
</div>
|
|
47
55
|
</button>
|
|
48
56
|
</template>
|
|
49
57
|
|
|
@@ -56,10 +64,7 @@ export default {
|
|
|
56
64
|
components: { BaseText, BaseIcon },
|
|
57
65
|
emits: ["select"],
|
|
58
66
|
props: {
|
|
59
|
-
director: {
|
|
60
|
-
type: Object,
|
|
61
|
-
required: true
|
|
62
|
-
}
|
|
67
|
+
director: { type: Object, required: true }
|
|
63
68
|
},
|
|
64
69
|
computed: {
|
|
65
70
|
portraitURL() {
|