тест

Поделиться12025-12-27 12:16:58

священное оружие
1740
Автор: Jeffrey Royal
Администратор
Сообщений: 283
Уважение: +138
Джеффри, 241
думаю только о нем и о нем, о своем пустом резерве магии
Посты: 17
Последний визит:
Вчера 19:04:58

.

0

Поделиться22025-12-27 12:18:01

священное оружие
1740
Автор: Jeffrey Royal
Администратор
Сообщений: 283
Уважение: +138
Джеффри, 241
думаю только о нем и о нем, о своем пустом резерве магии
Посты: 17
Последний визит:
Вчера 19:04:58

-

0

Поделиться32025-12-27 13:48:44

священное оружие
1740
Автор: Jeffrey Royal
Администратор
Сообщений: 283
Уважение: +138
Джеффри, 241
думаю только о нем и о нем, о своем пустом резерве магии
Посты: 17
Последний визит:
Вчера 19:04:58

одной из самых красивых пар посвящаю
@finn sawyer и @september ross

[html]
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

.card-container {
width: 100%;
max-width: 1200px;
background: rgba(10, 30, 40, 0.85);
border-radius: 25px;
padding: 40px;
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.7);
position: relative;
border: 5px solid #000;
overflow: hidden;
}

/* Декоративные еловые ветки */
.decoration {
position: absolute;
z-index: 1;
pointer-events: none;
}

.decoration-1 {
top: -20px;
left: -15px;
width: 250px;

}

.decoration-2 {
bottom: -20px;
right: -20px;
width: 200px;
}

.decoration-3 {
top: 50%;
left: -30px;

width: 150px;
}

.decoration-4 {
top: 50%;
right: -30px;
transform: translateY(-50%) rotate(-90deg);
width: 150px;
}

/* Контент */
.card-content {
position: relative;
z-index: 2;
}

.images-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 25px;
margin-bottom: 40px;
}

.image-frame {
width: 300px;
height: 300px;
position: relative;
border-radius: 15px;
overflow: hidden;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5);
transition: transform 0.5s ease;
background: #57785c1a;
display: flex;
justify-content: center;
align-items: center;
}

.image-frame:hover {
transform: scale(1.1);
z-index: 10;
}

.image-frame img {
width: 90%;
height: 90%;
object-fit: cover;
border-radius: 10px;
position: relative;
z-index: 1;
}

/* Повороты */
.frame-1 { transform: rotate(-5deg); }
.frame-1:hover { transform: rotate(-5deg) scale(1.1); }

.frame-2 { transform: rotate(2deg); }
.frame-2:hover { transform: rotate(2deg) scale(1.1); }

.frame-3 { transform: rotate(-3deg); }
.frame-3:hover { transform: rotate(-3deg) scale(1.1); }

.frame-4 { transform: rotate(4deg); }
.frame-4:hover { transform: rotate(4deg) scale(1.1); }

.frame-5 { transform: rotate(-2deg); }
.frame-5:hover { transform: rotate(-2deg) scale(1.1); }

/* Украшение рамок */
.frame-decoration {
position: absolute;
width: 30px;
height: 30px;
z-index: 2;
opacity: 0.8;
}

.top-left { top: 8px; left: 8px; }
.top-right { top: 8px; right: 8px; }
.bottom-left { bottom: 8px; left: 8px; }
.bottom-right { bottom: 8px; right: 8px; }

/* Текст */
.greeting-text {
background: #57785c1a;
border-radius: 20px;
padding: 30px;
margin-top: 30px;
border: 2px solid #00000075;
backdrop-filter: blur(5px);
color: #85cf99;
}

.signature {
text-align: right;
margin-top: 10px;
font-style: italic;
font-family: Sunday;
color: #ffaa2a;

}

/* Адаптивность */
@media (max-width: 1100px) {
.image-frame {
width: 180px;
height: 180px;
}
}

@media (max-width: 900px) {
.images-container {
gap: 15px;
}

.image-frame {
width: 130px;
height: 130px;
}

}

@media (max-width: 700px) {
.card-container {
padding: 25px;
}

.image-frame {
width: 100px;
height: 100px;
}

.greeting-text {
padding: 20px;
}

}

@media (max-width: 550px) {
.images-container {
gap: 10px;
}

.image-frame {
width: 85px;
height: 85px;
}

.decoration {
display: none;
}
}
</style>

<div class="snow-container">

<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
</div>

<div class="greeting-text">
<table>
<tr>
<td>Септембер и Финн, в снежный вечер<br>
Пусть придёт к вам счастье без преград.<br>
В Эврике‑Спрингс, под звёздным небом,<br>
Пусть звучит ваш тихий «навсегда».<br></td>
<td>С Новым годом! Светлых дней,<br>
Тёплых встреч и добрых вестей.<br>
Пусть любовь, как снежный шар,<br>
Станет крепче в этот дар. <br></td>
</tr>
</table>
<div class="signature">С новым годом от Люцифера!</div>
</div>
</div>
</div>

<script>
// Простой скрипт для создания снежинок
(function() {
// Ждем немного чтобы все загрузилось
setTimeout(function() {
const snowContainer = document.querySelector('.snow-container');
if (!snowContainer) {
console.error('Не найден .snow-container');
return;
}

// Очищаем если что-то есть
snowContainer.innerHTML = '';

// Создаем 60 снежинок (можно изменить количество)
for (let i = 0; i < 60; i++) {
const snowflake = document.createElement('div');
snowflake.className = 'snowflake';

// Случайные параметры
const left = Math.random() * 100; // 0-100%
const size = Math.random() * 6 + 3; // 3-9px
const duration = Math.random() * 10 + 5; // 5-15 секунд
const delay = Math.random() * 20; // 0-20 секунд
const opacity = 0.5 + Math.random() * 0.5; // 0.5-1

// Применяем стили
snowflake.style.left = left + '%';
snowflake.style.width = size + 'px';
snowflake.style.height = size + 'px';
snowflake.style.animationDuration = duration + 's';
snowflake.style.animationDelay = delay + 's';
snowflake.style.opacity = opacity;

snowContainer.appendChild(snowflake);
}

console.log('Снег создан: ' + snowContainer.children.length + ' снежинок');
}, 100);
})();
</script>
[/html]

оригиналы изображений

0

Поделиться42025-12-27 14:51:14

священное оружие
1740
Автор: Jeffrey Royal
Администратор
Сообщений: 283
Уважение: +138
Джеффри, 241
думаю только о нем и о нем, о своем пустом резерве магии
Посты: 17
Последний визит:
Вчера 19:04:58

hide-autor

одной из самых красивых пар посвящаю
@finn sawyer и @september ross
скрещу пальчики, чтобы вы все-таки были вместе