0
Kayıt Ol

Ücretsiz destek bekliyorum. Yapay zekası olanlar için kısa bir forum kodlayacak arkadaş varmı

5

●

196

  • 26-05-2025, 21:49:46
    #1
    Finoxis
    Finoxis
    Arkadaşlar merhaba siteme gömebilmem için div style kullanarak bir forum kodlanması gerekli yapay zeka kullanmıyorum chatgpt premium yok bu sebeple güzel bir iş çıkmıyor. yapay zekası olan arkadaşlar ücretsiz yardımcı olabilirmi? uzun bir iş değil teşekkür ederim WhatsApp
  • 26-05-2025, 21:53:52
    #2
    xumutx
    xumutx
    PM attım Hocam
  • 26-05-2025, 21:56:32
    #3
    VektorMedya
    VektorMedya
    https://claude.ai/ kullanabillirsin html tek sayfa güzel çıktıı verir.
    Örnek senin için yaptım gece gündüz modu uyumlu



    <!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ModernForum - Ana Sayfa</title>
    
    <!-- Bootstrap CSS -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome Icons -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    
    <style>
        :root {
            --primary-color: #3b82f6;
            --secondary-color: #6366f1;
            --success-color: #10b981;
            --warning-color: #f59e0b;
            --danger-color: #ef4444;
            --dark-color: #1f2937;
            --light-color: #f8fafc;
            --border-color: #e5e7eb;
            --text-muted: #6b7280;
            --forum-bg: #ffffff;
            --forum-card-bg: #ffffff;
            --forum-border: #e5e7eb;
            --forum-shadow: rgba(0, 0, 0, 0.05);
        }

        [data-theme="dark"] {
            --primary-color: #60a5fa;
            --secondary-color: #8b5cf6;
            --success-color: #34d399;
            --warning-color: #fbbf24;
            --danger-color: #f87171;
            --dark-color: #f8fafc;
            --light-color: #111827;
            --border-color: #374151;
            --text-muted: #9ca3af;
            --forum-bg: #111827;
            --forum-card-bg: #1f2937;
            --forum-border: #374151;
            --forum-shadow: rgba(0, 0, 0, 0.3);
        }

        * {
            transition: all 0.3s ease;
        }

        body {
            font-family: 'Inter', sans-serif;
            background-color: var(--forum-bg);
            color: var(--dark-color);
            line-height: 1.6;
        }

        .navbar {
            background-color: var(--forum-card-bg) !important;
            border-bottom: 1px solid var(--forum-border);
            box-shadow: 0 2px 4px var(--forum-shadow);
        }

        .navbar-brand {
            font-weight: 700;
            color: var(--primary-color) !important;
            font-size: 1.5rem;
        }

        .nav-link {
            color: var(--dark-color) !important;
            font-weight: 500;
            padding: 0.75rem 1rem !important;
            border-radius: 0.5rem;
            margin: 0 0.25rem;
        }

        .nav-link:hover {
            background-color: var(--light-color);
            color: var(--primary-color) !important;
        }

        .theme-toggle {
            background: none;
            border: 2px solid var(--border-color);
            color: var(--dark-color);
            border-radius: 50%;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }

        .theme-toggle:hover {
            border-color: var(--primary-color);
            color: var(--primary-color);
        }

        .forum-stats {
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            color: white;
            border-radius: 1rem;
            padding: 2rem;
            margin-bottom: 2rem;
        }

        .forum-category {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 1rem;
            box-shadow: 0 4px 6px var(--forum-shadow);
            margin-bottom: 1.5rem;
            overflow: hidden;
        }

        .category-header {
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            color: white;
            padding: 1rem 1.5rem;
            font-weight: 600;
            font-size: 1.1rem;
        }

        .forum-row {
            padding: 1rem 1.5rem;
            border-bottom: 1px solid var(--forum-border);
            display: flex;
            align-items: center;
            text-decoration: none;
            color: inherit;
        }

        .forum-row:last-child {
            border-bottom: none;
        }

        .forum-row:hover {
            background-color: var(--light-color);
            text-decoration: none;
            color: inherit;
        }

        .forum-icon {
            width: 48px;
            height: 48px;
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            border-radius: 0.75rem;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 1.2rem;
            margin-right: 1rem;
            flex-shrink: 0;
        }

        .forum-info {
            flex-grow: 1;
        }

        .forum-title {
            font-weight: 600;
            font-size: 1.1rem;
            margin-bottom: 0.25rem;
            color: var(--dark-color);
        }

        .forum-description {
            color: var(--text-muted);
            font-size: 0.9rem;
            margin-bottom: 0.5rem;
        }

        .forum-meta {
            font-size: 0.8rem;
            color: var(--text-muted);
        }

        .forum-stats-numbers {
            text-align: center;
            min-width: 80px;
            margin-left: 1rem;
        }

        .forum-stats-numbers .number {
            font-weight: 700;
            font-size: 1.1rem;
            display: block;
            color: var(--dark-color);
        }

        .forum-stats-numbers .label {
            font-size: 0.8rem;
            color: var(--text-muted);
        }

        .online-users {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 1rem;
            padding: 1.5rem;
            box-shadow: 0 4px 6px var(--forum-shadow);
        }

        .user-avatar {
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--success-color), var(--primary-color));
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight: 600;
            margin-right: 0.5rem;
            margin-bottom: 0.5rem;
        }

        .recent-posts {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 1rem;
            padding: 1.5rem;
            box-shadow: 0 4px 6px var(--forum-shadow);
        }

        .recent-post-item {
            padding: 0.75rem 0;
            border-bottom: 1px solid var(--forum-border);
        }

        .recent-post-item:last-child {
            border-bottom: none;
        }

        .post-title {
            font-weight: 500;
            color: var(--dark-color);
            text-decoration: none;
            display: block;
            margin-bottom: 0.25rem;
        }

        .post-title:hover {
            color: var(--primary-color);
            text-decoration: none;
        }

        .post-meta {
            font-size: 0.8rem;
            color: var(--text-muted);
        }

        .badge-custom {
            font-size: 0.7rem;
            padding: 0.25rem 0.5rem;
            border-radius: 0.375rem;
        }

        .breadcrumb {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 0.5rem;
            padding: 0.75rem 1rem;
            margin-bottom: 1.5rem;
        }

        .breadcrumb-item a {
            color: var(--primary-color);
            text-decoration: none;
        }

        .breadcrumb-item.active {
            color: var(--text-muted);
        }

        @media (max-width: 768px) {
            .forum-row {
                flex-direction: column;
                text-align: center;
            }

            .forum-icon {
                margin-right: 0;
                margin-bottom: 1rem;
            }

            .forum-stats-numbers {
                margin-left: 0;
                margin-top: 1rem;
            }

            .forum-stats {
                text-align: center;
            }
        }

        .search-bar {
            max-width: 400px;
        }

        .btn-primary {
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            border: none;
            border-radius: 0.5rem;
            padding: 0.5rem 1rem;
            font-weight: 500;
        }

        .btn-outline-primary {
            border-color: var(--primary-color);
            color: var(--primary-color);
            border-radius: 0.5rem;
            font-weight: 500;
        }

        .btn-outline-primary:hover {
            background: var(--primary-color);
            border-color: var(--primary-color);
        }
    </style>
</head>
<body>
    <!-- Navigation -->
    <nav class="navbar navbar-expand-lg sticky-top">
        <div class="container">
            <a class="navbar-brand" href="#"><i class="fas fa-comments"></i> ModernForum</a>
            
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-home me-1"></i>Ana Sayfa</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-fire me-1"></i>Popüler</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-clock me-1"></i>Son Konular</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-users me-1"></i>Üyeler</a>
                    </li>
                </ul>
                
                <div class="d-flex align-items-center">
                    <div class="search-bar me-3">
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="Forum'da ara...">
                            <button class="btn btn-outline-primary" type="button">
                                <i class="fas fa-search"></i>
                            </button>
                        </div>
                    </div>
                    
                    <button class="theme-toggle me-3" onclick="toggleTheme()">
                        <i class="fas fa-moon" id="theme-icon"></i>
                    </button>
                    
                    <a href="#" class="btn btn-outline-primary me-2">Giriş</a>
                    <a href="#" class="btn btn-primary">Kayıt Ol</a>
                </div>
            </div>
        </div>
    </nav>

    <div class="container mt-4">
        <!-- Breadcrumb -->
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item"><a href="#"><i class="fas fa-home"></i></a></li>
                <li class="breadcrumb-item active">Forum Ana Sayfası</li>
            </ol>
        </nav>

        <!-- Forum Stats -->
        <div class="forum-stats">
            <div class="row text-center">
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">15,847</h3>
                    <p class="mb-0">Toplam Konu</p>
                </div>
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">89,234</h3>
                    <p class="mb-0">Toplam Mesaj</p>
                </div>
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">3,456</h3>
                    <p class="mb-0">Toplam Üye</p>
                </div>
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">127</h3>
                    <p class="mb-0">Çevrimiçi</p>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-8">
                <!-- Genel Tartışma -->
                <div class="forum-category">
                    <div class="category-header">
                        <i class="fas fa-comments me-2"></i>Genel Tartışma
                    </div>
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-bullhorn"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Duyurular</div>
                            <div class="forum-description">Site duyuruları ve önemli bilgilendirmeler</div>
                            <div class="forum-meta">
                                <span class="badge badge-custom bg-success">Yeni</span>
                                Son mesaj: <strong>admin</strong> tarafından 2 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">24</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">156</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                    
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-comment-alt"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Genel Sohbet</div>
                            <div class="forum-description">Her türlü konuda serbest sohbet alanı</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>kullanici123</strong> tarafından 15 dakika önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">1,234</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">8,567</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-question-circle"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Sorular ve Cevaplar</div>
                            <div class="forum-description">Merak ettiğiniz konularda soru sorun</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>yardimci</strong> tarafından 1 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">567</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">2,345</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                </div>

                <!-- Teknoloji -->
                <div class="forum-category">
                    <div class="category-header">
                        <i class="fas fa-laptop-code me-2"></i>Teknoloji
                    </div>
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-code"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Programlama</div>
                            <div class="forum-description">Yazılım geliştirme, kodlama ve programlama dilleri</div>
                            <div class="forum-meta">
                                <span class="badge badge-custom bg-warning">Popüler</span>
                                Son mesaj: <strong>developer</strong> tarafından 30 dakika önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">892</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">4,567</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-mobile-alt"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Mobil Teknolojiler</div>
                            <div class="forum-description">Akıllı telefonlar, tabletler ve mobil uygulamalar</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>techguru</strong> tarafından 3 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">445</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">1,823</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-gamepad"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Oyunlar</div>
                            <div class="forum-description">Video oyunları, oyun incelemeleri ve tartışmalar</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>gamer</strong> tarafından 45 dakika önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">678</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">3,234</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                </div>

                <!-- Hobi ve İlgi Alanları -->
                <div class="forum-category">
                    <div class="category-header">
                        <i class="fas fa-heart me-2"></i>Hobi ve İlgi Alanları
                    </div>
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-camera"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Fotoğrafçılık</div>
                            <div class="forum-description">Fotoğraf çekimi, ekipman tavsiyeleri ve sergiler</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>photographer</strong> tarafından 2 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">234</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">1,456</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-music"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Müzik</div>
                            <div class="forum-description">Müzik tartışmaları, albüm incelemeleri ve keşifler</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>musiclover</strong> tarafından 1 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">456</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">2,789</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                </div>
            </div>

            <div class="col-lg-4">
                <!-- Online Users -->
                <div class="online-users mb-4">
                    <h5 class="mb-3"><i class="fas fa-users text-success me-2"></i>Çevrimiçi Üyeler (127)</h5>
                    <div>
                        <span class="user-avatar">A</span>
                        <span class="user-avatar">M</span>
                        <span class="user-avatar">T</span>
                        <span class="user-avatar">K</span>
                        <span class="user-avatar">S</span>
                        <span class="user-avatar">E</span>
                        <span class="user-avatar">D</span>
                        <span class="user-avatar">+</span>
                    </div>
                    <small class="text-muted">Ve 119 misafir...</small>
                </div>

                <!-- Recent Posts -->
                <div class="recent-posts">
                    <h5 class="mb-3"><i class="fas fa-clock text-primary me-2"></i>Son Konular</h5>
                    
                    <div class="recent-post-item">
                        <a href="#" class="post-title">React vs Vue.js hangisi daha iyi?</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>developer • 
                            <i class="fas fa-clock me-1"></i>5 dakika önce •
                            <i class="fas fa-comments me-1"></i>12 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">Yeni iPhone 15 Pro incelemesi</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>techguru • 
                            <i class="fas fa-clock me-1"></i>15 dakika önce •
                            <i class="fas fa-comments me-1"></i>8 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">Fotoğraf çekimi için lens önerileri</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>photographer • 
                            <i class="fas fa-clock me-1"></i>1 saat önce •
                            <i class="fas fa-comments me-1"></i>23 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">2024'ün en iyi oyunları</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>gamer • 
                            <i class="fas fa-clock me-1"></i>2 saat önce •
                            <i class="fas fa-comments me-1"></i>45 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">Klasik müzik önerileri</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>musiclover • 
                            <i class="fas fa-clock me-1"></i>3 saat önce •
                            <i class="fas fa-comments me-1"></i>7 yanıt
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Footer -->
    <footer class="mt-5 py-4" style="background-color: var(--forum-card-bg); border-top: 1px solid var(--forum-border);">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                    <h6><i class="fas fa-comments me-2"></i>ModernForum</h6>
                    <p class="text-muted small">Modern ve kullanıcı dostu forum deneyimi.</p>
                </div>
                <div class="col-md-6 text-md-end">
                    <small class="text-muted">
                        © 2024 ModernForum. Tüm hakları saklıdır.
                    </small>
                </div>
            </div>
        </div>
    </footer>

    <!-- Bootstrap JS -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
    
    <script>
        // Theme Toggle
        let currentTheme = 'light';
        
        function toggleTheme() {
            const body = document.body;
            const themeIcon = document.getElementById('theme-icon');
            
            if (currentTheme === 'light') {
                body.setAttribute('data-theme', 'dark');
                themeIcon.className = 'fas fa-sun';
                currentTheme = 'dark';
            } else {
                body.removeAttribute('data-theme');
                themeIcon.className = 'fas fa-moon';
                currentTheme = 'light';
            }
        }

        // Check system preference
        if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
            toggleTheme();
        }

        // Search functionality
        document.querySelector('.search-bar input').addEventListener('keypress', function(e) {
            if (e.key === 'Enter') {
                const searchTerm = this.value;
                if (searchTerm.trim()) {
                    alert('Arama: ' + searchTerm);
                }
            }
        });

        // Mobile menu enhancement
        document.addEventListener('DOMContentLoaded', function() {
            // Add smooth animations
            const forumRows = document.querySelectorAll('.forum-row');
            forumRows.forEach(row => {
                row.addEventListener('mouseenter', function() {
                    this.style.transform = 'translateX(5px)';
                });
                
                row.addEventListener('mouseleave', function() {
                    this.style.transform = 'translateX(0)';
                });
            });

            // Update timestamps dynamically
            setInterval(() => {
                const timeElements = document.querySelectorAll('.forum-meta, .post-meta');
                // In a real application, you would update these with actual timestamps
            }, 60000);
        });
    </script>
</body>
</html>
  • 26-05-2025, 22:38:04
    #4
    Finoxis
    Finoxis
    VektorMedya adlı üyeden alıntı: mesajı görüntüle
    https://claude.ai/ kullanabillirsin html tek sayfa güzel çıktıı verir.
    Örnek senin için yaptım gece gündüz modu uyumlu



    <!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ModernForum - Ana Sayfa</title>
    
    <!-- Bootstrap CSS -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome Icons -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    
    <style>
        :root {
            --primary-color: #3b82f6;
            --secondary-color: #6366f1;
            --success-color: #10b981;
            --warning-color: #f59e0b;
            --danger-color: #ef4444;
            --dark-color: #1f2937;
            --light-color: #f8fafc;
            --border-color: #e5e7eb;
            --text-muted: #6b7280;
            --forum-bg: #ffffff;
            --forum-card-bg: #ffffff;
            --forum-border: #e5e7eb;
            --forum-shadow: rgba(0, 0, 0, 0.05);
        }

        [data-theme="dark"] {
            --primary-color: #60a5fa;
            --secondary-color: #8b5cf6;
            --success-color: #34d399;
            --warning-color: #fbbf24;
            --danger-color: #f87171;
            --dark-color: #f8fafc;
            --light-color: #111827;
            --border-color: #374151;
            --text-muted: #9ca3af;
            --forum-bg: #111827;
            --forum-card-bg: #1f2937;
            --forum-border: #374151;
            --forum-shadow: rgba(0, 0, 0, 0.3);
        }

        * {
            transition: all 0.3s ease;
        }

        body {
            font-family: 'Inter', sans-serif;
            background-color: var(--forum-bg);
            color: var(--dark-color);
            line-height: 1.6;
        }

        .navbar {
            background-color: var(--forum-card-bg) !important;
            border-bottom: 1px solid var(--forum-border);
            box-shadow: 0 2px 4px var(--forum-shadow);
        }

        .navbar-brand {
            font-weight: 700;
            color: var(--primary-color) !important;
            font-size: 1.5rem;
        }

        .nav-link {
            color: var(--dark-color) !important;
            font-weight: 500;
            padding: 0.75rem 1rem !important;
            border-radius: 0.5rem;
            margin: 0 0.25rem;
        }

        .nav-link:hover {
            background-color: var(--light-color);
            color: var(--primary-color) !important;
        }

        .theme-toggle {
            background: none;
            border: 2px solid var(--border-color);
            color: var(--dark-color);
            border-radius: 50%;
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }

        .theme-toggle:hover {
            border-color: var(--primary-color);
            color: var(--primary-color);
        }

        .forum-stats {
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            color: white;
            border-radius: 1rem;
            padding: 2rem;
            margin-bottom: 2rem;
        }

        .forum-category {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 1rem;
            box-shadow: 0 4px 6px var(--forum-shadow);
            margin-bottom: 1.5rem;
            overflow: hidden;
        }

        .category-header {
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            color: white;
            padding: 1rem 1.5rem;
            font-weight: 600;
            font-size: 1.1rem;
        }

        .forum-row {
            padding: 1rem 1.5rem;
            border-bottom: 1px solid var(--forum-border);
            display: flex;
            align-items: center;
            text-decoration: none;
            color: inherit;
        }

        .forum-row:last-child {
            border-bottom: none;
        }

        .forum-row:hover {
            background-color: var(--light-color);
            text-decoration: none;
            color: inherit;
        }

        .forum-icon {
            width: 48px;
            height: 48px;
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            border-radius: 0.75rem;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 1.2rem;
            margin-right: 1rem;
            flex-shrink: 0;
        }

        .forum-info {
            flex-grow: 1;
        }

        .forum-title {
            font-weight: 600;
            font-size: 1.1rem;
            margin-bottom: 0.25rem;
            color: var(--dark-color);
        }

        .forum-description {
            color: var(--text-muted);
            font-size: 0.9rem;
            margin-bottom: 0.5rem;
        }

        .forum-meta {
            font-size: 0.8rem;
            color: var(--text-muted);
        }

        .forum-stats-numbers {
            text-align: center;
            min-width: 80px;
            margin-left: 1rem;
        }

        .forum-stats-numbers .number {
            font-weight: 700;
            font-size: 1.1rem;
            display: block;
            color: var(--dark-color);
        }

        .forum-stats-numbers .label {
            font-size: 0.8rem;
            color: var(--text-muted);
        }

        .online-users {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 1rem;
            padding: 1.5rem;
            box-shadow: 0 4px 6px var(--forum-shadow);
        }

        .user-avatar {
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--success-color), var(--primary-color));
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight: 600;
            margin-right: 0.5rem;
            margin-bottom: 0.5rem;
        }

        .recent-posts {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 1rem;
            padding: 1.5rem;
            box-shadow: 0 4px 6px var(--forum-shadow);
        }

        .recent-post-item {
            padding: 0.75rem 0;
            border-bottom: 1px solid var(--forum-border);
        }

        .recent-post-item:last-child {
            border-bottom: none;
        }

        .post-title {
            font-weight: 500;
            color: var(--dark-color);
            text-decoration: none;
            display: block;
            margin-bottom: 0.25rem;
        }

        .post-title:hover {
            color: var(--primary-color);
            text-decoration: none;
        }

        .post-meta {
            font-size: 0.8rem;
            color: var(--text-muted);
        }

        .badge-custom {
            font-size: 0.7rem;
            padding: 0.25rem 0.5rem;
            border-radius: 0.375rem;
        }

        .breadcrumb {
            background-color: var(--forum-card-bg);
            border: 1px solid var(--forum-border);
            border-radius: 0.5rem;
            padding: 0.75rem 1rem;
            margin-bottom: 1.5rem;
        }

        .breadcrumb-item a {
            color: var(--primary-color);
            text-decoration: none;
        }

        .breadcrumb-item.active {
            color: var(--text-muted);
        }

        @media (max-width: 768px) {
            .forum-row {
                flex-direction: column;
                text-align: center;
            }

            .forum-icon {
                margin-right: 0;
                margin-bottom: 1rem;
            }

            .forum-stats-numbers {
                margin-left: 0;
                margin-top: 1rem;
            }

            .forum-stats {
                text-align: center;
            }
        }

        .search-bar {
            max-width: 400px;
        }

        .btn-primary {
            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
            border: none;
            border-radius: 0.5rem;
            padding: 0.5rem 1rem;
            font-weight: 500;
        }

        .btn-outline-primary {
            border-color: var(--primary-color);
            color: var(--primary-color);
            border-radius: 0.5rem;
            font-weight: 500;
        }

        .btn-outline-primary:hover {
            background: var(--primary-color);
            border-color: var(--primary-color);
        }
    </style>
</head>
<body>
    <!-- Navigation -->
    <nav class="navbar navbar-expand-lg sticky-top">
        <div class="container">
            <a class="navbar-brand" href="#"><i class="fas fa-comments"></i> ModernForum</a>
            
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-home me-1"></i>Ana Sayfa</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-fire me-1"></i>Popüler</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-clock me-1"></i>Son Konular</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#"><i class="fas fa-users me-1"></i>Üyeler</a>
                    </li>
                </ul>
                
                <div class="d-flex align-items-center">
                    <div class="search-bar me-3">
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="Forum'da ara...">
                            <button class="btn btn-outline-primary" type="button">
                                <i class="fas fa-search"></i>
                            </button>
                        </div>
                    </div>
                    
                    <button class="theme-toggle me-3" onclick="toggleTheme()">
                        <i class="fas fa-moon" id="theme-icon"></i>
                    </button>
                    
                    <a href="#" class="btn btn-outline-primary me-2">Giriş</a>
                    <a href="#" class="btn btn-primary">Kayıt Ol</a>
                </div>
            </div>
        </div>
    </nav>

    <div class="container mt-4">
        <!-- Breadcrumb -->
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item"><a href="#"><i class="fas fa-home"></i></a></li>
                <li class="breadcrumb-item active">Forum Ana Sayfası</li>
            </ol>
        </nav>

        <!-- Forum Stats -->
        <div class="forum-stats">
            <div class="row text-center">
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">15,847</h3>
                    <p class="mb-0">Toplam Konu</p>
                </div>
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">89,234</h3>
                    <p class="mb-0">Toplam Mesaj</p>
                </div>
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">3,456</h3>
                    <p class="mb-0">Toplam Üye</p>
                </div>
                <div class="col-md-3 col-6">
                    <h3 class="mb-1">127</h3>
                    <p class="mb-0">Çevrimiçi</p>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-8">
                <!-- Genel Tartışma -->
                <div class="forum-category">
                    <div class="category-header">
                        <i class="fas fa-comments me-2"></i>Genel Tartışma
                    </div>
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-bullhorn"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Duyurular</div>
                            <div class="forum-description">Site duyuruları ve önemli bilgilendirmeler</div>
                            <div class="forum-meta">
                                <span class="badge badge-custom bg-success">Yeni</span>
                                Son mesaj: <strong>admin</strong> tarafından 2 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">24</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">156</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                    
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-comment-alt"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Genel Sohbet</div>
                            <div class="forum-description">Her türlü konuda serbest sohbet alanı</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>kullanici123</strong> tarafından 15 dakika önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">1,234</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">8,567</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-question-circle"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Sorular ve Cevaplar</div>
                            <div class="forum-description">Merak ettiğiniz konularda soru sorun</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>yardimci</strong> tarafından 1 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">567</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">2,345</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                </div>

                <!-- Teknoloji -->
                <div class="forum-category">
                    <div class="category-header">
                        <i class="fas fa-laptop-code me-2"></i>Teknoloji
                    </div>
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-code"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Programlama</div>
                            <div class="forum-description">Yazılım geliştirme, kodlama ve programlama dilleri</div>
                            <div class="forum-meta">
                                <span class="badge badge-custom bg-warning">Popüler</span>
                                Son mesaj: <strong>developer</strong> tarafından 30 dakika önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">892</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">4,567</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-mobile-alt"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Mobil Teknolojiler</div>
                            <div class="forum-description">Akıllı telefonlar, tabletler ve mobil uygulamalar</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>techguru</strong> tarafından 3 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">445</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">1,823</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-gamepad"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Oyunlar</div>
                            <div class="forum-description">Video oyunları, oyun incelemeleri ve tartışmalar</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>gamer</strong> tarafından 45 dakika önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">678</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">3,234</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                </div>

                <!-- Hobi ve İlgi Alanları -->
                <div class="forum-category">
                    <div class="category-header">
                        <i class="fas fa-heart me-2"></i>Hobi ve İlgi Alanları
                    </div>
                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-camera"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Fotoğrafçılık</div>
                            <div class="forum-description">Fotoğraf çekimi, ekipman tavsiyeleri ve sergiler</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>photographer</strong> tarafından 2 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">234</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">1,456</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>

                    <a href="#" class="forum-row">
                        <div class="forum-icon">
                            <i class="fas fa-music"></i>
                        </div>
                        <div class="forum-info">
                            <div class="forum-title">Müzik</div>
                            <div class="forum-description">Müzik tartışmaları, albüm incelemeleri ve keşifler</div>
                            <div class="forum-meta">
                                Son mesaj: <strong>musiclover</strong> tarafından 1 saat önce
                            </div>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">456</span>
                            <span class="label">Konu</span>
                        </div>
                        <div class="forum-stats-numbers">
                            <span class="number">2,789</span>
                            <span class="label">Mesaj</span>
                        </div>
                    </a>
                </div>
            </div>

            <div class="col-lg-4">
                <!-- Online Users -->
                <div class="online-users mb-4">
                    <h5 class="mb-3"><i class="fas fa-users text-success me-2"></i>Çevrimiçi Üyeler (127)</h5>
                    <div>
                        <span class="user-avatar">A</span>
                        <span class="user-avatar">M</span>
                        <span class="user-avatar">T</span>
                        <span class="user-avatar">K</span>
                        <span class="user-avatar">S</span>
                        <span class="user-avatar">E</span>
                        <span class="user-avatar">D</span>
                        <span class="user-avatar">+</span>
                    </div>
                    <small class="text-muted">Ve 119 misafir...</small>
                </div>

                <!-- Recent Posts -->
                <div class="recent-posts">
                    <h5 class="mb-3"><i class="fas fa-clock text-primary me-2"></i>Son Konular</h5>
                    
                    <div class="recent-post-item">
                        <a href="#" class="post-title">React vs Vue.js hangisi daha iyi?</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>developer •
                            <i class="fas fa-clock me-1"></i>5 dakika önce •
                            <i class="fas fa-comments me-1"></i>12 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">Yeni iPhone 15 Pro incelemesi</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>techguru •
                            <i class="fas fa-clock me-1"></i>15 dakika önce •
                            <i class="fas fa-comments me-1"></i>8 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">Fotoğraf çekimi için lens önerileri</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>photographer •
                            <i class="fas fa-clock me-1"></i>1 saat önce •
                            <i class="fas fa-comments me-1"></i>23 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">2024'ün en iyi oyunları</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>gamer •
                            <i class="fas fa-clock me-1"></i>2 saat önce •
                            <i class="fas fa-comments me-1"></i>45 yanıt
                        </div>
                    </div>

                    <div class="recent-post-item">
                        <a href="#" class="post-title">Klasik müzik önerileri</a>
                        <div class="post-meta">
                            <i class="fas fa-user me-1"></i>musiclover •
                            <i class="fas fa-clock me-1"></i>3 saat önce •
                            <i class="fas fa-comments me-1"></i>7 yanıt
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Footer -->
    <footer class="mt-5 py-4" style="background-color: var(--forum-card-bg); border-top: 1px solid var(--forum-border);">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                    <h6><i class="fas fa-comments me-2"></i>ModernForum</h6>
                    <p class="text-muted small">Modern ve kullanıcı dostu forum deneyimi.</p>
                </div>
                <div class="col-md-6 text-md-end">
                    <small class="text-muted">
                        © 2024 ModernForum. Tüm hakları saklıdır.
                    </small>
                </div>
            </div>
        </div>
    </footer>

    <!-- Bootstrap JS -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
    
    <script>
        // Theme Toggle
        let currentTheme = 'light';
        
        function toggleTheme() {
            const body = document.body;
            const themeIcon = document.getElementById('theme-icon');
            
            if (currentTheme === 'light') {
                body.setAttribute('data-theme', 'dark');
                themeIcon.className = 'fas fa-sun';
                currentTheme = 'dark';
            } else {
                body.removeAttribute('data-theme');
                themeIcon.className = 'fas fa-moon';
                currentTheme = 'light';
            }
        }

        // Check system preference
        if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
            toggleTheme();
        }

        // Search functionality
        document.querySelector('.search-bar input').addEventListener('keypress', function(e) {
            if (e.key === 'Enter') {
                const searchTerm = this.value;
                if (searchTerm.trim()) {
                    alert('Arama: ' + searchTerm);
                }
            }
        });

        // Mobile menu enhancement
        document.addEventListener('DOMContentLoaded', function() {
            // Add smooth animations
            const forumRows = document.querySelectorAll('.forum-row');
            forumRows.forEach(row => {
                row.addEventListener('mouseenter', function() {
                    this.style.transform = 'translateX(5px)';
                });
                
                row.addEventListener('mouseleave', function() {
                    this.style.transform = 'translateX(0)';
                });
            });

            // Update timestamps dynamically
            setInterval(() => {
                const timeElements = document.querySelectorAll('.forum-meta, .post-meta');
                // In a real application, you would update these with actual timestamps
            }, 60000);
        });
    </script>
</body>
</html>
    Hocam emeğiniz için çok teşekkür ederim fakat forum derken iletişim forumu yetkili isim soyisim, telefon numarası eposta girilmesi gibi olacaktı.
  • 26-05-2025, 22:58:25
    #5
    VektorMedya
    VektorMedya
    Finoxis adlı üyeden alıntı: mesajı görüntüle
    Hocam emeğiniz için çok teşekkür ederim fakat forum derken iletişim forumu yetkili isim soyisim, telefon numarası eposta girilmesi gibi olacaktı.
    hocam o forum değil form, iki dakika konuya vakit ayırıp detay verseydiniz keşke, neyse https://claude.ai/ yapabilirsiniz
  • 27-05-2025, 16:51:35
    #6
    ornitorenk
    ornitorenk
    Bu tarz işlemler için Windsurf'ü tavsiye ederim. Claude modelini kullanarak güzel sonuçlar alabileceğinizi düşünüyorum.