@golstats/gsc-lineups-reports 1.0.3 → 1.0.5

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.
Files changed (56) hide show
  1. package/dist/gsc-lineups-reports.css +1 -1
  2. package/dist/gsc-lineups-reports.es.js +1282 -1237
  3. package/dist/gsc-lineups-reports.umd.js +7 -7
  4. package/package.json +1 -1
  5. package/src/components/Lineup2D/LineupField.vue +251 -97
  6. package/src/components/gsc-header-historico-lineup.vue +962 -883
  7. package/src/components/gsc-header-postmatch-lineup.vue +896 -847
  8. package/src/components/gsc-header-recientes-lineup.vue +1923 -1459
  9. package/src/components/gsc-lineups.vue +50 -23
  10. package/dist/atajada.svg +0 -57
  11. package/dist/backarrow.svg +0 -3
  12. package/dist/cancha-3d.png +0 -0
  13. package/dist/contorno-escudo.svg +0 -3
  14. package/dist/escudo1.png +0 -0
  15. package/dist/escudo2.png +0 -0
  16. package/dist/favicon.ico +0 -0
  17. package/dist/field-green-posesion.png +0 -0
  18. package/dist/fin-del-partido.svg +0 -44
  19. package/dist/fuera-de-lugar.svg +0 -58
  20. package/dist/gol.svg +0 -49
  21. package/dist/group-427321178.svg +0 -8
  22. package/dist/group-427321179.svg +0 -5
  23. package/dist/group-427321501.svg +0 -5
  24. package/dist/icn-arrow-expand.svg +0 -3
  25. package/dist/icn-cambio.svg +0 -27
  26. package/dist/icn-expand-arrow.svg +0 -3
  27. package/dist/icn-expand-arrow1.svg +0 -3
  28. package/dist/icn-falta.svg +0 -43
  29. package/dist/icn-filter.svg +0 -12
  30. package/dist/icn-filter1.svg +0 -12
  31. package/dist/icn-filter2.svg +0 -12
  32. package/dist/icn-golstats.png +0 -0
  33. package/dist/icn-play.svg +0 -10
  34. package/dist/icn-tarjeta-amarilla.svg +0 -4
  35. package/dist/icn-tarjeta-roja.svg +0 -4
  36. package/dist/icn-tiro-a-porteria.svg +0 -36
  37. package/dist/icn-tiros-de-esquina.svg +0 -55
  38. package/dist/images/events/cambio.svg +0 -27
  39. package/dist/images/events/falta.svg +0 -43
  40. package/dist/images/events/generic.svg +0 -1
  41. package/dist/images/events/tiro-de-esquina.svg +0 -55
  42. package/dist/inicia-el-partido.svg +0 -46
  43. package/dist/jugada-peligrosa.svg +0 -91
  44. package/dist/line-white.png +0 -0
  45. package/dist/line.png +0 -0
  46. package/dist/next-arrow.svg +0 -3
  47. package/dist/nextarrow.svg +0 -3
  48. package/dist/penal-fallado.svg +0 -195
  49. package/dist/penal-marcado.svg +0 -190
  50. package/dist/play-icn.svg +0 -3
  51. package/dist/shape.svg +0 -3
  52. package/dist/styles.css +0 -1191
  53. package/dist/tiempo-agregado.svg +0 -75
  54. package/dist/tiro-a-porteria.svg +0 -81
  55. package/dist/var.png +0 -0
  56. package/dist/var.svg +0 -31
package/src/components/gsc-header-recientes-lineup.vue CHANGED
@@ -1,1873 +1,2337 @@
1
1
  <template>
2
- <div :class="$style.headerSeccionAlineaciones" >
3
- <div :class="headerSeccionAlineaciones1Class" id="header-desktop-full">
4
- <div :class="$style.groupsLeagueParent">
5
- <div :class="$style.groupsLeague">
6
- <span>Las alineaciones de este partido </span>
7
- <span :class="$style.anNoEstn">aún no están disponibles</span>
8
- <span>. Por lo pronto puedes ver alineaciones:</span>
9
- </div>
10
- <div :class="$style.switchStatesBig" id="switch-lineup">
11
- <GscSwitchComponent :buttons="['Historicos', 'Recientes', 'Probables']" :selectedOption="optionSelected" :type="1" width="600px" :arrow="false" borderRadius="32px" height="28px" fontSize="11px;" fontFamily="Poppins-Regular" border-width="1px" border-width-container="0.5px" backgroundOptionDisable="#162533" @input="clickOnSelectOption" />
12
- </div>
2
+ <div :class="$style.headerSeccionAlineaciones">
3
+ <div :class="headerSeccionAlineaciones1Class" id="header-desktop-full">
4
+ <div :class="$style.groupsLeagueParent">
5
+ <div :class="$style.groupsLeague">
6
+ <span>Las alineaciones de este partido </span>
7
+ <span :class="$style.anNoEstn">aún no están disponibles</span>
8
+ <span>. Por lo pronto puedes ver alineaciones:</span>
13
9
  </div>
14
- <div :class="$style.matchContainer" id="match-container">
15
- <div :class="$style.homeTeamContainer">
16
- <div :class="$style.teamContainer">
17
- <div :class="$style.imgHomeTeamWrapper">
18
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+gameInfo.home_team+'.png'" />
19
- </div>
20
- </div>
21
- <div :class="$style.name">{{ gameInfo.home_team_abbreviation }}</div>
10
+ <div :class="$style.switchStatesBig" id="switch-lineup">
11
+ <GscSwitchComponent
12
+ :buttons="['Historicos', 'Recientes', 'Probables']"
13
+ :selectedOption="optionSelected"
14
+ :type="1"
15
+ width="600px"
16
+ :arrow="false"
17
+ borderRadius="32px"
18
+ height="28px"
19
+ fontSize="11px;"
20
+ fontFamily="Poppins-Regular"
21
+ border-width="1px"
22
+ border-width-container="0.5px"
23
+ backgroundOptionDisable="#162533"
24
+ @input="clickOnSelectOption"
25
+ />
26
+ </div>
27
+ </div>
28
+ <div :class="$style.matchContainer" id="match-container">
29
+ <div :class="$style.homeTeamContainer">
30
+ <div :class="$style.teamContainer">
31
+ <div :class="$style.imgHomeTeamWrapper">
32
+ <img
33
+ :class="$style.imgHomeTeamIcon"
34
+ alt=""
35
+ :src="
36
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
37
+ gameInfo.home_team +
38
+ '.png'
39
+ "
40
+ />
22
41
  </div>
23
- <div :class="$style.teamSwitch" id="switch-team">
24
- <GSCSwitchRadio width="41px" height="20px" heightCircle="15px" widthCircle="15px" circle-color-switch="#cbee6b" :text-option-left="gameInfo.home_team_abbreviation" @change="changeSwitchRadio" :text-option-right="gameInfo.away_team_abbreviation" font-color="white" :value-default="teamSelect" :hidden-labels="true" />
42
+ </div>
43
+ <div :class="$style.name">{{ gameInfo.home_team_abbreviation }}</div>
44
+ </div>
45
+ <div :class="$style.teamSwitch" id="switch-team">
46
+ <GSCSwitchRadio
47
+ width="41px"
48
+ height="20px"
49
+ heightCircle="15px"
50
+ widthCircle="15px"
51
+ circle-color-switch="#cbee6b"
52
+ :text-option-left="gameInfo.home_team_abbreviation"
53
+ @change="changeSwitchRadio"
54
+ :text-option-right="gameInfo.away_team_abbreviation"
55
+ font-color="white"
56
+ :value-default="teamSelect"
57
+ :hidden-labels="true"
58
+ />
59
+ </div>
60
+ <div :class="$style.awayTeamContainer">
61
+ <div :class="$style.name">{{ gameInfo.away_team_abbreviation }}</div>
62
+ <div :class="$style.teamContainer1">
63
+ <div :class="$style.imgHomeTeamWrapper">
64
+ <img
65
+ :class="$style.imgHomeTeamIcon"
66
+ alt=""
67
+ :src="
68
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
69
+ gameInfo.away_team +
70
+ '.png'
71
+ "
72
+ />
25
73
  </div>
26
- <div :class="$style.awayTeamContainer">
27
- <div :class="$style.name">{{ gameInfo.away_team_abbreviation }}</div>
28
- <div :class="$style.teamContainer1">
29
- <div :class="$style.imgHomeTeamWrapper">
30
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+gameInfo.away_team+'.png'" />
31
- </div>
32
- </div>
74
+ </div>
75
+ </div>
76
+ </div>
77
+
78
+ <div :class="$style.matchContainer1" id="match-info-container">
79
+ <div :class="$style.btnFilterParent">
80
+ <button :class="$style.btnFilter" id="btn-filters">
81
+ <div :class="$style.sortParent" @click="openFilter">
82
+ <img
83
+ :class="$style.sortIcon"
84
+ alt=""
85
+ src="https://golstatsimages.blob.core.windows.net/todoelfut/lineups/icn-filter.svg"
86
+ />
87
+ <div :class="$style.filtros">Filtros</div>
33
88
  </div>
89
+ <img
90
+ :class="$style.shapeIcon"
91
+ alt=""
92
+ src="https://golstatsimages.blob.core.windows.net/todoelfut/lineups/icn-expand-arrow.svg"
93
+ />
94
+ <GSCFilter
95
+ :item-select="filterObject"
96
+ :is-open="openfiltervalue"
97
+ @change="changeFiltersModal"
98
+ :reset="vDeleteFilter"
99
+ margin-modal="-83px"
100
+ />
101
+ </button>
102
+ <GSCDropdown
103
+ @click="clickOnValueFilter"
104
+ v-if="gameRecientesFilter.length > 0"
105
+ :key="keyUpdate"
106
+ :default-item-by-prop="defaultDropItem"
107
+ :class="$style.btnFilter1"
108
+ id="btn-filters"
109
+ :items="matchdaysFinal"
110
+ @input="changeDropdown"
111
+ height="32px"
112
+ width="114px"
113
+ background-color="rgba(255, 255, 255, 0.05);"
114
+ color="white"
115
+ border-width="1"
116
+ borderColor="rgba(255, 255, 255, 0.2)"
117
+ border-radius="0px"
118
+ fontSize="10px"
119
+ arrowHeight="16"
120
+ :arrowWidth="16"
121
+ listHeight="300px"
122
+ listBackgroundColor="#243a4c"
123
+ hoverBackgroundColor="#0d1d2a"
124
+ listItemColor="#FFFFFF"
125
+ listItemSelectedBackgroundColor="#0d1d2a"
126
+ listItemSelectedColor="#c3e569"
127
+ listItemPadding="8px 7px"
128
+ listBorderColor="rgba(255, 255, 255, 0.1)"
129
+ listBorderRadius="2px"
130
+ >
131
+ <template #default="data">
132
+ <div class="selector-tournaments">{{ data.selectedItem.name }}</div>
133
+ </template>
134
+ <template #availableItem="{ item }">
135
+ <div>{{ item.name }}</div>
136
+ </template>
137
+ </GSCDropdown>
34
138
  </div>
35
-
36
- <div :class="$style.matchContainer1" id="match-info-container">
37
- <div :class="$style.btnFilterParent">
38
- <button :class="$style.btnFilter" id="btn-filters">
39
- <div :class="$style.sortParent" @click="openFilter">
40
- <img :class="$style.sortIcon" alt="" src="/icn-filter.svg" />
41
- <div :class="$style.filtros">Filtros</div>
139
+ <div :class="$style.match">
140
+ <GSCCarousel
141
+ @click="clickOnValueCarrousel"
142
+ v-if="gameRecientesFilter.length > 0"
143
+ :key="updateCarouselGames"
144
+ :default-item-by-index="selectedIndexOption"
145
+ :items="gameRecientesFilter"
146
+ @input="changeCarouselItem"
147
+ isMainSlidePriority
148
+ areSlidesArrowsVisible
149
+ :areNavigationArrowsVisible="false"
150
+ slideLeftArrowBackgroundImage="none"
151
+ slideRightArrowBackgroundImage="none"
152
+ >
153
+ <template #default="{ item }">
154
+ <div :class="$style.selectoritem">
155
+ <div :class="$style.homeTeam">
156
+ <div :class="$style.teamContainer2">
157
+ <div :class="$style.manchesterUnited">{{ item.home_team_abbreviation }}</div>
158
+ <img
159
+ :class="$style.imgHomeTeamIcon"
160
+ alt=""
161
+ :src="
162
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
163
+ item.home_team +
164
+ '.png'
165
+ "
166
+ />
167
+ </div>
168
+ </div>
169
+ <div :class="$style.scoreContainer1">
170
+ <div :class="$style.finalScore">
171
+ <div :class="$style.div4" v-if="Object.keys(item).length > 0">
172
+ {{ item.score[0] }}
42
173
  </div>
43
- <img :class="$style.shapeIcon" alt="" src="/icn-expand-arrow.svg" />
44
- <GSCFilter :item-select="filterObject" :is-open="openfiltervalue" @change="changeFiltersModal" :reset="vDeleteFilter" margin-modal="-83px" />
45
- </button>
46
- <GSCDropdown @click="clickOnValueFilter" v-if="gameRecientesFilter.length > 0" :key="keyUpdate" :default-item-by-prop="defaultDropItem" :class="$style.btnFilter1" id="btn-filters" :items="matchdaysFinal" @input="changeDropdown" height="32px" width="114px" background-color="rgba(255, 255, 255, 0.05);" color="white" border-width="1" borderColor="rgba(255, 255, 255, 0.2)" border-radius="0px" fontSize="10px" arrowHeight="16" :arrowWidth="16" listHeight="300px" listBackgroundColor="#243a4c" hoverBackgroundColor="#0d1d2a" listItemColor="#FFFFFF" listItemSelectedBackgroundColor="#0d1d2a" listItemSelectedColor="#c3e569" listItemPadding="8px 7px" listBorderColor="rgba(255, 255, 255, 0.1)" listBorderRadius="2px">
47
- <template #default="data">
48
- <div class="selector-tournaments">{{data.selectedItem.name}}</div>
49
- </template>
50
- <template #availableItem="{item}">
51
- <div>{{item.name}}</div>
174
+ <div :class="$style.div4">-</div>
175
+ <div :class="$style.div4" v-if="Object.keys(item).length > 0">
176
+ <template v-if="Array.isArray(item.score)">{{ item.score[1] }}</template>
177
+ <template v-else>{{ item.score[4] }}</template>
178
+ </div>
179
+ </div>
180
+ <div :class="$style.manchesterUnited1">
181
+ <template v-if="item.home_team_abbreviation == teamSelect">
182
+ <template v-if="item.home_match_result == 1">Ganado</template>
183
+ <template v-if="item.home_match_result == 2">Perdido</template>
184
+ <template v-if="item.home_match_result == 3">Empatado</template>
52
185
  </template>
53
- </GSCDropdown>
54
- </div>
55
- <div :class="$style.match" >
56
- <GSCCarousel @click="clickOnValueCarrousel" v-if="gameRecientesFilter.length > 0" :key="updateCarouselGames" :default-item-by-index="selectedIndexOption" :items="gameRecientesFilter" @input="changeCarouselItem" isMainSlidePriority areSlidesArrowsVisible :areNavigationArrowsVisible="false" slideLeftArrowBackgroundImage="none" slideRightArrowBackgroundImage="none">
57
- <template #default="{ item }">
58
- <div :class="$style.selectoritem">
59
- <div :class="$style.homeTeam">
60
- <div :class="$style.teamContainer2">
61
- <div :class="$style.manchesterUnited">{{ item.home_team_abbreviation }}</div>
62
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+item.home_team+'.png'" />
63
- </div>
64
- </div>
65
- <div :class="$style.scoreContainer1">
66
- <div :class="$style.finalScore">
67
- <div :class="$style.div4" v-if="Object.keys(item).length > 0">{{ item.score[0] }}</div>
68
- <div :class="$style.div4">-</div>
69
- <div :class="$style.div4" v-if="Object.keys(item).length > 0">
70
- <template v-if="Array.isArray(item.score)">{{ item.score[1] }}</template>
71
- <template v-else>{{ item.score[4] }}</template>
72
-
73
- </div>
74
- </div>
75
- <div :class="$style.manchesterUnited1">
76
- <template v-if="item.home_team_abbreviation == teamSelect">
77
- <template v-if="item.home_match_result == 1">Ganado</template>
78
- <template v-if="item.home_match_result == 2">Perdido</template>
79
- <template v-if="item.home_match_result == 3">Empatado</template>
80
- </template>
81
- <template v-if="item.away_team_abbreviation == teamSelect">
82
- <template v-if="item.visiting_match_result == 1">Ganado</template>
83
- <template v-if="item.visiting_match_result == 2">Perdido</template>
84
- <template v-if="item.visiting_match_result == 3">Empatado</template>
85
- </template>
86
- </div>
87
- </div>
88
- <div :class="$style.homeTeam">
89
- <div :class="$style.teamContainer2">
90
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+item.away_team+'.png'" />
91
- <div :class="$style.manchesterUnited">{{ item.away_team_abbreviation }}</div>
92
- </div>
93
- </div>
94
- </div>
186
+ <template v-if="item.away_team_abbreviation == teamSelect">
187
+ <template v-if="item.visiting_match_result == 1">Ganado</template>
188
+ <template v-if="item.visiting_match_result == 2">Perdido</template>
189
+ <template v-if="item.visiting_match_result == 3">Empatado</template>
95
190
  </template>
96
- </GSCCarousel>
97
- <div v-else>
98
- <div :class="$style.containernofoundsearchrecientes">
99
- <div :class="$style.leyenddeleteshow">No hay resultados con los criterios<br>de búsqueda aplicados.</div>
100
- <div :class="$style.btndeletefilters" @click="deleteFilters">Eliminar filtros aplicados</div>
101
- </div>
191
+ </div>
102
192
  </div>
103
- <GSCMatchDetails style="margin-top: 30px;" v-if="showDetails" :localDetails="localDetails" :foreignDetails="foreignDetails"/>
104
- </div>
105
- <div :class="$style.btnDetails">
106
- <div :class="$style.manchesterUnited2" @click="clickShowDetails"><template v-if="showDetails">Ocultar detalles</template><template v-else>Ver detalles</template></div>
193
+ <div :class="$style.homeTeam">
194
+ <div :class="$style.teamContainer2">
195
+ <img
196
+ :class="$style.imgHomeTeamIcon"
197
+ alt=""
198
+ :src="
199
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
200
+ item.away_team +
201
+ '.png'
202
+ "
203
+ />
204
+ <div :class="$style.manchesterUnited">{{ item.away_team_abbreviation }}</div>
205
+ </div>
206
+ </div>
207
+ </div>
208
+ </template>
209
+ </GSCCarousel>
210
+ <div v-else>
211
+ <div :class="$style.containernofoundsearchrecientes">
212
+ <div :class="$style.leyenddeleteshow">
213
+ No hay resultados con los criterios<br />de búsqueda aplicados.
214
+ </div>
215
+ <div :class="$style.btndeletefilters" @click="deleteFilters">
216
+ Eliminar filtros aplicados
217
+ </div>
107
218
  </div>
219
+ </div>
220
+ <GSCMatchDetails
221
+ style="margin-top: 30px"
222
+ v-if="showDetails"
223
+ :localDetails="localDetails"
224
+ :foreignDetails="foreignDetails"
225
+ />
226
+ </div>
227
+ <div :class="$style.btnDetails">
228
+ <div :class="$style.manchesterUnited2" @click="clickShowDetails">
229
+ <template v-if="showDetails">Ocultar detalles</template
230
+ ><template v-else>Ver detalles</template>
231
+ </div>
108
232
  </div>
233
+ </div>
109
234
  </div>
110
- <div :class="headerSeccionAlineaciones2Class" id="header-desktop">
111
- <div :class="$style.groupsLeagueParent">
112
- <div :class="$style.groupsLeague">
113
- <span>Las alineaciones de este partido </span>
114
- <span :class="$style.anNoEstn">aún no están disponibles</span>
115
- <span>. Por lo pronto puedes ver alineaciones:</span>
116
- </div>
117
- <div :class="$style.switchStatesBig" id="switch-lineup">
118
- <GscSwitchComponent :buttons="['Historicos', 'Recientes', 'Probables']" :selectedOption="optionSelected" :type="1" width="600px" :arrow="false" borderRadius="32px" height="28px" fontSize="11px;" fontFamily="Poppins-Regular" border-width="1px" border-width-container="0.5px" backgroundOptionDisable="#162533" @input="clickOnSelectOption" />
119
- </div>
235
+ <div :class="headerSeccionAlineaciones2Class" id="header-desktop">
236
+ <div :class="$style.groupsLeagueParent">
237
+ <div :class="$style.groupsLeague">
238
+ <span>Las alineaciones de este partido </span>
239
+ <span :class="$style.anNoEstn">aún no están disponibles</span>
240
+ <span>. Por lo pronto puedes ver alineaciones:</span>
120
241
  </div>
121
- <div :class="$style.matchContainer" id="match-container">
122
- <div :class="$style.homeTeamContainer">
123
- <div :class="$style.teamContainer">
124
- <div :class="$style.imgHomeTeamWrapper">
125
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+gameInfo.home_team+'.png'" />
126
- </div>
127
- </div>
128
- <div :class="$style.name">{{ gameInfo.home_team_abbreviation }}</div>
129
- </div>
130
- <div :class="$style.teamSwitch" id="switch-team">
131
- <GSCSwitchRadio width="41px" height="20px" heightCircle="15px" widthCircle="15px" circle-color-switch="#cbee6b" :text-option-left="gameInfo.home_team_abbreviation" @change="changeSwitchRadio" :text-option-right="gameInfo.away_team_abbreviation" font-color="white" :value-default="teamSelect" :hidden-labels="true" />
242
+ <div :class="$style.switchStatesBig" id="switch-lineup">
243
+ <GscSwitchComponent
244
+ :buttons="['Historicos', 'Recientes', 'Probables']"
245
+ :selectedOption="optionSelected"
246
+ :type="1"
247
+ width="600px"
248
+ :arrow="false"
249
+ borderRadius="32px"
250
+ height="28px"
251
+ fontSize="11px;"
252
+ fontFamily="Poppins-Regular"
253
+ border-width="1px"
254
+ border-width-container="0.5px"
255
+ backgroundOptionDisable="#162533"
256
+ @input="clickOnSelectOption"
257
+ />
258
+ </div>
259
+ </div>
260
+ <div :class="$style.matchContainer" id="match-container">
261
+ <div :class="$style.homeTeamContainer">
262
+ <div :class="$style.teamContainer">
263
+ <div :class="$style.imgHomeTeamWrapper">
264
+ <img
265
+ :class="$style.imgHomeTeamIcon"
266
+ alt=""
267
+ :src="
268
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
269
+ gameInfo.home_team +
270
+ '.png'
271
+ "
272
+ />
132
273
  </div>
133
- <div :class="$style.awayTeamContainer">
134
- <div :class="$style.name">{{ gameInfo.away_team_abbreviation }}</div>
135
- <div :class="$style.teamContainer1">
136
- <div :class="$style.imgHomeTeamWrapper">
137
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+gameInfo.away_team+'.png'" />
138
- </div>
139
- </div>
274
+ </div>
275
+ <div :class="$style.name">{{ gameInfo.home_team_abbreviation }}</div>
276
+ </div>
277
+ <div :class="$style.teamSwitch" id="switch-team">
278
+ <GSCSwitchRadio
279
+ width="41px"
280
+ height="20px"
281
+ heightCircle="15px"
282
+ widthCircle="15px"
283
+ circle-color-switch="#cbee6b"
284
+ :text-option-left="gameInfo.home_team_abbreviation"
285
+ @change="changeSwitchRadio"
286
+ :text-option-right="gameInfo.away_team_abbreviation"
287
+ font-color="white"
288
+ :value-default="teamSelect"
289
+ :hidden-labels="true"
290
+ />
291
+ </div>
292
+ <div :class="$style.awayTeamContainer">
293
+ <div :class="$style.name">{{ gameInfo.away_team_abbreviation }}</div>
294
+ <div :class="$style.teamContainer1">
295
+ <div :class="$style.imgHomeTeamWrapper">
296
+ <img
297
+ :class="$style.imgHomeTeamIcon"
298
+ alt=""
299
+ :src="
300
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
301
+ gameInfo.away_team +
302
+ '.png'
303
+ "
304
+ />
140
305
  </div>
306
+ </div>
141
307
  </div>
142
-
143
- <div :class="$style.matchContainer3">
144
- <button :class="$style.btnFilter2" id="btn-filters">
145
- <div :class="$style.sortParent" @click="openFilter">
146
- <img :class="$style.sortIcon" alt="" src="/icn-filter1.svg" />
147
- <div :class="$style.filtros">Filtros</div>
308
+ </div>
309
+
310
+ <div :class="$style.matchContainer3">
311
+ <button :class="$style.btnFilter2" id="btn-filters">
312
+ <div :class="$style.sortParent" @click="openFilter">
313
+ <img
314
+ :class="$style.sortIcon"
315
+ alt=""
316
+ src="https://golstatsimages.blob.core.windows.net/todoelfut/lineups/icn-filter1.svg"
317
+ />
318
+ <div :class="$style.filtros">Filtros</div>
319
+ </div>
320
+ <img
321
+ :class="$style.shapeIcon"
322
+ alt=""
323
+ src="https://golstatsimages.blob.core.windows.net/todoelfut/lineups/icn-expand-arrow1.svg"
324
+ />
325
+ <GSCFilter
326
+ :item-select="filterObject"
327
+ :is-open="openfiltervalue"
328
+ @change="changeFiltersModal"
329
+ margin-modal="-99px"
330
+ />
331
+ </button>
332
+ <GSCDropdown
333
+ @click="clickOnValueFilter"
334
+ v-if="gameRecientesFilter.length > 0"
335
+ :key="keyUpdate"
336
+ :default-item-by-prop="defaultDropItem"
337
+ :class="$style.btnFilter1"
338
+ id="btn-filters"
339
+ :items="matchdaysFinal"
340
+ @input="changeDropdown"
341
+ height="32px"
342
+ width="114px"
343
+ background-color="rgba(255, 255, 255, 0.05);"
344
+ color="white"
345
+ border-width="1"
346
+ borderColor="rgba(255, 255, 255, 0.2)"
347
+ border-radius="0px"
348
+ fontSize="10px"
349
+ arrowHeight="16"
350
+ :arrowWidth="16"
351
+ listHeight="300px"
352
+ listBackgroundColor="#243a4c"
353
+ hoverBackgroundColor="#0d1d2a"
354
+ listItemColor="#FFFFFF"
355
+ listItemSelectedBackgroundColor="#0d1d2a"
356
+ listItemSelectedColor="#c3e569"
357
+ listItemPadding="8px 7px"
358
+ listBorderColor="rgba(255, 255, 255, 0.1)"
359
+ listBorderRadius="2px"
360
+ >
361
+ <template #default="data">
362
+ <div class="selector-tournaments">{{ data.selectedItem.name }}</div>
363
+ </template>
364
+ <template #availableItem="{ item }">
365
+ <div>{{ item.name }}</div>
366
+ </template>
367
+ </GSCDropdown>
368
+ <div :class="$style.btnDetails1">
369
+ <div :class="$style.manchesterUnited2" @click="clickShowDetails">
370
+ <template v-if="showDetails">Ocultar detalles</template
371
+ ><template v-else>Ver detalles</template>
372
+ </div>
373
+ </div>
374
+ </div>
375
+ <div :class="$style.matchContainer1" id="match-info-container">
376
+ <div :class="$style.match1">
377
+ <GSCCarousel
378
+ v-if="gameRecientesFilter.length > 0"
379
+ :items="gameRecientesFilter"
380
+ :key="updateCarouselGames"
381
+ :default-item-by-index="selectedIndexOption"
382
+ @input="changeCarouselItem"
383
+ isMainSlidePriority
384
+ areSlidesArrowsVisible
385
+ :areNavigationArrowsVisible="false"
386
+ slideLeftArrowBackgroundImage="none"
387
+ slideRightArrowBackgroundImage="none"
388
+ >
389
+ <template #default="{ item }">
390
+ <div :class="$style.selectoritem">
391
+ <div :class="$style.homeTeam">
392
+ <div :class="$style.teamContainer2">
393
+ <div :class="$style.manchesterUnited">{{ item.home_team_abbreviation }}</div>
394
+ <img
395
+ :class="$style.imgHomeTeamIcon"
396
+ alt=""
397
+ :src="
398
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
399
+ item.home_team +
400
+ '.png'
401
+ "
402
+ />
403
+ </div>
148
404
  </div>
149
- <img :class="$style.shapeIcon" alt="" src="/icn-expand-arrow1.svg" />
150
- <GSCFilter :item-select="filterObject" :is-open="openfiltervalue" @change="changeFiltersModal" margin-modal="-99px" />
151
- </button>
152
- <GSCDropdown @click="clickOnValueFilter" v-if="gameRecientesFilter.length > 0" :key="keyUpdate" :default-item-by-prop="defaultDropItem" :class="$style.btnFilter1" id="btn-filters" :items="matchdaysFinal" @input="changeDropdown" height="32px" width="114px" background-color="rgba(255, 255, 255, 0.05);" color="white" border-width="1" borderColor="rgba(255, 255, 255, 0.2)" border-radius="0px" fontSize="10px" arrowHeight="16" :arrowWidth="16" listHeight="300px" listBackgroundColor="#243a4c" hoverBackgroundColor="#0d1d2a" listItemColor="#FFFFFF" listItemSelectedBackgroundColor="#0d1d2a" listItemSelectedColor="#c3e569" listItemPadding="8px 7px" listBorderColor="rgba(255, 255, 255, 0.1)" listBorderRadius="2px">
153
- <template #default="data">
154
- <div class="selector-tournaments">{{data.selectedItem.name}}</div>
155
- </template>
156
- <template #availableItem="{item}">
157
- <div>{{item.name}}</div>
405
+ <div :class="$style.scoreContainer1">
406
+ <div :class="$style.finalScore">
407
+ <div :class="$style.div4" v-if="Object.keys(item).length > 0">
408
+ {{ item.score[0] }}
409
+ </div>
410
+ <div :class="$style.div4">-</div>
411
+ <div :class="$style.div4" v-if="Object.keys(item).length > 0">
412
+ <template v-if="Array.isArray(item.score)">{{ item.score[1] }}</template>
413
+ <template v-else>{{ item.score[4] }}</template>
414
+ </div>
415
+ </div>
416
+ <div :class="$style.manchesterUnited1">
417
+ <template v-if="item.home_team_abbreviation == teamSelect">
418
+ <template v-if="item.home_match_result == 1">Ganado</template>
419
+ <template v-if="item.home_match_result == 2">Perdido</template>
420
+ <template v-if="item.home_match_result == 3">Empatado</template>
158
421
  </template>
159
- </GSCDropdown>
160
- <div :class="$style.btnDetails1">
161
- <div :class="$style.manchesterUnited2" @click="clickShowDetails"><template v-if="showDetails">Ocultar detalles</template><template v-else>Ver detalles</template></div>
162
- </div>
163
- </div>
164
- <div :class="$style.matchContainer1" id="match-info-container">
165
- <div :class="$style.match1">
166
- <GSCCarousel v-if="gameRecientesFilter.length > 0" :items="gameRecientesFilter" :key="updateCarouselGames" :default-item-by-index="selectedIndexOption" @input="changeCarouselItem" isMainSlidePriority areSlidesArrowsVisible :areNavigationArrowsVisible="false" slideLeftArrowBackgroundImage="none" slideRightArrowBackgroundImage="none">
167
- <template #default="{ item }">
168
- <div :class="$style.selectoritem">
169
- <div :class="$style.homeTeam">
170
- <div :class="$style.teamContainer2">
171
- <div :class="$style.manchesterUnited">{{ item.home_team_abbreviation }}</div>
172
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+item.home_team+'.png'" />
173
- </div>
174
- </div>
175
- <div :class="$style.scoreContainer1">
176
- <div :class="$style.finalScore">
177
- <div :class="$style.div4" v-if="Object.keys(item).length > 0">{{ item.score[0] }}</div>
178
- <div :class="$style.div4">-</div>
179
- <div :class="$style.div4" v-if="Object.keys(item).length > 0"><template v-if="Array.isArray(item.score)">{{ item.score[1] }}</template>
180
- <template v-else>{{ item.score[4] }}</template></div>
181
- </div>
182
- <div :class="$style.manchesterUnited1">
183
- <template v-if="item.home_team_abbreviation == teamSelect">
184
- <template v-if="item.home_match_result == 1">Ganado</template>
185
- <template v-if="item.home_match_result == 2">Perdido</template>
186
- <template v-if="item.home_match_result == 3">Empatado</template>
187
- </template>
188
- <template v-if="item.away_team_abbreviation == teamSelect">
189
- <template v-if="item.visiting_match_result == 1">Ganado</template>
190
- <template v-if="item.visiting_match_result == 2">Perdido</template>
191
- <template v-if="item.visiting_match_result == 3">Empatado</template>
192
- </template></div>
193
- </div>
194
- <div :class="$style.homeTeam">
195
- <div :class="$style.teamContainer2">
196
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+item.away_team+'.png'" />
197
- <div :class="$style.manchesterUnited">{{ item.away_team_abbreviation }}</div>
198
- </div>
199
- </div>
200
- </div>
422
+ <template v-if="item.away_team_abbreviation == teamSelect">
423
+ <template v-if="item.visiting_match_result == 1">Ganado</template>
424
+ <template v-if="item.visiting_match_result == 2">Perdido</template>
425
+ <template v-if="item.visiting_match_result == 3">Empatado</template>
201
426
  </template>
202
- </GSCCarousel>
203
- <div v-else>
204
- <div :class="$style.containernofoundsearchrecientes">
205
- <div :class="$style.leyenddeleteshow">No hay resultados con los criterios<br>de búsqueda aplicados.</div>
206
- <div :class="$style.btndeletefilters" @click="deleteFilters">Eliminar filtros aplicados</div>
207
- </div>
427
+ </div>
428
+ </div>
429
+ <div :class="$style.homeTeam">
430
+ <div :class="$style.teamContainer2">
431
+ <img
432
+ :class="$style.imgHomeTeamIcon"
433
+ alt=""
434
+ :src="
435
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
436
+ item.away_team +
437
+ '.png'
438
+ "
439
+ />
440
+ <div :class="$style.manchesterUnited">{{ item.away_team_abbreviation }}</div>
441
+ </div>
208
442
  </div>
209
- <GSCMatchDetails style="margin-top: 30px;" v-if="showDetails" :localDetails="localDetails" :foreignDetails="foreignDetails"/>
443
+ </div>
444
+ </template>
445
+ </GSCCarousel>
446
+ <div v-else>
447
+ <div :class="$style.containernofoundsearchrecientes">
448
+ <div :class="$style.leyenddeleteshow">
449
+ No hay resultados con los criterios<br />de búsqueda aplicados.
450
+ </div>
451
+ <div :class="$style.btndeletefilters" @click="deleteFilters">
452
+ Eliminar filtros aplicados
453
+ </div>
210
454
  </div>
455
+ </div>
456
+ <GSCMatchDetails
457
+ style="margin-top: 30px"
458
+ v-if="showDetails"
459
+ :localDetails="localDetails"
460
+ :foreignDetails="foreignDetails"
461
+ />
211
462
  </div>
212
-
463
+ </div>
213
464
  </div>
214
- <div :class="headerSeccionAlineaciones3Class" id="header-mobile">
215
- <div :class="$style.switchStatesBig2" id="switch-lineup">
216
- <GscSwitchComponent :buttons="['Historicos', 'Recientes', 'Probables']" :selectedOption="optionSelected" :type="1" width="600px" :arrow="false" borderRadius="32px" height="28px" fontSize="11px;" fontFamily="Poppins-Regular" border-width="1px" border-width-container="0.5px" backgroundOptionDisable="#162533" @input="clickOnSelectOption" />
465
+ <div :class="headerSeccionAlineaciones3Class" id="header-mobile">
466
+ <div :class="$style.switchStatesBig2" id="switch-lineup">
467
+ <GscSwitchComponent
468
+ :buttons="['Historicos', 'Recientes', 'Probables']"
469
+ :selectedOption="optionSelected"
470
+ :type="1"
471
+ width="600px"
472
+ :arrow="false"
473
+ borderRadius="32px"
474
+ height="28px"
475
+ fontSize="11px;"
476
+ fontFamily="Poppins-Regular"
477
+ border-width="1px"
478
+ border-width-container="0.5px"
479
+ backgroundOptionDisable="#162533"
480
+ @input="clickOnSelectOption"
481
+ />
482
+ </div>
483
+ <div :class="$style.containerData">
484
+ <div :class="$style.manchesterUnited26">Alineación utilizada en:</div>
485
+ <div :class="$style.matchContainer5" id="match-container">
486
+ <div :class="$style.homeTeamContainer2">
487
+ <div :class="$style.teamContainer">
488
+ <div :class="$style.imgHomeTeamWrapper">
489
+ <img
490
+ :class="$style.imgHomeTeamIcon"
491
+ alt=""
492
+ :src="
493
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
494
+ gameInfo.home_team +
495
+ '.png'
496
+ "
497
+ />
498
+ </div>
499
+ </div>
500
+ <div :class="$style.name">{{ gameInfo.home_team_abbreviation }}</div>
501
+ </div>
502
+ <div :class="$style.teamSwitch" id="switch-team">
503
+ <GSCSwitchRadio
504
+ width="41px"
505
+ height="20px"
506
+ heightCircle="15px"
507
+ widthCircle="15px"
508
+ circle-color-switch="#cbee6b"
509
+ :text-option-left="gameInfo.home_team_abbreviation"
510
+ @change="changeSwitchRadio"
511
+ :text-option-right="gameInfo.away_team_abbreviation"
512
+ font-color="white"
513
+ :value-default="teamSelect"
514
+ :hidden-labels="true"
515
+ />
516
+ </div>
517
+ <div :class="$style.homeTeamContainer2">
518
+ <div :class="$style.name">{{ gameInfo.away_team_abbreviation }}</div>
519
+ <div :class="$style.teamContainer1">
520
+ <div :class="$style.imgHomeTeamWrapper">
521
+ <img
522
+ :class="$style.imgHomeTeamIcon"
523
+ alt=""
524
+ :src="
525
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
526
+ gameInfo.away_team +
527
+ '.png'
528
+ "
529
+ />
530
+ </div>
531
+ </div>
532
+ </div>
533
+ </div>
534
+ <div :class="$style.filtersContainer">
535
+ <button :class="$style.btnFilter4" id="btn-filters">
536
+ <div :class="$style.sortParent" @click="openFilter">
537
+ <img
538
+ :class="$style.sortIcon"
539
+ alt=""
540
+ src="https://golstatsimages.blob.core.windows.net/todoelfut/lineups/icn-filter2.svg"
541
+ />
542
+ <div :class="$style.filtros2">Filtros</div>
543
+ </div>
544
+ <img
545
+ :class="$style.shapeIcon"
546
+ alt=""
547
+ src="https://golstatsimages.blob.core.windows.net/todoelfut/lineups/icn-arrow-expand.svg"
548
+ />
549
+ <GSCFilter
550
+ :item-select="filterObject"
551
+ :is-open="openfiltervalue"
552
+ @change="changeFiltersModal"
553
+ margin-modal="-75px"
554
+ />
555
+ </button>
556
+ <GSCDropdown
557
+ @click="clickOnValueFilter"
558
+ v-if="gameRecientesFilter.length > 0"
559
+ :key="keyUpdate"
560
+ :default-item-by-prop="defaultDropItem"
561
+ :class="$style.filterMatchday"
562
+ id="menu-matchday"
563
+ :items="matchdaysFinal"
564
+ @input="changeDropdown"
565
+ height="25px"
566
+ width="100px"
567
+ background-color="rgba(255, 255, 255, 0.05);"
568
+ color="white"
569
+ border-width="1"
570
+ borderColor="rgba(255, 255, 255, 0.2)"
571
+ border-radius="0px"
572
+ fontSize="10px"
573
+ arrowHeight="16"
574
+ :arrowWidth="16"
575
+ listHeight="300px"
576
+ listBackgroundColor="#243a4c"
577
+ hoverBackgroundColor="#0d1d2a"
578
+ listItemColor="#FFFFFF"
579
+ listItemSelectedBackgroundColor="#0d1d2a"
580
+ listItemSelectedColor="#c3e569"
581
+ listItemPadding="8px 7px"
582
+ listBorderColor="rgba(255, 255, 255, 0.1)"
583
+ listBorderRadius="2px"
584
+ >
585
+ <template #default="data">
586
+ <div class="selector-tournaments">{{ data.selectedItem.name }}</div>
587
+ </template>
588
+ <template #availableItem="{ item }">
589
+ <div>{{ item.name }}</div>
590
+ </template>
591
+ </GSCDropdown>
592
+ <div :class="$style.btnDetails2">
593
+ <div :class="$style.manchesterUnited2" @click="clickShowDetails">
594
+ <template v-if="showDetails">Ocultar detalles</template
595
+ ><template v-else>Ver detalles</template>
596
+ </div>
597
+ </div>
217
598
  </div>
218
- <div :class="$style.containerData">
219
- <div :class="$style.manchesterUnited26">Alineación utilizada en:</div>
220
- <div :class="$style.matchContainer5" id="match-container">
221
- <div :class="$style.homeTeamContainer2">
222
- <div :class="$style.teamContainer">
223
- <div :class="$style.imgHomeTeamWrapper">
224
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+gameInfo.home_team+'.png'" />
599
+ <div :class="$style.matchDetailContainer">
600
+ <div :class="$style.matchContainer6" id="match-info-container">
601
+ <div :class="$style.match">
602
+ <GSCCarousel
603
+ v-if="gameRecientesFilter.length > 0"
604
+ :key="updateCarouselGames"
605
+ :default-item-by-index="selectedIndexOption"
606
+ :items="gameRecientesFilter"
607
+ @input="changeCarouselItem"
608
+ isMainSlidePriority
609
+ areSlidesArrowsVisible
610
+ :areNavigationArrowsVisible="false"
611
+ slideLeftArrowBackgroundImage="none"
612
+ slideRightArrowBackgroundImage="none"
613
+ >
614
+ <template #default="{ item }">
615
+ <div :class="$style.selectoritem">
616
+ <div :class="$style.homeTeam">
617
+ <div :class="$style.teamContainer2">
618
+ <div :class="$style.manchesterUnited">
619
+ {{ item.home_team_abbreviation }}
225
620
  </div>
621
+ <img
622
+ :class="$style.imgHomeTeamIcon"
623
+ alt=""
624
+ :src="
625
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
626
+ item.home_team +
627
+ '.png'
628
+ "
629
+ />
630
+ </div>
226
631
  </div>
227
- <div :class="$style.name">{{ gameInfo.home_team_abbreviation }}</div>
228
- </div>
229
- <div :class="$style.teamSwitch" id="switch-team">
230
- <GSCSwitchRadio width="41px" height="20px" heightCircle="15px" widthCircle="15px" circle-color-switch="#cbee6b" :text-option-left="gameInfo.home_team_abbreviation" @change="changeSwitchRadio" :text-option-right="gameInfo.away_team_abbreviation" font-color="white" :value-default="teamSelect" :hidden-labels="true" />
231
- </div>
232
- <div :class="$style.homeTeamContainer2">
233
- <div :class="$style.name">{{ gameInfo.away_team_abbreviation }}</div>
234
- <div :class="$style.teamContainer1">
235
- <div :class="$style.imgHomeTeamWrapper">
236
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+gameInfo.away_team+'.png'" />
632
+ <div :class="$style.scoreContainer1">
633
+ <div :class="$style.finalScore">
634
+ <div :class="$style.div4" v-if="Object.keys(item).length > 0">
635
+ {{ item.score[0] }}
237
636
  </div>
238
- </div>
239
- </div>
240
- </div>
241
- <div :class="$style.filtersContainer">
242
- <button :class="$style.btnFilter4" id="btn-filters">
243
- <div :class="$style.sortParent" @click="openFilter">
244
- <img :class="$style.sortIcon" alt="" src="/icn-filter2.svg" />
245
- <div :class="$style.filtros2">Filtros</div>
246
- </div>
247
- <img :class="$style.shapeIcon" alt="" src="/icn-arrow-expand.svg" />
248
- <GSCFilter :item-select="filterObject" :is-open="openfiltervalue" @change="changeFiltersModal" margin-modal="-75px" />
249
- </button>
250
- <GSCDropdown @click="clickOnValueFilter" v-if="gameRecientesFilter.length > 0" :key="keyUpdate" :default-item-by-prop="defaultDropItem" :class="$style.filterMatchday" id="menu-matchday" :items="matchdaysFinal" @input="changeDropdown" height="25px" width="100px" background-color="rgba(255, 255, 255, 0.05);" color="white" border-width="1" borderColor="rgba(255, 255, 255, 0.2)" border-radius="0px" fontSize="10px" arrowHeight="16" :arrowWidth="16" listHeight="300px" listBackgroundColor="#243a4c" hoverBackgroundColor="#0d1d2a" listItemColor="#FFFFFF" listItemSelectedBackgroundColor="#0d1d2a" listItemSelectedColor="#c3e569" listItemPadding="8px 7px" listBorderColor="rgba(255, 255, 255, 0.1)" listBorderRadius="2px">
251
- <template #default="data">
252
- <div class="selector-tournaments">{{data.selectedItem.name}}</div>
637
+ <div :class="$style.div4">-</div>
638
+ <div :class="$style.div4" v-if="Object.keys(item).length > 0">
639
+ <template v-if="Array.isArray(item.score)">{{ item.score[1] }}</template>
640
+ <template v-else>{{ item.score[4] }}</template>
641
+ </div>
642
+ </div>
643
+ <div :class="$style.manchesterUnited1">
644
+ <template v-if="item.home_team_abbreviation == teamSelect">
645
+ <template v-if="item.home_match_result == 1">Ganado</template>
646
+ <template v-if="item.home_match_result == 2">Perdido</template>
647
+ <template v-if="item.home_match_result == 3">Empatado</template>
253
648
  </template>
254
- <template #availableItem="{item}">
255
- <div>{{item.name}}</div>
649
+ <template v-if="item.away_team_abbreviation == teamSelect">
650
+ <template v-if="item.visiting_match_result == 1">Ganado</template>
651
+ <template v-if="item.visiting_match_result == 2">Perdido</template>
652
+ <template v-if="item.visiting_match_result == 3">Empatado</template>
256
653
  </template>
257
- </GSCDropdown>
258
- <div :class="$style.btnDetails2">
259
- <div :class="$style.manchesterUnited2" @click="clickShowDetails"><template v-if="showDetails">Ocultar detalles</template><template v-else>Ver detalles</template></div>
260
- </div>
261
- </div>
262
- <div :class="$style.matchDetailContainer">
263
- <div :class="$style.matchContainer6" id="match-info-container">
264
- <div :class="$style.match">
265
- <GSCCarousel v-if="gameRecientesFilter.length > 0" :key="updateCarouselGames" :default-item-by-index="selectedIndexOption" :items="gameRecientesFilter" @input="changeCarouselItem" isMainSlidePriority areSlidesArrowsVisible :areNavigationArrowsVisible="false" slideLeftArrowBackgroundImage="none" slideRightArrowBackgroundImage="none">
266
- <template #default="{ item }">
267
- <div :class="$style.selectoritem">
268
- <div :class="$style.homeTeam">
269
- <div :class="$style.teamContainer2">
270
- <div :class="$style.manchesterUnited">{{ item.home_team_abbreviation }}</div>
271
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+item.home_team+'.png'" />
272
- </div>
273
- </div>
274
- <div :class="$style.scoreContainer1">
275
- <div :class="$style.finalScore">
276
- <div :class="$style.div4" v-if="Object.keys(item).length > 0">{{ item.score[0] }}</div>
277
- <div :class="$style.div4">-</div>
278
- <div :class="$style.div4" v-if="Object.keys(item).length > 0"><template v-if="Array.isArray(item.score)">{{ item.score[1] }}</template>
279
- <template v-else>{{ item.score[4] }}</template></div>
280
- </div>
281
- <div :class="$style.manchesterUnited1">
282
- <template v-if="item.home_team_abbreviation == teamSelect">
283
- <template v-if="item.home_match_result == 1">Ganado</template>
284
- <template v-if="item.home_match_result == 2">Perdido</template>
285
- <template v-if="item.home_match_result == 3">Empatado</template>
286
- </template>
287
- <template v-if="item.away_team_abbreviation == teamSelect">
288
- <template v-if="item.visiting_match_result == 1">Ganado</template>
289
- <template v-if="item.visiting_match_result == 2">Perdido</template>
290
- <template v-if="item.visiting_match_result == 3">Empatado</template>
291
- </template></div>
292
- </div>
293
- <div :class="$style.homeTeam">
294
- <div :class="$style.teamContainer2">
295
- <img :class="$style.imgHomeTeamIcon" alt="" :src="'https://golstatsimages.blob.core.windows.net/teams-80/'+item.away_team+'.png'" />
296
- <div :class="$style.manchesterUnited">{{ item.away_team_abbreviation }}</div>
297
- </div>
298
- </div>
299
- </div>
300
- </template>
301
- </GSCCarousel>
302
- <div v-else>
303
- <div :class="$style.containernofoundsearchrecientes">
304
- <div :class="$style.leyenddeleteshow">No hay resultados con los criterios<br>de búsqueda aplicados.</div>
305
- <div :class="$style.btndeletefilters" @click="deleteFilters">Eliminar filtros aplicados</div>
306
- </div>
654
+ </div>
655
+ </div>
656
+ <div :class="$style.homeTeam">
657
+ <div :class="$style.teamContainer2">
658
+ <img
659
+ :class="$style.imgHomeTeamIcon"
660
+ alt=""
661
+ :src="
662
+ 'https://golstatsimages.blob.core.windows.net/teams-80/' +
663
+ item.away_team +
664
+ '.png'
665
+ "
666
+ />
667
+ <div :class="$style.manchesterUnited">
668
+ {{ item.away_team_abbreviation }}
307
669
  </div>
308
- <GSCMatchDetails style="margin-top: 30px;" v-if="showDetails" :localDetails="localDetails" :foreignDetails="foreignDetails"/>
670
+ </div>
309
671
  </div>
310
-
672
+ </div>
673
+ </template>
674
+ </GSCCarousel>
675
+ <div v-else>
676
+ <div :class="$style.containernofoundsearchrecientes">
677
+ <div :class="$style.leyenddeleteshow">
678
+ No hay resultados con los criterios<br />de búsqueda aplicados.
679
+ </div>
680
+ <div :class="$style.btndeletefilters" @click="deleteFilters">
681
+ Eliminar filtros aplicados
682
+ </div>
311
683
  </div>
684
+ </div>
685
+ <GSCMatchDetails
686
+ style="margin-top: 30px"
687
+ v-if="showDetails"
688
+ :localDetails="localDetails"
689
+ :foreignDetails="foreignDetails"
690
+ />
312
691
  </div>
692
+ </div>
313
693
  </div>
694
+ </div>
314
695
  </div>
315
-
316
- </div>
696
+ </div>
317
697
  </template>
318
698
 
319
699
  <script>
320
- import {
321
- GSCDropdown
322
- } from '@golstats/gsc-dropdown';
700
+ import { GSCDropdown } from '@golstats/gsc-dropdown'
323
701
  import '@@/@golstats/gsc-dropdown/dist/style.css'
324
702
  import '@@/@golstats/gsc-carousel/dist/style.css'
325
- import {
326
- GSCCarousel
327
- } from '@golstats/gsc-carousel'
328
- import {
329
- GscSwitchComponent
330
- } from '@golstats/gsc-switch-component'
703
+ import { GSCCarousel } from '@golstats/gsc-carousel'
704
+ import { GscSwitchComponent } from '@golstats/gsc-switch-component'
331
705
  import '@@/@golstats/gsc-switch-component/dist/style.css'
332
- import GSCFilter from './gsc-filter.vue';
333
- import GSCMatchDetails from './Lineup2D/MatchDetails.vue';
334
- import {
335
- GSCSwitchRadio
336
- } from '@golstats/gsc-switch-radio'
706
+ import GSCFilter from './gsc-filter.vue'
707
+ import GSCMatchDetails from './Lineup2D/MatchDetails.vue'
708
+ import { GSCSwitchRadio } from '@golstats/gsc-switch-radio'
337
709
  import '@@/@golstats/gsc-switch-radio/dist/style.css'
338
710
  export default {
339
- components: {
340
- GSCCarousel,
341
- GscSwitchComponent,
342
- GSCDropdown,
343
- GSCFilter,
344
- GSCSwitchRadio,
345
- GSCMatchDetails
711
+ components: {
712
+ GSCCarousel,
713
+ GscSwitchComponent,
714
+ GSCDropdown,
715
+ GSCFilter,
716
+ GSCSwitchRadio,
717
+ GSCMatchDetails,
718
+ },
719
+ props: {
720
+ widthSize: {
721
+ type: Number,
722
+ default: 0,
346
723
  },
347
- props: {
348
- widthSize: {
349
- type: Number,
350
- default: 0
351
- },
352
- optionSelected: {
353
- type: String,
354
- default: 'Historicos',
355
- },
356
- selectedOption: {
357
- type: String,
358
- default: 'Historicos'
359
- },
360
- gameInfo: {
361
- type: Object,
362
- default: () => {},
363
- },
364
- gameRecientes: {
365
- type: Array,
366
- default: () => [],
367
- },
368
- matchdaysDefault: {
369
- type: Array,
370
- default: () => [],
371
- },
724
+ optionSelected: {
725
+ type: String,
726
+ default: 'Historicos',
372
727
  },
373
- watch: {
374
- optionSelected: {
375
- immediate: true,
376
- handler: async function (newValue) {
377
- if(newValue == 'Recientes'){
378
- this.auxISsection = 1;
379
- }
380
- },
381
- },
382
- gameInfo: {
383
- immediate: true,
384
- handler: async function (newValue) {
385
- try {
386
- this.teamSelect = newValue.home_team_abbreviation;
387
- this.matchFilter();
388
- } catch (e) {
389
- throw new Error(e);
390
- }
391
- },
392
- },
393
- gameRecientes: {
394
- immediate: true,
395
- handler: async function (newValue) {
396
- this.matchFilter();
397
- },
398
- },
728
+ selectedOption: {
729
+ type: String,
730
+ default: 'Historicos',
731
+ },
732
+ gameInfo: {
733
+ type: Object,
734
+ default: () => {},
399
735
  },
400
- data() {
401
- return {
402
- playminutes: [],
403
- showDetails: false,
404
- teamSelect: '',
405
- defaultDropItem: {},
406
- updateCarouselGames: 0,
407
- valLast: {},
408
- selectedIndexOption: 0,
409
- openfiltervalue: false,
410
- vDeleteFilter: false,
411
- filterObject: {},
412
- coutChange: 0,
413
- auxISsection: 0,
414
- matchdaysFiltersUpdate: [],
415
- gamesFiltersUpdate: [],
416
- localDetails: [],
417
- keyUpdate: 0,
418
- foreignDetails: [],
736
+ gameRecientes: {
737
+ type: Array,
738
+ default: () => [],
739
+ },
740
+ matchdaysDefault: {
741
+ type: Array,
742
+ default: () => [],
743
+ },
744
+ },
745
+ watch: {
746
+ optionSelected: {
747
+ immediate: true,
748
+ handler: async function (newValue) {
749
+ if (newValue == 'Recientes') {
750
+ this.auxISsection = 1
751
+ }
752
+ },
753
+ },
754
+ gameInfo: {
755
+ immediate: true,
756
+ handler: async function (newValue) {
757
+ try {
758
+ this.teamSelect = newValue.home_team_abbreviation
759
+ this.matchFilter()
760
+ } catch (e) {
761
+ throw new Error(e)
419
762
  }
763
+ },
764
+ },
765
+ gameRecientes: {
766
+ immediate: true,
767
+ handler: async function (newValue) {
768
+ this.matchFilter()
769
+ },
420
770
  },
421
- computed: {
422
-
423
- matchdaysFinal(){
424
- var matchdaysFinal = [];
425
- if(typeof this.filterObject.selectedFilterResults !== 'undefined'){
771
+ },
772
+ data() {
773
+ return {
774
+ playminutes: [],
775
+ showDetails: false,
776
+ teamSelect: '',
777
+ defaultDropItem: {},
778
+ updateCarouselGames: 0,
779
+ valLast: {},
780
+ selectedIndexOption: 0,
781
+ openfiltervalue: false,
782
+ vDeleteFilter: false,
783
+ filterObject: {},
784
+ coutChange: 0,
785
+ auxISsection: 0,
786
+ matchdaysFiltersUpdate: [],
787
+ gamesFiltersUpdate: [],
788
+ localDetails: [],
789
+ keyUpdate: 0,
790
+ foreignDetails: [],
791
+ }
792
+ },
793
+ computed: {
794
+ matchdaysFinal() {
795
+ var matchdaysFinal = []
796
+ if (typeof this.filterObject.selectedFilterResults !== 'undefined') {
426
797
  if (Object.keys(this.filterObject.selectedFilterResults).length != 3) {
427
- if(Object.keys(this.filterObject.selectedFilterResults).length == 2){
428
- if(Object.values(this.filterObject.selectedFilterResults).includes('win') && Object.values(this.filterObject.selectedFilterResults).includes('draw')){
429
- for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
430
- if(this.matchdaysFiltersUpdate[index].match_result == 1){
431
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
432
- }
798
+ if (Object.keys(this.filterObject.selectedFilterResults).length == 2) {
799
+ if (
800
+ Object.values(this.filterObject.selectedFilterResults).includes('win') &&
801
+ Object.values(this.filterObject.selectedFilterResults).includes('draw')
802
+ ) {
803
+ for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
804
+ if (this.matchdaysFiltersUpdate[index].match_result == 1) {
805
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
433
806
  }
434
- for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
435
- if(this.matchdaysFiltersUpdate[index].match_result == 3){
436
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
437
- }
807
+ }
808
+ for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
809
+ if (this.matchdaysFiltersUpdate[index].match_result == 3) {
810
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
438
811
  }
812
+ }
439
813
  }
440
- if(Object.values(this.filterObject.selectedFilterResults).includes('win') && Object.values(this.filterObject.selectedFilterResults).includes('lose')){
814
+ if (
815
+ Object.values(this.filterObject.selectedFilterResults).includes('win') &&
816
+ Object.values(this.filterObject.selectedFilterResults).includes('lose')
817
+ ) {
441
818
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
442
- if(this.matchdaysFiltersUpdate[index].match_result == 1){
443
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
444
- }
819
+ if (this.matchdaysFiltersUpdate[index].match_result == 1) {
820
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
445
821
  }
446
- for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
447
- if(this.matchdaysFiltersUpdate[index].match_result == 2){
448
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
449
- }
822
+ }
823
+ for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
824
+ if (this.matchdaysFiltersUpdate[index].match_result == 2) {
825
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
450
826
  }
827
+ }
451
828
  }
452
- if(Object.values(this.filterObject.selectedFilterResults).includes('lose') && Object.values(this.filterObject.selectedFilterResults).includes('draw')){
829
+ if (
830
+ Object.values(this.filterObject.selectedFilterResults).includes('lose') &&
831
+ Object.values(this.filterObject.selectedFilterResults).includes('draw')
832
+ ) {
453
833
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
454
- if(this.matchdaysFiltersUpdate[index].match_result == 3){
455
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
456
- }
834
+ if (this.matchdaysFiltersUpdate[index].match_result == 3) {
835
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
457
836
  }
458
- for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
459
- if(this.matchdaysFiltersUpdate[index].match_result == 2){
460
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
461
- }
837
+ }
838
+ for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
839
+ if (this.matchdaysFiltersUpdate[index].match_result == 2) {
840
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
462
841
  }
842
+ }
463
843
  }
464
- }else{
465
- if(this.filterObject.selectedFilterResults[0] == 'win'){
844
+ } else {
845
+ if (this.filterObject.selectedFilterResults[0] == 'win') {
466
846
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
467
- if(this.matchdaysFiltersUpdate[index].match_result == 1){
468
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
847
+ if (this.matchdaysFiltersUpdate[index].match_result == 1) {
848
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
469
849
  }
470
850
  }
471
851
  }
472
- if(this.filterObject.selectedFilterResults[0] == 'lose'){
852
+ if (this.filterObject.selectedFilterResults[0] == 'lose') {
473
853
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
474
- if(this.matchdaysFiltersUpdate[index].match_result == 2){
475
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
854
+ if (this.matchdaysFiltersUpdate[index].match_result == 2) {
855
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
476
856
  }
477
857
  }
478
858
  }
479
- if(this.filterObject.selectedFilterResults[0] == 'draw'){
859
+ if (this.filterObject.selectedFilterResults[0] == 'draw') {
480
860
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
481
- if(this.matchdaysFiltersUpdate[index].match_result == 3){
482
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
861
+ if (this.matchdaysFiltersUpdate[index].match_result == 3) {
862
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
483
863
  }
484
864
  }
485
865
  }
486
866
  }
487
- }else{
867
+ } else {
488
868
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
489
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
869
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
490
870
  }
491
871
  }
492
- }else{
872
+ } else {
493
873
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
494
- matchdaysFinal.push(this.matchdaysFiltersUpdate[index]);
495
- }
874
+ matchdaysFinal.push(this.matchdaysFiltersUpdate[index])
875
+ }
496
876
  }
497
- matchdaysFinal.sort((a, b) => b.id - a.id);
498
- return matchdaysFinal;
499
- },
500
- gameRecientesFilter(){
501
- var gameFilterFinal = [];
502
- if(typeof this.filterObject.selectedFilterResults !== 'undefined'){
877
+ matchdaysFinal.sort((a, b) => b.id - a.id)
878
+ return matchdaysFinal
879
+ },
880
+ gameRecientesFilter() {
881
+ var gameFilterFinal = []
882
+ if (typeof this.filterObject.selectedFilterResults !== 'undefined') {
503
883
  if (Object.keys(this.filterObject.selectedFilterResults).length != 3) {
504
- if(Object.keys(this.filterObject.selectedFilterResults).length == 2){
505
- if(Object.values(this.filterObject.selectedFilterResults).includes('win') && Object.values(this.filterObject.selectedFilterResults).includes('draw')){
506
- for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
507
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 1) ||
508
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 1)){
509
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
510
- }
884
+ if (Object.keys(this.filterObject.selectedFilterResults).length == 2) {
885
+ if (
886
+ Object.values(this.filterObject.selectedFilterResults).includes('win') &&
887
+ Object.values(this.filterObject.selectedFilterResults).includes('draw')
888
+ ) {
889
+ for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
890
+ if (
891
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
892
+ this.gamesFiltersUpdate[index].visiting_match_result == 1) ||
893
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
894
+ this.gamesFiltersUpdate[index].home_match_result == 1)
895
+ ) {
896
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
511
897
  }
512
- for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
513
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 3) ||
514
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 3)){
515
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
516
- }
898
+ }
899
+ for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
900
+ if (
901
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
902
+ this.gamesFiltersUpdate[index].visiting_match_result == 3) ||
903
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
904
+ this.gamesFiltersUpdate[index].home_match_result == 3)
905
+ ) {
906
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
517
907
  }
908
+ }
518
909
  }
519
- if(Object.values(this.filterObject.selectedFilterResults).includes('win') && Object.values(this.filterObject.selectedFilterResults).includes('lose')){
910
+ if (
911
+ Object.values(this.filterObject.selectedFilterResults).includes('win') &&
912
+ Object.values(this.filterObject.selectedFilterResults).includes('lose')
913
+ ) {
520
914
  for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
521
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 1) ||
522
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 1)){
523
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
524
- }
915
+ if (
916
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
917
+ this.gamesFiltersUpdate[index].visiting_match_result == 1) ||
918
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
919
+ this.gamesFiltersUpdate[index].home_match_result == 1)
920
+ ) {
921
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
525
922
  }
526
- for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
527
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 2) ||
528
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 2)){
529
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
530
- }
923
+ }
924
+ for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
925
+ if (
926
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
927
+ this.gamesFiltersUpdate[index].visiting_match_result == 2) ||
928
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
929
+ this.gamesFiltersUpdate[index].home_match_result == 2)
930
+ ) {
931
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
531
932
  }
933
+ }
532
934
  }
533
- if(Object.values(this.filterObject.selectedFilterResults).includes('lose') && Object.values(this.filterObject.selectedFilterResults).includes('draw')){
935
+ if (
936
+ Object.values(this.filterObject.selectedFilterResults).includes('lose') &&
937
+ Object.values(this.filterObject.selectedFilterResults).includes('draw')
938
+ ) {
534
939
  for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
535
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 3) ||
536
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 3)){
537
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
538
- }
940
+ if (
941
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
942
+ this.gamesFiltersUpdate[index].visiting_match_result == 3) ||
943
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
944
+ this.gamesFiltersUpdate[index].home_match_result == 3)
945
+ ) {
946
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
539
947
  }
540
- for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
541
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 2) ||
542
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 2)){
543
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
544
- }
948
+ }
949
+ for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
950
+ if (
951
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
952
+ this.gamesFiltersUpdate[index].visiting_match_result == 2) ||
953
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
954
+ this.gamesFiltersUpdate[index].home_match_result == 2)
955
+ ) {
956
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
545
957
  }
958
+ }
546
959
  }
547
- }else{
548
- if(this.filterObject.selectedFilterResults[0] == 'win'){
960
+ } else {
961
+ if (this.filterObject.selectedFilterResults[0] == 'win') {
549
962
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
550
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 1) ||
551
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 1)){
552
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
553
- }
963
+ if (
964
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
965
+ this.gamesFiltersUpdate[index].visiting_match_result == 1) ||
966
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
967
+ this.gamesFiltersUpdate[index].home_match_result == 1)
968
+ ) {
969
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
970
+ }
554
971
  }
555
972
  }
556
- if(this.filterObject.selectedFilterResults[0] == 'lose'){
973
+ if (this.filterObject.selectedFilterResults[0] == 'lose') {
557
974
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
558
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 2) ||
559
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 2)){
560
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
561
- }
975
+ if (
976
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
977
+ this.gamesFiltersUpdate[index].visiting_match_result == 2) ||
978
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
979
+ this.gamesFiltersUpdate[index].home_match_result == 2)
980
+ ) {
981
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
982
+ }
562
983
  }
563
984
  }
564
- if(this.filterObject.selectedFilterResults[0] == 'draw'){
985
+ if (this.filterObject.selectedFilterResults[0] == 'draw') {
565
986
  for (let index = 0; index < this.matchdaysFiltersUpdate.length; index++) {
566
- if((this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].visiting_match_result == 3) ||
567
- (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect && this.gamesFiltersUpdate[index].home_match_result == 3)){
568
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
569
- }
987
+ if (
988
+ (this.gamesFiltersUpdate[index].away_team_abbreviation == this.teamSelect &&
989
+ this.gamesFiltersUpdate[index].visiting_match_result == 3) ||
990
+ (this.gamesFiltersUpdate[index].home_team_abbreviation == this.teamSelect &&
991
+ this.gamesFiltersUpdate[index].home_match_result == 3)
992
+ ) {
993
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
994
+ }
570
995
  }
571
996
  }
572
997
  }
573
- }else{
998
+ } else {
574
999
  for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
575
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
1000
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
576
1001
  }
577
1002
  }
578
- }else{
1003
+ } else {
579
1004
  for (let index = 0; index < this.gamesFiltersUpdate.length; index++) {
580
- gameFilterFinal.push(this.gamesFiltersUpdate[index]);
581
- }
582
- }
583
- gameFilterFinal.sort((a, b) => a.matchday_id - b.matchday_id);
584
- return gameFilterFinal;
585
- },
586
- headerSeccionAlineaciones1Class() {
587
- const width = this.widthSize;
588
- if (width <= 420) {
589
- return this.$style.headerSeccionAlineaciones1420;
590
- } else if (width <= 880) {
591
- return this.$style.headerSeccionAlineaciones1880;
592
- } else if (width <= 1200) {
593
- return this.$style.headerSeccionAlineaciones11200;
594
- } else {
595
- return this.$style.headerSeccionAlineaciones1;
596
- }
597
- },
598
- headerSeccionAlineaciones2Class() {
599
- const width = this.widthSize;
600
- if (width <= 420) {
601
- return this.$style.headerSeccionAlineaciones2420;
602
- } else if (width <= 540) {
603
- return this.$style.headerSeccionAlineaciones2540;
604
- } else if (width <= 880) {
605
- return this.$style.headerSeccionAlineaciones2880;
606
- } else if (width <= 1200) {
607
- return this.$style.headerSeccionAlineaciones21200;
608
- } else {
609
- return this.$style.headerSeccionAlineaciones2;
610
- }
611
- },
612
- headerSeccionAlineaciones3Class() {
613
- const width = this.widthSize;
614
- if (width <= 420) {
615
- return this.$style.headerSeccionAlineaciones3420;
616
- } else if (width <= 540) {
617
- return this.$style.headerSeccionAlineaciones3540;
618
- } else if (width <= 880) {
619
- return this.$style.headerSeccionAlineaciones3880;
620
- } else if (width <= 1200) {
621
- return this.$style.headerSeccionAlineaciones31200;
622
- } else {
623
- return this.$style.headerSeccionAlineaciones3;
624
- }
625
- },
1005
+ gameFilterFinal.push(this.gamesFiltersUpdate[index])
1006
+ }
1007
+ }
1008
+ gameFilterFinal.sort((a, b) => a.matchday_id - b.matchday_id)
1009
+ return gameFilterFinal
1010
+ },
1011
+ headerSeccionAlineaciones1Class() {
1012
+ const width = this.widthSize
1013
+ if (width <= 420) {
1014
+ return this.$style.headerSeccionAlineaciones1420
1015
+ } else if (width <= 880) {
1016
+ return this.$style.headerSeccionAlineaciones1880
1017
+ } else if (width <= 1200) {
1018
+ return this.$style.headerSeccionAlineaciones11200
1019
+ } else {
1020
+ return this.$style.headerSeccionAlineaciones1
1021
+ }
1022
+ },
1023
+ headerSeccionAlineaciones2Class() {
1024
+ const width = this.widthSize
1025
+ if (width <= 420) {
1026
+ return this.$style.headerSeccionAlineaciones2420
1027
+ } else if (width <= 540) {
1028
+ return this.$style.headerSeccionAlineaciones2540
1029
+ } else if (width <= 880) {
1030
+ return this.$style.headerSeccionAlineaciones2880
1031
+ } else if (width <= 1200) {
1032
+ return this.$style.headerSeccionAlineaciones21200
1033
+ } else {
1034
+ return this.$style.headerSeccionAlineaciones2
1035
+ }
1036
+ },
1037
+ headerSeccionAlineaciones3Class() {
1038
+ const width = this.widthSize
1039
+ if (width <= 420) {
1040
+ return this.$style.headerSeccionAlineaciones3420
1041
+ } else if (width <= 540) {
1042
+ return this.$style.headerSeccionAlineaciones3540
1043
+ } else if (width <= 880) {
1044
+ return this.$style.headerSeccionAlineaciones3880
1045
+ } else if (width <= 1200) {
1046
+ return this.$style.headerSeccionAlineaciones31200
1047
+ } else {
1048
+ return this.$style.headerSeccionAlineaciones3
1049
+ }
1050
+ },
1051
+ },
1052
+ methods: {
1053
+ clickOnValueFilter() {
1054
+ this.auxISsection = 0
1055
+ },
1056
+ clickOnValueCarrousel() {
1057
+ this.auxISsection = 0
1058
+ },
1059
+ deleteFilters() {
1060
+ this.vDeleteFilter = true
626
1061
 
1062
+ setTimeout(() => {
1063
+ this.vDeleteFilter = false
1064
+ }, 200)
627
1065
  },
628
- methods: {
629
- clickOnValueFilter(){
630
- this.auxISsection = 0;
631
- },
632
- clickOnValueCarrousel(){
633
- this.auxISsection = 0;
634
- },
635
- deleteFilters(){
636
- this.vDeleteFilter = true;
637
-
638
- setTimeout(() => {
639
- this.vDeleteFilter = false;
640
- }, 200);
641
- },
642
- clickShowDetails(){
643
- this.showDetails = !this.showDetails;
644
- },
645
- matchFilter() {
646
- var matchdayFilter = [];
647
- var gameFilter = [];
648
- if (Object.keys(this.filterObject).length > 0) {
649
- if (Object.keys(this.filterObject.selectedFilterTeam).length != 2) {
650
- for (let index = 0; index < this.gameRecientes[this.teamSelect].length; index++) {
651
- if (this.filterObject.selectedFilterTeam[0] == 'local') {
652
- if (this.gameRecientes[this.teamSelect][index].home_team_abbreviation == this.teamSelect) {
653
- matchdayFilter.push({
654
- name: this.gameRecientes[this.teamSelect][index].matchday_abbreviation.replace('M', 'Jornada '),
655
- id: this.gameRecientes[this.teamSelect][index].matchday_id,
656
- match_result: this.gameRecientes[this.teamSelect][index].home_match_result,
657
- });
658
- gameFilter.push(this.gameRecientes[this.teamSelect][index]);
659
- }
660
- } else {
661
- if (this.gameRecientes[this.teamSelect][index].away_team_abbreviation == this.teamSelect) {
662
- matchdayFilter.push({
663
- name: this.gameRecientes[this.teamSelect][index].matchday_abbreviation.replace('M', 'Jornada '),
664
- id: this.gameRecientes[this.teamSelect][index].matchday_id,
665
- match_result: this.gameRecientes[this.teamSelect][index].visiting_match_result,
666
- });
667
- gameFilter.push(this.gameRecientes[this.teamSelect][index]);
668
- }
669
- }
670
- }
671
-
672
- } else {
673
- if (this.gameRecientes[this.teamSelect]) {
674
- for (let index = 0; index < this.gameRecientes[this.teamSelect].length; index++) {
675
- matchdayFilter.push({
676
- name: this.gameRecientes[this.teamSelect][index].matchday_abbreviation.replace('M', 'Jornada '),
677
- id: this.gameRecientes[this.teamSelect][index].matchday_id,
678
- match_result: this.gameRecientes[this.teamSelect][index].home_team_abbreviation == this.teamSelect ? this.gameRecientes[this.teamSelect][index].home_match_result : this.gameRecientes[this.teamSelect][index].visiting_match_result,
679
- });
680
- gameFilter.push(this.gameRecientes[this.teamSelect][index]);
681
- }
682
- }
683
- }
1066
+ clickShowDetails() {
1067
+ this.showDetails = !this.showDetails
1068
+ },
1069
+ matchFilter() {
1070
+ var matchdayFilter = []
1071
+ var gameFilter = []
1072
+ if (Object.keys(this.filterObject).length > 0) {
1073
+ if (Object.keys(this.filterObject.selectedFilterTeam).length != 2) {
1074
+ for (let index = 0; index < this.gameRecientes[this.teamSelect].length; index++) {
1075
+ if (this.filterObject.selectedFilterTeam[0] == 'local') {
1076
+ if (
1077
+ this.gameRecientes[this.teamSelect][index].home_team_abbreviation == this.teamSelect
1078
+ ) {
1079
+ matchdayFilter.push({
1080
+ name: this.gameRecientes[this.teamSelect][index].matchday_abbreviation.replace(
1081
+ 'M',
1082
+ 'Jornada ',
1083
+ ),
1084
+ id: this.gameRecientes[this.teamSelect][index].matchday_id,
1085
+ match_result: this.gameRecientes[this.teamSelect][index].home_match_result,
1086
+ })
1087
+ gameFilter.push(this.gameRecientes[this.teamSelect][index])
1088
+ }
684
1089
  } else {
685
- if (this.gameRecientes[this.teamSelect]) {
686
- for (let index = 0; index < this.gameRecientes[this.teamSelect].length; index++) {
687
- matchdayFilter.push({
688
- name: this.getRound(this.gameRecientes[this.teamSelect][index].matchday_abbreviation),
689
- id: this.gameRecientes[this.teamSelect][index].matchday_id,
690
- match_result: this.gameRecientes[this.teamSelect][index].home_team_abbreviation == this.teamSelect ? this.gameRecientes[this.teamSelect][index].home_match_result : this.gameRecientes[this.teamSelect][index].visiting_match_result,
691
- });
692
- gameFilter.push(this.gameRecientes[this.teamSelect][index]);
693
- }
694
- }
695
- }
696
- this.gamesFiltersUpdate = gameFilter;
697
- this.matchdaysFiltersUpdate = matchdayFilter;
698
-
699
- },
700
- getRound(abrev) {
701
- let abrevFormatted = abrev.replace('M', 'Jornada ');
702
- abrevFormatted = abrevFormatted.replace('PO1', 'CFI')
703
- abrevFormatted = abrevFormatted.replace('PO2', 'CFV')
704
- abrevFormatted = abrevFormatted.replace('PO3', 'SFI')
705
- abrevFormatted = abrevFormatted.replace('PO4', 'SFV')
706
- abrevFormatted = abrevFormatted.replace('PO5', 'FI')
707
- abrevFormatted = abrevFormatted.replace('PO6', 'FV')
708
- return abrevFormatted
709
- },
710
- changeFiltersModal(filters) {
711
- this.auxISsection = 1;
712
- this.filterObject = filters;
713
- this.openfiltervalue = false;
714
- this.matchFilter();
715
- setTimeout(() => {
716
- this.keyUpdate +=1;
717
- this.updateCarouselGames += 1;
718
- }, 600);
719
- },
720
- openFilter() {
721
- this.openfiltervalue = true;
722
- },
723
- getMinutesData(plays){
724
- this.localDetails = [];
725
- this.foreignDetails = [];
726
- for (let index = 0; index < plays.home_goals_minutes.length; index++) {
727
- this.localDetails.push({ description: plays.home_goals_minutes[index], icon: 'goal' });
728
- }
729
- for (let index = 0; index < plays.visiting_goals_minutes.length; index++) {
730
- this.foreignDetails.push({ description: plays.visiting_goals_minutes[index], icon: 'goal' });
731
- }
732
- for (let index = 0; index < plays.home_yellow_cards_minutes.length; index++) {
733
- this.localDetails.push({ description: plays.home_yellow_cards_minutes[index], icon: 'yellow-card' });
734
- }
735
- for (let index = 0; index < plays.away_yellow_cards_minutes.length; index++) {
736
- this.foreignDetails.push({ description: plays.away_yellow_cards_minutes[index], icon: 'yellow-card' });
737
- }
738
- for (let index = 0; index < plays.home_red_cards_minutes.length; index++) {
739
- this.localDetails.push({ description: plays.home_red_cards_minutes[index], icon: 'red-card' });
740
- }
741
- for (let index = 0; index < plays.away_red_cards_minutes.length; index++) {
742
- this.foreignDetails.push({ description: plays.away_red_cards_minutes[index], icon: 'red-card' });
1090
+ if (
1091
+ this.gameRecientes[this.teamSelect][index].away_team_abbreviation == this.teamSelect
1092
+ ) {
1093
+ matchdayFilter.push({
1094
+ name: this.gameRecientes[this.teamSelect][index].matchday_abbreviation.replace(
1095
+ 'M',
1096
+ 'Jornada ',
1097
+ ),
1098
+ id: this.gameRecientes[this.teamSelect][index].matchday_id,
1099
+ match_result: this.gameRecientes[this.teamSelect][index].visiting_match_result,
1100
+ })
1101
+ gameFilter.push(this.gameRecientes[this.teamSelect][index])
1102
+ }
743
1103
  }
744
- },
745
- changeCarouselItem(val) {
746
- setTimeout(() => {
747
- if(JSON.stringify(val) !== JSON.stringify(this.valLast)) {
748
- if(this.gameRecientesFilter && this.gameRecientesFilter.length > 0){
749
- if(val){
750
- if (val.selectedItem === undefined) {
751
- val.selectedItem = this.gameRecientesFilter[this.gameRecientesFilter.length -1];
752
- val.selectedItemIndex = this.gameRecientesFilter.length -1;
753
- }
754
-
755
- this.valLast = val;
756
- if(this.auxISsection == 1){
757
- this.$emit('input', {selectedItem: this.gameRecientesFilter[this.gameRecientesFilter.length -1], selectedItemIndex: this.gameRecientesFilter.length -1});
758
- this.getMinutesData(this.gameRecientesFilter[this.gameRecientesFilter.length -1].minutes);
759
- this.selectedIndexOption = this.gameRecientesFilter.length -1;
760
- this.defaultDropItem = { propName: 'id', value: this.gameRecientesFilter[this.gameRecientesFilter.length -1].matchday_id }
761
- }else{
762
- this.$emit('input', val);
763
- this.getMinutesData(val.selectedItem.minutes);
764
- this.selectedIndexOption = val.selectedItemIndex;
765
- this.defaultDropItem = { propName: 'id', value: val.selectedItem.matchday_id }
766
- }
767
- this.keyUpdate += 1;
768
- }
1104
+ }
1105
+ } else {
1106
+ if (this.gameRecientes[this.teamSelect]) {
1107
+ for (let index = 0; index < this.gameRecientes[this.teamSelect].length; index++) {
1108
+ matchdayFilter.push({
1109
+ name: this.gameRecientes[this.teamSelect][index].matchday_abbreviation.replace(
1110
+ 'M',
1111
+ 'Jornada ',
1112
+ ),
1113
+ id: this.gameRecientes[this.teamSelect][index].matchday_id,
1114
+ match_result:
1115
+ this.gameRecientes[this.teamSelect][index].home_team_abbreviation ==
1116
+ this.teamSelect
1117
+ ? this.gameRecientes[this.teamSelect][index].home_match_result
1118
+ : this.gameRecientes[this.teamSelect][index].visiting_match_result,
1119
+ })
1120
+ gameFilter.push(this.gameRecientes[this.teamSelect][index])
769
1121
  }
770
- }
771
- }, 200);
772
-
773
-
774
- },
775
- changeDropdown(value) {
776
- if(this.gameRecientesFilter && this.gameRecientesFilter.length > 0){
777
- if(this.auxISsection == 1){
778
- this.selectedIndexOption = this.gameRecientesFilter.length -1;
779
- this.defaultDropItem = { propName: 'id', value: this.gameRecientesFilter[this.gameRecientesFilter.length -1].matchday_id }
780
- }else{
781
- const index = this.gameRecientesFilter.findIndex(x => x.matchday_id == value.id);
782
- if (index != -1) {
783
- this.selectedIndexOption = index;
784
- this.defaultDropItem = { propName: 'id', value: this.gameRecientesFilter[index].matchday_id }
785
- }
1122
+ }
1123
+ }
1124
+ } else {
1125
+ if (this.gameRecientes[this.teamSelect]) {
1126
+ for (let index = 0; index < this.gameRecientes[this.teamSelect].length; index++) {
1127
+ matchdayFilter.push({
1128
+ name: this.getRound(this.gameRecientes[this.teamSelect][index].matchday_abbreviation),
1129
+ id: this.gameRecientes[this.teamSelect][index].matchday_id,
1130
+ match_result:
1131
+ this.gameRecientes[this.teamSelect][index].home_team_abbreviation == this.teamSelect
1132
+ ? this.gameRecientes[this.teamSelect][index].home_match_result
1133
+ : this.gameRecientes[this.teamSelect][index].visiting_match_result,
1134
+ })
1135
+ gameFilter.push(this.gameRecientes[this.teamSelect][index])
1136
+ }
1137
+ }
1138
+ }
1139
+ this.gamesFiltersUpdate = gameFilter
1140
+ this.matchdaysFiltersUpdate = matchdayFilter
1141
+ },
1142
+ getRound(abrev) {
1143
+ let abrevFormatted = abrev.replace('M', 'Jornada ')
1144
+ abrevFormatted = abrevFormatted.replace('PO1', 'CFI')
1145
+ abrevFormatted = abrevFormatted.replace('PO2', 'CFV')
1146
+ abrevFormatted = abrevFormatted.replace('PO3', 'SFI')
1147
+ abrevFormatted = abrevFormatted.replace('PO4', 'SFV')
1148
+ abrevFormatted = abrevFormatted.replace('PO5', 'FI')
1149
+ abrevFormatted = abrevFormatted.replace('PO6', 'FV')
1150
+ return abrevFormatted
1151
+ },
1152
+ changeFiltersModal(filters) {
1153
+ this.auxISsection = 1
1154
+ this.filterObject = filters
1155
+ this.openfiltervalue = false
1156
+ this.matchFilter()
1157
+ setTimeout(() => {
1158
+ this.keyUpdate += 1
1159
+ this.updateCarouselGames += 1
1160
+ }, 600)
1161
+ },
1162
+ openFilter() {
1163
+ this.openfiltervalue = true
1164
+ },
1165
+ getMinutesData(plays) {
1166
+ this.localDetails = []
1167
+ this.foreignDetails = []
1168
+ for (let index = 0; index < plays.home_goals_minutes.length; index++) {
1169
+ this.localDetails.push({ description: plays.home_goals_minutes[index], icon: 'goal' })
1170
+ }
1171
+ for (let index = 0; index < plays.visiting_goals_minutes.length; index++) {
1172
+ this.foreignDetails.push({ description: plays.visiting_goals_minutes[index], icon: 'goal' })
1173
+ }
1174
+ for (let index = 0; index < plays.home_yellow_cards_minutes.length; index++) {
1175
+ this.localDetails.push({
1176
+ description: plays.home_yellow_cards_minutes[index],
1177
+ icon: 'yellow-card',
1178
+ })
1179
+ }
1180
+ for (let index = 0; index < plays.away_yellow_cards_minutes.length; index++) {
1181
+ this.foreignDetails.push({
1182
+ description: plays.away_yellow_cards_minutes[index],
1183
+ icon: 'yellow-card',
1184
+ })
1185
+ }
1186
+ for (let index = 0; index < plays.home_red_cards_minutes.length; index++) {
1187
+ this.localDetails.push({
1188
+ description: plays.home_red_cards_minutes[index],
1189
+ icon: 'red-card',
1190
+ })
1191
+ }
1192
+ for (let index = 0; index < plays.away_red_cards_minutes.length; index++) {
1193
+ this.foreignDetails.push({
1194
+ description: plays.away_red_cards_minutes[index],
1195
+ icon: 'red-card',
1196
+ })
1197
+ }
1198
+ },
1199
+ changeCarouselItem(val) {
1200
+ setTimeout(() => {
1201
+ if (JSON.stringify(val) !== JSON.stringify(this.valLast)) {
1202
+ if (this.gameRecientesFilter && this.gameRecientesFilter.length > 0) {
1203
+ if (val) {
1204
+ if (val.selectedItem === undefined) {
1205
+ val.selectedItem = this.gameRecientesFilter[this.gameRecientesFilter.length - 1]
1206
+ val.selectedItemIndex = this.gameRecientesFilter.length - 1
1207
+ }
1208
+
1209
+ this.valLast = val
1210
+ if (this.auxISsection == 1) {
1211
+ this.$emit('input', {
1212
+ selectedItem: this.gameRecientesFilter[this.gameRecientesFilter.length - 1],
1213
+ selectedItemIndex: this.gameRecientesFilter.length - 1,
1214
+ })
1215
+ this.getMinutesData(
1216
+ this.gameRecientesFilter[this.gameRecientesFilter.length - 1].minutes,
1217
+ )
1218
+ this.selectedIndexOption = this.gameRecientesFilter.length - 1
1219
+ this.defaultDropItem = {
1220
+ propName: 'id',
1221
+ value: this.gameRecientesFilter[this.gameRecientesFilter.length - 1].matchday_id,
786
1222
  }
1223
+ } else {
1224
+ this.$emit('input', val)
1225
+ this.getMinutesData(val.selectedItem.minutes)
1226
+ this.selectedIndexOption = val.selectedItemIndex
1227
+ this.defaultDropItem = { propName: 'id', value: val.selectedItem.matchday_id }
1228
+ }
1229
+ this.keyUpdate += 1
787
1230
  }
788
- },
789
-
790
- changeSwitchRadio(val) {
791
- this.auxISsection = 1;
792
- if (typeof val !== 'object') {
793
- this.teamSelect = val;
794
- this.$emit('changeTeam', this.teamSelect);
795
- this.updateCarouselGames += 1;
796
- this.matchFilter();
1231
+ }
1232
+ }
1233
+ }, 200)
1234
+ },
1235
+ changeDropdown(value) {
1236
+ if (this.gameRecientesFilter && this.gameRecientesFilter.length > 0) {
1237
+ if (this.auxISsection == 1) {
1238
+ this.selectedIndexOption = this.gameRecientesFilter.length - 1
1239
+ this.defaultDropItem = {
1240
+ propName: 'id',
1241
+ value: this.gameRecientesFilter[this.gameRecientesFilter.length - 1].matchday_id,
1242
+ }
1243
+ } else {
1244
+ const index = this.gameRecientesFilter.findIndex((x) => x.matchday_id == value.id)
1245
+ if (index != -1) {
1246
+ this.selectedIndexOption = index
1247
+ this.defaultDropItem = {
1248
+ propName: 'id',
1249
+ value: this.gameRecientesFilter[index].matchday_id,
797
1250
  }
798
- },
799
- clickOnSelectOption(val) {
800
- this.$emit('clickOnSelectOption', val);
1251
+ }
801
1252
  }
1253
+ }
802
1254
  },
803
-
804
- };
1255
+
1256
+ changeSwitchRadio(val) {
1257
+ this.auxISsection = 1
1258
+ if (typeof val !== 'object') {
1259
+ this.teamSelect = val
1260
+ this.$emit('changeTeam', this.teamSelect)
1261
+ this.updateCarouselGames += 1
1262
+ this.matchFilter()
1263
+ }
1264
+ },
1265
+ clickOnSelectOption(val) {
1266
+ this.$emit('clickOnSelectOption', val)
1267
+ },
1268
+ },
1269
+ }
805
1270
  </script>
806
1271
 
807
1272
  <style module>
808
1273
  @import '/css/fonts.css';
809
- @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap");
810
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@600&display=swap");
1274
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');
1275
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@600&display=swap');
811
1276
 
812
1277
  body {
813
- margin: 0;
814
- line-height: normal;
1278
+ margin: 0;
1279
+ line-height: normal;
815
1280
  }
816
1281
 
817
1282
  :root {
818
- /* fonts */
819
- --font-poppinsre: Poppins;
820
- --font-interre: Inter;
821
-
822
- /* font sizes */
823
- --font-size-4xsre: 9px;
824
- --font-size-smre: 14px;
825
- --font-size-xsre: 12px;
826
- --font-size-base-2re: 15.2px;
827
- --font-size-3xsre: 10px;
828
- --font-size-2xsre: 11px;
829
-
830
- /* Colors */
831
- --color-gray-100re: #172632;
832
- --color-gray-200re: #172531;
833
- --color-gray-300re: rgba(255, 255, 255, 0.05);
834
- --color-gray-400re: rgba(255, 255, 255, 0.2);
835
- --color-gray-500re: rgba(255, 255, 255, 0.3);
836
- --color-gray-600re: rgba(255, 255, 255, 0.1);
837
- --color-gray-700re: rgba(255, 255, 255, 0.7);
838
- --color-goldenrodre: #f7c330;
839
- --color-redre: #ff0000;
840
- --color-yellowgreen-100re: #cbed6e;
841
- --color-yellowgreen-200re: #cbee6b;
842
- --color-white: #fff;
843
- --color-whitesmokere: #f4f4f4;
844
- --color-darkbluere: #0234c5;
845
- --color-darkslategrayre: #1e2b36;
846
- --color-slategrayre: #56637b;
847
-
848
- /* Spacing */
849
- --sizes-round-corner-round-corner-32re: 32px;
850
- --sizes-spacing-space-24re: 24px;
851
-
852
- /* Gaps */
853
- --gap-basere: 16px;
854
- --gap-xsre: 12px;
855
- --gap-40xlre: 59px;
856
- --gap-3xsre: 10px;
857
- --gap-4xsre: 9px;
858
- --gap-midre: 17px;
859
- --gap-minire: 15px;
860
- --gap-8xsre: 5px;
861
- --gap-4xs-7re: 8.7px;
862
- --gap-11xlre: 30px;
863
-
864
- /* Paddings */
865
- --padding-basere: 16px;
866
- --padding-5xlre: 24px;
867
- --padding-9xsre: 4px;
868
- --padding-6xs-5re: 6.5px;
869
- --padding-mid-4re: 17.4px;
870
- --padding-11xsre: 2px;
871
- --padding-3xsre: 10px;
872
- --padding-5xsre: 8px;
873
- --padding-xsre: 12px;
874
- --padding-xlre: 20px;
875
-
876
- /* Border radiuses */
877
- --br-12xsre: 1px;
878
- --br-2xs-2re: 10.2px;
879
- --br-mid-4re: 17.4px;
880
- --br-5xsre: 8px;
881
- --br-31xlre: 50px;
882
- --br-13xlre: 32px;
883
- --br-3xs-6re: 9.6px;
884
- }
885
-
886
- .containernofoundsearchrecientes{
887
- width: 100%;
888
- height: 38px;
889
- display: inline-block;
890
- margin: 0 auto;
891
- }
892
- .text-containernofoundsearchrecientes{
893
- font-size: 13px;
894
- text-align: center;
895
- color: rgb(176, 176, 176);
896
- line-height: 16px;
897
- }
898
- .btn-delete-filters{
899
- width: 70%;
900
- height: 26px;
901
- border-radius: 16px;
902
- font-size: 14px;
903
- text-align: center;
904
- background: rgba(255, 255, 255, 0.2);
905
- color: white;
906
- margin: 0 auto;
907
- line-height: 26px;
908
- margin-top: 5px;
909
- }
910
- .btn-delete-filters:hover{
911
- cursor: pointer;
912
- background: rgba(255, 255, 255, 0.5);
913
- }
914
- .btndeletefilters{
915
- width: 70%;
916
- height: 26px;
917
- border-radius: 16px;
918
- font-size: 14px;
919
- text-align: center;
920
- background: rgba(255, 255, 255, 0.2);
921
- color: white;
922
- margin: 0 auto;
923
- line-height: 26px;
924
- margin-top: 5px;
925
- }
926
- .btndeletefilters:hover{
927
- cursor: pointer;
928
- background: rgba(255, 255, 255, 0.5);
929
- }
930
- .leyenddeleteshow{
931
- font-size: 13px;
932
- text-align: center;
933
- color: rgb(176, 176, 176);
934
- line-height: 16px;
1283
+ /* fonts */
1284
+ --font-poppinsre: Poppins;
1285
+ --font-interre: Inter;
1286
+
1287
+ /* font sizes */
1288
+ --font-size-4xsre: 9px;
1289
+ --font-size-smre: 14px;
1290
+ --font-size-xsre: 12px;
1291
+ --font-size-base-2re: 15.2px;
1292
+ --font-size-3xsre: 10px;
1293
+ --font-size-2xsre: 11px;
1294
+
1295
+ /* Colors */
1296
+ --color-gray-100re: #172632;
1297
+ --color-gray-200re: #172531;
1298
+ --color-gray-300re: rgba(255, 255, 255, 0.05);
1299
+ --color-gray-400re: rgba(255, 255, 255, 0.2);
1300
+ --color-gray-500re: rgba(255, 255, 255, 0.3);
1301
+ --color-gray-600re: rgba(255, 255, 255, 0.1);
1302
+ --color-gray-700re: rgba(255, 255, 255, 0.7);
1303
+ --color-goldenrodre: #f7c330;
1304
+ --color-redre: #ff0000;
1305
+ --color-yellowgreen-100re: #cbed6e;
1306
+ --color-yellowgreen-200re: #cbee6b;
1307
+ --color-white: #fff;
1308
+ --color-whitesmokere: #f4f4f4;
1309
+ --color-darkbluere: #0234c5;
1310
+ --color-darkslategrayre: #1e2b36;
1311
+ --color-slategrayre: #56637b;
1312
+
1313
+ /* Spacing */
1314
+ --sizes-round-corner-round-corner-32re: 32px;
1315
+ --sizes-spacing-space-24re: 24px;
1316
+
1317
+ /* Gaps */
1318
+ --gap-basere: 16px;
1319
+ --gap-xsre: 12px;
1320
+ --gap-40xlre: 59px;
1321
+ --gap-3xsre: 10px;
1322
+ --gap-4xsre: 9px;
1323
+ --gap-midre: 17px;
1324
+ --gap-minire: 15px;
1325
+ --gap-8xsre: 5px;
1326
+ --gap-4xs-7re: 8.7px;
1327
+ --gap-11xlre: 30px;
1328
+
1329
+ /* Paddings */
1330
+ --padding-basere: 16px;
1331
+ --padding-5xlre: 24px;
1332
+ --padding-9xsre: 4px;
1333
+ --padding-6xs-5re: 6.5px;
1334
+ --padding-mid-4re: 17.4px;
1335
+ --padding-11xsre: 2px;
1336
+ --padding-3xsre: 10px;
1337
+ --padding-5xsre: 8px;
1338
+ --padding-xsre: 12px;
1339
+ --padding-xlre: 20px;
1340
+
1341
+ /* Border radiuses */
1342
+ --br-12xsre: 1px;
1343
+ --br-2xs-2re: 10.2px;
1344
+ --br-mid-4re: 17.4px;
1345
+ --br-5xsre: 8px;
1346
+ --br-31xlre: 50px;
1347
+ --br-13xlre: 32px;
1348
+ --br-3xs-6re: 9.6px;
1349
+ }
1350
+
1351
+ .containernofoundsearchrecientes {
1352
+ width: 100%;
1353
+ height: 38px;
1354
+ display: inline-block;
1355
+ margin: 0 auto;
1356
+ }
1357
+ .text-containernofoundsearchrecientes {
1358
+ font-size: 13px;
1359
+ text-align: center;
1360
+ color: rgb(176, 176, 176);
1361
+ line-height: 16px;
1362
+ }
1363
+ .btn-delete-filters {
1364
+ width: 70%;
1365
+ height: 26px;
1366
+ border-radius: 16px;
1367
+ font-size: 14px;
1368
+ text-align: center;
1369
+ background: rgba(255, 255, 255, 0.2);
1370
+ color: white;
1371
+ margin: 0 auto;
1372
+ line-height: 26px;
1373
+ margin-top: 5px;
1374
+ }
1375
+ .btn-delete-filters:hover {
1376
+ cursor: pointer;
1377
+ background: rgba(255, 255, 255, 0.5);
1378
+ }
1379
+ .btndeletefilters {
1380
+ width: 70%;
1381
+ height: 26px;
1382
+ border-radius: 16px;
1383
+ font-size: 14px;
1384
+ text-align: center;
1385
+ background: rgba(255, 255, 255, 0.2);
1386
+ color: white;
1387
+ margin: 0 auto;
1388
+ line-height: 26px;
1389
+ margin-top: 5px;
1390
+ }
1391
+ .btndeletefilters:hover {
1392
+ cursor: pointer;
1393
+ background: rgba(255, 255, 255, 0.5);
1394
+ }
1395
+ .leyenddeleteshow {
1396
+ font-size: 13px;
1397
+ text-align: center;
1398
+ color: rgb(176, 176, 176);
1399
+ line-height: 16px;
935
1400
  }
936
1401
 
937
1402
  .selectoritem {
938
- width: 270px;
939
- display: flex;
940
- flex-direction: row;
941
- align-items: flex-start;
942
- justify-content: center;
943
- gap: var(--gap-midre);
1403
+ width: 270px;
1404
+ display: flex;
1405
+ flex-direction: row;
1406
+ align-items: flex-start;
1407
+ justify-content: center;
1408
+ gap: var(--gap-midre);
944
1409
  }
945
1410
 
946
1411
  .anNoEstn {
947
- font-weight: 500;
1412
+ font-weight: 500;
948
1413
  }
949
1414
 
950
1415
  .groupsLeague {
951
- position: relative;
952
- line-height: 20px;
1416
+ position: relative;
1417
+ line-height: 20px;
953
1418
  }
954
1419
 
955
1420
  .historicas {
956
- position: relative;
957
- line-height: 20px;
958
- opacity: 0.6;
1421
+ position: relative;
1422
+ line-height: 20px;
1423
+ opacity: 0.6;
959
1424
  }
960
1425
 
961
1426
  .switchOption {
962
- border-radius: var(--br-13xlre);
963
- width: 109px;
964
- display: flex;
965
- flex-direction: row;
966
- align-items: center;
967
- justify-content: center;
968
- padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
969
- box-sizing: border-box;
1427
+ border-radius: var(--br-13xlre);
1428
+ width: 109px;
1429
+ display: flex;
1430
+ flex-direction: row;
1431
+ align-items: center;
1432
+ justify-content: center;
1433
+ padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
1434
+ box-sizing: border-box;
970
1435
  }
971
1436
 
972
1437
  .recientes {
973
- position: relative;
974
- line-height: 20px;
975
- font-weight: 600;
1438
+ position: relative;
1439
+ line-height: 20px;
1440
+ font-weight: 600;
976
1441
  }
977
1442
 
978
1443
  .switchOption1 {
979
- border-radius: var(--br-13xlre);
980
- background-color: var(--color-darkslategrayre);
981
- border: 0.8px solid var(--color-yellowgreen-200re);
982
- box-sizing: border-box;
983
- width: 107.8px;
984
- display: flex;
985
- flex-direction: row;
986
- align-items: center;
987
- justify-content: center;
988
- padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
1444
+ border-radius: var(--br-13xlre);
1445
+ background-color: var(--color-darkslategrayre);
1446
+ border: 0.8px solid var(--color-yellowgreen-200re);
1447
+ box-sizing: border-box;
1448
+ width: 107.8px;
1449
+ display: flex;
1450
+ flex-direction: row;
1451
+ align-items: center;
1452
+ justify-content: center;
1453
+ padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
989
1454
  }
990
1455
 
991
1456
  .switchOption2 {
992
- border-radius: var(--sizes-round-corner-round-corner-32re);
993
- display: flex;
994
- flex-direction: row;
995
- align-items: center;
996
- justify-content: center;
997
- padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
1457
+ border-radius: var(--sizes-round-corner-round-corner-32re);
1458
+ display: flex;
1459
+ flex-direction: row;
1460
+ align-items: center;
1461
+ justify-content: center;
1462
+ padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
998
1463
  }
999
1464
 
1000
1465
  .switchStatesBig {
1001
- border-radius: var(--sizes-round-corner-round-corner-32re);
1002
- background-color: var(--color-gray-100re);
1003
- border: 1px solid var(--color-gray-500re);
1004
- display: inline-block;
1005
- width: 320px;
1006
- font-size: var(--font-size-xsre);
1007
- color: var(--color-white);
1466
+ border-radius: var(--sizes-round-corner-round-corner-32re);
1467
+ background-color: var(--color-gray-100re);
1468
+ border: 1px solid var(--color-gray-500re);
1469
+ display: inline-block;
1470
+ width: 320px;
1471
+ font-size: var(--font-size-xsre);
1472
+ color: var(--color-white);
1008
1473
  }
1009
1474
 
1010
1475
  .groupsLeagueParent {
1011
- align-self: stretch;
1012
- display: flex;
1013
- flex-direction: column;
1014
- align-items: center;
1015
- justify-content: flex-start;
1016
- gap: var(--gap-11xlre);
1017
- text-align: center;
1476
+ align-self: stretch;
1477
+ display: flex;
1478
+ flex-direction: column;
1479
+ align-items: center;
1480
+ justify-content: flex-start;
1481
+ gap: var(--gap-11xlre);
1482
+ text-align: center;
1018
1483
  }
1019
1484
 
1020
1485
  .imgHomeTeamIcon {
1021
- position: relative;
1022
- width: 28px;
1023
- height: 28px;
1024
- object-fit: cover;
1486
+ position: relative;
1487
+ width: 28px;
1488
+ height: 28px;
1489
+ object-fit: cover;
1025
1490
  }
1026
1491
 
1027
1492
  .imgHomeTeamWrapper {
1028
- border-radius: var(--br-31xlre);
1029
- background-color: var(--color-gray-200re);
1030
- width: 40px;
1031
- height: 40px;
1032
- display: flex;
1033
- flex-direction: column;
1034
- align-items: center;
1035
- justify-content: center;
1036
- padding: var(--padding-3xsre);
1037
- box-sizing: border-box;
1493
+ border-radius: var(--br-31xlre);
1494
+ background-color: var(--color-gray-200re);
1495
+ width: 40px;
1496
+ height: 40px;
1497
+ display: flex;
1498
+ flex-direction: column;
1499
+ align-items: center;
1500
+ justify-content: center;
1501
+ padding: var(--padding-3xsre);
1502
+ box-sizing: border-box;
1038
1503
  }
1039
1504
 
1040
1505
  .teamContainer {
1041
- border-radius: var(--br-31xlre);
1042
- border: 1px solid var(--color-darkbluere);
1043
- box-sizing: border-box;
1044
- width: 48px;
1045
- height: 48px;
1046
- display: flex;
1047
- flex-direction: row;
1048
- align-items: center;
1049
- justify-content: center;
1050
- padding: var(--padding-3xsre);
1506
+ border-radius: var(--br-31xlre);
1507
+ border: 1px solid var(--color-darkbluere);
1508
+ box-sizing: border-box;
1509
+ width: 48px;
1510
+ height: 48px;
1511
+ display: flex;
1512
+ flex-direction: row;
1513
+ align-items: center;
1514
+ justify-content: center;
1515
+ padding: var(--padding-3xsre);
1051
1516
  }
1052
1517
 
1053
1518
  .name {
1054
- position: relative;
1055
- letter-spacing: 0.31px;
1056
- line-height: 30.87px;
1057
- font-weight: 500;
1519
+ position: relative;
1520
+ letter-spacing: 0.31px;
1521
+ line-height: 30.87px;
1522
+ font-weight: 500;
1058
1523
  }
1059
1524
 
1060
1525
  .homeTeamContainer {
1061
- flex: 1;
1062
- border-bottom: 1px solid var(--color-slategrayre);
1063
- display: flex;
1064
- flex-direction: row;
1065
- align-items: center;
1066
- justify-content: flex-start;
1067
- padding: 0px 0px var(--padding-xlre);
1068
- gap: var(--gap-3xsre);
1526
+ flex: 1;
1527
+ border-bottom: 1px solid var(--color-slategrayre);
1528
+ display: flex;
1529
+ flex-direction: row;
1530
+ align-items: center;
1531
+ justify-content: flex-start;
1532
+ padding: 0px 0px var(--padding-xlre);
1533
+ gap: var(--gap-3xsre);
1069
1534
  }
1070
1535
 
1071
1536
  .div {
1072
- position: relative;
1073
- font-weight: 600;
1537
+ position: relative;
1538
+ font-weight: 600;
1074
1539
  }
1075
1540
 
1076
1541
  .scoreContainer {
1077
- border-radius: var(--br-mid-4re);
1078
- background-color: var(--color-gray-600re);
1079
- display: flex;
1080
- flex-direction: row;
1081
- align-items: center;
1082
- justify-content: center;
1083
- padding: 6.524074554443359px 17.397533416748047px;
1084
- gap: var(--gap-4xs-7rere);
1542
+ border-radius: var(--br-mid-4re);
1543
+ background-color: var(--color-gray-600re);
1544
+ display: flex;
1545
+ flex-direction: row;
1546
+ align-items: center;
1547
+ justify-content: center;
1548
+ padding: 6.524074554443359px 17.397533416748047px;
1549
+ gap: var(--gap-4xs-7rere);
1085
1550
  }
1086
1551
 
1087
1552
  .scoreContainerWrapper {
1088
- align-self: stretch;
1089
- width: 323px;
1090
- display: flex;
1091
- flex-direction: column;
1092
- align-items: center;
1093
- justify-content: space-between;
1094
- text-align: center;
1095
- font-size: 15.22px;
1096
- color: var(--color-white);
1097
- font-family: var(--font-interre);
1553
+ align-self: stretch;
1554
+ width: 323px;
1555
+ display: flex;
1556
+ flex-direction: column;
1557
+ align-items: center;
1558
+ justify-content: space-between;
1559
+ text-align: center;
1560
+ font-size: 15.22px;
1561
+ color: var(--color-white);
1562
+ font-family: var(--font-interre);
1098
1563
  }
1099
1564
 
1100
1565
  .teamContainer1 {
1101
- border-radius: var(--br-31xlre);
1102
- border: 1px solid var(--color-yellowgreen-100re);
1103
- box-sizing: border-box;
1104
- width: 48px;
1105
- height: 48px;
1106
- display: flex;
1107
- flex-direction: row;
1108
- align-items: center;
1109
- justify-content: center;
1110
- padding: var(--padding-3xsre);
1566
+ border-radius: var(--br-31xlre);
1567
+ border: 1px solid var(--color-yellowgreen-100re);
1568
+ box-sizing: border-box;
1569
+ width: 48px;
1570
+ height: 48px;
1571
+ display: flex;
1572
+ flex-direction: row;
1573
+ align-items: center;
1574
+ justify-content: center;
1575
+ padding: var(--padding-3xsre);
1111
1576
  }
1112
1577
 
1113
1578
  .awayTeamContainer {
1114
- flex: 1;
1115
- border-bottom: 1px solid var(--color-slategrayre);
1116
- display: flex;
1117
- flex-direction: row;
1118
- align-items: center;
1119
- justify-content: flex-end;
1120
- padding: 0px 0px var(--padding-xlre);
1121
- gap: var(--gap-3xsre);
1579
+ flex: 1;
1580
+ border-bottom: 1px solid var(--color-slategrayre);
1581
+ display: flex;
1582
+ flex-direction: row;
1583
+ align-items: center;
1584
+ justify-content: flex-end;
1585
+ padding: 0px 0px var(--padding-xlre);
1586
+ gap: var(--gap-3xsre);
1122
1587
  }
1123
1588
 
1124
1589
  .matchContainer {
1125
- align-self: stretch;
1126
- display: flex;
1127
- flex-direction: row;
1128
- align-items: center;
1129
- justify-content: space-between;
1130
- padding: 0px 0px var(--padding-xsre);
1131
- color: var(--color-whitesmokere);
1590
+ align-self: stretch;
1591
+ display: flex;
1592
+ flex-direction: row;
1593
+ align-items: center;
1594
+ justify-content: space-between;
1595
+ padding: 0px 0px var(--padding-xsre);
1596
+ color: var(--color-whitesmokere);
1132
1597
  }
1133
1598
 
1134
1599
  .sliderMatchesChild {
1135
- position: relative;
1136
- border-radius: 9.55px;
1137
- width: 7.02px;
1138
- height: 14.23px;
1600
+ position: relative;
1601
+ border-radius: 9.55px;
1602
+ width: 7.02px;
1603
+ height: 14.23px;
1139
1604
  }
1140
1605
 
1141
1606
  .manchesterUnited {
1142
- position: relative;
1143
- letter-spacing: -0.01em;
1144
- line-height: 20.07px;
1145
- font-weight: 500;
1607
+ position: relative;
1608
+ letter-spacing: -0.01em;
1609
+ line-height: 20.07px;
1610
+ font-weight: 500;
1146
1611
  }
1147
1612
 
1148
1613
  .sliderMatchesItem {
1149
- position: relative;
1150
- border-radius: 9.55px;
1151
- width: 7.02px;
1152
- height: 14.24px;
1614
+ position: relative;
1615
+ border-radius: 9.55px;
1616
+ width: 7.02px;
1617
+ height: 14.24px;
1153
1618
  }
1154
1619
 
1155
1620
  .sliderMatches {
1156
- align-self: stretch;
1157
- display: flex;
1158
- flex-direction: row;
1159
- align-items: center;
1160
- justify-content: center;
1161
- padding: var(--padding-11xsre) var(--padding-basere);
1162
- gap: var(--gap-3xsre);
1163
- text-align: center;
1621
+ align-self: stretch;
1622
+ display: flex;
1623
+ flex-direction: row;
1624
+ align-items: center;
1625
+ justify-content: center;
1626
+ padding: var(--padding-11xsre) var(--padding-basere);
1627
+ gap: var(--gap-3xsre);
1628
+ text-align: center;
1164
1629
  }
1165
1630
 
1166
1631
  .sortIcon {
1167
- position: relative;
1168
- width: 18px;
1169
- height: 18px;
1170
- overflow: hidden;
1171
- flex-shrink: 0;
1632
+ position: relative;
1633
+ width: 18px;
1634
+ height: 18px;
1635
+ overflow: hidden;
1636
+ flex-shrink: 0;
1172
1637
  }
1173
1638
 
1174
1639
  .filtros {
1175
- position: relative;
1176
- font-size: var(--font-size-smre);
1177
- line-height: 24px;
1178
- font-family: var(--font-poppinsre);
1179
- color: var(--color-white);
1180
- text-align: left;
1640
+ position: relative;
1641
+ font-size: var(--font-size-smre);
1642
+ line-height: 24px;
1643
+ font-family: var(--font-poppinsre);
1644
+ color: var(--color-white);
1645
+ text-align: left;
1181
1646
  }
1182
1647
 
1183
1648
  .sortParent {
1184
- display: flex;
1185
- flex-direction: row;
1186
- align-items: center;
1187
- justify-content: center;
1188
- gap: var(--gap-8xsre);
1649
+ display: flex;
1650
+ flex-direction: row;
1651
+ align-items: center;
1652
+ justify-content: center;
1653
+ gap: var(--gap-8xsre);
1189
1654
  }
1190
1655
 
1191
1656
  .shapeIcon {
1192
- position: relative;
1193
- width: 8px;
1194
- height: 4px;
1657
+ position: relative;
1658
+ width: 8px;
1659
+ height: 4px;
1195
1660
  }
1196
1661
 
1197
1662
  .btnFilter {
1198
- cursor: pointer;
1199
- border: 1px solid var(--color-gray-400re);
1200
- padding: var(--padding-5xsre) var(--padding-3xsre);
1201
- background-color: var(--color-gray-300re);
1202
- border-radius: var(--br-5xsre);
1203
- box-sizing: border-box;
1204
- width: 102px;
1205
- height: 32px;
1206
- position: relative;
1207
- display: flex;
1208
- flex-direction: row;
1209
- align-items: center;
1210
- justify-content: space-between;
1663
+ cursor: pointer;
1664
+ border: 1px solid var(--color-gray-400re);
1665
+ padding: var(--padding-5xsre) var(--padding-3xsre);
1666
+ background-color: var(--color-gray-300re);
1667
+ border-radius: var(--br-5xsre);
1668
+ box-sizing: border-box;
1669
+ width: 102px;
1670
+ height: 32px;
1671
+ position: relative;
1672
+ display: flex;
1673
+ flex-direction: row;
1674
+ align-items: center;
1675
+ justify-content: space-between;
1211
1676
  }
1212
1677
 
1213
1678
  .btnFilter1 {
1214
- cursor: pointer;
1215
- border: 1px solid var(--color-gray-400re);
1216
- background-color: var(--color-gray-300re);
1217
- border-radius: var(--br-5xsre);
1218
- box-sizing: border-box;
1219
- height: 32px;
1220
- display: flex;
1221
- flex-direction: row;
1222
- align-items: baseline;
1223
- justify-content: flex-start;
1224
- gap: var(--gap-3xsre);
1225
- font-size: 10px;
1679
+ cursor: pointer;
1680
+ border: 1px solid var(--color-gray-400re);
1681
+ background-color: var(--color-gray-300re);
1682
+ border-radius: var(--br-5xsre);
1683
+ box-sizing: border-box;
1684
+ height: 32px;
1685
+ display: flex;
1686
+ flex-direction: row;
1687
+ align-items: baseline;
1688
+ justify-content: flex-start;
1689
+ gap: var(--gap-3xsre);
1690
+ font-size: 10px;
1226
1691
  }
1227
1692
 
1228
1693
  .btnFilterParent {
1229
- width: 225px;
1230
- display: flex;
1231
- flex-direction: row;
1232
- align-items: flex-start;
1233
- justify-content: flex-start;
1234
- gap: var(--gap-xsre);
1694
+ width: 225px;
1695
+ display: flex;
1696
+ flex-direction: row;
1697
+ align-items: flex-start;
1698
+ justify-content: flex-start;
1699
+ gap: var(--gap-xsre);
1235
1700
  }
1236
1701
 
1237
1702
  .backArrowIcon {
1238
- position: relative;
1239
- border-radius: 10.21px;
1240
- width: 7.5px;
1241
- height: 15.21px;
1703
+ position: relative;
1704
+ border-radius: 10.21px;
1705
+ width: 7.5px;
1706
+ height: 15.21px;
1242
1707
  }
1243
1708
 
1244
1709
  .teamContainer2 {
1245
- display: flex;
1246
- flex-direction: row;
1247
- align-items: center;
1248
- justify-content: flex-start;
1249
- gap: var(--gap-8xsre);
1710
+ display: flex;
1711
+ flex-direction: row;
1712
+ align-items: center;
1713
+ justify-content: flex-start;
1714
+ gap: var(--gap-8xsre);
1250
1715
  }
1251
1716
 
1252
1717
  .homeTeam {
1253
- display: flex;
1254
- flex-direction: row;
1255
- align-items: center;
1256
- justify-content: flex-start;
1257
- gap: var(--gap-minire);
1718
+ display: flex;
1719
+ flex-direction: row;
1720
+ align-items: center;
1721
+ justify-content: flex-start;
1722
+ gap: var(--gap-minire);
1258
1723
  }
1259
1724
 
1260
1725
  .div4 {
1261
- flex: 1;
1262
- position: relative;
1263
- font-weight: 600;
1726
+ flex: 1;
1727
+ position: relative;
1728
+ font-weight: 600;
1264
1729
  }
1265
1730
 
1266
1731
  .finalScore {
1267
- border-radius: var(--br-mid-4re);
1268
- background-color: var(--color-gray-600re);
1269
- border: 0.5px solid var(--color-yellowgreen-200re);
1270
- box-sizing: border-box;
1271
- width: 70.73px;
1272
- display: flex;
1273
- flex-direction: row;
1274
- align-items: center;
1275
- justify-content: center;
1276
- padding: 6.524074554443359px 17.397533416748047px;
1277
- gap: var(--gap-4xs-7rere);
1732
+ border-radius: var(--br-mid-4re);
1733
+ background-color: var(--color-gray-600re);
1734
+ border: 0.5px solid var(--color-yellowgreen-200re);
1735
+ box-sizing: border-box;
1736
+ width: 70.73px;
1737
+ display: flex;
1738
+ flex-direction: row;
1739
+ align-items: center;
1740
+ justify-content: center;
1741
+ padding: 6.524074554443359px 17.397533416748047px;
1742
+ gap: var(--gap-4xs-7rere);
1278
1743
  }
1279
1744
 
1280
1745
  .manchesterUnited1 {
1281
- position: relative;
1282
- font-size: var(--font-size-xsre);
1283
- font-weight: 500;
1284
- font-family: var(--font-poppinsre);
1285
- color: var(--color-gray-700re);
1746
+ position: relative;
1747
+ font-size: var(--font-size-xsre);
1748
+ font-weight: 500;
1749
+ font-family: var(--font-poppinsre);
1750
+ color: var(--color-gray-700re);
1286
1751
  }
1287
1752
 
1288
1753
  .scoreContainer1 {
1289
- display: flex;
1290
- flex-direction: column;
1291
- align-items: center;
1292
- justify-content: center;
1293
- gap: var(--gap-4xsre);
1294
- text-align: center;
1295
- font-size: 15.22px;
1296
- color: var(--color-white);
1297
- font-family: var(--font-interre);
1754
+ display: flex;
1755
+ flex-direction: column;
1756
+ align-items: center;
1757
+ justify-content: center;
1758
+ gap: var(--gap-4xsre);
1759
+ text-align: center;
1760
+ font-size: 15.22px;
1761
+ color: var(--color-white);
1762
+ font-family: var(--font-interre);
1298
1763
  }
1299
1764
 
1300
1765
  .match {
1301
- width: 325px;
1302
- display: inline-block;
1766
+ width: 325px;
1767
+ display: inline-block;
1303
1768
  }
1304
1769
 
1305
1770
  .manchesterUnited2 {
1306
- position: relative;
1307
- text-decoration: underline;
1308
- font-weight: 500;
1309
- position: absolute;
1310
- right: 0;
1311
- cursor: pointer;
1771
+ position: relative;
1772
+ text-decoration: underline;
1773
+ font-weight: 500;
1774
+ position: absolute;
1775
+ right: 0;
1776
+ cursor: pointer;
1312
1777
  }
1313
1778
 
1314
1779
  .manchesterUnited2:hover {
1315
- color: rgba(255, 255, 255, 1);
1780
+ color: rgba(255, 255, 255, 1);
1316
1781
  }
1317
1782
 
1318
1783
  .btnDetails {
1319
- width: 225px;
1320
- height: 28px;
1321
- display: flex;
1322
- flex-direction: row;
1323
- align-items: center;
1324
- justify-content: flex-end;
1325
- text-align: right;
1326
- font-size: var(--font-size-xsre);
1784
+ width: 225px;
1785
+ height: 28px;
1786
+ display: flex;
1787
+ flex-direction: row;
1788
+ align-items: center;
1789
+ justify-content: flex-end;
1790
+ text-align: right;
1791
+ font-size: var(--font-size-xsre);
1327
1792
  }
1328
1793
 
1329
-
1330
1794
  .matchContainer1 {
1331
- align-self: stretch;
1332
- display: flex;
1333
- flex-direction: row;
1334
- align-items: flex-start;
1335
- justify-content: space-between;
1336
- padding: var(--padding-9xsre) 0px 0px;
1795
+ align-self: stretch;
1796
+ display: flex;
1797
+ flex-direction: row;
1798
+ align-items: flex-start;
1799
+ justify-content: space-between;
1800
+ padding: var(--padding-9xsre) 0px 0px;
1337
1801
  }
1338
1802
 
1339
1803
  .goalChild {
1340
- position: relative;
1341
- width: 8.03px;
1342
- height: 8.03px;
1804
+ position: relative;
1805
+ width: 8.03px;
1806
+ height: 8.03px;
1343
1807
  }
1344
1808
 
1345
1809
  .goal {
1346
- width: 9px;
1347
- height: 9px;
1348
- display: flex;
1349
- flex-direction: row;
1350
- align-items: center;
1351
- justify-content: center;
1810
+ width: 9px;
1811
+ height: 9px;
1812
+ display: flex;
1813
+ flex-direction: row;
1814
+ align-items: center;
1815
+ justify-content: center;
1352
1816
  }
1353
1817
 
1354
1818
  .manchesterUnited3 {
1355
- position: relative;
1356
- letter-spacing: -0.01em;
1357
- line-height: 19.5px;
1358
- text-transform: capitalize;
1359
- font-weight: 500;
1819
+ position: relative;
1820
+ letter-spacing: -0.01em;
1821
+ line-height: 19.5px;
1822
+ text-transform: capitalize;
1823
+ font-weight: 500;
1360
1824
  }
1361
1825
 
1362
1826
  .minuteEvent {
1363
- display: flex;
1364
- flex-direction: row;
1365
- align-items: center;
1366
- justify-content: flex-start;
1367
- gap: var(--gap-4xsre);
1827
+ display: flex;
1828
+ flex-direction: row;
1829
+ align-items: center;
1830
+ justify-content: flex-start;
1831
+ gap: var(--gap-4xsre);
1368
1832
  }
1369
1833
 
1370
1834
  .yellowCard {
1371
- position: relative;
1372
- border-radius: var(--br-12xsre);
1373
- background-color: var(--color-goldenrodre);
1374
- width: 4px;
1375
- height: 6px;
1835
+ position: relative;
1836
+ border-radius: var(--br-12xsre);
1837
+ background-color: var(--color-goldenrodre);
1838
+ width: 4px;
1839
+ height: 6px;
1376
1840
  }
1377
1841
 
1378
1842
  .awayTeamEvents {
1379
- display: flex;
1380
- flex-direction: column;
1381
- align-items: flex-start;
1382
- justify-content: flex-start;
1383
- gap: var(--gap-3xsre);
1843
+ display: flex;
1844
+ flex-direction: column;
1845
+ align-items: flex-start;
1846
+ justify-content: flex-start;
1847
+ gap: var(--gap-3xsre);
1384
1848
  }
1385
1849
 
1386
1850
  .rectangle {
1387
- position: relative;
1388
- border-radius: var(--br-12xsre);
1389
- background-color: var(--color-redre);
1390
- width: 4px;
1391
- height: 6px;
1851
+ position: relative;
1852
+ border-radius: var(--br-12xsre);
1853
+ background-color: var(--color-redre);
1854
+ width: 4px;
1855
+ height: 6px;
1392
1856
  }
1393
1857
 
1394
1858
  .homeTeamEvents {
1395
- display: flex;
1396
- flex-direction: column;
1397
- align-items: flex-end;
1398
- justify-content: flex-start;
1399
- gap: var(--gap-3xsre);
1400
- text-align: right;
1859
+ display: flex;
1860
+ flex-direction: column;
1861
+ align-items: flex-end;
1862
+ justify-content: flex-start;
1863
+ gap: var(--gap-3xsre);
1864
+ text-align: right;
1401
1865
  }
1402
1866
 
1403
1867
  .totalEvents {
1404
- display: none;
1405
- flex-direction: row;
1406
- align-items: center;
1407
- justify-content: flex-start;
1408
- gap: var(--gap-40xlre);
1409
- font-size: var(--font-size-4xsre);
1868
+ display: none;
1869
+ flex-direction: row;
1870
+ align-items: center;
1871
+ justify-content: flex-start;
1872
+ gap: var(--gap-40xlre);
1873
+ font-size: var(--font-size-4xsre);
1410
1874
  }
1411
1875
 
1412
1876
  .headerSeccionAlineaciones1 {
1413
- align-self: stretch;
1414
- background-color: var(--color-gray-200re);
1415
- display: flex;
1416
- flex-direction: column;
1417
- align-items: center;
1418
- justify-content: flex-start;
1419
- padding: 0px 48px;
1420
- gap: var(--gap-basere);
1877
+ align-self: stretch;
1878
+ background-color: var(--color-gray-200re);
1879
+ display: flex;
1880
+ flex-direction: column;
1881
+ align-items: center;
1882
+ justify-content: flex-start;
1883
+ padding: 0px 48px;
1884
+ gap: var(--gap-basere);
1421
1885
  }
1422
1886
 
1423
1887
  .sliderMatchesInner {
1424
- position: relative;
1425
- border-radius: 9.55px;
1426
- width: 13.39px;
1427
- height: 6px;
1888
+ position: relative;
1889
+ border-radius: 9.55px;
1890
+ width: 13.39px;
1891
+ height: 6px;
1428
1892
  }
1429
1893
 
1430
1894
  .btnFilter2 {
1431
- cursor: pointer;
1432
- border: 1px solid var(--color-gray-400re);
1433
- padding: var(--padding-5xsre) var(--padding-3xsre);
1434
- background-color: var(--color-gray-300re);
1435
- border-radius: var(--br-5xsre);
1436
- box-sizing: border-box;
1437
- width: 111px;
1438
- position: relative;
1439
- height: 32px;
1440
- display: flex;
1441
- flex-direction: row;
1442
- align-items: center;
1443
- justify-content: space-between;
1444
- margin-right: 10px;
1895
+ cursor: pointer;
1896
+ border: 1px solid var(--color-gray-400re);
1897
+ padding: var(--padding-5xsre) var(--padding-3xsre);
1898
+ background-color: var(--color-gray-300re);
1899
+ border-radius: var(--br-5xsre);
1900
+ box-sizing: border-box;
1901
+ width: 111px;
1902
+ position: relative;
1903
+ height: 32px;
1904
+ display: flex;
1905
+ flex-direction: row;
1906
+ align-items: center;
1907
+ justify-content: space-between;
1908
+ margin-right: 10px;
1445
1909
  }
1446
1910
 
1447
1911
  .btnDetails1 {
1448
- width: 111px;
1449
- height: 28px;
1450
- display: flex;
1451
- flex-direction: row;
1452
- align-items: center;
1453
- justify-content: flex-end;
1912
+ width: 111px;
1913
+ height: 28px;
1914
+ display: flex;
1915
+ flex-direction: row;
1916
+ align-items: center;
1917
+ justify-content: flex-end;
1454
1918
  }
1455
1919
 
1456
1920
  .matchContainer3 {
1457
- align-self: stretch;
1458
- display: flex;
1459
- flex-direction: row;
1460
- align-items: flex-start;
1461
- justify-content: start;
1462
- padding: var(--padding-9xsre) 0px 0px;
1463
- text-align: right;
1464
- font-size: var(--font-size-xsre);
1921
+ align-self: stretch;
1922
+ display: flex;
1923
+ flex-direction: row;
1924
+ align-items: flex-start;
1925
+ justify-content: start;
1926
+ padding: var(--padding-9xsre) 0px 0px;
1927
+ text-align: right;
1928
+ font-size: var(--font-size-xsre);
1465
1929
  }
1466
1930
 
1467
1931
  .backArrowIcon1 {
1468
- position: relative;
1469
- border-radius: 10.21px;
1470
- width: 14.31px;
1471
- height: 6.41px;
1932
+ position: relative;
1933
+ border-radius: 10.21px;
1934
+ width: 14.31px;
1935
+ height: 6.41px;
1472
1936
  }
1473
1937
 
1474
1938
  .match1 {
1475
- width: 340px;
1476
- display: inline-block;
1477
- margin: 0 auto;
1939
+ width: 340px;
1940
+ display: inline-block;
1941
+ margin: 0 auto;
1478
1942
  }
1479
1943
 
1480
1944
  .headerSeccionAlineaciones2 {
1481
- align-self: stretch;
1482
- background-color: var(--color-gray-200re);
1483
- display: none;
1484
- flex-direction: column;
1485
- align-items: center;
1486
- justify-content: flex-start;
1487
- padding: 0px var(--padding-5xlre);
1488
- gap: var(--gap-basere);
1945
+ align-self: stretch;
1946
+ background-color: var(--color-gray-200re);
1947
+ display: none;
1948
+ flex-direction: column;
1949
+ align-items: center;
1950
+ justify-content: flex-start;
1951
+ padding: 0px var(--padding-5xlre);
1952
+ gap: var(--gap-basere);
1489
1953
  }
1490
1954
 
1491
1955
  .jugadores2 {
1492
- position: relative;
1493
- line-height: 20px;
1494
- font-weight: 600;
1495
- opacity: 0.6;
1956
+ position: relative;
1957
+ line-height: 20px;
1958
+ font-weight: 600;
1959
+ opacity: 0.6;
1496
1960
  }
1497
1961
 
1498
1962
  .switchOption6 {
1499
- border-radius: var(--sizes-round-corner-round-corner-32re);
1500
- width: 74px;
1501
- display: flex;
1502
- flex-direction: row;
1503
- align-items: center;
1504
- justify-content: center;
1505
- padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
1506
- box-sizing: border-box;
1963
+ border-radius: var(--sizes-round-corner-round-corner-32re);
1964
+ width: 74px;
1965
+ display: flex;
1966
+ flex-direction: row;
1967
+ align-items: center;
1968
+ justify-content: center;
1969
+ padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
1970
+ box-sizing: border-box;
1507
1971
  }
1508
1972
 
1509
1973
  .switchOption7 {
1510
- border-radius: var(--sizes-round-corner-round-corner-32re);
1511
- background-color: var(--color-darkslategrayre);
1512
- border: 0.8px solid var(--color-yellowgreen-200re);
1513
- box-sizing: border-box;
1514
- width: 74.8px;
1515
- display: flex;
1516
- flex-direction: row;
1517
- align-items: center;
1518
- justify-content: center;
1519
- padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
1974
+ border-radius: var(--sizes-round-corner-round-corner-32re);
1975
+ background-color: var(--color-darkslategrayre);
1976
+ border: 0.8px solid var(--color-yellowgreen-200re);
1977
+ box-sizing: border-box;
1978
+ width: 74.8px;
1979
+ display: flex;
1980
+ flex-direction: row;
1981
+ align-items: center;
1982
+ justify-content: center;
1983
+ padding: var(--padding-3xsre) var(--sizes-spacing-space-24re);
1520
1984
  }
1521
1985
 
1522
1986
  .switchStatesBig2 {
1523
- border-radius: var(--sizes-round-corner-round-corner-32re);
1524
- background-color: var(--color-gray-100re);
1525
- border: 1px solid var(--color-gray-500re);
1526
- display: inline-block;
1527
- width: 280px;
1987
+ border-radius: var(--sizes-round-corner-round-corner-32re);
1988
+ background-color: var(--color-gray-100re);
1989
+ border: 1px solid var(--color-gray-500re);
1990
+ display: inline-block;
1991
+ width: 280px;
1528
1992
  }
1529
1993
 
1530
1994
  .manchesterUnited26 {
1531
- position: relative;
1532
- font-size: var(--font-size-3xsre);
1533
- font-weight: 500;
1995
+ position: relative;
1996
+ font-size: var(--font-size-3xsre);
1997
+ font-weight: 500;
1534
1998
  }
1535
1999
 
1536
2000
  .homeTeamContainer2 {
1537
- display: flex;
1538
- flex-direction: row;
1539
- align-items: center;
1540
- justify-content: flex-start;
1541
- gap: var(--gap-3xsre);
2001
+ display: flex;
2002
+ flex-direction: row;
2003
+ align-items: center;
2004
+ justify-content: flex-start;
2005
+ gap: var(--gap-3xsre);
1542
2006
  }
1543
2007
 
1544
2008
  .vectorIcon {
1545
- position: relative;
1546
- width: 15px;
1547
- height: 15px;
2009
+ position: relative;
2010
+ width: 15px;
2011
+ height: 15px;
1548
2012
  }
1549
2013
 
1550
2014
  .teamSwitch {
1551
- border-radius: 25px;
1552
- box-sizing: border-box;
1553
- width: 98px;
1554
- overflow: hidden;
1555
- height: 21px;
1556
- display: flex;
1557
- flex-direction: row;
1558
- align-items: center;
1559
- justify-content: center;
1560
- padding: 0px 3px;
2015
+ border-radius: 25px;
2016
+ box-sizing: border-box;
2017
+ width: 98px;
2018
+ overflow: hidden;
2019
+ height: 21px;
2020
+ display: flex;
2021
+ flex-direction: row;
2022
+ align-items: center;
2023
+ justify-content: center;
2024
+ padding: 0px 3px;
1561
2025
  }
1562
2026
 
1563
2027
  .matchContainer5 {
1564
- align-self: stretch;
1565
- display: flex;
1566
- flex-direction: row;
1567
- align-items: center;
1568
- justify-content: space-between;
1569
- padding: 0px 0px var(--padding-xsre);
1570
- text-align: left;
1571
- color: var(--color-whitesmokere);
2028
+ align-self: stretch;
2029
+ display: flex;
2030
+ flex-direction: row;
2031
+ align-items: center;
2032
+ justify-content: space-between;
2033
+ padding: 0px 0px var(--padding-xsre);
2034
+ text-align: left;
2035
+ color: var(--color-whitesmokere);
1572
2036
  }
1573
2037
 
1574
2038
  .manchesterUnited27 {
1575
- position: relative;
1576
- letter-spacing: -0.01em;
1577
- line-height: 20.07px;
1578
- font-weight: 500;
1579
- z-index: 0;
2039
+ position: relative;
2040
+ letter-spacing: -0.01em;
2041
+ line-height: 20.07px;
2042
+ font-weight: 500;
2043
+ z-index: 0;
1580
2044
  }
1581
2045
 
1582
2046
  .sliderMatchesChild1 {
1583
- position: absolute;
1584
- margin: 0 !important;
1585
- top: 14.31px;
1586
- left: 261.07px;
1587
- border-radius: 10.21px;
1588
- width: 14.31px;
1589
- height: 6.41px;
1590
- z-index: 1;
2047
+ position: absolute;
2048
+ margin: 0 !important;
2049
+ top: 14.31px;
2050
+ left: 261.07px;
2051
+ border-radius: 10.21px;
2052
+ width: 14.31px;
2053
+ height: 6.41px;
2054
+ z-index: 1;
1591
2055
  }
1592
2056
 
1593
2057
  .sliderMatchesChild2 {
1594
- position: absolute;
1595
- margin: 0 !important;
1596
- top: 0.31px;
1597
- left: 6.41px;
1598
- border-radius: 10.21px;
1599
- width: 14.31px;
1600
- height: 6.41px;
1601
- z-index: 2;
2058
+ position: absolute;
2059
+ margin: 0 !important;
2060
+ top: 0.31px;
2061
+ left: 6.41px;
2062
+ border-radius: 10.21px;
2063
+ width: 14.31px;
2064
+ height: 6.41px;
2065
+ z-index: 2;
1602
2066
  }
1603
2067
 
1604
2068
  .sliderMatches2 {
1605
- display: none;
1606
- flex-direction: row;
1607
- align-items: flex-start;
1608
- justify-content: flex-start;
1609
- padding: var(--padding-11xsre) var(--padding-basere);
1610
- position: relative;
1611
- gap: var(--gap-3xsre);
2069
+ display: none;
2070
+ flex-direction: row;
2071
+ align-items: flex-start;
2072
+ justify-content: flex-start;
2073
+ padding: var(--padding-11xsre) var(--padding-basere);
2074
+ position: relative;
2075
+ gap: var(--gap-3xsre);
1612
2076
  }
1613
2077
 
1614
2078
  .filtros2 {
1615
- position: relative;
1616
- font-size: var(--font-size-smre);
1617
- line-height: 24px;
1618
- font-family: var(--font-poppinsre);
1619
- color: var(--color-white);
1620
- text-align: left;
1621
- display: none;
2079
+ position: relative;
2080
+ font-size: var(--font-size-smre);
2081
+ line-height: 24px;
2082
+ font-family: var(--font-poppinsre);
2083
+ color: var(--color-white);
2084
+ text-align: left;
2085
+ display: none;
1622
2086
  }
1623
2087
 
1624
2088
  .btnFilter4 {
1625
- cursor: pointer;
1626
- position: relative;
1627
- border: 1px solid var(--color-gray-400re);
1628
- padding: var(--padding-5xsre) var(--padding-3xsre);
1629
- background-color: var(--color-gray-300re);
1630
- border-radius: var(--br-5xsre);
1631
- box-sizing: border-box;
1632
- width: 60px;
1633
- height: 32px;
1634
- display: flex;
1635
- flex-direction: row;
1636
- align-items: center;
1637
- justify-content: space-between;
2089
+ cursor: pointer;
2090
+ position: relative;
2091
+ border: 1px solid var(--color-gray-400re);
2092
+ padding: var(--padding-5xsre) var(--padding-3xsre);
2093
+ background-color: var(--color-gray-300re);
2094
+ border-radius: var(--br-5xsre);
2095
+ box-sizing: border-box;
2096
+ width: 60px;
2097
+ height: 32px;
2098
+ display: flex;
2099
+ flex-direction: row;
2100
+ align-items: center;
2101
+ justify-content: space-between;
1638
2102
  }
1639
2103
 
1640
2104
  .jornada2 {
1641
- position: relative;
1642
- line-height: 9px;
1643
- font-weight: 600;
1644
- opacity: 0.6;
2105
+ position: relative;
2106
+ line-height: 9px;
2107
+ font-weight: 600;
2108
+ opacity: 0.6;
1645
2109
  }
1646
2110
 
1647
2111
  .filterMatchday {
1648
- border-radius: 4px;
1649
- border: 1px solid var(--color-gray-500re);
1650
- box-sizing: border-box;
1651
- width: 102px;
1652
- height: 25px;
1653
- display: flex;
1654
- flex-direction: row;
1655
- justify-content: space-between;
2112
+ border-radius: 4px;
2113
+ border: 1px solid var(--color-gray-500re);
2114
+ box-sizing: border-box;
2115
+ width: 102px;
2116
+ height: 25px;
2117
+ display: flex;
2118
+ flex-direction: row;
2119
+ justify-content: space-between;
1656
2120
  }
1657
2121
 
1658
2122
  .btnDetails2 {
1659
- width: 60px;
1660
- height: 28px;
1661
- display: flex;
1662
- flex-direction: row;
1663
- align-items: center;
1664
- justify-content: center;
1665
- text-align: right;
1666
- color: var(--color-gray-700re);
2123
+ width: 60px;
2124
+ height: 28px;
2125
+ display: flex;
2126
+ flex-direction: row;
2127
+ align-items: center;
2128
+ justify-content: center;
2129
+ text-align: right;
2130
+ color: var(--color-gray-700re);
1667
2131
  }
1668
2132
 
1669
2133
  .filtersContainer {
1670
- align-self: stretch;
1671
- display: flex;
1672
- flex-direction: row;
1673
- align-items: center;
1674
- justify-content: space-between;
1675
- font-size: var(--font-size-3xsre);
1676
- color: var(--color-white);
2134
+ align-self: stretch;
2135
+ display: flex;
2136
+ flex-direction: row;
2137
+ align-items: center;
2138
+ justify-content: space-between;
2139
+ font-size: var(--font-size-3xsre);
2140
+ color: var(--color-white);
1677
2141
  }
1678
2142
 
1679
2143
  .matchContainer6 {
1680
- align-self: stretch;
1681
- display: flex;
1682
- flex-direction: row;
1683
- align-items: flex-start;
1684
- justify-content: center;
1685
- padding: var(--padding-9xsre) 0px 0px;
2144
+ align-self: stretch;
2145
+ display: flex;
2146
+ flex-direction: row;
2147
+ align-items: flex-start;
2148
+ justify-content: center;
2149
+ padding: var(--padding-9xsre) 0px 0px;
1686
2150
  }
1687
2151
 
1688
2152
  .matchDetailContainer {
1689
- align-self: stretch;
1690
- display: flex;
1691
- flex-direction: column;
1692
- align-items: center;
1693
- justify-content: flex-start;
1694
- gap: 14px;
1695
- text-align: left;
2153
+ align-self: stretch;
2154
+ display: flex;
2155
+ flex-direction: column;
2156
+ align-items: center;
2157
+ justify-content: flex-start;
2158
+ gap: 14px;
2159
+ text-align: left;
1696
2160
  }
1697
2161
 
1698
2162
  .containerData {
1699
- align-self: stretch;
1700
- border-radius: 9px;
1701
- background-color: #192632;
1702
- box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
1703
- display: flex;
1704
- flex-direction: column;
1705
- align-items: center;
1706
- justify-content: flex-start;
1707
- padding: var(--padding-basere) var(--padding-5xlre) 32px;
1708
- gap: var(--gap-xsre);
1709
- font-size: var(--font-size-smre);
1710
- color: var(--color-gray-700re);
2163
+ align-self: stretch;
2164
+ border-radius: 9px;
2165
+ background-color: #192632;
2166
+ box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
2167
+ display: flex;
2168
+ flex-direction: column;
2169
+ align-items: center;
2170
+ justify-content: flex-start;
2171
+ padding: var(--padding-basere) var(--padding-5xlre) 32px;
2172
+ gap: var(--gap-xsre);
2173
+ font-size: var(--font-size-smre);
2174
+ color: var(--color-gray-700re);
1711
2175
  }
1712
2176
 
1713
2177
  .headerSeccionAlineaciones3 {
1714
- align-self: stretch;
1715
- display: none;
1716
- flex-direction: column;
1717
- align-items: center;
1718
- justify-content: flex-start;
1719
- gap: var(--gap-basere);
1720
- text-align: center;
1721
- font-size: var(--font-size-2xsre);
1722
- color: var(--color-white);
2178
+ align-self: stretch;
2179
+ display: none;
2180
+ flex-direction: column;
2181
+ align-items: center;
2182
+ justify-content: flex-start;
2183
+ gap: var(--gap-basere);
2184
+ text-align: center;
2185
+ font-size: var(--font-size-2xsre);
2186
+ color: var(--color-white);
1723
2187
  }
1724
2188
 
1725
2189
  .headerSeccionAlineaciones {
1726
- position: relative;
1727
- width: 100%;
1728
- display: flex;
1729
- flex-direction: column;
1730
- align-items: flex-start;
1731
- justify-content: flex-start;
1732
- gap: 132px;
1733
- text-align: left;
1734
- font-size: var(--font-size-smre);
1735
- color: var(--color-gray-700re);
1736
- font-family: var(--font-poppinsre);
2190
+ position: relative;
2191
+ width: 100%;
2192
+ display: flex;
2193
+ flex-direction: column;
2194
+ align-items: flex-start;
2195
+ justify-content: flex-start;
2196
+ gap: 132px;
2197
+ text-align: left;
2198
+ font-size: var(--font-size-smre);
2199
+ color: var(--color-gray-700re);
2200
+ font-family: var(--font-poppinsre);
1737
2201
  }
1738
2202
 
1739
2203
  .headerSeccionAlineaciones31200 {
1740
- max-width: 540px;
1741
- align-self: stretch;
1742
- display: none;
1743
- flex-direction: column;
1744
- align-items: center;
1745
- justify-content: flex-start;
1746
- gap: var(--gap-basere);
1747
- text-align: center;
1748
- font-size: var(--font-size-2xsre);
1749
- color: var(--color-white);
2204
+ max-width: 540px;
2205
+ align-self: stretch;
2206
+ display: none;
2207
+ flex-direction: column;
2208
+ align-items: center;
2209
+ justify-content: flex-start;
2210
+ gap: var(--gap-basere);
2211
+ text-align: center;
2212
+ font-size: var(--font-size-2xsre);
2213
+ color: var(--color-white);
1750
2214
  }
1751
2215
 
1752
2216
  .headerSeccionAlineaciones3420 {
1753
- display: flex;
1754
- max-width: 540px;
1755
- align-self: stretch;
1756
- flex-direction: column;
1757
- align-items: center;
1758
- justify-content: flex-start;
1759
- gap: var(--gap-basere);
1760
- text-align: center;
1761
- font-size: var(--font-size-2xsre);
1762
- color: var(--color-white);
2217
+ display: flex;
2218
+ max-width: 540px;
2219
+ align-self: stretch;
2220
+ flex-direction: column;
2221
+ align-items: center;
2222
+ justify-content: flex-start;
2223
+ gap: var(--gap-basere);
2224
+ text-align: center;
2225
+ font-size: var(--font-size-2xsre);
2226
+ color: var(--color-white);
1763
2227
  }
1764
2228
 
1765
2229
  .headerSeccionAlineaciones3880 {
1766
- display: none;
1767
- align-self: stretch;
1768
- flex-direction: column;
1769
- align-items: center;
1770
- justify-content: flex-start;
1771
- gap: var(--gap-basere);
1772
- text-align: center;
1773
- font-size: var(--font-size-2xsre);
1774
- color: var(--color-white);
2230
+ display: none;
2231
+ align-self: stretch;
2232
+ flex-direction: column;
2233
+ align-items: center;
2234
+ justify-content: flex-start;
2235
+ gap: var(--gap-basere);
2236
+ text-align: center;
2237
+ font-size: var(--font-size-2xsre);
2238
+ color: var(--color-white);
1775
2239
  }
1776
2240
 
1777
2241
  .headerSeccionAlineaciones3540 {
1778
- display: flex;
1779
- min-width: 300px;
1780
- align-self: stretch;
1781
- flex-direction: column;
1782
- align-items: center;
1783
- justify-content: flex-start;
1784
- gap: var(--gap-basere);
1785
- text-align: center;
1786
- font-size: var(--font-size-2xsre);
1787
- color: var(--color-white);
2242
+ display: flex;
2243
+ min-width: 300px;
2244
+ align-self: stretch;
2245
+ flex-direction: column;
2246
+ align-items: center;
2247
+ justify-content: flex-start;
2248
+ gap: var(--gap-basere);
2249
+ text-align: center;
2250
+ font-size: var(--font-size-2xsre);
2251
+ color: var(--color-white);
1788
2252
  }
1789
2253
 
1790
2254
  .headerSeccionAlineaciones11200 {
1791
- align-self: stretch;
1792
- width: auto;
1793
- max-width: 1089px;
1794
- align-self: stretch;
1795
- background-color: var(--color-gray-200re);
1796
- display: flex;
1797
- flex-direction: column;
1798
- align-items: center;
1799
- justify-content: flex-start;
1800
- padding: 0px 48px;
1801
- gap: var(--gap-basere);
2255
+ align-self: stretch;
2256
+ width: auto;
2257
+ max-width: 1089px;
2258
+ align-self: stretch;
2259
+ background-color: var(--color-gray-200re);
2260
+ display: flex;
2261
+ flex-direction: column;
2262
+ align-items: center;
2263
+ justify-content: flex-start;
2264
+ padding: 0px 48px;
2265
+ gap: var(--gap-basere);
1802
2266
  }
1803
2267
 
1804
2268
  .headerSeccionAlineaciones1420 {
1805
- display: none;
1806
- align-self: stretch;
1807
- background-color: var(--color-gray-200re);
1808
- flex-direction: column;
1809
- align-items: center;
1810
- justify-content: flex-start;
1811
- padding: 0px 48px;
1812
- gap: var(--gap-basere);
2269
+ display: none;
2270
+ align-self: stretch;
2271
+ background-color: var(--color-gray-200re);
2272
+ flex-direction: column;
2273
+ align-items: center;
2274
+ justify-content: flex-start;
2275
+ padding: 0px 48px;
2276
+ gap: var(--gap-basere);
1813
2277
  }
1814
2278
 
1815
2279
  .headerSeccionAlineaciones1880 {
1816
- display: none;
1817
- align-self: stretch;
1818
- background-color: var(--color-gray-200re);
1819
- flex-direction: column;
1820
- align-items: center;
1821
- justify-content: flex-start;
1822
- padding: 0px 48px;
1823
- gap: var(--gap-basere);
2280
+ display: none;
2281
+ align-self: stretch;
2282
+ background-color: var(--color-gray-200re);
2283
+ flex-direction: column;
2284
+ align-items: center;
2285
+ justify-content: flex-start;
2286
+ padding: 0px 48px;
2287
+ gap: var(--gap-basere);
1824
2288
  }
1825
2289
 
1826
2290
  .headerSeccionAlineaciones21200 {
1827
- display: none;
1828
- align-self: stretch;
1829
- width: auto;
1830
- max-width: 840px;
1831
- align-self: stretch;
1832
- background-color: var(--color-gray-200re);
1833
- flex-direction: column;
1834
- align-items: center;
1835
- justify-content: flex-start;
1836
- padding: 0px var(--padding-5xlre);
1837
- gap: var(--gap-basere);
2291
+ display: none;
2292
+ align-self: stretch;
2293
+ width: auto;
2294
+ max-width: 840px;
2295
+ align-self: stretch;
2296
+ background-color: var(--color-gray-200re);
2297
+ flex-direction: column;
2298
+ align-items: center;
2299
+ justify-content: flex-start;
2300
+ padding: 0px var(--padding-5xlre);
2301
+ gap: var(--gap-basere);
1838
2302
  }
1839
2303
 
1840
2304
  .headerSeccionAlineaciones2420 {
1841
- display: none;
1842
- align-self: stretch;
1843
- background-color: var(--color-gray-200re);
1844
- display: none;
1845
- flex-direction: column;
1846
- align-items: center;
1847
- justify-content: flex-start;
1848
- padding: 0px var(--padding-5xlre);
1849
- gap: var(--gap-basere);
2305
+ display: none;
2306
+ align-self: stretch;
2307
+ background-color: var(--color-gray-200re);
2308
+ display: none;
2309
+ flex-direction: column;
2310
+ align-items: center;
2311
+ justify-content: flex-start;
2312
+ padding: 0px var(--padding-5xlre);
2313
+ gap: var(--gap-basere);
1850
2314
  }
1851
2315
 
1852
2316
  .headerSeccionAlineaciones2880 {
1853
- display: flex;
1854
- align-self: stretch;
1855
- background-color: var(--color-gray-200re);
1856
- flex-direction: column;
1857
- align-items: center;
1858
- justify-content: flex-start;
1859
- padding: 0px var(--padding-5xlre);
1860
- gap: var(--gap-basere);
2317
+ display: flex;
2318
+ align-self: stretch;
2319
+ background-color: var(--color-gray-200re);
2320
+ flex-direction: column;
2321
+ align-items: center;
2322
+ justify-content: flex-start;
2323
+ padding: 0px var(--padding-5xlre);
2324
+ gap: var(--gap-basere);
1861
2325
  }
1862
2326
 
1863
2327
  .headerSeccionAlineaciones2540 {
1864
- display: none;
1865
- align-self: stretch;
1866
- background-color: var(--color-gray-200re);
1867
- flex-direction: column;
1868
- align-items: center;
1869
- justify-content: flex-start;
1870
- padding: 0px var(--padding-5xlre);
1871
- gap: var(--gap-basere);
2328
+ display: none;
2329
+ align-self: stretch;
2330
+ background-color: var(--color-gray-200re);
2331
+ flex-direction: column;
2332
+ align-items: center;
2333
+ justify-content: flex-start;
2334
+ padding: 0px var(--padding-5xlre);
2335
+ gap: var(--gap-basere);
1872
2336
  }
1873
2337
  </style>