added images to articles

assets/css/compiled/main.css

@@ -1502,6 +1502,18 @@ select {
   margin-top: 1.5rem;
 }
 
+.mb-10 {
+  margin-bottom: 2.5rem;
+}
+
+.mb-5 {
+  margin-bottom: 1.25rem;
+}
+
+.mb-\[5rem\] {
+  margin-bottom: 5rem;
+}
+
 .mr-3 {
   margin-right: 0.75rem;
 }
@@ -1586,6 +1598,10 @@ select {
   height: 3rem;
 }
 
+.h-32 {
+  height: 8rem;
+}
+
 .h-24 {
   height: 6rem;
 }
@@ -1682,6 +1698,10 @@ select {
   flex: 1 1 0%;
 }
 
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
+
 .grow {
   flex-grow: 1;
 }
@@ -1745,6 +1765,12 @@ select {
   justify-content: space-between;
 }
 
+.space-y-10 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(2.5rem * var(--tw-space-y-reverse));
+}
+
 .space-x-3 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 0;
   margin-right: calc(0.75rem * var(--tw-space-x-reverse));
@@ -2862,27 +2888,17 @@ body:has(#menu-controller:checked) {
           text-decoration-line: underline;
 }
 
-/* Responsive hides for hybrid header 
+/* */
-@screen sm {
-  .hidebasic {
-    @apply invisible;
-  }
 
-  .hidehamburger {
+.thumbnail {
-    @apply visibile;
+  min-width: 300px;
-  }
+  height: 180px;
+  background-repeat:no-repeat;
+  background-size:cover;
+  background-position:center;
+  box-shadow: 10px 10px 30px 2px rgba(0, 0, 0, 0.6);
 }
 
-@screen md {
-  .hidebasic {
-    @apply visibile;
-  };
-
-  .hidehamburger {
-    @apply invisible;
-  }
-}*/
-
 .first\:mt-8:first-child {
   margin-top: 2rem;
 }
@@ -3301,10 +3317,22 @@ body:has(#menu-controller:checked) {
     margin-bottom: 0px;
   }
 
+  .sm\:mr-7 {
+    margin-right: 1.75rem;
+  }
+
+  .sm\:flex {
+    display: flex;
+  }
+
   .sm\:w-1\/2 {
     width: 50%;
   }
 
+  .sm\:w-32 {
+    width: 8rem;
+  }
+
   .sm\:flex-row {
     flex-direction: row;
   }
@@ -3355,6 +3383,10 @@ body:has(#menu-controller:checked) {
 }
 
 @media (min-width: 768px) {
+  .md\:mb-0 {
+    margin-bottom: 0px;
+  }
+
   .md\:ml-12 {
     margin-left: 3rem;
   }

assets/css/main.css

@@ -337,23 +337,12 @@ body:has(#menu-controller:checked) {
   @apply underline;
 }
 
-/* Responsive hides for hybrid header 
+/* */
-@screen sm {
+.thumbnail {
-  .hidebasic {
+  min-width: 300px;
-    @apply invisible;
+  height: 180px;
-  }
+  background-repeat:no-repeat;
-
+  background-size:cover; 
-  .hidehamburger {
+  background-position:center;
-    @apply visibile;
+  box-shadow: 10px 10px 30px 2px rgba(0, 0, 0, 0.6);
-  }
+}
-}
-
-@screen md {
-  .hidebasic {
-    @apply visibile;
-  };
-
-  .hidehamburger {
-    @apply invisible;
-  }
-}*/

assets/css/schemes/blowfish.css

@@ -0,0 +1,37 @@
+/* Ocean scheme */
+:root {
+  --color-neutral: 255, 255, 255;
+  /* Gray */
+  --color-neutral-50: 248, 250, 252;
+  --color-neutral-100: 241, 245, 249;
+  --color-neutral-200: 226, 232, 240;
+  --color-neutral-300: 203, 213, 225;
+  --color-neutral-400: 148, 163, 184;
+  --color-neutral-500: 100, 116, 139;
+  --color-neutral-600: 71, 85, 105;
+  --color-neutral-700: 51, 65, 85;
+  --color-neutral-800: 30, 41, 59;
+  --color-neutral-900: 15, 23, 42;
+  /* Blue */
+  --color-primary-50: 239, 246, 255;
+  --color-primary-100: 219, 234, 254;
+  --color-primary-200: 191, 219, 254;
+  --color-primary-300: 147, 197, 253;
+  --color-primary-400: 96, 165, 250;
+  --color-primary-500: 59, 130, 246;
+  --color-primary-600: 37, 99, 235;
+  --color-primary-700: 29, 78, 216;
+  --color-primary-800: 30, 64, 175;
+  --color-primary-900: 30, 58, 138;
+  /* Cyan */
+  --color-secondary-50: 236, 254, 255;
+  --color-secondary-100: 207, 250, 254;
+  --color-secondary-200: 165, 243, 252;
+  --color-secondary-300: 103, 232, 249;
+  --color-secondary-400: 34, 211, 238;
+  --color-secondary-500: 6, 182, 212;
+  --color-secondary-600: 8, 145, 178;
+  --color-secondary-700: 14, 116, 144;
+  --color-secondary-800: 21, 94, 117;
+  --color-secondary-900: 22, 78, 99;
+}

exampleSite/config/_default/params.toml

@@ -22,8 +22,8 @@ mainSections = ["posts", "suggest", "external"]
   showScrollToTop = true
 
 [homepage]
-  layout = "profile" # valid options: page, profile, custom
+  layout = "page" # valid options: page, profile, custom
-  showRecent = false
+  showRecent = true
 
 [article]
   showDate = true

exampleSite/content/_index.md

@@ -3,6 +3,8 @@ title: "Welcome to Congo! :tada:"
 description: "This is a demo of the Congo theme for Hugo."
 ---
 
+![banner](/img/blowfish_banner.png)
+
 {{< lead >}}
 A powerful, lightweight theme for Hugo built with Tailwind CSS.
 {{< /lead >}}

exampleSite/content/posts/202206-mentorcruise-interview copy/index.md

@@ -0,0 +1,42 @@
+---
+title: "Nuno Coração – Meet the Mentor"
+description: "Nuno Coração is one of our professional mentors on MentorCruise and works as Staff Product Manager at Docker."
+summary: "Nuno Coração is one of our professional mentors on MentorCruise and works as Staff Product Manager at Docker."
+categories: ["Product", "Mentorship", "Interview"]
+tags: ["Product", "Mentorship", "Interview", "Mentorcruise"]
+externalUrl: "https://mentorcruise.com/blog/nuno-coracao-meet-the-mentor-01006/"
+showSummary: true
+date: 2022-06-26
+draft: false
+showReadingTime: false
+---
+
+{{< alert >}}
+This article was originally published externally, read the original <a target="_blank" href="https://mentorcruise.com/blog/nuno-coracao-meet-the-mentor-01006/">here</a>.
+{{</ alert >}}
+
+
+I’ve been building and shipping products across multiple roles and industries, from video streaming applications to API platforms.
+
+# Why did you decide to become a mentor?
+Throughout my career, I was fortunate enough to find (or be found by) amazing mentors that helped me in several different ways. Some provided advice for professional decisions and career management, others access to opportunities, and some just took me along for the ride to “watch & learn”. All of those contributed so much to make me a better professional and gave me some really interesting opportunities in my career. In the last few years, I started being a mentor myself and I am really enjoying the experience of helping others grow and fulfill their career dreams.
+
+# What benefits did you gain from working with mentors early on?
+The main benefit was the ability to tap into someone else’s experience and seniority and learn from their past experiences. It allowed me to get a glimpse of the future and accelerate some career milestones I wanted for myself. As an example, I never had the dream of working or living abroad, but after talking about it with my mentors (that had that experience) I learned so much about what it could bring me professionally and personally that when that opportunity came I was better prepared to make the right decision. Overall, it gave me the chance to learn how to become a better professional by watching how my mentors did it on a professional setting. Moreover, it gave me the chance to manage my career by tapping into their advice and experience in order to achieve my goals.
+
+# How did you get your career start?
+My career started as a trainee in a telco company here in Portugal. I just left university and a junior researcher position to become a solutions architect for the TV department. It was amazing to get the first job with such responsibility and exposure to the entire organization. However, I have to say that the best part of that role was my manager who made an extra effort to coach and teach me so many invaluable lessons that I do still remember after so many years.
+
+> Good advice is not “one-size-fits-all”
+
+# How do you usually set up mentorships?
+I usually like to understand what are the person’s goals for the mentorship and depending on those design a specific plan. Independently of the goal, I aim to have a weekly 1:1 with each mentee to catch up on progress and see if there is anything that I can do to help with. I also like to have a log file in docs to track questions/actions/open points. What we do within this framework highly depends on the goals themselves. For example, if the mentee is looking for help in switching into a product role, I might help review the CV and LinkedIn profile and prepare them for interviews with material and mock sessions.
+
+# What benefit can you provide to mentees over self-studying?
+As with my own personal experience, the best benefit I can provide my mentees is to allow them to tap into my experiences, and the rational behind them, so that they can learn from it. I don’t mean to say they should do exactly as I did, no advice comes in a “one-size-fits-all” package. Moreover, I definitely made some mistakes along the way. But with that insight, each person can decide what resonates with them and what doesn’t in order to make their own decisions. In summary, I’m here to help with product topics and career management, specially people that want to get into product and don’t know where to start.
+
+# What’s been your favourite mentorship story so far?
+In one of my previous role I was managing two young professionals that joined the product team as QA Engineers. Both of them wanted to become Product Managers and were looking for ways to make that move happen. During one year I made an extra effort to share my experiences, give advice, and try to get them as many opportunities to have a “taste” of what PM is by getting them into meetings and brainstormings with my dev teams, shadow customer calls, attend meetings with management, etc. I was really happy the day I was able to sponsor both of them into their first PM roles still within the company. Since then it has been even more fulfilling to watch them grow and have their own successful careers in Product.
+
+# What are you getting out of being a mentor?
+From my experience, having access to mentors, allowed me to grow and improve at a professional and personal level faster than by myself. At this stage in my life, I feel like I’ve experienced enough to have something valuable to share with others and maybe help them achieve their goals. Ultimately, that is what I am aiming to get out of this experience, to be able to have the same impact as a mentor as my mentors had on me.

layouts/_default/list.html

@@ -25,7 +25,7 @@
     </div>
   </section>
   {{ if gt .Pages 0 }}
-    <section>
+    <section class="space-y-10">
       {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
         {{ if $.Params.groupByYear | default ($.Site.Params.list.groupByYear | default true) }}
           <h2 class="mt-12 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">

layouts/partials/article-link.html

@@ -1,4 +1,72 @@
-<article>
+{{ with .Params.externalUrl }}
+<a class="sm:flex mb-10" href="{{ . }}" target="_blank" rel="external">
+  {{ else }}
+  <a class="sm:flex mb-10" href="{{ .RelPermalink }}">
+    {{ end }}
+
+    {{- with $.Params.images -}}
+    {{- range first 6 . }}
+    <meta property="og:image" content="{{ . | absURL }}" />{{ end -}}
+    {{- else -}}
+    {{- $images := $.Resources.ByType "image" -}}
+    {{- $featured := $images.GetMatch "*feature*" -}}
+    {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
+    {{- with $featured -}}
+
+    <!--img class="nozoom customthumb" src="{{ $featured.Permalink }}"-->
+    <div class="mb-5 flex-shrink-0 sm:mb-0 sm:mr-7 thumbnail nozoom"
+      style="background-image:url({{ $featured.Permalink }});">
+      <svg class="h-32 w-full bg-white text-gray-300 sm:w-32" preserveAspectRatio="none" stroke="none" fill="none"
+        viewBox="0 0 200 200" aria-hidden="true">
+      </svg>
+    </div>
+
+    {{- else -}}
+    {{- with $.Site.Params.images }}
+    <meta property="og:image" content="{{ index . 0 | absURL }}" />{{ end -}}
+    {{- end -}}
+    {{- end -}}
+
+
+    <div class="mb-[5rem] md:mb-0">
+      <h3 class="flex items-center text-xl font-semibold">
+        {{ with .Params.externalUrl }}
+        <div>
+          <div
+            class="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral">
+            {{ $.Title | emojify }}
+            <span class="text-xs align-top cursor-default text-neutral-400 dark:text-neutral-500">
+              <span class="rtl:hidden">&#8599;</span>
+              <span class="ltr:hidden">&#8598;</span>
+            </span>
+          </div>
+
+        </div>
+        {{ else }}
+        <p class="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"
+          href="{{ .RelPermalink }}">{{ .Title | emojify }}</p>
+        {{ end }}
+        {{ if and .Draft .Site.Params.article.showDraftLabel }}
+        <div class=" ltr:ml-2 rtl:mr-2">
+          {{ partial "badge.html" (i18n "article.draft" | emojify) }}
+        </div>
+        {{ end }}
+        {{ if templates.Exists "partials/extend-article-link.html" }}
+        {{ partial "extend-article-link.html" . }}
+        {{ end }}
+      </h3>
+      <div class="text-sm text-neutral-500 dark:text-neutral-400">
+        {{ partial "article-meta.html" . }}
+      </div>
+      {{ if .Params.showSummary | default (.Site.Params.list.showSummary | default false) }}
+      <div class="py-1 prose dark:prose-invert">
+        {{ .Summary | emojify }}
+      </div>
+      {{ end }}
+    </div>
+  </a>
+
+  <!--article>
   <h3 class="flex items-center mt-6 text-xl font-semibold">
     {{ with .Params.externalUrl }}
       <div>
@@ -41,4 +109,4 @@
       {{ .Summary | emojify }}
     </div>
   {{ end }}
-</article>
+</article-->

layouts/partials/recent-articles.html

@@ -1,5 +1,5 @@
 {{ if .Site.Params.homepage.showRecent | default false }}
-  <h2 class="mt-8 text-2xl font-extrabold">{{ i18n "shortcode.recent_articles" | emojify }}</h2>
+  <h2 class="mt-8 text-2xl font-extrabold mb-10">{{ i18n "shortcode.recent_articles" | emojify }}</h2>
   {{ range first 5 (.Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections)).Pages }}
     {{ partial "article-link.html" . }}
   {{ end }}