allard/olproperties
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

generic font family fixed

Browse Source
This commit is contained in:
allard
2025-03-29 15:18:55 +01:00
parent 689c2aace3
commit aa16a64bf4
2 changed files with 26 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/main/webapp/css/main.css
View File

@@ -11,17 +11,17 @@
@import url("https://fonts.googleapis.com/css?family=Asap:300,400,500"); @import url("https://fonts.googleapis.com/css?family=Asap:300,400,500");
@font-face { @font-face {
font-family: BunueloLight; font-family: BunueloLight, sans-serif;
src: url("/fonts/BunueloCleanPro-Light.woff"); src: url("/fonts/BunueloCleanPro-Light.woff");
} }
@font-face { @font-face {
font-family: BunueloSemiBold; font-family: BunueloSemiBold, sans-serif;
src: url("/fonts/BunueloCleanPro-SemiBold.woff"); src: url("/fonts/BunueloCleanPro-SemiBold.woff");
} }
body{ body{
font-family:Asap; font-family:Asap, sans-serif;
font-size: 16px; font-size: 16px;
color:#24243b; color:#24243b;
background-color: white; background-color: white;
@@ -32,7 +32,6 @@ section {
padding-top: 55px; padding-top: 55px;
padding-left: 8%; padding-left: 8%;
padding-right: 8%; padding-right: 8%;
/* font-weight: 400; */
letter-spacing:0; letter-spacing:0;
text-align:left; text-align:left;
} }
@@ -61,7 +60,7 @@ p {
margin-top: 0px; margin-top: 0px;
} }
h1 { h1 {
font-family:BunueloSemiBold; font-family:BunueloSemiBold, sans-serif;
font-size: 40px; font-size: 40px;
font-weight: 400; font-weight: 400;
letter-spacing:0; letter-spacing:0;
@@ -90,7 +89,7 @@ a {
} }
#appTitle { #appTitle {
font-family:BunueloLight; font-family:BunueloLight, sans-serif;
font-size:55px; font-size:55px;
} }
@@ -107,14 +106,20 @@ a {
.collapsibleRow { .collapsibleRow {
transition: border 400ms ease-out, box-shadow 200ms linear; transition: border 400ms ease-out, box-shadow 200ms linear;
cursor: pointer; cursor: pointer;
box-shadow: none;
border-bottom: 4px solid;
} }
.collapsibleRow:hover .headerTitle { .collapsibleRow:hover .headerTitle {
background-color: #f4f4f4; background-color: #f4f4f4;
transition: background-color 0.1s; transition: background-color 0.1s;
} }
.collapsed .collapsibleRow { .collapsed {
box-shadow: none; box-shadow: none;
border-bottom: 4px solid; border-bottom: 4px solid;
transition: all 400ms ease-out, opacity 300ms ease-in;
opacity: 0;
max-height: 0;
visibility: hidden;
} }
.collapsed#healthSection > .headerRow { .collapsed#healthSection > .headerRow {
border-bottom-color: #D6D9E4; border-bottom-color: #D6D9E4;
@@ -125,24 +130,18 @@ a {
.collapsed#metricsSection > .headerRow { .collapsed#metricsSection > .headerRow {
border-bottom-color: #EEF3C3; border-bottom-color: #EEF3C3;
} }
.collapsibleContent { /* collapsing animation */
.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; opacity: 0;
max-height: 0; max-height: 0;
visibility: hidden; 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; opacity: 1;
max-height: 1000px; max-height: 1000px;
visibility: visible; visibility: visible;
} }
.headerIcon { .headerIcon {
width: 160px; width: 160px;
height: 100%; height: 100%;
@@ -155,7 +154,7 @@ a {
margin-top: 20px; margin-top: 20px;
} }
#healthSection .headerIcon { #healthSection {
background-color: #E8EAEF; background-color: #E8EAEF;
} }
#configSection .headerIcon { #configSection .headerIcon {
@@ -189,7 +188,7 @@ a {
} }
.headerTitle > h2 { .headerTitle > h2 {
font-family: BunueloLight; font-family: BunueloLight, sans-serif;
font-size:40px; font-size:40px;
margin: 0; margin: 0;
} }
@@ -226,7 +225,7 @@ button {
height:44px; height:44px;
color:#24253a; color:#24253a;
text-align:center; text-align:center;
font-family: Asap; font-family: Asap, sans-serif;
margin-top: 25px; margin-top: 25px;
margin-bottom: 70px; margin-bottom: 70px;
cursor: pointer; cursor: pointer;
@@ -297,7 +296,7 @@ section#openLibertyAndMp {
#serviceStatus { #serviceStatus {
font-size: 50px; font-size: 50px;
font-family:BunueloLight; font-family:BunueloLight, sans-serif;
margin-top: 30px; margin-top: 30px;
} }
@@ -332,7 +331,7 @@ td {
background: #D6D9E4; background: #D6D9E4;
} }
#configTable tr:first-child { #configTable tr:first-child {
background: #F8D7C1;; background: #F8D7C1;
} }
#metricsTable tr:first-child { #metricsTable tr:first-child {
background: #EEF3C3; background: #EEF3C3;
@@ -392,7 +391,7 @@ td {
} }
.bodyFooterLink { .bodyFooterLink {
font-family: Asap; font-family: Asap, sans-serif;
font-weight: 300; font-weight: 300;
font-size: 14px; font-size: 14px;
letter-spacing: 0; letter-spacing: 0;

6
src/main/webapp/index.html
View File

@@ -1,5 +1,7 @@
<html> <!DOCTYPE html>
<html lang="en">
<head> <head>
<title>olproperties</title>
<script src="js/mpData.js"></script> <script src="js/mpData.js"></script>
<link href="https://fonts.googleapis.com/css?family=Asap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Asap" rel="stylesheet">
<link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/main.css">
@@ -7,7 +9,7 @@
<body> <body>
<section id="appIntro"> <section id="appIntro">
<div id="titleSection"> <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="line"></div>
<div class="headerImage"></div> <div class="headerImage"></div>
<h2>Open Liberty Java17 applicatie op Container Hosting Platform!</h2> <h2>Open Liberty Java17 applicatie op Container Hosting Platform!</h2>