ПОТОМ УДОЛЮ

Поделиться12025-08-03 22:55:14

Автор: все борги делают это
high tech
Зарегистрирован: 2025-07-27
Сообщений: 68
Уважение: +11
Провел на форуме:
3 дня 18 часов
Последний визит:
2026-01-12 07:04:30

мне тут уютно

0

Поделиться22025-08-03 23:18:20

Автор: все борги делают это
high tech
Зарегистрирован: 2025-07-27
Сообщений: 68
Уважение: +11
Провел на форуме:
3 дня 18 часов
Последний визит:
2026-01-12 07:04:30

[html]

}

mainneeded > div {
width: 965px;
height: 140px;
padding: 10px;
position: relative;
display: flex;
gap: 10px;
overflow-x: hidden;
scroll-behavior: auto;
transform: translateZ(0);
will-change: scroll-position;
}

mainneeded::before {
content: '';
width: 1003px;
height: 140px;
left: -12px;
top: -11px;
border: 3px solid #665e5952;
border-radius: 10px;
position: absolute;
}

.char-cont {
width: 235px;
height: 110px;
position: relative;
display: block;
will-change: transform;
padding: 5px;
box-sizing: border-box;
flex-shrink: 0;
}

mainneeded > div > a > div > div > p {
z-index: 2;
position: absolute;
color: white;
padding: 0px 10px !important;
font-weight: 400;
letter-spacing: 1px;
border-radius: 5px 5px 0 0 ;
text-transform: uppercase;
right: -5px;
top: 3px;
}
mainneeded > div > a > div > div {
position: absolute;
width: 130px !important;
z-index: 3;
top: 15px !important;
background: #0000007a;
height: 100%;
right: 0px;
overflow: hidden;
backdrop-filter: blur(8px);
border-top-left-radius: 15px;
}

mainneeded > div > a > div > div::before {
content: "";
position: absolute;
inset: 0;
left: 15px;
top: 20px;
width: 200px;
height: 150px;
background: linear-gradient(356deg, rgb(189, 163, 128), rgb(251, 218, 165), rgb(201, 168, 123), rgb(189, 163, 128), rgb(251, 218, 165), rgb(189, 163, 128));
clip-path: polygon(0 14px,14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px,3px calc(14px + 1.24px),3px calc(100% - 14px - 1.24px),calc(14px + 1.24px) calc(100% - 3px),calc(100% - 14px - 1.24px) calc(100% - 3px),calc(100% - 3px) calc(100% - 14px - 1.24px),calc(100% - 3px) calc(14px + 1.24px),calc(100% - 14px - 1.24px) 3px,calc(14px + 1.24px) 3px,3px calc(14px + 1.24px));
}

mainneeded > div > a > div > div > ul {
position: absolute;
width: 100px;
z-index: 2;
top: 29px;
display: flex;
flex-direction: column;
gap: 3px;
color: white;
}
mainneeded > div > a > div > div > ul li {
text-transform: lowercase;
font-weight: 400;
font-size: 11px;
line-height: 10px;
position: relative;
left: 26px;
}

mainneeded > div > a > div > div > ul li::before {
content: '';
width: 11px;
height: 11px;
position: absolute;
background: linear-gradient(35deg, rgb(189, 163, 128), rgb(251, 218, 165), rgb(201, 168, 123), rgb(189, 163, 128), rgb(251, 218, 165), rgb(189, 163, 128));
left: -15px;
top: 0px;
border-radius: 50%;
}

mainneeded > div > a img {
width: 75px;
height: 100px;
object-fit: cover;
overflow: hidden;
border-radius: 6px;
}

chardescript {
width: 100%;
height: 100%;
color: inherit;
text-align: left;
padding: 0px;
box-sizing: border-box;
font-weight: 300;
top: 0;
z-index: 5;
}

mainneeded > div > a > div {
display: grid;
grid-template-columns: 40% 60%;
}

.char-cont chardescript span {
line-height: 1;
font-size: 11px;
text-align: left;
height: 80px;
display: block;
overflow: auto;

}

.carousel-left, .carousel-right {
z-index: 15;
}

.carousel-left {
position: absolute;
border: none;
box-sizing: border-box;
color: #726e6a;
font-size: 40px;
cursor: pointer;
left: -22px;
top: 37px;
border-radius: 5px;
backdrop-filter: blur(8px);
background: #ffffff57;
}
.carousel-right {
position: absolute;
border: none;
box-sizing: border-box;
color: #726e6a;
font-size: 40px;
cursor: pointer;
right: -22px;
top: 37px;
border-radius: 5px;
backdrop-filter: blur(8px);
background: #ffffff57;
}

</style>

<chardescript>
<p>Unico Uni</p>