Текст именён в info index.html

2023-04-05 22:30:17 +06:00
5 changed files with 207 additions and 148 deletions
--- a/readme.md
+++ b/readme.md
@ -1,11 +1,5 @@
 **Проект разрабатывают:**
 - [Зажигин Богдан Алексеевич](@zaboal), управляющий и дизайнер;
- [M_12](@M_12), разработчик в отпуске.
- [step](@step), разработчик.
+- [M_12](@M_12), разработчик.

-# Версионирование
-
-В ветке [prototype](https://gitlab.megu.one/core/playroom/-/tree/prototype) дизайн версируется целым числом, без точек. Допусти имеем дизайн трёхсотой версии: когда [pages](https://gitlab.megu.one/core/playroom/-/tree/pages) станет ему соотвествовать он должен получить аналогичный тег трёхсотой версии `300`. Исправления функционала без изменения дизайна должны уже будут идти через точку, `300.x`, а исправления функционала после второй точки `300.x.x`.
-
-Другой пример:
-> Сделали второй дизайн (`2`), реализовали опллату с яндекс кассой `2.1`, добавили перенаправление после оплаты на гайд по подтверждению и исправили поведение кнопки `2.1.2`. 
+> **Остальная информация отображена в значках проекта на гитлабе.**
--- a/source/error.html
+++ b/source/error.html
@ -10,42 +10,24 @@
    <link rel="icon" href="https://org.zaboal.name/assets/logo-playroom_green_black-border.svg" />
 </head>

-<body class="desktop">
-    <!-- ERROR_VERSION -->
-    <div class="main error">
+<body>
+    <div id="site" class="error">
        <div class="header">
            <img src="https://org.zaboal.name/assets/logo-playroom_green.svg" alt="Логотип «Игровой»" />
        </div>
-        <div class="body">
        <div class="info">
            <h1>404</h1>
            <div class="row">
-                    <b>Никогда такого не было, и вот опять</b>
-                    <span>Запрашиваемый матери-ал отсуствует. Если бы он существовал, мы бы перенаправили по актуальному адресу.</span>
-                </div>
+                <b class="h1">Никогда такого не было, и вот опять</b>
+                <span class="p">Запрашиваемый матери-ал отсуствует. Если бы он существовал, мы бы перенаправили по актуальному адресу.</span>
            </div>
        </div>
        <div class="footer">
            <h1>Зажигин Богдан Алексеевич · ИНН 519056542114</h1>
        </div>
    </div>
-
-    <!-- MOBILE_VERSION -->
-    <div class="main mobile">
-        <div class="header">
-            <img src="https://org.zaboal.name/assets/logo-playroom_green.svg" alt="Логотип «Игровой»" />
-        </div>
-        <div class="body">
-            <div class="info">
-                <b>Перезайдите с компьютера. На наших серверах играть можно только с него.</b>
-                <b>(⌐■_■)</b>
-            </div>
-        </div>
-        <div class="footer">
-            <h1>Зажигин Богдан Алексеевич</h1>
-        </div>
-    </div>
    <script src="script.js"></script>
 </body>

+
 </html>
--- a/source/index.html
+++ b/source/index.html
@ -1,31 +1,29 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<html xmlns="http://www.w3.org/1999/xhtml">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
+
+
 <head>
    <meta charset="UTF-8" />
-  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <link rel="stylesheet" href="style.css" />
    <title>Игровая Студии Зажгина</title>
+    <link rel="stylesheet" href="style.css" />
    <link rel="icon" href="https://org.zaboal.name/assets/logo-playroom_green_black-border.svg" />
 </head>
+
 <body>
-  <header>
-    <nav>
-      <ul>
+    <div id="site" class="black">
+        <div class="header">
            <img src="https://org.zaboal.name/assets/logo-playroom_black.svg" alt="Логотип «Игровой»" />
-      </ul>
-    </nav>
-  </header>
-  <div class="Introduction">
-    <p>продаём единый проход на <br />элитарные сервера и привлекаем к <br />работе в нашей студии <a scr="" style="color: rgba(0, 0, 0, .5);">ヾ(⌐■_■)ノ♪</a></p>
        </div>
-
-  <div class="main">
-    <p>a</p>
+        <div class="info">
+            <b>продаём единый проход на элитарные сервера и привлекаем к работе в нашей студии <big>ヾ(⌐■_■)ノ♪</big></b>
        </div>
-
-  <footer>
-    <p>Зажигин Богдан Алексеевич · ИНН 519056542114</p>
-  </footer>
+        <div class="footer">
+            <h1>Зажигин Богдан Алексеевич · ИНН 519056542114</h1>
+        </div>
+    </div>
+    <script src="script.js"></script>
 </body>
+
+
 </html>
--- a/source/script.js
+++ b/source/script.js
@ -1,7 +1,6 @@
 ((...m)=>{
    var html = () => {
-        m[1].querySelector('title').innerText = "Перезайдите с компьютера";
-        m[1].querySelector('body').className = "mobile";
+        m[1].querySelector('html').innerHTML = `<head> <meta charset="UTF-8"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <title>Перезайдите с компьютера</title> <link rel="icon" href="https://org.zaboal.name/assets/logo-playroom_green_black-border.svg"/> <style>@import url(https://fonts.googleapis.com/css?family=Martian+Mono);:root{--main-b-color:#04030F;--main-g-color:#04F30F;--main-text-g:#04F30F;--main-text-b:#04030F;--main-width:1900px;--main-height:500vh;--error-width:1900px;--error-height:100vh}*{margin:0;padding:0;box-sizing:border-box;font-family:"Martian Mono",monospace;font-size:14pt}body{overflow-x:hidden}body,html,div.error#mobile{background:var(--main-g-color);display:flex;min-height:var(--error-height);width:100%;height:100%;flex-direction:column}div.error#mobile>.header{position:fixed;height:32px;width:100%;background:var(--main-b-color);z-index:999999999999}div.error#mobile>.header>img{height:100%;margin:auto;display:block;padding:8px 0 8px 0}div.error#mobile>.info{margin-top:32px;background:var(--main-g-color);width:100%}div.error#mobile>.info>b{padding:64px 64px 0 64px;display:block;max-width:100%;font-size:32px;line-height:1.25;letter-spacing:1px;overflow-wrap:break-word}div.error#mobile>.info>b>big{display:block;padding-top:44px;font-size:32px;color:rgba(0,0,0,.25)}div.error#mobile>.footer{display:block;min-height:32px;width:100%;background:var(--main-b-color);color:var(--main-text-g);margin-top:auto;text-align:center}div.error#mobile>.footer>h1{letter-spacing:4px;width:100%;height:100%;padding:5px 0 8px 0;text-decoration:none;text-transform:none}</style> </head><body> <div id="mobile" class="error"> <div class="header"> <img src="https://org.zaboal.name/assets/logo-playroom_green.svg" alt="Логотип «Игровой»"/> </div><div class="info"> <b>Перезайдите с компьютера. На наших серверах играть можно только с него.<big>(⌐■_■)</big></b> </div><div class="footer"> <h1>Зажигин Богдан Алексеевич</h1> </div></div></body>`;
    };
    if(m[0] === m[0].parent) {
        var nv = m[0].navigator.userAgent||m[0].navigator.vendor||m[0].opera;
--- a/source/style.css
+++ b/source/style.css
@ -1,98 +1,184 @@
-@import url('https://fonts.googleapis.com/css2?family=Martian+Mono:wght@100;200;300;400;500;600;700;800&display=swap');
-*{
-  padding: 0px;
-  margin: 0px;
-  font-family: "Martian Mono";
-}
-body{
-  background: rgba(4, 3, 15, 100);
+@import url("https://fonts.googleapis.com/css?family=Martian+Mono");
+
+:root {
+  --main-b-color: #04030F;
+  --main-g-color: #04F30F;
+  --main-text-g: #04F30F;
+  --main-text-b: #04030F;
+  --main-width: 1900px;
+  --main-height: 500vh;
+  --error-width: 1900px;
+  --error-height: 100vh;
 }

-
-header{
-  position: sticky;
-  top: 0px;
-  height: 24px;
-  background:rgb(4, 236, 4);
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+  font-family: "Martian Mono", monospace;
+  font-size: 14pt;
 }
-ul{
+/* Body */
+/* Black */
+body {
+  overflow-x: hidden;
+}
+body,div.black {
+  background: var(--main-b-color);
  display: flex;
-  justify-content: center;
+  min-height: var(--main-height);
+  width: 100%;
+  height: 100%;
+  flex-direction: column;
 }
-ul img{
-  width: 26px;
-  text-align: center;
-  margin-top:5px;
-}
-
-.Introduction{
-  font-size: 50px;
-  background:rgb(4, 236, 4);
-  padding-left: 50px;
-  padding-top: 50px;
-  font-weight: bold;
-  padding-bottom: 50px;
-}
-
-.main{
-  height: 3000px;
-}
-
-footer{
-  height: 25px;
-  background:rgb(4, 236, 4);
-  font-weight: bold;
-  text-align: center;
-  font-size: 18px;
-  letter-spacing:3px;
-}
-
-@media (max-width: 848px){
-  *{
-    padding: 0px;
-    margin: 0px;
-    font-family: "Martian Mono";
-  }
-  body{
-    background: rgba(4, 3, 15, 100);
-  }  
-  header{
-    position: sticky;
-    top: 0px;
-    height: 26px;
-    background:rgb(4, 236, 4);
-  }
-  .Introduction{
-    font-size: 25px;
-    background:rgb(4, 236, 4);
-    padding-left: 50px;
-    padding-top: 25px;
-    font-weight: bold;
-    padding-bottom: 25px;
-  }
-  ul{
+/* Error */
+/* Green */
+body,div.error {
+  background: var(--main-g-color);
  display: flex;
-    justify-content: center;
-  }
-  ul img{
-    width: 26px;
-    text-align: center;
-    margin-top:5px;
-  }
+  min-height: var(--error-height);
+  width: 100%;
+  height: 100%;
+  flex-direction: column;
+}

-  .main{
-    height: 3000px;
-  }
-  footer{
-    height: 25px;
-    background:rgb(4, 236, 4);
-    font-weight: bold;
+
+/* Header */
+/* Black */
+div.black > .header {
+  position: fixed;
+  height: 32px;
+  width: 100%;
+  background: var(--main-g-color);
+  z-index: 999999999999;
+}
+div.black > .header > img {
+  height: 100%;
+  margin: auto;
+  display: block;
+  padding: 8px 0px 8px 0px;
+}
+/* Error */
+/* Green */
+div.error > .header {
+  position: fixed;
+  height: 32px;
+  width: 100%;
+  background: var(--main-b-color);
+  z-index: 999999999999;
+}
+div.error > .header > img {
+  height: 100%;
+  margin: auto;
+  display: block;
+  padding: 8px 0px 8px 0px;
+}
+
+
+/* Info */
+/* Black */
+div.black > .info {
+  margin-top: 32px;
+  background: var(--main-g-color);
+  width: 100%;
+  min-height: 384px;
+}
+div.black > .info > b {
+  padding: 64px 0 80px 64px;
+  display: block;
+  max-width: 1594px;
+  font-size: 64px;
+  line-height: 1.25;
+  letter-spacing: 1px;
+  text-decoration: none;
+  text-transform: lowercase;
+  overflow-wrap: break-word;
+}
+div.black > .info > b > big {
+  font-size: 64px;
+  color: rgba(0, 0, 0, 0.25);
+}
+/* Error */
+/* Green */
+div.error#site > .info {
+  margin-top: 64px;
+  background: var(--main-g-color);
+  display: flex;
+  flex-direction: row;
+  flex-flow: row wrap;
+  width: 100%;
+  min-height: 384px;
+  color: var(--main-text-b);
+}
+div.error#site > .info > h1 {
+  font-size: 512px;
+  line-height: 1.2;
+  margin-left: 117.25px;
+}
+div.error#site > .info > .row {
+  width: 512px;
+  height: 512px;
+  padding-top: 158px;
+  margin-left: 65px;
+  font-size: 32px;
+  display: flex;
+  flex-direction: column;
+}
+div.error#site > .info > .row > .h1 {
+  font-size: 40px;
+  text-transform: lowercase;
+  padding-bottom: 32px;
+}
+div.error#site > .info > .row > .p {
+  font-size: 34px;
+}
+
+
+/* Footer */
+/* Black */
+div.black > .footer {
+  display: block;
+  height: 32px;
+  width: 100%;
+  background: var(--main-g-color);
+  margin-top: auto;
  text-align: center;
-    margin-top: 20px;
-    font-size: 10px;
-    letter-spacing:3px;
-  }
-  footer p{
-    padding-top: 5px;
+}
+div.black > .footer > h1 {
+  letter-spacing: 4px;
+  width: 100%;
+  height: 100%;
+  padding: 5px 0px 8px 0px;
+  text-decoration: none;
+  text-transform: none;
+}
+/* Error */
+/* Green */
+div.error > .footer {
+  display: block;
+  height: 32px;
+  width: 100%;
+  background: var(--main-b-color);
+  color: var(--main-text-g);
+  margin-top: auto;
+  text-align: center;
+}
+div.error > .footer > h1 {
+  letter-spacing: 4px;
+  width: 100%;
+  height: 100%;
+  padding: 5px 0px 8px 0px;
+  text-decoration: none;
+  text-transform: none;
+}
+
+@media screen and (min-width: 1750px) and (max-width: 1890px) {
+  /* Info */
+  /* Error */
+  /* Green */
+  div.error#site > .info > h1 {
+    font-size: 512px;
+    line-height: 1.2;
+    margin-left: 32.25px !important;
  }
 }