@charset "utf-8"; /* * ПАРАЛЛЕЛЬ LXX ↔ МТ. Еврейскую половину рисует рендерер еврейского раздела, * поэтому его стили (../OTH/oth.css) подключены страницей ПЕРВЫМИ и здесь не * повторяются: морфемы, огласовки, направление письма, подсказки — всё оттуда. * Тут только то, чего в еврейском разделе нет: две колонки, средний столбец со * знаком соответствия и греческое слово. */ body.par.chapter { padding: 6px 6px 30px; } body.par.chapter .page { padding: 6px 10px 20px; } /* ---- строка параллели ---- */ /* Три колонки: греческая, знак, еврейская. Ширина колонок равная, знак — узкий столбик посередине. align-items: stretch, чтобы вертикальная линия между половинами шла на всю высоту строки. */ .rows { display: block; } .row { display: grid; grid-template-columns: 1fr 2.4em 1fr; gap: 0; border-top: 1px solid #e8e0cc; } .row:first-child { border-top: 0; } .row.shs { background: #ffddff; } .gcol, .hcol { display: flex; align-items: flex-start; gap: 8px; padding: 6px 8px; min-width: 0; } .hcol { direction: rtl; } .gcol { border-right: 1px solid #efe8d6; } .hcol { border-left: 1px solid #efe8d6; } /* Номер стиха — тот же вид, что в обеих половинах по отдельности. */ .row .vn { flex: 0 0 auto; font-size: 13px; color: #b0442c; font-weight: bold; min-width: 2em; padding-top: 4px; direction: ltr; unicode-bidi: isolate; } .row .vn a { color: inherit; border-bottom: 1px dotted #b0442c; } .row .vn a:hover { background: #fbeee4; text-decoration: none; } .row .vn .sh { color: #8a7f66; margin-left: 2px; cursor: help; } /* ---- знак соответствия ---- */ /* Средний столбец — то, ради чего раздел и заводится. Спокойный серый у совпадения, цвет у расхождения: страница не должна пестрить там, где две традиции согласны, а согласны они в двух третях глав. */ .row .mid { display: flex; align-items: center; justify-content: center; font-size: 15px; color: #a9a08c; cursor: help; user-select: none; background: #faf6e9; border-left: 1px solid #efe8d6; border-right: 1px solid #efe8d6; } .row:not(.same) .mid { color: #b0442c; font-weight: bold; background: #fdf3e4; } /* ---- греческое слово ---- */ /* Столбик «слово над глоссом» — тот же порядок, что в греческо-русском подстрочнике; шрифт греческого крупнее глосса, глосс синий, как и там. */ .gwords { flex: 1 1 auto; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 2px 10px; min-width: 0; } .gwd { display: flex; flex-direction: column; align-items: center; padding: 0 3px; border-bottom: 1px dotted #e0d8c4; } .gwd:hover { background: #fff4d8; } .gk { font-family: 'Palatino Linotype', Palatino, Georgia, 'Times New Roman', serif; font-size: 21px; line-height: 1.35; color: #1a1a1a; white-space: nowrap; } a.gk:hover { text-decoration: none; } /* Гарнитура глосса — из ../OTH/oth.css (--rus), а не Georgia страницы: знак ударения U+0301 в Georgia имеет свою ширину и рвёт слово посередине. Разбор и замер — там же, у самой переменной. Еврейская половина берёт то же правило от .mo .ru, здесь — греческая. */ .gru { font-family: var(--rus); font-size: 13px; color: #123c8c; text-align: center; line-height: 1.25; } /* Строка чтения под греческим словом — тот же вид и то же место, что у чтения под еврейской морфемой (.mo .tr в ../OTH/oth.css): между словом и глоссом, мельче и глуше обоих. Показывается тем же классом body.show-tr. */ .gtr { font-size: 10px; color: #7a7060; line-height: 1.2; white-space: nowrap; display: none; } body.show-tr .gtr { display: block; } a.gru:hover { text-decoration: underline; } /* ---- языки подстрочного перевода ---- */ /* * Русская строка видна, пока читатель не сказал обратного; украинская — только * по явному «да». Разноимённые умолчания нарочно, как во всём собрании: * страница того, кто в настройки не заходил, выглядит ровно как до появления * второго языка. * * Класс ставит par.js на — туда же, где его ждёт еврейская половина * (../OTH/oth.css, правила .mo .ru и .mo .uk). Поэтому один флажок правит обе * колонки сразу, и своего правила для еврейской половины здесь нет. */ body.lng-ru-off .gru { display: none; } .guk { display: none; font-family: var(--rus); font-size: 13px; color: #2a6048; text-align: center; line-height: 1.25; } body.lng-uk-on .guk { display: block; } /* Без русского украинский занимает его место — и его цвет: зелёный заведён, чтобы отличать вторую строку от первой, а второй строки тут уже нет. Ровно так же поступает еврейская половина (.mo .uk в ../OTH/oth.css). */ body.lng-ru-off .guk { color: #123c8c; } /* Пустая половина: там, где у одной традиции текста нет вовсе. */ .none { font-size: 12px; color: #9a9280; font-style: italic; padding-top: 5px; direction: ltr; unicode-bidi: isolate; } /* ---- «только расхождения» ---- */ body.only-diff .row.same { display: none; } /* ---- полоса глав ---- */ /* * Глава, где традиции разошлись, помечена ПОДЧЁРКИВАНИЕМ, а не цветом и не * жирностью. В этой полосе цветом не помечено ничего, а жирным становится * наведение, — красный жирный номер читался как «тут ошибка» вместо «сюда * стоит заглянуть». Пунктир кирпичного цвета под синим номером — тот же знак * «здесь есть что показать», что под номером стиха в подстрочнике. Текущая * глава помечается своим способом (класс .cur из SUPP/booknav.js) и с этой * пометкой не спорит. */ body.par #nav a.d { border-bottom: 1px dotted #b0442c; } body.par #nav .leg { font-size: 12px; color: #6f6553; margin-left: 10px; } /* ---- предисловие ---- */ /* * Предисловие — связная ПРОЗА, а не подстрочник, и колонка ему нужна узкая и * посередине. Правило взято у титульных страниц соседних разделов (SHV/shv.css * и SHP/shp.css: ровно «max-width: 58em; margin: 0 auto»), чтобы страница не * выпадала из оформления сайта. * * Заодно снимается ограничение в 46em, которое ../OTH/oth.css ставит абзацам: * оно рассчитано на страницу во всю ширину, а внутри колонки в 58em даёт * второй, лишний край — текст обрывался бы, не доходя до края подложки. */ body.intro.par { padding: 14px 10px 30px; } body.intro.par .page.intro { max-width: 58em; margin: 0 auto; padding: 14px 26px 30px; } body.intro.par .page.intro p, body.intro.par .page.intro ul { max-width: none; } .page.intro .lead { font-size: 16px; line-height: 1.55; } .page.intro ul.marks { line-height: 1.5; } .page.intro ul.marks .m { display: inline-block; min-width: 1.4em; color: #b0442c; } .page.intro .hint { font-size: 13px; color: #6f6553; } table.books { border-collapse: collapse; margin: 8px 0 4px; font-size: 14px; } table.books th { text-align: left; font-weight: normal; color: #6f6553; border-bottom: 1px solid #ded5be; padding: 2px 10px 2px 0; font-size: 12px; } table.books td { padding: 1px 10px 1px 0; border-bottom: 1px solid #f1ebda; } table.books td:not(:first-child) { text-align: right; color: #55503f; } table.books tr.has-diff td:first-child a { font-weight: bold; } /* ---- узкий экран ---- */ /* Колонки складываются одна под другую, знак соответствия уезжает в подпись строки: две подстрочные строки рядом в 360 пикселях не помещаются никак. */ @media (max-width: 700px) { .row { grid-template-columns: 1fr; } .gcol { border-right: 0; border-bottom: 1px dashed #ece4d0; } .hcol { border-left: 0; } .row .mid { justify-content: flex-start; padding: 2px 8px; font-size: 13px; border: 0; background: transparent; } }