Skip to content

Воронков Валерий / krystalvpn

Go to a project
Toggle navigation
Toggle navigation pinning
Commit f09b4c87 by xcoder
Options

Add translates

1 parent 469b4933
Inline Side-by-side
Showing 4 changed files with 118 additions and 19 deletions
index.html
......@@ -45,7 +45,7 @@
</div>
</div>
<button type="button" class="lng btn download" onclick="do_download()">
<button type="button" data-lang="download" class="btn download" onclick="do_download()">
Скачать KRYSTALVPN
</button>
</li>
......@@ -59,12 +59,12 @@
</div>
<div class="card descr">
<div class="descr-top">
<div class="descr-top__title-top">
<div class="descr-top__title-top" data-lang="truely">
Открой для себя по-настоящему
</div>
<div class="descr-top__title-bottom">
<span class="title__colored"> быстрый и безопасный </span>
<span class="title__uncolored">VPN сервис</span>
<span class="title__colored" data-lang="fast">быстрый и безопасный</span>
<span class="title__uncolored" data-lang="vpn-service">VPN сервис</span>
</div>
</div>
<div class="descr-bottom">
......@@ -73,10 +73,10 @@
<img src="./assets/planet.svg" alt="description logo" />
</div>
<div class="d-card-wrapper">
<div class="lng d-card-wrapper__title">
<div class="d-card-wrapper__title" data-lang="world-points">
Защищенный доступ в любой точке мира
</div>
<div class="lng d-card-wrapper__content">
<div class="d-card-wrapper__content" data-lang="servers">
Надежное подключение к виртуальной частной сети (ВПН) из любой
точки мира. Наши высокоскоростные серверы в 94 странах помогут
вам взять контроль в свои руки.
......@@ -88,10 +88,10 @@
<img src="./assets/speed.svg" alt="description logo" />
</div>
<div class="d-card-wrapper">
<div class="lng d-card-wrapper__title">
<div class="lng d-card-wrapper__title" data-lang="speed">
Высокая скорость везде и всегда
</div>
<div class="lng d-card-wrapper__content">
<div class="d-card-wrapper__content" data-lang="details">
Наша VPN-сеть создана для скорости и использует технологии
нового поколения.
</div>
......@@ -102,10 +102,10 @@
<img src="./assets/safe.svg" alt="description logo" />
</div>
<div class="d-card-wrapper">
<div class="lng d-card-wrapper__title">
<div class="d-card-wrapper__title" data-lang="safety">
Безопасный Интернет за пару секунд
</div>
<div class="lng d-card-wrapper__content">
<div class="d-card-wrapper__content" data-lang="description">
Использование Интернета не означает, что все должны видеть
ваши личные данные. Совершаете ли вы покупки онлайн или
подключаетесь к Wi-Fi в кафе, вы можете обеспечить более
......@@ -118,10 +118,10 @@
<img src="./assets/cashback.svg" alt="description logo" />
</div>
<div class="d-card-wrapper">
<div class="lng d-card-wrapper__title">
<div class="d-card-wrapper__title" data-lang="guarantees">
Гарантия возврата денег 30 дней
</div>
<div class="lng d-card-wrapper__content">
<div class="d-card-wrapper__content" data-lang="our-service">
Наш VPN-сервис прост в использовании. Как и наша гарантия.
Если вам что-то не нравится, мы вернем ваши деньги. Никаких
вопросов, никакого риска
......@@ -134,13 +134,13 @@
<div class="main-second">
<div class="card descr">
<div class="third-description-wrapper">
<div class="lng third-top-title">
<div class="third-top-title" data-lang="can-use">
Можно использовать
</div>
<span class="lng third-top-second">на всех устройствах</span>
<span class="third-top-second" data-lang="all-devs">на всех устройствах</span>
</div>
<article class="lng notation-one">
<article class="notation-one" data-lang="subscribes">
Оформив подписку на Krystal VPN, вы получите удобные приложения для всех ваших устройств, включая телефоны, планшеты,
компьютеры, роутеры и многие другие девайсы.
</article>
......@@ -162,13 +162,13 @@
</div>
</div>
<div class="main-third">
<div class="lng main-third__title">
<div class="main-third__title" data-lang="support-onl">
Наши специалисты доступны 24/7 в онлайн-чате и по электронной почте,
чтобы помочь вам с установкой и устранением неполадок.
</div>
<div class="support-btn">
<button type="button" class="lng btn support" onclick="do_support()">
<button type="button" data-lang="support" class="btn support" onclick="do_support()">
Связаться с нами
</button>
</div>
......@@ -184,10 +184,11 @@
<div class="text-center second">
&copy;
<span class="year"></span>
<span class="lng">Все права защищены.</span>
<span data-lang="rights">Все права защищены.</span>
</div>
</footer>
<script src="bootstrap.min.js"></script>
<script src="lang.js"></script>
<script src="index.js"></script>
</body>
</html>
index.js
......@@ -46,6 +46,18 @@ function switchLang(lang) {
if (langNode != null) {
langNode.classList.add("active");
}
for (const key in langDict) {
const langNode = document.querySelector(`[data-lang=${CSS.escape(key)}]`);
if (langNode != null) {
const translate = langDict[key][lang];
if (translate != null) {
langNode.innerHTML = translate;
}
}
}
}
openLang();
......
lang.js 0 → 100644
const langDict = {
"rights": {
"ru": "Все права защищены.",
"en": "All rights reserved.",
},
"support": {
"ru": "Связаться с нами",
"en": "Contact us",
},
"support-onl": {
"ru": `Наши специалисты доступны 24/7 в онлайн-чате и по электронной почте,
чтобы помочь вам с установкой и устранением неполадок.`,
"en": `Our experts are available 24/7 via live chat and email,
to help you with installation and troubleshooting.`,
},
"can-use": {
"ru": "Можно использовать",
"en": "Can be used",
},
"all-devs": {
"ru": "на всех устройствах",
"en": "on all devices",
},
"subscribes": {
"ru": `Оформив подписку на Krystal VPN, вы получите удобные приложения для всех ваших устройств, включая телефоны, планшеты,
компьютеры, роутеры и многие другие девайсы.`,
"en": `By subscribing to Krystal VPN, you will get convenient applications for all your devices, including phones, tablets,
computers, routers and many other devices.`,
},
"our-service": {
"ru": `Наш VPN-сервис прост в использовании. Как и наша гарантия. Если вам что-то не нравится, мы вернем ваши деньги. Никаких
вопросов, никакого риска`,
"en": `Our VPN service is easy to use. As is our guarantee. If you don't like something, we will refund your money. Any
questions, no risk`,
},
"guarantees": {
"ru": `Гарантия возврата денег 30 дней`,
"en": `30 days money back guarantee`,
},
"description": {
"ru": `Использование Интернета не означает, что все должны видеть ваши личные данные. Совершаете ли вы покупки онлайн или
подключаетесь к Wi-Fi в кафе, вы можете обеспечить более серьезную защиту своей персональной информации`,
"en": `Using the Internet does not mean that everyone should see your personal data. Do you shop online or connect
to Wi-Fi in a cafe, you can provide more serious protection of your personal information`,
},
"safety": {
"ru": "Безопасный Интернет за пару секунд",
"en": "Secure Internet in a couple of seconds",
},
"details": {
"ru": `Наша VPN-сеть создана для скорости и использует технологии нового поколения.`,
"en": `Our VPN is built for speed and uses next generation technology.`,
},
"speed": {
"ru": "Высокая скорость везде и всегда",
"en": "High speed everywhere and always",
},
"servers": {
"ru": `Надежное подключение к виртуальной частной сети (ВПН) из любой точки мира. Наши высокоскоростные серверы в 94 странах помогут
вам взять контроль в свои руки.`,
"en": `Reliable connection to a virtual private network (VPN) from any points of the world. Our high-speed servers in 94 countries will help
you take control into your own hands.`,
},
"world-points": {
"ru": "Защищенный доступ в любой точке мира",
"en": "Secure access anywhere in the world",
},
"vpn-service": {
"ru": "VPN сервис",
"en": "VPN service",
},
"fast": {
"ru": "быстрый и безопасный",
"en": "fast and safe",
},
"truely": {
"ru": "Открой для себя по-настоящему",
"en": "Discover for real",
},
"download": {
"ru": "Скачать KRYSTALVPN",
"en": "Download KRYSTALVPN",
},
};
\ No newline at end of file
style.css
......@@ -174,7 +174,7 @@ header > .nav.nav-pills > .nav-item.detailed > .dropdown > .btn.lng-switcher {
.main > .main-first > .card.descr > .descr-top {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
flex-direction: column;
padding: 20px 0 22px 0;
......@@ -274,6 +274,7 @@ header > .nav.nav-pills > .nav-item.detailed > .dropdown > .btn.lng-switcher {
font-style: normal;
max-width: 400px;
min-width: 400px;
color: #fff;
}
......@@ -380,6 +381,7 @@ article.notation-one {
line-height: 16px;
color: #ffffff;
text-align: end;
}
.main-third {
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!