TheFrenchDemos commited on
Commit
7a4c617
·
1 Parent(s): ebd1014

Update templates/index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +74 -39
templates/index.html CHANGED
@@ -174,48 +174,83 @@
174
  </style>
175
  </head>
176
  <body>
177
- <div class="container mt-4">
178
- <h1>Reward Simulator</h1>
179
-
180
- <div class="row mt-4">
181
- <!-- Preset Images -->
182
- <div class="col-12 mb-4">
183
- <h5>Select an AI-generated image</h5>
184
- <div class="row">
185
- <div class="col-md-4">
186
- <div class="preset-image-container">
187
- <img src="/static/1.webp" class="preset-image"
188
- onclick="selectPreset(1)" alt="Preset 1">
189
- </div>
190
- <div class="image-caption">A vibrant red rose in full bloom, macro photograph</div>
191
- </div>
192
- <div class="col-md-4">
193
- <div class="preset-image-container">
194
- <img src="/static/2.webp" class="preset-image"
195
- onclick="selectPreset(2)" alt="Preset 2">
196
- </div>
197
- <div class="image-caption">Fluffy orange cat with green eyes, close-up portrait</div>
198
- </div>
199
- <div class="col-md-4">
200
- <div class="preset-image-container">
201
- <img src="/static/3.webp" class="preset-image"
202
- onclick="selectPreset(3)" alt="Preset 3">
203
- </div>
204
- <div class="image-caption">Underwater scene featuring fish swimming among aquatic plants, realistic, 4k</div>
205
- </div>
206
- </div>
207
  </div>
 
 
 
 
 
 
 
 
 
 
208
 
209
- <!-- Upload Zone -->
210
- <div class="col-12 mb-4">
211
- <div class="dropzone" id="dropzone">
212
- <p>Or drag and drop an image here</p>
213
- <input type="file" id="fileInput" class="form-control" accept="image/*" hidden>
214
- <button class="btn btn-outline-primary" onclick="document.getElementById('fileInput').click()">
215
- Select File
216
- </button>
217
- </div>
 
 
 
 
 
 
 
 
 
218
  </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
219
 
220
  <!-- Parameters -->
221
  <div class="col-12 mb-4">
 
174
  </style>
175
  </head>
176
  <body>
177
+ <div class="container mt-4">
178
+ <h1>Reward Simulator</h1>
179
+
180
+ <!-- Ligne de 2 groupes de 3 images -->
181
+ <div class="row mt-4">
182
+ <h5>Select an AI-generated image</h5>
183
+ <!-- Groupe 1 -->
184
+ <div class="col-md-6">
185
+ <div class="row">
186
+ <div class="col-4">
187
+ <div class="preset-image-container">
188
+ <img src="/static/1.webp" class="preset-image" onclick="selectPreset(1)" alt="Preset 1">
189
+ </div>
190
+ <div class="image-caption">A vibrant red rose in full bloom, macro photograph</div>
191
+ </div>
192
+ <div class="col-4">
193
+ <div class="preset-image-container">
194
+ <img src="/static/2.webp" class="preset-image" onclick="selectPreset(2)" alt="Preset 2">
 
 
 
 
 
 
 
 
 
 
 
 
195
  </div>
196
+ <div class="image-caption">Fluffy orange cat with green eyes, close-up portrait</div>
197
+ </div>
198
+ <div class="col-4">
199
+ <div class="preset-image-container">
200
+ <img src="/static/3.webp" class="preset-image" onclick="selectPreset(3)" alt="Preset 3">
201
+ </div>
202
+ <div class="image-caption">Underwater scene with fish and plants, 4K</div>
203
+ </div>
204
+ </div>
205
+ </div>
206
 
207
+ <!-- Groupe 2 -->
208
+ <div class="col-md-6">
209
+ <div class="row">
210
+ <div class="col-4">
211
+ <div class="preset-image-container">
212
+ <img src="/static/4.webp" class="preset-image" onclick="selectPreset(4)" alt="Preset 4">
213
+ </div>
214
+ <div class="image-caption">Mountain landscape at sunrise</div>
215
+ </div>
216
+ <div class="col-4">
217
+ <div class="preset-image-container">
218
+ <img src="/static/5.webp" class="preset-image" onclick="selectPreset(5)" alt="Preset 5">
219
+ </div>
220
+ <div class="image-caption">Retro-style robot with glowing eyes</div>
221
+ </div>
222
+ <div class="col-4">
223
+ <div class="preset-image-container">
224
+ <img src="/static/6.webp" class="preset-image" onclick="selectPreset(6)" alt="Preset 6">
225
  </div>
226
+ <div class="image-caption">Futuristic cityscape at night</div>
227
+ </div>
228
+ </div>
229
+ </div>
230
+ </div>
231
+
232
+ <!-- Ligne des deux zones d’upload -->
233
+ <div class="row mt-5">
234
+ <div class="col-md-6 mb-4">
235
+ <div class="dropzone" id="dropzone1">
236
+ <p>Or drag and drop an image here</p>
237
+ <input type="file" id="fileInput1" class="form-control" accept="image/*" hidden>
238
+ <button class="btn btn-outline-primary" onclick="document.getElementById('fileInput1').click()">
239
+ Select File 1
240
+ </button>
241
+ </div>
242
+ </div>
243
+ <div class="col-md-6 mb-4">
244
+ <div class="dropzone" id="dropzone2">
245
+ <p>Or drag and drop an image here</p>
246
+ <input type="file" id="fileInput2" class="form-control" accept="image/*" hidden>
247
+ <button class="btn btn-outline-primary" onclick="document.getElementById('fileInput2').click()">
248
+ Select File 2
249
+ </button>
250
+ </div>
251
+ </div>
252
+ </div>
253
+ </div>
254
 
255
  <!-- Parameters -->
256
  <div class="col-12 mb-4">