[camel-website] branch master updated: CAMEL-13818: design of the blog section

classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

[camel-website] branch master updated: CAMEL-13818: design of the blog section

zregvart
This is an automated email from the ASF dual-hosted git repository.

zregvart pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/camel-website.git


The following commit(s) were added to refs/heads/master by this push:
     new ddd596d  CAMEL-13818: design of the blog section
ddd596d is described below

commit ddd596dc1b38debdcb1aa9c86d67bbe4c358aba8
Author: Zoran Regvart <[hidden email]>
AuthorDate: Fri Sep 13 18:10:50 2019 +0200

    CAMEL-13818: design of the blog section
   
    Summary of changes:
     - news section renamed to blog
     - blog section revamped with featured images
     - headings are now bold (previously normal)
     - minification removed from Hugo build (random issues, done by
       htmlminify in gulp anyhow)
     - taxonomy for categories enabled and initial design added
---
 .gitignore                                         |   1 +
 .yarnrc                                            |   2 +-
 antora-ui-camel/src/css/blog.css                   | 109 +++++++++++++++++++++
 antora-ui-camel/src/css/category.css               |  27 +++++
 antora-ui-camel/src/css/pagination.css             |  37 +++++++
 antora-ui-camel/src/css/site.css                   |   3 +
 antora-ui-camel/src/css/vars.css                   |   2 +-
 antora-ui-camel/src/partials/footer-content.hbs    |   2 +-
 config.toml                                        |   8 +-
 content/blog/ApacheConNA-2019/acna19-featured.jpg  | Bin 0 -> 243107 bytes
 .../ApacheConNA-2019/index.md}                     |   1 +
 content/blog/RELEASE-2.24.0/camel-featured.jpg     | Bin 0 -> 122153 bytes
 .../RELEASE-2.24.0/index.md}                       |   4 +-
 content/blog/RELEASE-2.24.2/camel-featured.jpg     | Bin 0 -> 771987 bytes
 .../RELEASE-2.24.2/index.md}                       |   4 +-
 content/blog/RELEASE-3.0.0-RC1/camel-featured.jpg  | Bin 0 -> 1541883 bytes
 .../RELEASE-3.0.0-RC1/index.md}                    |   4 +-
 content/blog/_index.md                             |   3 +
 layouts/_default/taxonomy.html                     |  11 +++
 layouts/blog/list.html                             |  21 ++++
 layouts/blog/post.html                             |  33 +++++++
 layouts/blog/single.html                           |   9 ++
 layouts/blog/summary.html                          |  15 +++
 layouts/news-entry/single.html                     |  22 -----
 layouts/news/list.html                             |  42 --------
 layouts/partials/footer.html                       |   2 +-
 package.json                                       |   2 +-
 static/.htaccess                                   |   3 +
 28 files changed, 288 insertions(+), 79 deletions(-)

diff --git a/.gitignore b/.gitignore
index 8168eb1..4065fb0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -3,6 +3,7 @@ target
 node_modules
 public
 documentation
+resources
 
 .idea
 *.iml
diff --git a/.yarnrc b/.yarnrc
index 96c0e67..020a4bc 100644
--- a/.yarnrc
+++ b/.yarnrc
@@ -6,5 +6,5 @@ lastUpdateCheck 1564482372108
 yarn-path ".yarn/releases/yarn-1.17.3.js"
 
 env:
-  HUGO_VERSION "0.56.3"
+  HUGO_VERSION "0.58.2"
 
diff --git a/antora-ui-camel/src/css/blog.css b/antora-ui-camel/src/css/blog.css
new file mode 100644
index 0000000..b9f70e1
--- /dev/null
+++ b/antora-ui-camel/src/css/blog.css
@@ -0,0 +1,109 @@
+.blog {
+  max-width: var(--static-max-width);
+  margin: var(--static-margin);
+}
+
+.list {
+  display: flex;
+}
+
+.list aside {
+  margin-top: 2.5rem;
+  padding-right: 2rem;
+  line-height: 2rem;
+}
+
+@media screen and (min-width: 1024px) {
+  .blog {
+    max-width: var(--static-max-width--desktop);
+  }
+
+  .blog .post {
+    flex-direction: column;
+  }
+
+  .blog a.arrow {
+    font-size: 1rem;
+  }
+
+  .blog a.arrow.prev::after {
+    content: "\00A0previous";
+  }
+
+  .blog a.arrow.next::before {
+    content: "next\00A0";
+  }
+
+  .blog .post .post-content {
+    margin-left: 0;
+    width: auto;
+  }
+}
+
+article.blog:first-child {
+  margin-top: 3rem;
+}
+
+article.blog {
+  padding-bottom: 1rem;
+}
+
+article.blog p {
+  padding-bottom: 1rem;
+}
+
+.blog a.continue {
+  font-weight: bold;
+}
+
+.blog header h1 {
+  font-size: 2rem;
+  font-weight: bold;
+}
+
+.blog .post {
+  margin-top: 1rem;
+  display: flex;
+  flex-direction: row;
+}
+
+.blog .post aside .summary {
+  font-size: 1.2rem;
+  font-style: italic;
+}
+
+.blog .post aside time {
+  color: var(--color-gray-50);
+}
+
+.blog .post aside p {
+  line-height: 3rem;
+  color: var(--color-gray-50);
+}
+
+.blog .post aside {
+  width: 30rem;
+}
+
+.blog a.arrow {
+  font-size: 3rem;
+  text-decoration: none;
+}
+
+.blog a.arrow.prev::after {
+  content: "";
+}
+
+.blog a.arrow.next::before {
+  content: "";
+}
+
+.blog .post .post-content {
+  margin-left: 2rem;
+  width: 100%;
+}
+
+.blog .post-content img.featured {
+  width: 100%;
+  height: auto;
+}
diff --git a/antora-ui-camel/src/css/category.css b/antora-ui-camel/src/css/category.css
new file mode 100644
index 0000000..8ae225e
--- /dev/null
+++ b/antora-ui-camel/src/css/category.css
@@ -0,0 +1,27 @@
+a.category:first-child::before {
+  content: "\2022\00A0\00A0";
+}
+
+a.category:first-child {
+  border-radius: 1rem 0.2rem 0.2rem 1rem;
+  margin-left: 0;
+}
+
+a.category {
+  background-color: var(--color-camel-orange);
+  border-radius: 0.2rem;
+  margin-left: 1px;
+  color: var(--color-white);
+  padding: 0.2rem 0.5rem;
+  font-weight: bold;
+  font-size: 0.65rem;
+  text-decoration: none;
+}
+
+a.category:hover {
+  color: var(--color-white);
+}
+
+a.category span {
+  margin-left: 0.5rem;
+}
diff --git a/antora-ui-camel/src/css/pagination.css b/antora-ui-camel/src/css/pagination.css
new file mode 100644
index 0000000..a474d85
--- /dev/null
+++ b/antora-ui-camel/src/css/pagination.css
@@ -0,0 +1,37 @@
+.pagination {
+  margin: var(--static-margin);
+  max-width: var(--static-max-width);
+  list-style: none;
+  padding: 1rem;
+}
+
+@media screen and (min-width: 1024px) {
+  .pagination {
+    max-width: var(--static-max-width--desktop);
+  }
+}
+
+.page-item {
+  display: inline;
+  padding: 0;
+  margin: 0;
+}
+
+.page-item a {
+  color: var(--color-gray-10);
+  font-weight: bold;
+  padding: 0.5rem;
+}
+
+.page-item.disabled a {
+  color: var(--color-smoke-90);
+}
+
+.page-item.active {
+  border-radius: 3px;
+  background: var(--color-asf-moderate-blue);
+}
+
+.page-item.active a {
+  color: var(--color-white);
+}
diff --git a/antora-ui-camel/src/css/site.css b/antora-ui-camel/src/css/site.css
index 62dad29..3cea488 100644
--- a/antora-ui-camel/src/css/site.css
+++ b/antora-ui-camel/src/css/site.css
@@ -15,3 +15,6 @@
 @import "highlight.css";
 @import "frontpage.css";
 @import "print.css";
+@import "pagination.css";
+@import "blog.css";
+@import "category.css";
diff --git a/antora-ui-camel/src/css/vars.css b/antora-ui-camel/src/css/vars.css
index 0d931a6..85cbbb5 100644
--- a/antora-ui-camel/src/css/vars.css
+++ b/antora-ui-camel/src/css/vars.css
@@ -83,7 +83,7 @@
   --doc-margin: 0 auto;
   --doc-margin--desktop: 0 2rem;
   --heading-font-color: var(--color-asf-dark-blue);
-  --heading-font-weight: normal;
+  --heading-font-weight: bold;
   --alt-heading-font-weight: var(--body-font-weight-bold);
   --section-divider-color: var(--panel-border-color);
   --link-font-color: #585ac2;
diff --git a/antora-ui-camel/src/partials/footer-content.hbs b/antora-ui-camel/src/partials/footer-content.hbs
index b212f17..dd89cce 100644
--- a/antora-ui-camel/src/partials/footer-content.hbs
+++ b/antora-ui-camel/src/partials/footer-content.hbs
@@ -5,7 +5,7 @@
             </figure>
             <dl>
                 <dt>Overview</dt>
-                <dd><a href="{{siteRootPath}}/news/">News</a></dd>
+                <dd><a href="{{siteRootPath}}/blog/">Blog</a></dd>
                 <dd><a href="{{siteRootPath}}/components/latest/">Components</a></dd>
                 <dd><a href="{{siteRootPath}}/download/">Download</a></dd>
                 <dd><a href="{{siteRootPath}}/docs/getting-started/">Getting started</a></dd>
diff --git a/config.toml b/config.toml
index ff89ee4..6b48b0b 100644
--- a/config.toml
+++ b/config.toml
@@ -4,7 +4,7 @@ title = "Apache Camel"
 relativeURLs = true
 disablePathToLower = true
 staticDir = ["static", "documentation"]
-disableKinds = ["taxonomy", "taxonomyTerm"]
+disableKinds = ["taxonomyTerm"]
 enableRobotsTXT = true
 
 [params]
@@ -13,10 +13,10 @@ enableRobotsTXT = true
     organizationDescription = "Apache Camel ™ is a versatile open-source integration framework based on known Enterprise Integration Patterns. Camel empowers you to define routing and mediation rules in a variety of domain-specific languages, including a Java-based Fluent API, Spring or Blueprint XML Configuration files, and a Scala DSL."
 
 [[menu.main]]
-    name = "News"
+    name = "Blog"
     weight = 2
-    identifier = "news"
-    url = "/news/"
+    identifier = "blog"
+    url = "/blog/"
 
 [[menu.main]]
     name = "Projects"
diff --git a/content/blog/ApacheConNA-2019/acna19-featured.jpg b/content/blog/ApacheConNA-2019/acna19-featured.jpg
new file mode 100644
index 0000000..0eeed07
Binary files /dev/null and b/content/blog/ApacheConNA-2019/acna19-featured.jpg differ
diff --git a/content/news/ApacheConNA-2019.md b/content/blog/ApacheConNA-2019/index.md
similarity index 98%
rename from content/news/ApacheConNA-2019.md
rename to content/blog/ApacheConNA-2019/index.md
index 9ceecb7..6aa8593 100644
--- a/content/news/ApacheConNA-2019.md
+++ b/content/blog/ApacheConNA-2019/index.md
@@ -2,6 +2,7 @@
 title: "Camel at ApacheCon North America 2019"
 date: 2019-09-10T16:45:32+02:00
 author: Zoran Regvart
+categories: ["Events"]
 preview: Plenty of Camel at the ApacheCon 2019 in Las Vegas
 ---
 
diff --git a/content/blog/RELEASE-2.24.0/camel-featured.jpg b/content/blog/RELEASE-2.24.0/camel-featured.jpg
new file mode 100644
index 0000000..89bdcff
Binary files /dev/null and b/content/blog/RELEASE-2.24.0/camel-featured.jpg differ
diff --git a/content/news/RELEASE-2.24.0.md b/content/blog/RELEASE-2.24.0/index.md
similarity index 92%
rename from content/news/RELEASE-2.24.0.md
rename to content/blog/RELEASE-2.24.0/index.md
index b95f9a1..25b2424 100644
--- a/content/news/RELEASE-2.24.0.md
+++ b/content/blog/RELEASE-2.24.0/index.md
@@ -1,10 +1,10 @@
 ---
 title: "RELEASE 2.24.0"
-url: /news/release-2-24-0.html
+url: /blog/release-2-24-0.html
 date: 2019-05-12
 draft: false
-type: news-entry
 author: Gregor Zurowski
+categories: ["Releases"]
 preview: "The Camel community announces the immediate availability of the new minor release Camel 2.24.0"
 ---
 
diff --git a/content/blog/RELEASE-2.24.2/camel-featured.jpg b/content/blog/RELEASE-2.24.2/camel-featured.jpg
new file mode 100644
index 0000000..64cf9fa
Binary files /dev/null and b/content/blog/RELEASE-2.24.2/camel-featured.jpg differ
diff --git a/content/news/RELEASE-2.24.2.md b/content/blog/RELEASE-2.24.2/index.md
similarity index 93%
rename from content/news/RELEASE-2.24.2.md
rename to content/blog/RELEASE-2.24.2/index.md
index 3b5fc6d..472257a 100644
--- a/content/news/RELEASE-2.24.2.md
+++ b/content/blog/RELEASE-2.24.2/index.md
@@ -1,10 +1,10 @@
 ---
 title: "RELEASE 2.24.2"
-url: /news/release-2-24-2.html
+url: /blog/release-2-24-2.html
 date: 2019-09-13
 draft: false
-type: news-entry
 author: Gregor Zurowski
+categories: ["Releases"]
 preview: "The Camel community announces the immediate availability of the new patch release Camel 2.24.2"
 ---
 
diff --git a/content/blog/RELEASE-3.0.0-RC1/camel-featured.jpg b/content/blog/RELEASE-3.0.0-RC1/camel-featured.jpg
new file mode 100644
index 0000000..4843585
Binary files /dev/null and b/content/blog/RELEASE-3.0.0-RC1/camel-featured.jpg differ
diff --git a/content/news/RELEASE-3.0.0-RC1.md b/content/blog/RELEASE-3.0.0-RC1/index.md
similarity index 92%
rename from content/news/RELEASE-3.0.0-RC1.md
rename to content/blog/RELEASE-3.0.0-RC1/index.md
index 192ee4e..e6774a7 100644
--- a/content/news/RELEASE-3.0.0-RC1.md
+++ b/content/blog/RELEASE-3.0.0-RC1/index.md
@@ -1,10 +1,10 @@
 ---
 title: "RELEASE 3.0.0-RC1"
-url: /news/release-3-0-0-RC1.html
+url: /blog/release-3-0-0-RC1.html
 date: 2019-09-02
 draft: false
-type: news-entry
 author: Gregor Zurowski
+categories: ["Releases"]
 preview: "The Camel community announces the immediate availability of a new release candidate Camel 3.0.0-RC1"
 ---
 
diff --git a/content/blog/_index.md b/content/blog/_index.md
new file mode 100644
index 0000000..59db226
--- /dev/null
+++ b/content/blog/_index.md
@@ -0,0 +1,3 @@
+---
+title: "Blog"
+---
diff --git a/layouts/_default/taxonomy.html b/layouts/_default/taxonomy.html
new file mode 100644
index 0000000..f5ac4cd
--- /dev/null
+++ b/layouts/_default/taxonomy.html
@@ -0,0 +1,11 @@
+{{ partial "header.html" . }}
+
+<div class="body">
+    <main role="main">
+        {{ range .Pages }}
+            {{ .Render "summary" }}
+        {{ end }}
+    </main>
+</div>
+
+{{ partial "footer.html" . }}
diff --git a/layouts/blog/list.html b/layouts/blog/list.html
new file mode 100644
index 0000000..9175e92
--- /dev/null
+++ b/layouts/blog/list.html
@@ -0,0 +1,21 @@
+{{ partial "header.html" . }}
+
+<div class="body">
+    <main role="main" class="doc blog list">
+        <aside>
+            <h3>Categories</h3>
+            {{ range .Site.Taxonomies.categories.Alphabetical }}
+                <p><a class="category" href="{{ "/categories/" | relURL }}{{ .Name | urlize }}/">{{ .Name | upper }}<span>{{ .Count }}</span></a></p>
+            {{ end }}
+        </aside>
+        <div>
+            {{ $pages := ($.Paginator 3).Pages }}
+            {{ range $pages }}
+                {{ .Render "summary" }}
+            {{ end }}
+            {{ template "_internal/pagination.html" . }}
+        </div>
+    </main>
+</div>
+
+{{ partial "footer.html" . }}
diff --git a/layouts/blog/post.html b/layouts/blog/post.html
new file mode 100644
index 0000000..6918149
--- /dev/null
+++ b/layouts/blog/post.html
@@ -0,0 +1,33 @@
+<article class="blog doc">
+
+    <header>
+        {{ if .Params.categories }}
+            {{ range .Params.categories }}<a class="category" href="{{ "/categories/" | relURL }}{{ . | urlize }}/">{{ upper . }}</a>{{ end }}
+        {{ end }}
+        <h1><a href="{{.Page.Permalink}}">{{ .Title }}</a></h1>
+    </header>
+    <div class="post">
+        <aside>
+            <div class="summary">{{ .Params.preview }}</div>
+            <time itemprop="published" datetime="{{ dateFormat "2006-01-02" .PublishDate }}" title="{{ dateFormat "Monday, January 2, 2006" .PublishDate }}">{{ dateFormat "January 2, 2006" .PublishDate }}</time>
+            <p>by <span rel="author">{{ .Params.author }}</span></p>
+            <p>
+            {{ if .PrevInSection }}
+            <a class="arrow prev" href="{{ .PrevInSection.RelPermalink }}" title="Previous post: {{ .PrevInSection.Title }}">&#10094;</a>
+            {{ end }}
+            {{ if .NextInSection }}
+            <a class="arrow next" href="{{ .NextInSection.RelPermalink }}" title="Next post: {{ .NextInSection.Title }}">&#10095;</a>
+            {{ end }}
+            </p>
+        </aside>
+        <div class="post-content">
+            {{ $featured := (.Resources.ByType "image").GetMatch "*featured*" }}
+            {{ with $featured }}
+                {{ $featured := .Resize "800x q95 Gaussian" }}
+                <img class="featured" alt="Blog post featured image" src="{{ $featured.RelPermalink }}" width="{{ $featured.Width }}" height="{{ $featured.Height }}">
+            {{ end }}
+            {{ .Content }}
+        </div>
+    </div>
+
+</article>
diff --git a/layouts/blog/single.html b/layouts/blog/single.html
new file mode 100644
index 0000000..e5b7fbc
--- /dev/null
+++ b/layouts/blog/single.html
@@ -0,0 +1,9 @@
+{{ partial "header.html" . }}
+
+<div class="body">
+    <main role="main blog">
+        {{ .Render "post" }}
+    </main>
+</div>
+
+{{ partial "footer.html" . }}
diff --git a/layouts/blog/summary.html b/layouts/blog/summary.html
new file mode 100644
index 0000000..ecf969f
--- /dev/null
+++ b/layouts/blog/summary.html
@@ -0,0 +1,15 @@
+<article class="blog doc">
+
+    <header>
+        <h1><a href="{{.Page.RelPermalink}}">{{ .Title }}</a></h1>
+    </header>
+    <p>{{ .Summary }}</p>
+    <p><a class="continue" href="{{ .RelPermalink }}">Continue reading &#10095;</a></p>
+    <p>
+        {{ if .Params.categories }}
+            {{ range .Params.categories }}<a class="category" href="{{ "/categories/" | relURL }}{{ . | urlize }}/">{{ upper . }}</a>{{ end }}
+        {{end}}
+        &#11825; <time itemprop="published" datetime="{{ dateFormat "2006-01-02" .PublishDate }}" title="{{ dateFormat "Monday, January 2, 2006" .PublishDate }}">{{ dateFormat "January 2, 2006" .PublishDate }}</time> &#11825; <span rel="author">{{ .Params.author }}</span>
+    </p>
+
+</article>
diff --git a/layouts/news-entry/single.html b/layouts/news-entry/single.html
deleted file mode 100644
index 7c6dde1..0000000
--- a/layouts/news-entry/single.html
+++ /dev/null
@@ -1,22 +0,0 @@
-{{ partial "header.html" . }}
-
-<div class="body">
-    <main role="main">
-        <article class="static doc">
-
-            <div class="container pb-5">
-              <h4>Apache Camel News: {{ .Params.title }}</h4>
-              <h5>Date</h5>
-              {{ dateFormat "Monday, Jan 2, 2006" .Params.date }}
-              <h5>Author</h5>
-              {{ .Params.author }}
-              <h5>Description</h5>
-              {{ .Params.description }}
-              {{ .Content }}
-            </div>
-
-        </article>
-    </main>
-</div>
-
-{{ partial "footer.html" . }}
diff --git a/layouts/news/list.html b/layouts/news/list.html
deleted file mode 100644
index 389399f..0000000
--- a/layouts/news/list.html
+++ /dev/null
@@ -1,42 +0,0 @@
-{{ partial "header.html" . }}
-
-<div class="body">
-    <main role="main">
-        <article class="static doc">
-
-            <div class="container pb-5">
-              {{ .Content }}
-
-              <table class="table">
-                <caption>News by year</caption>
-                <thead>
-                  <tr>
-                    <td>Date</td>
-                    <td>Title</td>
-                    <td>Author</td>
-                    <td>Preview</td>
-                  </tr>
-                </thead>
-                <tbody>
-              {{ range .Pages.GroupByDate "2006" "desc" }}
-                  <tr>
-                    <th colspan="5" scope="row"><strong>{{ .Key }}</strong></th>
-                  </tr>
-                  {{ range .Pages }}
-                  <tr>
-                    <td><a href="{{ .RelPermalink }}">{{ dateFormat "Monday, Jan 2, 2006" .Params.date }}</a></td>
-                    <td>{{ .Params.title }}</td>
-                    <td>{{ .Params.author }}</td>
-                    <td>{{ .Params.preview }}</td>
-                  </tr>
-                  {{ end }}
-              {{ end }}
-                </tbody>
-              </table>
-            </div>
-
-        </article>
-    </main>
-</div>
-
-{{ partial "footer.html" . }}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index d221c2a..f05a514 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -6,7 +6,7 @@
             </figure>
             <dl>
                 <dt>Overview</dt>
-                <dd><a href="/news/">News</a></dd>
+                <dd><a href="/blog/">Blog</a></dd>
                 <dd><a href="/components/latest/">Components</a></dd>
                 <dd><a href="/download/">Download</a></dd>
                 <dd><a href="/docs/getting-started/">Getting started</a></dd>
diff --git a/package.json b/package.json
index 36abf8e..1f5167c 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
   "license": "Apache-2.0",
   "scripts": {
     "build:antora": "antora --require ./menu.js --clean --fetch site.yml",
-    "build:hugo": "hugo --minify",
+    "build:hugo": "hugo",
     "build:minify": "gulp minify",
     "build": "run-s build:*",
     "preview": "run-s preview:*",
diff --git a/static/.htaccess b/static/.htaccess
index 26eba93..be3934a 100644
--- a/static/.htaccess
+++ b/static/.htaccess
@@ -7,6 +7,9 @@ RewriteRule "security-advisories.data/(.+)$" "security/$1" [R=permanent,L]
 # https://httpd.apache.org/docs/current/mod/core.html#errordocument
 ErrorDocument 404 /404.html
 
+# Redirect /news/... to /blog/...
+RewriteRule "^news/(.*)$" "blog/$1" [R=permanent,L]
+
 # Redirect known links from old website. Not mapped links are commented out. Feel free to edit, if you find something missing.
 # Redirect 301 /EclipseMilo
 # Redirect 301 /acknowledgment.html