| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Targets - List</title>
- <link rel="stylesheet" href="../list.css">
- </head>
- <body>
- <div class="search-header">
- <div class="search-title">Targets</div>
- <div class="search-input-container">
- <div class="search-icon"></div>
- <input type="text" class="search-input" placeholder="Filter targets...">
- </div>
- </div>
- <div class="grid-section">
- <!-- Selectors & Objects Header Removed/Replaced -->
- <div class="section-title">Selectors & Objects</div>
- <div class="card-grid">
- <!-- CSS Selector -->
- <div class="card active" onclick="selectItem('test_css_selector.html', this)">
- <div class="card-large-icon">#</div>
- <div class="card-footer">CSS Selector</div>
- </div>
-
- <!-- DOM Elements -->
- <div class="card" onclick="selectItem('test_dom_elements.html', this)">
- <div class="card-large-icon"><></div>
- <div class="card-footer">DOM Elements</div>
- </div>
- <!-- JS Objects -->
- <div class="card" onclick="selectItem('test_js_objects.html', this)">
- <div class="card-large-icon">{}</div>
- <div class="card-footer">JavaScript Objects</div>
- </div>
-
- <!-- Arrays -->
- <div class="card" onclick="selectItem('test_array_targets.html', this)">
- <div class="card-large-icon">[]</div>
- <div class="card-footer">Array of targets</div>
- </div>
- </div>
- </div>
- <script>
- function selectItem(url, el) {
- document.querySelectorAll('.card').forEach(c => c.classList.remove('active'));
- el.classList.add('active');
-
- if (window.parent && window.parent.loadContent) {
- // Pass path relative to index.html (targets/...)
- window.parent.loadContent('targets/' + url);
- }
- }
- </script>
- </body>
- </html>
|