/
frs_Ecogaz_list_item.yaml
248 lines (248 loc) · 10.1 KB
/
frs_Ecogaz_list_item.yaml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
uid: frs_Ecogaz_list_item
tags:
- list
props:
parameters:
- default: Ecogaz
description: Header Title
label: Title
name: EcogazTitle
required: false
type: TEXT
groupName: header
- default: ecogaz
description: Icon - OH icons
label: Icon
name: iconimage
required: false
type: TEXT
groupName: header
- default: Aujourd'hui
description: Today Signal Title
label: Title
name: aujourdhuiTitle
required: false
type: TEXT
groupName: aujourdhui
- context: item
default: EcoGaz_Aujourdhui
description: The signal relating to the forecast consumption level for today Item
label: Item
name: aujourdhuiItem
required: false
type: TEXT
groupName: aujourdhui
- default: Demain
description: Tomorrow Signal Title
label: Title
name: DemainTitle
required: false
type: TEXT
groupName: demain
- context: item
default: EcoGaz_Demain
description: The signal relating to the forecast consumption level for tomorrow Item
label: Item
name: DemainItem
required: false
type: TEXT
groupName: demain
- default: Après demain
description: In Two Days Signal Title
label: Title
name: ApresDemainTitle
required: false
type: TEXT
groupName: apresdemain
- context: item
default: EcoGaz_ApresDemain
description: The signal relating to the forecast consumption level in two days
signal Item
label: Item
name: ApresDemainItem
required: false
type: TEXT
groupName: apresdemain
- default: Dans 3 jours
description: In Three Days Signal Title
label: Title
name: troisjTitle
required: false
type: TEXT
groupName: dans3j
- context: item
default: EcoGaz_Jour3
description: The signal relating to the forecast consumption level in three days
signal Item
label: Item
name: troisjItem
required: false
type: TEXT
groupName: dans3j
- default: Dans 4 jours
description: In Four Days Signal Title
label: Title
name: quatrejTitle
required: false
type: TEXT
groupName: dans4j
- context: item
default: EcoGaz_Jour4
description: The signal relating to the forecast consumption level in four days
signal Item
label: Item
name: quatrejItem
required: false
type: TEXT
groupName: dans4j
- default: Dans 5 jours
description: In Five Days Signal Title
label: Title
name: cinqjTitle
required: false
type: TEXT
groupName: dans5j
- context: item
default: EcoGaz_Jour5
description: The signal relating to the forecast consumption level in five days
signal Item
label: Item
name: cinqjItem
required: false
type: TEXT
groupName: dans5j
parameterGroups:
- name: header
label: Header
- name: aujourdhui
label: Today
- name: demain
label: Tomorrow
- name: apresdemain
label: In Two Days
- name: dans3j
label: In Three Days
- name: dans4j
label: In Four Days
- name: dans5j
label: In Five Days
timestamp: Feb 27, 2024, 5:09:57 PM
component: oh-list-item
config:
accordionList: true
icon: =props.iconimage
mediaList: true
stylesheet: |
.animecogazred {
animation: flashingbgecogazred 1s linear 0s infinite;
} @keyframes flashingbgecogazred {
0% {color: #ff3b30; opacity: 0}
25% {color: #ff3b30; opacity: 1}
50% {color: #ff3b30; opacity: 1}
75% {color: #ff3b30; opacity: 0}
100% {color: #ff3b30; opacity: 0}
} .animecogazorange {
animation: flashingbgecogazorange 1s linear 0s infinite;
} @keyframes flashingbgecogazorange {
0% {color: #ff9500; opacity: 0.6}
25% {color: #ff9500; opacity: 1}
50% {color: #ff9500; opacity: 1}
75% {color: #ff9500; opacity: 0.6}
100% {color: #ff9500; opacity: 0.6}
} .ecogazgreen {
color: #4cd964;
opacity: 1
}
.ecogazyellow {
color: yellow;
opacity: 1
}
subtitle: =@props.aujourdhuiItem
title: =props.EcogazTitle
slots:
accordion:
- component: f7-list
config:
mediaList: true
style:
background-color: "=themeOptions.dark === 'dark' ? 'rgb(35, 35, 35)' : 'rgb(247,
247, 247)'"
slots:
default:
- component: oh-label-item
config:
after: =@props.aujourdhuiItem
icon: '=(@@props.aujourdhuiItem) == "Vert" ? "f7:checkmark_alt_circle_fill" : (@@props.aujourdhuiItem) == "Jaune" ? "f7:slash_circle_fill" : (@@props.aujourdhuiItem) == "Orange" ? "f7:exclamationmark_circle_fill" : "f7:multiply_circle_fill"'
iconColor: '=(@@props.aujourdhuiItem) == "Vert" ? "green" : (@@props.aujourdhuiItem) == "Jaune" ? "yellow" : (@@props.aujourdhuiItem) == "Orange" ? "orange" : "red"'
style:
--f7-list-item-after-font-size: 15px
--f7-list-item-after-text-color: "=themeOptions.dark === 'dark' ? 'rgb(180,180,180)' : 'rgb(100,100,100)'"
--f7-list-item-title-font-size: 15px
--f7-list-item-title-line-height: 32px
title: =props.aujourdhuiTitle
- component: oh-label-item
config:
after: =@props.DemainItem
icon: '=(@@props.DemainItem) == "Vert" ? "f7:checkmark_alt_circle_fill" : (@@props.DemainItem) == "Jaune" ? "f7:slash_circle_fill" : (@@props.DemainItem) == "Orange" ? "f7:exclamationmark_circle_fill" : "f7:multiply_circle_fill"'
iconColor: '=(@@props.DemainItem) == "Vert" ? "green" : (@@props.DemainItem) == "Jaune" ? "yellow" : (@@props.DemainItem) == "Orange" ? "orange" : "red"'
style:
--f7-list-item-after-font-size: 15px
--f7-list-item-after-text-color: "=themeOptions.dark === 'dark' ? 'rgb(180,180,180)' : 'rgb(100,100,100)'"
--f7-list-item-title-font-size: 15px
--f7-list-item-title-line-height: 32px
title: =props.DemainTitle
- component: oh-label-item
config:
after: =@props.ApresDemainItem
icon: '=(@@props.ApresDemainItem) == "Vert" ? "f7:checkmark_alt_circle_fill" : (@@props.ApresDemainItem) == "Jaune" ? "f7:slash_circle_fill" : (@@props.ApresDemainItem) == "Orange" ? "f7:exclamationmark_circle_fill" : "f7:multiply_circle_fill"'
iconColor: '=(@@props.ApresDemainItem) == "Vert" ? "green" : (@@props.ApresDemainItem) == "Jaune" ? "yellow" : (@@props.ApresDemainItem) == "Orange" ? "orange" : "red"'
style:
--f7-list-item-after-font-size: 15px
--f7-list-item-after-text-color: "=themeOptions.dark === 'dark' ? 'rgb(180,180,180)' : 'rgb(100,100,100)'"
--f7-list-item-title-font-size: 15px
--f7-list-item-title-line-height: 32px
title: =props.ApresDemainTitle
- component: oh-label-item
config:
after: =@props.troisjItem
icon: '=(@@props.troisjItem) == "Vert" ? "f7:checkmark_alt_circle_fill" : (@@props.troisjItem) == "Jaune" ? "f7:slash_circle_fill" : (@@props.troisjItem) == "Orange" ? "f7:exclamationmark_circle_fill" : "f7:multiply_circle_fill"'
iconColor: '=(@@props.troisjItem) == "Vert" ? "green" : (@@props.troisjItem) == "Jaune" ? "yellow" : (@@props.troisjItem) == "Orange" ? "orange" : "red"'
style:
--f7-list-item-after-font-size: 15px
--f7-list-item-after-text-color: "=themeOptions.dark === 'dark' ? 'rgb(180,180,180)' : 'rgb(100,100,100)'"
--f7-list-item-title-font-size: 15px
--f7-list-item-title-line-height: 32px
title: =props.troisjTitle
- component: oh-label-item
config:
after: =@props.quatrejItem
icon: '=(@@props.quatrejItem) == "Vert" ? "f7:checkmark_alt_circle_fill" : (@@props.quatrejItem) == "Jaune" ? "f7:slash_circle_fill" : (@@props.quatrejItem) == "Orange" ? "f7:exclamationmark_circle_fill" : "f7:multiply_circle_fill"'
iconColor: '=(@@props.quatrejItem) == "Vert" ? "green" : (@@props.quatrejItem) == "Jaune" ? "yellow" : (@@props.quatrejItem) == "Orange" ? "orange" : "red"'
style:
--f7-list-item-after-font-size: 15px
--f7-list-item-after-text-color: "=themeOptions.dark === 'dark' ? 'rgb(180,180,180)' : 'rgb(100,100,100)'"
--f7-list-item-title-font-size: 15px
--f7-list-item-title-line-height: 32px
title: =props.quatrejTitle
- component: oh-label-item
config:
after: =@props.cinqjItem
icon: '=(@@props.cinqjItem) == "Vert" ? "f7:checkmark_alt_circle_fill" : (@@props.cinqjItem) == "Jaune" ? "f7:slash_circle_fill" : (@@props.cinqjItem) == "Orange" ? "f7:exclamationmark_circle_fill" : "f7:multiply_circle_fill"'
iconColor: '=(@@props.cinqjItem) == "Vert" ? "green" : (@@props.cinqjItem) == "Jaune" ? "yellow" : (@@props.cinqjItem) == "Orange" ? "orange" : "red"'
style:
--f7-list-item-after-font-size: 15px
--f7-list-item-after-text-color: "=themeOptions.dark === 'dark' ? 'rgb(180,180,180)' : 'rgb(100,100,100)'"
--f7-list-item-title-font-size: 15px
--f7-list-item-title-line-height: 32px
title: =props.cinqjTitle
after:
- component: f7-icon
config:
class: '=(@@props.aujourdhuiItem) == "Vert" ? "ecogazgreen" : (@@props.aujourdhuiItem) == "Jaune" ? "ecogazyellow" : (@@props.aujourdhuiItem) == "Orange" ? "animecogazorange" : "animecogazred"'
f7: '=(@@props.aujourdhuiItem) == "Vert" ? "checkmark_alt_circle_fill" : (@@props.aujourdhuiItem) == "Jaune" ? "slash_circle_fill" : (@@props.aujourdhuiItem) == "Orange" ? "exclamationmark_circle_fill" : "multiply_circle_fill"'
size: 30
style:
height: 20px
margin-left: 0px
margin-top: 0px
width: 30px