[pve-devel] [PATCH manager 2/3] ui: add 'font-logos' stylesheet and font files

[Christoph Heiss <c.heiss@proxmox.com>]

From [0]. As they are licensed under the "Unlicence" license, including
them here and re-distributing them should bear no problems [1].

[0] https://github.com/Lukas-W/font-logos
[1] https://choosealicense.com/licenses/unlicense/

Signed-off-by: Christoph Heiss <c.heiss@proxmox.com>
---
Formatted the patch with `--no-binary` for now to ease reviewing, as it
otherwise would be pretty big for the mailing list, due to the binary
files. For testing, either download the latest release [2] and copy
`assets/font-logs.{ttf,woff,woff2}` from the extraced folder to
`www/css/fonts/`, or drop me a line and I can send the full patch
off-list.

There's also the possibility to build a customized version of the font
from source, to reduce it down to just the logos needed for the ten
distributions currently supported/recogized. The file sizes are reduced
to about 10-20% of their original files, so might be worth to do that -
for example, the .woff goes from 73kB to 9.2kB.

It's fairly easy, basically just throwing out all unneeded entries in
the `icons.tsv` file in the repo. If that would be preferred, I happily
do that; adding some instructions too on how to replicate/rebuild the
font as needed.

[2] https://github.com/lukas-w/font-logos/releases/download/v1.0.1/font-logos-1.0.1.zip

 www/css/Makefile               |   3 +-
 www/css/font-logos.css         | 224 +++++++++++++++++++++++++++++++++
 www/css/fonts/Makefile         |  14 +++
 www/css/fonts/README.md        |   5 +
 www/css/fonts/font-logos.ttf   | Bin 0 -> 29116 bytes
 www/css/fonts/font-logos.woff  | Bin 0 -> 74576 bytes
 www/css/fonts/font-logos.woff2 | Bin 0 -> 15724 bytes
 www/index.html.tpl             |   1 +
 8 files changed, 246 insertions(+), 1 deletion(-)
 create mode 100644 www/css/font-logos.css
 create mode 100644 www/css/fonts/Makefile
 create mode 100644 www/css/fonts/README.md
 create mode 100644 www/css/fonts/font-logos.ttf
 create mode 100644 www/css/fonts/font-logos.woff
 create mode 100644 www/css/fonts/font-logos.woff2

diff --git a/www/css/Makefile b/www/css/Makefile
index 3960292c..7d7e9d77 100644
--- a/www/css/Makefile
+++ b/www/css/Makefile
@@ -3,7 +3,8 @@ include ../../defines.mk
 all:

 .PHONY: install
-install: ext6-pve.css
+install: ext6-pve.css font-logos.css
+	${MAKE} -C fonts $@
 	install -d ${WWWCSSDIR}
 	install -m 0644 $? ${WWWCSSDIR}

diff --git a/www/css/font-logos.css b/www/css/font-logos.css
new file mode 100644
index 00000000..f5d45e49
--- /dev/null
+++ b/www/css/font-logos.css
@@ -0,0 +1,224 @@
+
+@font-face {
+  font-display: auto;
+  font-family: "font-logos";
+  font-style: normal;
+  font-weight: normal;
+  src: url("fonts/font-logos.woff?v=1.0.1") format("woff"),
+    url("fonts/font-logos.woff2?v=1.0.1") format("woff2"),
+    url("fonts/font-logos.ttf?v=1.0.1") format("truetype")
+}
+
+.fl-alpine::before,
+.fl-aosc::before,
+.fl-apple::before,
+.fl-archlinux::before,
+.fl-centos::before,
+.fl-coreos::before,
+.fl-debian::before,
+.fl-devuan::before,
+.fl-docker::before,
+.fl-elementary::before,
+.fl-fedora::before,
+.fl-fedora-inverse::before,
+.fl-freebsd::before,
+.fl-gentoo::before,
+.fl-linuxmint::before,
+.fl-linuxmint-inverse::before,
+.fl-mageia::before,
+.fl-mandriva::before,
+.fl-manjaro::before,
+.fl-nixos::before,
+.fl-opensuse::before,
+.fl-raspberry-pi::before,
+.fl-redhat::before,
+.fl-sabayon::before,
+.fl-slackware::before,
+.fl-slackware-inverse::before,
+.fl-tux::before,
+.fl-ubuntu::before,
+.fl-ubuntu-inverse::before,
+.fl-almalinux::before,
+.fl-archlabs::before,
+.fl-artix::before,
+.fl-budgie::before,
+.fl-deepin::before,
+.fl-endeavour::before,
+.fl-ferris::before,
+.fl-flathub::before,
+.fl-gnu-guix::before,
+.fl-illumos::before,
+.fl-kali-linux::before,
+.fl-openbsd::before,
+.fl-parrot::before,
+.fl-pop-os::before,
+.fl-rocky-linux::before,
+.fl-snappy::before,
+.fl-solus::before,
+.fl-void::before,
+.fl-zorin::before
+ {
+  display: inline-block;
+  font-family: "font-logos";
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-rendering: auto;
+  line-height: 1;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  font-smoothing: antialiased;
+}
+
+.fl-fw {
+  text-align: center;
+  width: 1em;
+}
+.fl-alpine::before {
+  content: "\f300";
+}
+.fl-aosc::before {
+  content: "\f301";
+}
+.fl-apple::before {
+  content: "\f302";
+}
+.fl-archlinux::before {
+  content: "\f303";
+}
+.fl-centos::before {
+  content: "\f304";
+}
+.fl-coreos::before {
+  content: "\f305";
+}
+.fl-debian::before {
+  content: "\f306";
+}
+.fl-devuan::before {
+  content: "\f307";
+}
+.fl-docker::before {
+  content: "\f308";
+}
+.fl-elementary::before {
+  content: "\f309";
+}
+.fl-fedora::before {
+  content: "\f30a";
+}
+.fl-fedora-inverse::before {
+  content: "\f30b";
+}
+.fl-freebsd::before {
+  content: "\f30c";
+}
+.fl-gentoo::before {
+  content: "\f30d";
+}
+.fl-linuxmint::before {
+  content: "\f30e";
+}
+.fl-linuxmint-inverse::before {
+  content: "\f30f";
+}
+.fl-mageia::before {
+  content: "\f310";
+}
+.fl-mandriva::before {
+  content: "\f311";
+}
+.fl-manjaro::before {
+  content: "\f312";
+}
+.fl-nixos::before {
+  content: "\f313";
+}
+.fl-opensuse::before {
+  content: "\f314";
+}
+.fl-raspberry-pi::before {
+  content: "\f315";
+}
+.fl-redhat::before {
+  content: "\f316";
+}
+.fl-sabayon::before {
+  content: "\f317";
+}
+.fl-slackware::before {
+  content: "\f318";
+}
+.fl-slackware-inverse::before {
+  content: "\f319";
+}
+.fl-tux::before {
+  content: "\f31a";
+}
+.fl-ubuntu::before {
+  content: "\f31b";
+}
+.fl-ubuntu-inverse::before {
+  content: "\f31c";
+}
+.fl-almalinux::before {
+  content: "\f31d";
+}
+.fl-archlabs::before {
+  content: "\f31e";
+}
+.fl-artix::before {
+  content: "\f31f";
+}
+.fl-budgie::before {
+  content: "\f320";
+}
+.fl-deepin::before {
+  content: "\f321";
+}
+.fl-endeavour::before {
+  content: "\f322";
+}
+.fl-ferris::before {
+  content: "\f323";
+}
+.fl-flathub::before {
+  content: "\f324";
+}
+.fl-gnu-guix::before {
+  content: "\f325";
+}
+.fl-illumos::before {
+  content: "\f326";
+}
+.fl-kali-linux::before {
+  content: "\f327";
+}
+.fl-fw.fl-kali-linux::before {
+  font-size: 0.7496339677891655em;
+  line-height: 1.333984375em;
+}
+.fl-openbsd::before {
+  content: "\f328";
+}
+.fl-parrot::before {
+  content: "\f329";
+}
+.fl-pop-os::before {
+  content: "\f32a";
+}
+.fl-rocky-linux::before {
+  content: "\f32b";
+}
+.fl-snappy::before {
+  content: "\f32c";
+}
+.fl-solus::before {
+  content: "\f32d";
+}
+.fl-void::before {
+  content: "\f32e";
+}
+.fl-zorin::before {
+  content: "\f32f";
+}
diff --git a/www/css/fonts/Makefile b/www/css/fonts/Makefile
new file mode 100644
index 00000000..24894aae
--- /dev/null
+++ b/www/css/fonts/Makefile
@@ -0,0 +1,14 @@
+include ../../../defines.mk
+
+FONT_LOGOS_FONTS := font-logos.ttf font-logos.woff font-logos.woff2
+
+all:
+
+.PHONY: install
+install: README.md ${FONT_LOGOS_FONTS}
+	install -d ${WWWFONTSDIR}
+	install -m 0644 $? ${WWWFONTSDIR}
+
+.PHONY: clean
+clean:
+	rm -rf *~
diff --git a/www/css/fonts/README.md b/www/css/fonts/README.md
new file mode 100644
index 00000000..e339f415
--- /dev/null
+++ b/www/css/fonts/README.md
@@ -0,0 +1,5 @@
+# font-logos
+
+https://github.com/lukas-w/font-logos, release v1.0.1
+
+The artwork is licensed under the ["Unlicense" license](https://github.com/lukas-w/font-logos/blob/master/LICENSE)
diff --git a/www/css/fonts/font-logos.ttf b/www/css/fonts/font-logos.ttf
new file mode 100644
index 00000000..e8cea1c3
Binary files /dev/null and b/www/css/fonts/font-logos.ttf differ
diff --git a/www/css/fonts/font-logos.woff b/www/css/fonts/font-logos.woff
new file mode 100644
index 00000000..448da3a9
Binary files /dev/null and b/www/css/fonts/font-logos.woff differ
diff --git a/www/css/fonts/font-logos.woff2 b/www/css/fonts/font-logos.woff2
new file mode 100644
index 00000000..f031c2a6
Binary files /dev/null and b/www/css/fonts/font-logos.woff2 differ
diff --git a/www/index.html.tpl b/www/index.html.tpl
index b07ce5f1..3630b970 100644
--- a/www/index.html.tpl
+++ b/www/index.html.tpl
@@ -10,6 +10,7 @@
     <link rel="stylesheet" type="text/css" href="/pve2/ext6/theme-crisp/resources/theme-crisp-all.css?ver=7.0.0" />
     <link rel="stylesheet" type="text/css" href="/pve2/ext6/crisp/resources/charts-all.css?ver=7.0.0" />
     <link rel="stylesheet" type="text/css" href="/pve2/fa/css/font-awesome.css" />
+    <link rel="stylesheet" type="text/css" href="/pve2/css/font-logos.css" />
     <link rel="stylesheet" type="text/css" href="/pve2/css/ext6-pve.css?ver=[% version %]" />
     <link rel="stylesheet" type="text/css" href="/pwt/css/ext6-pmx.css?ver=[% wtversion %]" />
     [%- IF theme != 'crisp' %]
--
2.39.2