commit b4c0c4aee8357cfb900098b0cec80071dec0ba0b
parent 265762c49d49ba14161cf769cd6af29eda75ae19
Author: mjkloeckner <martin.cachari@gmail.com>
Date: Tue, 27 Sep 2022 11:49:35 -0300
Added CC License footer & reduced fonts size/loading times
In order to reduce the fonts loading times, in particular the font
'Futura Medium', which is the one used in the header title, before
loading it from the server the web browser tries to find it on local
storage.
Now the footer shows that the page is under CC-BY 4.0 license and an
image is shown.
The awesome-fonts package used previously gets deprecated in favor of
a heavly strip down version of it (contains only the icon used).
Diffstat:
13 files changed, 109 insertions(+), 30 deletions(-)
diff --git a/blog.html b/blog.html
@@ -16,10 +16,10 @@
<ul id=blog_entries>
<!--#include virtual="/blog_index.shtml" -->
</ul>
- <hr class="article_bottom_bar" style="margin-top: 1em;">
- <div style="margin-top: 1em; text-align: center; text-decoration: none;">
+ <div style="margin-top: 1em; padding-bottom: .75em; text-align: center; text-decoration: none;">
<a href="/rss.xml" id="rss"><img style="width: 1.5em; padding: 0;" src="/common/rss_logo.png" alt="rss logo"></a>
</div>
+ <hr class="article_bottom_bar" style="margin-top: 1em;">
</article>
<!--#include virtual="/common/footer.shtml" -->
</body>
diff --git a/common/footer.shtml b/common/footer.shtml
@@ -1,3 +1,6 @@
<footer class="footer">
- <b>This webpage has been written by Martin J. Klöckner</b>
+ <div class="footer-div" style="padding: 0em 2em 2em 2em;">
+ The content of this webpage is licensed under <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>
+ </div>
+ <img alt="Creative Commons License" style="padding: 0; margin: 0; border-width:0; width: 88px;" src="https://i.creativecommons.org/l/by/4.0/88x31.png"/>
</footer>
diff --git a/common/header.shtml b/common/header.shtml
@@ -1,9 +1,10 @@
<header>
<link rel="canonical" href="https://kloeckner.com.ar/" />
- <link rel="preload" href="/fonts/Futura/FuturaBT-Medium.woff" as="font" type="font/woff" crossorigin>
- <link rel="preload" href="/fonts/Futura/FuturaBT-Medium.woff2" as="font" type="font/woff2" crossorigin>
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
- <link rel="stylesheet" href="/fonts/fonts.css">
+ <!-- <link rel="preload" href="/fonts/Futura/FuturaBT-Medium.woff" as="font" type="font/woff" crossorigin> -->
+ <!-- <link rel="preload" href="/fonts/Futura/FuturaBT-Medium.woff2" as="font" type="font/woff2" crossorigin> -->
+
+ <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> -->
+ <link rel="stylesheet" href="">
<div class="header_flex_div">
<h1 id="header_title">
<a href="/" id="header_link">Martin Klöckner</a>
@@ -11,7 +12,7 @@
<ul style="list-style-type: none;" class="header_buttons">
<li class="header_button" style="padding-right: 10px"><a href="/blog" style="text-decoration: none; mergin-left: 1em;">blog</a></li>
<li class="header_button" style="padding-right: 10px"><a href="/about" style="text-decoration: none;">about</a></li>
- <li class="header_button"><a href="/resume.pdf" style="text-decoration: none;" target="_blank">cv<i style="font-size: 14px; color: gray; margin-left: 2px;" class="fa fa-download"></i></a></li>
+ <li class="header_button"><a href="/resume.pdf" style="text-decoration: none;" target="_blank">cv<i class="icon-download"></i></a></li>
</ul>
</div>
</header>
diff --git a/common/rss_logo.png b/common/rss_logo.png
Binary files differ.
diff --git a/css/about_style.css b/css/about_style.css
@@ -14,6 +14,7 @@ p {
ul {
margin-left: 1.5em;
+ padding-bottom: 1em;
}
.article_bottom_bar {
diff --git a/css/article_style.css b/css/article_style.css
@@ -43,6 +43,7 @@ p {
ul {
margin-left: 1.5em;
+ padding-bottom: 1em;
}
.article_bottom_bar {
diff --git a/css/style.css b/css/style.css
@@ -1,3 +1,48 @@
+@font-face {
+ font-family: 'Futura Medium';
+ src: local('Futura Medium'),
+ local('FuturaBT-Medium'),
+ local('futura_medium'),
+ url('/fonts/Futura/FuturaBT-Medium.woff2') format('woff2'), /* Modern Browsers */
+ url('/fonts/Futura/FuturaBT-Medium.woff') format('woff'),
+ url('/fonts/Futura/futura_medium.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/Futura/FuturaBT-Medium.svg#svgFutura') format('svg'), /* Legacy iOS */
+ url('/fonts/Futura/FuturaBT-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/Futura/futura_medium.ttf'); /* IE9 Compat Modes */
+}
+
+@font-face {
+ font-family: 'Ubuntu Mono';
+ src: local('Ubuntu Mono'),
+ local('UbuntuMono-Regular'),
+ local('UbuntuMono'),
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.woff2') format('woff2'), /* Modern Browsers */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.woff') format('woff'), /* Modern Browsers */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.svg#svgUbuntuMono') format('svg'), /* Legacy iOS */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf'); /* IE9 Compat Modes */
+}
+
+@font-face {
+ font-family: 'download';
+ src: url('/fonts/download/download.eot');
+ src: url('/fonts/download/download.eot') format('embedded-opentype'),
+ url('/fonts/download/download.woff') format('woff'),
+ url('/fonts/download/download.ttf') format('truetype'),
+ url('/fonts/download/download.svg') format('svg');
+ font-weight: normal;
+ font-style: normal;
+}
+
+.icon-download {
+ font-family: 'download';
+ color: gray;
+ font-size: 16px;
+ text-decoration: none;
+ font-style: normal;
+}
+
* {
margin: 0;
padding: 0;
@@ -147,6 +192,21 @@ article {
border-top: 1px dashed peru;
}
+footer {
+ padding-top: 0em;
+ text-align: center;
+ font-size: 0.75em;
+
+ /* color: #151515; */
+ color: dimgrey;
+ font-family: monospace;
+}
+
+.footer-div {
+ padding: 0em 2em 2em 2em;
+ margin-left: auto;
+ margin-right:auto;
+}
@media (max-width: 800px) {
body {
@@ -182,6 +242,9 @@ article {
padding-left: .5em;
padding-right: .5em;
}
+ .footer-div {
+ max-width: 75%;
+ }
}
img {
@@ -224,16 +287,6 @@ ul {
margin: 0; /* Remove margins */
}
-footer {
- padding-top: 0em;
- text-align: center;
- font-size: 0.75em;
-
- /* color: #151515; */
- color: dimgrey;
- font-family: monospace;
-}
-
#index-title {
text-align: center;
color: #DAA520;
diff --git a/fonts/download/download.eot b/fonts/download/download.eot
Binary files differ.
diff --git a/fonts/download/download.svg b/fonts/download/download.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Copyright (C) 2022 by original authors @ fontello.com</metadata>
+<defs>
+<font id="fontello" horiz-adv-x="1000" >
+<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
+<missing-glyph horiz-adv-x="1000" />
+<glyph glyph-name="download" unicode="" d="M714 100q0 15-10 25t-25 11-25-11-11-25 11-25 25-11 25 11 10 25z m143 0q0 15-10 25t-26 11-25-11-10-25 10-25 25-11 26 11 10 25z m72 125v-179q0-22-16-37t-38-16h-821q-23 0-38 16t-16 37v179q0 22 16 38t38 16h259l75-76q33-32 76-32t76 32l76 76h259q22 0 38-16t16-38z m-182 318q10-23-8-39l-250-250q-10-11-25-11t-25 11l-250 250q-17 16-8 39 10 21 33 21h143v250q0 15 11 25t25 11h143q14 0 25-11t10-25v-250h143q24 0 33-21z" horiz-adv-x="928.6" />
+</font>
+</defs>
+</svg>
diff --git a/fonts/download/download.ttf b/fonts/download/download.ttf
Binary files differ.
diff --git a/fonts/download/download.woff b/fonts/download/download.woff
Binary files differ.
diff --git a/fonts/download/download.woff2 b/fonts/download/download.woff2
Binary files differ.
diff --git a/fonts/fonts.css b/fonts/fonts.css
@@ -1,19 +1,27 @@
/* src: url('webfont.eot?#iefix') format('embedded-opentype'), /1* IE6-IE8 *1/ */
@font-face {
- font-family: 'Futura Medium';
- src: url('/fonts/Futura/futura_medium.ttf'); /* IE9 Compat Modes */
- src: url('/fonts/Futura/FuturaBT-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
- url('/fonts/Futura/FuturaBT-Medium.woff') format('woff'), /* Modern Browsers */
- url('/fonts/Futura/futura_medium.ttf') format('truetype'), /* Safari, Android, iOS */
- url('/fonts/Futura/FuturaBT-Medium.svg#svgFutura') format('svg'); /* Legacy iOS */
+ font-family: 'Futura Medium';
+ src: local('Futura Medium'),
+ local('FuturaBT-Medium'),
+ local('futura_medium'),
+ url('/fonts/Futura/FuturaBT-Medium.woff2') format('woff2'), /* Modern Browsers */
+ url('/fonts/Futura/FuturaBT-Medium.woff') format('woff'),
+ url('/fonts/Futura/futura_medium.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/Futura/FuturaBT-Medium.svg#svgFutura') format('svg'), /* Legacy iOS */
+ url('/fonts/Futura/FuturaBT-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/Futura/futura_medium.ttf'); /* IE9 Compat Modes */
}
@font-face {
- font-family: 'Ubuntu Mono';
- src: url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf'); /* IE9 Compat Modes */
- src: url('/fonts/UbuntuMono/UbuntuMono-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
- url('/fonts/UbuntuMono/UbuntuMono-Regular.woff') format('woff'), /* Modern Browsers */
- url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
- url('/fonts/UbuntuMono/UbuntuMono-Regular.svg#svgUbuntuMono') format('svg'); /* Legacy iOS */
+ font-family: 'Ubuntu Mono';
+ src: local('Ubuntu Mono'),
+ local('UbuntuMono-Regular'),
+ local('UbuntuMono'),
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.woff2') format('woff2'), /* Modern Browsers */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.woff') format('woff'), /* Modern Browsers */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.svg#svgUbuntuMono') format('svg'), /* Legacy iOS */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf'); /* IE9 Compat Modes */
}
