1#@!#!123s

: / home3 / encodto1 / public_html /
Filename : website_details.php
back
<?php
require 'database.php';

// Get the `id` from the URL
$id = isset($_GET['id']) ? (int) $_GET['id'] : 0;

// Fetch data from the database based on the `id`
$details = [];
if ($id > 0) {
    $stmt = $conn->prepare("SELECT * FROM website_portfolio WHERE id = ?");
    $stmt->bind_param("i", $id);
    $stmt->execute();
    $result = $stmt->get_result();
    if ($result->num_rows > 0) {
        $details = $result->fetch_assoc();
    } else {
        echo "No record found for the provided ID.";
    }
    $stmt->close();
} else {
    echo "Invalid ID.";
}
?>

<!DOCTYPE html>
<html lang="en">
<?php
// Include styles
include 'style.php';
?>

<style>
    .details-area {
        padding: 80px 0;
        background: linear-gradient(135deg, #fdfbfb, #ebedee);
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
        box-shadow: inset 0px 2px 8px rgba(0, 0, 0, 0.05);
    }

    .details-row {
        display: flex;
        gap: 30px;
        justify-content: space-between;
    }

    .details-box {
        background: #ffffff;
        padding: 30px;
        border-radius: 12px;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
        flex: 1;
        max-width: 48%;
        text-align: center;
        transition: all 0.3s ease;
    }

    .details-box:hover {
        transform: translateY(-10px);
        box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2);
    }

    .details-icon {
        font-size: 36px;
        color: #007bff;
        margin-bottom: 15px;
    }

    .details-title {
        font-size: 26px;
        font-weight: 700;
        color: #333;
        margin-bottom: 15px;
        text-transform: uppercase;
    }

    .details-box p {
        font-size: 16px;
        line-height: 1.7;
        color: #555;
    }



    @media (max-width: 768px) {
        .details-row {
            flex-direction: column;
        }

        .details-box {
            max-width: 100%;
            margin-bottom: 20px;
        }
    }

  .image-gallery-section {
    padding: 40px 20px;
    background-color: #f9f9f9;
    text-align: center;
  }

  .section-title {
    font-size: 2em;
    margin-bottom: 20px;
    color: #333;
  }

  .feature-left {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
  }

  .feature-img-card {
    flex: 1 1 calc(25% - 20px); /* Ensures 4 images per row */
    max-width: 200px;
  }

  .feature-img-card img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
  }

  /* Add hover effect */
  .feature-img-card img:hover {
    transform: scale(1.05);
  }

  /* Responsive Design */
  @media (max-width: 768px) {
    .feature-img-card {
      flex: 1 1 100%; /* Stack images vertically on smaller screens */
    }
  }


</style>

<body>
    <!-- Main -->
    <main class="main-page new-release-page">
        <!-- Header -->
        <?php include 'header.php'; ?>


        <section class="feature-area">
            <div class="custom-container">
                <div class="custom-row align-items-center">
                    <!-- Feature Images Section -->
                    <div class="feature-left d-flex flex-wrap">
                        <div class="feature-img-card">
                            <img src="encoadminders/uploads/website/<?php echo htmlspecialchars($details['img3']); ?>" alt="Image 2" />
                        </div>
                    <div class="feature-left d-flex flex-wrap">
                        <div class="feature-img-card">
                            <img src="encoadminders/uploads/website/<?php echo htmlspecialchars($details['img3']); ?>" alt="Image 2" />
                        </div>
                    </div>

                    <!-- Feature Content Section -->
                    <div class="feature-right">
                        <div class="feature-content">
                            <h5 class="section-subtitle">Company Details</h5>
                            <h1 class="section-title"><?php echo htmlspecialchars($details['name']); ?></h1>
                            <p>Download Slack and experience a new era of organization and accomplishment.</p>
                            <ul>
                                <li><i class="las la-check"></i>Time Taken: <?php echo htmlspecialchars($details['delivery_time']); ?></li>
                                <li><i class="las la-check"></i>Technology Used: <?php echo htmlspecialchars($details['tech_used']); ?> </li>
                            </ul>
                            <div class="btns-group">
                                <a href="<?php echo htmlspecialchars($details['website_link']); ?>" class="theme-simple-btn">
                                    <i class="lab la-apple"></i> Visit Now
                                </a>
                               
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <br>
        <br>
        <br>

        <section class="service-area">
            <div class="custom-container">
                <div class="service-section-header section-header d-flex align-items-end justify-content-between">
                    <div class="left">
                        <h5 class="section-subtitle">WHAT WE’RE OFFERING</h5>
                        <h1 class="section-title">Dealing in all professional <br>IT services.</h1>
                    </div>
                    <p>One fundamental aspect of IT services is infrastructure management. This involves the design,
                        implementation, and maintenance of the hardware, software, networks, and servers.</p>
                </div>

                <div class="services-list d-flex">
                    <div class="service-card simple-shadow">
                        <img src="assets/imgs/service-icon-5.svg" alt="Service Icon" class="service-icon" />
                        <h3><a href="service-details.html">Development</a></h3>
                        <p>Our development is pixel perfect in all ways.</p>
                    </div>
                    <div class="service-card simple-shadow">
                        <img src="assets/imgs/service-icon-2.svg" alt="Service Icon" class="service-icon" />
                        <h3><a href="service-details.html">Woo Commerce</a></h3>
                        <p>We have a best team for your shopping websites.</p>
                    </div>
                    <div class="service-card simple-shadow">
                        <img src="assets/imgs/service-icon-3.svg" alt="Service Icon" class="service-icon" />
                        <h3><a href="service-details.html">CRM Solutions</a></h3>
                        <p>We enhance customer experiences for success.</p>
                    </div>
                    <div class="service-card simple-shadow">
                        <img src="assets/imgs/service-icon-4.svg" alt="Service Icon" class="service-icon" />
                        <h3><a href="service-details.html">Web Design</a></h3>
                        <p>We create vibrant, intuitive and minimalist web</p>
                    </div>
                </div>
            </div>
        </section>

        <section class="details-area">
            <div class="custom-container">
                <div class="details-content">
                    <div class="details-row d-flex justify-content-between">
                        <!-- Company Details -->
                        <div class="details-box">
                            <div class="details-icon">
                                <i class="las la-building"></i>
                            </div>
                            <h2 class="details-title">Company Details</h2>
                            <p><?php echo htmlspecialchars($details['company_details']); ?></p>
                        </div>

                        <!-- Website Details -->
                        <div class="details-box">
                            <div class="details-icon">
                                <i class="las la-globe"></i>
                            </div>
                            <h2 class="details-title">Website Details</h2>
                            <p><?php echo htmlspecialchars($details['description']); ?></p>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <section class="image-gallery-section">
  <h2 class="section-title">Image Gallery</h2>
  <div class="feature-left">
    <div class="feature-img-card">
      <img src="encoadminders/uploads/website/<?php echo htmlspecialchars($details['image']); ?>" alt="Image 1" />
    </div>
    <div class="feature-img-card">
      <img src="encoadminders/uploads/website/<?php echo htmlspecialchars($details['img2']); ?>" alt="Image 2" />
    </div>
    <div class="feature-img-card">
      <img src="encoadminders/uploads/website/<?php echo htmlspecialchars($details['img3']); ?>" alt="Image 3" />
    </div>
    <div class="feature-img-card">
      <img src="encoadminders/uploads/website/<?php echo htmlspecialchars($details['img4']); ?>" alt="Image 4" />
    </div>
  </div>
</section>



        <!-- Footer -->
        <?php include 'footer.php'; ?>
    </main>

    <!-- Scripts -->
    <script src="assets/js/jquery-3.7.0.min.js"></script>
    <script src="assets/js/bootstrap.bundle.min.js"></script>
    <script src="assets/js/gsap.min.js"></script>
    <script src="assets/js/Draggable.min.js"></script>
    <script src="assets/js/swiper-bundle.min.js"></script>
    <script src="assets/js/client-marquee.js"></script>
    <script src="assets/js/theme-custom.js"></script>
    <script src="assets/js/form1.js"></script>
    <script src="assets/js/subscribe-form.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
    <!-- Tawk.to Script -->
    <script type="text/javascript">
        var Tawk_API = Tawk_API || {},
            Tawk_LoadStart = new Date();
        (function() {
            var s1 = document.createElement("script"),
                s0 = document.getElementsByTagName("script")[0];
            s1.async = true;
            s1.src = 'https://embed.tawk.to/609cf4b4185beb22b30cda7a/1f5ihnorp';
            s1.charset = 'UTF-8';
            s1.setAttribute('crossorigin', '*');
            s0.parentNode.insertBefore(s1, s0);
        })();
    </script>
</body>

</html>