Connect page

_layouts/my-connect.html

@@ -0,0 +1,118 @@
+---
+layout: default
+sitemap: false
+author_profile: false
+---
+
+<style>
+
+  .name {
+    a { 
+      color:  #222831;
+    }
+  }
+
+  .link-style{
+    a:link {
+      text-decoration: none;
+      /* color: "{{link-color}}"; */
+    }
+
+    a:visited {
+      text-decoration: none;
+    }
+
+    a:hover {
+      text-decoration: underline;
+    }
+
+    a:active {
+      text-decoration: underline;
+    }
+  }
+
+
+  .center {
+    margin:auto;
+    max-height:250px; 
+    place-items: center;
+    text-align: center;
+    max-width: 280px;
+    align-items: center;
+    list-style-type: none;
+  }
+
+  .extra-margin {
+     margin-bottom: 1em;
+  }
+
+  .avatar {
+    display: inline;
+    float: center;
+    margin-left: auto;
+    margin-right: auto;
+    width: 48px;
+    height: 48px;
+    margin-bottom: 1em;
+    margin-top: auto;
+
+    img {
+      max-width: 130px;
+      border-radius: 50%;
+
+      @include breakpoint($large) {
+        padding: 5px;
+        border: 1px solid $border-color;
+      }
+    }
+  }
+  
+</style>
+
+
+{% assign author = page.author | default: page.authors[0] | default: site.author %}
+{% assign author = site.data.authors[author] | default: author %}
+
+<div class="center">
+
+  <br>
+
+  {% if author.avatar %}
+    <div class="avatar">
+      <a href="{{ author.home | default: '/' | absolute_url }}">
+        <img src="{{ author.avatar | relative_url }}" alt="{{ author.name }}" itemprop="image" class="u-photo">
+      </a>
+    </div>
+  {% endif %}
+
+  <h3 class="name p-name link-style" itemprop="name">
+    <a class="name u-url" rel="me" href="{{ author.home | default: '/' | absolute_url }}" itemprop="url">{{ author.name }}</a>
+  </h3>
+  {% if author.bio %}
+    <div class="author__bio p-note link-style" itemprop="description">
+      {{ author.bio | markdownify }}
+    </div>
+  {% endif %}
+
+
+  {{ content }}
+
+    {% if site.footer.links %}
+      {% for link in site.footer.links %}
+        {% if link.label and link.url %}
+          <li class="link-style name"><a href="{{ link.url }}" rel="nofollow noopener noreferrer"><i class="{{ link.icon | default: 'fas fa-link' }} extra-margin link-style" aria-hidden="true"></i> {{ link.label }}</a></li>
+        {% endif %}
+      {% endfor %}
+    {% endif %}
+    <br>
+    <a style="text-align: center;" href="/assets/images/qr.png" class="btn btn--success image-popup">Display QR Code</a>
+    <br>
+    <br>
+    <a style="text-align: center;" href="/" class="btn btn--primary">Back to the home</a>
+
+
+</div>
+
+
+
+

_sass/minimal-mistakes/_archive.scss

@@ -7,7 +7,6 @@ h2 {
 }
 
 .table-left {
-  // font-size: 28px !important;
   font: 21px/1.4 Helvetica,"Helvetica Neue",Arial,sans-serif;
   padding-right: 1.5em;
   align-content: "center";
@@ -23,7 +22,6 @@ h2 {
 }
 
 .table-right {
-  // font-size: 28px !important;
   font: 21px/1.4 Helvetica,"Helvetica Neue",Arial,sans-serif;
   padding-left: 1.5em;
   align-content: "center";

connect.md

@@ -0,0 +1,10 @@
+---
+layout: my-connect
+# classes: wide
+title: "Connect"
+excerpt: "How to connect with me."
+sitemap: false
+permalink: /connect.html
+author_profile: false
+---
+