резиновость, новые скриншоты
This commit is contained in:
tolstoevsky
parent
936b615c74
commit
5dc852edf2
8 changed files with 45 additions and 209 deletions
82
social.html
82
social.html
|
|
@ -10,7 +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>
|
||||
|
|
@ -37,13 +36,8 @@
|
|||
|
||||
<p>Ключевой инструмент взаимодействия в современной Сети. Познакомьтесь с альтернативами</p>
|
||||
<div class="imgblock">
|
||||
<img src="images/mastodon.png" width=40% style="float:none; margin:1%;"
|
||||
onclick="openModal();currentSlide(1)" class="hover-shadow cursor"/>
|
||||
<img src="images/mastodon3.png" width=40% style="float:none; margin:1%;"
|
||||
onclick="openModal();currentSlide(3)" class="hover-shadow cursor"/>
|
||||
<img src="images/mastodon2.png" width=80% style="float:none; margin:1%;"
|
||||
onclick="openModal();currentSlide(2)" class="hover-shadow cursor"/>
|
||||
<h3>#вместотвиттера Mastodon</h3>
|
||||
<img src="images/mastodon2.png" width="45%" max-width="100%" style="float:left; margin:1%;">
|
||||
<h3 id="mastodon" >#вместотвиттера Mastodon</h3>
|
||||
<span>
|
||||
<span>На данный момент — самая популярная из этичных социальных сетей с миллионами пользователей.
|
||||
Больше всего напоминает Твиттер, только с большим лимитом символов и более гибким интерфейсом.
|
||||
|
|
@ -86,9 +80,8 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="imgblock">
|
||||
<img src="images/frendica.png" width=80% style="display:flex; margin:1%;"
|
||||
onclick="openModal();currentSlide(4)" class="hover-shadow cursor"/>
|
||||
<h3>#вместоВК Friendica</h3>
|
||||
<img src="images/friendica.png" width=45% max-width="100%" style="float:left; margin:1%;">
|
||||
<h3 id="friendica">#вместоВК Friendica</h3>
|
||||
|
||||
<span>
|
||||
Альтернатива Вконтакте и Facebook, с теми же фишками, включая события и фотоальбомы
|
||||
|
|
@ -120,10 +113,9 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="imgblock">
|
||||
<img src="images/pixelfed.png" width=50% style="float:left; margin:1%;"
|
||||
onclick="openModal();currentSlide(5)" class="hover-shadow cursor"/>
|
||||
<img src="images/pixelfed.png" width=45% max-width=100% style="float:left; margin:1%;">
|
||||
|
||||
<h3>#вместоinstagram PixelFed</h3>
|
||||
<h3 id="pixelfed" >#вместоinstagram PixelFed</h3>
|
||||
|
||||
|
||||
<span>
|
||||
|
|
@ -160,9 +152,8 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="imgblock">
|
||||
<img src="images/peertube.png" width=50% style="float:left; margin:1%;"
|
||||
onclick="openModal();currentSlide(6)" class="hover-shadow cursor"/>
|
||||
<h3>#вместоyoutube PeerTube</h3>
|
||||
<img src="images/peertube.png" width=45% max-width=100% style="float:left; margin:1%;">
|
||||
<h3 id="peertube">#вместоyoutube PeerTube</h3>
|
||||
|
||||
<span>
|
||||
PeerTube — открытая распределённая альтернатива YouTube (принадлежит Google).
|
||||
|
|
@ -199,63 +190,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="myModal" class="modal">
|
||||
<span class="close cursor" onclick="closeModal()">×</span>
|
||||
<div class="modal-content">
|
||||
|
||||
<div class="mySlides">
|
||||
<div class="numbertext">Mastodon</div>
|
||||
<img src="images/mastodon.png" style="width:100%">
|
||||
</div>
|
||||
<div class="mySlides">
|
||||
<div class="numbertext">Mastodon</div>
|
||||
<img src="images/mastodon2.png" style="width:100%">
|
||||
</div>
|
||||
<div class="mySlides">
|
||||
<div class="numbertext">Mastodon</div>
|
||||
<img src="images/mastodon3.png" style="width:100%">
|
||||
</div>
|
||||
<div class="mySlides">
|
||||
<div class="numbertext">Friendica</div>
|
||||
<img src="images/frendica.png" style="width:100%">
|
||||
</div>
|
||||
<div class="mySlides">
|
||||
<div class="numbertext">PixelFed</div>
|
||||
<img src="images/pixelfed.png" style="width:100%">
|
||||
</div>
|
||||
<div class="mySlides">
|
||||
<div class="numbertext">PeerTube</div>
|
||||
<img src="images/peertube.png" style="width:100%">
|
||||
</div>
|
||||
|
||||
<a class="prev" onclick="plusSlides(-1)">❮</a>
|
||||
<a class="next" onclick="plusSlides(1)">❯</a>
|
||||
|
||||
<div class="caption-container">
|
||||
<p id="caption"></p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<img class="demo cursor" src="images/mastodon.png" style="width:100%" onclick="currentSlide(1)" alt="Mastodon">
|
||||
</div>
|
||||
<div class="column">
|
||||
<img class="demo cursor" src="images/mastodon2.png" style="width:100%" onclick="currentSlide(2)" alt="Mastodon">
|
||||
</div>
|
||||
|
||||
<div class="column">
|
||||
<img class="demo cursor" src="images/mastodon3.png" style="width:100%" onclick="currentSlide(3)" alt="Mastodon">
|
||||
</div>
|
||||
|
||||
<div class="column">
|
||||
<img class="demo cursor" src="images/frendica.png" style="width:100%" onclick="currentSlide(4)" alt="Friendica">
|
||||
</div>
|
||||
<div class="column">
|
||||
<img class="demo cursor" src="images/pixelfed.png" style="width:100%" onclick="currentSlide(5)" alt="PixelFed">
|
||||
</div>
|
||||
<div class="column">
|
||||
<img class="demo cursor" src="images/peertube.png" style="width:100%" onclick="currentSlide(6)" alt="PeerTube">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue