— online — 10 лет —
РЕЙТИНГ: 18+ В ИГРЕ: 2016 год
Средняя °C по месяцам,
Даты полнолуний
— АМС —
— активисты —
Добро пожаловать!
Дорогие гости, мы рады приветствовать вас на проекте Town under the Arch, по мотивам произведений Л. Гамильтон!

Test forum

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Test forum » Гостевая » Тестировошная кодиков


Тестировошная кодиков

Сообщений 1 страница 3 из 3

1

Тут будут всякие оформляшки

0

2

[html]<!-- ========================================================= -->
<!-- ПОСТ 1: БАЗА СТИЛЕЙ, ИСПРАВЛЕНИЕ СКРОЛЛА И ПРИВЕТСТВИЕ    -->
<!-- ========================================================= -->
<style>
  @import url('https://googleapis.com');
 
  /* ИСПРАВЛЕНИЕ СКРОЛЛА: Принудительный перенос строк в окнах кода */
  .post-box code, .post-box pre, code, pre {
    white-space: pre-wrap !important;
    word-wrap: break-word !important;
    word-break: break-all !important;
  }

  .frpg-addr-layout-box { max-width: 950px; margin: 20px auto; font-family: 'Arsenal', sans-serif; width: 100%; box-sizing: border-box; }
  .frpg-addr-main-banner { width: 100%; height: auto; min-height: 250px; background-image: url('https://forumstatic.ru'); background-size: cover; background-position: center; border: 1px solid rgba(16, 24, 41, 0.85); padding: 30px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; margin-bottom: 25px; box-shadow: 0 4px 15px rgba(0,0,0,0.4); }
 
  /* Фоновые подиумы (#898d93) */
  .frpg-addr-welcome-podium { background-color: #898d93 !important; padding: 12px; border: 1px solid rgba(16, 24, 41, 0.5); box-shadow: 0 6px 15px rgba(0,0,0,0.25); max-width: 674px; width: 100%; box-sizing: border-box; border-radius: 4px; }
  .frpg-addr-main-podium { background-color: #898d93 !important; padding: 15px; border: 1px solid rgba(16, 24, 41, 0.4); box-shadow: 0 6px 20px rgba(0,0,0,0.3); margin: 20px auto; max-width: 950px; box-sizing: border-box; border-radius: 4px; }
 
  /* Окошки контента (#979b9f) */
  .frpg-addr-welcome-plate { background-color: #979b9f !important; border: 1px solid #74787e; padding: 20px 25px; width: 100%; box-sizing: border-box; }
  .frpg-addr-light-content { background-color: #979b9f !important; border: 1px solid #74787e; padding: 22px; box-sizing: border-box; flex: 1; display: flex; flex-direction: column; gap: 15px; text-align: left; }
 
  /* Плашки и Заголовки (rgba(16, 24, 41, 0.85) и золото #cfa75e) */
  .frpg-addr-welcome-plate h1 { background-color: rgba(16, 24, 41, 0.85) !important; border: 1px solid #cfa75e; color: #cfa75e; font-family: 'Oranienbaum', serif; font-size: 22px; margin: 0 0 12px 0; padding: 6px 0; text-transform: uppercase; letter-spacing: 4px; font-weight: 400; text-shadow: 0 1px 2px rgba(0,0,0,0.4); text-align: center; }
  .frpg-addr-welcome-plate p { font-size: 13px; line-height: 1.5; color: #1c2638 !important; margin: 0; text-align: justify; font-weight: bold; }
 
  .frpg-addr-name-tag { background-color: rgba(16, 24, 41, 0.85) !important; border: 1px solid #cfa75e; padding: 15px 20px; text-align: center; box-sizing: border-box; }
  .frpg-addr-name-tag h2 { font-family: 'Oranienbaum', serif; font-size: 22px; color: #cfa75e; margin: 0; letter-spacing: 2px; text-transform: uppercase; font-weight: 400; text-shadow: 0 1px 2px rgba(0,0,0,0.4); }
 
  .frpg-addr-district-tag { background-color: rgba(16, 24, 41, 0.85) !important; border: 1px solid #cfa75e; padding: 18px 15px; text-align: center; box-sizing: border-box; }
  .frpg-addr-district-tag span { font-family: 'Oranienbaum', serif; font-size: 15px; color: #cfa75e; letter-spacing: 2px; text-transform: uppercase; font-weight: bold; text-shadow: 0 1px 2px rgba(0,0,0,0.4); }
 
  /* Стабильная геометрия сетки */
  .frpg-addr-template-grid { display: flex; gap: 20px; margin-bottom: 15px; width: 100%; box-sizing: border-box; }
  .frpg-addr-left-block { display: flex; flex-direction: column; gap: 15px; flex: 1.3; }
  .frpg-addr-right-block { display: flex; flex-direction: column; gap: 15px; flex: 0.7; }
 
  /* Цвета текста и Ссылки */
  .frpg-addr-meta-sub { font-size: 14px; line-height: 1.6; color: #181a26 !important; font-weight: bold; padding-bottom: 10px; border-bottom: 1px dashed rgba(24, 26, 38, 0.3); }
  .frpg-addr-meta-sub b { color: #181a26; }
  .frpg-addr-meta-sub a { color: #1c2638; text-decoration: none; border-bottom: 1px dashed #1c2638; font-weight: bold; }
  .frpg-addr-text-sub { font-size: 14px; line-height: 1.6; color: #1c2638 !important; text-align: justify; font-weight: bold; }
  .frpg-addr-text-sub p { margin: 0 0 12px 0; text-indent: 15px; }
  .frpg-addr-text-sub p:last-of-type { margin-bottom: 0; }
 
  /* Элементы графики */
  .frpg-addr-tall-pic { width: 100%; height: 100%; min-height: 200px; background-color: #979b9f !important; border: 1px solid #74787e; box-sizing: border-box; display: flex; align-items: center; justify-content: center; overflow: hidden; }
  .frpg-addr-tall-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .frpg-addr-placeholder-text { font-size: 14px; color: #313942; font-weight: bold; text-transform: uppercase; letter-spacing: 1px; }
 
  .frpg-addr-bottom-gallery { display: flex; gap: 15px; width: 100%; box-sizing: border-box; }
  .frpg-addr-square-pic { flex: 1; height: 200px; background-color: #979b9f !important; border: 1px solid #74787e; box-sizing: border-box; display: flex; align-items: center; justify-content: center; overflow: hidden; }
  .frpg-addr-square-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
 
  @media (max-width: 768px) { .frpg-addr-template-grid, .frpg-addr-bottom-gallery { flex-direction: column; gap: 15px; } .frpg-addr-tall-pic { height: 220px; } .frpg-addr-text-sub { text-align: left; } }
</style>

<div class="frpg-addr-layout-box">
  <!-- Верхний баннер -->
  <div class="frpg-addr-main-banner">
    <div class="frpg-addr-welcome-podium">
      <div class="frpg-addr-welcome-plate">
        <h1>Адреса</h1>
        <p>Если вы забыли свой адрес или желаете напомнить другу/подруге/коллеге/лж*/начальнику/жене брата/злейшему врагу/попутчику злейшего врага или, наоборот, узнать, где проживает ваш friend/подруге/коллеге/лж*/начальнику/жене брата/злейшему врагу/попутчику злейшего врага, а также поделиться координатами вашего места работы, заполняйте форму и пишите сюда. Всё оформим в лучшем виде, запишем и учтём.</p>
      </div>
    </div>
  </div>

  <!-- Интерактивная карта -->
  <div style="text-align: center; color: #cfa75e; font-size: 13px; letter-spacing: 1px; margin-bottom: 25px;">[ Сюда встанет ваша интерактивная Гугл-карта ]</div>

  <!-- Пример заполненной карточки -->
  <div class="frpg-addr-main-podium">
    <div class="frpg-addr-template-grid">
      <div class="frpg-addr-left-block">
        <div class="frpg-addr-name-tag">
          <h2>Имя Фамилия Персонажа</h2>
        </div>
        <div class="frpg-addr-light-content">
          <div class="frpg-addr-meta-sub">
            🏡 <b>Локация:</b> Квартира / Дом / Прочее<br>
            📍 <b>Адрес:</b> <a href="#" target="_blank">адрес места жительства/работы со ссылкой на гугл-карту</a><br>
            📜 <b>Анкета:</b> <a href="#" target="_blank">ссылка на пункт в анкете</a>
          </div>
          <div class="frpg-addr-text-sub">
            <p>Описание вида дома или квартиры. Здесь игроки будут размещать детальный лор своего жилища, расписывать этажи, комнаты, интерьерные особенности и атмосферу личного пространства своего персонажа в Сент-Луисе.</p>
          </div>
        </div>
      </div>
      <div class="frpg-addr-right-block">
        <div class="frpg-addr-district-tag">
          <span>Westwood</span>
        </div>
        <div class="frpg-addr-tall-pic">
          <span class="frpg-addr-placeholder-text">картинка.</span>
        </div>
      </div>
    </div>
    <div class="frpg-addr-bottom-gallery">
      <div class="frpg-addr-square-pic"><span class="frpg-addr-placeholder-text">картинка.</span></div>
      <div class="frpg-addr-square-pic"><span class="frpg-addr-placeholder-text">картинка.</span></div>
      <div class="frpg-addr-square-pic"><span class="frpg-addr-placeholder-text">картинка.</span></div>
    </div>
  </div>
</div>
[/html]

СКОПИРУЙТЕ КОД ДЛЯ ПОДАЧИ АДРЕСА В ТЕМУ:

Код:
[noparse]<div class="frpg-addr-main-podium">
  <div class="frpg-addr-template-grid">
    
    <div class="frpg-addr-left-block">
      <div class="frpg-addr-name-tag">
        <h2>ИМЯ ФАМИЛИЯ ПЕРСОНАЖА (или персонажей)</h2>
      </div>
      <div class="frpg-addr-light-content">
        <div class="frpg-addr-meta-sub">
          🏡 <b>Локация:</b> Дом / Квартира / Офис<br>
          📍 <b>Адрес:</b> <a href="ССЫЛКА_НА_ГУГЛ_КАРТУ" target="_blank">Ваш адрес места жительства или работы со ссылкой</a><br>
          📜 <b>Анкета:</b> <a href="ССЫЛКА_НА_ПУНКТ_В_АНКЕТЕ" target="_blank">Ссылка на пункт в анкете персонажа</a>
        </div>
        <div class="frpg-addr-text-sub">
          <p>Ваш текст детального описания комнат, интерьера, лора или истории жилья персонажа...</p>
        </div>
      </div>
    </div>
    
    <div class="frpg-addr-right-block">
      <div class="frpg-addr-district-tag">
        <span>РАЙОН_ГОРОДА</span>
      </div>
      <div class="frpg-addr-tall-pic">
        <img src="ССЫЛКА_НА_ВЕРТИКАЛЬНУЮ_КАРТИНКУ" alt="Pic T">
      </div>
    </div>
    
  </div>
  
  <div class="frpg-addr-bottom-gallery">
    <div class="frpg-addr-square-pic">
      <img src="ССЫЛКА_НА_ИНТЕРЬЕР_1" alt="Pic 1">
    </div>
    <div class="frpg-addr-square-pic">
      <img src="ССЫЛКА_НА_ИНТЕРЬЕР_2" alt="Pic 2">
    </div>
    <div class="frpg-addr-square-pic">
      <img src="ССЫЛКА_НА_ИНТЕРЬЕР_3" alt="Pic 3">
    </div>
  </div>
</div>[/noparse]

0

3

[html]<!-- ========================================================= -->
<!-- ЧИСТЫЙ БЕСТИАРИЙ РАС: СТИЛИ И ВЕРХНИЕ КНОПКИ               -->
<!-- ========================================================= -->
<style>
  @import url('https://googleapis.com');

  /* Общий плоский контейнер — СТРОГИЕ УГЛЫ, БЕЗ ТЕНИ */
  .frpg-simple-box { max-width: 900px; margin: 20px auto; font-family: 'Arsenal', sans-serif; display: flex; flex-direction: column; width: 100%; box-sizing: border-box; background-color: #898d93 !important; padding: 25px; border: 1px solid rgba(16, 24, 41, 0.35); border-radius: 0px !important; gap: 20px; }
 
  /* Меню рас — строгие прямоугольники */
  .frpg-simple-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; width: 100%; margin-bottom: 5px; }
  .frpg-simple-card { display: block; background-color: rgba(16, 24, 41, 0.8) !important; border: 1px solid #74787e; color: #979b9f !important; font-family: 'Oranienbaum', serif; font-size: 13px; text-transform: uppercase; letter-spacing: 0.5px; padding: 12px 4px; text-align: center; text-decoration: none !important; border-radius: 0px !important; transition: all 0.2s ease; }
  .frpg-simple-card:hover, .frpg-simple-card.active-c { color: #cfa75e !important; background-color: #1c2638 !important; border-bottom: 3px solid #cfa75e; font-weight: bold; }

  /* Главное окно для текста с фиксированной высотой и прокруткой */
  .frpg-simple-viewport { background-color: #979b9f !important; border: 1px solid #74787e; border-radius: 0px !important; padding: 30px; box-sizing: border-box; height: 420px; max-height: 420px; overflow-y: auto; font-size: 14.5px; line-height: 1.65; color: #1c2638 !important; text-align: justify; }
  .frpg-simple-viewport::-webkit-scrollbar { width: 4px; }
  .frpg-simple-viewport::-webkit-scrollbar-thumb { background-color: #cfa75e; }
 
  /* Элементы оформления внутри текста */
  .frpg-simple-viewport p { margin: 0 0 15px 0; font-weight: bold; }
  .frpg-simple-viewport ul { margin: 0 0 15px 0; padding-left: 20px; font-weight: bold; list-style-type: square; }
  .frpg-simple-viewport li { margin-bottom: 8px; font-weight: bold; }
  .frpg-simple-viewport h2 { font-family: 'Oranienbaum', serif; font-size: 20px; color: #181a26 !important; margin: 0 0 12px 0; text-transform: uppercase; letter-spacing: 1px; border-bottom: 1px solid rgba(16, 24, 41, 0.2); padding-bottom: 6px; }
  .frpg-simple-quote { border-left: 3px solid #cfa75e; padding-left: 15px; margin: 15px 0; font-style: italic; color: #181a26 !important; display: block; font-weight: bold; }

  @media screen and (max-width: 768px) {
    .frpg-simple-box { padding: 12px; gap: 12px; } .frpg-simple-grid { grid-template-columns: repeat(3, 1fr); gap: 4px; } .frpg-simple-card { padding: 10px 2px; font-size: 11px; } .frpg-simple-viewport { padding: 15px; height: 320px; }
  }
</style>

<div class="frpg-simple-box">
  <!-- Верхний ряд выбора рас (Ссылки ведут прямо на посты темы) -->
  <div class="frpg-simple-grid">
    <a href="#race-vamp" class="frpg-simple-card active-c">Вампиры</a>
    <a href="#race-wolf" class="frpg-simple-card">Оборотни</a>
    <a href="#race-fae" class="frpg-simple-card">Фейрэ</a>
    <a href="#race-lamia" class="frpg-simple-card">Ламии</a>
    <a href="#race-zombie" class="frpg-simple-card">Зомби</a>
    <a href="#race-human" class="frpg-simple-card">Люди</a>
  </div>
  <!-- Главное прямоугольное окно лора -->
  <div class="frpg-simple-viewport" id="race-vamp">
    <h2>Гражданские права вампиров в США</h2>
    <p>Вампирам наравне со всеми гражданами предоставлено:</p>
    <ul>
      <li>право на жизнь; свободу и личную неприкосновенность; неприкосновенность частной жизни, тайну переписки, телеграфных и телефонных переговоров; на неприкосновенность жилища; определять и указывать свою национальную принадлежность; пользоваться родным языком; на свободу передвижения и выбора места пребывания и жительства;</li>
      <li>право на свободу совести и свободу вероисповедания; свободу мысли и слова;</li>
      <li>права на свободное использование своих способностей и имущества для предпринимательской и иной экономической деятельности; иметь имущество в собственности; иметь в частной собственности землю; вступать в права наследования. Как и любые другие граждане США, вампиры платят налоги.</li>
      <li>право заключать браки друг с другом, а также с людьми или оборотнями;</li>
      <li>и т.д.</li>
    </ul>

    <h2>Происхождение вампиров</h2>
    <p>Вампиризм — официально признанное в США вирусное заболевание, передающееся жертве тремя укусами. 13 марта 2005 года суд признал вампиризм легальным во всех штатах Америки.</p>
    <p>Наиболее вероятной теорией считается, что первого вампира создал некромант в результате своего безумного эксперимента.</p>
    <div class="frpg-simple-quote">«Если бы я знала наверняка, что ад существует, я бы прикончила тебя...»</div>
    <p>Марми Нуар, она же Мать Всей Тьмы — королева вампиров.</p>
   
    <h2>Линии крови носферату</h2>
    <p>Сюда вы можете вписать текст чистокровных семей простыми абзацами...</p>
  </div>
</div>
[/html]

0


Вы здесь » Test forum » Гостевая » Тестировошная кодиков


Рейтинг форумов | Создать форум бесплатно