From 2fbd2f4a1053b0481c6b0660264ba30559d642c3 Mon Sep 17 00:00:00 2001 From: Dauren777 Date: Wed, 3 Jun 2026 12:18:19 +0000 Subject: [PATCH] =?UTF-8?q?=D0=93=D1=80=D0=B0=D1=84=D0=B8=D0=BA=20=D0=9F?= =?UTF-8?q?=D0=90=D0=91,=20=D0=BA=D0=B2=D0=BE=D1=82=D1=8B=20=D0=BF=D0=BE?= =?UTF-8?q?=20=D0=B4=D0=BE=D0=BB=D0=B6=D0=BD=D0=BE=D1=81=D1=82=D1=8F=D0=BC?= =?UTF-8?q?,=20=D1=80=D0=B5=D0=B3=D0=B8=D0=BE=D0=BD=D1=8B/=D1=84=D0=B8?= =?UTF-8?q?=D0=BB=D0=B8=D0=B0=D0=BB=D1=8B,=20=D1=83=D0=B2=D0=B5=D0=B4?= =?UTF-8?q?=D0=BE=D0=BC=D0=BB=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=BE=D0=B1=20?= =?UTF-8?q?=D0=BE=D1=82=D1=81=D1=82=D0=B0=D0=B2=D0=B0=D0=BD=D0=B8=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 1383 +++++++++++++++++++--------------------------------- 1 file changed, 513 insertions(+), 870 deletions(-) diff --git a/index.html b/index.html index b7ed775..17e11cf 100644 --- a/index.html +++ b/index.html @@ -10,242 +10,169 @@ --ink:#0F1218; --cyan:#00B4D8; --cyan-light:#48CAE4; --cyan-bg:#E0F7FA; --white:#FFFFFF; --gray-500:#5B6573; --gray-100:#F2F4F7; --gray-200:#E2E6EB; --red:#E63946; --red-bg:#FFEBED; --green:#2D6A4F; --green-bg:#EDF7F0; + --orange:#E76F51; --orange-bg:#FFF3EF; --yellow:#F4A261; --radius:8px; --radius-lg:14px; --shadow:0 2px 12px rgba(0,0,0,0.06); } *{box-sizing:border-box;margin:0;padding:0} -body{ - font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif; - color:var(--ink); background:var(--gray-100); min-height:100vh; -} +body{font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;color:var(--ink);background:var(--gray-100);min-height:100vh} /* ===== LOGIN ===== */ -.login-screen{ - display:flex; align-items:center; justify-content:center; min-height:100vh; - background:linear-gradient(135deg, var(--ink) 0%, #1a2332 100%); -} -.login-card{ - background:var(--white); border-radius:var(--radius-lg); padding:48px 40px; - width:100%; max-width:440px; box-shadow:0 8px 40px rgba(0,0,0,0.2); -} -.login-card .logo{text-align:center; margin-bottom:32px} -.login-card .logo .icon{font-size:48px; display:block; margin-bottom:8px} -.login-card .logo h1{font-size:22px; font-weight:800; color:var(--ink)} -.login-card .logo p{font-size:14px; color:var(--gray-500); margin-top:4px} -.form-group{margin-bottom:18px} -.form-group label{display:block; font-size:12px; font-weight:700; color:var(--gray-500); - margin-bottom:5px; text-transform:uppercase; letter-spacing:0.5px} -.form-group input,.form-group select,.form-group textarea{ - width:100%; padding:10px 12px; border:2px solid var(--gray-200); border-radius:var(--radius); - font-size:14px; font-family:inherit; color:var(--ink); background:var(--white); - transition:border-color .2s; outline:none; -} +.login-screen{display:flex;align-items:flex-start;justify-content:center;min-height:100vh;background:linear-gradient(135deg,var(--ink)0%,#1a2332 100%);padding:40px 20px} +.login-card{background:var(--white);border-radius:var(--radius-lg);padding:40px 36px;width:100%;max-width:520px;box-shadow:0 8px 40px rgba(0,0,0,0.2)} +.login-card .logo{text-align:center;margin-bottom:24px} +.login-card .logo .icon{font-size:40px;display:block;margin-bottom:6px} +.login-card .logo h1{font-size:20px;font-weight:800;color:var(--ink)} +.login-card .logo p{font-size:13px;color:var(--gray-500);margin-top:2px} +.form-group{margin-bottom:14px} +.form-group label{display:block;font-size:11px;font-weight:700;color:var(--gray-500);margin-bottom:4px;text-transform:uppercase;letter-spacing:0.5px} +.form-group input,.form-group select,.form-group textarea{width:100%;padding:9px 10px;border:2px solid var(--gray-200);border-radius:var(--radius);font-size:13px;font-family:inherit;color:var(--ink);background:var(--white);transition:border-color .2s;outline:none} .form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--cyan)} -.form-group textarea{resize:vertical; min-height:60px} -.btn{ - display:inline-flex; align-items:center; justify-content:center; gap:6px; - padding:10px 20px; border-radius:var(--radius); font-size:14px; font-weight:700; - border:none; cursor:pointer; text-decoration:none; font-family:inherit; - transition:all .2s; white-space:nowrap; -} -.btn-primary{background:var(--cyan); color:var(--white)} +.form-group textarea{resize:vertical;min-height:60px} +.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px} +.form-row.col3{grid-template-columns:1fr 1fr 1fr} +.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 20px;border-radius:var(--radius);font-size:14px;font-weight:700;border:none;cursor:pointer;text-decoration:none;font-family:inherit;transition:all .2s;white-space:nowrap} +.btn-primary{background:var(--cyan);color:var(--white)} .btn-primary:hover{background:var(--cyan-light)} -.btn-danger{background:var(--red); color:var(--white)} +.btn-danger{background:var(--red);color:var(--white)} .btn-danger:hover{background:#c1121f} -.btn-outline{background:transparent; color:var(--ink); border:2px solid var(--gray-200)} -.btn-outline:hover{border-color:var(--cyan); color:var(--cyan)} -.btn-sm{padding:6px 14px; font-size:12px} +.btn-outline{background:transparent;color:var(--ink);border:2px solid var(--gray-200)} +.btn-outline:hover{border-color:var(--cyan);color:var(--cyan)} +.btn-sm{padding:6px 14px;font-size:12px} .btn-block{width:100%} - .login-error{color:var(--red); font-size:13px; text-align:center; margin-top:12px; display:none} -.login-tabs{display:flex; gap:0; margin-bottom:24px; border-radius:var(--radius); overflow:hidden; border:2px solid var(--gray-200)} -.login-tab{flex:1; padding:10px; text-align:center; font-size:14px; font-weight:700; cursor:pointer; background:var(--white); color:var(--gray-500); transition:all .2s; border:none; font-family:inherit} -.login-tab.active{background:var(--cyan); color:var(--white); border-color:var(--cyan)} +.login-error{color:var(--red);font-size:12px;text-align:center;margin-top:10px;display:none} +.login-tabs{display:flex;gap:0;margin-bottom:20px;border-radius:var(--radius);overflow:hidden;border:2px solid var(--gray-200)} +.login-tab{flex:1;padding:8px;text-align:center;font-size:13px;font-weight:700;cursor:pointer;background:var(--white);color:var(--gray-500);transition:all .2s;border:none;font-family:inherit} +.login-tab.active{background:var(--cyan);color:var(--white)} .login-tab:first-child{border-right:1px solid var(--gray-200)} .login-form{display:none} .login-form.active{display:block} -.register-success{background:var(--green-bg); border:1px solid var(--green); border-radius:var(--radius); padding:12px 16px; color:var(--green); font-weight:600; text-align:center; margin-top:12px; display:none} +.register-success{background:var(--green-bg);border:1px solid var(--green);border-radius:var(--radius);padding:10px 14px;color:var(--green);font-weight:600;text-align:center;margin-top:10px;display:none} /* ===== APP ===== */ .app-screen{display:none} -.app-header{ - background:var(--ink); color:var(--white); padding:0 24px; - display:flex; align-items:center; justify-content:space-between; height:56px; - position:sticky; top:0; z-index:100; box-shadow:0 2px 8px rgba(0,0,0,0.15); -} -.app-header .logo-area{display:flex; align-items:center; gap:8px; font-weight:700; font-size:15px} +.app-header{background:var(--ink);color:var(--white);padding:0 24px;display:flex;align-items:center;justify-content:space-between;height:56px;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,0.15)} +.app-header .logo-area{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px} .app-header .logo-area .icon{font-size:22px} -.app-header nav{display:flex; gap:4px} -.app-header nav a{ - color:#9aa3b2; text-decoration:none; padding:7px 14px; border-radius:var(--radius); - font-size:13px; font-weight:600; transition:all .2s; -} -.app-header nav a:hover,.app-header nav a.active{color:var(--white); background:rgba(255,255,255,0.08)} -.app-header .user-area{display:flex; align-items:center; gap:10px; font-size:13px} -.app-header .user-area .role{color:var(--cyan-light); font-weight:600} -.app-content{max-width:1100px; margin:0 auto; padding:28px 24px} +.app-header nav{display:flex;gap:4px} +.app-header nav a{color:#9aa3b2;text-decoration:none;padding:7px 14px;border-radius:var(--radius);font-size:13px;font-weight:600;transition:all .2s} +.app-header nav a:hover,.app-header nav a.active{color:var(--white);background:rgba(255,255,255,0.08)} +.app-header .user-area{display:flex;align-items:center;gap:10px;font-size:13px} +.app-header .user-area .role{color:var(--cyan-light);font-weight:600} +.app-content{max-width:1140px;margin:0 auto;padding:24px 24px} .panel{display:none} .panel.active{display:block} - -/* ===== PAGE HEADER ===== */ .page-header{margin-bottom:24px} -.page-header h2{font-size:26px; font-weight:800; margin-bottom:6px} -.page-header p{color:var(--gray-500); font-size:15px} +.page-header h2{font-size:26px;font-weight:800;margin-bottom:6px} +.page-header p{color:var(--gray-500);font-size:15px} + +/* ===== SCHEDULE ALERT ===== */ +.schedule-alert{background:var(--orange-bg);border:1px solid var(--orange);border-radius:var(--radius-lg);padding:16px 20px;margin-bottom:20px;display:none;box-shadow:var(--shadow)} +.schedule-alert.show{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px} +.schedule-alert .alert-text{font-size:14px;font-weight:600;color:var(--orange)} +.schedule-alert .alert-btn{white-space:nowrap} +.schedule-alert.danger{background:var(--red-bg);border-color:var(--red)} +.schedule-alert.danger .alert-text{color:var(--red)} + +/* ===== PROGRESS CARD ===== */ +.progress-card{background:var(--white);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow);margin-bottom:16px} +.progress-card h3{font-size:15px;font-weight:700;margin-bottom:4px} +.progress-card .quota-info{font-size:12px;color:var(--gray-500);margin-bottom:10px} +.progress-bar{height:16px;border-radius:8px;background:var(--gray-200);overflow:hidden;margin-bottom:6px} +.progress-fill{height:100%;border-radius:8px;transition:width .5s} +.progress-fill.good{background:var(--green)} +.progress-fill.warn{background:var(--orange)} +.progress-fill.bad{background:var(--red)} +.progress-card .progress-stats{font-size:12px;font-weight:600} /* ===== AUDIT FORM ===== */ .audit-form{max-width:900px} - -/* Header block */ -.form-header{ - background:var(--white); border-radius:var(--radius-lg); padding:24px 28px; - box-shadow:var(--shadow); margin-bottom:16px; -} -.form-header h3{font-size:17px; font-weight:700; margin-bottom:16px; color:var(--ink)} -.header-grid{display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px} +.form-header{background:var(--white);border-radius:var(--radius-lg);padding:24px 28px;box-shadow:var(--shadow);margin-bottom:16px} +.form-header h3{font-size:17px;font-weight:700;margin-bottom:16px;color:var(--ink)} +.header-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px} .header-grid.col2{grid-template-columns:1fr 1fr} .header-grid.col4{grid-template-columns:1fr 1fr 1fr 1fr} -.header-grid .fg label{font-size:11px; font-weight:700; color:var(--gray-500); display:block; margin-bottom:3px; text-transform:uppercase} -.header-grid .fg input,.header-grid .fg select{ - width:100%; padding:8px 10px; border:2px solid var(--gray-200); border-radius:var(--radius); - font-size:13px; font-family:inherit; outline:none; background:var(--white); -} +.header-grid .fg label{font-size:11px;font-weight:700;color:var(--gray-500);display:block;margin-bottom:3px;text-transform:uppercase} +.header-grid .fg input,.header-grid .fg select{width:100%;padding:8px 10px;border:2px solid var(--gray-200);border-radius:var(--radius);font-size:13px;font-family:inherit;outline:none;background:var(--white)} .header-grid .fg input:focus,.header-grid .fg select:focus{border-color:var(--cyan)} - -/* Overall safe/danger toggle */ -.overall-toggle{display:flex; gap:12px; margin-top:12px} -.toggle-btn{ - flex:1; padding:10px; border:2px solid var(--gray-200); border-radius:var(--radius); - text-align:center; cursor:pointer; font-size:13px; font-weight:700; background:var(--white); transition:all .2s; -} -.toggle-btn.safe.selected{border-color:var(--green); background:var(--green-bg); color:var(--green)} -.toggle-btn.danger.selected{border-color:var(--red); background:var(--red-bg); color:var(--red)} - -/* Category section */ -.cat-section{ - background:var(--white); border-radius:var(--radius-lg); box-shadow:var(--shadow); - margin-bottom:12px; overflow:hidden; -} -.cat-header{ - display:flex; align-items:center; justify-content:space-between; - padding:14px 20px; background:var(--gray-100); cursor:pointer; user-select:none; - border-bottom:1px solid var(--gray-200); transition:background .2s; -} +.overall-toggle{display:flex;gap:12px;margin-top:12px} +.toggle-btn{flex:1;padding:10px;border:2px solid var(--gray-200);border-radius:var(--radius);text-align:center;cursor:pointer;font-size:13px;font-weight:700;background:var(--white);transition:all .2s} +.toggle-btn.safe.selected{border-color:var(--green);background:var(--green-bg);color:var(--green)} +.toggle-btn.danger.selected{border-color:var(--red);background:var(--red-bg);color:var(--red)} +.cat-section{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow);margin-bottom:12px;overflow:hidden} +.cat-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--gray-100);cursor:pointer;user-select:none;border-bottom:1px solid var(--gray-200);transition:background .2s} .cat-header:hover{background:var(--gray-200)} -.cat-header .cat-title{font-size:15px; font-weight:700; display:flex; align-items:center; gap:8px} -.cat-header .cat-badge{ - font-size:11px; font-weight:700; padding:3px 10px; border-radius:20px; - background:var(--red-bg); color:var(--red); -} -.cat-header .cat-badge.all-safe{background:var(--green-bg); color:var(--green)} -.cat-header .cat-arrow{font-size:12px; transition:transform .3s; color:var(--gray-500)} +.cat-header .cat-title{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px} +.cat-header .cat-badge{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;background:var(--red-bg);color:var(--red)} +.cat-header .cat-badge.all-safe{background:var(--green-bg);color:var(--green)} +.cat-header .cat-arrow{font-size:12px;transition:transform .3s;color:var(--gray-500)} .cat-header.open .cat-arrow{transform:rotate(180deg)} -.cat-body{display:none; padding:16px 20px} +.cat-body{display:none;padding:16px 20px} .cat-body.open{display:block} - -/* Checklist */ -.checklist{display:grid; grid-template-columns:1fr 1fr; gap:6px 24px} +.checklist{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px} .checklist.col3{grid-template-columns:1fr 1fr 1fr} .checklist.col1{grid-template-columns:1fr} -.check-item{display:flex; align-items:flex-start; gap:8px; padding:6px 0; font-size:13px; cursor:pointer} -.check-item input[type=checkbox]{margin-top:2px; width:16px; height:16px; accent-color:var(--red); cursor:pointer; flex-shrink:0} -.check-item.checked label{color:var(--red); font-weight:600} -.check-item label{cursor:pointer; flex:1} -.check-item .other-input{width:100%; margin-top:4px; padding:6px 8px; border:1px solid var(--gray-200); border-radius:4px; font-size:12px; display:none} +.check-item{display:flex;align-items:flex-start;gap:8px;padding:6px 0;font-size:13px;cursor:pointer} +.check-item input[type=checkbox]{margin-top:2px;width:16px;height:16px;accent-color:var(--red);cursor:pointer;flex-shrink:0} +.check-item.checked label{color:var(--red);font-weight:600} +.check-item label{cursor:pointer;flex:1} +.check-item .other-input{width:100%;margin-top:4px;padding:6px 8px;border:1px solid var(--gray-200);border-radius:4px;font-size:12px;display:none} .check-item.checked .other-input.visible{display:block} - -/* Category footer */ -.cat-footer{ - display:flex; align-items:center; justify-content:space-between; - padding:10px 20px; background:var(--gray-100); border-top:1px solid var(--gray-200); - font-size:12px; color:var(--gray-500); font-weight:600; -} -.cat-footer .total-count{color:var(--red); font-weight:700} +.cat-footer{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:var(--gray-100);border-top:1px solid var(--gray-200);font-size:12px;color:var(--gray-500);font-weight:600} +.cat-footer .total-count{color:var(--red);font-weight:700} .cat-footer .total-count.zero{color:var(--green)} -.all-safe-toggle{ - display:flex; align-items:center; gap:6px; cursor:pointer; font-size:12px; font-weight:700; - padding:4px 12px; border-radius:20px; transition:all .2s; -} -.all-safe-toggle.active{background:var(--green-bg); color:var(--green)} +.all-safe-toggle{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:12px;font-weight:700;padding:4px 12px;border-radius:20px;transition:all .2s} +.all-safe-toggle.active{background:var(--green-bg);color:var(--green)} .all-safe-toggle input{display:none} - -/* Violation table */ -.violations-block{ - background:var(--white); border-radius:var(--radius-lg); padding:20px 24px; - box-shadow:var(--shadow); margin-top:16px; -} -.violations-block h3{font-size:15px; font-weight:700; margin-bottom:14px} -.vio-grid{display:grid; grid-template-columns:40px 1.3fr 1fr 0.8fr 1fr 1fr 1fr 0.8fr 30px; gap:6px; margin-bottom:6px; align-items:end} -.vio-grid.header-row{font-size:11px; font-weight:700; color:var(--gray-500); text-transform:uppercase; margin-bottom:4px} -.vio-grid input,.vio-grid select{ - padding:7px 8px; border:1px solid var(--gray-200); border-radius:var(--radius); - font-size:12px; font-family:inherit; outline:none; width:100%; -} +.violations-block{background:var(--white);border-radius:var(--radius-lg);padding:20px 24px;box-shadow:var(--shadow);margin-top:16px} +.violations-block h3{font-size:15px;font-weight:700;margin-bottom:14px} +.vio-grid{display:grid;grid-template-columns:40px 1.3fr 1fr 0.8fr 1fr 1fr 1fr 0.8fr 30px;gap:6px;margin-bottom:6px;align-items:end} +.vio-grid.header-row{font-size:11px;font-weight:700;color:var(--gray-500);text-transform:uppercase;margin-bottom:4px} +.vio-grid input,.vio-grid select{padding:7px 8px;border:1px solid var(--gray-200);border-radius:var(--radius);font-size:12px;font-family:inherit;outline:none;width:100%} .vio-grid input:focus,.vio-grid select:focus{border-color:var(--cyan)} -.vio-row-num{font-size:12px; font-weight:700; color:var(--gray-500); text-align:center; padding-top:8px} -.remove-vio-btn{background:none; border:none; color:var(--red); cursor:pointer; font-size:18px; padding:4px} - -.form-actions{display:flex; gap:10px; margin-top:20px} -.form-success{ - background:var(--green-bg); border:1px solid var(--green); border-radius:var(--radius); - padding:14px 18px; color:var(--green); font-weight:600; margin-top:14px; display:none; -} +.vio-row-num{font-size:12px;font-weight:700;color:var(--gray-500);text-align:center;padding-top:8px} +.remove-vio-btn{background:none;border:none;color:var(--red);cursor:pointer;font-size:18px;padding:4px} +.form-actions{display:flex;gap:10px;margin-top:20px} +.form-success{background:var(--green-bg);border:1px solid var(--green);border-radius:var(--radius);padding:16px 20px;color:var(--green);font-weight:600;margin-top:14px;display:none} /* ===== DASHBOARD ===== */ -.stats-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-bottom:24px} -.stat-card{ - background:var(--white); border-radius:var(--radius-lg); padding:20px; - box-shadow:var(--shadow); -} -.stat-card .stat-label{font-size:12px; font-weight:700; color:var(--gray-500); text-transform:uppercase; margin-bottom:4px} -.stat-card .stat-value{font-size:32px; font-weight:800; line-height:1} -.stat-card.green .stat-value{color:var(--green)} -.stat-card.red .stat-value{color:var(--red)} -.stat-card.blue .stat-value{color:var(--cyan)} -.charts-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; margin-bottom:24px} -.chart-card{ - background:var(--white); border-radius:var(--radius-lg); padding:20px; - box-shadow:var(--shadow); -} -.chart-card h3{font-size:15px; font-weight:700; margin-bottom:14px} +.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px} +.stat-card{background:var(--white);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow)} +.stat-card .stat-label{font-size:12px;font-weight:700;color:var(--gray-500);text-transform:uppercase;margin-bottom:4px} +.stat-card .stat-value{font-size:32px;font-weight:800;line-height:1} +.stat-card.green .stat-value{color:var(--green)}.stat-card.red .stat-value{color:var(--red)}.stat-card.blue .stat-value{color:var(--cyan)}.stat-card.orange .stat-value{color:var(--orange)} +.charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-bottom:16px} +.chart-card{background:var(--white);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow)} +.chart-card h3{font-size:15px;font-weight:700;margin-bottom:14px} .chart-card canvas{max-height:260px} +.chart-card.wide{grid-column:1/-1} +.chart-card.wide canvas{max-height:200px} + +/* ===== FILTERS ===== */ +.filter-bar{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap;align-items:center} +.filter-bar select,.filter-bar input{padding:8px 12px;border:2px solid var(--gray-200);border-radius:var(--radius);font-size:13px;font-family:inherit;outline:none;background:var(--white)} +.filter-bar select:focus,.filter-bar input:focus{border-color:var(--cyan)} /* ===== HISTORY ===== */ -.table-filters{display:flex; gap:10px; margin-bottom:16px; flex-wrap:wrap} -.table-filters select,.table-filters input{ - padding:8px 12px; border:2px solid var(--gray-200); border-radius:var(--radius); - font-size:13px; font-family:inherit; outline:none; background:var(--white); -} -.table-filters select:focus,.table-filters input:focus{border-color:var(--cyan)} .table-wrap{overflow-x:auto} -.data-table{ - width:100%; border-collapse:collapse; background:var(--white); - border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); font-size:13px; -} -.data-table th{ - background:var(--ink); color:var(--white); padding:11px 14px; text-align:left; - font-size:12px; font-weight:700; text-transform:uppercase; -} -.data-table td{padding:10px 14px; border-bottom:1px solid var(--gray-100)} +.data-table{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);font-size:13px} +.data-table th{background:var(--ink);color:var(--white);padding:11px 14px;text-align:left;font-size:12px;font-weight:700;text-transform:uppercase} +.data-table td{padding:10px 14px;border-bottom:1px solid var(--gray-100)} .data-table tr:hover td{background:var(--gray-100)} -.badge{ - display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:700; -} -.badge-safe{background:var(--green-bg); color:var(--green)} -.badge-danger{background:var(--red-bg); color:var(--red)} -.no-data{text-align:center; padding:40px 20px; color:var(--gray-500)} -.no-data .icon{font-size:40px; display:block; margin-bottom:10px} - -/* Risk bar */ -.risk-bar{display:flex; height:20px; border-radius:10px; overflow:hidden; margin-top:6px} -.risk-safe{background:var(--green); transition:width .5s} -.risk-unsafe{background:var(--red); transition:width .5s} -.risk-labels{display:flex; justify-content:space-between; font-size:11px; color:var(--gray-500); margin-top:3px} - -.view-link{color:var(--cyan); cursor:pointer; font-weight:600; text-decoration:none} +.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700} +.badge-safe{background:var(--green-bg);color:var(--green)}.badge-danger{background:var(--red-bg);color:var(--red)}.badge-warn{background:var(--orange-bg);color:var(--orange)} +.no-data{text-align:center;padding:40px 20px;color:var(--gray-500)} +.no-data .icon{font-size:40px;display:block;margin-bottom:10px} +.risk-bar{display:flex;height:20px;border-radius:10px;overflow:hidden;margin-top:6px} +.risk-safe{background:var(--green);transition:width .5s} +.risk-unsafe{background:var(--red);transition:width .5s} +.risk-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--gray-500);margin-top:3px} +.view-link{color:var(--cyan);cursor:pointer;font-weight:600;text-decoration:none} .view-link:hover{text-decoration:underline} @media (max-width:768px){ - .login-card{padding:28px 20px; margin:12px} - .app-header{padding:0 12px; height:auto; flex-wrap:wrap; gap:6px; padding-top:8px; padding-bottom:8px} - .app-header nav{order:3; width:100%; overflow-x:auto} + .login-card{padding:28px 20px;margin:0;max-width:100%} + .app-header{padding:0 12px;height:auto;flex-wrap:wrap;gap:6px;padding-top:8px;padding-bottom:8px} + .app-header nav{order:3;width:100%;overflow-x:auto} .app-content{padding:16px 12px} .header-grid{grid-template-columns:1fr 1fr} .header-grid.col4{grid-template-columns:1fr 1fr} @@ -253,7 +180,9 @@ body{ .checklist.col3{grid-template-columns:1fr 1fr} .charts-grid{grid-template-columns:1fr} .stats-grid{grid-template-columns:1fr 1fr} - .vio-grid{grid-template-columns:30px 1fr 1fr; row-gap:4px} + .form-row{grid-template-columns:1fr} + .form-row.col3{grid-template-columns:1fr 1fr} + .vio-grid{grid-template-columns:30px 1fr 1fr;row-gap:4px} .vio-grid.header-row{display:none} } @@ -263,58 +192,40 @@ body{
@@ -325,27 +236,25 @@ body{
🛡️ ПАБ Система
-
- - -
+
- + +
+ + +
+ +
-
-

📋 Бланк поведенческого аудита безопасности

-

Заполните все категории наблюдения

-
- +

📋 Бланк поведенческого аудита безопасности

Заполните все категории наблюдения

- -

📝 Данные аудита

@@ -367,8 +276,9 @@ body{
-
-
+
+
+
@@ -378,26 +288,18 @@ body{
- -
- -

📄 Несоответствия и корректирующие меры

-
- №НесоответствиеИсполнительВид нарушенияМерыОтветственное лицоДатаФорма завершения -
+
№НесоответствиеИсполнительВид нарушенияМерыОтветственное лицоДатаФорма завершения
- -
-