Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| f2f98d9229 | |||
| a33b517a3e | |||
| d4624e7761 | |||
| a608dea61f |
45
PLANS.md
Normal file
45
PLANS.md
Normal file
@@ -0,0 +1,45 @@
|
||||
# Планы по развитию проекта (DicQuo)
|
||||
|
||||
## 1. Список Авторов (Feature: Authors List)
|
||||
**Цель:** Улучшить SEO (плоская структура) и навигацию, сохранив "Дзен" (минимализм).
|
||||
|
||||
**Концепция:**
|
||||
- Добавить иконку "Люди/Авторы" в шапку сайта (рядом с бургером).
|
||||
- По клику открывается **полноэкранный оверлей** (как статистика).
|
||||
- Внутри список авторов карточками/строками.
|
||||
|
||||
**Элементы списка:**
|
||||
1. **Имя Автора** (крупно) -> Ссылка на ротацию цитат автора (`/?tag=author-slug`).
|
||||
2. **Счетчик цитат** (мелко, например `(25)`) -> Клик раскрывает "гармошку" (аккордеон).
|
||||
3. **Список цитат** (внутри гармошки) -> Прямые ссылки на цитаты (например: `/123_nachalo-frazy...`). Текст ссылок — начало фразы.
|
||||
|
||||
**Техническая реализация:**
|
||||
- **Backend:** `Context Processor` или логика в `IndexView` (или отдельный AJAX endpoint) для сбора данных:
|
||||
```json
|
||||
[
|
||||
{
|
||||
"name": "Имя",
|
||||
"slug": "slug",
|
||||
"count": 25,
|
||||
"quotes": [{"id": 1, "url": "...", "text": "Текст..."}, ...]
|
||||
}, ...
|
||||
]
|
||||
```
|
||||
- **Frontend:** HTML/CSS для модального окна и JS для раскрытия списков.
|
||||
|
||||
## 2. Админка
|
||||
- Починить мелкие баги в управлении тегами.
|
||||
- Улучшить управление настройками типографа (etpgrf) через виртуальные поля.
|
||||
- Поля в админке для настройки (кавычки, неразрывные пробелы и т.д.).
|
||||
- При сохранении применять типограф к полям `szContent` -> `szContentHTML`.
|
||||
- `szContentHTML` сделать редактитруемым чекрез CodeMirror (для ручной типографики тяжёлых случаев).
|
||||
|
||||
## 3. SEO и Оптимизация
|
||||
- Проверить индексацию новых страниц `static_404`/`static_500`.
|
||||
- Убедиться, что `canonical` ссылки работают корректно.
|
||||
|
||||
## 4. Дальние планы
|
||||
- Форма для добавления цитат пользователями (с модерацией).
|
||||
- API для интеграции с внешними сервисами (магазинами грампластинок и музыкальными сервисами).
|
||||
- Сбор цитат из открытых источников (например, с помощью парсинга сайтов с цитатами или API).
|
||||
|
||||
@@ -42,4 +42,7 @@ if settings.DEBUG:
|
||||
path('500/', TemplateView.as_view(template_name="500.html")),
|
||||
path('403/', TemplateView.as_view(template_name="403.html")),
|
||||
path('400/', TemplateView.as_view(template_name="400.html")),
|
||||
# Для проверки статических страниц ошибок (Nginx)
|
||||
path('static_404/', TemplateView.as_view(template_name="static_404.html")),
|
||||
path('static_500/', TemplateView.as_view(template_name="static_500.html")),
|
||||
]
|
||||
|
||||
@@ -1,31 +1,44 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block Title %}400: Плохой запрос{% endblock %}
|
||||
|
||||
{% block CONTENT %}{% include "blocks/header_nav.html" %}
|
||||
<div class="container main-content">
|
||||
<!-- Осно<D0BD><D0BE>ной контент: Текст + Картинка -->
|
||||
<div class="content-row">
|
||||
|
||||
<!-- Текстовая колонка -->
|
||||
<div class="text-col">
|
||||
<!-- Цитата -->
|
||||
<blockquote id="bb" style="border:none; margin:0; padding:0;">
|
||||
<span style="margin-left:-0.44em;">«</span>Вы спрашиваете меня о чем-то странном. Я не понимаю ваш запрос.»
|
||||
</blockquote>
|
||||
|
||||
<!-- Автор -->
|
||||
<div id="author">
|
||||
<cite>Озадаченный Сервер (400)</cite>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Блок тегов и навигации -->
|
||||
<div class="tags">
|
||||
<a href="/">Сформулировать иначе (на главную)</a>
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>400: Плохой запрос | DicQuo</title>
|
||||
<style>
|
||||
body { margin: 0; min-height: 100vh; background-color: #211; color: silver; font-family: serif; opacity: 1; transition: opacity 0.9s ease-in-out; }
|
||||
header { display: flex; justify-content: space-between; align-items: center; padding: 1vh 4vw; }
|
||||
header > #logo { margin-top: 1vh; float: left; }
|
||||
header > #logo a { border: none; text-decoration: none; color: silver;}
|
||||
main { padding: 1vh 8vw; display: flex; flex-direction: column; justify-content: center; min-height: 60vh; }
|
||||
main > article { display: flex; align-items: center; justify-content: center; gap: 2vw; }
|
||||
main > article > figure > p { color: silver; font-size: 3vmin; line-height: 3.5vmin; padding-bottom: 2vmin; font-style: italic; }
|
||||
main > article > figure > blockquote { color: whitesmoke; font-size: 4.5vmin; line-height: 5vmin; border:none; margin:0; padding:0; }
|
||||
main > article > figure > cite { color: silver; font-size: 3.5vmin; line-height: 4vmin; text-align: right; padding-top: 8vmin; font-style: italic; display: block; }
|
||||
.tags { text-align: center; color: silver; font-size: 1.5vmin; line-height: 1.9vmin; padding: 1vh 8vw; float: left;}
|
||||
.tags a { text-decoration: none; position: relative; padding: 0 0.5ex; display: inline-block; color: white; border-bottom: dotted 1px silver; background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 40%, slategray, silver, lightyellow 50%, rgba(255, 255, 255, 0.4)); background-clip: initial; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 250% 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; background-position: 100%; transition: background-position 0.65s ease; margin-right: 2vmin; }
|
||||
.tags a:hover { color: white; background-position: 0 100%; border-bottom: solid 1px white; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="logo">
|
||||
<a href="/" style="font-size: 3em; font-weight: bold; color: orange; font-style: italic">DQ</a>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<article>
|
||||
<figure>
|
||||
<p>Загадочно:</p>
|
||||
<blockquote id="bb">
|
||||
<span style="margin-left:-0.44em;">«</span>Вы спрашиваете меня о чем-то странном. Я не понимаю
|
||||
ваш запрос.»
|
||||
</blockquote>
|
||||
<cite>Озадаченный Сервер (400)</cite>
|
||||
</figure>
|
||||
</article>
|
||||
</main>
|
||||
<div class="tags">
|
||||
<a href="/">Сформулировать иначе (на главную)</a>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,31 +1,43 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block Title %}403: Доступ запрещен{% endblock %}
|
||||
|
||||
{% block CONTENT %}{% include "blocks/header_nav.html" %}
|
||||
<div class="container main-content">
|
||||
<!-- Основной контент: Текст + Картинка -->
|
||||
<div class="content-row">
|
||||
|
||||
<!-- Текстовая колонка -->
|
||||
<div class="text-col">
|
||||
<!-- Цитата -->
|
||||
<blockquote id="bb" style="border:none; margin:0; padding:0;">
|
||||
<span style="margin-left:-0.44em;">«</span>Вам сюда нельзя. Даже если очень хочется. Уходите!»
|
||||
</blockquote>
|
||||
|
||||
<!-- Автор -->
|
||||
<div id="author">
|
||||
<cite>Строгий Вахтёр (403)</cite>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Блок тегов и навигации -->
|
||||
<div class="tags">
|
||||
<a href="/">Уйти по-добру по-здорову</a>
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>403: Доступ запрещен | DicQuo</title>
|
||||
<style>
|
||||
body { margin: 0; min-height: 100vh; background-color: #211; color: silver; font-family: serif; opacity: 1; transition: opacity 0.9s ease-in-out; }
|
||||
header { display: flex; justify-content: space-between; align-items: center; padding: 1vh 4vw; }
|
||||
header > #logo { margin-top: 1vh; float: left; }
|
||||
header > #logo a { border: none; text-decoration: none; color: silver;}
|
||||
main { padding: 1vh 8vw; display: flex; flex-direction: column; justify-content: center; min-height: 60vh; }
|
||||
main > article { display: flex; align-items: center; justify-content: center; gap: 2vw; }
|
||||
main > article > figure > p { color: silver; font-size: 3vmin; line-height: 3.5vmin; padding-bottom: 2vmin; font-style: italic; }
|
||||
main > article > figure > blockquote { color: whitesmoke; font-size: 4.5vmin; line-height: 5vmin; border:none; margin:0; padding:0; }
|
||||
main > article > figure > cite { color: silver; font-size: 3.5vmin; line-height: 4vmin; text-align: right; padding-top: 8vmin; font-style: italic; display: block; }
|
||||
.tags { text-align: center; color: silver; font-size: 1.5vmin; line-height: 1.9vmin; padding: 1vh 8vw; float: left;}
|
||||
.tags a { text-decoration: none; position: relative; padding: 0 0.5ex; display: inline-block; color: white; border-bottom: dotted 1px silver; background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 40%, slategray, silver, lightyellow 50%, rgba(255, 255, 255, 0.4)); background-clip: initial; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 250% 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; background-position: 100%; transition: background-position 0.65s ease; margin-right: 2vmin; }
|
||||
.tags a:hover { color: white; background-position: 0 100%; border-bottom: solid 1px white; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="logo">
|
||||
<a href="/" style="font-size: 3em; font-weight: bold; color: orange; font-style: italic">DQ</a>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<article>
|
||||
<figure>
|
||||
<p>Категорически:</p>
|
||||
<blockquote id="bb">
|
||||
<span style="margin-left:-0.44em;">«</span>Вам сюда нельзя. Даже если очень хочется. Уходите!»
|
||||
</blockquote>
|
||||
<cite>Строгий Вахтёр (403)</cite>
|
||||
</figure>
|
||||
</article>
|
||||
</main>
|
||||
<div class="tags">
|
||||
<a href="/">Уйти по-добру по-здорову</a>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,31 +1,43 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block Title %}404: Страница не найдена{% endblock %}
|
||||
|
||||
{% block CONTENT %}{% include "blocks/header_nav.html" %}
|
||||
<div class="container main-content">
|
||||
<!-- Основной контент: Текст + Картинка -->
|
||||
<div class="content-row">
|
||||
|
||||
<!-- Текстовая колонка -->
|
||||
<div class="text-col">
|
||||
<!-- Цитата -->
|
||||
<blockquote id="bb" style="border:none; margin:0; padding:0;">
|
||||
<span style="margin-left:-0.44em;">«</span>Я искал везде. Даже под диваном. Этой страницы здесь нет.»
|
||||
</blockquote>
|
||||
|
||||
<!-- Автор -->
|
||||
<div id="author">
|
||||
<cite>Системный Администратор (404)</cite>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Блок тегов и навигации -->
|
||||
<div class="tags">
|
||||
<a href="/">Вернуться на главную</a>
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>404: Страница не найдена | DicQuo</title>
|
||||
<style>
|
||||
body { margin: 0; min-height: 100vh; background-color: #211; color: silver; font-family: serif; opacity: 1; transition: opacity 0.9s ease-in-out; }
|
||||
header { display: flex; justify-content: space-between; align-items: center; padding: 1vh 4vw; }
|
||||
header > #logo { margin-top: 1vh; float: left; }
|
||||
header > #logo a { border: none; text-decoration: none; color: silver;}
|
||||
main { padding: 1vh 8vw; display: flex; flex-direction: column; justify-content: center; min-height: 60vh; }
|
||||
main > article { display: flex; align-items: center; justify-content: center; gap: 2vw; }
|
||||
main > article > figure > p { color: silver; font-size: 3vmin; line-height: 3.5vmin; padding-bottom: 2vmin; font-style: italic; }
|
||||
main > article > figure > blockquote { color: whitesmoke; font-size: 4.5vmin; line-height: 5vmin; border:none; margin:0; padding:0; }
|
||||
main > article > figure > cite { color: silver; font-size: 3.5vmin; line-height: 4vmin; text-align: right; padding-top: 8vmin; font-style: italic; display: block; }
|
||||
.tags { text-align: center; color: silver; font-size: 1.5vmin; line-height: 1.9vmin; padding: 1vh 8vw; float: left;}
|
||||
.tags a { text-decoration: none; position: relative; padding: 0 0.5ex; display: inline-block; color: white; border-bottom: dotted 1px silver; background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 40%, slategray, silver, lightyellow 50%, rgba(255, 255, 255, 0.4)); background-clip: initial; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 250% 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; background-position: 100%; transition: background-position 0.65s ease; margin-right: 2vmin; }
|
||||
.tags a:hover { color: white; background-position: 0 100%; border-bottom: solid 1px white; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="logo">
|
||||
<a href="/" style="font-size: 3em; font-weight: bold; color: orange; font-style: italic">DQ</a>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<article>
|
||||
<figure>
|
||||
<p>Вздыхая:</p>
|
||||
<blockquote id="bb">
|
||||
<span style="margin-left:-0.44em;">«</span>Я искал везде. Даже под диваном. Этой страницы здесь нет.»
|
||||
</blockquote>
|
||||
<cite>Системный Администратор (404)</cite>
|
||||
</figure>
|
||||
</article>
|
||||
</main>
|
||||
<div class="tags">
|
||||
<a href="/">Вернуться на главную</a>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,31 +1,44 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block Title %}500: Ошибка сервера{% endblock %}
|
||||
|
||||
{% block CONTENT %}{% include "blocks/header_nav.html" %}
|
||||
<div class="container main-content">
|
||||
<!-- Основной контент: Текст + Картинка -->
|
||||
<div class="content-row">
|
||||
|
||||
<!-- Текстовая колонка -->
|
||||
<div class="text-col">
|
||||
<!-- Цитата -->
|
||||
<blockquote id="bb" style="border:none; margin:0; padding:0;">
|
||||
<span style="margin-left:-0.44em;">«</span>Что-то пошло не так. Кажется, я уронил сервер. Подождите, пока я его подниму.»
|
||||
</blockquote>
|
||||
|
||||
<!-- Автор -->
|
||||
<div id="author">
|
||||
<cite>Системный Администратор (500)</cite>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Блок тегов и навигации -->
|
||||
<div class="tags">
|
||||
<a href="/">Попробовать обновить страницу</a>
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>500: Ошибка сервера DicQuo</title>
|
||||
<style>
|
||||
body { margin: 0; min-height: 100vh; background-color: #211; color: silver; font-family: serif; opacity: 1; transition: opacity 0.9s ease-in-out; }
|
||||
header { display: flex; justify-content: space-between; align-items: center; padding: 1vh 4vw; }
|
||||
header > #logo { margin-top: 1vh; float: left; }
|
||||
header > #logo a { border: none; text-decoration: none; color: silver;}
|
||||
main { padding: 1vh 8vw; display: flex; flex-direction: column; justify-content: center; min-height: 60vh; }
|
||||
main > article { display: flex; align-items: center; justify-content: center; gap: 2vw; }
|
||||
main > article > figure > p { color: silver; font-size: 3vmin; line-height: 3.5vmin; padding-bottom: 2vmin; font-style: italic; }
|
||||
main > article > figure > blockquote { color: whitesmoke; font-size: 4.5vmin; line-height: 5vmin; border:none; margin:0; padding:0; }
|
||||
main > article > figure > cite { color: silver; font-size: 3.5vmin; line-height: 4vmin; text-align: right; padding-top: 8vmin; font-style: italic; display: block; }
|
||||
.tags { text-align: center; color: silver; font-size: 1.5vmin; line-height: 1.9vmin; padding: 1vh 8vw; float: left;}
|
||||
.tags a { text-decoration: none; position: relative; padding: 0 0.5ex; display: inline-block; color: white; border-bottom: dotted 1px silver; background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 40%, slategray, silver, lightyellow 50%, rgba(255, 255, 255, 0.4)); background-clip: initial; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 250% 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; background-position: 100%; transition: background-position 0.65s ease; margin-right: 2vmin; }
|
||||
.tags a:hover { color: white; background-position: 0 100%; border-bottom: solid 1px white; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="logo">
|
||||
<a href="/" style="font-size: 3em; font-weight: bold; color: orange; font-style: italic">DQ</a>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<article>
|
||||
<figure>
|
||||
<p>Неожиданно:</p>
|
||||
<blockquote id="bb">
|
||||
<span style="margin-left:-0.44em;">«</span>Что-то пошло не так. Кажется, я уронил сервер.
|
||||
Подождите, пока я его подниму.»
|
||||
</blockquote>
|
||||
<cite>Системный Администратор (500)</cite>
|
||||
</figure>
|
||||
</article>
|
||||
</main>
|
||||
<div class="tags">
|
||||
<a href="/">Попробовать обновить страницу</a>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
{% load static %}<script src="{% static 'js/counters.js' %}"></script>
|
||||
<noscript><div><img src="https://top-fwz1.mail.ru/counter?id=3744288;js=na" class="counter-pixel" alt="Top.Mail.Ru"/></div></noscript>
|
||||
<noscript><div><img src="https://top-fwz1.mail.ru/counter?id=3744288;js=na" class="counter-pixel" alt=""/></div><div><img src="https://mc.yandex.ru/watch/106953063" class="counter-pixel" alt="" /></div></noscript>
|
||||
@@ -1,27 +1,43 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
</html>
|
||||
</body>
|
||||
</div>
|
||||
<a href="/">Вернуться на главную</a>
|
||||
<cite>Системный Администратор (404)</cite>
|
||||
</blockquote>
|
||||
<span>«</span>Я искал везде. Даже под диваном. Этой страницы здесь нет.»
|
||||
<blockquote>
|
||||
<div class="container">
|
||||
<body>
|
||||
</head>
|
||||
</style>
|
||||
a:hover { color: #999; border-bottom: 1px solid #999; }
|
||||
a { color: #555; text-decoration: none; border-bottom: 1px dotted #555; transition: color 0.3s; font-size: 0.8em; margin-top: 30px; display: inline-block;}
|
||||
cite { display: block; font-size: 0.9em; color: #777; margin-top: 15px; font-style: normal;}
|
||||
blockquote span { margin-left: -0.44em; }
|
||||
blockquote { font-size: 2em; margin: 0 0 20px 0; font-style: italic; line-height: 1.4; }
|
||||
.container { max-width: 600px; padding: 20px; }
|
||||
body { background-color: #111; color: #ccc; font-family: Georgia, serif; display: flex; align-items: center; justify-content: center; height: 100vh; margin: 0; text-align: center; }
|
||||
<style>
|
||||
<title>404: Страница не найдена</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<head>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>404: Страница не найдена | DicQuo</title>
|
||||
<style>
|
||||
body { margin: 0; min-height: 100vh; background-color: #211; color: silver; font-family: serif; opacity: 1; transition: opacity 0.9s ease-in-out; }
|
||||
header { display: flex; justify-content: space-between; align-items: center; padding: 1vh 4vw; }
|
||||
header > #logo { margin-top: 1vh; float: left; }
|
||||
header > #logo a { border: none; text-decoration: none; color: silver;}
|
||||
main { padding: 1vh 8vw; display: flex; flex-direction: column; justify-content: center; min-height: 60vh; }
|
||||
main > article { display: flex; align-items: center; justify-content: center; gap: 2vw; }
|
||||
main > article > figure > p { color: silver; font-size: 3vmin; line-height: 3.5vmin; padding-bottom: 2vmin; font-style: italic; }
|
||||
main > article > figure > blockquote { color: whitesmoke; font-size: 4.5vmin; line-height: 5vmin; border:none; margin:0; padding:0; }
|
||||
main > article > figure > cite { color: silver; font-size: 3.5vmin; line-height: 4vmin; text-align: right; padding-top: 8vmin; font-style: italic; display: block; }
|
||||
.tags { text-align: center; color: silver; font-size: 1.5vmin; line-height: 1.9vmin; padding: 1vh 8vw; float: left;}
|
||||
.tags a { text-decoration: none; position: relative; padding: 0 0.5ex; display: inline-block; color: white; border-bottom: dotted 1px silver; background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 40%, slategray, silver, lightyellow 50%, rgba(255, 255, 255, 0.4)); background-clip: initial; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 250% 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; background-position: 100%; transition: background-position 0.65s ease; margin-right: 2vmin; }
|
||||
.tags a:hover { color: white; background-position: 0 100%; border-bottom: solid 1px white; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="logo">
|
||||
<a href="/" style="font-size: 3em; font-weight: bold; color: orange; font-style: italic">DQ</a>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<article>
|
||||
<figure>
|
||||
<p>Озадачено:</p>
|
||||
<blockquote id="bb">
|
||||
<span style="margin-left:-0.44em;">«</span>Я искал везде. Даже под диваном. Этой страницы здесь нет.»
|
||||
</blockquote>
|
||||
<cite>Системный Администратор (404)</cite>
|
||||
</figure>
|
||||
</article>
|
||||
</main>
|
||||
<div class="tags">
|
||||
<a href="/">Вернуться на главную</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,27 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>500: Ошибка сервера</title>
|
||||
<style>
|
||||
body { background-color: #111; color: #ccc; font-family: Georgia, serif; display: flex; align-items: center; justify-content: center; height: 100vh; margin: 0; text-align: center; }
|
||||
.container { max-width: 600px; padding: 20px; }
|
||||
blockquote { font-size: 2em; margin: 0 0 20px 0; font-style: italic; line-height: 1.4; }
|
||||
blockquote span { margin-left: -0.44em; }
|
||||
cite { display: block; font-size: 0.9em; color: #777; margin-top: 15px; font-style: normal; }
|
||||
a { color: #555; text-decoration: none; border-bottom: 1px dotted #555; transition: color 0.3s; font-size: 0.8em; margin-top: 30px; display: inline-block;}
|
||||
a:hover { color: #999; border-bottom: 1px solid #999; }
|
||||
</style>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>500: Ошибка сервера | DicQuo</title>
|
||||
<style>
|
||||
body { margin: 0; min-height: 100vh; background-color: #211; color: silver; font-family: serif; opacity: 1; transition: opacity 0.9s ease-in-out; }
|
||||
header { display: flex; justify-content: space-between; align-items: center; padding: 1vh 4vw; }
|
||||
header > #logo { margin-top: 1vh; float: left; }
|
||||
header > #logo a { border: none; text-decoration: none; color: silver;}
|
||||
main { padding: 1vh 8vw; display: flex; flex-direction: column; justify-content: center; min-height: 60vh; }
|
||||
main > article { display: flex; align-items: center; justify-content: center; gap: 2vw; }
|
||||
main > article > figure > p { color: silver; font-size: 3vmin; line-height: 3.5vmin; padding-bottom: 2vmin; font-style: italic; }
|
||||
main > article > figure > blockquote { color: whitesmoke; font-size: 4.5vmin; line-height: 5vmin; border:none; margin:0; padding:0; }
|
||||
main > article > figure > cite { color: silver; font-size: 3.5vmin; line-height: 4vmin; text-align: right; padding-top: 8vmin; font-style: italic; display: block; }
|
||||
.tags { text-align: center; color: silver; font-size: 1.5vmin; line-height: 1.9vmin; padding: 1vh 8vw; float: left;}
|
||||
.tags a { text-decoration: none; position: relative; padding: 0 0.5ex; display: inline-block; color: white; border-bottom: dotted 1px silver; background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 40%, slategray, silver, lightyellow 50%, rgba(255, 255, 255, 0.4)); background-clip: initial; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 250% 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; background-position: 100%; transition: background-position 0.65s ease; margin-right: 2vmin; }
|
||||
.tags a:hover { color: white; background-position: 0 100%; border-bottom: solid 1px white; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<blockquote>
|
||||
<span>«</span>Что-то пошло не так. Кажется, я уронил сервер, контейнер или случилось что-то ещё. Подождите, пока я его подниму.»
|
||||
</blockquote>
|
||||
<cite>Системный Администратор (5xx)</cite>
|
||||
<a href="#" onclick="window.location.reload(); return false;">Попробовать обновить через 5 минут.</a>
|
||||
</div>
|
||||
<header>
|
||||
<div id="logo">
|
||||
<a href="/" style="font-size: 3em; font-weight: bold; color: orange; font-style: italic">DQ</a>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<article>
|
||||
<figure>
|
||||
<p>Неожиданно:</p>
|
||||
<blockquote id="bb">
|
||||
<span style="margin-left:-0.44em;">«</span>Что-то пошло не так. Кажется, я уронил сервер.
|
||||
Подождите, пока я его подниму.»
|
||||
</blockquote>
|
||||
<cite>Системный Администратор (500)</cite>
|
||||
</figure>
|
||||
</article>
|
||||
</main>
|
||||
<div class="tags">
|
||||
<a href="#" onclick="window.location.reload(); return false;">Попробовать обновить страницу</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
@charset "utf-8";
|
||||
body {
|
||||
margin: 0;
|
||||
min-height: 100vh;
|
||||
min-width: 100vw;
|
||||
min-height: 100vmin;
|
||||
min-width: 100vmin;
|
||||
background-color: #111; /* Изначально темный фон */
|
||||
opacity: 0; /* Скрываем контент до расчета цвета */
|
||||
transition: opacity 0.9s ease-in-out; /* Очень плавное появление */
|
||||
@@ -13,11 +13,11 @@ header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 1vh 4vw;
|
||||
padding: 1vmin 4vmin;
|
||||
}
|
||||
|
||||
header > #logo {
|
||||
margin-top: 1vh;
|
||||
margin-top: 1vmin;
|
||||
float: left;
|
||||
}
|
||||
|
||||
@@ -69,8 +69,8 @@ header > nav > #stats-menu > b {
|
||||
|
||||
header > nav > #stats-menu > p {
|
||||
font-style: italic; display: inline-block;
|
||||
margin: 0 1vw;
|
||||
padding-right: 1vw;
|
||||
margin: 0 1vmin;
|
||||
padding-right: 1vmin;
|
||||
border-right: 1px dotted silver;
|
||||
}
|
||||
|
||||
@@ -120,23 +120,18 @@ header > nav > #stats-menu > a:hover {
|
||||
|
||||
/* MAIN ARTICLE CONTENT */
|
||||
main {
|
||||
/*justify-content: space-between;*/
|
||||
/*align-items: center;*/
|
||||
padding: 1vh 8vw;
|
||||
padding: 1vmin 8vmin;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
min-height: 60vh;
|
||||
/*width: 90%;*/
|
||||
/*max-width: 1200px;*/
|
||||
/*margin: 0 auto;*/
|
||||
min-height: 60vmin;
|
||||
}
|
||||
|
||||
main > article {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 2vw;
|
||||
gap: 2vmin;
|
||||
}
|
||||
|
||||
main > article > figure {
|
||||
@@ -170,18 +165,18 @@ main > article > figure > cite { /* Автор цитаты */
|
||||
}
|
||||
|
||||
main > article > div {
|
||||
flex: 0 0 30vw;
|
||||
flex: 0 0 30vmax;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 30vw;
|
||||
width: 30vmax;
|
||||
text-align: right;
|
||||
margin-bottom: 10vh;
|
||||
margin-bottom: 10vmin;
|
||||
}
|
||||
|
||||
main > article > div > div {
|
||||
width: 26vmax;
|
||||
height: 26vmax;
|
||||
padding: 0.5vw;
|
||||
padding: 0.5vmin;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@@ -200,13 +195,13 @@ main > article > div > div > div > img {
|
||||
|
||||
/* НАВИГАЦИЯ (ТЕГИ И ДАЛЕЕ) В КОНЦЕ */
|
||||
nav {
|
||||
padding: 1vh 4vw;
|
||||
padding: 1vmin 4vmin;
|
||||
}
|
||||
nav > div {
|
||||
color: silver;
|
||||
font-size: 1.5vmin;
|
||||
line-height: 1.9vmin;
|
||||
padding-top: 7vh;
|
||||
padding: 7vmin 0 4vmin 0;
|
||||
}
|
||||
nav > div a {
|
||||
text-decoration: none;
|
||||
@@ -250,7 +245,7 @@ footer {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 2vh 4vw;
|
||||
padding: 2vmin 4vmin;
|
||||
color: silver; /* Мягкий серый цвет текста */
|
||||
background-color: rgba(30, 30, 30, 0.8); /* Темный полупрозрачный фон */
|
||||
backdrop-filter: blur(5px); /* Эффект матового стекла (современно и медитативно) */
|
||||
@@ -262,12 +257,12 @@ footer {
|
||||
|
||||
footer small {
|
||||
display: inline-block;
|
||||
margin-right: 2vw;
|
||||
margin-right: 2vmin;
|
||||
letter-spacing: 0.05em; /* Немного воздуха в тексте */
|
||||
}
|
||||
|
||||
footer button {
|
||||
padding: 0.5vh 1.5vw;
|
||||
padding: 0.5vmin 1.5vmin;
|
||||
background: transparent;
|
||||
color: silver;
|
||||
border: 1px solid silver;
|
||||
@@ -292,7 +287,20 @@ footer button:hover {
|
||||
|
||||
main > article > div {
|
||||
flex: 0 0 auto;
|
||||
margin-bottom: 2vh;
|
||||
margin: 8vmin 0 2vmin 0;
|
||||
}
|
||||
|
||||
main > article > div {
|
||||
width: 80vmin;
|
||||
}
|
||||
|
||||
main > article > div > div {
|
||||
width: 36vmax;
|
||||
height: 36vmax;
|
||||
}
|
||||
|
||||
main > article > div > div > div > img {
|
||||
height: 36vmax;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -18,5 +18,11 @@ _tmr.push({id: "3744288", type: "pageView", start: (new Date()).getTime()});
|
||||
f();
|
||||
}
|
||||
})(document, window, "tmr-code");
|
||||
// //Rating Mail.ru counter
|
||||
|
||||
// Yandex.Metrika counter
|
||||
(function(m,e,t,r,i,k,a){
|
||||
m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
|
||||
m[i].l=1*new Date();
|
||||
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
|
||||
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)
|
||||
})(window, document,'script','https://mc.yandex.ru/metrika/tag.js?id=106953063', 'ym');
|
||||
ym(106953063, 'init', {ssr:true, webvisor:true, clickmap:true, ecommerce:"dataLayer", referrer: document.referrer, url: location.href, accurateTrackBounce:true, trackLinks:true});
|
||||
|
||||
Reference in New Issue
Block a user