mirror of
https://github.com/13hannes11/hugo-coder-timeline.git
synced 2024-09-04 00:50:58 +02:00
Host stuff locally (#194)
This commit includes the following things to host them locally: * fonts (formerly from Google Fonts) * fontawesome * normalize For a reasoning on why this is good to do, see below. Everything is now included in Sass code. This means not only we no more have requests to third-party sites, but also reduced the amount of requests necessary to access the page by three. I mainly downloaded all necessary stuff and put it at appropriate places. I also ran `make release` to regenerate all CSS files. Sites that helped me doing this: * https://switching.social/ethical-alternatives-to-google-fonts/ * https://google-webfonts-helper.herokuapp.com/fonts * https://google-webfonts-helper.herokuapp.com/fonts/lato?subsets=latin-ext,latin * https://google-webfonts-helper.herokuapp.com/fonts/merriweather?subsets=vietnamese,cyrillic-ext,latin-ext,latin,cyrillic * https://google-webfonts-helper.herokuapp.com/fonts/source-code-pro?subsets=latin-ext,latin * https://fontawesome.com/how-to-use/on-the-web/using-with/sass * https://github.com/JohnAlbin/normalize-scss --------------- Currently, this theme opens many connections to third-party sites. I hope I don't have to explain all too much why not exposing all visitors to Google etc. is a good thing, but I'll do list some advantages: * Pretty strong CSP: `content-security-policy: default-src https://nico.dorfbrunnen.eu:443` * Increased autonomy of webpage; if Google or other CDNs goes down, website still looks good * When building locally without Internet, everything works fine * Google is all about surveillance capitalism, they want to collect as much data about people as possible * With this change, we stop helping them on all websites using this theme * Google (and the other sites might too) is censored in quite some countries; in all of them, this theme would look not as beautiful as it could Regarding licensing issues: > first I need to understand if there is any license problem if we distribute these fonts with the theme. Sure! Here's what I've found out: According to [the CSS file we pull from Google](https://fonts.googleapis.com/css?family=Lato:400,700%7CMerriweather:300,700%7CSource+Code+Pro:400,700) we're using three fonts: [Lato](https://fonts.google.com/specimen/Lato), [Merriweather](https://fonts.google.com/specimen/Merriweather) and [Source Code Pro](https://fonts.google.com/specimen/Source+Code+Pro). On the bottom right of those pages it says for all fonts that they are licensed under the [Open Font License ](http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL_web). In its preamble, it says: > The OFL allows the licensed fonts to be used, studied, modified and redistributed freely as long as they are not sold by themselves. The fonts, including any derivative works, can be bundled, embedded, redistributed and/or sold with any software provided that any reserved names are not used by derivative works. So I think we're good to go and can include those fonts with the theme.
This commit is contained in:
committed by
Luiz F. A. de Prá
parent
2fa8ce9cdb
commit
bd8f610936
20
assets/scss/fontawesome/_animated.scss
vendored
Normal file
20
assets/scss/fontawesome/_animated.scss
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
// Animated Icons
|
||||
// --------------------------
|
||||
|
||||
.#{$fa-css-prefix}-spin {
|
||||
animation: fa-spin 2s infinite linear;
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-pulse {
|
||||
animation: fa-spin 1s infinite steps(8);
|
||||
}
|
||||
|
||||
@keyframes fa-spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
20
assets/scss/fontawesome/_bordered-pulled.scss
vendored
Normal file
20
assets/scss/fontawesome/_bordered-pulled.scss
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
// Bordered & Pulled
|
||||
// -------------------------
|
||||
|
||||
.#{$fa-css-prefix}-border {
|
||||
border: solid .08em $fa-border-color;
|
||||
border-radius: .1em;
|
||||
padding: .2em .25em .15em;
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-pull-left { float: left; }
|
||||
.#{$fa-css-prefix}-pull-right { float: right; }
|
||||
|
||||
.#{$fa-css-prefix},
|
||||
.fas,
|
||||
.far,
|
||||
.fal,
|
||||
.fab {
|
||||
&.#{$fa-css-prefix}-pull-left { margin-right: .3em; }
|
||||
&.#{$fa-css-prefix}-pull-right { margin-left: .3em; }
|
||||
}
|
||||
21
assets/scss/fontawesome/_core.scss
vendored
Normal file
21
assets/scss/fontawesome/_core.scss
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
// Base Class Definition
|
||||
// -------------------------
|
||||
|
||||
.#{$fa-css-prefix},
|
||||
.fas,
|
||||
.far,
|
||||
.fal,
|
||||
.fad,
|
||||
.fab {
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
display: inline-block;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
text-rendering: auto;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
%fa-icon {
|
||||
@include fa-icon;
|
||||
}
|
||||
6
assets/scss/fontawesome/_fixed-width.scss
vendored
Normal file
6
assets/scss/fontawesome/_fixed-width.scss
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
// Fixed Width Icons
|
||||
// -------------------------
|
||||
.#{$fa-css-prefix}-fw {
|
||||
text-align: center;
|
||||
width: $fa-fw-width;
|
||||
}
|
||||
1388
assets/scss/fontawesome/_icons.scss
vendored
Normal file
1388
assets/scss/fontawesome/_icons.scss
vendored
Normal file
File diff suppressed because it is too large
Load Diff
23
assets/scss/fontawesome/_larger.scss
vendored
Normal file
23
assets/scss/fontawesome/_larger.scss
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
// Icon Sizes
|
||||
// -------------------------
|
||||
|
||||
// makes the font 33% larger relative to the icon container
|
||||
.#{$fa-css-prefix}-lg {
|
||||
font-size: (4em / 3);
|
||||
line-height: (3em / 4);
|
||||
vertical-align: -.0667em;
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-xs {
|
||||
font-size: .75em;
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-sm {
|
||||
font-size: .875em;
|
||||
}
|
||||
|
||||
@for $i from 1 through 10 {
|
||||
.#{$fa-css-prefix}-#{$i}x {
|
||||
font-size: $i * 1em;
|
||||
}
|
||||
}
|
||||
18
assets/scss/fontawesome/_list.scss
vendored
Normal file
18
assets/scss/fontawesome/_list.scss
vendored
Normal file
@@ -0,0 +1,18 @@
|
||||
// List Icons
|
||||
// -------------------------
|
||||
|
||||
.#{$fa-css-prefix}-ul {
|
||||
list-style-type: none;
|
||||
margin-left: $fa-li-width * 5/4;
|
||||
padding-left: 0;
|
||||
|
||||
> li { position: relative; }
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-li {
|
||||
left: -$fa-li-width;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: $fa-li-width;
|
||||
line-height: inherit;
|
||||
}
|
||||
56
assets/scss/fontawesome/_mixins.scss
vendored
Normal file
56
assets/scss/fontawesome/_mixins.scss
vendored
Normal file
@@ -0,0 +1,56 @@
|
||||
// Mixins
|
||||
// --------------------------
|
||||
|
||||
@mixin fa-icon {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
display: inline-block;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
@mixin fa-icon-rotate($degrees, $rotation) {
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation})";
|
||||
transform: rotate($degrees);
|
||||
}
|
||||
|
||||
@mixin fa-icon-flip($horiz, $vert, $rotation) {
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}, mirror=1)";
|
||||
transform: scale($horiz, $vert);
|
||||
}
|
||||
|
||||
|
||||
// Only display content to screen readers. A la Bootstrap 4.
|
||||
//
|
||||
// See: http://a11yproject.com/posts/how-to-hide-content/
|
||||
|
||||
@mixin sr-only {
|
||||
border: 0;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
// Use in conjunction with .sr-only to only display content when it's focused.
|
||||
//
|
||||
// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
|
||||
//
|
||||
// Credit: HTML5 Boilerplate
|
||||
|
||||
@mixin sr-only-focusable {
|
||||
&:active,
|
||||
&:focus {
|
||||
clip: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
position: static;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
24
assets/scss/fontawesome/_rotated-flipped.scss
vendored
Normal file
24
assets/scss/fontawesome/_rotated-flipped.scss
vendored
Normal file
@@ -0,0 +1,24 @@
|
||||
// Rotated & Flipped Icons
|
||||
// -------------------------
|
||||
|
||||
.#{$fa-css-prefix}-rotate-90 { @include fa-icon-rotate(90deg, 1); }
|
||||
.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
|
||||
.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
|
||||
|
||||
.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
|
||||
.#{$fa-css-prefix}-flip-vertical { @include fa-icon-flip(1, -1, 2); }
|
||||
.#{$fa-css-prefix}-flip-both, .#{$fa-css-prefix}-flip-horizontal.#{$fa-css-prefix}-flip-vertical { @include fa-icon-flip(-1, -1, 2); }
|
||||
|
||||
// Hook for IE8-9
|
||||
// -------------------------
|
||||
|
||||
:root {
|
||||
.#{$fa-css-prefix}-rotate-90,
|
||||
.#{$fa-css-prefix}-rotate-180,
|
||||
.#{$fa-css-prefix}-rotate-270,
|
||||
.#{$fa-css-prefix}-flip-horizontal,
|
||||
.#{$fa-css-prefix}-flip-vertical,
|
||||
.#{$fa-css-prefix}-flip-both {
|
||||
filter: none;
|
||||
}
|
||||
}
|
||||
5
assets/scss/fontawesome/_screen-reader.scss
vendored
Normal file
5
assets/scss/fontawesome/_screen-reader.scss
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
// Screen Readers
|
||||
// -------------------------
|
||||
|
||||
.sr-only { @include sr-only; }
|
||||
.sr-only-focusable { @include sr-only-focusable; }
|
||||
2062
assets/scss/fontawesome/_shims.scss
vendored
Normal file
2062
assets/scss/fontawesome/_shims.scss
vendored
Normal file
File diff suppressed because it is too large
Load Diff
31
assets/scss/fontawesome/_stacked.scss
vendored
Normal file
31
assets/scss/fontawesome/_stacked.scss
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
// Stacked Icons
|
||||
// -------------------------
|
||||
|
||||
.#{$fa-css-prefix}-stack {
|
||||
display: inline-block;
|
||||
height: 2em;
|
||||
line-height: 2em;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
width: ($fa-fw-width*2);
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-stack-1x,
|
||||
.#{$fa-css-prefix}-stack-2x {
|
||||
left: 0;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-stack-1x {
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-stack-2x {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-inverse {
|
||||
color: $fa-inverse;
|
||||
}
|
||||
1405
assets/scss/fontawesome/_variables.scss
vendored
Normal file
1405
assets/scss/fontawesome/_variables.scss
vendored
Normal file
File diff suppressed because it is too large
Load Diff
22
assets/scss/fontawesome/brands.scss
vendored
Normal file
22
assets/scss/fontawesome/brands.scss
vendored
Normal file
@@ -0,0 +1,22 @@
|
||||
/*!
|
||||
* Font Awesome Free 5.10.1 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
||||
*/
|
||||
@import 'variables';
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 5 Brands';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-brands-400.eot');
|
||||
src: url('#{$fa-font-path}/fa-brands-400.eot?#iefix') format('embedded-opentype'),
|
||||
url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-brands-400.woff') format('woff'),
|
||||
url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype'),
|
||||
url('#{$fa-font-path}/fa-brands-400.svg#fontawesome') format('svg');
|
||||
}
|
||||
|
||||
.fab {
|
||||
font-family: 'Font Awesome 5 Brands';
|
||||
}
|
||||
16
assets/scss/fontawesome/fontawesome.scss
vendored
Normal file
16
assets/scss/fontawesome/fontawesome.scss
vendored
Normal file
@@ -0,0 +1,16 @@
|
||||
/*!
|
||||
* Font Awesome Free 5.10.1 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
||||
*/
|
||||
@import 'variables';
|
||||
@import 'mixins';
|
||||
@import 'core';
|
||||
@import 'larger';
|
||||
@import 'fixed-width';
|
||||
@import 'list';
|
||||
@import 'bordered-pulled';
|
||||
@import 'animated';
|
||||
@import 'rotated-flipped';
|
||||
@import 'stacked';
|
||||
@import 'icons';
|
||||
@import 'screen-reader';
|
||||
23
assets/scss/fontawesome/regular.scss
vendored
Normal file
23
assets/scss/fontawesome/regular.scss
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
/*!
|
||||
* Font Awesome Free 5.10.1 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
||||
*/
|
||||
@import 'variables';
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-regular-400.eot');
|
||||
src: url('#{$fa-font-path}/fa-regular-400.eot?#iefix') format('embedded-opentype'),
|
||||
url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-regular-400.woff') format('woff'),
|
||||
url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype'),
|
||||
url('#{$fa-font-path}/fa-regular-400.svg#fontawesome') format('svg');
|
||||
}
|
||||
|
||||
.far {
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-weight: 400;
|
||||
}
|
||||
24
assets/scss/fontawesome/solid.scss
vendored
Normal file
24
assets/scss/fontawesome/solid.scss
vendored
Normal file
@@ -0,0 +1,24 @@
|
||||
/*!
|
||||
* Font Awesome Free 5.10.1 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
||||
*/
|
||||
@import 'variables';
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-solid-900.eot');
|
||||
src: url('#{$fa-font-path}/fa-solid-900.eot?#iefix') format('embedded-opentype'),
|
||||
url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-solid-900.woff') format('woff'),
|
||||
url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype'),
|
||||
url('#{$fa-font-path}/fa-solid-900.svg#fontawesome') format('svg');
|
||||
}
|
||||
|
||||
.fa,
|
||||
.fas {
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-weight: 900;
|
||||
}
|
||||
6
assets/scss/fontawesome/v4-shims.scss
vendored
Normal file
6
assets/scss/fontawesome/v4-shims.scss
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
/*!
|
||||
* Font Awesome Free 5.10.1 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
|
||||
*/
|
||||
@import 'variables';
|
||||
@import 'shims';
|
||||
Reference in New Issue
Block a user