blanche design studio

Объявление

a

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

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

Вы здесь » blanche design studio » themes » новая тема / оформы тут (если заказаны)

новая тема / оформы тут (если заказаны)

Страница: 1
Ответить

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

1

  • Автор: Blanche
  • самый длинный статус который может вместиться здес
  • Blanche
  • Уважение: +14
  • Последний визит:
    Вчера 12:46:43

+1

2

  • Автор: Blanche
  • самый длинный статус который может вместиться здес
  • Blanche
  • Уважение: +14
  • Последний визит:
    Вчера 12:46:43
Код:
<!--HTML-->
<style>
/* общий стиль*/
.otsttext {
    padding: 0 15px !important;
    font-size: 12px;
	}

.theme_bank {min-height: 640px;--colorfonbank: #c9c7c6;--colortextbank: #333;--colorborderbank: #b5b5b5;margin: 31px auto 0;display: flex;flex-direction: column;gap: 25px;}

.theme_bank * {box-sizing: border-box;}

.bk-main-all {
    display: grid;
    gap: 25px;
    grid-template-columns: repeat(2,1fr);
}

.theme_bank *::-webkit-scrollbar {background: var(--colorborderbank);}

.theme_bank *::-webkit-scrollbar-thumb {
    background: var(--colortextbank);
}

/* кнопки */

.earn-button, #pun #modalContent .add-field-btn, #pun #modalContent .remove-field-btn, #modalContent button.submit-btn, .finish-btn, button.remove-item-btn, .buy-button {
    background: var(--colorborderbank) !important;
    font-size: 11px !important;
    transition: color 0.5s, transform 0.2s, background 0.5s;
    border: none !important;
    border-radius: 2px;
    cursor: pointer;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
	}
	.earn-button, #pun #modalContent .add-field-btn, #pun #modalContent .remove-field-btn, button.remove-item-btn {
    aspect-ratio: 1 / 1;
    width: 21px;
 }

#modalContent button.submit-btn, .finish-btn, .buy-button {
    width: fit-content;
    padding: 6px 15px !important;
    text-transform: lowercase;
    font-weight: bold;
    border-radius: 4px;
}

	.earn-button:hover, #pun #modalContent .add-field-btn:hover, .remove-field-btn:hover, #modalContent button.submit-btn:hover, .finish-btn:hover, button.remove-item-btn:hover, .buy-button:hover {
    background: var(--colortextbank) !important;
    transform: scale(1.15);color: #fff
	}

/* заголовки */
	.bk-main-all-left-tit {
    background: var(--colorfonbank);
    font-weight: 500;
    letter-spacing: 1px;
    padding: 4px 27px;
    border-radius: 15px 15px 0 0;
 }

/* контейнеры */
.bk-main-all > div, .bk-main-all-bt {
    display: flex;
    flex-direction: column;
    align-items: center;
}

	.bk-main-all-line, .bk-main-all-bt-all {
    color: var(--colortextbank);
    height: 250px;
    padding: 10px;
    overflow-y: auto;
    background: var(--colorfonbank);
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    text-transform: lowercase;
    width: 100%;
    box-sizing: border-box;
 }

/* пункты банка */

	#pun .post-content .bk-main-all-line p {
    font-size: 11px;
    line-height: 13px;
    display: grid;
    grid-template-columns: 1fr 25px 21px;
    margin: 0;
    align-items: center;
    gap: 10px;
 }

	.bk-main-all-line p span {
    text-align: right;
    font-weight: bold;
	}

#pun .post-content .bk-main-all-line p + p {
    border-top: 1px solid var(--colorborderbank);
    padding-top: 5px;
}

	/* Стили для комплектов */
	.bk-main-all-bt-all {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
    height: 280px;
 }

	.bk-main-all-bt-all-r2-one {
    border: 1px solid var(--colorborderbank);
    border-radius: 8px;
    padding: 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
 }

	.bk-main-all-bt-all-r2-one img:first-of-type {aspect-ratio: 1 / 1;width: 50px;object-fit: contain;}

	.bk-main-all-bt-all-r2-one-img2 {
    width: 190px;
    height: 25px;
 }

	.bk-main-all-bt-all-r2-one-img {
    width: 150px;
    height: auto;
 }

/* модалка */
	.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
 }

	.modal-content {
    background-color: var(--colorfonbank);
    border: 1px solid var(--colortextbank);
    margin: 10% auto;
    padding: 20px;
    border-radius: 8px;
    width: 80%;
    max-width: 600px;
    max-height: 80vh;
    overflow-y: auto;
    color: var(--colortextbank);
    position: relative;
 }

	.close {
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;transition: transform .1s;
 }

	.close:hover {
transform: scale(0.9)
	}

	.modal h3 {
    color: var(--colortextbank);
    margin-bottom: 15px;
	}

#modalContent {
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-transform: lowercase;
}

#modalContent h3 {
    padding: 0 !important;
    margin: 0 !important;
    font-size: 14px;
}

	.form-group label {
    font-weight: bold;
 }

#modalContent .form-group, #modalContent form#earnForm, #modalContent .form-group > div {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#modalContent .form-group input, #modalContent .form-group textarea, #modalContent .form-group select {
    width: 100%;
    border-radius: 4px;
    border: 1px solid var(--colorborderbank) !important;
    outline: none;
 }

#modalContent .info-text {
    opacity: .7;
    font-size: 10px;
    border-left: 4px solid var(--colortextbank);
    padding: 5px 10px;
}

#modalContent .field-row {
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr 21px;
}

	.form-group textarea {
    height: 80px;
    resize: vertical;
	}

	/* Стили для предварительного просмотра */
	#selected-items-preview {
    border: 1px solid var(--colorfonbank);
    border-radius: 8px;
    padding: 15px;
    max-height: 300px;
    overflow-y: auto;
    text-transform: lowercase;
    color: var(--colortextbank);
 }

	.preview-empty {
    color: var(--colortextbank);
    text-align: center;
    font-style: italic;
    padding: 20px;
	}

	.preview-header {
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--colorborderbank);
    padding-bottom: 10px;
    font-size: 13px;
 }

	.preview-item {
    background: var(--colorfonbank);
    border-radius: 4px;
    padding: 10px;
    margin-bottom: 8px;
 }

.preview-item-header {
    align-items: center;
    gap: 10px;
    margin-bottom: 5px;
    display: grid;
    grid-template-columns: 20px 1fr 50px 21px;
}


	.preview-item-number, 	.preview-item-amount {
    font-weight: bold;
	}

.preview-item-amount {
    text-align: right;
}

	.preview-item-details {
    font-size: 12px;
    margin-left: 30px;
    word-break: break-word;
	}

	.preview-total {
    font-weight: bold;
    text-align: right;
    padding-top: 10px;
    border-top: 1px solid var(--colorborderbank);
    font-size: 16px;
 }

	.preview-total-balance {
    font-weight: bold;
    text-align: right;
    margin-top: 5px;
    font-size: 12px;
    opacity: .6;
 }

	.free-change {
    grid-column: 2 / 4;
    text-align: right;
	}

</style>

<!-- Основной контент банка -->
<div class="fon">
	<div class="bac">
    <div class="namet">
    	<div class="bacname">банк</div>
    </div>
	</div>
	<br /><br />
	<div class="otsttext">
    позиции в банке могут обновляться, а цены расти/падать, поэтому следите за курсом! если хотите купить плашку, то
    подготовьте картинку и текст (в одну короткую строчку; можно выразить пожелания по цветам). иконки приобретаются
    и располагаются на личной странице, по-вашему желанию ставим в профиль. а еще их можно дарить — делайте приятное
    друг другу. можно дарить собственные иконки (приложите картинку, мы уменьшим до нужных размеров).
  <br /><br />
<a href="https://rehaze.ru/pages/primerochnaya">Примерочная</a> — здесь можно примерить обновку до покупки
    <br /><br />
	</div>
</div>

здесь вы можете отследить занятость ближайшего поста (должен быть написан в текущую
неделю) и эпизода недели. если в столбце стоит ♥ - значит, пост/эпизод на ближайшую неделю выкуплен.

пост недели

эпизод
недели

активист недели

если кнопки не прожимаются/не работают/проч — обновите страницу


Код:
<!--HTML-->
<!-- Основной контент банка -->
<div class="theme_bank">
	<div class="bk-main-all">
    <div class="bk-main-all-left">
    	<div class="bk-main-all-left-tit">заработать</div>
    	<div class="bk-main-all-line">
        <p>Регистрация на форуме (начисляется амс при принятии) <span>100</span></p>
        <p>
        	Регистрация по заявке из акции или нужных <span>300</span
        	><button class="earn-button" data-type="registration-request">+</button>
        </p>
        <p>
        	Забрать игрока из «хочу к вам» <span>500</span
        	><button class="earn-button" data-type="take-player">+</button>
        </p>
        <p>
        	Привести игрока на форум (после подачи анкеты и первого поста) <span>1000</span
        	><button class="earn-button" data-type="bring-player">+</button>
        </p>
        <p>
        	Помочь администрации (поиск ошибок, идеи для конкурсов и тд.) <span>150</span
        	><button class="earn-button" data-type="help-admin">+</button>
        </p>
        <p>
        	Оставить 1 рекламу <span>10</span><button class="earn-button" data-type="advertisement">+</button>
        </p>
        <p>
        	Сделать графический подарок игроку <span>250</span
        	><button class="earn-button" data-type="graphic-gift">+</button>
        </p>
        <p>Попасть в таблицу <span>200</span><button class="earn-button" data-type="table-entry">+</button></p>
        <p>
        	Написать заявку на нужного <span>100</span
        	><button class="earn-button" data-type="application-needed">+</button>
        </p>
        <p>
        	Написать заявку в «хотим видеть» <span>50</span
        	><button class="earn-button" data-type="application-want">+</button>
        </p>
        <p>
        	Каждые 100 сообщений <span>50</span><button class="earn-button" data-type="messages-100">+</button>
        </p>
        <p>
        	Каждая 1000 сообщений <span>100</span
        	><button class="earn-button" data-type="messages-1000">+</button>
        </p>
        <p>
        	каждые 100 классов позитива/репутации (отдельно каждый) <span>50</span
        	><button class="earn-button" data-type="reputation-100">+</button>
        </p>
        <p>
        	открыть эпизод (по 1 написанному посту в теме) <span>100</span
        	><button class="earn-button" data-type="open-episode">+</button>
        </p>
        <p>
        	открыть эпизод более чем на двух человек (по 1 написанному посту в теме) <span>500</span
        	><button class="earn-button" data-type="open-episode-multi">+</button>
        </p>
        <p>
        	первый пост в эпизоде (буквально первопост в теме) <span>200</span
        	><button class="earn-button" data-type="first-post">+</button>
        </p>
        <p>любой следующий пост <span>150</span><button class="earn-button" data-type="next-post">+</button></p>
        <p>
        	ответ в тот же день  и/или бонус за квестовый пост<span>50</span><button class="earn-button" data-type="same-day-reply">+</button>
        </p>
        <p>закрытый эпизод <span>500</span><button class="earn-button" data-type="closed-episode">+</button></p>
        <p>
        	участие в квесте <span>500</span
        	><button class="earn-button" data-type="quest-participation">+</button>
        </p>
        <p>
        	стать ГМ и завершить квест <span>1000</span
        	><button class="earn-button" data-type="gm-quest">+</button>
        </p>
        <p>отзыв на топе <span>2000</span><button class="earn-button" data-type="top-review">+</button></p>
        <p>
        	размещение нашего баннера в подписи на LYL, Рено или Маяк (за месяц носки) <span>1000</span
        	><button class="earn-button" data-type="banner-placement">+</button>
        </p>
        <p>
        	листовка проекту <span>500</span><button class="earn-button" data-type="project-leaflet">+</button>
        </p>
        <p>Открытие инста-темы <span>50</span><button class="earn-button" data-type="insta-topic">+</button></p>
        <p>1 инста-пост <span>25</span><button class="earn-button" data-type="insta-post">+</button></p>
    	</div>
    </div>

    <div class="bk-main-all-right">
    	<div class="bk-main-all-left-tit">потратить</div>
    	<div class="bk-main-all-line">
        <p>
        	спасение от чистки (2 раза подряд нельзя) <span>2000</span
        	><button class="earn-button" data-type="save-from-cleanup">+</button>
        </p>
        <p>
        	заморозка профиля <span>7000</span
        	><button class="earn-button" data-type="freeze-account">+</button>
        </p>
        <p>
        	уникальная иконка (50х50) <span>500</span
        	><button class="earn-button" data-type="unique-icon">+</button>
        </p>
        <p>
        	уникальная плашка (190х25) <span>600</span
        	><button class="earn-button" data-type="unique-banner">+</button>
        </p>
        <p>
        	уникальная маечка (350х750) <span>800</span
        	><button class="earn-button" data-type="unique-shirt">+</button>
        </p>
   <p>
        	уникальные трусики (230х130) <span>500</span
        	><button class="earn-button" data-type="unique-pans">+</button>
        </p>
        <p>
        	иконка из банка (50х50) <span>200</span
        	><button class="earn-button" data-type="icon-50x50">+</button>
        </p>
        <p>
        	плашка из банка (без изменения текста) (190х25) <span>300</span
        	><button class="earn-button" data-type="banner-190x25">+</button>
        </p>
          <p>
        	маечка из банка (350х750) <span>500</span
        	><button class="earn-button" data-type="shirt-350х750">+</button>
        </p>
        <p>
        	трусики из банка (230х130) <span>300</span
        	><button class="earn-button" data-type="pans-230x130">+</button>
        </p>
        <p>
        	комплект из банка целиком <span>1000</span
        	><button class="earn-button" data-type="set-complete">+</button>
        </p>
        <p>
        	выкуп внешности (на месяц) обязательно указывать конкретную внешность <span>3000</span
        	><button class="earn-button" data-type="appearance-buyout">+</button>
        </p>
        <p>
        	имя и фамилия для нужного или твинка (на месяц) <span>600</span
        	><button class="earn-button" data-type="name-surname">+</button>
        </p>
        <p>первая смена персонажа/внешности <span class="free-change">бесплатно</span></p>
        <p>
        	вторая и далее смена персонажа/внешности <span>1000</span
        	><button class="earn-button" data-type="change-appearance">+</button>
        </p>
        <p>
        	возможность перебросить дайс 1 раз в квесте <span>700</span
        	><button class="earn-button" data-type="reroll-dice">+</button>
        </p>
        <p>
        	заставить участника квеста перебрасывать кубик <span>1000</span
        	><button class="earn-button" data-type="force-reroll">+</button>
        </p>
        <p>
        	листовка с нужным на месяц (делаем мы) <span>2000</span
        	><button class="earn-button" data-type="leaflet-we-make">+</button>
        </p>
        <p>
        	листовка с нужным на месяц (вашего изготовления) <span>1000</span
        	><button class="earn-button" data-type="leaflet-your-make">+</button>
        </p>
        <p>
        	добавить ваши смайлы (10 штук) <span>800</span
        	><button class="earn-button" data-type="add-smileys">+</button>
        </p>
        <p>
        	открываем и ведем квест по вашей идее (услуги ГМ) <span>3000</span
        	><button class="earn-button" data-type="quest-idea">+</button>
        </p>
        <p>
        	добавить ваш шрифт на форум <span>100</span
        	><button class="earn-button" data-type="add-font">+</button>
        </p>
        <p>
        	возможность выбрать кого-то (не себя) в таблицу в качестве активиста (не чаще раза в месяц)
        	<span>1000</span><button class="earn-button" data-type="choose-activist">+</button>
        </p>
        <p>
        	возможность выбрать пост (не свой) в таблицу в качестве лучшего поста (не чаще раза в месяц)
        	<span>1000</span><button class="earn-button" data-type="choose-best-post">+</button>
        </p>
        <p>
        	возможность выбрать эпизод (не свой) в таблицу в качестве лучшего эпизода (не чаще раза в месяц)
        	<span>1000</span><button class="earn-button" data-type="choose-best-episode">+</button>
        </p>
        <p>
        	добавить свой трек в плейлист шапки форума
        	<span>200</span><button class="earn-button" data-type="add-track">+</button>
        </p>
        <p>
        	купить сюжетный эпизод <span>3500</span
        	><button class="earn-button" data-type="buy-story-episode">+</button>
        </p>
        <p>
        	закрыть флуд от пользователя на период важных дел (на ваши сроки) <span>1500</span
        	><button class="earn-button" data-type="close-flood">+</button>
        </p>
    	</div>
    </div>
	</div>

	<!-- Секция комплектов -->
	<div style="width: 100%" class="bk-main-all-bt bk-main-all-bt-r2">
    <div class="bk-main-all-left-tit">комплекты</div>
    <div class="bk-main-all-bt-all">

        <div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">1</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/86934.png" />
        <img class="bk-main-all-bt-all-r2-one-img2" src="https://upforme.ru/uploads/001b/03/46/4/844126.png" />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/928106.png" />
        <button class="buy-button" data-type="set-complete" data-set="1">купить</button>
    	</div>

        <div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">2</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/594097.png" />
        <img class="bk-main-all-bt-all-r2-one-img2" src="https://upforme.ru/uploads/001b/03/46/4/378917.png" />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/727905.png" />
        <button class="buy-button" data-type="set-complete" data-set="2">купить</button>
    	</div>

        <div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">3</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/372550.png" />
        <img class="bk-main-all-bt-all-r2-one-img2" src="https://upforme.ru/uploads/001b/03/46/4/722443.png" />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/466497.png" />
        <button class="buy-button" data-type="set-complete" data-set="3">купить</button>
    	</div>

        <div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">4</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/436876.png" />
        <img class="bk-main-all-bt-all-r2-one-img2" src="https://upforme.ru/uploads/001b/03/46/4/271950.png" />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/148398.png" />
        <button class="buy-button" data-type="set-complete" data-set="4">купить</button>
    	</div>

    	<div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">5</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/817696.png" />
        <img   class="bk-main-all-bt-all-r2-one-img2" src="https://upforme.ru/uploads/001b/03/46/4/501993.png" />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/300472.png" />
        <button class="buy-button" data-type="set-complete" data-set="5">купить</button>
    	</div>

    	<div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">6</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/723878.png" />
        <img  class="bk-main-all-bt-all-r2-one-img2"  src="https://upforme.ru/uploads/001b/03/46/4/715732.png"    />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/723604.png" />
        <button class="buy-button" data-type="set-complete" data-set="6">купить</button>
    	</div>

    	<div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">7</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/284874.png" />
        <img   class="bk-main-all-bt-all-r2-one-img2" src="https://upforme.ru/uploads/001b/03/46/4/355608.png" />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/456739.png" />
        <button class="buy-button" data-type="set-complete" data-set="7">купить</button>
    	</div>

    	<div class="bk-main-all-bt-all-r2-one">
        <p class="bk-main-all-bt-all-r2-one-t" style="font-size: 11px">8</p>
        <img src="https://upforme.ru/uploads/001b/03/46/4/936581.png" />
        <img  class="bk-main-all-bt-all-r2-one-img2"  src="https://upforme.ru/uploads/001b/03/46/4/636469.png"    />
        <img class="bk-main-all-bt-all-r2-one-img" src="https://upforme.ru/uploads/001b/03/46/4/475227.png" />
        <button class="buy-button" data-type="set-complete" data-set="8">купить</button>
    	</div>
    



    </div>
	</div>

	<!-- Модальное окно -->
	<div id="earnModal" class="modal">
    <div class="modal-content">
    	<span class="close">&times;</span>
    	<div id="modalContent"></div>
    </div>
	</div>

	<!-- Предварительный просмотр выбранных пунктов -->
	<div id="selected-items-preview">
    <div class="preview-empty">Выберите пункты для заработка</div>
	</div>

	<!-- Кнопка "Закончить" -->
	<button id="finishBtn" class="finish-btn">Закончить</button>
</div>

<script src="https://forumstatic.ru/files/001b/d4/18/93854.js?" type="text/javascript">
</script>

hide-autor
________
старая тема

0

Ответить
Страница: 1

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

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


Вы здесь » blanche design studio » themes » новая тема / оформы тут (если заказаны)

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