commops/fedora-happiness-packets
15
1
Fork 0
Code Issues 10 Pull requests 3 Releases 1 Packages Activity Actions

🔒 frontend: Self-host fonts, remove all external CDN dependencies

Browse source 
Every page load was leaking visitor IPs to Google (fonts.googleapis.com)
and the Fedora CDN (apps.fedoraproject.org). This is a privacy concern
for a Fedora community application and creates a dependency on external
services that may not be maintained.

Downloaded Montserrat (400, 700) and Open Sans (400, 700) as WOFF2 files
from Google Fonts (both are SIL Open Font License) and serve locally
from `assets/fonts/`. Created `assets/css/fonts.css` with `@font-face`
declarations using `font-display: swap` for optimal loading.

Removed four external CDN references from `base.html`:
- Google Fonts CSS (Montserrat + Open Sans)
- Fedora CDN `fedora-bootstrap-1.1.1/fedora-bootstrap.css`
- Fedora CDN `fedora-bootstrap-fonts/open-sans.css`
- Fedora CDN `fedora-bootstrap-fonts/font-awesome.css`

The Fedora CDN's Font Awesome CSS was already superseded by the local
`assets/css/all.css` (Font Awesome 5.1.0). The `fedora-bootstrap.css`
provided a `navigation-bar` class that has no visible effect — the
containing div already has `bg-fedora-blue` and border utilities from
`bundle.css`.

Also reorganized `<head>` to follow standard ordering: CSS before JS.

Assisted-by: Claude Opus 4.6 (1M context)
Signed-off-by: Justin Wheeler <jwheel@fedoraproject.org>
This commit is contained in:
Justin Wheeler 2026-05-10 18:01:21 +02:00
commit c5715ae692
Signed by: jflory7
GPG key ID: 6BD803B36BF8F62E
6 changed files with 35 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

31
assets/css/fonts.css Normal file
View file

@ -0,0 +1,31 @@
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/montserrat-latin-400.woff2') format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/montserrat-latin-700.woff2') format('woff2');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/open-sans-latin-400.woff2') format('woff2');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/open-sans-latin-700.woff2') format('woff2');
}

BIN
assets/fonts/montserrat-latin-400.woff2 Normal file
View file

Binary file not shown.

BIN
assets/fonts/montserrat-latin-700.woff2 Normal file
View file

Binary file not shown.

BIN
assets/fonts/open-sans-latin-400.woff2 Normal file
View file

Binary file not shown.

BIN
assets/fonts/open-sans-latin-700.woff2 Normal file
View file

Binary file not shown.

11
templates/base.html
View file

@ -4,17 +4,14 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Montserrat|Open+Sans" rel="stylesheet">
<script src="{% static 'bootstrap/js/bootstrap.bundle.min.js' %}" async defer></script>
<link href="{% static 'css/fonts.css' %}" rel="stylesheet">
<link href="{% static 'css/all.css' %}" rel="stylesheet">
<link href="{% static 'css/bundle.css' %}" rel="stylesheet">
<link href="{% static 'css/custom.css' %}" rel="stylesheet">
<link href="{% static 'images/favicon.ico' %}" rel="icon" type="image/x-icon">
<script src="{% static 'bootstrap/js/bootstrap.bundle.min.js' %}" async defer></script>
<script src="{% static 'js/vendor/jquery-3.3.1.min.js' %}"></script>
<script src="{% static 'js/fas_details.js' %}" type="text/javascript"></script>
<link href="{% static 'css/bundle.css' %}" rel="stylesheet"> <!--derived from getfedora.org theme -->
<link href="https://apps.fedoraproject.org/global/fedora-bootstrap-1.1.1/fedora-bootstrap.css" type="text/css" rel="stylesheet" />
<link href="https://apps.fedoraproject.org/global/fedora-bootstrap-fonts/open-sans.css" type="text/css" rel="stylesheet" />
<link href="https://apps.fedoraproject.org/global/fedora-bootstrap-fonts/font-awesome.css" type="text/css" rel="stylesheet" />
<link href="{% static 'css/custom.css' %}" rel="stylesheet">
{% block extra_head %}{% endblock %}
</head>
<body>