Skip to content

X
Ximper-Linux-Site
Commit 2d9167a6 authored by prolinux's avatar prolinux
Browse files
Options

addfiles

parent 1de8db94
Hide whitespace changes
Inline Side-by-side
Showing with 186 additions and 170 deletions
downloads.html
View file @ 2d9167a6
......@@ -119,11 +119,11 @@
<div class="repo-data-grid">
<div class="repo-data-item">
<span class="data-label">Last update date:</span>
<span class="data-value">2025-09-30 17:46:11</span>
<span class="data-value">2025-09-10 07:20:09</span>
</div>
<div class="repo-data-item">
<span class="data-label">Sisyphus archive date:</span>
<span class="data-value">2025-09-27</span>
<span class="data-value">2025-09-10</span>
</div>
</div>
<div class="repo-action">
......
index.html
View file @ 2d9167a6
......@@ -40,17 +40,20 @@
<div class="header-right">
<a href="https://vk.com/ximperlinux" class="social-icon"><i class="fab fa-vk"></i></a>
<a href="https://t.me/ximperlinux" class="social-icon"><i class="fab fa-telegram"></i></a>
<a href="https://gitlab.eterfund.ru/ximperlinux" class="social-icon"><i class="fab fa-gitlab"></i></a>
</div>
</header>
<main>
<div id="hero-section">
<div id="particles-js"></div>
<div class="hero-text">
<div class="hero-image">
<img src="images/ximperlinux.svg" alt="logo">
<div class="hero-image">
<img src="images/top_ximper.png" alt="logo">
</div>
<div class="hero-text">
<h2>Ximper Linux</h2>
<p>Для тех, кто требует от системы всего и сразу: современный дизайн, высокая скорость и уверенность в завтрашнем дне. Построен на отложенном репозитории ALT Sisyphus и гарантирует стабильность.</p>
</div>
<h2>Ximper Linux</h2>
<p>Для тех, кто требует от системы всего и сразу: современный дизайн, высокая скорость и уверенность в завтрашнем дне. Построен на отложенном репозитории ALT Sisyphus и гарантирует стабильность.</p>
<button id="next-section" class="button outline">Узнать больше</button>
<div class="arrows">
<span class="arrow"></span>
......@@ -61,46 +64,52 @@
</div>
<div id="blocks-text">
<h1>Возможности и удобства</h1>
<hr class="text-hr">
</div>
<div id="blocks-section">
<div class="info-block">
<img src="images/Deffered.png" alt="">
<img src="images/Icons_new/0_1 Deferred_shadow.png" alt="Deferred">
<h3>Tested. Trusted. Deferred.</h3>
<p>В вашем распоряжении — вся мощь и разнообразие репозитория ALT Sisyphus. Благодаря модели Deferred каждое обновление проходит тщательную проверку, прежде чем попасть к вам.</p>
</div>
<div class="info-block">
<img src="images/easy.png" alt="">
<img src="images/Icons_new/0_2 Minimal Install_shadow.png" alt="">
<h3>Минимальная установка</h3>
<p>Опционально доступна, позволяет пользователям настроить систему и добавить только необходимые компоненты.</p>
</div>
<div class="info-block">
<img src="images/circles.png" alt="">
<h3>Однородная цветовая гамма в GTK и QT</h3>
<p>Единая цветовая гамма для GTK и QT придает системе стильный и согласованный внешний вид, повышая ее эстетическое качество.</p>
</div>
<div class="info-block">
<img src="images/EPM.png" alt="">
<h3>Удобный пакетный менеджер EPM из коробки</h3>
<img src="images/Icons_new/0_3 EPM_shadow.png" alt="">
<h3>Удобный пакетный менеджер EPM</h3>
<p>Присутствие удобного пакетного менеджера EPM упрощает процесс установки, обновления и управления программами, делая опыт использования более комфортным.</p>
</div>
<div class="info-block">
<img src="images/console.png" alt="">
<img src="images/Icons_new/0_4 Games_shadow.png" alt="">
<h3>Играйте с максимальной производительностью</h3>
<p>Используем передовые решения для запуска Windows-игр на Linux. PortProton работает из коробки, обеспечивая плавный гейминг без компромиссов.</p>
</div>
<div class="info-block">
<img src="images/file-system.png" alt="">
<h3>Выбор файловой системы при установке</h3>
<p>Возможность выбора файловой системы при установке, включая BTRFS, дополняется интегрированным инструментом резервного копирования Timeshift, что способствует улучшению устойчивости системы.</p>
<img src="images/Icons_new/0_5 Telegram_shadow.png" alt="">
<h3>Наше комьюнити в Телеграм</h3>
<p>Присоединяйся к нашему комьюнити в телеграм. Если вы ищете место, где можно перекусить
и отдохнуть, место, где можно хорошо выпить и поговорить, место, где вам всегда подскажут, как подзаработать ...</p>
</div>
<div class="info-block">
<img src="images/Icons_new/0_6 EPM Play_shadow.png" alt="">
<h3>EPM Play из коробки</h3>
<p>ЕPM Play — инструмент, позволяющий автоматически устанавливать и удалять пакеты, используя заготовленные сценарии, при этом не используя сторонние репозитории.</p>
</div>
</div>
<div class="variants-text">
<h1>Идеальный выбор для каждого</h1>
<hr class="text-hr">
</div>
<div class="distro-showcase">
<div class="distro-variant">
<div class="distro-image">
<img src="images/ximperclassic.png" alt="Ximper Linux GNOME">
<img src="images/mock_1.png" alt="Ximper Linux GNOME">
</div>
<div class="distro-content">
<h2>Ximper Linux GNOME</h2>
......@@ -108,17 +117,19 @@
<div class="requirements">
<h3>Системные требования</h3>
<ul>
<li><i class="fas fa-microchip"></i> Процессор: 2-ядерный, 64-бит (рекомендуется 4-ядерный)</li>
<li><i class="fas fa-memory"></i> ОЗУ: 4 Гб (рекомендуется 8 Гб для комфортной работы)</li>
<li><i class="fas fa-desktop"></i> Графика: Любой совместимый GPU с поддержкой OpenGL 3.3+</li>
<li><i class="fas fa-hdd"></i> ПЗУ: 40 Гб</li>
<li><i class="fas fa-microchip"></i><b class="text_bold">Процессор:</b> 2-ядерный, 64-бит (рекомендуется 4-ядерный)</li>
<li><i class="fas fa-memory"></i><b class="text_bold">ОЗУ:</b> 4 Гб (рекомендуется 8 Гб для комфортной работы)</li>
<li><i class="fas fa-desktop"></i><b class="text_bold">Графика:</b> Любой совместимый GPU с поддержкой OpenGL 3.3+</li>
<li><i class="fas fa-hdd"></i><b class="text_bold">Жесткий диск:</b> 40 Гб</li>
</ul>
</div>
<button id="next-section" class="button_download">Перейти в загрузки</button>
</div>
</div>
<div class="distro-variant reverse">
<div class="distro-variant">
<div class="distro-image">
<img src="images/ximperhypr.png" alt="Ximper Linux Hyprland">
<img src="images/mock_1.png" alt="Ximper Linux Hyprland">
</div>
<div class="distro-content">
<h2>Ximper Linux Hyprland</h2>
......@@ -126,64 +137,28 @@
<div class="requirements">
<h3>Системные требования</h3>
<ul>
<li><i class="fas fa-microchip"></i> Процессор: 2-ядерный, 64-бит</li>
<li><i class="fas fa-memory"></i> ОЗУ: 4 Гб</li>
<li><i class="fas fa-desktop"></i> Графика: Современный GPU с поддержкой Wayland</li>
<li><i class="fas fa-hdd"></i> ПЗУ: 40 Гб</li>
</ul>
</div>
</div>
</div>
<div class="distro-variant">
<div class="distro-image">
<img src="images/ximpnvd.png" alt="Ximper Linux GNOME NVIDIA">
</div>
<div class="distro-content">
<h2>Ximper Linux GNOME NVIDIA</h2>
<p>Оптимизирован для видеокарт NVIDIA, этот вариант обеспечивает наилучшую производительность в играх и графических приложениях. Подходит для геймеров и специалистов в области дизайна.</p>
<div class="requirements">
<h3>Системные требования</h3>
<ul>
<li><i class="fas fa-microchip"></i> Процессор: 4-ядерный, 64-бит</li>
<li><i class="fas fa-memory"></i> ОЗУ: 8 Гб</li>
<li><i class="fas fa-desktop"></i> Графика: Видеокарта NVIDIA с поддержкой проприетарных драйверов</li>
<li><i class="fas fa-hdd"></i> ПЗУ: 40 Гб (рекомендуется 60+ Гб)</li>
<li><i class="fas fa-microchip"></i><b class="text_bold">Процессор:</b> 2-ядерный, 64-бит</li>
<li><i class="fas fa-memory"></i><b class="text_bold">ОЗУ:</b> 4 Гб</li>
<li><i class="fas fa-desktop"></i><b class="text_bold">Графика:</b> Современный GPU с поддержкой Wayland</li>
<li><i class="fas fa-hdd"></i><b class="text_bold">Жесткий диск:</b> 40 Гб</li>
</ul>
</div>
<button id="next-section" class="button_download">Перейти в загрузки</button>
</div>
</div>
<div class="distro-variant reverse">
<div class="distro-image">
<img src="images/ximphnvd.png" alt="Ximper Linux Hyprland NVIDIA">
</div>
<div class="distro-content">
<h2>Ximper Linux Hyprland NVIDIA</h2>
<p>Оптимизирован для видеокарт NVIDIA. Обеспечивает быструю работу и высокую эффективность как в играх, так и в ресурсоемких графических приложениях. Идеален для геймеров и дизайнеров, ценящих скорость, стабильность и гибкость.</p>
<div class="requirements">
<h3>Системные требования</h3>
<ul>
<li><i class="fas fa-microchip"></i> Процессор: 2-ядерный, 64-бит (рекомендуется 4-ядерный)</li>
<li><i class="fas fa-memory"></i> ОЗУ: 4 Гб</li>
<li><i class="fas fa-desktop"></i> Графика: Видеокарта NVIDIA с поддержкой проприетарных драйверов</li>
<li><i class="fas fa-hdd"></i> ПЗУ: 40 Гб (рекомендуется 60+ Гб)</li>
</ul>
</div>
</div>
</div>
</div>
<div class="download-text-block">
<h1>Скачайте Ximper Linux и наслаждайтесь его возможностями!</h1>
<a href="downloads.html" class="button outline">Перейти на страницу загрузок</a>
</div>
</main>
<footer>
<div class="footer-left">
<a href="https://t.me/ximperlinux" class="social-icon"><i class="fab fa-telegram"></i></a>
<a href="https://vk.com/ximperlinux" class="social-icon"><i class="fab fa-vk"></i></a>
<p id="contact-info">© ООО «Этерсофт». Санкт-Петербург <a href="license.html" id="license-link">Лицензионное соглашение</a></p>
</div>
<div class="footer-center">
<p id="contact-info">© ООО «Этерсофт». Санкт-Петербург</p>
<a href="license.html" id="license-link">Лицензионное соглашение</a>
</div>
<div class="footer-right">
<a href="https://etersoft.ru"><img src="images/logoteamv2.png" alt="Etersoft" class="logo"></a>
......
styles.css
View file @ 2d9167a6
......@@ -32,8 +32,9 @@
}
:root {
--border: #7E01FF;
--bg: #0B0E1D;
--border: #434347;
--bg: #1d1d20;
--fg: #ffffff;
--link-color: #b79ced;
--link-hover: #ffffff;
--gradient: linear-gradient(45deg, #fff 30%, #b79ced 100%);
......@@ -45,7 +46,7 @@ body {
padding: 0;
font-family: Evolventa, Arial, sans-serif;
color: #fff;
background: #000;
background: #1d1d20;
position: relative;
display: flex;
flex-direction: column;
......@@ -59,10 +60,6 @@ body::before {
left: 0;
width: 120vw;
height: 120vh;
background: radial-gradient(circle, rgba(75, 0, 130, 0.6), rgba(0, 0, 0, 0));
filter: blur(150px);
animation: glowAnimation 30s infinite ease-in-out;
z-index: -1;
pointer-events: none;
}
......@@ -93,16 +90,6 @@ body::before {
}
}
/* Контейнер для частиц */
#particles-js {
position: absolute;
width: 100%;
height: 100%;
z-index: 0;
top: 0;
left: 0;
}
/* Стили для ссылок */
a {
color: var(--link-color);
......@@ -159,7 +146,7 @@ a:not(.button, .social-icon, .home-link, .header-menu, .footer-right, .mobile-me
color: #fff;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
box-sizing: border-box;
border: 2px solid var(--border);
border: 0px solid var(--border);
border-radius: 15px;
position: relative;
overflow: hidden;
......@@ -194,17 +181,19 @@ header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px 20px;
padding: 20px 20px;
margin: 0;
position: fixed;
width: calc(100% - 40px);
top: 12px;
left: 12px;
right: 12px;
width: 100%;
top: 0px;
left: 0px;
right: 0px;
z-index: 1000;
transition: background-color 0.8s;
box-sizing: border-box;
border: 2px solid var(--border);
border-radius: 15px;
border: 0px solid var(--border);
border-radius: 0px;
max-width: 1700px;
}
.header-left {
......@@ -212,11 +201,13 @@ header {
align-items: center;
flex: 1;
min-width: 0;
margin: 0 0 0 20%;
}
.header-left .logo {
width: 30px;
margin-right: 15px;
padding: 0px 0px 3px 0px;
}
.home-link {
......@@ -276,13 +267,14 @@ header {
justify-content: flex-end;
flex: 1;
min-width: 0;
margin: 0 20% 0 0;
}
.header-right .social-icon {
color: #fff;
margin-left: 15px;
margin-left: 25px;
text-decoration: none;
font-size: 24px;
font-size: 18px;
transition: transform 0.3s;
}
......@@ -299,8 +291,9 @@ header h1 {
/* Мобильная версия для хедера */
@media (max-width: 768px) {
header {
padding: 8px 15px;
width: calc(100% - 30px);
padding: 15px 15px;
width: 100%;
margin: 0
}
.header-center {
......@@ -313,7 +306,7 @@ header h1 {
.header-right {
order: 2;
flex: 0;
margin: 0;
margin: 0px !important;
}
.header-menu ul li {
......@@ -322,7 +315,7 @@ header h1 {
.header-right .social-icon {
font-size: 20px;
margin-left: 10px;
margin-left: 15px;
}
.header-left {
......@@ -330,6 +323,16 @@ header h1 {
}
}
/* Когда окно на полэкрана */
@media (max-width: 970px) {
.header-right {
margin: 0px !important;
}
.header-left {
margin: 0px !important;
}
}
/* Кнопка меню */
.menu-button {
position: fixed;
......@@ -406,42 +409,51 @@ header h1 {
/* Стили для основного контента */
main {
flex: 1;
padding-bottom: 20px;
/* padding-bottom: 20px; */
padding: 0px 10% 20px 10%;
position: relative;
margin-top: 80px;
max-width: 1500px;
}
#hero-section {
display: flex;
background-image: url("images/head.png");
background-repeat: no-repeat;
background-size: cover;
justify-content: center;
align-items: center;
flex-direction: column;
height: 100vh;
text-align: center;
text-align: left;
position: relative;
margin-top: -20px;
overflow: hidden;
}
.hero-image {
margin-bottom: 20px;
width: auto;
}
.hero-image img {
max-width: 30%;
float: left;
max-width: 50%;
padding: 20px 0;
height: auto;
border-radius: 15px;
}
.hero-text {
max-width: 600px;
position: relative;
position: left;
z-index: 2;
}
.hero-text h2 {
font-size: 48px;
margin: 20px 0;
background: var(--gradient);
margin: 0;
background: var(--fg);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
......@@ -496,14 +508,16 @@ main {
}
#next-section {
display: block;
padding: 10px 20px;
font-size: 18px;
background-color: var(--bg);
font-weight: bold;
background: linear-gradient(38deg,#009dff,#ca00de);
color: #fff;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
box-sizing: border-box;
border: 2px solid var(--border);
border-radius: 15px;
border: 0px solid var(--border);
border-radius: 10px;
}
/* Контейнер с преимуществами */
......@@ -512,34 +526,41 @@ main {
grid-template-columns: repeat(3, 1fr); /* Три карточки в ряд */
gap: 30px;
padding: 60px 20px;
background: transparent;
background-color: var(--bg);
position: relative;
overflow: hidden;
}
#blocks-text {
text-align: center;
padding: 20px;
padding: 10px;
background-color: var(--bg);
}
/* Подчеркивание h1 */
.text-hr {
width: 50%;
max-width: 500px;
}
.info-block {
background: rgba(11, 14, 29, 0.8);
border: 2px solid var(--border);
border-radius: 20px;
padding: 25px;
background: #2d2d32;
border-radius: 10px;
padding: 25px 25px 40px 25px;
position: relative;
backdrop-filter: blur(10px);
transform-style: preserve-3d;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
width: 90%; /* Уменьшаем ширину карточек */
height: 90%;
margin: 0 auto; /* Центрируем карточки */
}
.info-block:hover {
transform: translateY(-10px) scale(1.02);
border-color: var(--border); /* Анимация границы при наведении */
box-shadow: 0 15px 45px rgba(126, 1, 255, 0.4);
box-shadow: 0 15px 45px #111111;
}
.info-block:hover::before {
......@@ -547,25 +568,24 @@ main {
}
.info-block img {
width: 70px;
height: 70px;
width: 100%;
height: 60%;
object-fit: contain;
margin-bottom: 20px;
margin-bottom: 10px;
filter: drop-shadow(0 4px 6px rgba(126, 1, 255, 0.3));
transition: transform 0.3s;
}
.info-block:hover img {
transform: scale(1.1) rotate(-5deg);
}
.info-block h3 {
font-size: 1.4em;
margin-bottom: 12px;
background: var(--gradient);
background: var(--fg);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 0 2px 4px rgba(126, 1, 255, 0.3);
}
.info-block p {
......@@ -574,6 +594,7 @@ main {
color: rgba(255, 255, 255, 0.9);
position: relative;
z-index: 1;
margin-bottom: 70px;
}
/* Адаптация для планшетов */
......@@ -581,6 +602,9 @@ main {
#blocks-section {
grid-template-columns: repeat(2, 1fr); /* Две карточки в ряд на планшетах */
}
main {
padding: 0px 0% 20px 0% !important;
}
}
/* Адаптация для мобильных устройств */
......@@ -591,16 +615,21 @@ main {
}
.info-block {
padding: 20px;
padding: 20px 20px 60px 20px;
}
.info-block h3 {
font-size: 1.2em;
}
main {
padding: 0px 0% 20px 0% !important;
}
}
/* Блок с карточками */
.variants-text {
background: var(--bg);
text-align: center;
padding: 20px;
}
......@@ -665,7 +694,7 @@ main {
.download-text-block {
text-align: center;
padding: 20px;
background: transparent;
background: #1d1d20;
}
/* Адаптация карточек для мобильных устройств */
......@@ -682,18 +711,19 @@ main {
/* Стили для футера */
footer {
background-color: var(--bg);
padding: 15px 20px;
padding: 15px 0px;
color: #fff;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
position: relative;
margin: 12px;
margin: 0px;
box-sizing: border-box;
border: 2px solid var(--border);
border-radius: 15px;
width: calc(100% - 24px);
border: 0px solid var(--border);
border-radius: 0px;
width: 100%;
max-width: 1500px;
}
.footer-left {
......@@ -701,19 +731,9 @@ footer {
align-items: center;
justify-content: flex-start;
flex: 1;
min-width: 0;
}
.footer-left .social-icon {
color: #fff;
margin-right: 15px;
text-decoration: none;
font-size: 24px;
transition: transform 0.3s;
}
.footer-left .social-icon:hover {
transform: translateY(-3px);
min-height: 80px;
margin: 0 0 0 10%;
max-width: 20%;
}
.footer-center {
......@@ -722,7 +742,7 @@ footer {
justify-content: center;
align-items: center;
text-align: center;
flex: 2;
flex: 1;
min-width: 0;
}
......@@ -750,6 +770,7 @@ footer {
justify-content: flex-end;
flex: 1;
min-width: 0;
margin: 0 10% 0 0;
}
.footer-right .logo {
......@@ -769,7 +790,7 @@ footer {
.footer-left, .footer-center, .footer-right {
margin: 10px 0;
width: 100%;
width: 80%;
justify-content: center;
}
......@@ -814,9 +835,9 @@ footer {
}
.license-content {
background: rgba(11, 14, 29, 0.8);
background: var(--bg);
border: 2px solid var(--border);
border-radius: 20px;
border-radius: 10px;
padding: 40px;
backdrop-filter: blur(10px);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
......@@ -826,7 +847,7 @@ footer {
font-size: 2.5em;
text-align: center;
margin-bottom: 10px;
background: var(--gradient);
background: var(--fg);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
......@@ -876,10 +897,9 @@ footer {
.company-info {
font-style: italic;
background: rgba(126, 1, 255, 0.1);
background: var(--bg);
padding: 15px;
border-radius: 10px;
border-left: 3px solid var(--border);
}
.back-button {
......@@ -1004,6 +1024,19 @@ footer {
transform: translateY(-2px);
}
.button_download {
background: transparent;
border: 0px solid var(--border);
color: #fff;
margin: 20px 0px;
transition: all 0.3s ease;
}
.button_download:hover {
background: var(--border);
transform: translateY(-3px);
}
.repo-footer {
text-align: center;
padding: 15px;
......@@ -1139,8 +1172,10 @@ footer {
}
.distro-showcase {
padding: 10px 10px;
background: transparent;
padding: 10px;
background-image: url("images/head_2.png");
background-repeat: no-repeat;
background-size: cover;
position: relative;
}
......@@ -1148,28 +1183,26 @@ footer {
display: flex;
align-items: center;
margin-bottom: 80px;
background: rgba(11, 14, 29, 0.8);
border: 2px solid var(--border);
background: rgba(11, 14, 29, 0.0);
border: 0px solid var(--border);
border-radius: 20px;
overflow: hidden;
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.0);
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.distro-variant.reverse {
flex-direction: row-reverse;
}
.distro-image {
flex: 1;
min-width: 40%;
min-width: 30%;
overflow: hidden;
margin-bottom: 0px;
}
.distro-image img {
width: 100%;
height: 100%;
object-fit: cover;
object-fit: contain;
transition: transform 0.5s ease;
}
......@@ -1198,10 +1231,9 @@ footer {
}
.requirements {
background: rgba(126, 1, 255, 0.1);
background: #272728;
padding: 20px;
border-radius: 12px;
border-left: 4px solid var(--border);
}
.requirements h3 {
......@@ -1224,13 +1256,17 @@ footer {
}
.requirements li i {
margin-right: 10px;
color: #7E01FF;
margin-right: 15px;
color: var(--fg);
font-size: 1.2em;
min-width: 24px;
text-align: center;
}
.requirements li b {
margin-right: 10px;
}
/* Адаптация для планшетов */
@media (max-width: 1024px) {
.distro-variant,
......@@ -1239,7 +1275,7 @@ footer {
}
.distro-image {
min-height: 300px;
min-height: 100px;
}
}
......@@ -1264,4 +1300,9 @@ footer {
.requirements {
padding: 15px;
}
.distro-image {
margin-bottom: -20px;
height: 100%;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment