---
import Root from "../layout/root.astro"
---

<Root>
  <p id="numb">a</p>
  <div class="Page">
  <div class="AboutBox">
    <h1>о сайте</h1>
    <p>этот сайт обо мне и моих успеха х в жизни, а так же я вляется небольшой зоной практики в веб разработке :3</p>
    <p>данный сайт разработан на фреймворке Astro</p>
  </div>
  <div class="HistoryBox">
    <h2>история разработки сайтов</h2>
    <p>давным давно я захотел себе сделать свой сайт, но я не понимал как они делаются. У меня было куча одностраничек, но самый первый более менее успешный вариант называется grechkaws-v1, и он был построен на vue, но... визуально он мне не нравился.</p>
    <p>после я решил сделать сайт на wordpress, чтобы было быстро и легко, это был просто grechkaws (WS в этом случае значит WordPress, не WebSite). Но я вообще не знал PHP и знать не хотел, поэтому кастомизировать я особо не мог, и поэтому я вскоре просто стёр его</p>
    <p>далее я решил вернуться к vue, потому что он был мне знаком, и стал я разрабатывать grechkaws-v2, и базировался он на Nuxt, удобном, но очень прожорливом фреймфорке! И был этот сайт красив, и нравилось мне всё, но сайт рос, и силы на его билд тоже, вскоре мой маленький VPS не выдерживал этот бтлд и просто происходил out of memory и краш системы, а вскоре просто вся ubuntu пошла к черту, поэтому этот сайт я тоже забросил...</p>
    <p>и вот на момент начала 2026 года я пишу уже v3, которая я думаю меня уже во всё устроит - он построен на SSG фреймворке astro, так что можно билдить на ПК и отдавать файлы на сервер, а так же у меня впланах написать свой собственный backend для разных функций</p>
    <p>надеюсь кого нибудь это замотивирует :)</p>
  </div>
  <a href="/">вернуться на главную страницу?</a>
  </div>
</Root>

<style>
	.Page {
		min-height: 100vh;
		display: flex;
		flex-direction: column;

		justify-content: center;
		align-items: stretch;
		gap: 24px;

		padding: 24px; /* воздух по краям экрана */
		box-sizing: border-box;
	}

  .AboutBox {
    padding: 14px 30px;
    border: 4px solid black;
  }

  .HistoryBox {
    padding: 14px 30px;
    border: 4px solid black;
  }
</style>

<script lang="js">
  let numb = document.getElementById("numb")

  numb.style.color = "red";
  numb.style.position = "absolute"
  function randomtext() {
    let numb = document.getElementById("numb")
    numb.textContent = Math.random(1) + " <- God number"
  }
  setInterval(randomtext(), 500);
     
</script>
