Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 5.14.0-611.16.1.el9_7.x86_64

PHP Version:

8.2.30

User:

u226437350

Directory:

/home/u226437350/domains/maharshiwomensdegreecollege.com/public_html/clg

Free Space:

8.35 TB

🔧 Quick Actions

✏️ Editing: gallery_login.php

<?php
// ============================================
// gallery_login.php — Admin Login Page
// Maharshi Women's Degree College
// ============================================
session_start();

// ── Credentials (change these!) ─────────────────────────────────────────────
define('ADMIN_USERNAME', 'admin');
define('ADMIN_PASSWORD', 'maharshi@2024'); // Change this to a strong password

// If already logged in, redirect to admin
if (isset($_SESSION['gallery_admin']) && $_SESSION['gallery_admin'] === true) {
    header('Location: gallery_admin.php');
    exit;
}

$error = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $username = trim($_POST['username'] ?? '');
    $password = trim($_POST['password'] ?? '');

// Simple brute-force delay
    sleep(1);

if ($username === ADMIN_USERNAME && $password === ADMIN_PASSWORD) {
        $_SESSION['gallery_admin'] = true;
        $_SESSION['admin_user']    = $username;
        $_SESSION['login_time']    = time();
        header('Location: gallery_admin.php');
        exit;
    } else {
        $error = 'Invalid username or password. Please try again.';
    }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Admin Login — Maharshi Women's Degree College Gallery</title>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=DM+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
<style>
/* ════════════════════════════════════
   ROOT VARIABLES
════════════════════════════════════ */
:root {
  --saffron:   #FF671F;
  --saffron-d: #e55a15;
  --navy:      #003087;
  --navy-d:    #001A5C;
  --gold:      #C8962A;
  --white:     #FFFFFF;
  --cream:     #FFF8F0;
  --text:      #1A1A2E;
  --muted:     #6B7280;
  --border:    rgba(255,255,255,0.15);
  --error-bg:  rgba(220,38,38,0.12);
  --error-clr: #FF6B6B;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'DM Sans', sans-serif;
  min-height: 100vh;
  display: flex;
  align-items: stretch;
  background: var(--navy-d);
  color: var(--text);
  overflow: hidden;
}

/* ════════════════════════════════════
   LEFT PANEL — Branding
════════════════════════════════════ */
.left-panel {
  flex: 1;
  background: linear-gradient(160deg, var(--navy-d) 0%, #002070 50%, #0D3B8C 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 40px;
  position: relative;
  overflow: hidden;
}

/* Decorative circles */
.left-panel::before {
  content: '';
  position: absolute;
  width: 500px; height: 500px;
  border-radius: 50%;
  border: 80px solid rgba(255,255,255,0.03);
  top: -160px; left: -160px;
}
.left-panel::after {
  content: '';
  position: absolute;
  width: 350px; height: 350px;
  border-radius: 50%;
  border: 60px solid rgba(255,103,31,0.08);
  bottom: -80px; right: -80px;
}

.brand-logo {
  width: 110px; height: 110px;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid rgba(255,255,255,0.2);
  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
  margin-bottom: 28px;
  position: relative; z-index: 1;
}
.brand-logo-placeholder {
  width: 110px; height: 110px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  border: 4px solid rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 3rem; color: rgba(255,255,255,0.4);
  margin-bottom: 28px;
  position: relative; z-index: 1;
  box-shadow: 0 8px 32px rgba(0,0,0,0.2);
}

.brand-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.55rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.3;
  position: relative; z-index: 1;
  margin-bottom: 8px;
}
.brand-name span { color: var(--saffron); }

.brand-odia {
  font-size: 1rem;
  color: rgba(255,255,255,0.6);
  text-align: center;
  margin-bottom: 32px;
  position: relative; z-index: 1;
}

.brand-sub {
  font-size: .82rem;
  color: rgba(255,255,255,0.45);
  text-align: center;
  letter-spacing: .5px;
  position: relative; z-index: 1;
}

/* Tricolour stripe */
.tri-stripe {
  display: flex;
  gap: 0;
  border-radius: 4px;
  overflow: hidden;
  width: 80px; height: 5px;
  margin: 20px auto 28px;
  position: relative; z-index: 1;
}
.tri-stripe span:nth-child(1) { flex:1; background:#FF9933; }
.tri-stripe span:nth-child(2) { flex:1; background:#fff; }
.tri-stripe span:nth-child(3) { flex:1; background:#138808; }

.features {
  list-style: none;
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative; z-index: 1;
  width: 100%;
  max-width: 280px;
}
.features li {
  display: flex; align-items: center; gap: 12px;
  color: rgba(255,255,255,0.55);
  font-size: .82rem;
}
.features li i {
  width: 30px; height: 30px;
  border-radius: 8px;
  background: rgba(255,255,255,0.07);
  display: flex; align-items: center; justify-content: center;
  color: var(--saffron); font-size: .85rem;
  flex-shrink: 0;
}

/* ════════════════════════════════════
   RIGHT PANEL — Login Form
════════════════════════════════════ */
.right-panel {
  width: 460px;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 44px;
  position: relative;
}

.right-panel::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--saffron), var(--gold), var(--navy));
}

.login-icon {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--navy), #0D3B8C);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 1.4rem;
  margin-bottom: 20px;
  box-shadow: 0 4px 20px rgba(0,48,135,0.25);
}

.login-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.7rem;
  font-weight: 700;
  color: var(--text);
  text-align: center;
  margin-bottom: 6px;
}
.login-sub {
  font-size: .82rem;
  color: var(--muted);
  text-align: center;
  margin-bottom: 32px;
}

/* Error message */
.error-msg {
  width: 100%;
  background: var(--error-bg);
  border: 1px solid rgba(220,38,38,0.2);
  border-radius: 8px;
  padding: 11px 16px;
  color: var(--error-clr);
  font-size: .85rem;
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 20px;
  animation: shake .4s ease;
}
@keyframes shake {
  0%,100%{ transform:translateX(0) }
  20%{ transform:translateX(-8px) }
  40%{ transform:translateX(8px) }
  60%{ transform:translateX(-5px) }
  80%{ transform:translateX(5px) }
}

/* Form */
.login-form { width: 100%; }

.form-group {
  display: flex; flex-direction: column; gap: 7px;
  margin-bottom: 18px;
}
.form-group label {
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--muted);
}

.input-wrap {
  position: relative;
}
.input-wrap i.icon {
  position: absolute;
  left: 14px; top: 50%; transform: translateY(-50%);
  color: #C4C9D4;
  font-size: .9rem;
  pointer-events: none;
  transition: color .2s;
}
.input-wrap input {
  width: 100%;
  padding: 12px 44px 12px 42px;
  border: 1.5px solid #E5E7EB;
  border-radius: 10px;
  font-family: 'DM Sans', sans-serif;
  font-size: .92rem;
  color: var(--text);
  background: #FAFAFA;
  transition: .2s;
  outline: none;
}
.input-wrap input::placeholder { color: #C4C9D4; }
.input-wrap input:focus {
  border-color: var(--navy);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(0,48,135,0.08);
}
.input-wrap input:focus + .icon-left,
.input-wrap:focus-within i.icon { color: var(--navy); }

/* Eye toggle */
.eye-toggle {
  position: absolute;
  right: 12px; top: 50%; transform: translateY(-50%);
  background: none; border: none;
  color: #C4C9D4; cursor: pointer; font-size: .9rem;
  padding: 4px; border-radius: 4px;
  transition: color .2s;
}
.eye-toggle:hover { color: var(--navy); }

/* Remember row */
.remember-row {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 24px;
}
.remember-label {
  display: flex; align-items: center; gap: 8px;
  font-size: .82rem; color: var(--muted); cursor: pointer;
}
.remember-label input[type=checkbox] {
  width: 16px; height: 16px;
  accent-color: var(--navy);
  cursor: pointer;
}
.forgot-link {
  font-size: .78rem; color: var(--navy);
  text-decoration: none; font-weight: 600;
}
.forgot-link:hover { color: var(--saffron); }

/* Submit button */
.btn-login {
  width: 100%;
  padding: 13px;
  background: linear-gradient(135deg, var(--navy), #0D3B8C);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-family: 'DM Sans', sans-serif;
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  letter-spacing: .3px;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  transition: .2s;
  box-shadow: 0 4px 16px rgba(0,48,135,0.2);
}
.btn-login:hover {
  background: linear-gradient(135deg, #002070, var(--navy));
  box-shadow: 0 6px 24px rgba(0,48,135,0.3);
  transform: translateY(-1px);
}
.btn-login:active { transform: translateY(0); }

/* Loading state */
.btn-login.loading { pointer-events: none; opacity: .75; }
.btn-login .spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(255,255,255,0.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin .7s linear infinite;
  display: none;
}
.btn-login.loading .spinner { display: block; }
.btn-login.loading .btn-text { display: none; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Divider */
.divider {
  display: flex; align-items: center; gap: 12px;
  margin: 24px 0 16px;
  color: #D1D5DB; font-size: .75rem;
}
.divider::before, .divider::after {
  content: ''; flex: 1; height: 1px; background: #E5E7EB;
}

/* Back to site */
.back-link {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  color: var(--muted); font-size: .8rem; text-decoration: none;
  transition: color .2s;
}
.back-link:hover { color: var(--saffron); }

/* Footer note */
.login-footer {
  position: absolute; bottom: 20px; left: 0; right: 0;
  text-align: center;
  font-size: .72rem; color: #C4C9D4;
}

/* ════════════════════════════════════
   RESPONSIVE
════════════════════════════════════ */
@media (max-width: 820px) {
  body { flex-direction: column; overflow: auto; }
  .left-panel { padding: 32px 24px; flex: none; }
  .right-panel { width: 100%; padding: 36px 28px 48px; }
  .brand-name { font-size: 1.2rem; }
  .features { display: none; }
}
@media (max-width: 480px) {
  .right-panel { padding: 28px 20px 60px; }
  .login-title { font-size: 1.4rem; }
}
</style>
</head>
<body>

<div class="left-panel">

<div class="brand-logo-placeholder">
    <i class="fas fa-university"></i>
  </div>

<div class="brand-name">
    Maharshi Women's <span>Degree College</span>
  </div>
  <div class="brand-odia">ମହର୍ଷି ମହିଳା ଡିଗ୍ରୀ ମହାବିଦ୍ୟାଳୟ</div>

<p class="brand-sub">Bhubaneswar, Odisha &nbsp;·&nbsp; Est. 1993–94</p>

<ul class="features">
    <li>
      <i class="fas fa-images"></i>
      Manage section-wise photo gallery
    </li>
    <li>
      <i class="fas fa-upload"></i>
      Upload multiple images at once
    </li>
    <li>
      <i class="fas fa-folder-plus"></i>
      Create and organise event sections
    </li>
    <li>
      <i class="fas fa-shield-alt"></i>
      Secure admin-only access
    </li>
  </ul>
</div>

<div class="right-panel">

<h1 class="login-title">Gallery Admin</h1>
  <p class="login-sub">Sign in to manage the picture gallery</p>

<?php if ($error): ?>
  <div class="error-msg">
    <i class="fas fa-exclamation-circle"></i>
    <?= htmlspecialchars($error) ?>
  </div>
  <?php endif; ?>

<div class="form-group">
      <label for="username">Username</label>
      <div class="input-wrap">
        <i class="icon fas fa-user"></i>
        <input
          type="text"
          id="username"
          name="username"
          placeholder="Enter admin username"
          value="<?= htmlspecialchars($_POST['username'] ?? '') ?>"
          required
          autocomplete="username"
        >
      </div>
    </div>

<div class="form-group">
      <label for="password">Password</label>
      <div class="input-wrap">
        <i class="icon fas fa-lock"></i>
        <input
          type="password"
          id="password"
          name="password"
          placeholder="Enter your password"
          required
          autocomplete="current-password"
        >
        <button type="button" class="eye-toggle" id="eyeBtn" title="Show/hide password">
          <i class="fas fa-eye" id="eyeIcon"></i>
        </button>
      </div>
    </div>

<div class="remember-row">
      <label class="remember-label">
        <input type="checkbox" name="remember"> Remember me
      </label>
      <a href="#" class="forgot-link">Forgot password?</a>
    </div>

<button type="submit" class="btn-login" id="loginBtn">
      <div class="spinner"></div>
      <span class="btn-text"><i class="fas fa-sign-in-alt"></i> &nbsp;Sign In</span>
    </button>

</form>

<a href="gallery.php" class="back-link">
    <i class="fas fa-arrow-left"></i> Back to Public Gallery
  </a>

</div>

eyeBtn.addEventListener('click', () => {
  const show = passInp.type === 'password';
  passInp.type  = show ? 'text' : 'password';
  eyeIcon.className = show ? 'fas fa-eye-slash' : 'fas fa-eye';
});

// ── Loading state on submit ──────────────────────────────────────────────────
document.getElementById('loginForm').addEventListener('submit', function () {
  const btn = document.getElementById('loginBtn');
  btn.classList.add('loading');
});

// ── Focus first empty field ──────────────────────────────────────────────────
window.addEventListener('DOMContentLoaded', () => {
  const u = document.getElementById('username');
  const p = document.getElementById('password');
  (u.value ? p : u).focus();
});
</script>

</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: gallery_login.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation