linaro-jekyll-theme 1.3 → 4.0.1

data/_data/nav.yml

@@ -1,62 +1,73 @@
-search: true
-brand:
-    text: OpenDataPlane
-    image: linaro-logo.png
-    url: /
+universal_nav: true
+search:
+  enabled: true
+  label: Linaro
 pages:
-    - title: Home
-      url: /
-    - title: About
-      options:
-          - text: Linaro Overview
-            url: /about/
-          - text: Organisation
-            options:
-                - text: Board of Directors
-                  url: /about/board/
-                - text: Executive Team
-                  url: /about/executive/
-                - text: Technical Steering Committee
-                  url: /about/tsc/
-                - text: Office of the CTO
-                  url: /about/octo/
-            url: /work/
-          - text: Members
-            url: /members/
-          - text: Careers
-            url: /careers/
-    - title: Work
-      options:
-          - text: Core Engineering
-            url: /core/
-          - text: Segment Groups
-            url: /groups/
-          - text: Lead Projects
-            url: /projects/
-          - text: Initiatives
-            url: /initiatives/
-          - text: Professional Services
-            url: /professional-services/
-    - title: Downloads
-      options:
-          - text: Software Downloads
-            url: /downloads/
-          - text: Developers
-            url: /developers/
-    - title: "News & Events"
-      options:
-          - text: "News & Events"
-            url: /hub/
-          - text: News
-            url: /news/
-          - text: Linaro Blog
-            url: /blog/
-          - text: Planet Linaro
-            url: /planet/
-          - text: Linaro Connect
-            url: https://connect.linaro.org
-            external: true
-          - text: Social Media Hub
-            url: /social/
-    - title: Contact
-      url: /contact/
+  - title: Features
+    options:
+      - text: Page Headers
+        options:
+          - text: Video Header
+            url: /features/video-header/
+          - text: Slider Header
+            url: /features/slider-header/
+          - text: Background Image Header
+            url: /features/background-image-header/
+          - text: Header
+            url: /features/header/
+          - text: Breadcrumb
+            url: /features/breadcrumb/
+          - text: No Header
+            url: /features/no-header/
+      - text: Layouts
+        options:
+          - text: Flow
+            url: /flow/
+          - text: Post
+            url: /post/
+  - options:
+      - text: Overview
+        url: /engineering/
+      - text: Artificial Intelligence
+        url: /engineering/artificial-intelligence/
+      - text: Autonomous Vehicles
+        url: /engineering/autonomous-vehicles/
+      - text: Consumer
+        url: /engineering/consumer/
+      - text: Core Engineering on Arm
+        options:
+          - text: Overview
+            url: /engineering/core/
+          - text: Core Technologies & Tools
+            url: /engineering/core/ctt/
+          - text: Kernel Validation
+            url: /engineering/core/kernel-validation-and-testing/
+          - text: Toolchain
+            url: /engineering/core/toolchain/
+          - text: Kernel
+            url: /engineering/core/kernel/
+          - text: Power Management
+            url: /engineering/core/arm-power-management/
+          - text: Power Management EAS
+            url: /engineering/core/arm-power-management/eas/
+          - text: Power Management Farm
+            url: /engineering/core/arm-power-management/pmwg-farm/
+          - text: Security
+            url: /engineering/core/security/
+          - text: Devicetree Evolution
+            url: /engineering/core/devicetree-evolution/
+      - text: Datacenter & Cloud
+        url: /engineering/datacenter-and-cloud/
+      - text: Edge & Fog Computing
+        url: /engineering/edge-and-fog-computing/
+      - text: High Performance Computing
+        url: /engineering/high-performance-computing/
+      - text: IoT & Embedded
+        url: /engineering/iot-and-embedded/
+      - text: Multimedia
+        url: /engineering/multimedia/
+    title: Engineering
+  - title: Membership
+    url: /membership/
+  - url: /blog/
+    title: Blog

data/_data/picture.yml

@@ -0,0 +1,151 @@
+# Example picture presets:
+# TODO: change to EMs, because safari sucks.
+
+# Media presets are used in several places:
+# - To specify alternate source images (for art direction)
+# - To build the 'sizes' attribute
+# - When given alternate source images, specify which sizes to generate.
+media_presets:
+  xl: "min-width: 1200px"
+  lg: "max-width: 1199.98px"
+  md: "max-width: 991.98px"
+  sm: "max-width: 767.98px"
+  xs: "max-width: 575.98px"
+# Markup presets allow you to group settings together, and select one of them by name in your jekyll
+# tag. All settings are optional.
+markup_presets:
+  default:
+    # Optionally specify a markup type. Your current options are 'picture', 'img', or 'auto'
+    # (default).
+    markup: auto
+    # Must be an array, in order of decreasing preference. Defaults to just 'original'.
+    formats: [webp, original]
+    # Must be an array: which image sizes (width in pixels) to generate (unless directed otherwise
+    # below). If not specified, will use sensible default values.
+    widths: [576, 768, 992, 1600]
+    # Alternate source images (for art direction) are associated with media query presets. Here, you
+    # can optionally specify a different set of sizes to generate for those alternate source images.
+    # This is how you avoid generating a 1800 pixel wide image that's only shown on narrow screens.
+    # Must be arrays.
+    media_widths:
+      lg: [1200]
+      md: [990]
+      sm: [767]
+      xs: [575]
+    # Specifies an optional, unconditional size attribute. Can be given alone, or if specified in
+    # combination with 'sizes' below, will be given last (when no media queries apply).
+    size: 800px
+    # For building the 'sizes' attribute on img and source tags. specifies how wide the image will
+    # be when a given media query is true. Note that every source in a given <picture> tag will have
+    # the same associated sizes attribute.
+    sizes:
+      sm: 60vw
+      md: 60vw
+      lg: 60vw
+      xl: 60vw
+    # Specify the properties of the fallback image. If not specified, will return a 900 pixel
+    # wide image in the original format.
+    fallback_width: 800
+    fallback_format: original
+    # Attributes can be added to each HTML element, by type:
+    attributes:
+      picture: 'class="awesome" data-volume="11"'
+      img: 'class="some-other-class"'
+  # 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, but you'd like to supply higher resolution images
+  # to devices with higher pixel ratios.
+  icon:
+    base_width: 20
+    pixel_ratios: [1, 1.5, 2]
+    fallback_width: 20
+    attributes:
+      img: 'class="icon"'
+  # Presets
+  # This is an example of how you'd get generated image and a URL, and nothing else.
+  direct:
+    markup: direct_url
+    fallback_format: webp # Default original
+    fallback_width: 600 # Default 800
+  # Images for blog posts
+  blog_image:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload img-fluid blog_content_image "'
+    formats: [webp, original]
+    widths: [400, 800, 1200]
+  header_image:
+    markup: data_auto
+    attributes:
+      img: 'class="lazyload header_background_image"'
+    formats: [webp, original]
+    widths: [576, 768, 992, 1200]
+    fallback_format: webp
+    fallback_width: 1920
+  content_image:
+    markup: data_auto
+    attributes:
+      img: 'class="lazyload img-fluid content_image"'
+    formats: [webp, original]
+    widths: [576, 768, 992, 1200]
+    fallback_format: webp
+    fallback_width: 1920
+  header_slider_image:
+    markup: data_picture
+    attributes:
+      source: 'class="owl-lazy"'
+      img: 'class="owl-lazy header_background_image"'
+    formats: [webp, original]
+    widths: [400, 800, 1200, 1920]
+  card_block_image:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload card-img-top"'
+    formats: [webp, original]
+    widths: [400, 600]
+  feature_block_image:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload img-fluid"'
+    formats: [webp, original]
+    widths: [400, 600, 900, 1400]
+  featured_blog_image:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload img-fluid post_index_header_image"'
+    formats: [webp, original]
+    widths: [400, 600, 900, 1400]
+  slider_block_image:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload img-fluid"'
+    formats: [webp, original]
+    widths: [400, 600, 900, 1400]
+  youtube_poster_image:
+    markup: direct_url
+    attributes:
+      img: 'class="lazyload img-fluid"'
+    formats: [webp, original]
+    widths: [400, 600, 900, 1400]
+  author_thumbnail:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload rounded-circle"'
+    formats: [webp, original]
+    widths: [50, 100]
+  author_thumbnail_small:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload rounded-circle small"'
+    formats: [webp, original]
+    widths: [50, 100]
+  post_thumb:
+    markup: data_picture
+    attributes:
+      img: 'class="lazyload mr-3 img-thumbnail suggested_post_thumb"'
+    formats: [webp, original]
+    widths: [50, 100, 400]
+  post_thumb_src_only:
+    markup: direct_url
+    fallback_format: webp
+    fallback_width: 400
+    widths: [400]

data/_data/universal_nav.yml

@@ -0,0 +1,22 @@
+items:
+  - active: true
+    title: Linaro
+    url: 'https://www.linaro.org/'
+  - title: Connect
+    url: 'https://connect.linaro.org'
+  - title: 96Boards
+    url: 'https://www.96boards.org'
+  - title: Developer Cloud
+    url: 'https://linaro.cloud'
+  - options:
+      - title: 96Boards.ai
+        url: 'https://www.96boards.ai'
+      - title: devicetree.org
+        url: 'https://www.devicetree.org'
+      - title: OpenAMP
+        url: 'https://www.openampproject.org'
+      - title: OP-TEE
+        url: 'https://www.op-tee.org'
+      - title: Trusted Firmware
+        url: 'https://www.trustedfirmware.org/'
+    title: Projects

data/_includes/blog/authors_posts.html

@@ -0,0 +1,37 @@
+<h3>Posts</h3>
+<ul class="list-unstyled">
+    {% for post in site.posts %}
+    {% if post.author == page.username %}
+        {% assign timeframe = 604800 %}
+        {% assign post_in_seconds = post.date | date: "%s" | plus: 0 %}
+        {% assign recent_posts = "now" | date: "%s" | minus: timeframe %}
+        {% if post.image %}
+            {% assign image_path = post.image %}
+            {% capture image_alt %}{{post.title}} image {% endcapture %}
+        {% else %}
+            {% assign image_path = site.post_placeholder %}
+            {% capture image_alt %}Blog post placeholder image {% endcapture %}
+        {% endif %}
+        <li class="media flex-column flex-sm-row">
+            {% picture post_thumb {{image_path}} --alt {{image_alt}} %}
+            <div class="media-body">
+                <a href="{{post.url}}">
+                    <h5 class="mt-0 mb-1">{{post.title}}</h5>
+                    <em class="suggested_post_date">{{post.date | date: "%A, %B %-d, %Y" }}</em>
+                    <p>
+                    {% if post.description %}
+                        {{post.description}}
+                    {% else %}
+                        {{ post.content | strip_html | truncatewords:30 }}
+                    {% endif %}
+                    </p>
+                    {% if post_in_seconds > recent_posts %}
+                        <span class="new-post" title="Post added in the last week.">New</span>
+                    {% endif %}
+                </a>
+            </div>
+        </li>
+
+        {% endif %}
+    {% endfor %}
+</ul>

data/_includes/blog/blog_filler_element.html

@@ -0,0 +1,21 @@
+<div class="col col-12 col-sm-4  blog-post-item-col p-3">
+    <div class="card h-100">
+        <div class="card-body">
+            <h5 class="card-title">Card title</h5>
+            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's
+                content.</p>
+        </div>
+        <ul class="list-group list-group-flush">
+            <li class="list-group-item">Cras justo odio</li>
+            <li class="list-group-item">Dapibus ac facilisis in</li>
+            <li class="list-group-item">Vestibulum at eros</li>
+            <li class="list-group-item">Cras justo odio</li>
+            <li class="list-group-item">Dapibus ac facilisis in</li>
+            <li class="list-group-item">Vestibulum at eros</li>
+        </ul>
+        <div class="card-body">
+            <a href="#" class="card-link">Card link</a>
+            <a href="#" class="card-link">Another link</a>
+        </div>
+    </div>
+</div>

data/_includes/blog/display_latest_posts.html

@@ -0,0 +1,119 @@
+{% if include.object.category %}
+    {% assign posts = site.categories[include.object.category] | sort: 'date' | reverse %}
+{% elsif include.posts %}
+    {% assign posts = include.posts | sort: 'date' | reverse  %}
+{% elsif include.object.posts %}
+    {% assign posts = include.object.posts | sort: 'date' | reverse  %}
+{% else %}
+    {% assign posts = site.posts | sort: 'date' | reverse %}
+{% endif %}
+
+{% if include.object.limit %}
+    {% assign post_limit = include.object.limit %}
+{% else %}
+    {% assign post_limit = site.post_limit %}
+{% endif %}
+<div class="row py-3">
+    {% for post in posts limit: post_limit %}
+        {% assign timeframe = 604800 %}
+        {% assign post_in_seconds = post.date | date: "%s" | plus: 0 %}
+        {% assign recent_posts = "now" | date: "%s" | minus: timeframe %}
+
+        {% if forloop.first %}
+            <div class="col col-12 featured_post">
+                <div class="row">
+                    <div class="col col-12 col-lg-7 order-lg-2 px-0 px-sm-0 latest-featured-post">
+                        <a href="{{post.url}}">
+                            {% if post.image %}
+                                {% assign block_image = post.image %}
+                                {% capture block_image_alt %}{{post.title}} image {% endcapture %}
+                            {% else %}
+                                {% assign block_image = site.post_placeholder %}
+                                {% capture block_image_alt %}Blog post placeholder image {% endcapture %}
+                            {% endif %}
+                            {% picture featured_blog_image {{block_image}} --alt {{block_image_alt}} %}
+                        </a>
+                    </div>
+                    <div class="col col-12 col-lg-5 order-lg-1 px-0 px-sm-0 latest-featured-post-content">
+                        <div class="card h-100">
+                            <div class="card-body">
+                                {% assign author = site.authors | where: "username", post.author | first %}
+                                {% assign author-url = author.url %}
+                                {% if author.image %}
+                                    {% assign author_image = author.image %}
+                                {% else %}
+                                    {% assign author_image = site.avatar_placeholder %}
+                                {% endif %}
+                                {% capture image_alt %}{{author.name}} profile image{% endcapture %}
+                                <div class="media align-items-center mb-3">
+                                    <div class="media-body">
+                                        <em class="mt-0">{{author.name}}</em>
+                                    </div>
+                                    {% picture author_thumbnail_small {{author_image}} --alt {{image_alt}} %}
+                                </div>
+                                <h5 class="card-title">{{post.title}}</h5>
+                                <h6 class="card-subtitle mb-2 text-muted">{{ post.date | date: "%A, %B %-d, %Y"}}</h6>
+                                <p class="card-text">
+                                    {% if post.description %}
+                                        {{post.description}}
+                                    {% else %}
+                                        {{ post.content | strip_html | truncatewords:30 }}
+                                    {% endif %}
+                                </p>
+                                <p class="card-text">
+                                    <a href="{{post.url}}" class="btn btn-primary">Read</a>
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        {% else %}
+
+            <div class="col col-12 col-sm-6 col-lg-4 blog-post-item-col p-3">
+                <a href="{{post.url}}">
+                <div class="card h-100 ">
+                    <div class="blog_image_header">
+                        {% if post.image %}
+                            {% assign block_image = post.image %}
+                            {% capture block_image_alt %}{{post.title}} image {% endcapture %}
+                        {% else %}
+                            {% assign block_image = site.post_placeholder %}
+                            {% capture block_image_alt %}Blog post placeholder image {% endcapture %}
+                        {% endif %}
+                        {% picture featured_blog_image {{block_image}} --alt {{block_image_alt}} %}
+                    </div>
+                    <div class="card-body">
+
+                        {% assign author = site.authors | where: "username", post.author | first %}
+                        {% assign author-url = author.url %}
+                        {% if author.image %}
+                            {% assign author_image = author.image %}
+                        {% else %}
+                            {% assign author_image = site.avatar_placeholder %}
+                        {% endif %}
+                        {% capture image_alt %}{{author.name}} profile image{% endcapture %}
+                        <div class="media align-items-center mb-3">
+                            <div class="media-body">
+                                <em class="mt-0">{{author.name}}</em>
+                            </div>
+                            {% picture author_thumbnail_small {{author_image}} --alt {{image_alt}} %}
+                        </div>
+                        <h5 class="card-title">{{post.title}}</h5>
+                        <h6 class="card-subtitle mb-2 text-muted">{{ post.date | date: "%A, %B %-d, %Y"}}</h6>
+                        {% include blog/read_time.html content=post.content %}
+                        <p class="card-text">
+                            {% if post.description %}
+                                {{post.description | strip_html | truncatewords:30 }}
+                            {% else %}
+                                {{ post.content | strip_html | truncatewords:30 }}
+                            {% endif %}
+                        </p>
+                    </div>
+                </div>
+                </a>
+
+            </div>
+            {% endif %}
+    {% endfor %}
+</div>