1.7

Dockerfile

@@ -1,11 +1,10 @@
 FROM icr.io/appcafe/open-liberty:kernel-slim-java17-openj9-ubi
-#FROM harbor-dev.alldcs.nl/allard/openliberty-java17
 
 ARG VERSION=1.0
 ARG REVISION=SNAPSHOT
 
 LABEL \
-  org.opencontainers.image.authors="Your Name" \
+  org.opencontainers.image.authors="Allard Krings" \
   org.opencontainers.image.vendor="IBM" \
   org.opencontainers.image.url="local" \
   org.opencontainers.image.source="https://github.com/OpenLiberty/guide-getting-started" \

buildah.yaml

@@ -0,0 +1,128 @@
+apiVersion: tekton.dev/v1
+kind: Task
+metadata:
+  name: buildah
+  namespace: default
+spec:
+  description: |-
+    Buildah task builds source into a container image and then pushes it to a container registry.
+    Buildah Task builds source into a container image using Project Atomic's Buildah build tool.It uses Buildah's support for building from Dockerfiles, using its buildah bud command.This command executes the directives in the Dockerfile to assemble a container image, then pushes that image to a container registry.
+  params:
+  - description: Reference of the image buildah will produce.
+    name: IMAGE
+    type: string
+  - default: quay.io/buildah/stable:v1
+    description: The location of the buildah builder image.
+    name: BUILDER_IMAGE
+    type: string
+  - default: overlay
+    description: Set buildah storage driver
+    name: STORAGE_DRIVER
+    type: string
+  - default: ./Dockerfile
+    description: Path to the Dockerfile to build.
+    name: DOCKERFILE
+    type: string
+  - default: .
+    description: Path to the directory to use as context.
+    name: CONTEXT
+    type: string
+  - default: "true"
+    description: Verify the TLS on the registry endpoint (for push/pull to a non-TLS
+      registry)
+    name: TLSVERIFY
+    type: string
+  - default: oci
+    description: The format of the built container, oci or docker
+    name: FORMAT
+    type: string
+  - default: ""
+    description: Extra parameters passed for the build command when building images.
+      WARNING - must be sanitized to avoid command injection
+    name: BUILD_EXTRA_ARGS
+    type: string
+  - default: ""
+    description: Extra parameters passed for the push command when pushing images.
+      WARNING - must be sanitized to avoid command injection
+    name: PUSH_EXTRA_ARGS
+    type: string
+  - default: "false"
+    description: Skip pushing the built image
+    name: SKIP_PUSH
+    type: string
+  - default:
+    - ""
+    description: Dockerfile build arguments, array of key=value
+    name: BUILD_ARGS
+    type: array
+  results:
+  - description: Digest of the image just built.
+    name: IMAGE_DIGEST
+    type: string
+  - description: Image repository where the built image would be pushed to
+    name: IMAGE_URL
+    type: string
+  steps:
+  - args:
+    - $(params.BUILD_ARGS[*])
+    computeResources: {}
+    env:
+    - name: PARAM_IMAGE
+      value: $(params.IMAGE)
+    - name: PARAM_STORAGE_DRIVER
+      value: $(params.STORAGE_DRIVER)
+    - name: PARAM_DOCKERFILE
+      value: $(params.DOCKERFILE)
+    - name: PARAM_CONTEXT
+      value: $(params.CONTEXT)
+    - name: PARAM_TLSVERIFY
+      value: $(params.TLSVERIFY)
+    - name: PARAM_FORMAT
+      value: $(params.FORMAT)
+    - name: PARAM_BUILD_EXTRA_ARGS
+      value: $(params.BUILD_EXTRA_ARGS)
+    - name: PARAM_PUSH_EXTRA_ARGS
+      value: $(params.PUSH_EXTRA_ARGS)
+    - name: PARAM_SKIP_PUSH
+      value: $(params.SKIP_PUSH)
+    image: $(params.BUILDER_IMAGE)
+    name: build-and-push
+    script: |
+      BUILD_ARGS=()
+      for buildarg in "$@"
+      do
+        BUILD_ARGS+=("--build-arg=$buildarg")
+      done
+      [ "$(workspaces.sslcertdir.bound)" = "true" ] && CERT_DIR_FLAG="--cert-dir=$(workspaces.sslcertdir.path)"
+      [ "$(workspaces.dockerconfig.bound)" = "true" ] && DOCKER_CONFIG="$(workspaces.dockerconfig.path)" && export DOCKER_CONFIG
+      # build the image (CERT_DIR_FLAG should be omitted if empty and BUILD_EXTRA_ARGS can contain multiple args)
+      # shellcheck disable=SC2046,SC2086
+      buildah ${CERT_DIR_FLAG} "--storage-driver=${PARAM_STORAGE_DRIVER}" bud "${BUILD_ARGS[@]}" ${PARAM_BUILD_EXTRA_ARGS} \
+        "--format=${PARAM_FORMAT}" "--tls-verify=${PARAM_TLSVERIFY}" \
+        -f "${PARAM_DOCKERFILE}" -t "${PARAM_IMAGE}" "${PARAM_CONTEXT}"
+      [ "${PARAM_SKIP_PUSH}" = "true" ] && echo "Push skipped" && exit 0
+      # push the image (CERT_DIR_FLAG should be omitted if empty and PUSH_EXTRA_ARGS can contain multiple args)
+      # shellcheck disable=SC2046,SC2086
+      buildah ${CERT_DIR_FLAG} "--storage-driver=${PARAM_STORAGE_DRIVER}" push \
+        "--tls-verify=${PARAM_TLSVERIFY}" --digestfile /tmp/image-digest ${PARAM_PUSH_EXTRA_ARGS} \
+        "${PARAM_IMAGE}" "docker://${PARAM_IMAGE}"
+      tee "$(results.IMAGE_DIGEST.path)" < /tmp/image-digest
+      printf '%s' "${PARAM_IMAGE}" | tee "$(results.IMAGE_URL.path)"
+    securityContext:
+      privileged: true
+    volumeMounts:
+    - mountPath: /var/lib/containers
+      name: varlibcontainers
+    workingDir: $(workspaces.source.path)
+  volumes:
+  - emptyDir: {}
+    name: varlibcontainers
+  workspaces:
+  - name: source
+  - name: sslcertdir
+    optional: true
+  - description: An optional workspace that allows providing a .docker/config.json
+      file for Buildah to access the container registry. The file should be placed
+      at the root of the Workspace with name config.json.
+    name: dockerconfig
+    optional: true

src/main/webapp/css/main.css

@@ -1,5 +1,5 @@
 /*******************************************************************************
-* Copyright (c) 2018 IBM Corporation and others.
+* Copyright (c) 2018, 2024 IBM Corporation and others.
 * All rights reserved. This program and the accompanying materials
 * are made available under the terms of the Eclipse Public License v1.0
 * which accompanies this distribution, and is available at
@@ -8,381 +8,380 @@
 * Contributors:
 *     IBM Corporation - initial API and implementation
 *******************************************************************************/
-@import url("https://fonts.googleapis.com/css?family=Asap:300,400,500");
-
 @font-face {
-    font-family: BunueloLight, sans-serif;
-    src: url("/fonts/BunueloCleanPro-Light.woff");
+  font-family: BunueloLight;
+  src: url("/fonts/BunueloCleanPro-Light.otf");
 }
 
 @font-face {
-    font-family: BunueloSemiBold, sans-serif;
-    src: url("/fonts/BunueloCleanPro-SemiBold.woff");
+  font-family: BunueloSemiBold;
+  src: url("/fonts/BunueloCleanPro-SemiBold.otf");
 }
 
-body{
-    font-family:Asap, sans-serif;
-    font-size: 16px;
-    color:#24243b;
-    background-color: white;
-    margin: 0px;
+body {
+  font-family: BunueloSemiBold;
+  font-size: 16px;
+  color: #24243b;
+  background-color: white;
+  margin: 0px;
 }
 
 section {
-    padding-top: 55px;
-    padding-left: 8%;
-    padding-right: 8%;
-    letter-spacing:0;
-    text-align:left;
+  padding-top: 55px;
+  padding-left: 8%;
+  padding-right: 8%;
+  /* font-weight: 400; */
+  letter-spacing: 0;
+  text-align: left;
 }
 
 .line {
-    margin-right: 200px;
-    height: 1px;
-    background-color: #C8D3D3;
+  margin-right: 200px;
+  height: 1px;
+  background-color: #C8D3D3;
 }
 
 .headerImage {
-    background-image: url(/img/header_ufo.png);
-    background-repeat: no-repeat;
-    background-position: top 20px right 15px;
-    height: 103px;
-    margin-top: -94px;
+  background-image: url("/img/header_ufo.png");
+  background-repeat: no-repeat;
+  background-position: top 20px right 15px;
+  height: 103px;
+  margin-top: -94px;
 }
 
 #whereTo {
-    padding-bottom: 80px;
-    width: 50%;
+  padding-bottom: 80px;
+  width: 50%;
 }
 
 p {
-    line-height: 22px;
-    margin-top: 0px;
+  line-height: 22px;
+  margin-top: 0px;
 }
 h1 {
-    font-family:BunueloSemiBold, sans-serif;
-    font-size: 40px;
-    font-weight: 400;
-    letter-spacing:0;
-    text-align:left;
+  font-family: BunueloSemiBold;
+  font-size: 40px;
+  font-weight: 400;
+  letter-spacing: 0;
+  text-align: left;
 }
 h2 {
-    font-size: 24px;
-    font-weight: 400;
+  font-size: 24px;
+  font-weight: 400;
 }
 h4 {
-    margin-top: 52px;
+  margin-top: 52px;
 }
 a {
-    text-decoration: none;
+  text-decoration: none;
 }
 
 #appIntro {
-    background-image:linear-gradient(#141427 0%, #2c2e50 100%);
-    background-size: 100% calc(100% - 70px);
-    background-repeat: no-repeat;
+  background-image: linear-gradient(#141427 0%, #2c2e50 100%);
+  background-size: 100% calc(100% - 70px);
+  background-repeat: no-repeat;
 }
 
 #titleSection {
-    color: white;
-    margin-bottom: 80px;
+  color: white;
+  margin-bottom: 80px;
 }
 
 #appTitle {
-    font-family:BunueloLight, sans-serif;
-    font-size:55px;
+  font-family: BunueloLight;
+  font-size: 55px;
 }
 
 .headerRow {
-    height: 100px;
-    position:relative;
-    z-index:2;
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.50);
+  height: 100px;
+  position: relative;
+  z-index: 2;
+  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.50);
 }
 .headerRow > div {
-    display: inline-block;
+  display: inline-block;
 }
 
 .collapsibleRow {
-    transition: border 400ms ease-out, box-shadow 200ms linear;
-    cursor: pointer;
-    box-shadow: none;
-    border-bottom: 4px solid;
+  transition: border 400ms ease-out, box-shadow 200ms linear;
+  cursor: pointer;
 }
 .collapsibleRow:hover .headerTitle {
-    background-color: #f4f4f4;
-    transition: background-color 0.1s;
+  background-color: #f4f4f4;
+  transition: background-color 0.1s;
 }
-.collapsed {
-    box-shadow: none;
-    border-bottom: 4px solid;
-    transition: all 400ms ease-out, opacity 300ms ease-in;
-    opacity: 0;
-    max-height: 0;
-    visibility: hidden;
+.collapsed .collapsibleRow {
+  box-shadow: none;
+  border-bottom: 4px solid;
 }
 .collapsed#healthSection > .headerRow {
-    border-bottom-color: #D6D9E4;
+  border-bottom-color: #D6D9E4;
 }
 .collapsed#configSection > .headerRow {
-    border-bottom-color: #F8D7C1;
+  border-bottom-color: #F8D7C1;
 }
 .collapsed#metricsSection > .headerRow {
-    border-bottom-color: #EEF3C3;
-}
-.collapsibleContent { /* collapsing animation */
-    opacity: 0;
-    max-height: 0;
-    visibility: hidden;
-    transition: all 400ms ease-out, opacity 300ms ease-in;
-}
-.expanded { /* expanding animation */
-    transition: all 400ms ease-out, opacity 450ms ease-out;
-    opacity: 1;
-    max-height: 1000px;
-    visibility: visible;
-}
-.headerIcon {
-    width: 160px;
-    height: 100%;
-    float: left;
-    background-color: #E8EAEF;
-}
-.headerIcon img {
-    display:block;
-    margin:auto;
-    margin-top: 20px;
+  border-bottom-color: #EEF3C3;
 }
 
-#healthSection {
-    background-color: #E8EAEF;
+.collapsed .collapsibleContent { /* collapsing animation */
+  transition: all 400ms ease-out, opacity 300ms ease-in;
+}
+.expanded .collapsibleContent { /* expanding animation */
+  transition: all 400ms ease-out, opacity 450ms ease-out;
+}
+.collapsed .collapsibleContent {
+  opacity: 0;
+  max-height: 0;
+  visibility: hidden;
+}
+.expanded .collapsibleContent {
+  opacity: 1;
+  max-height: 1000px;
+  visibility: visible;
+}
+
+.headerIcon {
+  width: 160px;
+  height: 100%;
+  float: left;
+  background-color: #E8EAEF;
+}
+.headerIcon img {
+  display: Block;
+  margin:auto;
+  margin-top: 20px;
+}
+
+#healthSection .headerIcon {
+  background-color: #E8EAEF;
 }
 #configSection .headerIcon {
-    background-color: #FDE4D1;
+  background-color: #FDE4D1;
 }
 #metricsSection .headerIcon {
-    background-color: #F5F8DA;
+  background-color: #F5F8DA;
 }
 
 .headerTitle {
-    background-color: white;
-    color:#5d6a8e;
-    letter-spacing:0;
-    text-align:left;
-    padding-left: 40px;
-    padding-top: 10px;
-    width: calc(100% - 200px); /* 160 from icon, 40 from padding */
+  background-color: white;
+  color: #5d6a8e;
+  letter-spacing:0;
+  text-align:left;
+  padding-left: 40px;
+  padding-top: 10px;
+  width: calc(100% - 200px); /* 160 from icon, 40 from padding */
 }
 #healthSection h2 {
-    color: #5D6A8E;
+  color: #5D6A8E;
 }
 #configSection h2 {
-    color: #E57000;
+  color: #E57000;
 }
 #metricsSection h2 {
-    color: #4F6700;
+  color: #4F6700;
 }
 
 #sysPropTitle {
-    padding-top: 28px;
+  padding-top: 28px;
 }
 
 .headerTitle > h2 {
-    font-family: BunueloLight, sans-serif;
-    font-size:40px;
-    margin: 0;
+  font-family: BunueloLight;
+  font-size: 40px;
+  margin: 0;
 }
 
 .caret {
-    position: absolute;
-    right: 45px;
-    top: 45px;
+  position: absolute;
+  right: 45px;
+  top: 45px;
 }
 
 .collapsed#configSection .caret {
-    background-image: url("../img/carets/caret_down_orange.svg")
+  background-image: url("../img/carets/caret_down_orange.svg")
 }
 .expanded#configSection .caret {
-    background-image: url("../img/carets/caret_up_orange.svg")
+  background-image: url("../img/carets/caret_up_orange.svg")
 }
 
 .msSection {
-    background: white;
-    box-shadow: 0 2px 4px 0 rgba(63,70,89,0.31);
+  background: white;
+  box-shadow: 0 2px 4px 0 rgba(63,70,89,0.31);
 }
 
 .sectionContent {
-    margin-left: 160px;
+  margin-left: 160px;
 }
 
 #systemPropertiesTable {
-    padding-left: 160px;
-    background: white;
+  padding-left: 160px;
+  background: white;
 }
 
 button {
-    border-radius:100px;
-    height:44px;
-    color:#24253a;
-    text-align:center;
-    font-family: Asap, sans-serif;
-    margin-top: 25px;
-    margin-bottom: 70px;
-    cursor: pointer;
-    border: none;
+  border-radius: 100px;
+  height: 44px;
+  color: #24253a;
+  text-align: center;
+  font-family: BunueloSemiBold;
+  margin-top: 25px;
+  margin-bottom: 70px;
+  cursor: pointer;
+  border: none;
 }
 
 button a {
-    text-decoration: none;
-    color:#F4914D;
+  text-decoration: none;
+  color: #F4914D;
 }
 
 #guidesButton {
-    background-color:#abd155;
-    width:269px;
-    font-weight: 500;
-    font-size:16px;
-    transition: background-color .2s;
+  background-color: #abd155;
+  width: 269px;
+  font-weight: 500;
+  font-size: 16px;
+  transition: background-color .2s;
 }
 #guidesButton:hover {
-    background-color: #C7EE63;
+  background-color: #C7EE63;
 }
 #mpGuidesButton {
-    border:2px solid #f4914d8c;
-    border-radius:100px;
-    font-size:20px;
-    letter-spacing:0;
-    padding-left: 40px;
-    padding-right: 40px;
-    background-color: white;
-    transition: background-color .2s, color .2s;
+  border: 2px solid #f4914d8c;
+  border-radius: 100px;
+  font-size: 20px;
+  letter-spacing: 0;
+  padding-left: 40px;
+  padding-right: 40px;
+  background-color: white;
+  transition: background-color .2s, color .2s;
 }
 #mpGuidesButton:hover {
-    background-color: #f4914d;
-    color: white;
+  background-color: #f4914d;
+  color: white;
 }
 
 section#openLibertyAndMp {
-    background:#f4f4f5;
-    background-size: 100% calc(100% - 70px);
-    background-repeat: no-repeat;
+  background: #f4f4f5;
+  background-size: 100% calc(100% - 70px);
+  background-repeat: no-repeat;
 }
 
 #healthBox {
-    text-align: left;
-    display: table-cell;
-    vertical-align: middle;
-    width: 47%;
+  text-align: left;
+  display: table-cell;
+  vertical-align: middle;
+  width: 47%;
 }
 
 #healthBox > div {
-    display: table-cell;
-    vertical-align: middle;
+  display: table-cell;
+  vertical-align: middle;
 }
 
 #healthIcon {
-    padding-left: 73px;
-    padding-top: 56px;
-    padding-bottom: 56px;
+  padding-left: 73px;
+  padding-top: 56px;
+  padding-bottom: 56px;
 }
 #healthStatusIcon {
-    width: 104px;
-    height: 104px;
+  width: 104px;
+  height: 104px;
 }
 
 #healthText {
-    padding: 50px;
+  padding: 50px;
 }
 
 #serviceStatus {
-    font-size: 50px;
-    font-family:BunueloLight, sans-serif;
-    margin-top: 30px;
+  font-size: 50px;
+  font-family: BunueloLight;
+  margin-top: 30px;
 }
 
 #healthNote {
-    text-align: left;
-    display: table-cell;
-    vertical-align: middle;
-    padding-left: 43px;
-    line-height: 26px;
-    width: 53%;
+  text-align: left;
+  display: table-cell;
+  vertical-align: middle;
+  padding-left: 43px;
+  line-height: 26px;
+  width: 53%;
 }
 
 table {
-    width: 100%;
-    font-size: 14px;
-    text-align: left;
-    border-collapse: collapse;
+  width: 100%;
+  font-size: 14px;
+  text-align: left;
+  border-collapse: collapse;
 }
 
 th {
-    height: 63px;
-    padding-left: 41px;
-    font-size: 16px;
+  height: 63px;
+  padding-left: 41px;
+  font-size: 16px;
 }
 tr {
-    height: 45px;
+  height: 45px;
 }
 td {
-    padding-left: 41px;
+  padding-left: 41px;
 }
 #systemPropertiesTable tr:first-child {
-    background: #D6D9E4;
+  background: #D6D9E4;
 }
 #configTable tr:first-child {
-    background: #F8D7C1;
+  background: #F8D7C1;;
 }
 #metricsTable tr:first-child {
-    background: #EEF3C3;
+  background: #EEF3C3;
 }
 
 #systemPropertiesTable tr:nth-child(2n+3) {
-    background: #EEEFF3;
+  background: #EEEFF3;
 }
 #configTable tr:nth-child(2n+2) {
-    background: #FEF8F4;
+  background: #FEF8F4;
 }
 #metricsTable tr:nth-child(2n+2) {
-    background: #FBFCEE;
+  background: #FBFCEE;
 }
 
 #systemPropertiesTable .sourceRow,
 #healthTable .sourceRow {
-    border-top: 4px solid #D6D9E4;
+  border-top: 4px solid #D6D9E4;
 }
 #systemPropertiesTable .sourceRow a,
 #healthTable .sourceRow a {
-    color: #5D6A8E;
+  color: #5D6A8E;
 }
 #configTable .sourceRow {
-    border-top: 4px solid #F8D7C1;
+  border-top: 4px solid #F8D7C1;
 }
 #configTable .sourceRow a {
-    color: #E57000;
+  color: #E57000;
 }
 #metricsTable .sourceRow {
-    border-top: 4px solid #EEF3C3;
+  border-top: 4px solid #EEF3C3;
 }
 #metricsTable .sourceRow a {
-    color: #4F6700;
+  color: #4F6700;
 }
 .sourceRow a {
-    font-weight: 500;
+  font-weight: 500;
 }
 
 #learnMore {
-    margin-top: 120px;
-    padding: 0px 200px 100px;
+  margin-top: 120px;
+  padding: 0px 200px 100px;
 }
 
 #learnMore > h2 {
-    color:#5e6b8d;
+  color: #5e6b8d;
 }
 
 .bodyFooter {
   padding: 5px 8%;
-  background-image: url(/img/footer_main.png);
+  background-image: url("/img/footer_main.png");
   background-repeat: no-repeat;
   background-position: top 20px right 110px;
   margin-bottom: 40px;
@@ -391,7 +390,7 @@ td {
 }
 
 .bodyFooterLink {
-  font-family: Asap, sans-serif;
+  font-family: BunueloSemiBold;
   font-weight: 300;
   font-size: 14px;
   letter-spacing: 0;
@@ -404,9 +403,9 @@ td {
 }
 
 .bodyFooterLink > a {
-    text-decoration: none;
-    padding: 10px;
-    color: #96bc32;
+  text-decoration: none;
+  padding: 10px;
+  color: #96bc32;
 }
 
 #licenseLink {
@@ -415,9 +414,9 @@ td {
 }
 
 #footer_text {
-    margin-top: 4px;
-    margin-bottom: 4px;
-    font-size: 16px;
+  margin-top: 4px;
+  margin-bottom: 4px;
+  font-size: 16px;
 }
 
 #footer_copyright {

src/main/webapp/index.html

@@ -9,7 +9,7 @@
     <body>
         <section id="appIntro">
             <div id="titleSection">
-                <h1 id="appTitle">Java-PitStop Openliberty/Java17 voorbeeld 2.1</h1>
+                <h1 id="appTitle">Java-PitStop Openliberty/Java17 voorbeeld 1.7</h1>
                 <div class="line"></div>
                 <div class="headerImage"></div>
                 <h2>Open Liberty Java17 applicatie op Container Hosting Platform!</h2>

test.txt

@@ -1 +1 @@
-20250327-4
+20250408-0923