fix(seo): attempt to adapt images + small fixes

_data/picture.yml

@@ -3,7 +3,7 @@
 # These are used in several places. You likely want to enter whatever CSS media queries your site
 # uses here.
 media_queries:
- phone: 'max-width : 719px'
+ mobile: 'max-width : 769px'
  tablet: 'max-width : 1119px'
  desktop: 'min-width : 1120px'
 
@@ -35,7 +35,7 @@ presets:
  # Size is unconditional; provided either after all conditional sizes (above) or alone. If you
  # only have a 'size' (no 'sizes'), and it's a constant (px, em, or rem), you should use a
  # pixel-ratio srcset.
- #size: 800px
+ size: 970px
 
  link_source: false # wrap images in a link to the original source image.
  dimension_attributes: true # Page reflow begone!
@@ -65,20 +65,29 @@ presets:
  # This is an example of how you would create a 'multiplier' based srcset; useful when an image
  # will always be the same size on all screens (icons, graphics, thumbnails, etc), but you'd like
  # to supply higher resolution images to devices with higher pixel ratios.
+ top-image-post:
+ base_width: 970 # How wide the 1x image should be.
+ pixel_ratios: [1, 2] # Which multipliers to target.
+ fallback_width: 970 # The default is 800, which is probably too big.
+ formats: [avif, webp, original]
+ link_source: false
+ dimension_attributes: true
+
  thumbnail-home:
+ # phone: 348, tablet: 474, desktop: 222
  base_width: 380 # How wide the 1x image should be.
- pixel_ratios: [1,2] # Which multipliers to target.
+ pixel_ratios: [1, 2] # Which multipliers to target.
  fallback_width: 380 # The default is 800, which is probably too big.
  formats: [avif, webp, original]
  link_source: true
- dimension_attributes: false
+ dimension_attributes: true
  attributes:
  a: 'class="post-thumbnail"'
 
  thumbnail-article:
- base_width: 380
+ base_width: 300
  pixel_ratios: [1,2] # Which multipliers to target.
- fallback_width: 380 # The default is 800, which is probably too big.
+ fallback_width: 300 # The default is 800, which is probably too big.
  formats: [avif, webp, original]
  link_source: false
  dimension_attributes: false

_includes/author.html

@@ -1,7 +1,7 @@
 <div class="page-author">
  <div class="author-pres">
  <div class="author-img">
- {% picture thumbnail-author {{ "/assets/img/" | prepend: site.baseurl | append : site.author-img}} --alt {{site.author}} --class author-img --width 80 --height 80 %}
+ {% picture thumbnail-author {{ "/assets/img/" | prepend: site.baseurl | append : site.author-img}} center 1:1 --alt {{site.author}} --class author-img --width 80 --height 80 %}
  </div>
  <div class="author-info">
  <p class="intro">{{ site.data.i18n.written-by }}</p>

_layouts/default.html

@@ -8,6 +8,6 @@
  <div class="wrapper">
  {{ content }}
  </div>
- <script src="/darkmode.js"></script>
+ <script src="/darkmode.min.js"></script>
  </body>
 </html>

_posts/en/2023-07-08-git-workflows.markdown

@@ -1,6 +1,6 @@
 ---
 layout: post
-title: "Git Branch Workflows: A Survey of Possibilities"
+title: "Git Branch Management: Exploring the Realm of Possibilities"
 date: 2023-07-08 09:58:00 +0200
 description: "Explore Git branch management models to optimize your workflow: Git Flow, GitHub Flow, Trunk Based Flow, Forking Workflow, and more."
 img: git-workflows.jpg

_sass/_media.scss

@@ -109,15 +109,14 @@
  h1, h2, h3, h4, h5, h6, h7 {
  text-align: center;
  }
-/* h1 {
- font-size: 1.5em;
- }
- h2 {
- font-size: 1.2em;
+ /* TOC */
+ #markdown-toc {
+ padding: 10px 0px;
+ li {
+ padding: 5px 0px;
+ }
  }
- h3 {
- font-size: 1em;
- } */
+
  .sidebar {
  position: relative;
  display: flex;

_sass/parts/_post-page.scss

@@ -710,6 +710,9 @@ a.card-source.microlink_vanilla {
  text-align: left;
  text-decoration: none;
  color: var(--body-color);
+ word-break: break-word;
+ hyphens: auto;
+ hyphenate-character: '-';
  }
 
  .image-container {

index.html

@@ -8,7 +8,14 @@
 {% for post in paginator.posts %}
 <article class="post">
  {% if post.img %}
- {% picture thumbnail-home {{ "/assets/img/" | prepend: site.baseurl | append : post.img}} 3:2 entropy --link {{post.url | prepend: site.baseurl}} --alt {{post.title}} %}
+ {%
+ picture
+ thumbnail-home
+ {{ "/assets/img/" | prepend: site.baseurl | append : post.img}} 1:1 center
+ tablet: {{ "/assets/img/" | prepend: site.baseurl | append : post.img}} 3:2 center
+ --link {{post.url | prepend: site.baseurl}}
+ --alt {{post.title}}
+ %}
  {% else %}
  {% endif %}
  <div class="post-content">