feat: Добавить отображение версии UI в нижнем колонтитуле и улучшить отображение ASN и CIDR с помощью моноширинного шрифта в менеджерах ASNs и IPRanges

frontend/src/components/S3MetaBar.jsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import api from '../lib/api.js';
 import { IconHash, IconClock, IconFileText, IconRefresh } from '@tabler/icons-react';
+import { formatDateTimeWithRelative } from '../lib/datetime.js';
 
 function S3MetaBar({ keys = [], className = '' }) {
   const [meta, setMeta] = useState({});
@@ -35,8 +36,8 @@ function S3MetaBar({ keys = [], className = '' }) {
     const it = meta[k];
     return (
       <div key={k} className="d-flex align-items-center gap-2 flex-wrap">
-        <span className="badge bg-blue-lt text-blue d-inline-flex align-items-center"><IconHash size={14} className="me-1" />{it?.etag || '—'}</span>
-        <span className="badge bg-blue-lt text-blue d-inline-flex align-items-center"><IconClock size={14} className="me-1" />{it?.lastModified ? new Date(it.lastModified).toLocaleString() : '—'}</span>
+        <span className="badge bg-blue-lt text-blue d-inline-flex align-items-center" title="ETag"><IconHash size={14} className="me-1" /><span className="font-monospace">{it?.etag || '—'}</span></span>
+        <span className="badge bg-blue-lt text-blue d-inline-flex align-items-center" title="Время последнего изменения"><IconClock size={14} className="me-1" />{it?.lastModified ? formatDateTimeWithRelative(it.lastModified) : '—'}</span>
         <span className="badge bg-blue-lt text-blue d-inline-flex align-items-center"><IconFileText size={14} className="me-1" />{typeof it?.contentLength === 'number' ? `${it.contentLength} байт` : '—'}</span>
         <button className="btn btn-outline-secondary btn-sm" type="button" onClick={() => copyMeta(k)} title="Копировать ETag/Last-Modified">
           <IconFileText size={14} className="me-1" />Копировать