Ignore:
Timestamp:
02/13/26 19:32:02 (7 months ago)
Author:
Stefan-Saveski <stefansaveski19@…>
Branches:
master
Children:
d7deae5
Parents:
50f2fb4
Message:

Added dark theme.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • src/app/students/semesters/page.tsx

    r50f2fb4 rba52069  
    4949
    5050const TableCell = ({ children, className = "" }: TableCellProps) => (
    51   <td className={`px-4 py-3 text-sm border-b border-gray-100 ${className}`}>
     51  <td className={`px-4 py-3 text-sm border-b border-border ${className}`}>
    5252    {children}
    5353  </td>
     
    6666  }
    6767  return (
    68     <span className={`${baseClasses} bg-gray-100 text-gray-800`}>
     68    <span className={`${baseClasses} bg-accent text-gray-800`}>
    6969      {t(status) || status}
    7070    </span>
     
    8787    );
    8888  }
    89   return <span className="text-gray-400">—</span>;
     89  return <span className="text-muted-foreground">—</span>;
    9090};
    9191
     
    163163    return (
    164164      <div className="min-h-screen pb-8">
    165         <div className="bg-white rounded-xl shadow-sm border border-gray-100 p-6">
     165        <div className="bg-card rounded-xl shadow-sm border border-border p-6">
    166166          {t('loading')}
    167167        </div>
     
    185185      <div className="bg-primary text-white rounded-xl p-8 mb-8">
    186186        <div className="flex items-center gap-4">
    187           <div className="bg-white bg-opacity-20 rounded-full p-4">
    188             <FontAwesomeIcon icon={faCalendarAlt} className="text-3xl text-primary" />
     187          <div className="bg-white rounded-full p-4">
     188            <FontAwesomeIcon icon={faCalendarAlt} className="text-3xl text-[#0272D1]" />
    189189          </div>
    190190          <div>
     
    198198
    199199      {/* Table Container */}
    200       <div className="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
     200      <div className="bg-card rounded-xl shadow-sm border border-border overflow-hidden">
    201201        <div className="bg-primary text-white px-6 py-4">
    202202          <h2 className="text-xl font-bold">{t('semesters_list')}</h2>
     
    205205        <div className="overflow-x-auto">
    206206          <table className="w-full">
    207             <thead className="bg-gray-50">
     207            <thead className="bg-accent">
    208208              <tr>
    209                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">#</th>
    210                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('semester')}</th>
    211                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('direction')}</th>
    212                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('quota')}</th>
    213                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('note')}</th>
    214                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('student_com')}</th>
    215                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('sum')}</th>
    216                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('paid')}</th>
    217                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('ukim')}</th>
    218                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('created_on')}</th>
    219                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('date_changed')}</th>
    220                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('credits')}</th>
    221                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('type')}</th>
    222                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('doc')}</th>
    223                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('doc1')}</th>
    224                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('verified')}</th>
    225                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('taxes')}</th>
    226                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('signatures')}</th>
    227                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('status')}</th>
    228                 <th className="px-4 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">{t('completed')}</th>
     209                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">#</th>
     210                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('semester')}</th>
     211                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('direction')}</th>
     212                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('quota')}</th>
     213                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('note')}</th>
     214                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('student_com')}</th>
     215                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('sum')}</th>
     216                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('paid')}</th>
     217                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('ukim')}</th>
     218                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('created_on')}</th>
     219                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('date_changed')}</th>
     220                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('credits')}</th>
     221                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('type')}</th>
     222                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('doc')}</th>
     223                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('doc1')}</th>
     224                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('verified')}</th>
     225                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('taxes')}</th>
     226                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('signatures')}</th>
     227                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('status')}</th>
     228                <th className="px-4 py-4 text-left text-xs font-medium text-muted-foreground uppercase tracking-wider">{t('completed')}</th>
    229229              </tr>
    230230            </thead>
    231             <tbody className="divide-y divide-gray-100">
     231            <tbody className="divide-y divide-border">
    232232              {semesters.map((semester) => (
    233                 <tr key={semester.id} className="hover:bg-gray-50 transition-colors">
    234                   <TableCell className="font-medium text-gray-900">{semester.id}</TableCell>
     233                <tr key={semester.id} className="hover:bg-accent transition-colors">
     234                  <TableCell className="font-medium text-card-foreground">{semester.id}</TableCell>
    235235                  <TableCell className="font-medium text-primary">{semester.semester}</TableCell>
    236236                  <TableCell>{semester.direction}</TableCell>
     
    246246                      </span>
    247247                    ) : (
    248                       <span className="text-gray-400">—</span>
     248                      <span className="text-muted-foreground">—</span>
    249249                    )}
    250250                  </TableCell>
     
    255255                      </span>
    256256                    ) : (
    257                       <span className="text-gray-400">—</span>
     257                      <span className="text-muted-foreground">—</span>
    258258                    )}
    259259                  </TableCell>
     
    265265                      </span>
    266266                    ) : (
    267                       <span className="text-gray-400">—</span>
     267                      <span className="text-muted-foreground">—</span>
    268268                    )}
    269269                  </TableCell>
     
    275275                      </span>
    276276                    ) : (
    277                       <span className="text-gray-400">—</span>
     277                      <span className="text-muted-foreground">—</span>
    278278                    )}
    279279                  </TableCell>
     
    282282                      <span className="text-blue-600">{semester.ukim}</span>
    283283                    ) : (
    284                       <span className="text-gray-400">—</span>
    285                     )}
    286                   </TableCell>
    287                   <TableCell className="text-gray-600">{semester.createdOn}</TableCell>
    288                   <TableCell className="text-gray-600">{semester.dateChanged}</TableCell>
     284                      <span className="text-muted-foreground">—</span>
     285                    )}
     286                  </TableCell>
     287                  <TableCell className="text-muted-foreground">{semester.createdOn}</TableCell>
     288                  <TableCell className="text-muted-foreground">{semester.dateChanged}</TableCell>
    289289                  <TableCell className="font-medium text-primary">{semester.credits}</TableCell>
    290290                  <TableCell>
     
    331331      {/* Summary Cards */}
    332332      <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mt-8">
    333         <div className="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
     333        <div className="bg-card rounded-xl p-6 shadow-sm border border-border">
    334334          <div className="flex items-center gap-4">
    335335            <div className="bg-green-100 text-green-600 rounded-full p-3">
     
    337337            </div>
    338338            <div>
    339               <h3 className="text-lg font-bold text-gray-900">{t('completed_semesters')}</h3>
     339              <h3 className="text-lg font-bold text-card-foreground">{t('completed_semesters')}</h3>
    340340              <p className="text-2xl font-bold text-green-600">
    341341                {semesters.filter(s => s.completed !== "Не").length}
     
    345345        </div>
    346346
    347         <div className="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
     347        <div className="bg-card rounded-xl p-6 shadow-sm border border-border">
    348348          <div className="flex items-center gap-4">
    349349            <div className="bg-blue-100 text-blue-600 rounded-full p-3">
     
    351351            </div>
    352352            <div>
    353               <h3 className="text-lg font-bold text-gray-900">{t('verified_semesters')}</h3>
     353              <h3 className="text-lg font-bold text-card-foreground">{t('verified_semesters')}</h3>
    354354              <p className="text-2xl font-bold text-blue-600">
    355355                {semesters.filter(s => s.verified === "Да").length}
     
    359359        </div>
    360360
    361         <div className="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
     361        <div className="bg-card rounded-xl p-6 shadow-sm border border-border">
    362362          <div className="flex items-center gap-4">
    363363            <div className="bg-primary text-white rounded-full p-3">
     
    365365            </div>
    366366            <div>
    367               <h3 className="text-lg font-bold text-gray-900">{t('total_semesters')}</h3>
     367              <h3 className="text-lg font-bold text-card-foreground">{t('total_semesters')}</h3>
    368368              <p className="text-2xl font-bold text-primary">
    369369                {semesters.length}
Note: See TracChangeset for help on using the changeset viewer.