particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

cockpit: fix fonts

Browse source 
The fonts weren't getting loaded properly and cockpit was falling back
to `Helvetica`. This was particularly noticeable on the `ReviewStep` of
the `CreateImageWizard`.
This commit is contained in:
Gianluca Zuccarelli 2025-06-05 17:06:08 +00:00 • committed by Simon Steinbeiß
parent e7bf1d3540
commit 84bc0f92a0
2 changed files with 61 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

10
cockpit/webpack.config.ts
View file

@ -75,7 +75,15 @@ module.exports = {
},
{
test: /\.scss$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
use: [
MiniCssExtractPlugin.loader,
{
loader: 'css-loader',
options: { url: false },
},
'sass-loader',
],
},
],
},

52
src/AppCockpit.scss
View file

@ -1,3 +1,55 @@
@font-face {
font-family: 'Red Hat Text';
font-style: normal;
font-weight: 400 500;
src: url('/cockpit/static/fonts/RedHatText/RedHatTextVF.woff2')
format('woff2-variations');
font-display: fallback;
}
@font-face {
font-family: 'Red Hat Text';
font-style: italic;
font-weight: 400 500;
src: url('/cockpit/static/fonts/RedHatText/RedHatTextVF-Italic.woff2')
format('woff2-variations');
font-display: fallback;
}
@font-face {
font-family: 'Red Hat Display';
font-style: normal;
font-weight: 400 700;
src: url('/cockpit/static/fonts/RedHatDisplay/RedHatDisplayVF.woff2')
format('woff2-variations');
font-display: fallback;
}
@font-face {
font-family: 'Red Hat Display';
font-style: italic;
font-weight: 400 700;
src: url('/cockpit/static/fonts/RedHatDisplay/RedHatDisplayVF-Italic.woff2')
format('woff2-variations');
font-display: fallback;
}
@font-face {
font-family: RedHatText;
font-style: normal;
font-weight: 400;
src: url('/cockpit/static/fonts/RedHatText-Regular.woff2') format('woff2');
font-display: fallback;
}
@font-face {
font-family: RedHatText;
font-style: normal;
font-weight: 700;
src: url('/cockpit/static/fonts/RedHatText-Medium.woff2') format('woff2');
font-display: fallback;
}
// Override as PF Page doesn't allow empty masthead and sidebar
@media (min-width: 75rem) {
.pf-v6-c-page.no-masthead-sidebar {