Ignore:
Timestamp:
09/04/26 19:08:08 (2 weeks ago)
Author:
MBK <marija.karapandzova@…>
Branches:
master
Children:
cdcff72
Parents:
e1f74f6
Message:

Fix frontend appearance

File:
1 edited

Legend:

Unmodified
Added
Removed

  • frontend/src/pages/Login.js

    re1f74f6 r9af201e  
    7575
    7676  return (
    77       <div className="min-h-screen bg-blue-200 flex items-center justify-center p-4">
    78         <div className="bg-white rounded-lg shadow-2xl p-8 w-full max-w-md">
    79           <div className="text-center mb-8">
    80             <h1 className="text-5xl font-bold text-purple-600 mb-2">Medora</h1>
    81             <p className="text-gray-600">Hospital Management System</p>
     77    <div className="min-h-screen bg-blue-200 flex items-center justify-center p-4">
     78      <div className="bg-white rounded-lg shadow-2xl p-8 w-full max-w-md">
     79        <div className="text-center mb-8">
     80          <h1 className="text-5xl font-bold text-purple-600 mb-2">Medora</h1>
     81          <p className="text-gray-600">Hospital Management System</p>
     82        </div>
     83
     84        {error && <ErrorAlert message={error} onClose={() => setError(null)} />}
     85        {success && <SuccessAlert message={success} onClose={() => setSuccess(null)} />}
     86
     87        <form onSubmit={handleLogin} className="space-y-6">
     88          <div>
     89            <label className="block text-sm font-normal text-gray-700 mb-2">
     90              Username (EMBG for Patients)
     91            </label>
     92            <input
     93              type="text"
     94              value={username}
     95              onChange={(e) => setUsername(e.target.value)}
     96              placeholder="Enter your username or EMBG"
     97              className="w-full px-4 py-3 border-2 border-gray-300 rounded-lg focus:outline-none focus:border-purple-500 transition"
     98              disabled={loading}
     99            />
    82100          </div>
    83101
    84           {error && <ErrorAlert message={error} onClose={() => setError(null)} />}
    85           {success && <SuccessAlert message={success} onClose={() => setSuccess(null)} />}
     102          <div>
     103            <label className="block text-sm font-normal text-gray-700 mb-2">
     104              Password
     105            </label>
     106            <input
     107              type="password"
     108              value={password}
     109              onChange={(e) => setPassword(e.target.value)}
     110              placeholder="Enter your password"
     111              className="w-full px-4 py-3 border-2 border-gray-300 rounded-lg focus:outline-none focus:border-purple-500 transition"
     112              disabled={loading}
     113            />
     114          </div>
    86115
    87           <form onSubmit={handleLogin} className="space-y-6">
    88             <div>
    89               <label className="block text-sm font-normal text-gray-700 mb-2">
    90                 Username (EMBG for Patients)
    91               </label>
    92               <input
    93                   type="text"
    94                   value={username}
    95                   onChange={(e) => setUsername(e.target.value)}
    96                   placeholder="Enter your username or EMBG"
    97                   className="w-full px-4 py-3 border-2 border-gray-300 rounded-lg focus:outline-none focus:border-purple-500 transition"
    98                   disabled={loading}
    99               />
    100             </div>
     116          <button
     117            type="submit"
     118            disabled={loading}
     119            className="w-full bg-purple-600 text-white font-bold py-3 rounded-lg hover:bg-purple-700 transition disabled:opacity-50 disabled:cursor-not-allowed"
     120          >
     121            {loading ? 'Logging in...' : 'Login'}
     122          </button>
     123        </form>
    101124
    102             <div>
    103               <label className="block text-sm font-normal text-gray-700 mb-2">
    104                 Password
    105               </label>
    106               <input
    107                   type="password"
    108                   value={password}
    109                   onChange={(e) => setPassword(e.target.value)}
    110                   placeholder="Enter your password"
    111                   className="w-full px-4 py-3 border-2 border-gray-300 rounded-lg focus:outline-none focus:border-purple-500 transition"
    112                   disabled={loading}
    113               />
    114             </div>
    115 
    116             <button
    117                 type="submit"
    118                 disabled={loading}
    119                 className="w-full bg-purple-600 text-white font-bold py-3 rounded-lg hover:bg-purple-700 transition disabled:opacity-50 disabled:cursor-not-allowed"
    120             >
    121               {loading ? 'Logging in...' : 'Login'}
    122             </button>
    123           </form>
    124 
    125           <div className="mt-8 p-4 bg-purple-50 rounded-lg border border-purple-200">
    126             <p className="text-sm text-gray-700 font-normal mb-2">Demo Credentials:</p>
    127             <p className="text-sm text-gray-600 mb-2">
    128               <strong>Admin:</strong> username: admin | password: admin123
    129             </p>
    130             <p className="text-sm text-gray-600 mb-2">
    131               <strong>Doctor:</strong> username: ivan.stojanov@medora.com | password: doctor123
    132             </p>
    133             <p className="text-sm text-gray-600">
    134               <strong>Patient:</strong> username: [EMBG] | password: password123
    135             </p>
    136           </div>
     125        <div className="mt-8 p-4 bg-purple-50 rounded-lg border border-purple-200">
     126          <p className="text-sm text-gray-700 font-normal mb-2">Demo Credentials:</p>
     127          <p className="text-sm text-gray-600 mb-2">
     128            <strong>Admin:</strong> username: admin | password: admin123
     129          </p>
     130          <p className="text-sm text-gray-600 mb-2">
     131            <strong>Doctor:</strong> username: ivan.stojanov@medora.com | password: doctor123
     132          </p>
     133          <p className="text-sm text-gray-600">
     134            <strong>Patient:</strong> username: [EMBG] | password: password123
     135          </p>
    137136        </div>
    138137      </div>
     138    </div>
    139139  );
    140140}
Note: See TracChangeset for help on using the changeset viewer.