initial commit - code moved to separate repo
This commit is contained in:
73
pages/guidelines.tsx
Normal file
73
pages/guidelines.tsx
Normal file
@ -0,0 +1,73 @@
|
||||
import React, { useState } from 'react';
|
||||
import Layout from "../components/layout";
|
||||
|
||||
const PDFViewerPage = () => {
|
||||
const [language, setLanguage] = useState('bg'); // default language is Bulgarian
|
||||
|
||||
// Determine the PDF file based on the selected language
|
||||
const pdfFiles = {
|
||||
en: '/content/guidelines/S-148_E.pdf',
|
||||
bg: '/content/guidelines/S-148_BL.pdf',
|
||||
ru: '/content/guidelines/S-148_U.pdf',
|
||||
};
|
||||
const languages = [
|
||||
{ code: 'en', label: 'English' },
|
||||
{ code: 'bg', label: 'Български' },
|
||||
{ code: 'ru', label: 'Русский' },
|
||||
];
|
||||
|
||||
const pdfFile = pdfFiles[language];
|
||||
const toggleLanguage = () => {
|
||||
const languages = Object.keys(pdfFiles);
|
||||
const currentLangIndex = languages.indexOf(language);
|
||||
const nextLangIndex = (currentLangIndex + 1) % languages.length;
|
||||
setLanguage(languages[nextLangIndex]);
|
||||
};
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<h1 className="text-3xl font-bold">Напътствия</h1>
|
||||
<div className="guidelines-section mb-5 p-4 bg-gray-100 rounded-lg">
|
||||
<h2 className="text-2xl font-semibold mb-3">Важни напътствия за службата</h2>
|
||||
<ol className="list-decimal list-inside">
|
||||
<li><strong>Щандове:</strong> Предлагаме следното:
|
||||
<ul className="list-disc list-inside ml-4">
|
||||
<li>Да има известно разстояние между нас и щандовете. Целта е да оставим хората свободно да се доближат до количките и ако някой прояви интерес може да се приближим.</li>
|
||||
<li>Когато сме двама или трима може да стоим заедно. Ако сме четирима би било хубаво да се разделим по двама на количка и количките да са на известно разстояние една от друга.</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><strong>Безопасност:</strong> Нека се страем зад нас винаги да има защита или препятствие за недобронамерени хора.</li>
|
||||
<li><strong>Плакати:</strong> Моля при придвижване на количките да слагате плакатите така, че илюстрацията да се вижда, когато калъфа е сложен. Целта е снимките да не се търкат в количката, защото се повреждат.</li>
|
||||
<li><strong>Литература:</strong> При проявен интерес на чужд език, използвайте списанията и трактатите на други езици в папките.</li>
|
||||
<li><strong>График:</strong> Моля да ни изпратите вашите предпочитания до 23-то число на месеца.<a href='https://docs.google.com/forms/d/e/1FAIpQLSdLpuTi0o9laOYmenGJetY6MJ-CmphD9xFS5ZVz_7ipOxNGUQ/viewform?usp=sf_link'> Линк към анкетата</a></li>
|
||||
<li><strong>Случки:</strong> Ако сте имали хубави случки на количките, моля пишете ни.</li>
|
||||
</ol>
|
||||
|
||||
</div>
|
||||
|
||||
<div style={{ width: '100%', height: 'calc(100vh - 100px)' }}> {/* Adjust the 100px based on your header/footer size */}
|
||||
<div className="my-4 flex items-center">
|
||||
{languages.map((lang, index) => (
|
||||
<React.Fragment key={lang.code}>
|
||||
{index > 0 && <div className="bg-gray-400 w-px h-6"></div>} {/* Vertical line separator */}
|
||||
<button
|
||||
onClick={() => setLanguage(lang.code)}
|
||||
className={`text-lg py-2 px-4 ${language === lang.code ? 'bg-blue-500 text-white' : 'bg-gray-200 text-gray-800 hover:bg-blue-500 hover:text-white'} ${index === 0 ? 'rounded-l-full' : index === languages.length - 1 ? 'rounded-r-full' : ''}`}
|
||||
>
|
||||
{lang.label}
|
||||
</button>
|
||||
</React.Fragment>
|
||||
))}
|
||||
</div>
|
||||
<div style={{ width: 'calc(100% - 1rem)', height: '100%', margin: '0 0' }}> {/* Center the PDF with 2rem margin */}
|
||||
<object data={pdfFile} type="application/pdf" style={{ width: '100%', height: '100%' }}>
|
||||
<p>Your browser does not support PDFs. Please download the PDF to view it: <a href={pdfFile}>Свали PDF файла</a>.</p>
|
||||
<p>Вашият браузър не поддържа PDFs файлове. Моля свалете файла за да го разгледате: <a href={pdfFile}>Свали PDF файла</a>.</p>
|
||||
</object>
|
||||
</div>
|
||||
</div>
|
||||
</Layout >
|
||||
);
|
||||
};
|
||||
|
||||
export default PDFViewerPage;
|
Reference in New Issue
Block a user