резиновость, новые скриншоты

This commit is contained in:
tolstoevsky 2020-03-11 10:34:15 +03:00
parent 936b615c74
commit 5dc852edf2
No known key found for this signature in database
GPG key ID: EDD59F3A654C596C
8 changed files with 45 additions and 209 deletions

View file

@ -10,8 +10,6 @@
<link rel="stylesheet" href="css/menu.css">
<link rel="stylesheet" href="css/popup.css">
<link rel="stylesheet" href="css/btn.css">
<script src="js/popup.js"></script>
<script src="js/menu.js"></script>
</head>
<body>
@ -36,7 +34,7 @@
<div class="textblock">
<h2>Зачем вообще менять поисковик?</h2>
<p>
<img src="images/q.png" align="right" style="margin: 0px 0px 0px 10px;">
<img src="images/q.png" align="right" style="margin: 0px 0px 0px 10px;" alt="question">
Централизованные поисковые системы, ярчайшими (в негативном смысле) представителями которых являются
Google, Bing и Яндекс, строят поисковую выдачу на анализе ваших предыдущих запросов, формируя
так называемый "информационный пузырь", также известный как <b>"пузырь фильтров"</b>. Как следствие,
@ -54,7 +52,7 @@
<div class="textblock">
<h2>Альтернативные варианты</h2>
<p>
<img src="images/mag.png" align="right" style="margin: 0px 0px 0px 10px;">
<img src="images/mag.png" align="right" style="margin: 0px 0px 0px 10px;" alt="searching">
Поиск в море информации современной Сети — дело ресурсозатратное. Нужны огромные мощности для анализа и индексации
всей мудрости и глупости Человечества. Как же совместить необходимость содержать громадные датацентры с безопасностью
и неприкосновенностью личных данных, да ещё и обеспечить адекватную выдачу информации?
@ -69,7 +67,7 @@
Это не требует больших затрат вычислительных мощностей и позволяет обходиться пожертвованиями или нетаргетированной рекламой.
</p>
<div class="imgblock">
<img src="images/searx.png" width=40% style="float:left; margin:1%;" onclick="openModal();currentSlide(1)" class="hover-shadow cursor"/>
<img src="images/searx.png" width=50% max-width=100% style="float:left; margin:1%;" alt="SearX">
<h4>Searx</h4>
<p>
Это метапоисковик с <a href="https://github.com/asciimoo/searx">открытым</a> исходным кодом, что позволяет каждому
@ -93,7 +91,7 @@
грантов и пожертвований наравне с доходами от неследящей рекламы в самой поисковой системе.
</p>
<div class="imgblock">
<img src="images/ecosia.png" width=40% style="float:left; margin:1%;" onclick="openModal();currentSlide(2)" class="hover-shadow cursor"/>
<img src="images/ecosia.png" width=50% max-width=100% style="float:left; margin:1%;" alt="Ecosia">
<h4>Яркий пример — Ecosia</h4>
<p>
Этот поисковик направляет часть доходов от рекламы и грантов на посадку деревьев по всему миру. Задумка проста:
@ -109,7 +107,7 @@
ресурсы. Каждый будет индексировать малюсенький кусочек сети со своего собственного слабого сервера и делиться результатами
с остальными. И это действительно работает!
<div class="imgblock">
<img src="images/yacy.png" width=40% style="float:left; margin:1%;" onclick="openModal();currentSlide(3)" class="hover-shadow cursor"/>
<img src="images/yacy.png" width=50% max-width=100% style="float:left; margin:1%;" alt="YaCy">
<h4>YaCy</h4>
Этот вариант подойдёт продвинутым пользователям и системным администраторам, так как проект ориентирован
в первую очередь на развёртывание инстанции "под себя". Всё достаточно просто — вы устанавливаете приложение,
@ -129,41 +127,6 @@
</div>
<!-- gallery images block -->
<div id="myModal" class="modal">
<span class="close cursor" onclick="closeModal()">&times;</span>
<div class="modal-content">
<div class="mySlides">
<div class="numbertext">Searx</div>
<img src="images/searx.png" style="width:100%">
</div>
<div class="mySlides">
<div class="numbertext">Ecosia</div>
<img src="images/ecosia.png" style="width:100%">
</div>
<div class="mySlides">
<div class="numbertext">YaCy</div>
<img src="images/yacy.png" style="width:100%">
</div>
<a class="prev" onclick="plusSlides(-1)">&#10094;</a>
<a class="next" onclick="plusSlides(1)">&#10095;</a>
<div class="caption-container">
<p id="caption"></p>
</div>
<div class="column">
<img class="demo cursor" src="images/searx.png" style="width:100%" onclick="currentSlide(1)" alt="Searx">
</div>
<div class="column">
<img class="demo cursor" src="images/ecosia.png" style="width:100%" onclick="currentSlide(2)" alt="Ecosia">
</div>
<div class="column">
<img class="demo cursor" src="images/yacy.png" style="width:100%" onclick="currentSlide(3)" alt="YaCy">
</div>
</div>
</div>
</body>