feat(frontend): refresh UI with warm fintech redesign

frontend/src/components/DataSection.tsx

@@ -34,16 +34,16 @@ export function DataSection() {
 
   return (
     <div className="data-section">
-      <div className="section-block">
+      <div className="data-section__block">
         <h3>История импортов</h3>
-        <p className="section-desc">
+        <p className="data-section__description">
           Список импортов выписок. Можно удалить операции конкретного импорта.
         </p>
         {imports.length === 0 ? (
-          <p className="muted">Импортов пока нет.</p>
+          <p className="muted-text">Импортов пока нет.</p>
         ) : (
-          <div className="table-responsive">
-            <table className="table">
+          <div className="table-shell">
+            <table className="data-table">
               <thead>
                 <tr>
                   <th>Дата</th>
@@ -67,7 +67,7 @@ export function DataSection() {
                     <td>
                       <button
                         type="button"
-                        className="btn btn-sm btn-danger"
+                        className="button button--danger button--small"
                         onClick={() => setImpToDelete(imp)}
                         disabled={imp.importedCount === 0}
                       >
@@ -82,15 +82,15 @@ export function DataSection() {
         )}
       </div>
 
-      <div className="section-block">
+      <div className="data-section__block">
         <h3>Очистка данных</h3>
-        <p className="section-desc">
+        <p className="data-section__description">
           Очистить историю операций (все транзакции). Счета, категории и
           правила сохранятся.
         </p>
         <button
           type="button"
-          className="btn btn-danger"
+          className="button button--danger"
           onClick={() => setShowClearModal(true)}
         >
           Очистить историю