aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorsn4il <sn4il@localhost.localdomain>2024-05-04 19:38:21 +0300
committersn4il <sn4il@localhost.localdomain>2024-05-04 19:38:21 +0300
commitdac214b12f911288fd4ff6b98a3857ab21d0a71b (patch)
treee64a8b33dc7abd4cbbc3a13eb0d734d267fbd94c
parent15b6a74002796d6d3532884f112bfe9ffc9763ae (diff)
downloadsmol-dac214b12f911288fd4ff6b98a3857ab21d0a71b.tar.gz
smol-dac214b12f911288fd4ff6b98a3857ab21d0a71b.zip
Init2
Diffstat
-rw-r--r--index.html97
-rwxr-xr-xstyle.css364
2 files changed, 461 insertions, 0 deletions
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..1a8c66e
--- /dev/null
+++ b/index.html
@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html 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">
+ <title>Малая Сеть</title>
+ <link rel="stylesheet" href="style.css">
+
+ </head>
+ <body>
+ <h1>Малая Сеть</h1>
+ <div class="bh-row bh-no-border">
+ <div class="bh-wide-row bh-vert-2">
+ <div class="bh-col-4">
+ <h3>О чём это</h3>
+ </div>
+
+ <div class="bh-col-8">
+ <div class="bh-wide-row bh-no-border">
+ <div class="bh-col-2">
+
+ </div>
+ </div>
+
+ <p>Малая Сеть — в англоязычном сегменте, чтоб подчеркнуть "маленькость" используется намеренно искажённый термин SmolNet, его же будем использовать и мы — простой и независимый сегмент интернета, ресурсы ориентированные на текст, отсутствие коммерции, вариант "медленной жизни" в сети.</p>
+ <aside class="bh-aside-left">
+ введение
+ </aside>
+ <p>Сразу оговоримся — Малая Сеть включает в себя не только "Малый Веб" (Small Web), но и некоторые другие, ещё более нишевые вещи, вроде протокола Gemini и серверов PubNix, но пока
+ мы будем вести речь именно о той её части, что живёт в WWW.</p>
+ <p>И эта часть представляет из себя разрозненное полотно мелких сайтов, сделанных по старинке (зачастую на коленке и левой ногой), но полностью некоммерческих, развивающихся и живущих своей
+ собственной независимой жизнью вдали от шумных, стандартизированных, прилизанных и до омезрения коммерциализированных соцсетей.
+ </p>
+ <p>В качестве экскурса в прошлое и настоящее Малой Сети настоятельно рекомендуем ознакомиться со статьёй <a href="https://sn4il.site/small.html">"Заново открываем Small Web"</a> (по ссылке русский перевод).</p>
+ <hr>
+ <ul>
+ <li class="bh-title">Сервисы (ознакомьтесь или читайте дальше)</li>
+ <li class="bh-item"><a href="./webring">Webring</a> или кольцо сайтов</li>
+ <li class="bh-item"><a href="https://search.smolnet.ru">Небольшой поисковик</a>, работающий только по русскоязычным сайтам Малого Веба</li>
+ </ul>
+ </div>
+ </div>
+
+
+ <div class="bh-col-4">
+ <h3>Для чего создан этот сайт</h3>
+ </div>
+
+ <div class="bh-col-8">
+ <div class="bh-wide-row bh-no-border">
+ <div class="bh-col-2">
+
+ </div>
+ </div>
+
+ <p>Мы действуем в согласии с принципами, сформулированными в <a href="https://sn4il.site/stm.html">Манифесте Малых Вещей</a>, стремясь малыми делами понемного сделать этот мир немного лучше в меру наших скромных сил.
+ В случае этого сайта — сделать немного лучше Сеть, сохранив и, по возможности развив то уникальное, что обитает на обочине Большого Веба и не видно большинству его обитателей.</p>
+ <p>Ниже приведены цитаты из указанного манифеста, описывающие, за популяризацию чего именно мы выступаем: </p>
+ </div>
+ <div class="bh-col-4">
+ <h4>Что за Малые Вещи?</h4>
+ </div>
+ <div class="bh-col-8">
+ <i>
+ Малые вещи — это искусство, медиа, технологии и культура, создаваемые людьми, к которым относятся справедливо, для людей, к которым и которые относятся справедливо, это свободный и устойчивый взаимообмен. Никаких корпоративных правителей, привратников, технологий сетевого масштабирования и способов разбогатеть за чужой счёт.
+ </i>
+ <hr>
+ </div>
+
+
+ <div class="bh-col-4">
+ <h4>Почему за Малые Вещи?</h4>
+ </div>
+ <div class="bh-col-8">
+ <i>
+ Потому что в мире, где Творчество и Взаимодействие предельно коммерциализированы, акт Создания Вещи или построения сообщества, не подпадающих под влияние наших корпоративных правителей — это радикальный акт.
+ Потому что большие и сложные сообщества и системы сложно управляются без ресурсов правительств и корпораций. Если мы сохраним вещи на Человеческом уровне вместо Глобального, у нас есть шанс стать успешными на Человеческом уровне (а это, в частности — выживание и стабильность, построение отношений и т.д.).
+ Потому что 4 корпорации контролируют 90% наших новостей и развлечений, три корпорации [в России всё ещё хуже] контролируют львиную долю онлайн-взаимодействий, и ни одну корпорацию ни мало не колышет, выживем ли мы или сдохнем. Слишком много власти сконцентрировано в руках слишком малой прослойки населения.
+ Они покупают политиков, влияют на выборы, пишут наши законы, игнорируя неудобные. Они строят игру таким образом, что только они достаточно большие, чтоб играть в неё.
+ Мы, как личности и малые сообщества, должны работать совместно. Мы должны проложить собственный путь.
+ </i>
+ </div>
+
+
+
+</div>
+<div class="bh-col-10">
+ <center>
+ [ <a href="./ring/">RuWR</a> ]<br>[<a href="./ring/prev.html?id=0">←Назад</a> | <a href="./ring/rand.html?id=0">Случайный сайт</a> | <a href="./ring/list.html?id=0">Список</a> | <a href="./ring/next.html?id=0">Вперёд→</a> ]
+ <hr>
+ В согласии с духом <a href="https://tt.sn4il.site/landing.html">Тривиальных Технологий</a>&nbsp;|&nbsp Хостинг: <a href="https://vdsina.ru/?partner=7kp5qpehru">VDSина</a> (скидка 10% по партнёрской ссылке)
+</center>
+ <hr>
+ </div>
+ </body>
+</html>
diff --git a/style.css b/style.css
new file mode 100755
index 0000000..2b2d92c
--- /dev/null
+++ b/style.css
@@ -0,0 +1,364 @@
+@charset "UTF-8";
+html, body, div, h1, h2, h3, h4, h5, span, ul, ol, li {
+ padding: 0;
+ margin: 0; }
+
+ul, ol, li {
+ list-style: none; }
+
+body {
+ font-family: Helvetica, Arial;
+ color: #333333;
+ font-size: 1em; }
+
+.bh-content {
+ padding-top: 2em; }
+
+.bh-row {
+ width: 80%;
+ margin: 0 auto;
+ position: relative; }
+
+.bh-wide-row {
+ width: 100%;
+ position: relative; }
+
+.bh-row, .bh-wide-row {
+ float: none;
+ clear: both;
+ padding-bottom: 2em;
+ border-bottom: 1px solid #ccc; }
+ .bh-row:before, .bh-row:after, .bh-wide-row:before, .bh-wide-row:after {
+ content: "";
+ display: table; }
+ .bh-row:after, .bh-wide-row:after {
+ clear: both; }
+
+.bh-no-border {
+ border: none; }
+
+.bh-col-1 {
+ width: 8.33333%;
+ float: left;
+ position: relative; }
+
+.bh-col-2 {
+ width: 16.66667%;
+ float: left;
+ position: relative; }
+
+.bh-col-3 {
+ width: 25%;
+ float: left;
+ position: relative; }
+
+.bh-col-4 {
+ width: 33.33333%;
+ float: left;
+ position: relative; }
+
+.bh-col-5 {
+ width: 41.66667%;
+ float: left;
+ position: relative; }
+
+.bh-col-6 {
+ width: 50%;
+ float: left;
+ position: relative; }
+
+.bh-col-7 {
+ width: 58.33333%;
+ float: left;
+ position: relative; }
+
+.bh-col-8 {
+ width: 66.66667%;
+ float: left;
+ position: relative; }
+
+.bh-col-9 {
+ width: 75%;
+ float: left;
+ position: relative; }
+
+.bh-col-10 {
+ width: 83.33333%;
+ float: left;
+ position: relative; }
+
+.bh-col-11 {
+ width: 91.66667%;
+ float: left;
+ position: relative; }
+
+.bh-col-12 {
+ width: 100%;
+ float: left;
+ position: relative; }
+
+.bh-vert-1 {
+ padding-top: 1em; }
+
+.bh-vert-2 {
+ padding-top: 2em; }
+
+.bh-vert-3 {
+ padding-top: 3em; }
+
+h1, h2, h3 {
+ font-weight: bold;
+ text-transform: uppercase; }
+
+h1 {
+ font-size: 3em;
+ line-height: 1em;
+ padding-bottom: 0.2em;
+ display: table;
+ letter-spacing: -0.02em; }
+
+h2 {
+ font-size: 2.3em;
+ line-height: 1em;
+ letter-spacing: -0.02em; }
+
+h3 {
+ font-size: 1.6em;
+ line-height: 1.2em;
+ letter-spacing: -0.02em; }
+
+p {
+ font-size: 1.2em;
+ line-height: 1.7em;
+ letter-spacing: -0.01em; }
+ p:last-of-type:after {
+ display: block;
+ width: 5em;
+ height: 5px;
+ background: #333;
+ content: " ";
+ margin: 1em 0 0; }
+
+a {
+ color: #333;
+ text-decoration: none;
+ border-bottom: 1px solid #999;
+ padding-bottom: 0.2em; }
+ a:hover {
+ border-bottom-color: dodgerblue; }
+
+small {
+ font-size: 0.8em;
+ color: #999; }
+
+aside {
+ font-size: 0.8em;
+ color: #999;
+ font-style: italic;
+ position: absolute;
+ width: 25%; }
+ aside.bh-aside-left {
+ left: -29%; }
+ aside.bh-aside-right {
+ right: -29%; }
+
+ol, ul {
+ width: 100%;
+ clear: both;
+ float: none;
+ padding-bottom: 1em; }
+ ol li, ul li {
+ font-size: 1.2em;
+ line-height: 1.7em; }
+ ol li.bh-title, ul li.bh-title {
+ font-weight: bold;
+ border-bottom: 1px solid #ccc;
+ text-transform: uppercase;
+ display: table;
+ margin-bottom: 0.4em;
+ padding-bottom: 0.4em;
+ color: #666; }
+
+ol {
+ counter-reset: customlistcounter; }
+ ol li.bh-item:before {
+ content: counter(customlistcounter);
+ counter-increment: customlistcounter;
+ display: block;
+ position: absolute;
+ color: #999;
+ margin-left: -1.5em; }
+
+ul li.bh-item:before {
+ content: "–";
+ display: block;
+ position: absolute;
+ color: #999;
+ margin-left: -1.5em; }
+ul.bh-timeline header {
+ text-transform: uppercase;
+ font-size: 0.8em;
+ font-weight: bold;
+ color: #666; }
+ul.bh-timeline li.bh-timeline-item {
+ padding-top: 1em;
+ padding-left: 2em;
+ border-left: 1px solid #ccc; }
+ ul.bh-timeline li.bh-timeline-item:before {
+ content: "";
+ display: block;
+ width: 0.5em;
+ height: 0.5em;
+ background: #ccc;
+ border-radius: 2em;
+ position: absolute;
+ margin: 0.6em 0 0 -2.3em;
+ z-index: 1000; }
+ ul.bh-timeline li.bh-timeline-item small {
+ display: block;
+ line-height: 1.4em; }
+ ul.bh-timeline li.bh-timeline-item:last-of-type {
+ position: relative; }
+ ul.bh-timeline li.bh-timeline-item:last-of-type:after {
+ height: calc(100% - 1.6em);
+ width: 20px;
+ position: absolute;
+ background: #fff;
+ display: block;
+ content: "";
+ margin-left: -2.3em;
+ bottom: 0;
+ z-index: 999; }
+ul.bh-timeline:before {
+ height: 1.9em;
+ width: 20px;
+ position: absolute;
+ background: #fff;
+ display: block;
+ content: "";
+ margin-left: -1px; }
+
+.bh-gray {
+ color: #999; }
+ .bh-gray a {
+ color: #999; }
+
+.bh-light-gray {
+ color: #ccc; }
+ .bh-light-gray a {
+ color: #ccc; }
+
+button {
+ background: #fff;
+ border: 1px solid #999;
+ font-size: 1em;
+ padding: 1em 2em;
+ border-radius: 3em;
+ text-transform: uppercase;
+ font-weight: bold;
+ color: #999;
+ cursor: pointer;
+ outline: none; }
+ button:hover {
+ color: dodgerblue;
+ border-color: dodgerblue; }
+ button:active {
+ background: #eee; }
+ button.bh-cancel {
+ border-color: #D1200D;
+ color: #D1200D; }
+ button.bh-cancel:hover {
+ border-color: #A10F04;
+ color: #A10F04; }
+ button.bh-cancel:active {
+ background: #eee; }
+ button.bh-disabled {
+ border-color: #ccc;
+ color: #ccc;
+ cursor: default; }
+ button.bh-disabled:hover {
+ border-color: #ccc;
+ color: #ccc; }
+ button.bh-disabled:active {
+ background: #fff; }
+
+table.bh-table {
+ width: 100%;
+ margin: 1em 0;
+ border-spacing: 0;
+ border-collapse: separate; }
+ table.bh-table thead tr th {
+ font-size: 0.8em;
+ text-transform: uppercase;
+ text-align: left;
+ border-bottom: 2px solid #ccc;
+ padding-bottom: 1em; }
+ table.bh-table tbody tr td {
+ font-size: 1.2em;
+ padding: 0.7em 0;
+ border-bottom: 1px solid #ccc; }
+ table.bh-table tbody tr:last-of-type td {
+ border-bottom: none; }
+
+div.bh-input {
+ margin-bottom: 1.5em; }
+ div.bh-input small {
+ padding-top: 0.3em;
+ display: block;
+ font-size: 0.75em; }
+ div.bh-input label {
+ font-size: 0.7em;
+ color: #999;
+ text-transform: uppercase;
+ font-weight: bold;
+ margin-bottom: 0.7em;
+ display: block; }
+ div.bh-input input[type=text], div.bh-input input[type=password], div.bh-input textarea {
+ width: 100%;
+ display: block;
+ font-family: Helvetica, Arial;
+ font-size: 1.2em;
+ color: #333;
+ background: none;
+ border: none;
+ border-bottom: 1px solid #ddd;
+ padding-bottom: 0.5em;
+ outline: none; }
+ div.bh-input input[type=text]:focus, div.bh-input input[type=password]:focus, div.bh-input textarea:focus {
+ border-color: #999; }
+ div.bh-input.bh-invalid label {
+ color: #D1200D; }
+ div.bh-input.bh-invalid input[type=text], div.bh-input.bh-invalid input[type=password] {
+ border-bottom-color: #D1200D; }
+div.bh-search {
+ width: 100%;
+ position: relative; }
+ div.bh-search input {
+ display: block;
+ float: left;
+ background: #fff;
+ border: 1px solid #ccc; }
+ div.bh-search input[type=text] {
+ padding: 1em 2em;
+ border-top-left-radius: 3em;
+ border-bottom-left-radius: 3em;
+ font-size: 1em;
+ outline: none;
+ margin-right: 0;
+ border-right: none;
+ width: calc(100% - 6em); }
+ div.bh-search input[type=submit] {
+ font-size: 0.8em;
+ padding: 1.3em 2em 1.4em 1em;
+ border-top-right-radius: 3em;
+ border-bottom-right-radius: 3em;
+ text-transform: uppercase;
+ font-weight: bold;
+ color: #999;
+ cursor: pointer;
+ outline: none;
+ margin-left: 0;
+ right: 0;
+ position: absolute; }
+
+/*# sourceMappingURL=bauhaus.css.map */
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-21 08:59:37 +0000