lerafoxqueen/public/index.html

1638 lines
61 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="ru-RU" data-bs-theme="auto">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="" />
<meta name="author" content="LeraFoxQueen" />
<meta name="generator" content="LeraFoxQueen" />
<title>LeraFoxQueen : Выбор отношений</title>
<link rel="canonical" href="https://LeraFoxQueen.ru" />
<script src="assets/js/color-modes.js"></script>
<link href="dist/css/bootstrap.min.css" rel="stylesheet" />
<link
rel="apple-touch-icon"
href="assets/img/favicons/apple-touch-icon.png"
sizes="180x180"
/>
<link
rel="icon"
href="assets/img/favicons/favicon-32x32.png"
sizes="32x32"
type="image/png"
/>
<link
rel="icon"
href="assets/img/favicons/favicon-16x16.png"
sizes="16x16"
type="image/png"
/>
<link rel="manifest" href="assets/img/favicons/manifest.json" />
<link
rel="mask-icon"
href="assets/img/favicons/safari-pinned-tab.svg"
color="#712cf9"
/>
<link rel="icon" href="assets/img/favicons/favicon.ico" />
<meta name="theme-color" content="#712cf9" />
<!-- <link href="assets/css/pricing.css" rel="stylesheet" /> -->
<style>
body {
width: 100%;
height: 100%;
background: linear-gradient(
135deg,
rgba(163, 0, 204, 0.5) 0%,
rgba(0, 51, 204, 0.5),
rgba(77, 13, 0, 0.5) 100%
);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
.b-example-divider {
width: 100%;
height: 3rem;
background-color: #0000001a;
border: solid rgba(0, 0, 0, 0.15);
border-width: 1px 0;
box-shadow: inset 0 0.5em 1.5em #0000001a,
inset 0 0.125em 0.5em #00000026;
}
.b-example-vr {
flex-shrink: 0;
width: 1.5rem;
height: 100vh;
}
.bi {
vertical-align: -0.125em;
fill: currentColor;
}
.nav-scroller {
position: relative;
z-index: 2;
height: 2.75rem;
overflow-y: hidden;
}
.nav-scroller .nav {
display: flex;
flex-wrap: nowrap;
padding-bottom: 1rem;
margin-top: -1px;
overflow-x: auto;
text-align: center;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
.btn-bd-primary {
--bd-violet-bg: #712cf9;
--bd-violet-rgb: 112.520718, 44.062154, 249.437846;
--bs-btn-font-weight: 600;
--bs-btn-color: var(--bs-white);
--bs-btn-bg: var(--bd-violet-bg);
--bs-btn-border-color: var(--bd-violet-bg);
--bs-btn-hover-color: var(--bs-white);
--bs-btn-hover-bg: #6528e0;
--bs-btn-hover-border-color: #6528e0;
--bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
--bs-btn-active-color: var(--bs-btn-hover-color);
--bs-btn-active-bg: #5a23c8;
--bs-btn-active-border-color: #5a23c8;
}
.bd-mode-toggle {
z-index: 1500;
}
.bd-mode-toggle .bi {
width: 1em;
height: 1em;
}
.bd-mode-toggle .dropdown-menu .active .bi {
display: block !important;
}
.card-min-height {
min-height: 28rem;
}
textarea {
height: 5rem;
}
</style>
<!-- Modal -->
<div
class="modal fade"
id="AboutMeModal"
tabindex="-1"
aria-labelledby="AboutMeModalLabel"
aria-hidden="true"
>
<div
class="modal-dialog modal-fullscreen modal-dialog-centered modal-dialog-scrollable"
>
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="AboutMeModalLabel">Обо мне</h1>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="mb-3">
<p class="p-3">Меня зовут Валерия, мне 35+ лет.</p>
<p class="p-3">
Имя Валерия это женская форма мужского имени Валерий, которое
является римским родовым именем. В переводе с латинского "valeo"
имеет несколько вариантов перевода и значений. Чаще
употребляемыми являются переводы "быть сильной, крепкой", а
также "здравствовать", "быть здоровой". Но у этого латинского
слова существуют ещё и иные варианты перевода, например, "быть
могущественной, сильной", "иметь перевес", "быть влиятельной,
пользоваться влиянием", "иметь смысл, иметь значение".
</p>
<p class="p-3">
Училась в школе в Юридическом классе, после чего поступила в
Университет на Педагога Юриспруденции, 3,5 года изучала
Психологию в ВУЗе и самостоятельно после ВУЗа, проходила
практику в Следственном Отделе и колледже, в Спорт-Зале
тренировалась со Штангой: жим, тяга, присяд (Пауэрлифтинг - это
на Силу, не на объем, как у бодибилдеров, не надо путать),
сейчас занимаюсь Пилатесом.
</p>
<p class="p-3">
Пила́тес — система физических упражнений, разработанная Йозефом
Пилатесом в начале XX века для реабилитации после травм. Автор
назвал свою систему "контрологией", определив её как полную
координацию между телом, умом и духом, но в настоящее время она
широко известна как "метод Пилатеса" или просто "Пилатес".
</p>
<p class="p-3">
В школе закончила с отличием курс Прикладной Экономики, а также
курс Информатики, проработала более 15 лет в отделе
Информационных Технологий в одной организации, решала
разнообразные задачи, была на разных позициях.
</p>
<p class="p-3">
В процессе работы познакомилась с миром Открытого, Свободного
Программного Обеспечения: Операционной Системой Unix, Linux и
Прикладным Программным Обеспечением; выполняла задачи Системного
Администратора Windows Server и Linux Server; Программиста на
разных языках: PHP, Python, Rust, JavaScript; DevOps; создавала
и администрировала Систему Виртуализации Серверов: KVM.
</p>
<p class="p-3">
В качестве Хобби я выбрала Программирование и Разработку
Дериватива Операционной Системы Linux при работе над которым
использовала языки программирования Python, Rust, JavaScript, а
также QML, Bash.
</p>
<p class="p-3">
Дериватив операционной системы Linux — это дистрибутив, который
основан на ядре Linux и включает в себя различные программные
компоненты, утилиты и интерфейсы, которые делают его удобным для
пользователей.
</p>
<p class="p-3">
Дистрибутив операционной системы Linux — это комплект
программного обеспечения, который включает в себя ядро Linux,
системные утилиты, библиотеки, а также набор приложений и
инструментов, необходимых для работы операционной системы.
</p>
<p class="p-3">
Деривативы и Дистрибутивы могут различаться по целям,
функциональности и пользовательскому интерфейсу.
</p>
<p class="p-3">Основные компоненты дистрибутива Linux:</p>
<ol>
<li>
Ядро Linux: Основная часть операционной системы, отвечающая за
управление аппаратными ресурсами и взаимодействие с
программным обеспечением.
</li>
<li>
Системные утилиты: Набор программ, которые обеспечивают
базовые функции операционной системы, такие как управление
файлами, настройка сети и другие системные задачи.
</li>
<li>
Библиотеки: Набор программных библиотек, которые предоставляют
функции и API для приложений.
</li>
<li>
Приложения: Различные программы, которые могут включаться в
дистрибутив, такие как текстовые редакторы, браузеры, офисные
приложения и другие.
</li>
<li>
Установщик: Инструмент, который позволяет пользователю
установить дистрибутив на компьютер.
</li>
</ol>
<p class="p-3">
Дистрибутивы Linux могут быть ориентированы на разные категории
пользователей, например, на начинающих, опытных пользователей
или серверные решения. Некоторые из самых популярных
дистрибутивов включают Ubuntu, Fedora, Debian, Arch Linux и
CentOS. Каждый из них имеет свои особенности и предназначен для
различных задач.
</p>
<p class="p-3">
В данный момент я изучаю Разработку Мобильных Приложений,
интересуюсь языками и технологиями: Kotlin, KMM, Compose; Dart,
Flutter. Будущая профессия - Разработчик Мобильных Приложений.
</p>
<p class="p-3">В свободное время успешно окончила курсы визажа, работала с другими выпускницами на платных фотосессиях.</p>
<p class="p-3">У меня есть домашние животные: два кота и кошка, Мэйнкуны.</p>
<p class="p-3">
В свободное время гуляю, встречаюсь, общаюсь с людьми, учусь,
смотрю Китайские, Корейские, Турецкие Дорамы, Аниме, Фильмы,
играю в игры, в основном компьютерные: MMORPG: Lost Ark;
Стрелялки: Ghost Recon Breakpoint, Ghost Recon Wildlands, The
Division, The Division 2, Rainbow Six Siege, Warframe;
Стратегии: Серия WH40k DoW; но могу и в настольные. Состою в
двух игровых сообществах, в одном 80 человек, в другом 220, а
также в сообществах Программистов и Linux разработчиков,
администраторов и пользователей, проявляю интерес к гражданскому
нарезному полуавтомтическому Оружию.
</p>
<p class="p-3">
Общаюсь с родителями, есть очень близкая подруга. Не пью, не
курю, не употребляю наркотики, не имею татуировки, лишние
проколы на теле, не состою на учёте у психиатра и нарколога, не
имею судимостей действующих и погашеных, имею Водительское
Удостоверение. Имею Высокий Интеллект, Эмпатию и Устойчивую
Психику. Занимаюсь самодиагностикой, а также периодически
посещаю психолога.
</p>
<p class="p-3">
Есть прошлые серьезные отношения 2 раза по 9 лет. Не прыгаю по
ху*м, ищу одного, Надёжного, Ответственного партнёра.
</p>
<p class="p-3">
Люблю людей, которые знают слово Ответственность, умеют её
нести, не трусят, проработали свои травмы, могут упасть,
отряхнуться, встать и пойти дальше.
</p>
<p class="p-3">
Также я верю что бога нет, а то, что называют богом, это
природа, достаточно заменить слово бог везде, где он
употребляется, как всё становится на свои места.
</p>
<p class="p-3">
Не сюжу людей по полу, гендеру, сексуальной ориентации, расе,
национальности, цвету кожи, росту, весу, религиозным,
политеческим убеждениям и тд. Придерживаюсь принципа - "говори
по делу, живи по совести, суди по справедливости".
</p>
<p class="p-3">
Право справедливости — название набора правовых принципов,
действующих в рамках традиции английского общего права, дополняя
строгие правила там, где требование их формального исполнения
могло бы быть слишком жёстким. В правовых системах цивильного
права подобные «общие оговорки» позволяют судьям более свободно
применять нормы законов.
</p>
<p class="p-3">
Мои цели:
<ul>
<li>главная - найти партнёра, с которым мы построим семью, поможем друг другу развиваться, создадим детей любым способом
и передадим им свои знания о мире и вырастим достойных членов общества</li>
<li>промежуточная - найти партнёра, с которым мы создадим союз, в котором мы поможем друг-другу развиваться.</li>
</ul>
</p>
<p class="p-3">
Призываю быть адекватным человеком, здраво оценивать свои
возможности и соотносить их со своими желаниями. А также решать
задачи, вопросы, проблемы "словами через рот", а именно в
личном, устном диалоге между личностями (людьми).
</p>
</div>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Закрыть
</button>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div
class="modal fade"
id="TermModal"
tabindex="-1"
aria-labelledby="TermModalLabel"
aria-hidden="true"
>
<div
class="modal-dialog modal-fullscreen modal-dialog-centered modal-dialog-scrollable"
>
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="TermModalLabel">О сайте</h1>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div class="mb-3">
<p class="p-3">
Информация на данном сайте не является рекламой товаров или
услуг, прямым предложением, публичным оффером или акцептом.
</p>
<p class="p-3">
Любая цена, указанная в на сайте является просто информацией, не
призывающей к действию, она необходима для того, чтобы оценить
на что Вы способны.
</p>
<p class="p-3">
Сбор ответов осуществляется с целью получения статистических
данных о спросе на "рынке" отношений.
</p>
<p class="p-3">
Продолжая оставаться на данном сайте Вы соглашаетесь с данными
условиями.
</p>
</div>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal"
>
Закрыть
</button>
</div>
</div>
</div>
</div>
<!-- Modal -->
<!-- data-bs-backdrop="static" data-bs-keyboard="false" -->
<div
class="modal fade"
id="exampleModal"
tabindex="-1"
aria-labelledby="exampleModalLabel"
aria-hidden="true"
>
<div class="modal-dialog modal-fullscreen modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">
Новое сообщение
</h1>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<form name="profile_send" id="profile_send" action="/datings/add" method="post" class="needs-validation">
<div class="modal-body">
<input
type="hidden"
class="form-control"
id="theme_name"
name="theme_name"
required>
<div class="row">
<div class="form-floating mb-3 col">
<input
type="text"
class="form-control"
id="sender_name"
name="sender_name"
required>
<label for="sender_name">Имя:</label>
</div>
<div class="form-floating mb-3 col">
<select id="sender_sex" name="sender_sex" class="form-control" required>
<option value="" selected disabled></option>
<option value="male">Мужской</option>
<option value="female">Женский</option>
<option value="other">Другой</option>
</select>
<label for="sender_sex">Пол:</label>
</div>
<div class="form-floating mb-3 col">
<input
type="number"
class="form-control"
id="sender_age"
name="sender_age"
min="0"
max="100"
value="0"
step="1"
required>
<label for="sender_age">Возраст:</label>
</div>
<div class="form-floating mb-3 col">
<input
type="text"
class="form-control"
id="telegram_name"
name="telegram_name"
required>
<label for="telegram_name">Telegram:</label>
</div>
</div>
<div class="row">
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="interests_in_school_university" name="interests_in_school_university" required>
<label for="interests_in_school_university">Интересы в школе, вузе:</label>
</div>
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="interests_in_sports" name="interests_in_sports" required>
<label for="interests_in_sports">Интересы в спорте:</label>
</div>
</div>
<div class="row">
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="interests_in_work" name="interests_in_work" required>
<label for="interests_in_work">Интересы в работе:</label>
</div>
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="interests_in_your_free_time" name="interests_in_your_free_time" required>
<label for="interests_in_your_free_time">Интересы в свободное время:</label>
</div>
</div>
<div class="row">
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="pets_plants_fish" name="pets_plants_fish" required>
<label for="pets_plants_fish">Домашние животные, растения, рыбки:</label>
</div>
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="relationships_with_relatives_and_friends" name="relationships_with_relatives_and_friends" required>
<label for="relationships_with_relatives_and_friends">Отношения с родственниками и друзьями:</label>
</div>
</div>
<div class="row">
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="past_relationships" name="past_relationships" required>
<label for="past_relationships">Прошлые отношения:</label>
</div>
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="life_principles_values" name="life_principles_values" required>
<label for="life_principles_values">Жизненные принципы, ценности:</label>
</div>
</div>
<div class="row">
<div class="form-floating mb-3 col">
<input type="text" class="form-control" id="goals_in_life" name="goals_in_life" required>
<label for="goals_in_life">Цели в жизни:</label>
</div>
<div class="col">
<div class="form-floating mb-3">
<textarea class="form-control" id="message_text" name="message_text" required></textarea>
<label for="message_text">Сообщение:</label>
</div>
<div class="mb-3" id="offer_block">
<mark><output id="offer" name="offer"></output></mark>
</div>
<!-- <small style="color: var(--bs-warning-text-emphasis);">Допускаются только буквы русского и английского алфавита, и цифры</small> -->
</div>
</div>
</div>
<div class="modal-footer">
<div class="btn-group" role="group">
<button type="button" class="btn btn-outline-primary" data-bs-dismiss="modal">Закрыть</button>
<button type="reset" class="btn btn-outline-primary">Очистить</button>
<button type="submit" class="btn btn-outline-primary">Отправить</button>
</div>
</div>
</form>
</div>
</div>
</div>
<script>
const exampleModal = document.getElementById("exampleModal");
if (exampleModal) {
exampleModal.addEventListener("show.bs.modal", (event) => {
// Button that triggered the modal
const button = event.relatedTarget;
// Extract info from data-bs-* attributes
const theme = button.getAttribute("data-bs-theme");
// If necessary, you could initiate an Ajax request here
// and then do the updating in a callback.
const offer_block = document.getElementById("offer_block");
const offer_field = document.getElementById("offer");
if (theme === "Секс за деньги") {
offer_block.style.display = "block";
offer_field.value =
"20`000 рублей в час с 18:00 до 21:00 | 40`000 рублей в час с 21:00 до 1:00";
} else if (theme === "Секс без обязательств") {
offer_block.style.display = "block";
offer_field.value = "Чем же ты сможешь меня заинтеревовать?";
} else {
offer_block.style.display = "none";
offer_field.value = "";
}
// Update the modal's content.
const modalTitle = exampleModal.querySelector(".modal-title");
modalTitle.textContent = `${theme}`;
const theme_field = document.getElementById("theme_name");
theme_field.value = theme;
//const modalBodyInput = exampleModal.querySelector('.modal-body input')
//modalBodyInput.value = theme
});
}
</script>
<script>
// возвращает куки с указанным name,
// или undefined, если ничего не найдено
function getCookie(name) {
let matches = document.cookie.match(new RegExp(
"(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
));
return matches ? decodeURIComponent(matches[1]) : undefined;
}
var session = getCookie("fakesession");
if (session !== undefined) {
alert("session key = " + session);
}
</script>
<script>
/**
* Helper function for POSTing data as JSON with fetch.
*
* @param {Object} options
* @param {string} options.url - URL to POST data to
* @param {FormData} options.formData - `FormData` instance
* @return {Object} - Response body from URL that was POSTed to
*/
var postFormDataAsJson = async ({
url,
formData
}) => {
const plainFormData = Object.fromEntries(formData.entries());
const formDataJsonString = JSON.stringify(plainFormData);
const fetchOptions = {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
// "Content-Type": "application/x-www-form-urlencoded",
},
body: formDataJsonString,
};
//alert("about to post" + formDataJsonString);
console.log(url);
console.log(formDataJsonString);
const response = await fetch(url, fetchOptions);
if(!response.ok) {
const errorMessage = await response.text();
throw new Error(errorMessage);
}
return response.json();
};
/**
* Event handler for a form submit event.
* @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit_event
* @example const exampleForm = document.getElementById("example-form");
* exampleForm.addEventListener("submit", handleFormSubmit);
* @param {SubmitEvent} event
*/
var handleFormSubmit = async (event) => {
event.preventDefault();
const form = event.currentTarget;
const url = form.action;
try {
const formData = new FormData(form);
const responseData = await postFormDataAsJson({
url,
formData
});
console.log({
responseData
});
} catch(error) {
console.error(error);
}
};
document.querySelector("form[name='profile_send']").addEventListener("submit", handleFormSubmit)
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" class="d-none">
<symbol id="check2" viewBox="0 0 16 16">
<path
d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"
></path>
</symbol>
<symbol id="circle-half" viewBox="0 0 16 16">
<path
d="M8 15A7 7 0 1 0 8 1v14zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
></path>
</symbol>
<symbol id="moon-stars-fill" viewBox="0 0 16 16">
<path
d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z"
></path>
<path
d="M10.794 3.148a.217.217 0 0 1 .412 0l.387 1.162c.173.518.579.924 1.097 1.097l1.162.387a.217.217 0 0 1 0 .412l-1.162.387a1.734 1.734 0 0 0-1.097 1.097l-.387 1.162a.217.217 0 0 1-.412 0l-.387-1.162A1.734 1.734 0 0 0 9.31 6.593l-1.162-.387a.217.217 0 0 1 0-.412l1.162-.387a1.734 1.734 0 0 0 1.097-1.097l.387-1.162zM13.863.099a.145.145 0 0 1 .274 0l.258.774c.115.346.386.617.732.732l.774.258a.145.145 0 0 1 0 .274l-.774.258a1.156 1.156 0 0 0-.732.732l-.258.774a.145.145 0 0 1-.274 0l-.258-.774a1.156 1.156 0 0 0-.732-.732l-.774-.258a.145.145 0 0 1 0-.274l.774-.258c.346-.115.617-.386.732-.732L13.863.1z"
></path>
</symbol>
<symbol id="sun-fill" viewBox="0 0 16 16">
<path
d="M8 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"
></path>
</symbol>
</svg>
<div
class="dropdown position-fixed bottom-0 end-0 mb-3 me-3 bd-mode-toggle"
>
<button
class="btn btn-bd-primary py-2 dropdown-toggle d-flex align-items-center"
id="bd-theme"
type="button"
aria-expanded="false"
data-bs-toggle="dropdown"
aria-label="Toggle theme (auto)"
>
<svg class="bi my-1 theme-icon-active" aria-hidden="true">
<use href="#circle-half"></use>
</svg>
<span class="visually-hidden" id="bd-theme-text">Toggle theme </span>
</button>
<ul
class="dropdown-menu dropdown-menu-end shadow"
aria-labelledby="bd-theme-text"
>
<li>
<button
type="button"
class="dropdown-item d-flex align-items-center"
data-bs-theme-value="light"
aria-pressed="false"
>
<svg class="bi me-2 opacity-50" aria-hidden="true">
<use href="#sun-fill"></use>
</svg>
Light
<svg class="bi ms-auto d-none" aria-hidden="true">
<use href="#check2"></use>
</svg>
</button>
</li>
<li>
<button
type="button"
class="dropdown-item d-flex align-items-center"
data-bs-theme-value="dark"
aria-pressed="false"
>
<svg class="bi me-2 opacity-50" aria-hidden="true">
<use href="#moon-stars-fill"></use>
</svg>
Dark
<svg class="bi ms-auto d-none" aria-hidden="true">
<use href="#check2"></use>
</svg>
</button>
</li>
<li>
<button
type="button"
class="dropdown-item d-flex align-items-center active"
data-bs-theme-value="auto"
aria-pressed="true"
>
<svg class="bi me-2 opacity-50" aria-hidden="true">
<use href="#circle-half"></use>
</svg>
Auto
<svg class="bi ms-auto d-none" aria-hidden="true">
<use href="#check2"></use>
</svg>
</button>
</li>
</ul>
</div>
<svg xmlns="http://www.w3.org/2000/svg" class="d-none">
<symbol id="check" viewBox="0 0 16 16">
<title>Check</title>
<path
d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"
></path>
</symbol>
</svg>
<div class="container py-3">
<header>
<div
class="d-flex flex-column flex-md-row align-items-center pb-3 mb-4 border-bottom"
>
<a
href="/"
class="d-flex align-items-center link-body-emphasis text-decoration-none"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="40"
height="32"
class="me-2"
viewBox="0 0 118 94"
role="img"
>
<title>Bootstrap</title>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M24.509 0c-6.733 0-11.715 5.893-11.492 12.284.214 6.14-.064 14.092-2.066 20.577C8.943 39.365 5.547 43.485 0 44.014v5.972c5.547.529 8.943 4.649 10.951 11.153 2.002 6.485 2.28 14.437 2.066 20.577C12.794 88.106 17.776 94 24.51 94H93.5c6.733 0 11.714-5.893 11.491-12.284-.214-6.14.064-14.092 2.066-20.577 2.009-6.504 5.396-10.624 10.943-11.153v-5.972c-5.547-.529-8.934-4.649-10.943-11.153-2.002-6.484-2.28-14.437-2.066-20.577C105.214 5.894 100.233 0 93.5 0H24.508zM80 57.863C80 66.663 73.436 72 62.543 72H44a2 2 0 01-2-2V24a2 2 0 012-2h18.437c9.083 0 15.044 4.92 15.044 12.474 0 5.302-4.01 10.049-9.119 10.88v.277C75.317 46.394 80 51.21 80 57.863zM60.521 28.34H49.948v14.934h8.905c6.884 0 10.68-2.772 10.68-7.727 0-4.643-3.264-7.207-9.012-7.207zM49.948 49.2v16.458H60.91c7.167 0 10.964-2.876 10.964-8.281 0-5.406-3.903-8.178-11.425-8.178H49.948z"
fill="currentColor"
></path>
</svg>
<span class="fs-4">Выбор отношений </span>
</a>
<nav class="d-inline-flex mt-2 mt-md-0 ms-md-auto">
<a
class="me-3 py-2 link-body-emphasis text-decoration-none"
href=""
data-bs-toggle="modal"
data-bs-target="#AboutMeModal"
>Обо мне</a
>
<a
class="me-3 py-2 link-body-emphasis text-decoration-none"
href=""
data-bs-toggle="modal"
data-bs-target="#TermModal"
>О сайте</a
>
</nav>
</div>
<div class="pricing-header p-3 pb-md-4 mx-auto text-center">
<h1 class="display-4 fw-normal text-body-emphasis">
Выбери какие отношения ты хочешь со мной
</h1>
<p class="fs-5 text-body-secondary">
Ты выбираешь, мы обсуждаем и делаем или не делаем.
</p>
</div>
</header>
<main>
<div class="row row-cols-1 row-cols-md-4 mb-3 text-center">
<div class="col">
<div class="card mb-4 rounded-3 shadow-sm card-min-height">
<div class="card-header py-3">
<h4 class="my-0 fw-normal">Секс за деньги</h4>
</div>
<div class="card-body">
<h1 class="card-title pricing-card-title">Только секс</h1>
<h2>
<small class="text-body-secondary fw-light"
>Ничего больше</small
>
</h2>
<p>Деньги</p>
</div>
<div class="card-footer">
<!-- Button trigger modal -->
<button
type="button"
class="w-100 btn btn-lg btn-outline-primary"
data-bs-toggle="modal"
data-bs-target="#exampleModal"
data-bs-theme="Секс за деньги"
>
Просто начни
</button>
</div>
</div>
</div>
<div class="col">
<div class="card mb-4 rounded-3 shadow-sm card-min-height">
<div class="card-header py-3">
<h4 class="my-0 fw-normal">Секс без обязательств</h4>
</div>
<div class="card-body">
<h1 class="card-title pricing-card-title">Только секс</h1>
<h2>
<small class="text-body-secondary fw-light"
>Ничего больше</small
>
</h2>
<p>Чем же ты сможешь меня заинтеревовать?</p>
</div>
<div class="card-footer">
<!-- Button trigger modal -->
<button
type="button"
class="w-100 btn btn-lg btn-outline-primary"
data-bs-toggle="modal"
data-bs-target="#exampleModal"
data-bs-theme="Секс без обязательств"
>
Просто начни
</button>
</div>
</div>
</div>
<div class="col">
<div class="card mb-4 rounded-3 shadow-sm card-min-height">
<div class="card-header py-3">
<h4 class="my-0 fw-normal">Дружба</h4>
</div>
<div class="card-body">
<h1 class="card-title pricing-card-title">
Никто никому ничего не должен
</h1>
<h2>
<small class="text-body-secondary fw-light"
>Вообще ничего</small
>
</h2>
<p>Бесплатно</p>
</div>
<div class="card-footer">
<!-- Button trigger modal -->
<button
type="button"
class="w-100 btn btn-lg btn-outline-primary"
data-bs-toggle="modal"
data-bs-target="#exampleModal"
data-bs-theme="Дружба"
>
Просто начни
</button>
</div>
</div>
</div>
<div class="col">
<div
class="card mb-4 rounded-3 shadow-sm border-primary card-min-height"
>
<div class="card-header py-3 text-bg-primary border-primary">
<h4 class="my-0 fw-normal">Серьёзные отношения</h4>
</div>
<div class="card-body">
<h1 class="card-title pricing-card-title">
Всё как у взрослых
</h1>
<h2>
<small class="text-body-secondary fw-light"
>Ты же уже вырос, правда?</small
>
</h2>
<p>Обо всём можно договориться словами через рот</p>
</div>
<div class="card-footer">
<!-- Button trigger modal -->
<button
type="button"
class="w-100 btn btn-lg btn-primary"
data-bs-toggle="modal"
data-bs-target="#exampleModal"
data-bs-theme="Серьёзные отношения"
>
Просто начни
</button>
</div>
</div>
</div>
</div>
<h2 class="display-6 text-center mb-4">Сравнение возможностей</h2>
<div class="table-responsive">
<table class="table text-center">
<thead>
<tr>
<th style="width: 34%"></th>
<th style="width: 16, 5%">Секс за деньги</th>
<th style="width: 16, 5%">Секс без обязательств</th>
<th style="width: 16, 5%">Дружба</th>
<th style="width: 16, 5%">Серьёзные отношения</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row" class="text-start">Встречи</th>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Прогулки</th>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Дружеские объятия</th>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">
Психологическая необременительная поддержка
</th>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">
Нематериальная необременительная помощь
</th>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Цветы</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Подарки</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Оплата такси</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Оплата кафе, ресторанов</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Оплата кино</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Держаться за руки</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Объятия возлюбленных</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Поцелуи</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">
Планирование совместной жизни, развития, доходов, расходов
</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Секс</th>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Планирование детей</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">
Покупка туристических путёвок
</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Покупка машины</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">Покупка квартиры</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
<tr>
<th scope="row" class="text-start">
Покупка земельного участка и дома
</th>
<td></td>
<td></td>
<td></td>
<td>
<svg
class="bi"
width="24"
height="24"
role="img"
aria-label="Included"
>
<use xlink:href="#check"></use>
</svg>
</td>
</tr>
</tbody>
</table>
</div>
</main>
<footer class="pt-4 my-md-5 pt-md-5 border-top">
<div class="row">
<div class="col-12 col-md">
<img
class="mb-2"
src="assets/brand/bootstrap-logo.svg"
alt=""
width="24"
height="19"
/>
<small class="d-block mb-3 text-body-secondary"
>&copy; LeraFoxQueen 2025
</small>
</div>
<div class="col-6 col-md">
<h5>Features</h5>
<ul class="list-unstyled text-small">
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Cool stuff
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Random feature
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Team feature
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Stuff for developers
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Another one
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Last time
</a>
</li>
</ul>
</div>
<div class="col-6 col-md">
<h5>Resources</h5>
<ul class="list-unstyled text-small">
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Resource
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Resource name
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Another resource
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Final resource
</a>
</li>
</ul>
</div>
<div class="col-6 col-md">
<h5>About</h5>
<ul class="list-unstyled text-small">
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Team
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Locations
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Privacy
</a>
</li>
<li class="mb-1">
<a class="link-secondary text-decoration-none" href="#"
>Terms
</a>
</li>
</ul>
</div>
</div>
</footer>
</div>
<script
src="dist/js/bootstrap.bundle.min.js"
class="astro-vvvwv3sm"
></script>
</body>
</html>