http://nagaina.rusff.me/ nagaina ru-ru Wed, 19 Aug 2026 14:58:15 +0300 MyBB/mybb.ru http://nagaina.rusff.me/viewtopic.php?pid=55#p55 <p>Для создания гармоничного книжного дизайна на платформе Rusff.me (с учетом возможностей движка по внедрению кастомных CSS) предлагается глубокая, «обволакивающая» цветовая палитра и подробное техническое задание (ТЗ) для верстки/дизайна.<br />------------------------------<br />## Цветовая гамма: «Антикварный кабинет»<br />Эта палитра сочетает глубокие темные фоны для общего антуража и мягкие кремовые оттенки для читаемых зон, чтобы глаза не уставали от долгих текстов.</p> <p>* Основной фон страницы (--bg-body): Глубокий чернильно-синий или угольно-темный (#12141A) — создает ощущение ночного кабинета или старинной библиотеки.<br />* Фон контента и постов (--bg-content): Слоновая кость или состаренный пергамент (#F7F4EB для светлых элементов / #1E222B для карточек в темной теме).<br />* Основной цвет текста (--text-main): Темный графит или горький шоколад (#2B2621) на светлых плашках; мягкий молочный (#EAE6DF) на темных.<br />* Акцентный цвет (Ссылки, кнопки, рамки, активные элементы) (--accent): Приглушенное золото, бронза или терракота (#C5A059 или #A85C38).<br />* Второстепенный акцент (Цитаты, тени, бордеры): Выдержанный бордовый или винный (#5E2A31) либо тусклый мшисто-зеленый.</p> <p>------------------------------<br />## Техническое задание (ТЗ) на разработку книжного дизайна для Rusff.me## 1. Общие требования и структура</p> <p>* Движок: MyBB (Rusff), адаптивная верстка (Desktop + Mobile-friendly фиксы для боковых панелей).<br />* Сетка: Трехколоночная или двухколоночная с фиксированным/плавающим сайдбаром (левая/правая боковая панель для виджетов).<br />* Глобальный стиль: Использование CSS-переменных (variables) для легкой смены или доработки оттенков. Отказ от стандартных табличных «рамок» MyBB в пользу плоских или карточных блоков с мягкими тенями.</p> <p>## 2. Типографика (Шрифты через Google Fonts)</p> <p>* Заголовки (категории, названия тем, ники): Подключить шрифт с засечками Playfair Display или Merriweather.<br />* Основной текст (посты, описания): Подключить шрифты без засечек или мягкие гуманистические шрифты Inter или Open Sans.<br />* Размер шрифта в постах: Не менее 15px, межстрочный интервал (line-height) — 1.6, цвет абзацев — --text-main.</p> <p>## 3. Шапка форума (Header)</p> <p>* Баннер: Широкая атмосферная шапка с иллюстрацией (старинные фолианты, горящая свеча, перо, антикварный стол).<br />* Навигация (меню): Стилизовать под закладки или корешки книг. Кнопки «Правила», «Поиск», «Участники», «Вход/Выход».</p> <p>## 4. Оформление разделов и тем (Index page)</p> <p>* Иконки форумов:<br />* Есть новые сообщения: Иконка открытой книги с золотым свечением или чернильницы с пером.<br />&#160; &#160;* Нет новых сообщений: Закрытая книга в кожаном переплет.<br />* Строки разделов: Блоки категорий оформить как «Тома» или «Разделы библиотеки» с тонкими бронзовыми разделителями (border-bottom: 1px solid #C5A059;).</p> <p>## 5. Виджеты сайдбара (Sidebar)</p> <p>* Блок «Книга месяца» / «Обсуждаемый сюжет»: Фиксированный блок с обложкой книги (изображение 150x220px), кратким описанием и кнопкой-ссылкой.<br />* Цитатник дня: Блок со случайной литературной цитатой, оформленный в виде стикера или отрывного листа бумаги.<br />* Навигатор по форуму: Быстрые ссылки на ключевые сюжетные или информационные темы.</p> <p>## 6. Оформление тем и постов (Topic view)</p> <p>* Мини-профиль: Превратить в «Карточку читателя/персонажа»:<br />* Аватар в круглой или винтажной рамке (в виде портрета в овале).<br />&#160; &#160;* Поля: Ранг (в виде книжных титулов: Переплетчик, Хранитель и т.д.), Статус/Цитата, поле «Сейчас читаю».<br />* Блок сообщения (Post body):<br />* Цитаты формить как старинный пергаментный свиток (светло-желтый фон, левая граница цвета бордо или бронзы толщиной 3px).<br />&#160; &#160;* Код скрытого текста&#160; оформить в виде «Запечатанного конверта» или «Засекреченной страницы».</p> <p>## 7. Интерактив и анимации</p> <p>* Плавное появление элементов при наведении (hover) на темы (эффект легкого поднятия карточки или изменения цвета рамки на золотой).<br />* Кастомный скроллбар (полоса прокрутки), окрашенный в бронзово-шоколадные тона.</p> mybb@mybb.ru (nagaina) Wed, 19 Aug 2026 14:58:15 +0300 http://nagaina.rusff.me/viewtopic.php?pid=55#p55 http://nagaina.rusff.me/viewtopic.php?pid=51#p51 <div class="code-box"><strong class="legend">Код:</strong><div class="blockcode"><div class="scrollbox" style="height: 24em"><pre>#pun-category1.category h2, #pun-category2.category h2, #pun-category3.category h2, #pun-category4.category h2, #pun-category5.category h2, #pun-category6.category h2 { height: 34px; width: 1002px; z-index: 1; margin: 0px 0px 12px -2px; position: relative; border-bottom: 1px solid var(--bord); } #pun-category1.category h2 {background: var(--category1);} #pun-category2.category h2 {background: var(--category2);} #pun-category3.category h2 {background: var(--category3);} #pun-category4.category h2 {background: var(--category4);} #pun-category5.category h2 {background: var(--category5);} #pun-category6.category h2 {background: var(--category6);}</pre></div></div></div> mybb@mybb.ru (nagaina) Thu, 18 Sep 2025 19:35:59 +0300 http://nagaina.rusff.me/viewtopic.php?pid=51#p51 http://nagaina.rusff.me/viewtopic.php?pid=41#p41 <div class="code-box"><strong class="legend">Код:</strong><div class="blockcode"><div class="scrollbox" style="height: 35em"><pre>&lt;div id=&quot;plahee&quot;&gt; &lt;!-------1 плашка-------&gt; &lt;div class=&quot;plaha&quot;&gt; &lt;div class=&quot;plaha_date&quot;&gt;10.08&lt;/div&gt; &lt;div class=&quot;txt&quot;&gt;&lt;div class=&quot;txt_big&quot;&gt;&lt;a href=&quot;ссылка&quot;&gt;важная новость&lt;/a&gt;&lt;/div&gt;&lt;div class=&quot;txt_lit&quot;&gt;Lorem Ipsum is simply &lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;!-------1 плашка-------&gt; &lt;div class=&quot;plaha&quot;&gt; &lt;div class=&quot;plaha_date&quot;&gt;10.08&lt;/div&gt; &lt;div class=&quot;txt&quot;&gt;&lt;div class=&quot;txt_big&quot;&gt;&lt;a href=&quot;ссылка&quot;&gt;важная новость&lt;/a&gt;&lt;/div&gt;&lt;div class=&quot;txt_lit&quot;&gt;Lorem Ipsum is simply &lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;div id=&quot;plahee1&quot;&gt; &lt;!-------1 плашка-------&gt; &lt;div class=&quot;plaha&quot;&gt; &lt;div class=&quot;plaha_date&quot;&gt;10.08&lt;/div&gt; &lt;div class=&quot;txt&quot;&gt;&lt;div class=&quot;txt_big&quot;&gt;&lt;a href=&quot;ссылка&quot;&gt;важная новость&lt;/a&gt;&lt;/div&gt;&lt;div class=&quot;txt_lit&quot;&gt;Lorem Ipsum is simply &lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;!-------1 плашка-------&gt; &lt;div class=&quot;plaha&quot;&gt; &lt;div class=&quot;plaha_date&quot;&gt;10.08&lt;/div&gt; &lt;div class=&quot;txt&quot;&gt;&lt;div class=&quot;txt_big&quot;&gt;&lt;a href=&quot;ссылка&quot;&gt;важная новость&lt;/a&gt;&lt;/div&gt;&lt;div class=&quot;txt_lit&quot;&gt;Lorem Ipsum is simply &lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;!-------ССЫЛКИ ПО ЦЕНТРУ-------&gt; &lt;div id=&quot;SSULKI&quot;&gt; &lt;!-------ПЕРВАЯ-------&gt; &lt;div class=&quot;SSULKA&quot; style=&quot;background: #f5e0da;&quot;&gt;&lt;a href=&quot;ссылка&quot;&gt;ссылка раз&lt;/a&gt;&lt;/div&gt; &lt;!-------ВТОРАЯ-------&gt; &lt;div class=&quot;SSULKA&quot;&gt;&lt;a href=&quot;ссылка&quot;&gt;ссылка раз&lt;/a&gt;&lt;/div&gt; &lt;!-------ТРЕТЬЯ-------&gt; &lt;div class=&quot;SSULKA&quot;&gt;&lt;a href=&quot;ссылка&quot;&gt;ссылка раз&lt;/a&gt;&lt;/div&gt; &lt;/div&gt; &lt;!-------проценты-------&gt; &lt;div class=&quot;procenty&quot;&gt;100%&lt;/div&gt; &lt;!-------цитата-------&gt; &lt;div class=&quot;citata&quot;&gt;Lorem Ipsum is simply dummy text of the printing and typesetting &lt;/div&gt; </pre></div></div></div> mybb@mybb.ru (nagaina) Sun, 14 Sep 2025 10:05:10 +0300 http://nagaina.rusff.me/viewtopic.php?pid=41#p41