Commit ·
3dd9b6e
1
Parent(s): 197f1f9
Reorganize UI: Heading BG Color and Corner Radius dropdowns always visible in form row
Browse files- static/index.html +17 -21
static/index.html
CHANGED
|
@@ -400,23 +400,7 @@
|
|
| 400 |
</div>
|
| 401 |
</div>
|
| 402 |
|
| 403 |
-
<div class="form-
|
| 404 |
-
<label>Image Prompt *</label>
|
| 405 |
-
<textarea id="factImagePrompt" rows="2"
|
| 406 |
-
placeholder="e.g., calm forest with soft sunlight filtering through trees, peaceful nature scene"
|
| 407 |
-
required></textarea>
|
| 408 |
-
<small style="color: var(--text-secondary);">Describe the background image. It will be generated
|
| 409 |
-
without text.</small>
|
| 410 |
-
</div>
|
| 411 |
-
|
| 412 |
-
<div class="form-group">
|
| 413 |
-
<label>Fact Heading (Optional)</label>
|
| 414 |
-
<input type="text" id="factHeading" placeholder="e.g., Psychological Hack" maxlength="50">
|
| 415 |
-
<small style="color: var(--text-secondary);">Bold heading with background - appears above fact
|
| 416 |
-
text.</small>
|
| 417 |
-
</div>
|
| 418 |
-
|
| 419 |
-
<div class="form-row" id="headingStyleRow" style="display: none;">
|
| 420 |
<div class="form-group">
|
| 421 |
<label>Heading BG Color</label>
|
| 422 |
<select id="headingBgColor">
|
|
@@ -442,6 +426,22 @@
|
|
| 442 |
</div>
|
| 443 |
</div>
|
| 444 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 445 |
<div class="form-group">
|
| 446 |
<label>Fact Text *</label>
|
| 447 |
<textarea id="factText" rows="3"
|
|
@@ -552,10 +552,6 @@
|
|
| 552 |
});
|
| 553 |
|
| 554 |
// Toggle heading style row when heading is entered
|
| 555 |
-
document.getElementById('factHeading').addEventListener('input', (e) => {
|
| 556 |
-
const styleRow = document.getElementById('headingStyleRow');
|
| 557 |
-
styleRow.style.display = e.target.value.trim() ? 'grid' : 'none';
|
| 558 |
-
});
|
| 559 |
|
| 560 |
// Fact Image Form
|
| 561 |
document.getElementById('factForm').addEventListener('submit', async (e) => {
|
|
|
|
| 400 |
</div>
|
| 401 |
</div>
|
| 402 |
|
| 403 |
+
<div class="form-row">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 404 |
<div class="form-group">
|
| 405 |
<label>Heading BG Color</label>
|
| 406 |
<select id="headingBgColor">
|
|
|
|
| 426 |
</div>
|
| 427 |
</div>
|
| 428 |
|
| 429 |
+
<div class="form-group">
|
| 430 |
+
<label>Image Prompt *</label>
|
| 431 |
+
<textarea id="factImagePrompt" rows="2"
|
| 432 |
+
placeholder="e.g., calm forest with soft sunlight filtering through trees, peaceful nature scene"
|
| 433 |
+
required></textarea>
|
| 434 |
+
<small style="color: var(--text-secondary);">Describe the background image. It will be generated
|
| 435 |
+
without text.</small>
|
| 436 |
+
</div>
|
| 437 |
+
|
| 438 |
+
<div class="form-group">
|
| 439 |
+
<label>Fact Heading (Optional)</label>
|
| 440 |
+
<input type="text" id="factHeading" placeholder="e.g., Psychological Hack" maxlength="50">
|
| 441 |
+
<small style="color: var(--text-secondary);">Bold heading with background - appears above fact
|
| 442 |
+
text.</small>
|
| 443 |
+
</div>
|
| 444 |
+
|
| 445 |
<div class="form-group">
|
| 446 |
<label>Fact Text *</label>
|
| 447 |
<textarea id="factText" rows="3"
|
|
|
|
| 552 |
});
|
| 553 |
|
| 554 |
// Toggle heading style row when heading is entered
|
|
|
|
|
|
|
|
|
|
|
|
|
| 555 |
|
| 556 |
// Fact Image Form
|
| 557 |
document.getElementById('factForm').addEventListener('submit', async (e) => {
|