timer to services

This commit is contained in:
2025-06-05 11:58:39 +03:00
parent c707b0b7e6
commit 857df8faf2
3 changed files with 108 additions and 10 deletions
+15
View File
@@ -7,6 +7,11 @@
<title>mROA, где ROA - remote object access</title> <title>mROA, где ROA - remote object access</title>
<link rel="shortcut icon" href="img/icon.png" type="image/png"> <link rel="shortcut icon" href="img/icon.png" type="image/png">
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/tokyo-night-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/csharp.min.js"></script>
<script>hljs.highlightAll();</script>
<style> <style>
main p { main p {
font-size: large; font-size: large;
@@ -99,12 +104,22 @@
версия mROA, позволявшаяя передавать своеобразные ссылки на объекты с сервера на клиент, а в последствии и с версия mROA, позволявшаяя передавать своеобразные ссылки на объекты с сервера на клиент, а в последствии и с
клиента на сервер и использовать их для удаленного вызова методов</p> клиента на сервер и использовать их для удаленного вызова методов</p>
<!-- <pre><code class="language-csharp">// Определение интерфейса для удаленного объекта
public class X
{
public static int A()
{
}
}
</code></pre> -->
</main> </main>
<footer> <footer>
<p>&copy; 2025 Моя страница. Наверное какие-то права защищены!!! <span id="random-emoji"></span></p> <p>&copy; 2025 Моя страница. Наверное какие-то права защищены!!! <span id="random-emoji"></span></p>
</footer> </footer>
<script src="scripts.js"> <script src="scripts.js">
</script> </script>
</body> </body>
+23 -3
View File
@@ -1,3 +1,23 @@
const emojis = ['😊', '😎', '🤓', '😄', '😉', '😋', '😜', '🤪', '😇', '🥳']; function getRandomEmoji() {
const randomEmoji = emojis[Math.floor(Math.random() * emojis.length)]; // Диапазоны Unicode для эмодзи
document.getElementById('random-emoji').textContent = randomEmoji; const ranges = [
[0x1F600, 0x1F64F],
];
// Выбираем случайный диапазон
const range = ranges[Math.floor(Math.random() * ranges.length)];
// Генерируем случайный код в выбранном диапазоне
const codePoint = Math.floor(Math.random() * (range[1] - range[0] + 1)) + range[0];
// Преобразуем код в эмодзи
return String.fromCodePoint(codePoint);
}
// Добавляем эмодзи в футер
document.addEventListener('DOMContentLoaded', function() {
const emojiSpan = document.getElementById('random-emoji');
if (emojiSpan) {
emojiSpan.textContent = getRandomEmoji();
}
});
+69 -6
View File
@@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="ru"> <html lang="ru">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -19,14 +20,17 @@
background: linear-gradient(to bottom, #1a1a2e, #16213e); background: linear-gradient(to bottom, #1a1a2e, #16213e);
color: white; color: white;
} }
header { header {
text-align: center; text-align: center;
padding-top: 0px; padding-top: 0px;
padding-bottom: 2rem; padding-bottom: 2rem;
} }
nav { nav {
margin-bottom: 32px; margin-bottom: 32px;
} }
nav ul { nav ul {
list-style: none; list-style: none;
padding: 0; padding: 0;
@@ -36,6 +40,7 @@
gap: 2rem; gap: 2rem;
align-items: center; align-items: center;
} }
nav a { nav a {
color: white; color: white;
text-decoration: none; text-decoration: none;
@@ -44,34 +49,58 @@
border-radius: 5px; border-radius: 5px;
transition: background-color 0.3s; transition: background-color 0.3s;
} }
nav a:hover { nav a:hover {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
} }
nav a.brand { nav a.brand {
font-family: 'Space Grotesk', monospace; font-family: 'Space Grotesk', monospace;
font-size: 1.4rem; font-size: 1.4rem;
font-weight: 600; font-weight: 600;
color: #e94560; color: #e94560;
} }
nav a.brand:hover { nav a.brand:hover {
color: #ff6b81; color: #ff6b81;
} }
main {
main,
.timer {
padding: 2rem 0; padding: 2rem 0;
background: rgba(255, 255, 255, 0.05); background: rgba(255, 255, 255, 0.05);
border-radius: 10px; border-radius: 10px;
padding: 2rem; padding: 2rem;
backdrop-filter: blur(5px); backdrop-filter: blur(5px);
} }
.timer {
max-width: 600px;
margin: 0 auto;
text-align: center;
}
.timer h2 {
margin-top: 0;
color: #e94560;
}
.timer p {
margin: 0.5rem 0;
}
footer { footer {
text-align: center; text-align: center;
padding: 1rem 0; padding: 1rem 0;
margin-top: 2rem; margin-top: 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.2); border-top: 1px solid rgba(255, 255, 255, 0.2);
} }
h1, h2 {
h1,
h2 {
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
} }
.service-card { .service-card {
background: rgba(255, 255, 255, 0.05); background: rgba(255, 255, 255, 0.05);
border-radius: 8px; border-radius: 8px;
@@ -82,9 +111,11 @@
gap: 2rem; gap: 2rem;
align-items: center; align-items: center;
} }
.service-card .content { .service-card .content {
flex: 1; flex: 1;
} }
.service-card img { .service-card img {
width: 200px; width: 200px;
height: 200px; height: 200px;
@@ -92,10 +123,12 @@
border-radius: 8px; border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
} }
.service-card h3 { .service-card h3 {
margin-top: 0; margin-top: 0;
color: #e94560; color: #e94560;
} }
.service-card .terms-link { .service-card .terms-link {
display: inline-block; display: inline-block;
margin-top: 1rem; margin-top: 1rem;
@@ -104,6 +137,7 @@
font-weight: bold; font-weight: bold;
transition: color 0.3s; transition: color 0.3s;
} }
.service-card .terms-link:hover { .service-card .terms-link:hover {
color: #ff6b81; color: #ff6b81;
text-decoration: underline; text-decoration: underline;
@@ -177,6 +211,7 @@
} }
</style> </style>
</head> </head>
<body> <body>
<header> <header>
<nav> <nav>
@@ -185,10 +220,35 @@
<li><a href="flagships.html">Флагманы</a></li> <li><a href="flagships.html">Флагманы</a></li>
<li><a href="index.html#projects">Другие проекты</a></li> <li><a href="index.html#projects">Другие проекты</a></li>
<li><a href="services.html">Услуги</a></li> <li><a href="services.html">Услуги</a></li>
<li><a href="https://github.com/YaslePoy" class="github-link" target="_blank"><img src="img/github-mark-white.svg" alt="GitHub">GitHub</a></li> <li><a href="https://github.com/YaslePoy" class="github-link" target="_blank"><img
src="img/github-mark-white.svg" alt="GitHub">GitHub</a></li>
</ul> </ul>
</nav> </nav>
<h1>Услуги</h1> <h1>Услуги</h1>
<div class="timer">
<h2>Удивительная скидка 000%</h2>
<p>осталось до окончания акции</p>
<p id="timer-watch" style="font-size: 30px;">00:00:00</p>
<script>
const timer = document.getElementById("timer-watch")
let original_time = Date.now() + 1000 * 60 * 60 * 19;
function update() {
let r = Math.random() ;
console.log(r);
if (r > 0.4){
original_time += 2000;
}
let distance = original_time - Date.now();
const days = Math.floor(distance / (1000 * 60 * 60 * 24));
const hours = Math.floor((distance / (1000 * 60 * 60)) % 24);
const minutes = Math.floor((distance / (1000 * 60)) % 60);
const seconds = Math.floor((distance / 1000) % 60);
timer.innerHTML = `${days}:${hours}:${minutes}:${seconds}`;
}
setInterval(update, 1000);
</script>
</div>
</header> </header>
<main> <main>
@@ -196,7 +256,8 @@
<img src="img/arma76.png" alt="Raspberry Pi хостинг"> <img src="img/arma76.png" alt="Raspberry Pi хостинг">
<div class="content"> <div class="content">
<h3>Простой хостинг</h3> <h3>Простой хостинг</h3>
<p>Хостинг на базе Raspberry Pi с предоставлением субдомена. Идеальное решение для небольших проектов и тестирования.</p> <p>Хостинг на базе Raspberry Pi с предоставлением субдомена. Идеальное решение для небольших проектов и
тестирования.</p>
<ul> <ul>
<li>Хостинг на Raspberry Pi</li> <li>Хостинг на Raspberry Pi</li>
<li>Предоставление субдомена</li> <li>Предоставление субдомена</li>
@@ -209,7 +270,8 @@
<img src="img/7700x.webp" alt="Ryzen сервер"> <img src="img/7700x.webp" alt="Ryzen сервер">
<div class="content"> <div class="content">
<h3>Unlimited-хостинг</h3> <h3>Unlimited-хостинг</h3>
<p>Мощный хостинг на сервере с процессором Ryzen 7 7700x. Максимальная производительность для ваших проектов.</p> <p>Мощный хостинг на сервере с процессором Ryzen 7 7700x. Максимальная производительность для ваших
проектов.</p>
<ul> <ul>
<li>Хостинг на Ryzen 7 7700x</li> <li>Хостинг на Ryzen 7 7700x</li>
<li>Высокая производительность</li> <li>Высокая производительность</li>
@@ -221,9 +283,10 @@
</main> </main>
<footer> <footer>
<p>&copy; 2025 Моя страница. Все права защищены. <span id="random-emoji"></span></p> <p>&copy; 2025 Моя страница. Все права защищены. <span id="random-emoji"></span></p>
</footer> </footer>
<script src="scripts.js"></script> <script src="scripts.js"></script>
</body> </body>
</html> </html>