[hideprofile][html]
<style>
.user-hub {
max-width: 950px;
margin: 0px auto;
background: var(--lightgray);
border-radius: 0px;
font-family: var(--navlinksmainf);
padding: 0px;
position: relative;
overflow: hidden;
border: 1px solid var(--border1);
}
.hub-header {
background: url(https://upforme.ru/uploads/001c/a0/e3/4/190211.jpg) center no-repeat;
height: 200px;
border-radius: 0px;
border: var(--profimgb);
width: 950px;
margin: auto;
}
.hub-header h1 {
font-family: var(--headfname);
color: #fff;
font-size: 61px;
text-align: center;
height: 76px;
line-height: 1.4;
}
.hub-nav {
display: flex;
justify-content: center;
flex-wrap: wrap;
margin-top: -14px;
gap: 10px;
}
.hub-nav label {
display: flex;
align-items: center;
text-decoration: none;
transition: 0.7s;
font-weight: 600;
font-size: 15px;
cursor: pointer;
text-transform: uppercase;
color: var(--subborder);
padding: 3px 20px;
background: var(--darkgray);
border-radius: 0px;
}
#tab-scripts:checked ~ .hub-nav label[for='tab-scripts'], #tab-notes:checked ~ .hub-nav label[for='tab-notes'], #tab-characters:checked ~ .hub-nav label[for='tab-characters'], #tab-about:checked ~ .hub-nav label[for='tab-about'], #tab-pres:checked ~ .hub-nav label[for='tab-pres'], #tab-hlw:checked ~ .hub-nav label[for='tab-hlw'] {
color: var(--darkgray);
background: var(--golgsub);
border: none;
}
.hub-nav label:hover {
color: var(--darkgray);
background: var(--golgsub);
border: none;
}
img.phon {
width: 163px;
height: 28px;
object-fit: cover;
border-radius: 15px;
}
.hub-content section {
width: 100%;
display: none;
margin: 25px 30px;
opacity: 0;
transform: translateY(10px);
animation: fadeMove 0.4s ease forwards;
padding: 20px;
border-radius: 0px;
padding-top: 10px;
}
.hub-content h2 {
font-size: 20px;
font-family: var(--font-title);
text-transform: lowercase;
font-weight: bold;
color: var(--punbg);
letter-spacing: 1px;
padding: 10px 70px;
text-shadow: -1px -1px 0 var(--mainborder), 1px -1px 0 var(--mainborder), -1px 1px 0 var(--mainborder), 1px 1px 0 var(--mainborder);
}
.shop-back p {
padding: 0px 70px 10px !important;
}
.mag-plashj, .mag-icon {
display: flex;
flex-wrap: wrap;
gap: 5px;
justify-content: center;
}
.mag-plashj, .mag-icon, .mag-phon, .mag-nabli, .mag-pres {
padding: 10px 50px;
}
.shop-span {
padding: 5px 0px;
background: #e9e9ed;
width: max-content;
margin: 20px 0px 0px 0px;
font-family: var(--font-title);
font-size: 12px;
text-align: center;
color: var(--darklila) !important;
font-weight: bold;
line-height: 2;
}
.mag-pres {
height: 123px;
overflow-y: auto;
display: flex;
justify-content: space-around;
justify-content: flex-start;
flex-wrap: wrap;
}
.shop-back {
padding: 20px;
border: 1px solid var(--subborder);
display: flex;
flex-direction: column;
margin-bottom: 20px;
}
.mag-nab {
display: flex;
flex-wrap: wrap;
gap: 25px;
justify-content: space-around;
}
.mag-nabli {
display: flex;
flex-direction: column;
align-items: anchor-center;
gap: 5px;
padding: 10px;
border-radius: 15px;
border-left: var(--profimgb);
border-right: var(--profimgb);
}
.mag-pres img {
height: 60px;
object-fit: cover; /* Чтобы изображение не искажалось */
border-radius: 8px; /* Можно добавить скругление, если нужно */
}
.mag-phon {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: center;
}
.mag-plashj img {
width: 163px;
height: 28px;
object-fit: cover;
}
.mag-icon img {
width: 30px;
height: 30px;
object-fit: cover;
}
.mag-phon img {
width: 163px;
height: 28px;
object-fit: cover;
border-radius: 15px;
}
.tabbed input[type='radio'] {
display: none;
}
@keyframes fadeMove {
to {
opacity: 1;
transform: translateY(0);
}
}
#tab-scripts:checked ~ .tabs #content-scripts,
#tab-notes:checked ~ .tabs #content-notes,
#tab-characters:checked ~ .tabs #content-characters,
#tab-about:checked ~ .tabs #content-about,
#tab-pres:checked ~ .tabs #content-pres,
#tab-hlw:checked ~ .tabs #content-hlw{
display: block;
}
</style>
<section class="user-hub tabbed">
<header class="hub-header">
<h1></h1>
</header>
<input type="radio" name="tabs" id="tab-scripts" checked />
<input type="radio" name="tabs" id="tab-notes" />
<input type="radio" name="tabs" id="tab-characters" />
<input type="radio" name="tabs" id="tab-about" />
<input type="radio" name="tabs" id="tab-pres" />
<input type="radio" name="tabs" id="tab-hlw" />
<div class="hub-nav">
<label for="tab-scripts">Плашки</label>
<label for="tab-notes">Иконки</label>
<label for="tab-characters">Фоны</label>
<label for="tab-about">Наборы</label>
<label for="tab-pres">Подарки</label>
<label for="tab-hlw">Xmas</label>
</div>
<main class="hub-content tabs">
<section id="content-scripts">
<div class="shop-back">
<h2>700 USD</h2>
<div class="mag-plashj">
<img src="https://upforme.ru/uploads/001c/85/42/7/687849.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/420504.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/113099.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/913934.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/989589.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/756447.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/204210.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/741062.png">
</div>
</div>
<div class="shop-back">
<h2>850 USD</h2>
<div class="mag-plashj">
<img src="https://upforme.ru/uploads/001c/85/42/7/197594.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/822334.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/575426.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/780770.gif">
</div>
</div>
<div class="shop-back">
<h2>действия в постах, читайте всплывашки</h2>
<div class="mag-plashj">
<img src="https://upforme.ru/uploads/001c/85/42/2/65768.png" title="драка на кулаках">
<img src="https://upforme.ru/uploads/001c/85/42/2/76543.png" title="закупился в магазине">
<img src="https://upforme.ru/uploads/001c/85/42/2/711127.png" title="смс-сообщения">
<img src="https://upforme.ru/uploads/001c/85/42/2/149124.png" title="поездка на такси">
<img src="https://upforme.ru/uploads/001c/85/42/2/932951.png" title="занялся сексом">
<img src="https://upforme.ru/uploads/001c/85/42/2/605653.png" title="сходил в ресторан/кафе">
<img src="https://upforme.ru/uploads/001c/85/42/2/344905.png" title="напился">
<img src="https://upforme.ru/uploads/001c/85/42/2/680727.png" title="использовал самую сильную способность">
</div>
</div>
<div class="shop-back">
<center><span class="shop-span">стоимость плашки со своими исходниками - 1000$ (анимацию нельзя)</span></center>
</div>
</section>
<section id="content-notes">
<div class="shop-back">
<h2>статика — 500 USD</h2>
<div class="mag-icon">
<img src="https://upforme.ru/uploads/001c/85/42/7/799237.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/816806.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/622254.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/866926.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/554940.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/135677.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/522936.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/417356.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/48368.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/181115.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/586295.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/917640.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/62751.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/961022.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/556055.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/157494.png">
</div>
</div>
<div class="shop-back">
<h2>анимация — 600 USD</h2>
<div class="mag-icon">
<img src="https://upforme.ru/uploads/001c/85/42/7/11035.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/17631.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/25610.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/27512.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/33932.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/42946.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/53143.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/81343.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/85160.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/304643.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/827399.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/827228.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/368669.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/949269.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/475743.gif">
</div>
</div>
<div class="shop-back">
<h2>достижения, читайте всплывашки</h2>
<div class="mag-icon">
<img src="https://upforme.ru/uploads/001c/85/42/2/54300.gif" title="100 сообщений">
<img src="https://upforme.ru/uploads/001c/85/42/2/59481.gif" title="400 сообщений">
<img src="https://upforme.ru/uploads/001c/85/42/2/656629.gif" title="800 сообщений">
<img src="https://upforme.ru/uploads/001c/85/42/2/140045.gif" title="100 позитива">
<img src="https://upforme.ru/uploads/001c/85/42/2/454446.gif" title="400 позитива">
<img src="https://upforme.ru/uploads/001c/85/42/2/397384.gif" title="800 позитива">
<img src="https://upforme.ru/uploads/001c/85/42/2/279900.gif" title="100 уважения">
<img src="https://upforme.ru/uploads/001c/85/42/2/43309.gif" title="400 уважения">
<img src="https://upforme.ru/uploads/001c/85/42/2/249352.gif" title="800 уважения">
<img src="https://upforme.ru/uploads/001c/85/42/2/47925.gif" title="5 закрытых эпизодов">
<img src="https://upforme.ru/uploads/001c/85/42/2/575166.gif" title="5 написанных постов">
<img src="https://upforme.ru/uploads/001c/85/42/2/212405.gif" title="50 реклам">
</div>
</div>
<div class="shop-back">
<center><span class="shop-span">стоимость своей иконки статика/анимация - 600/700$</span></center>
</div>
</section>
<section id="content-characters">
<div class="shop-back">
<h2>1000 USD (в профиле они будут в обработке)</h2>
<p>если открыть как отдельное изображение - можно увидеть фулл</p>
<div class="mag-phon">
<img src="https://upforme.ru/uploads/001c/85/42/7/411248.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/825394.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/912931.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/304934.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/372446.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/41303.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/499852.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/193797.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/802268.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/161882.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/85331.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/272567.jpg">
</div>
</div>
<div class="shop-back">
<center> <span class="shop-span">стоимость вашего фона - 1300$</span></center>
</div>
</section>
<section id="content-about">
<div class="shop-back">
<h2> 1500 USD</h2>
<div class="mag-nab">
<div class="mag-nabli"><img src="https://upforme.ru/uploads/001c/85/42/7/597694.jpg" class="phon"><img src="https://upforme.ru/uploads/001c/85/42/7/256495.png"><img src="https://upforme.ru/uploads/001c/85/42/7/596620.gif"></div>
<div class="mag-nabli"><img src="https://upforme.ru/uploads/001c/85/42/7/306910.png" class="phon"><img src="https://upforme.ru/uploads/001c/85/42/7/306910.png"><img src="https://upforme.ru/uploads/001c/85/42/7/306910.png"></div>
<div class="mag-nabli"><img src="https://upforme.ru/uploads/001c/85/42/7/583653.png" class="phon"><img src="https://upforme.ru/uploads/001c/85/42/7/450139.png"><img src="https://upforme.ru/uploads/001c/85/42/7/958179.gif"></div>
</div>
</div>
</section>
<section id="content-pres">
<div class="shop-back">
<h2> 500 USD</h2>
<div class="mag-pres">
<img src="https://upforme.ru/uploads/001c/85/42/2/36126.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/183784.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/387066.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/419059.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/419643.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/443168.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/444428.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/508266.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/528840.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/532457.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/551431.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/560382.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/580379.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/599673.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/607167.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/628462.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/659631.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/697567.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/713224.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/739834.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/755372.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/815885.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/899603.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/932500.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/953110.png">
<img src="https://upforme.ru/uploads/001c/85/42/2/975009.png">
</div>
</div>
<div class="shop-back">
<center><span class="shop-span">стоимость своего подарка - 800$</span></center>
</div>
</section>
<section id="content-hlw">
<div class="shop-back">
<h2>плашки — 550 USD</h2>
<div class="mag-plashj">
<img src="https://upforme.ru/uploads/001c/85/42/7/794179.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/394962.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/455934.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/82981.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/648949.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/472865.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/488945.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/940587.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/20008.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/98496.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/504201.gif">
</div>
</div>
<div class="shop-back">
<h2>фон — 650 USD</h2>
<div class="mag-phon">
<img src="https://upforme.ru/uploads/001c/85/42/7/741218.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/918255.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/124787.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/382022.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/739145.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/619155.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/809159.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/851005.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/860418.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/473948.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/609889.jpg">
<img src="https://upforme.ru/uploads/001c/85/42/7/537832.jpg">
</div>
</div>
<div class="shop-back">
<h2>иконки — 330 USD</h2>
<div class="mag-icon">
<img src="https://upforme.ru/uploads/001c/85/42/7/406461.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/768159.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/742877.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/329116.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/827402.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/484084.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/219687.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/944121.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/97012.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/225927.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/934901.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/183754.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/686494.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/50986.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/884375.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/923527.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/749072.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/112681.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/849370.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/85440.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/738195.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/879904.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/968036.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/865244.gif">
<img src="https://upforme.ru/uploads/001c/85/42/7/914353.gif">
</div>
</div>
<div class="shop-back">
<h2>подарки — 440 USD</h2>
<div class="mag-pres">
<img src="https://upforme.ru/uploads/001c/85/42/7/340371.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/574375.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/320571.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/936547.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/972231.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/350927.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/344440.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/239935.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/53006.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/616583.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/60448.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/837031.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/546088.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/370055.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/40470.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/111328.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/706686.png">
<img src="https://upforme.ru/uploads/001c/85/42/7/69452.png">
</div>
</div>
<div class="shop-back">
<center><span class="shop-span">1. Праздничный магазин открыт до 15.01<br>
2. Любая вещь может быть получена бесплатно на 1 аккаунт<br>
3. Товары не убираются после покупки. То есть другой человек может купить такую же плашку, например, как взяли вы</span></center>
</div>
</section>
</main>
</section>
[/html]
магазин обновляется каждую 1—2 недели
пишите сразу: ставить или в коллекцию
просьбы сменить что-то из уже купленного и/или находящегося в коллекции вот сюда
| |
Шаблон со своим исходником | |