/* Конвертер PPK ↔ OpenSSH: /tools/ppk-to-openssh/ и русский близнец. * * Только то, чего нет в tools.css: поле выбора файла, выбор направления, * строка «что найдено в поле» и поле вывода закрытого ключа. tools.css * общий для шести страниц и стоит у них в с хэшем — править его ради * одной страницы значило бы переиздавать все шесть. * * Всё, где может оказаться вставленное или выбранное человеком (имя файла, * комментарий ключа, имя алгоритма), — системным моноширинным шрифтом * (--font-mono-local из tools.css): веб-шрифт сайта разбит по unicode-range и * докачивал бы поднаборы уже после загрузки страницы. */ /* Выбор файла. Имя выбранного файла браузер рисует шрифтом поля — поэтому системный. Кнопку внутри поля красим под остальные. */ .tool-file { display: block; width: 100%; margin-top: 10px; font-family: var(--font-mono-local); font-size: 13px; color: var(--text-dim); } .tool-file::file-selector-button { margin-right: 12px; padding: 7px 14px; font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border-strong); border-radius: 6px; cursor: pointer; } .tool-file::file-selector-button:hover { border-color: var(--border-hover); } .tool-file:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; } /* Что найдено в поле: формат, версия, зашифрован ли, тип ключа. */ .ppk-detected { min-height: 1.6em; margin: 8px 0 0; font-size: 13px; color: var(--text-quiet); } .ppk-detected code, .ppk-dyn code, .tool-error code { padding: 0; font-family: var(--font-mono-local); font-size: 0.95em; color: var(--text-dim); background: none; border: 0; overflow-wrap: anywhere; } /* Направление перевода — радиокнопки, а не список: три варианта видны сразу. */ .tool-choice { margin: 0 0 16px; padding: 0; border: 0; } .tool-choice legend { margin-bottom: 8px; padding: 0; font-size: 14px; font-weight: 500; color: var(--text); } .tool-choice label { display: flex; align-items: baseline; gap: 9px; margin: 0 0 7px; font-size: 14px; color: var(--text-dim); cursor: pointer; } .tool-choice input { flex: none; accent-color: var(--accent); } /* Состояние загрузки и счёта — рядом с кнопкой. */ .ppk-status { margin: 12px 0 0; font-size: 13px; color: var(--text-quiet); } .ppk-status[hidden] { display: none; } .tool-actions .btn[disabled] { opacity: 0.6; cursor: progress; } /* Итог одной строкой: тип, длина, комментарий, откуда прочитан. Обычный абзац, а не .tool-verdict: у того flex, и каждый кусок текста становится отдельным элементом ряда. */ .ppk-summary { margin: 0 0 14px; font-size: 16px; color: var(--text); } /* Закрытый ключ на выходе: только чтение, строки не переносятся. */ .ppk-out { min-height: 160px; color: var(--text-dim); background: var(--bg); } .ppk-out-state { margin: 0 0 10px; font-size: 13px; color: var(--text-quiet); } /* Вторичные кнопки под выводом: у