Здесь делается вжух 🪄

цитата дня:

Никогда не сдавайся!
Сдаются только квартиры, проститутки и слабаки

Это был не звук, а удар. Грохот, который пришёл из-под земли, встряхнув фундамент федеральной тюрьмы до самого основания. Я лежал на узкой койке и считал трещины в потолке камеры, когда почувствовал вибрации всем телом за секунду... читать дальше

Вектор Пламени

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

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


Вы здесь » Вектор Пламени » Гостевая » Гостевая


Гостевая

Сообщений 211 страница 212 из 212

1

[hideprofile][html]

<div class="tabs-wrapper">

  <div class="tabs-inner">
      <div class="header-box">
         БРОНИРОВАНИЕ
      </div>
     
    <div class="tabs-buttons">
      <button onclick="showTab(1)"><strong>ЖЕНСКИЕ ПРОТОТИПЫ</strong></button>
      <button onclick="showTab(2)"><strong>МУЖСКИЕ ПРОТОТИПЫ</strong></button>
     
    </div>

    <div class="tabs-content">
      <div id="tab1" class="tab-text">
<div class="card-title">ЖЕНСКИЕ ПРОТОТИПЫ</div>
          <div class="card-content">


<!-- jenskie -->
          </div>
        </div>
      <div id="tab2" class="tab-text">
                  <div class="card-title">МУЖСКИЕ ПРОТОТИПЫ</div>
          <div class="card-content">



<hr> <strong>charlie heaton</strong><em><a href="#">амс</a></em>

<hr> <strong>jessie lee soffer</strong><em><a href="#">амс</a></em>


<!-- mujskie -->
          </div>
        </div>
     
      </div>
<div class="guide-block">Чтобы придержать внешность, заполните следующий код:</div>
<div class="copy-wrap">
  <button class="copy-btn" onclick="copyCode()">Скопировать код</button>
  <div class="copy-msg" id="copyMsg">Код для заполнения успешно скопирован</div>

  <textarea class="codcopy" id="codcopy"></textarea>
</div>
<div class="guide-block">Мы в поисках АМС! Если у вас организаторские способности, куча идей и умений, которые негде применить, или вы просто хотите попробовать себя в роли администратора, обязательно <a href='https://flamevector.rusff.me/viewtopic.php?id=28'>маякните</a>!</div>
<div class="guide-block"><strong>Кто требуется:</strong><ul>
<li>- гм;</li>
<li>- ивент;</li>
<li>- орг.темы</li></ul></div>
    </div>

  </div>

</div>

       </div>
   
    </div>
  </div>

<style>
.copy-wrap{
  width:100%;
  max-width:850px;
  margin:10px auto 0px auto;
  font-family:inherit;
text-align:center;
}

.copy-btn{
  width:50%;
  padding-bottom:3px !important;
  border:none;
  cursor:pointer;
  background:url(https://upforme.ru/uploads/001c/a4/b9/3/943373.jpg) repeat;
  background-size:auto;
  color: #c7c7c7;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  border-radius:999px;
  font-family:'Cinzel';
  font-size:16px;
}

.copy-msg{
  display:none;
  text-align:center;
  color:#1bbf3a;
  font-size:14px;
  margin:6px 0 0;
  font-weight:600;
  font-family:'Cinzel';
}

textarea.codcopy{
  width:830px;
  height:40px;
  resize:none;
  margin:8px 5px;
  padding:10px;
  box-sizing:border-box;
  font-family:monospace;
  font-size:13px;
  background:#e0dede;
  color:#000;
  border-radius:10px;
  text-align:center;
  overflow:hidden;
}
@font-face {
  font-family: 'Cinzel';
  src: url('https://raw.githubusercontent.com/tukiteruamano-a11y/anketa/main/cinzel_regular.ttf') format('truetype');
}
@font-face { font-family: 'Comfortaa'; src: url('https://raw.githubusercontent.com/flamevector-rusff/styles/main/comfortaa.ttf');}

/* FIX MYBB */
.rules-mybb-fix, .rules-mybb-fix * { overflow: visible; box-sizing: border-box; }

/* Основной блок */
.main-box {
  width: 850px;
  margin: 2px auto !important;
  background: url("https://upforme.ru/uploads/001c/a4/b9/3/943373.jpg") repeat;
  border-radius: 20px;
  padding: 5px;
  font-family: 'Cinzel', serif;
}

.main-box a {
  font-family: inherit !important;
}

/* Второй уровень */
.inner-box {
  background: #c7c7c7;
  border-radius: 15px;
  padding: 5px;
}

/* Верхний прямоугольник */
.header-box {
  background: url("https://upforme.ru/uploads/001c/a4/b9/3/943373.jpg") repeat;
  border-radius: 12px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  color: #c7c7c7;
}

/* GUIDE BLOCKS */
.guide-block {
position: relative;
padding: 10px;
margin: 10px 5px 5px 5px;
border-radius: 16px;
border: 1px solid #a9a9a9;
font-size: 18px;
text-align: center;
font-family: 'Comfortaa';
}

a {
color: #744D37 !important;
}
a:hover {
color: #AF6F51 !important;
}
</style>

<style>
@font-face {
  font-family: 'Comfortaa';
  src: url('https://raw.githubusercontent.com/flamevector-rusff/styles/main/comfortaa.ttf');
}
@font-face {
  font-family: 'Cinzel';
  src: url('https://raw.githubusercontent.com/tukiteruamano-a11y/anketa/main/cinzel_regular.ttf') format('truetype');
}
.tabs-wrapper {
  width: 850px;
  padding: 5px;
  background: url(https://upforme.ru/uploads/001c/a4/b9/3/943373.jpg) repeat;
  border-radius: 10px;
  margin: 0 auto;
  font-family: 'Comfortaa';
  text-transform:lowercase;
}

.tabs-wrapper a {
  font-family: inherit !important;
}

.tabs-inner {
  background: #c7c7c7;
  padding: 5px;
  border-radius: 8px;
}
.header-box {
  background: url("https://upforme.ru/uploads/001c/a4/b9/3/943373.jpg") repeat;
  border-radius: 12px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  color: #c7c7c7;
  font-family: 'Cinzel', serif;
}

.tabs-buttons {
  display: flex;
  gap: 5px;
  padding: 5px;
  border-radius: 8px;
}

.card-title {
font-family: 'Cinzel';
}

.tabs-buttons button {
  flex: 1;
  padding: 10px;
  cursor: pointer;
  border: none;
  border-radius: 6px;
  background: url(https://upforme.ru/uploads/001c/a4/b9/3/943373.jpg) repeat;
  transition: 0.2s;
  color: #c7c7c7;
  font-size: 16px;
  font-family: 'Cinzel', serif;
}

.tabs-content {
  margin: 5px;
  background: #c7c7c7;
  border: 1px solid #a9a9a9;
  border-radius: 8px;
  padding: 10px;
  font-size: 14px;
}

.tab-text {
  display: none;
}

p {
  text-indent: 25px;
  text-align: justify;
}

.add {
  display: block;
  margin: 15px;
  font-size: 14px;
  font-family: 'Cinzel', serif;
  text-align: center;
}

.card-title {
    background: url("https://upforme.ru/uploads/001c/a4/b9/3/943373.jpg");
    background-repeat: repeat;
    border-radius: 8px;
    margin: 5px;
    padding: 5px;
    font-size: 14px;
    text-align: center;
    font-weight: bold;
    color: #c7c7c7;
}

/* Контент карточки */
.card-content {
    margin: 5px;
    padding: 5px;
    flex: 1;
    overflow-y: auto;
    text-align: center;
    font-size: 16px;
}

/* Текст */
.card-content strong {
    display: block;
    font-weight: bold;
}

.card-content em {
    display: block;
    font-style: italic;
}

.card-content a {
    color: inherit;
    text-decoration: underline;
}

.liner {
  height: 20px;
  margin: 0 10px;
  border-radius: 12px;
  background: url('https://i.ibb.co/0xP0jH4/6bbf97e48d3c1d7905e6169de8564e74.jpg') repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'CinzelCustom', serif;
  font-size: 14px;
  letter-spacing: 1px;
    font-weight: bold;
    color: #c7c7c7;
}

</style>

<script>
function showTab(num) {
  var tabs = document.querySelectorAll('.tab-text');
  tabs.forEach(function(tab) {
    tab.style.display = 'none';
  });
  document.getElementById('tab' + num).style.display = 'block';
}
</script>
<script>
const openTag  = '[' + 'code' + ']';
const closeTag = '[' + '/code' + ']';

const inner =
'<hr><strong>ИМЯ ФАМИЛИЯ НА АНГЛИЙСКОМ</strong><em><a href="ССЫЛКА НА ПРОФИЛЬ">НИК</a></em>';

document.getElementById('codcopy').value =
openTag + inner + closeTag;

function copyCode(){
  const ta = document.getElementById('codcopy');
  ta.select();
  document.execCommand('copy');

  const msg = document.getElementById('copyMsg');
  msg.style.display = 'block';
  setTimeout(()=>{ msg.style.display='none'; },2000);
}
</script>

[/html]

+1

211

Lukas Eisenhardt, надёжно упаковал, бантиком перевязал, застраховал дорохо-бохато https://upforme.ru/uploads/0013/63/cd/2/222500.png

Подпись автора

[html]<div class="battery-wrapper" data-level="6">
  <div class="battery">
    <div class="title">MY SOCIAL BATTERY</div>

    <div class="segments">
      <div class="seg">😢</div>
      <div class="seg">🙁</div>
      <div class="seg">😕</div>
      <div class="seg">😐</div>
      <div class="seg">🙂</div>
      <div class="seg">😊</div>
      <div class="seg">😄</div>

      <div class="track">
        <div class="indicator">⚡</div>
      </div>
    </div>
  </div>

  <div class="side"></div>
</div>

<style>
@font-face {  font-family: 'Cinzel';  src: url('https://raw.githubusercontent.com/tukiteruamano-a11y/anketa/main/cinzel_regular.ttf') format('truetype');
}
.battery-wrapper{
  position: relative;
  width: 300px;
  transform: scale(0.7);
  transform-origin: top left;
  margin: 0 auto;
}

.battery{
  background:#000;
  border-radius:16px;
  padding:12px;
  color:#fff;
  font-family:sans-serif;
}

.side{
  position:absolute;
  right:-14px;
  top:50%;
  transform:translateY(-50%);
  width:14px;
  height:50%;
  background:#000;
  border-radius:0 8px 8px 0;
}

.title{
  text-align:center;
  margin-bottom:10px;
  font-size:20px;
  font-family: 'Cinzel';
}

.segments{
  display:flex;
  overflow:hidden;
  border-radius:10px;
  margin-bottom:8px;
  position:relative;
}

.seg{
  flex:1;
  text-align:center;
  padding:8px 0 40px;
  font-size:14px;
}

.seg:nth-child(1){background:#ff3b3b;}
.seg:nth-child(2){background:#ff6b3b;}
.seg:nth-child(3){background:#ff9b3b;}
.seg:nth-child(4){background:#ffd93b;}
.seg:nth-child(5){background:#b7e23b;}
.seg:nth-child(6){background:#6be23b;}
.seg:nth-child(7){background:#2be23b;}

.track{
  position:absolute;
  left:8px;
  right:8px;
  bottom:8px;
  height:10px;
  background:#222;
  border-radius:999px;
  z-index:2;
}

.indicator{
  position:absolute;
  top:50%;
  transform:translate(-50%, -50%);
  font-size:20px;
  transition:0.3s ease;
}
</style>

<script>
function updateAll() {
  document.querySelectorAll('.battery-wrapper').forEach(wrapper => {
    const level = parseInt(wrapper.dataset.level) || 1;

    const indicator = wrapper.querySelector('.indicator');
    const segments = wrapper.querySelectorAll('.seg');
    const count = segments.length;

    // центр сегмента + маленький сдвиг вправо
    const offsetPercent = 2; // смещение вправо в процентах
    const percent = ((level - 0.5) / count * 100) + offsetPercent;

    indicator.style.left = percent + '%';
  });
}

window.onload = updateAll;
window.onresize = updateAll;
</script>[/html]

0

212

Phillip Morgan написал(а):

Lukas Eisenhardt, надёжно упаковал, бантиком перевязал, застраховал дорохо-бохато

Целую в лобик — твой любимый бобик

0

Быстрый ответ

Напишите ваше сообщение и нажмите «Отправить»



Вы здесь » Вектор Пламени » Гостевая » Гостевая


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