From aa16a64bf45ba3234dcc3392fcf47d8431695d5a Mon Sep 17 00:00:00 2001
From: allard <allard@allarddcs.nl>
Date: Sat, 29 Mar 2025 15:18:55 +0100
Subject: [PATCH] generic font family fixed

---
 src/main/webapp/css/main.css | 45 ++++++++++++++++++------------------
 src/main/webapp/index.html   |  6 +++--
 2 files changed, 26 insertions(+), 25 deletions(-)

diff --git a/src/main/webapp/css/main.css b/src/main/webapp/css/main.css
index 7f4ea6a..f6ea042 100644
--- a/src/main/webapp/css/main.css
+++ b/src/main/webapp/css/main.css
@@ -11,17 +11,17 @@
 @import url("https://fonts.googleapis.com/css?family=Asap:300,400,500");
 
 @font-face {
-    font-family: BunueloLight;
+    font-family: BunueloLight, sans-serif;
     src: url("/fonts/BunueloCleanPro-Light.woff");
 }
 
 @font-face {
-    font-family: BunueloSemiBold;
+    font-family: BunueloSemiBold, sans-serif;
     src: url("/fonts/BunueloCleanPro-SemiBold.woff");
 }
 
 body{
-    font-family:Asap;
+    font-family:Asap, sans-serif;
     font-size: 16px;
     color:#24243b;
     background-color: white;
@@ -32,7 +32,6 @@ section {
     padding-top: 55px;
     padding-left: 8%;
     padding-right: 8%;
-    /* font-weight: 400; */
     letter-spacing:0;
     text-align:left;
 }
@@ -61,7 +60,7 @@ p {
     margin-top: 0px;
 }
 h1 {
-    font-family:BunueloSemiBold;
+    font-family:BunueloSemiBold, sans-serif;
     font-size: 40px;
     font-weight: 400;
     letter-spacing:0;
@@ -90,7 +89,7 @@ a {
 }
 
 #appTitle {
-    font-family:BunueloLight;
+    font-family:BunueloLight, sans-serif;
     font-size:55px;
 }
 
@@ -107,14 +106,20 @@ a {
 .collapsibleRow {
     transition: border 400ms ease-out, box-shadow 200ms linear;
     cursor: pointer;
+    box-shadow: none;
+    border-bottom: 4px solid;
 }
 .collapsibleRow:hover .headerTitle {
     background-color: #f4f4f4;
     transition: background-color 0.1s;
 }
-.collapsed .collapsibleRow {
+.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#healthSection > .headerRow {
     border-bottom-color: #D6D9E4;
@@ -125,24 +130,18 @@ a {
 .collapsed#metricsSection > .headerRow {
     border-bottom-color: #EEF3C3;
 }
-
-.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 {
+.collapsibleContent { /* collapsing animation */
     opacity: 0;
     max-height: 0;
     visibility: hidden;
+    transition: all 400ms ease-out, opacity 300ms ease-in;
 }
-.expanded .collapsibleContent {
+.expanded { /* expanding animation */
+    transition: all 400ms ease-out, opacity 450ms ease-out;
     opacity: 1;
     max-height: 1000px;
     visibility: visible;
 }
-
 .headerIcon {
     width: 160px;
     height: 100%;
@@ -155,7 +154,7 @@ a {
     margin-top: 20px;
 }
 
-#healthSection .headerIcon {
+#healthSection {
     background-color: #E8EAEF;
 }
 #configSection .headerIcon {
@@ -189,7 +188,7 @@ a {
 }
 
 .headerTitle > h2 {
-    font-family: BunueloLight;
+    font-family: BunueloLight, sans-serif;
     font-size:40px;
     margin: 0;
 }
@@ -226,7 +225,7 @@ button {
     height:44px;
     color:#24253a;
     text-align:center;
-    font-family: Asap;
+    font-family: Asap, sans-serif;
     margin-top: 25px;
     margin-bottom: 70px;
     cursor: pointer;
@@ -297,7 +296,7 @@ section#openLibertyAndMp {
 
 #serviceStatus {
     font-size: 50px;
-    font-family:BunueloLight;
+    font-family:BunueloLight, sans-serif;
     margin-top: 30px;
 }
 
@@ -332,7 +331,7 @@ td {
     background: #D6D9E4;
 }
 #configTable tr:first-child {
-    background: #F8D7C1;;
+    background: #F8D7C1;
 }
 #metricsTable tr:first-child {
     background: #EEF3C3;
@@ -392,7 +391,7 @@ td {
 }
 
 .bodyFooterLink {
-  font-family: Asap;
+  font-family: Asap, sans-serif;
   font-weight: 300;
   font-size: 14px;
   letter-spacing: 0;
diff --git a/src/main/webapp/index.html b/src/main/webapp/index.html
index 42401ab..4c2ff04 100755
--- a/src/main/webapp/index.html
+++ b/src/main/webapp/index.html
@@ -1,5 +1,7 @@
-<html>
+<!DOCTYPE html>
+<html lang="en">
     <head>
+        <title>olproperties</title>
         <script src="js/mpData.js"></script>
         <link href="https://fonts.googleapis.com/css?family=Asap" rel="stylesheet">
         <link rel="stylesheet" href="css/main.css">
@@ -7,7 +9,7 @@
     <body>
         <section id="appIntro">
             <div id="titleSection">
-                <h1 id="appTitle">Java-PitStop Openliberty/Java17 voorbeeld 3.0</h1>
+                <h1 id="appTitle">Java-PitStop Openliberty/Java17 voorbeeld 2.1</h1>
                 <div class="line"></div>
                 <div class="headerImage"></div>
                 <h2>Open Liberty Java17 applicatie op Container Hosting Platform!</h2>