From 25365a6b7b3d10d213f812b309189288c68255c9 Mon Sep 17 00:00:00 2001
From: biscoito <biscoito@riseup.net>
Date: Mon, 8 Jan 2024 17:15:10 -0300
Subject: [PATCH] Fixed responsiveness, added new SVG and aligned icons #13

---
 assets/img/matrix.svg | 26 +++++++++-----------------
 index.html            | 22 ++++++++++++++++------
 style.css             | 22 ++++++++++++++++------
 3 files changed, 41 insertions(+), 29 deletions(-)

diff --git a/assets/img/matrix.svg b/assets/img/matrix.svg
index d583af7..77f97df 100644
--- a/assets/img/matrix.svg
+++ b/assets/img/matrix.svg
@@ -1,17 +1,9 @@
-<svg width="22" height="23" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g filter="url(#filter0_d_9_4)">
-<path d="M4.60003 1.6C4.51516 1.60001 4.43377 1.63373 4.37376 1.69374C4.31375 1.75374 4.28004 1.83513 4.28003 1.92V14.08C4.28004 14.1649 4.31375 14.2463 4.37376 14.3063C4.43377 14.3663 4.51516 14.4 4.60003 14.4H5.56003C5.60243 14.4006 5.64453 14.3928 5.68388 14.377C5.72323 14.3611 5.75905 14.3377 5.78925 14.3079C5.81944 14.2781 5.84342 14.2426 5.85979 14.2035C5.87616 14.1644 5.88459 14.1224 5.88459 14.08C5.88459 14.0376 5.87616 13.9956 5.85979 13.9565C5.84342 13.9174 5.81944 13.8819 5.78925 13.8521C5.75905 13.8223 5.72323 13.7989 5.68388 13.783C5.64453 13.7672 5.60243 13.7594 5.56003 13.76H4.92003V2.24H5.56003C5.60243 2.2406 5.64453 2.23277 5.68388 2.21695C5.72323 2.20114 5.75905 2.17767 5.78925 2.14789C5.81944 2.11812 5.84342 2.08264 5.85979 2.04352C5.87616 2.00439 5.88459 1.96241 5.88459 1.92C5.88459 1.87759 5.87616 1.83561 5.85979 1.79648C5.84342 1.75736 5.81944 1.72188 5.78925 1.69211C5.75905 1.66233 5.72323 1.63886 5.68388 1.62305C5.64453 1.60723 5.60243 1.5994 5.56003 1.6H4.60003ZM16.44 1.6C16.3976 1.5994 16.3555 1.60723 16.3162 1.62305C16.2768 1.63886 16.241 1.66233 16.2108 1.69211C16.1806 1.72188 16.1566 1.75736 16.1403 1.79648C16.1239 1.83561 16.1155 1.87759 16.1155 1.92C16.1155 1.96241 16.1239 2.00439 16.1403 2.04352C16.1566 2.08264 16.1806 2.11812 16.2108 2.14789C16.241 2.17767 16.2768 2.20114 16.3162 2.21695C16.3555 2.23277 16.3976 2.2406 16.44 2.24H17.08V13.76H16.44C16.3976 13.7594 16.3555 13.7672 16.3162 13.783C16.2768 13.7989 16.241 13.8223 16.2108 13.8521C16.1806 13.8819 16.1566 13.9174 16.1403 13.9565C16.1239 13.9956 16.1155 14.0376 16.1155 14.08C16.1155 14.1224 16.1239 14.1644 16.1403 14.2035C16.1566 14.2426 16.1806 14.2781 16.2108 14.3079C16.241 14.3377 16.2768 14.3611 16.3162 14.377C16.3555 14.3928 16.3976 14.4006 16.44 14.4H17.4C17.4849 14.4 17.5663 14.3663 17.6263 14.3063C17.6863 14.2463 17.72 14.1649 17.72 14.08V1.92C17.72 1.83513 17.6863 1.75374 17.6263 1.69374C17.5663 1.63373 17.4849 1.60001 17.4 1.6H16.44ZM12.9438 5.60313C12.5923 5.596 12.2379 5.68329 11.9532 5.87937C11.7704 6.00546 11.613 6.1673 11.4319 6.3225C11.1564 5.77274 10.6574 5.62585 10.0888 5.61625C9.51246 5.60633 9.05472 5.86937 8.6544 6.34937V5.76H7.48003V10.24H8.65253C8.65253 10.24 8.65058 8.56512 8.65378 7.73312C8.65442 7.58528 8.66057 7.43432 8.69065 7.29C8.78345 6.84552 9.2522 6.57102 9.70628 6.6075C10.1389 6.64238 10.392 6.87861 10.4132 7.39125C10.4167 7.48053 10.4132 10.24 10.4132 10.24H11.5863V7.75312C11.5882 7.56144 11.6086 7.3656 11.655 7.18C11.7593 6.764 12.149 6.55944 12.6063 6.61C13.0095 6.65448 13.3165 6.87187 13.3463 7.31187V10.24H14.52V7.04C14.52 6.72 14.4389 6.55708 14.3419 6.36188C14.1075 5.88967 13.5296 5.615 12.9438 5.60313Z" fill="white"/>
-</g>
-<defs>
-<filter id="filter0_d_9_4" x="-1" y="0" width="24" height="24" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset dy="4"/>
-<feGaussianBlur stdDeviation="2"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_9_4"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_9_4" result="shape"/>
-</filter>
-</defs>
-</svg>
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" viewBox="0 0 27.9 32" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+ <title>Matrix (protocol) logo</title>
+ <g transform="translate(-.095 .005)" fill="#FFFFFF">
+  <path d="m27.1 31.2v-30.5h-2.19v-0.732h3.04v32h-3.04v-0.732z"/>
+  <path d="m8.23 10.4v1.54h0.044c0.385-0.564 0.893-1.03 1.49-1.37 0.58-0.323 1.25-0.485 1.99-0.485 0.72 0 1.38 0.14 1.97 0.42 0.595 0.279 1.05 0.771 1.36 1.48 0.338-0.5 0.796-0.941 1.38-1.32 0.58-0.383 1.27-0.574 2.06-0.574 0.602 0 1.16 0.074 1.67 0.22 0.514 0.148 0.954 0.383 1.32 0.707 0.366 0.323 0.653 0.746 0.859 1.27 0.205 0.522 0.308 1.15 0.308 1.89v7.63h-3.13v-6.46c0-0.383-0.015-0.743-0.044-1.08-0.0209-0.307-0.103-0.607-0.242-0.882-0.133-0.251-0.336-0.458-0.584-0.596-0.257-0.146-0.606-0.22-1.05-0.22-0.44 0-0.796 0.085-1.07 0.253-0.272 0.17-0.485 0.39-0.639 0.662-0.159 0.287-0.264 0.602-0.308 0.927-0.052 0.347-0.078 0.697-0.078 1.05v6.35h-3.13v-6.4c0-0.338-7e-3 -0.673-0.021-1-0.0114-0.314-0.0749-0.623-0.188-0.916-0.108-0.277-0.3-0.512-0.55-0.673-0.258-0.168-0.636-0.253-1.14-0.253-0.198 0.0083-0.394 0.042-0.584 0.1-0.258 0.0745-0.498 0.202-0.705 0.374-0.228 0.184-0.422 0.449-0.584 0.794-0.161 0.346-0.242 0.798-0.242 1.36v6.62h-3.13v-11.4z"/>
+  <path d="m0.936 0.732v30.5h2.19v0.732h-3.04v-32h3.03v0.732z"/>
+ </g>
+<script xmlns=""/></svg>
\ No newline at end of file
diff --git a/index.html b/index.html
index 1739162..c1eae54 100644
--- a/index.html
+++ b/index.html
@@ -179,7 +179,9 @@ <h3>A Staff é a Boitatech?</h3>
                   href="https://discord.gg/boitatech"
                   target="_blank"
                   ><img src="assets/img/discord.svg" alt="logo discord" />
-                  <p>discord.gg/boitatech</p></a
+                  <p>
+                    <span class="social-link">discord.gg</span>/boitatech
+                  </p></a
                 >
               </li>
               <li>
@@ -188,7 +190,9 @@ <h3>A Staff é a Boitatech?</h3>
                   href="https://youtube.com/@BOITATECH"
                   target="_blank"
                   ><img src="assets/img/youtube.svg" alt="logo youtube" />
-                  <p>youtube.com/@BOITATECH</p></a
+                  <p>
+                    <span class="social-link">youtube.com</span>/@BOITATECH
+                  </p></a
                 >
               </li>
               <li>
@@ -197,7 +201,9 @@ <h3>A Staff é a Boitatech?</h3>
                   href="https://github.com/boitatech"
                   target="_blank"
                   ><img src="assets/img/github.svg" alt="logo github" />
-                  <p>github.com/boitatech</p></a
+                  <p>
+                    <span class="social-link">github.com</span>/boitatech
+                  </p></a
                 >
               </li>
             </ul>
@@ -209,7 +215,7 @@ <h3>A Staff é a Boitatech?</h3>
                   href="https://twitch.tv/BOITATECH"
                   target="_blank"
                   ><img src="assets/img/twitch.svg" alt="logo twitch" />
-                  <p>twitch.tv/boitatech</p></a
+                  <p><span class="social-link">twitch.tv</span>/boitatech</p></a
                 >
               </li>
               <li>
@@ -218,7 +224,9 @@ <h3>A Staff é a Boitatech?</h3>
                   href="https://twitter.com/boitatech"
                   target="_blank"
                   ><img src="assets/img/x.svg" alt="logo x" />
-                  <p>twitter.com/boitatech</p></a
+                  <p>
+                    <span class="social-link">twitter.com</span>/boitatech
+                  </p></a
                 >
               </li>
               <li>
@@ -226,7 +234,9 @@ <h3>A Staff é a Boitatech?</h3>
                   class="socials"
                   href="https://matrix.to/#/#boitatech:matrix.org"
                   ><img src="assets/img/matrix.svg" alt="logo matrix" />
-                  <p>#boitatech:matrix.org</p></a
+                  <p>
+                    #boitatech<span class="social-link">:matrix.org</span>
+                  </p></a
                 >
               </li>
             </ul>
diff --git a/style.css b/style.css
index eabc635..4c41a32 100644
--- a/style.css
+++ b/style.css
@@ -224,6 +224,11 @@ a {
   align-items: center;
 }
 
+.medias a {
+  display: flex;
+  align-items: center;
+}
+
 @media (max-width: 399px) {
   .content-container {
     height: auto;
@@ -300,7 +305,7 @@ a {
   }
 }
 
-@media (max-height: 900px) {
+@media (max-height: 950px) {
   footer {
     position: relative;
   }
@@ -312,9 +317,14 @@ a {
   }
 }
 
-/* 
-@media (max-height: 945px) {
-  body {
-    height: auto;
+@media (max-width: 1406px) and (max-height: 1190px) {
+  footer {
+    position: relative;
+  }
+}
+
+@media (max-width: 450px) {
+  .social-link {
+    display: none;
   }
-} */
+}