Add icons for external links

source/_assets/base_style.scss

@@ -4,6 +4,7 @@ html,
 body {
     font-size: $base-font-size;
     font-family: $base-font-family;
+    color: $base-font-color;
     padding: 0;
     margin: 0;
 
@@ -20,3 +21,26 @@ h5,
 h6 {
     font-weight: normal;
 }
+
+%external-link-icon {
+    display: inline-block;
+    margin-left: 0.6em;
+    color: $base-font-color;
+    font-size: $base-font-size - 4px;
+
+    @media (max-width: $first-media-step) {
+        font-size: $base-font-size - 2px;
+    }
+}
+
+a[href*="//github.com"]:after {
+    @extend %external-link-icon;
+    font-family: 'Font Awesome 5 Brands', serif;
+    content: '\f09b';
+}
+
+a[target="_blank"]:not([href*="//github.com"]):after {
+    @extend %external-link-icon;
+    font-family: 'Font Awesome 5 Free', serif;
+    content: '\f35d';
+}

source/_assets/vars.scss

@@ -2,6 +2,7 @@ $base-font-family: 'PT Serif', serif;
 
 // Базовый размер шрифта
 $base-font-size: 20px;
+$base-font-color: #333;
 
 // Ширина страницы
 $preferred-width: 700px;