����JFIF��H�H����Exif��MM�*���� ��3����V�����3������3�(��������������������3�����403WebShell
403Webshell
Server IP : 162.0.232.25  /  Your IP : 3.141.46.108
Web Server : LiteSpeed
System : Linux premium276.web-hosting.com 4.18.0-513.11.1.lve.el8.x86_64 #1 SMP Thu Jan 18 16:21:02 UTC 2024 x86_64
User : kwacuqig ( 988)
PHP Version : 8.2.26
Disable Function : NONE
MySQL : OFF  |  cURL : ON  |  WGET : ON  |  Perl : ON  |  Python : ON  |  Sudo : OFF  |  Pkexec : OFF
Directory :  /home/kwacuqig/mtumbuka.org/

Upload File :
current_dir [ Writeable ] document_root [ Writeable ]

 

Command :

[ Back ]     

Current File : /home/kwacuqig/mtumbuka.org/sample.php
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Fancy Bootstrap 5 Gallery with Modal</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">

  <style>
    /* Add hover effect to images */
    .gallery-item img {
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      cursor: pointer;
      border-radius: 10px;
    }

    .gallery-item img:hover {
      transform: scale(1.05);
      box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    }

    /* Fancy modal image styling */
    .modal-content {
      background: transparent;
      border: none;
      text-align: center;
    }

    .modal-body {
      padding: 0;
    }

    #modalImage {
      border-radius: 10px;
      box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
      transition: transform 0.4s ease-in-out;
    }

    #modalImage:hover {
      transform: scale(1.05);
    }

    /* Fancy modal close button */
    .modal-footer {
      border: none;
    }

    .close-button {
      background-color: #343a40;
      color: white;
      border: none;
      border-radius: 30px;
      padding: 10px 20px;
      transition: background-color 0.3s ease;
    }

    .close-button:hover {
      background-color: #495057;
    }
  </style>
</head>
<body>

<div class="container mt-4">
  <div class="row">
    <!-- Gallery Item 1 -->
    <div class="col-lg-4 col-md-6 mb-4 gallery-item">
      <div class="card">
        <img src="https://via.placeholder.com/350x200" class="card-img-top img-thumbnail" alt="Image 1" data-bs-toggle="modal" data-bs-target="#imageModal" onclick="showImage(this.src)">
        <div class="card-body text-center">
          <h5 class="card-title">Image 1</h5>
        </div>
      </div>
    </div>
    <!-- Gallery Item 2 -->
    <div class="col-lg-4 col-md-6 mb-4 gallery-item">
      <div class="card">
        <img src="https://via.placeholder.com/350x200" class="card-img-top img-thumbnail" alt="Image 2" data-bs-toggle="modal" data-bs-target="#imageModal" onclick="showImage(this.src)">
        <div class="card-body text-center">
          <h5 class="card-title">Image 2</h5>
        </div>
      </div>
    </div>
    <!-- Gallery Item 3 -->
    <div class="col-lg-4 col-md-6 mb-4 gallery-item">
      <div class="card">
        <img src="https://via.placeholder.com/350x200" class="card-img-top img-thumbnail" alt="Image 3" data-bs-toggle="modal" data-bs-target="#imageModal" onclick="showImage(this.src)">
        <div class="card-body text-center">
          <h5 class="card-title">Image 3</h5>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Modal to show full image -->
<div class="modal fade" id="imageModal" tabindex="-1" aria-labelledby="imageModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-body">
        <img id="modalImage" src="" class="img-fluid" alt="Full Size Image">
      </div>
      <div class="modal-footer justify-content-center">
        <button type="button" class="close-button" data-bs-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>

<script>
  // Function to display clicked image in the modal
  function showImage(src) {
    document.getElementById('modalImage').src = src;
  }
</script>

</body>
</html>

Youez - 2016 - github.com/yon3zu
LinuXploit