Skip to content
Snippets Groups Projects
Verified Commit f0f3469d authored by orestis.malaspin's avatar orestis.malaspin
Browse files

restarted the site

parent 46130741
No related branches found
No related tags found
No related merge requests found
Showing
with 966 additions and 39 deletions
[submodule "toucan"]
path = lattice-boltzmann.com/themes/toucan
url = https://git.42l.fr/HugoTrentesaux/toucan.git
[submodule "lattice-boltzmann.com/themes/abridge"]
path = lattice-boltzmann.com/themes/abridge
url = https://github.com/jieiku/abridge.git
.env
public
themes
build
storage
node_modules
package-lock.json
static/demo.html
static/tinysearch_engine.js
static/tinysearch_engine.d.ts
static/tinysearch_engine_bg.wasm.d.ts
static/package.json
This diff is collapsed.
......@@ -3,76 +3,85 @@ title = "The dimensionless lattice Boltzmann equation"
description = "How to write the dimensionless lattice Boltzmann equation"
date = 2024-03-06
slug = "dimensionless"
[taxonomies]
tags = ["LBM","Navier-Stokes"]
[extra]
katex = true
math = true
math_auto_render = true
toc = true
+++
## Thed imensionless Navier-Stokes
In order to write the dimensionless lattice Boltzmann equation, we start by reminding the basis of dimensional analysis for fluid flows by writing the dimensionless incompressible Navier--Stokes which are more common in the litterature.
## The dimensionless Navier-Stokes
In order to write the dimensionless lattice Boltzmann equation, we start by reminding the basis of dimensional analysis for fluid flows by writing the dimensionless incompressible Navier--Stokes which are more common in the literature.
The incompressible Navier--Stokes equations reads
££
$$
\begin{aligned}
&\bm{\nabla}\cdot\bm{u}=0,\\\\
&\frac{\partial}{\partial t}\bm{u}+\bm{u}\cdot\bm{\nabla}\bm{u}=-\frac{1}{\rho}\bm{\nabla}p+\nu\bm{\nabla}^2\bm{u},
\end{aligned}
££
$$
where $p$, $\rho$, $\nu$, and $\bm{u}$ are respectively the pressure, density, kinematic viscosity, and velocity of the flow.
In order to transform this equation into its dimensionless form a certain amount of characteristic lengthscales must be chosen. Here we will define $U$ as the characteristic velocity of the flow and $L$ its characteristic length.
In order to transform this equation into its dimensionless form a certain amount of characteristic lengths calves must be chosen. Here we will define $U$ as the characteristic velocity of the flow and $L$ its characteristic length.
We can the write all the above quantities dimensionless form
££
$$
\begin{aligned}
&\bm{u}^\ast=\frac{\bm{u}}{U}, &p^\ast=\frac{p}{\rho U^2},\\\\
&t^\ast=\frac{U}{L}t, &\bm{x}^\ast=\frac{\bm{x}}{L},\\\\
&\frac{\partial}{\partial t^\ast}=\frac{L}{U}\frac{\partial}{\partial t}, &\bm{\nabla}^\ast=L\bm{\nabla}
\end{aligned}
££
$$
Replacing these equations into the Navier--Stokes equations one gets
££
$$
\begin{aligned}
&\bm{\nabla}^\ast\cdot\bm{u}^\ast=0,\\\\
&\frac{\partial}{\partial t^\ast}\bm{u}^\ast+\bm{u}^\ast\cdot\bm{\nabla}^\ast\bm{u}^\ast=-\bm{\nabla}^\ast p^\ast+\frac{1}{\mathrm{Re}}\bm{\nabla}^{\ast 2}\bm{u}^\ast,
\end{aligned}
££
$$
where $\mathrm{Re}=U\cdot L/\nu$ is the _famous_ Reynolds number which represents the ratio of the inertial over the viscous forces.
It must me noted that this non-dimensionnalization procedure heavily relies on the choice of the characteristic timescale of the flow
which is this case can be constructed through the characteristic velocity of the flow, $T=L/U$. By chosing the kinematic viscosity instead of the
velocity, the characteristic time of the flow becomes, $T=L^2/\nu$. With this new characteristic time the dimensionless quantities become
££
$$
\begin{aligned}
&\bm{u}^\ast=\frac{L}{\nu}\bm{u}, &p^\ast=\frac{L^2}{\nu^2\rho}p,\\\\
&t^\ast=\frac{\nu}{L^2}t, &\bm{x}^\ast=\frac{\bm{x}}{L},\\\\
&\frac{\partial}{\partial t^\ast}=\frac{L^2}{\nu}\frac{\partial}{\partial t}, &\bm{\nabla}^\ast=L\bm{\nabla}
\end{aligned}
££
$$
which in turn give the following dimensionless Navier--Stokes equations
££
$$
\begin{aligned}
&\bm{\nabla}^\ast\cdot\bm{u}^\ast=0,\\\\
&\frac{\partial}{\partial t^\ast}\bm{u}^\ast+\bm{u}^\ast\cdot\bm{\nabla}^\ast\bm{u}^\ast=-\bm{\nabla}^\ast p^\ast+\bm{\nabla}^{\ast 2}\bm{u}^\ast,
\end{aligned}
££
where we see that no dimensionless number is present anymore. This kind of non-dimensionalization is only valid for creeping flows that move only very slowly and will not interest us in this series of tutorials.
$$
where we see that no dimensionless number is present anymore. This case represents creeping flows that move only very slowly and will not interest us in this series of tutorials.
## The dimensionless Boltzmann equation
The quantity of interest in the Boltzmann equation is the desity probability distribution function
££
The quantity of interest in the Boltzmann equation is the density probability distribution function
$$
f(\bm{x},\bm{\xi}, t)
££
$$
which represents the probability of finding a particle at position $\bm{x}$ with velocity $\bm{\xi}$ at time $t$.
In this tutorial we will only be interested in the Boltzmann-BGK equation[^1]
££
In this tutorial we will only be interested in the Boltzmann-BGK equation, which reads
$$
\partial_t f(\bm{x}, \bm{\xi}, t)+\bm{\xi}\cdot \bm{\nabla}f(\bm{x},\bm{\xi}, t)=-\frac{1}{\tau}\left(f(\bm{x}, \bm{\xi}, t)-f^{eq}(\bm{x}, \bm{\xi}, t)\right),
££
where $\tau$ is the relaxation time of the fluid, and $f^{eq}$ the equilibrium distribution function which is typically the Maxwell-Boltzmann distribution (more on this later).
$$
where $\tau$ is the relaxation time of the fluid, and $f^{eq}$ the equilibrium distribution function which is typically the Maxwell-Boltzmann density distribution
function. Considering our fluid is made of particles of mass $m$, the Boltzmann distribution reads
$$
f^{eq}(\bm{x}, \bm{\xi}, t) = \rho(\bm{x}, t)\left(\frac{m}{2\pi k_B T(\bm{x}, t)}\right)^{D/2}\exp\left(-\frac{m(\bm{\xi}-\bm{u}(\bm{x}, t))^2}{2k_B T(\bm{x}, t)}\right),
$$
where $\rho$, $\bm{u}$, $T$ are respectively the density, velocity and temperature of the fluid, $k_B$ the Boltzmann constant, and $D$ the dimension of the velocity.
The dimensionless density distribution function is then given by
......
+++
paginate_by = 3
sort_by = "date"
template = "section.html"
template = "index.html"
+++
+++
template = "archive.html"
[extra]
sec = ""
+++
{
"name": "abridge-bundle",
"version": "2.0.0",
"description": "Abridge - set PWA cache files list, bundle and minify js",
"author": "Jake G <106644+Jieiku@users.noreply.github.com>",
"license": "MIT",
"homepage": "https://github.com/Jieiku/abridge",
"scripts": {
"abridge": "node -e \"if ( require('fs').existsSync('./themes/abridge/package_abridge.js')) {require('fs').copyFileSync('./themes/abridge/package_abridge.js', './package_abridge.js')}\" && node package_abridge.js"
},
"dependencies": {
"fast-toml": "^0.5.4",
"uglify-js": "^3.17.4",
"jsonminify": "^0.4.2",
"replace-in-file": "^7.0.1"
}
}
const fs = require('fs');
const path = require("path");
const TOML = require('fast-toml');
const UglifyJS = require('uglify-js');
const jsonminify = require("jsonminify");
const replace = require('replace-in-file');
const util = require("util");
const { exec } = require("child_process");
const execPromise = util.promisify(exec);
if (!(fs.existsSync('config.toml'))) {
throw new Error('ERROR: cannot find config.toml!');
}
const tomlString = String(fs.readFileSync('config.toml'));
const data = TOML.parse(tomlString);
const js_prestyle = data.extra.js_prestyle;
const js_switcher = data.extra.js_switcher;
const js_email_encode = data.extra.js_email_encode;
const js_copycode = data.extra.js_copycode;
const search_library = data.extra.search_library;
const index_format = data.search.index_format;
const uglyurls = data.extra.uglyurls;
const js_bundle = data.extra.js_bundle;
const offline = data.extra.offline;
const online_url = data.extra.online_url;
const online_indexformat = data.extra.online_indexformat;
const pwa = data.extra.pwa;
const pwa_VER = data.extra.pwa_VER;
const pwa_NORM_TTL = data.extra.pwa_NORM_TTL;
const pwa_LONG_TTL = data.extra.pwa_LONG_TTL;
const pwa_TTL_NORM = data.extra.pwa_TTL_NORM;
const pwa_TTL_LONG = data.extra.pwa_TTL_LONG;
const pwa_TTL_EXEMPT = data.extra.pwa_TTL_EXEMPT;
const pwa_cache_all = data.extra.pwa_cache_all;
const pwa_BASE_CACHE_FILES = data.extra.pwa_BASE_CACHE_FILES;
async function execWrapper(cmd) {
const { stdout, stderr } = await execPromise(cmd);
if (stdout) {
console.log(stdout);
}
if (stderr) {
console.log('ERROR: '+stderr);
}
}
async function abridge() {
if (offline === false) {
if (typeof online_url !== 'undefined' && typeof online_indexformat !== 'undefined') {
replace.sync({files: 'config.toml', from: /base_url.*=.*/g, to: "base_url = \""+online_url+"\""});
replace.sync({files: 'config.toml', from: /index_format.*=.*/g, to: "index_format = \""+online_indexformat+"\""});
}
} else if (offline === true) {
if (typeof online_url !== 'undefined' && typeof online_indexformat !== 'undefined') {
replace.sync({files: 'config.toml', from: /base_url.*=.*/g, to: "base_url = \""+__dirname+"\/public\""});
replace.sync({files: 'config.toml', from: /index_format.*=.*/g, to: "index_format = \"elasticlunr_javascript\""});
} else {
throw new Error('ERROR: offline = true requires that online_url and online_indexformat are set in config.toml, so that the base_url and index_format can be restored if offline is later set to false.');
}
}
console.log('Zola Build to generate files for minification:');
await execWrapper('zola build');
//check that static/js exists, do this after zola build, it will handle creating static if missing.
var jsdir = 'static/js';
try {
fs.mkdirSync(jsdir);
} catch(e) {
if (e.code != 'EEXIST') throw e;
}
// check if abridge is used directly or as a theme.
bpath = '';
if (fs.existsSync('./themes')) {
bpath = 'themes/abridge/';
}
base_url = data.base_url;
if (base_url.slice(-1) == "/") {
base_url = base_url.slice(0, -1);
}
if (search_library === 'elasticlunr') {
if (fs.existsSync('content/static/stork_toml.md')) {
replace.sync({files: 'content/static/stork_toml.md', from: /draft.*=.*/g, to: "draft = true"});
}
if (fs.existsSync('content/static/tinysearch_json.md')) {
replace.sync({files: 'content/static/tinysearch_json.md', from: /draft.*=.*/g, to: "draft = true"});
}
} else if (search_library === 'tinysearch') {
if (!fs.existsSync('content/static/tinysearch_json.md')) {// 'content/static/tinysearch_json.md' file is missing, copy from abridge theme.
fs.copyFileSync(bpath+'content/static/tinysearch_json.md', 'content/static/tinysearch_json.md',fs.constants.COPYFILE_EXCL);
}
if (fs.existsSync('content/static/stork_toml.md')) {
replace.sync({files: 'content/static/stork_toml.md', from: /draft.*=.*/g, to: "draft = true"});
}
if (fs.existsSync('content/static/tinysearch_json.md')) {
replace.sync({files: 'content/static/tinysearch_json.md', from: /draft.*=.*/g, to: "draft = false"});
}
// zola build && mkdir -p tmp && tinysearch --optimize --path tmp public/data_tinysearch/index.html && rsync -avz tmp/*.wasm static/ && rm -rf tmp
} else if (search_library === 'stork') {
if (!fs.existsSync('content/static/stork_toml.md')) {// 'content/static/stork_toml.md' file is missing, copy from abridge theme.
fs.copyFileSync(bpath+'content/static/stork_toml.md', 'content/static/stork_toml.md',fs.constants.COPYFILE_EXCL);
}
if (fs.existsSync('content/static/stork_toml.md')) {
replace.sync({files: 'content/static/stork_toml.md', from: /draft.*=.*/g, to: "draft = false"});
}
if (fs.existsSync('content/static/tinysearch_json.md')) {
replace.sync({files: 'content/static/tinysearch_json.md', from: /draft.*=.*/g, to: "draft = true"});
}
// zola build && stork build --input public/data_stork/index.html --output static/stork.st
}
if (pwa) {// Update pwa settings, file list, and hashes.
if (typeof pwa_VER !== 'undefined' && typeof pwa_NORM_TTL !== 'undefined' && typeof pwa_LONG_TTL !== 'undefined' && typeof pwa_TTL_NORM !== 'undefined' && typeof pwa_TTL_LONG !== 'undefined' && typeof pwa_TTL_EXEMPT !== 'undefined') {
// update from abridge theme.
fs.copyFileSync(bpath+'static/sw.js', 'static/sw.js');
fs.copyFileSync(bpath+'static/js/sw_load.js', 'static/js/sw_load.js');
// Update settings in PWA javascript file, using options parsed from config.toml. sw.min.js?v=3.10.0", "++"
if (fs.existsSync('static/js/sw_load.js')) {
sw_load_min = '.js?v=';
if (js_bundle) {
sw_load_min = '.min.js?v=';
}
replace.sync({files: 'static/js/sw_load.js', from: /sw.*v=.*/g, to: "sw"+sw_load_min+pwa_VER+"\","});
}
if (fs.existsSync('static/sw.js')) {
replace.sync({files: 'static/sw.js', from: /NORM_TTL.*=.*/g, to: "NORM_TTL = "+pwa_NORM_TTL+";"});
replace.sync({files: 'static/sw.js', from: /LONG_TTL.*=.*/g, to: "LONG_TTL = "+pwa_LONG_TTL+";"});
replace.sync({files: 'static/sw.js', from: /TTL_NORM.*=.*/g, to: "TTL_NORM = ["+pwa_TTL_NORM+"];"});
replace.sync({files: 'static/sw.js', from: /TTL_LONG.*=.*/g, to: "TTL_LONG = ["+pwa_TTL_LONG+"];"});
replace.sync({files: 'static/sw.js', from: /TTL_EXEMPT.*=.*/g, to: "TTL_EXEMPT = ["+pwa_TTL_EXEMPT+"];"});
}
if (pwa_cache_all === true) {
console.log('info: pwa_cache_all = true in config.toml, so caching the entire site.\n');
// Generate array from the list of files, for the entire site.
var dir = 'public';
try {
fs.mkdirSync(dir);
} catch(e) {
if (e.code != 'EEXIST') throw e;
}
const path = './public/';
cache = 'this.BASE_CACHE_FILES = [';
files = fs.readdirSync(path, { recursive: true, withFileTypes: false })
.forEach(
(file) => {
// check if is directory, if not then add the path/file
if (!fs.lstatSync(path+file).isDirectory()) {
// format output
item = "/"+file.replace(/index\.html$/i,'');// strip index.html from path
item = item.replace(/^\/sw(\.min)?\.js/i,'');// dont cache service worker
// if formatted output is not empty line then append it to cache var
if (item != '') {// skip empty lines
cache = cache+"'"+item+"',";
}
}
}
);
cache = cache.slice(0, -1)+'];'// remove the last comma and close the array
} else if (pwa_BASE_CACHE_FILES) {
cache = 'this.BASE_CACHE_FILES = ['+pwa_BASE_CACHE_FILES+'];';
}
// update the BASE_CACHE_FILES variable in the sw.js service worker file
results = replace.sync({
files: 'static/sw.js',
from: /this\.BASE_CACHE_FILES =.*/g,
to: cache,
countMatches: true,
});
} else {
throw new Error('ERROR: pwa requires that pwa_VER, pwa_NORM_TTL, pwa_LONG_TTL, pwa_TTL_NORM, pwa_TTL_LONG, pwa_TTL_EXEMPT are set in config.toml.');
}
}
if (bpath === '') {// abridge used directly
// These are truely static js files, so they should only need to be updated by abridge maintainer or contributors.
minify(['static/js/theme.js']);
minify(['static/js/theme_light.js']);
minify(['static/js/katex.min.js','static/js/mathtex-script-type.min.js','static/js/katex-auto-render.min.js','static/js/katexoptions.js'],'static/js/katexbundle.min.js');
minify(['static/js/elasticlunr.min.js','static/js/search.js'],'static/js/search_elasticlunr.min.js');
minify(['static/js/stork.js','static/js/stork_config.js'],'static/js/search_stork.min.js');
minify(['static/js/tinysearch.js'],'static/js/search_tinysearch.min.js');
minify(['static/js/prestyle.js','static/js/theme_button.js','static/js/email.js','static/js/codecopy.js','static/js/sw_load.js'],'static/js/abridge_nosearch.min.js');
minify(['static/js/prestyle.js','static/js/theme_button.js','static/js/email.js','static/js/codecopy.js'],'static/js/abridge_nosearch_nopwa.min.js');
minify(['static/js/sw_load.js']);
minify(['static/sw.js']);
} else if (pwa) {
minify(['static/js/sw_load.js']);
minify(['static/sw.js']);
}
// if manifest.json is present, then minify it.
if (fs.existsSync('static/manifest.json')) {
let out;
try {
out = JSON.minify(fs.readFileSync('static/manifest.json', {encoding:"utf-8"}));
} catch(err) {
console.log(err);
}
fs.writeFileSync('static/manifest.min.json', out);
}
abridge_bundle = bundle(bpath,js_prestyle,js_switcher,js_email_encode,js_copycode,search_library,index_format,uglyurls,false);
minify(abridge_bundle,'static/js/abridge_nopwa.min.js');
abridge_bundle = bundle(bpath,js_prestyle,js_switcher,js_email_encode,js_copycode,search_library,index_format,uglyurls,pwa);
minify(abridge_bundle,'static/js/abridge.min.js');
console.log('Zola Build to generate new integrity hashes for the previously minified files:');
await execWrapper('zola build');
}
function bundle(bpath,js_prestyle,js_switcher,js_email_encode,js_copycode,search_library,index_format,uglyurls,pwa) {
minify_files = [];
if (js_prestyle) {
minify_files.push(bpath+'static/js/prestyle.js');
}
if (js_switcher) {
minify_files.push(bpath+'static/js/theme_button.js');
}
if (js_email_encode) {
minify_files.push(bpath+'static/js/email.js');
}
if (js_copycode) {
minify_files.push(bpath+'static/js/codecopy.js');
}
if (search_library) {
if ((search_library === 'elasticlunr' && offline === true) || (search_library === 'elasticlunr' && index_format === 'elasticlunr_javascript' && uglyurls === true)) {
minify_files.push('public/search_index.en.js');
minify_files.push(bpath+'static/js/elasticlunr.min.js');
minify_files.push(bpath+'static/js/searchjavaugly.js');
} else if (search_library === 'elasticlunr' && index_format === 'elasticlunr_javascript') {
minify_files.push('public/search_index.en.js');
minify_files.push(bpath+'static/js/elasticlunr.min.js');
minify_files.push(bpath+'static/js/searchjava.js');
} else if (search_library === 'elasticlunr') {//abridge default
minify_files.push(bpath+'static/js/elasticlunr.min.js');
minify_files.push(bpath+'static/js/search.js');
} else if (search_library === 'stork') {
minify_files.push(bpath+'static/js/stork.js');
minify_files.push(bpath+'static/js/stork_config.js');
} else if (search_library === 'tinysearch') {
minify_files.push(bpath+'static/js/tinysearch.js');
}
}
if (pwa) {
minify_files.push('static/js/sw_load.js');
}
return minify_files;
}
function minify(fileA,outfile) {
const options = {
mangle: true,
compress: {
//expression: true,//Parse a single expression, rather than a program (for parsing JSON).
//global_defs: false,// a way to pass parameters
//module: true,//Process input as ES module (implies --toplevel)
//toplevel: true,//Compress and/or mangle variables in top level scope.
hoist_funs: true,//hoist function declarations
unsafe: true,
unsafe_comps: true,
unsafe_Function: true,
unsafe_math: true,
unsafe_proto: true,
unsafe_regexp: true,
unsafe_undefined: true,
drop_console: true
}
}
if (!outfile) {// outfile parameter omitted, infer based on input
outfile = fileA[0].slice(0,-2)+'min.js';
}
var filesContents = fileA.map(function (file) {// array input to support multiple files
return fs.readFileSync(file, 'utf8');
});
result = UglifyJS.minify(filesContents, options);
fs.writeFileSync(outfile, result.code);
}
abridge();
/******************************************************************************
* Extra - Put your extra SASS/CSS here, it will get bundled with abridge.css
*****************************************************************************/
@use '../themes/abridge/sass/abridge' with ( /// LINES HERE END WITH COMMA AFTER THE VALUE!
/// The things your less likely to need to override have been commented out.
/// Enable a centered viewport for <header>, <main>, <footer> inside <body>
/// Fluid layout until a defined size, then becomes centered viewport.
//$enable-maxwidth: true,
$mw: 85%, // max-width
//$mb: 1200px,// value at which to switch from fluid layout to max-width
$abridgeMode: "light", //valid values: switcher, auto, dark, light
$syntax-mode: "light", // Force syntax mode: auto, dark, light
$switcherDefault: "dark", // default nojs switcher mode: dark, light (make sure to also set js_switcher_default in config.toml)
$color: "blueshade", // color template to use/override: orange, blue, blueshade
$color-syntax: "abridge", // syntax color template to use/override: abridge,
$syntax: true, //syntax highlighting for Code Blocks.
$enable-icons: true, // false disables ALL icons
$ic: true, // true for colorized icons, otherwise #888 is used.
$icon-rss: true,
$icon-mail: true, // e-mail
$icon-mastodon: false,
$icon-element: true,
$icon-matrix: false,
$icon-buymeacoffee: false,
$icon-kofi: false,
$icon-twitter: false,
$icon-facebook: false,
$icon-linkedin: false,
$icon-codeberg: false,
$icon-gitlab: true,
$icon-github: false,
$icon-github-sponsor: false,
$icon-bitbucket: false,
$icon-python: false,
$icon-docker: false,
$icon-stack: false,
$icon-instagram: false,
$icon-pixelfed: false,
$icon-pinterest: false,
$icon-discord: false,
$icon-twitch: false,
$icon-youtube: false,
$icon-researchgate: true,
//$icon-x: true,// x symbol, used to close search results page.
//$icon-search: true,//search, spyglass search button in search box.
//$icon-adjust: true,//theme switcher dark/light toggle button.
//$icon-angll: true,//pagination, goto first page
//$icon-angl: true,//pagination, goto previous page
//$icon-angr: true,//pagination, goto next page
//$icon-angrr: true,//pagination, goto last page
//$icon-angu: true,//back to top button, appears after scrolling down.
//$icon-world: true,//language select menu
//$icon-copy: true,//copy to clipboard, for code blocks.
//$icon-ffolder: false,
//$icon-folder: false,// categories folder
//$icon-ftag: false,
//$icon-tag: false,// tag
//$icon-check: false,// check mark
//$icon-chevron: false,// chevron down
//$icon-clock: false,// time analog clock
//$icon-date: false,// calendar
//$icon-globe: false,
//$icon-home: false,
//$icon-minus: false,// minus symbol
//$icon-moon: false,// dark moon
//$icon-sun: false,// light sun
/// The colors below can be overrided individually as needed.
/// Dark Colors
//$f1d: #ccc,// Font Color Primary
//$f2d: #ddd,// Font Color Headers
//$c1d: #111,// Background Color Primary
//$c2d: #222,// Background Color Secondary
//$c3d: #333,// Table Rows, Block quote edge, Borders
//$c4d: #777,// Disabled Buttons, Borders, mark background
//$a1d: #f90,// link color
//$a2d: #fb0,// link hover/focus color
//$a3d: #f90,// link h1-h2 hover/focus color
//$a4d: #f90,// link visited color
//$cgd: #593,// ins green, success
//$crd: #e33,// del red, errors
/// Light Colors
//$f1: #333,// Font Color Primary
//$f2: #222,// Font Color Headers
//$c1: #fff,// Background Color Primary
//$c2: #eee,// Background Color Secondary
//$c3: #ddd,// Table Rows, Block quote edge, Borders
//$c4: #555,// Disabled Buttons, Borders, mark background
//$a1: #c40,// link color
//$a2: #e60,// link hover/focus color
//$a3: #f90,// link h1-h2 hover/focus color
//$a4: #c40,// link visited color
//$cg: #373,// ins green, success
//$cr: #d33,// del red, errors
/// Dark Syntax Colors
//$h0d: #191919,// background color
//$h1d: #ddd,// unstyled text
//$h2d: #888,// comments
//$h3d: #e65,// red, support function
//$h4d: #e83,// orange, punctuation, constant, variable, json-key
//$h5d: #eb6,// tan, entity/function name
//$h6d: #ac3,// green, string
//$h7d: #8db,// teal, escape character
//$h8d: #6ae,// blue, declaration, tag, property
//$h9d: #d6e,// purple, operators
//$had: 160%,// mark/highlight line
/// Light Syntax Colors
//$h0: #f7f7f7,// background color
//$h1: #222,// unstyled text
//$h2: #666,// comments
//$h3: #a21,// red, support function
//$h4: #930,// orange, punctuation, constant, variable, json-key
//$h5: #a50,// tan, entity/function name
//$h6: #350,// green, string
//$h7: #286,// teal, escape character
//$h8: #059,// blue, declaration, tag, property
//$h9: #a3c,// purple, operators
//$ha: 92%,// mark/highlight line
/// These lines find the spot at which to insert your appended fonts.
// $findFont-Main: "CMUSerif", // APPEND custom MAIN font(s) AFTER this
//$findFont-Code: "Segoe UI Mono",// APPEND custom CODE font(s) AFTER this
/// If you want to prepend the font list, then use null instead:
//$findFont-Main: null, // PREPEND custom MAIN font(s)
//$findFont-Code: null, // PREPEND custom CODE font(s)
/// These lines specify the fonts to add.
//$fontExt-Main: (ExampleFont1, "Example Font 2"),// MAIN font(s) to add
//$fontExt-Code: (ExampleCode1, "Example Code 2"),// CODE font(s) to add
/// If relying on installed fonts alone, then the above is all you need, if the visiting system has the intended font installed then it will use it!
/// However, if you want to load the Font File resource to ensure it is loaded if they do not have it, then use @use at the VERY Bottom of this file.
/// For a Sans based system font stack, I measured the least Cumulative Layout Shift with: Roboto, Lato, Arimo
/// If prepending/appending fonts above, then no need to change them with the 2 below lines.
/// The following 2 below lines give a way to hard code a font list if you prefer.
$font: CMUSerif,
//$font: Roboto system-ui -apple-system BlinkMacSystemFont "Segoe UI" Oxygen Ubuntu Cantarell "Fira Sans" "Droid Sans" "Helvetica Neue" "Noto Sans" Helvetica Arial sans-serif,
//$font-mono: ui-monospace Menlo Monaco Consolas "SF Mono" "Cascadia Mono" "Segoe UI Mono" "DejaVu Sans Mono" "Liberation Mono" "Roboto Mono" "Oxygen Mono" "Ubuntu Monospace" "Ubuntu Mono" "Source Code Pro" "Fira Mono" "Droid Sans Mono" "Courier New" Courier monospace,
/// Enable <header>, <main>, <footer> inside <body> as a container
//$enable-semantic-container: true,
/// Enable responsive typography, Fixed root element size if disabled
//$enable-responsive-typography: true,
/// Enable responsive spacings for <header>, <main>, <footer>, <section>
//$enable-responsive-spacings: false,
/// Enable a centered viewport for <header>, <main>, <footer> inside <body>
/// This option will only work if $enable-maxwidth: false
//$enable-viewport: false,
/// xs: Extra small (portrait phones)
/// sm: Small(landscape phones)
/// md: Medium(tablets)
/// lg: Large(desktops)
/// xl: Extra large (large desktops)
/// Breakpoints
//$breakpoints: (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px),
/// Viewports
//$viewports: (sm: 510px, md: 700px, lg: 920px, xl: 1130px),
//$document: true,//Content-box & Responsive typography
//$typography: true,//a, headings, p, ul, blockquote
//$sectioning: true,//responsive Container, header, main, footer
//$nav: true,//Horizontal Navigation at top of page
//$embedded: true,//Embedded content, iframe, video, images, etc.
//$table: true,//table specific elements
//$code: true,//codeblocks, code, pre, kbd
//$hr: true,//Horizontal Rule
//$scroller: true,//Horizontal scroller (<figure>)
//$button: true,//Form elements (button)
//$form: true,//Form elements (non-button)
//$top: true,//back to top button using CSS
//$search: true,//search feature
//$blocks: true,//css classes for block formatting, eg: recent posts, table of contents, series navigation
//$series: true,//series navigation list
//$modifiers: true,//tiny modifier classes for sizing, spacing, etc.
//$misc: false,
//$grid: true,//Infinity Grid, column based layouts.
//$syntax: true,//syntax highlighting for code blocks
);
@use "extra";
/******************************************************************************
* FONTS - Abridge by default uses the System Font Stack
* https://css-tricks.com/snippets/css/system-font-stack/
* However if you need you can load a specific font below,
* make sure to have the relevant woff2 fonts in your static/fonts folder
* I measured the least Cumulative Layout Shift with: Roboto, Lato, Arimo
*****************************************************************************/
// @use "fonts/Roboto";
// @use "fonts/Arimo";
// @use "fonts/CMUSansSerif";
@use "fonts/CMUSerif";
@font-face {
font-family: 'Arimo';
src: local("Arimo"), url("fonts/Arimo.woff2");//latin regular
font-display: swap;
}
@font-face {
font-family: 'Arimo';
src: local("Arimo-Italic"), url("fonts/Arimo-Italic.woff2");//latin italic
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Arimo';
src: local("Arimo-Bold"), url("fonts/Arimo-Bold.woff2");//latin bold
font-weight: bold;
font-display: swap;
}
@font-face {
font-family: 'CMUSansSerif';
src: local("CMUSansSerif"), url("fonts/CMUSansSerif.woff2"); //latin regular
font-display: swap;
}
@font-face {
font-family: 'CMUSansSerif';
src: local("CMUSansSerif-Oblique"), url("fonts/CMUSansSerif-Oblique.woff2"); //latin italic
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'CMUSansSerif';
src: local("CMUSansSerif-Bold"), url("fonts/CMUSansSerif-Bold.woff2"); //latin bold
font-weight: bold;
font-display: swap;
}
@font-face {
font-family: 'CMUSerif';
src: local("CMUSerif-Roman"), url("fonts/CMUSerif-Roman.woff2"); //latin regular
font-display: swap;
}
@font-face {
font-family: 'CMUSerif';
src: local("CMUSerif-Italic"), url("fonts/CMUSerif-Italic.woff2"); //latin italic
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'CMUSerif';
src: local("CMUSerif-Bold"), url("fonts/CMUSerif-Bold.woff2"); //latin bold
font-weight: bold;
font-display: swap;
}
File added
File added
File added
File added
File added
File added
File added
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment