index.html

{{ define "main" }}
<article class="cf ph3 ph5-l pv3 pv4-l f4 tc-l center measure-wide lh-copy mid-gray">
    {{ .Content }}
</article>
{{/* Define a section to pull recent posts from. For Hugo 0.20 this will default to the section with the most number of pages. */}}
{{ $mainSections := .Site.Params.mainSections | default (slice "post") }}
{{/* Create a variable with that section to use in multiple places. */}}
{{ $section := where .Site.RegularPages "Section" "in" $mainSections }}
{{/* Check to see if the section is defined for ranging through it */}}
{{ $section_count := len $section }}
{{ if ge $section_count 1 }}
{{/* Derive the section name  */}}
{{ $section_name := index (.Site.Params.mainSections) 0 }}

<div class="container">
    <div class="row">
        <div class="col-md-4">
            <p>Container Orchestration</p>
        </div>
        <div class="col-md-2" style="margin-left: 10px;">
            <p>Dev Tools</p>
        </div>
        <div class="col-md-5" style="margin-left: 30px;">
            <p>Data Services, Machine Learning & AI</p>
        </div>
    </div>
    <div class="row">
        <div class="col-md-4"
             style="background-color: white;padding-bottom: 10px;padding-left: 40px;padding-right: 10px;padding-top: 10px;margin-right: 20px;">
            <div class="row">

                {{ $n_posts := $.Param "recent_posts_number" | default 10 }}

                {{/* Range through the first $n_posts items of the section */}}
                {{ range (first $n_posts $section) }}
                {{ $featured_image := .Params.featured_image }}
                {{ if .Params.featured_image }}
                {{/* Trimming the slash and adding absURL make sure the image works no matter where our site
                lives */}}
                {{ $featured_image := (trim $featured_image "/") | absURL }}
                {{ end }}
                <div class="col-md-4" style="text-align: center;background-color: #f3f3f3;">
                    <a href="{{.URL}}" class="db grow">
                        <img style="max-width: 100px;" src="{{ $featured_image }}" class="img"
                             alt="image from {{ .Title }}">
                    </a>
                    <h6>{{ .Title }}</h6>
                    <hr>
                </div>
                <div class="col-md-1">

                </div>
                <!--<a href="{{.URL}}" class="ba b&#45;&#45;moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">{{$.Param "read_more_copy" | default "read more" }}</a>-->
                {{ end }}
            </div>
        </div>
        <div class="col-md-2" style="background-color: white;margin-right: 10px;padding-top: 10px;">
            <div class="row">
                <div class="col-md-12" style="text-align: center">
                    <img style="max-width: 70%" src='{{ "images/jenkins.png" | absURL }}' alt="">
                    <br><br>
                    <img style="max-width: 50%" src='{{ "images/gitlab.png" | absURL }}' alt="">
                </div>
            </div>
        </div>
        <div class="col-md-5" style="background-color: white;margin-left: 10px;padding-top: 10px;">
            <div class="row">
                <div class="col-md-3">
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                    <br><br><br>
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                </div>
                <div class="col-md-3">
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                    <br><br><br>
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                </div>
                <div class="col-md-3">
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                    <br><br><br>
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                </div>
                <div class="col-md-3">
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                    <br><br><br>
                    <img src='{{ "images/jenkins.png" | absURL }}' alt="">
                </div>
            </div>
        </div>
    </div>
    <hr>
    <!--<div class="row" style="text-align: center">-->
    <!--<div class="col-lg-3">-->
    <!--<div style="background-color: #8cbdc6;border-radius: 10px;">-->
    <!--<p>App-Aware scheduling </p>-->
    <!--</div>-->
    <!--</div>-->
    <!--<div class="col-lg-3">-->
    <!--<div style="background-color: #8cbdc6;border-radius: 10px;">-->
    <!--<p>Security & Compliance </p>-->
    <!--</div>-->
    <!--</div>-->
    <!--<div class="col-lg-3">-->
    <!--<div style="background-color: #8cbdc6;border-radius: 10px;">-->
    <!--<p>Multitenancy</p>-->
    <!--</div>-->
    <!--</div>-->
    <!--<div class="col-lg-3">-->
    <!--<div style="background-color: #8cbdc6;border-radius: 10px;">-->
    <!--<p>Management & Operations </p>-->
    <!--</div>-->
    <!--</div>-->
    <!--</div>-->
</div>
<div class="container">

    {{ range where .Site.Pages "Section" "posts1" }}
    <!-- example -->
    <a href="{{.RelPermalink}}">{{ .Title }}</a>
    {{ end }}
</div>

<!--<div class="pa3 pa4-ns w-100 w-70-ns center">-->
<!--{{/* Use $section_name to get the section title. Use "with" to only show it if it exists */}}-->
<!--{{ with .Site.GetPage "section" $section_name }}-->
<!--<h1 class="flex-none">-->
<!--Recent {{ .Title }}-->
<!--</h1>-->
<!--{{ end }}-->

<!--{{ $n_posts := $.Param "recent_posts_number" | default 10 }}-->

<!--<section class="w-100 mw8">-->
<!--{{/* Range through the first $n_posts items of the section */}}-->
<!--{{ range (first $n_posts $section) }}-->
<!--<div class="relative w-100 mb4">-->
<!--{{ $featured_image := .Params.featured_image }}-->
<!--{{ if .Params.featured_image }}-->
<!--{{/* Trimming the slash and adding absURL make sure the image works no matter where our site lives */}}-->
<!--{{ $featured_image := (trim $featured_image "/") | absURL }}-->
<!--<div class="pr3-ns mb4 mb0-ns w-100 w-40-ns">-->
<!--<a href="{{.URL}}" class="db grow">-->
<!--<img style="max-width: 100px;" src="{{ $featured_image }}" class="img"-->
<!--alt="image from {{ .Title }}">-->
<!--</a>-->
<!--</div>-->
<!--{{ end }}-->

<!--{{ .Title }}-->
<!--&lt;!&ndash;<a href="{{.URL}}" class="ba b&#45;&#45;moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">{{$.Param "read_more_copy" | default "read more" }}</a>&ndash;&gt;-->
<!--</div>-->
<!--{{ end }}-->
<!--</section>-->

<!--{{ if ge $section_count (add $n_posts 1) }}-->
<!--<section class="w-100">-->
<!--<h1 class="f3">More</h1>-->
<!--{{/* Now, range through the next four after the initial $n_posts items. Nest the requirements, "after" then-->
<!--"first" on the outside */}}-->
<!--{{ range (first 4 (after $n_posts $section)) }}-->
<!--<h2 class="f5 fw4 mb4 dib mr3">-->
<!--<a href="{{ .URL }}" class="link black dim">-->
<!--{{ .Title }}-->
<!--</a>-->
<!--</h2>-->
<!--{{ end }}-->

<!--{{/* As above, Use $section_name to get the section title, and URL. Use "with" to only show it if it exists-->
<!--*/}}-->
<!--{{ with .Site.GetPage "section" $section_name }}-->
<!--<a href="{{ .URL }}" class="link db f6 pa2 br3 bg-mid-gray white dim w4 tc">All {{.Title }}</a>-->
<!--{{ end }}-->
<!--</section>-->
<!--{{ end }}-->

<!--</div>-->
{{ end }}
{{ end }}