strongswan-ext/src/frontends/android/docs/design/final-2026/F_Log.dc.html

<!doctype html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Журнал</title>
<script src="./support.js"></script>
</head>
<body>
<x-dc>
<helmet>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&amp;display=swap">
<style>
body{margin:0}
a{color:#6D4AFF}a:hover{color:#4B2FD1}
</style>
</helmet>
<div style="position: relative; width: 390px; height: 1000px; box-sizing: border-box; background: #FCF8FF; font-family: 'Manrope', system-ui, sans-serif; color: #1C1B20; overflow: hidden; display: flex; flex-direction: column">
  <header style="display: flex; align-items: center; gap: 8px; padding: 16px 12px 8px">
    <a href="F_Diag.dc.html" aria-label="Назад" style="width: 44px; height: 44px; border-radius: 22px; display: flex; align-items: center; justify-content: center; color: #1C1B20">
      <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M15 6l-6 6 6 6"/></svg>
    </a>
    <h1 style="margin: 0; flex: 1; font-size: 22px; font-weight: 800">Журнал</h1>
    <button aria-label="Скопировать журнал" style="width: 44px; height: 44px; border: 0; border-radius: 22px; background: #F0ECF4; color: #3B2C88; display: flex; align-items: center; justify-content: center">
      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="8" y="8" width="12" height="12" rx="2"/><path d="M16 8V5a1 1 0 0 0-1-1H5a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h3"/></svg>
    </button>
  </header>

  <div style="flex: 1; padding: 0 16px 24px; display: flex; flex-direction: column; gap: 12px; min-height: 0">
    <div style="display: flex; gap: 8px">
      <button aria-pressed="true" style="height: 34px; padding: 0 12px; border-radius: 12px; border: 0; background: #3B2C88; color: #FFFFFF; font: 700 13px 'Manrope', sans-serif">Важное</button>
      <button aria-pressed="false" style="height: 34px; padding: 0 12px; border-radius: 12px; border: 1px solid #C9C5D0; background: transparent; color: #1C1B20; font: 600 13px 'Manrope', sans-serif">Всё</button>
      <button aria-pressed="false" style="height: 34px; padding: 0 12px; border-radius: 12px; border: 1px solid #C9C5D0; background: transparent; color: #1C1B20; font: 600 13px 'Manrope', sans-serif">Ошибки</button>
    </div>

    <section style="flex: 1; min-height: 0; border-radius: 22px; background: #1C1B20; padding: 14px; display: flex; flex-direction: column; gap: 6px; overflow: hidden">
      <sc-for list="{{lines}}" as="l" hint-placeholder-count="14">
        <div style="display: flex; gap: 10px; font: 500 12px/1.45 ui-monospace, 'Cascadia Mono', Menlo, monospace">
          <span style="flex: none; color: #79767F">{{l.t}}</span>
          <span style="color: {{l.c}}">{{l.m}}</span>
        </div>
      </sc-for>
    </section>

    <div style="padding: 12px 14px; border-radius: 18px; background: #F3EEFF; font-size: 13px; line-height: 1.45; color: #2A2640">В отчёт попадут журнал подключения и версия приложения.</div>
    <a href="F_Share.dc.html" style="height: 56px; border-radius: 18px; background: #6D4AFF; color: #FFFFFF; text-decoration: none; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800">Отправить отчёт</a>
  </div>
</div>
</x-dc>
<script type="text/x-dc" data-dc-script data-props='{"$preview":{"width":390,"height":1000}}'>
class Component extends DCLogic {
  renderVals() {
    var W = '#E5E1E9', G = '#7CE3B0', A = '#FFB869', P = '#C4B2FF';
    var L = [
      ['14:02:11', 'Сеть: мобильная (LTE)', W], ['14:02:12', 'IKE_SA_INIT → nl1 :4500', W], ['14:02:27', 'Нет ответа 15 с — таймаут', A],
      ['14:02:27', 'Проверка: только сайты РФ отвечают', A], ['14:02:28', 'Белые списки обнаружены', A], ['14:02:28', 'Переключение на «Москва (мост)»', P],
      ['14:02:29', 'IKE_SA_INIT → msk-bridge :4500', W], ['14:02:29', 'IKE_AUTH: сертификат принят', G], ['14:02:30', 'CHILD_SA установлен', G],
      ['14:02:30', 'Маршруты: РФ напрямую, 12 480 сетей', W], ['14:02:30', 'Приложений напрямую: 24', W], ['14:02:31', 'Туннель работает · 52 мс', G],
      ['14:05:40', 'Госуслуги: 7 отказов через VPN', A], ['14:05:41', 'Подсказка: пустить напрямую', P]
    ];
    return { lines: L.map(function (x) { return { t: x[0], m: x[1], c: x[2] }; }) };
  }
}
</script>
</body>
</html>