diff options
29 files changed, 156 insertions, 93 deletions
diff --git a/config.toml b/config.toml index 9596e57..efb0ec8 100644 --- a/config.toml +++ b/config.toml @@ -11,3 +11,9 @@ allow = ['^dart-sass-embedded$', '^go$', '^npx$', '^postcss$', '^pandoc$'] [markup.goldmark] [markup.goldmark.renderer] unsafe = true + +[server] +[[server.headers]] + for = "/**" + [server.headers.values] + Content-Security-Policy = "default-src 'self' 'unsafe-inline';" diff --git a/content/_index.md b/content/_index.md index 833d7b3..47e1c33 100644 --- a/content/_index.md +++ b/content/_index.md @@ -4,14 +4,13 @@ date: 2021-02-22T17:15:50+01:00 draft: false --- -Welcome to my website. +<img src="/logo256.png" class="darkinv" style="border: 2px solid #121212;"> -Once in a blue moon, I'll post something here -related to my areas of interest: -programming, optimization, -mathematics, physics and even linguistics. +Welcome to my website. -You might be interested in my [knowledge base](/know/), +Once in a blue moon, I post something related to my areas of interest: +physics, mathematics, programming and even linguistics. +Perhaps you're interested in my [knowledge base](/know/), where I explain STEM concepts I've learned over the years. This website is made by me using [Hugo](https://gohugo.io), diff --git a/content/blog/2022/email-server-revisited/index.md b/content/blog/2022/email-server-revisited/index.md index 3f45993..838fe24 100644 --- a/content/blog/2022/email-server-revisited/index.md +++ b/content/blog/2022/email-server-revisited/index.md @@ -184,7 +184,7 @@ and OpenSMTPD reported it had been unable to make the delivery, because Microsoft had thrown an error: <a href="microsoft-bounce.png"> -<img src="microsoft-bounce.png" style="width:100%;display:block;margin:auto;"> +<img src="microsoft-bounce.png" class="darkinv" style="width:100%"> </a> To their credit, they seem to be offering a way out. diff --git a/content/know/concept/bernstein-vazirani-algorithm/index.pdc b/content/know/concept/bernstein-vazirani-algorithm/index.pdc index 22de51a..40f41be 100644 --- a/content/know/concept/bernstein-vazirani-algorithm/index.pdc +++ b/content/know/concept/bernstein-vazirani-algorithm/index.pdc @@ -42,7 +42,7 @@ allows a quantum computer to do it with only a single query. It uses the following circuit: <a href="bernstein-vazirani-circuit.png"> -<img src="bernstein-vazirani-circuit.png" style="width:52%;display:block;margin:auto;"> +<img src="bernstein-vazirani-circuit.png" style="width:52%"> </a> Where $U_f$ is a phase oracle, diff --git a/content/know/concept/bloch-sphere/index.pdc b/content/know/concept/bloch-sphere/index.pdc index 27abb54..7f0dfda 100644 --- a/content/know/concept/bloch-sphere/index.pdc +++ b/content/know/concept/bloch-sphere/index.pdc @@ -19,7 +19,7 @@ the **Bloch sphere** is an invaluable tool to visualize qubits. All pure qubit states are represented by a point on the sphere's surface: <a href="bloch.jpg"> -<img src="bloch-small.jpg" style="width:50%;display:block;margin:auto;"> +<img src="bloch-small.jpg" style="width:50%"> </a> The $x$, $y$ and $z$-axes represent the components of a spin-1/2-alike system, diff --git a/content/know/concept/deutsch-jozsa-algorithm/index.pdc b/content/know/concept/deutsch-jozsa-algorithm/index.pdc index a3acaf4..d8dce8d 100644 --- a/content/know/concept/deutsch-jozsa-algorithm/index.pdc +++ b/content/know/concept/deutsch-jozsa-algorithm/index.pdc @@ -46,7 +46,7 @@ To do this, we use the following quantum circuit, where $U_f$ is the oracle we query: <a href="deutsch-circuit.png"> -<img src="deutsch-circuit.png" style="width:48%;display:block;margin:auto;"> +<img src="deutsch-circuit.png" style="width:48%"> </a> Due to unitarity constraints, @@ -147,7 +147,7 @@ other possibilities are assumed to be impossible. This algorithm is then implemented by the following quantum circuit: <a href="deutsch-jozsa-circuit.png"> -<img src="deutsch-jozsa-circuit.png" style="width:52%;display:block;margin:auto;"> +<img src="deutsch-jozsa-circuit.png" style="width:52%"> </a> There are $N$ qubits in initial state $\ket{0}$, and one in $\ket{1}$. diff --git a/content/know/concept/dispersive-broadening/index.pdc b/content/know/concept/dispersive-broadening/index.pdc index cae856d..6efda9f 100644 --- a/content/know/concept/dispersive-broadening/index.pdc +++ b/content/know/concept/dispersive-broadening/index.pdc @@ -65,7 +65,7 @@ with parameter values $T_0 = 1\:\mathrm{ps}$, $P_0 = 1\:\mathrm{kW}$, $\beta_2 = -10 \:\mathrm{ps}^2/\mathrm{m}$ and $\gamma = 0$: <a href="pheno-disp.jpg"> -<img src="pheno-disp-small.jpg"> +<img src="pheno-disp-small.jpg" style="width:100%"> </a> The **instantaneous frequency** $\omega_\mathrm{GVD}(z, t)$, diff --git a/content/know/concept/fabry-perot-cavity/index.pdc b/content/know/concept/fabry-perot-cavity/index.pdc index e4195d0..066749c 100644 --- a/content/know/concept/fabry-perot-cavity/index.pdc +++ b/content/know/concept/fabry-perot-cavity/index.pdc @@ -25,7 +25,7 @@ The cavity $C$ has length $\ell$ and is centered on $x = 0$. Let $n_L$, $n_C$ and $n_R$ be the respective domains' refractive indices: <a href="cavity.png"> -<img src="cavity.png" style="width:70%;display:block;margin:auto;"> +<img src="cavity.png" style="width:70%"> </a> diff --git a/content/know/concept/feynman-diagram/index.pdc b/content/know/concept/feynman-diagram/index.pdc index 600be61..98ed668 100644 --- a/content/know/concept/feynman-diagram/index.pdc +++ b/content/know/concept/feynman-diagram/index.pdc @@ -43,7 +43,7 @@ and $\mathcal{T}\{\}$ denote the [time-ordered product](/know/concept/time-ordered-product/): <a href="freegf.png"> -<img src="freegf.png" style="width:60%;display:block;margin:auto;"> +<img src="freegf.png" style="width:60%"> </a> $$\begin{aligned} = i \hbar G_{s_2 s_1}^0(\vb{r}_2, t_2; \vb{r}_1, t_1) @@ -64,7 +64,7 @@ a causal Green's function $G$ for the entire Hamiltonian $\hat{H}$, where the subscript $H$ refers to the [Heisenberg picture](/know/concept/heisenberg-picture/): <a href="fullgf.png"> -<img src="fullgf.png" style="width:60%;display:block;margin:auto;"> +<img src="fullgf.png" style="width:60%"> </a> $$\begin{aligned} = i \hbar G_{s_2 s_1}(\vb{r}_2, t_2; \vb{r}_1, t_1) @@ -79,7 +79,7 @@ hence it starts and ends at the same time, and no arrow is drawn: <a href="interaction.png"> -<img src="interaction.png" style="width:60%;display:block;margin:auto;"> +<img src="interaction.png" style="width:60%"> </a> $$\begin{aligned} = \frac{1}{i \hbar} W_{s_2 s_1}(\vb{r}_2, t_2; \vb{r}_1, t_1) @@ -102,7 +102,7 @@ One-body (time-dependent) operators $\hat{V}$ in $\hat{H}_1$ are instead represented by a special vertex: <a href="perturbation.png"> -<img src="perturbation.png" style="width:35%;display:block;margin:auto;"> +<img src="perturbation.png" style="width:35%"> </a> $$\begin{aligned} = \frac{1}{i \hbar} V_s(\vb{r}, t) @@ -179,7 +179,7 @@ Consider the following diagram and the resulting expression, where $\tilde{\vb{r}} = (\vb{r}, t)$, and $\tilde{\vb{k}} = (\vb{k}, \omega)$: <a href="conservation.png"> -<img src="conservation.png" style="width:40%;display:block;margin:auto;"> +<img src="conservation.png" style="width:40%"> </a> $$\begin{aligned} &= (i \hbar)^3 \sum_{s s'} \!\!\iint \dd{\tilde{\vb{r}}} \dd{\tilde{\vb{r}}'} diff --git a/content/know/concept/metacentric-height/index.pdc b/content/know/concept/metacentric-height/index.pdc index 1fc6aca..1668cc0 100644 --- a/content/know/concept/metacentric-height/index.pdc +++ b/content/know/concept/metacentric-height/index.pdc @@ -32,7 +32,7 @@ as is illustrated in the following sketch of our choice of coordinate system: <a href="sketch.png"> -<img src="sketch.png" style="width:67%;display:block;margin:auto;"> +<img src="sketch.png" style="width:67%"> </a> Here, $B$ is the **center of buoyancy**, equal to diff --git a/content/know/concept/modulational-instability/index.pdc b/content/know/concept/modulational-instability/index.pdc index 993dec9..a0c2c91 100644 --- a/content/know/concept/modulational-instability/index.pdc +++ b/content/know/concept/modulational-instability/index.pdc @@ -178,7 +178,7 @@ $$\begin{aligned} \end{aligned}$$ <a href="pheno-mi.jpg"> -<img src="pheno-mi-small.jpg"> +<img src="pheno-mi-small.jpg" style="width:100%"> </a> Where $L_\mathrm{NL} = 1/(\gamma P_0)$ is the characteristic length of nonlinear effects. diff --git a/content/know/concept/optical-wave-breaking/index.pdc b/content/know/concept/optical-wave-breaking/index.pdc index 30305f5..ecd5a4f 100644 --- a/content/know/concept/optical-wave-breaking/index.pdc +++ b/content/know/concept/optical-wave-breaking/index.pdc @@ -40,7 +40,7 @@ small waves start "falling off" the edge of the pulse, hence the name *wave breaking*: <a href="pheno-break-inst.jpg"> -<img src="pheno-break-inst-small.jpg"> +<img src="pheno-break-inst-small.jpg" style="width:100%"> </a> Several interesting things happen around this moment. @@ -59,7 +59,7 @@ which eventually melt together, leading to a trapezoid shape in the $t$-domain. Dispersive broadening then continues normally: <a href="pheno-break-sgram.jpg"> -<img src="pheno-break-sgram-small.jpg" style="width:80%;display:block;margin:auto;"> +<img src="pheno-break-sgram-small.jpg" style="width:80%"> </a> We call the distance at which the wave breaks $L_\mathrm{WB}$, @@ -189,7 +189,7 @@ This prediction for $L_\mathrm{WB}$ appears to agree well with the OWB observed in the simulation: <a href="pheno-break.jpg"> -<img src="pheno-break-small.jpg"> +<img src="pheno-break-small.jpg" style="width:100%"> </a> Because all spectral broadening up to $L_\mathrm{WB}$ is caused by SPM, diff --git a/content/know/concept/quantum-fourier-transform/index.pdc b/content/know/concept/quantum-fourier-transform/index.pdc index 5a3de7b..cfdbc07 100644 --- a/content/know/concept/quantum-fourier-transform/index.pdc +++ b/content/know/concept/quantum-fourier-transform/index.pdc @@ -178,7 +178,7 @@ excluding the swapping part to get the right order. Here, $R_m$ means $R_\phi$ with $\phi = 2 \pi / 2^m$: <a href="qft-circuit-noswap.png"> -<img src="qft-circuit-noswap.png" style="width:100%;display:block;margin:auto;"> +<img src="qft-circuit-noswap.png" style="width:100%"> </a> Again, note how the inputs $\ket{x_j}$ and outputs $\ket{k_j}$ are in the opposite order. @@ -186,7 +186,7 @@ The complete circuit, including the swapping at the end, therefore looks like this: <a href="qft-circuit-swap.png"> -<img src="qft-circuit-swap.png" style="width:85%;display:block;margin:auto;"> +<img src="qft-circuit-swap.png" style="width:85%"> </a> For each of the $n$ qubits, $\mathcal{O}(n)$ gates are applied, diff --git a/content/know/concept/quantum-gate/index.pdc b/content/know/concept/quantum-gate/index.pdc index 189145f..b9682ec 100644 --- a/content/know/concept/quantum-gate/index.pdc +++ b/content/know/concept/quantum-gate/index.pdc @@ -209,7 +209,7 @@ With that said, the first two-qubit gate is $\mathrm{SWAP}$, which simply swaps $\ket{\psi_1}$ and $\ket{\psi_2}$: <a href="swap.png"> -<img src="swap.png" style="width:22%;display:block;margin:auto;"> +<img src="swap.png" style="width:22%"> </a> $$\begin{aligned} @@ -238,7 +238,7 @@ Next, there is the **controlled NOT gate** $\mathrm{CNOT}$, which "flips" (applies $X$ to) $\ket{\psi_2}$ if $\ket{\psi_1}$ is true: <a href="cnot.png"> -<img src="cnot.png" style="width:22%;display:block;margin:auto;"> +<img src="cnot.png" style="width:22%"> </a> $$\begin{aligned} @@ -265,7 +265,7 @@ we can define a two-qubit **controlled U gate** $\mathrm{CU}$, which applies $U$ to $\ket{\psi_2}$ if $\ket{\psi_1}$ is true: <a href="cu.png"> -<img src="cu.png" style="width:22%;display:block;margin:auto;"> +<img src="cu.png" style="width:22%"> </a> $$\begin{aligned} diff --git a/content/know/concept/random-phase-approximation/index.pdc b/content/know/concept/random-phase-approximation/index.pdc index ed85106..0089dff 100644 --- a/content/know/concept/random-phase-approximation/index.pdc +++ b/content/know/concept/random-phase-approximation/index.pdc @@ -77,21 +77,21 @@ i.e. the ones where all $n$ interaction lines carry the same momentum and energy: <a href="rpasigma.png"> -<img src="rpasigma.png" style="width:92%;display:block;margin:auto;"> +<img src="rpasigma.png" style="width:92%"> </a> Where we have defined the **screened interaction** $W^\mathrm{RPA}$, denoted by a double wavy line: <a href="screened.png"> -<img src="screened.png" style="width:95%;display:block;margin:auto;"> +<img src="screened.png" style="width:95%"> </a> Rearranging the above sequence of diagrams quickly leads to the following [Dyson equation](/know/concept/dyson-equation/): <a href="dyson.png"> -<img src="dyson.png" style="width:55%;display:block;margin:auto;"> +<img src="dyson.png" style="width:55%"> </a> In Fourier space, this equation's linear shape @@ -110,7 +110,7 @@ Abbreviating $\tilde{\vb{k}} \equiv (\vb{k}, i \omega_n^B)$ and $\tilde{\vb{q}} \equiv (\vb{q}, i \omega_n^F)$: <a href="pairbubble.png"> -<img src="pairbubble.png" style="width:45%;display:block;margin:auto;"> +<img src="pairbubble.png" style="width:45%"> </a> We isolate the Dyson equation for $W^\mathrm{RPA}$, diff --git a/content/know/concept/repetition-code/index.pdc b/content/know/concept/repetition-code/index.pdc index 7245cbc..d9eec2c 100644 --- a/content/know/concept/repetition-code/index.pdc +++ b/content/know/concept/repetition-code/index.pdc @@ -82,7 +82,7 @@ Such a transformation is easy to achieve with the following sequence of [quantum gates](/know/concept/quantum-gate/): <a href="bit-flip-encode.png"> -<img src="bit-flip-encode.png" style="width:32%;display:block;margin:auto;"> +<img src="bit-flip-encode.png" style="width:32%"> </a> So, a little while after encoding the state $\ket{\psi}$ like that, @@ -208,7 +208,7 @@ by applying $\mathrm{CNOT}$s to some ancillary qubits and then measuring those: <a href="bit-flip-detect.png"> -<img src="bit-flip-detect.png" style="width:62%;display:block;margin:auto;"> +<img src="bit-flip-detect.png" style="width:62%"> </a> The two measurements, respectively representing $ZZI$ and $IZZ$, @@ -260,7 +260,7 @@ $$\begin{aligned} \end{aligned}$$ <a href="phase-flip-encode.png"> -<img src="phase-flip-encode.png" style="width:40%;display:block;margin:auto;"> +<img src="phase-flip-encode.png" style="width:40%"> </a> A phase flip along the $Z$-axis @@ -269,7 +269,7 @@ In this case, the stabilizers are $XXI$ and $IXX$, and the error detection circuit is as follows: <a href="phase-flip-detect.png"> -<img src="phase-flip-detect.png" style="width:70%;display:block;margin:auto;"> +<img src="phase-flip-detect.png" style="width:70%"> </a> This system protects us against all single-qubit phase flips, @@ -313,7 +313,7 @@ which simply consists of the phase flip encoder, followed by 3 copies of the bit flip encoder: <a href="shor-code-encode.png"> -<img src="shor-code-encode.png" style="width:55%;display:block;margin:auto;"> +<img src="shor-code-encode.png" style="width:55%"> </a> We thus use 9 physical qubits to store 1 logical qubit. diff --git a/content/know/concept/rutherford-scattering/index.pdc b/content/know/concept/rutherford-scattering/index.pdc index c89b477..d91ae40 100644 --- a/content/know/concept/rutherford-scattering/index.pdc +++ b/content/know/concept/rutherford-scattering/index.pdc @@ -25,7 +25,7 @@ Coulomb repulsion causes 1 to deflect by an angle $\theta$, and pushes 2 away in the process: <a href="two-body.png"> -<img src="two-body.png" style="width:50%;display:block;margin:auto;"> +<img src="two-body.png" style="width:50%"> </a> Here, $b$ is called the **impact parameter**. @@ -75,7 +75,7 @@ we can see that $v_x$ is unchanged for any given $\pm t$, while $v_y$ simply changes sign: <a href="one-body.png"> -<img src="one-body.png" style="width:60%;display:block;margin:auto;"> +<img src="one-body.png" style="width:60%"> </a> From our expression for $\vb{r}$, diff --git a/content/know/concept/self-energy/index.pdc b/content/know/concept/self-energy/index.pdc index 935cca8..c6aa0c5 100644 --- a/content/know/concept/self-energy/index.pdc +++ b/content/know/concept/self-energy/index.pdc @@ -210,7 +210,7 @@ so we are left with non-equivalent diagrams only. Let $G(b,a) = G_{ba}$: <a href="fullgf.png"> -<img src="fullgf.png" style="width:90%;display:block;margin:auto;"> +<img src="fullgf.png" style="width:90%"> </a> A **reducible diagram** is a Feynman diagram @@ -223,7 +223,7 @@ as the sum of all irreducible terms in $G(b,a)$, after removing the two external lines from/to $a$ and $b$: <a href="selfenergy.png"> -<img src="selfenergy.png" style="width:90%;display:block;margin:auto;"> +<img src="selfenergy.png" style="width:90%"> </a> Despite its appearance, the self-energy has the semantics of a line, @@ -244,7 +244,7 @@ you can convince youself that $G(b,a)$ obeys a [Dyson equation](/know/concept/dyson-equation/) involving $\Sigma(y, x)$: <a href="dyson.png"> -<img src="dyson.png" style="width:95%;display:block;margin:auto;"> +<img src="dyson.png" style="width:95%"> </a> This makes sense: in the "normal" Dyson equation diff --git a/content/know/concept/self-phase-modulation/index.pdc b/content/know/concept/self-phase-modulation/index.pdc index 3d33746..64f68d4 100644 --- a/content/know/concept/self-phase-modulation/index.pdc +++ b/content/know/concept/self-phase-modulation/index.pdc @@ -72,7 +72,7 @@ $$\begin{aligned} \end{aligned}$$ <a href="pheno-spm.jpg"> -<img src="pheno-spm-small.jpg"> +<img src="pheno-spm-small.jpg" style="width:100%"> </a> The **instantaneous frequency** $\omega_\mathrm{SPM}(z, t)$, diff --git a/content/know/concept/self-steepening/index.pdc b/content/know/concept/self-steepening/index.pdc index 7349854..808240b 100644 --- a/content/know/concept/self-steepening/index.pdc +++ b/content/know/concept/self-steepening/index.pdc @@ -119,7 +119,7 @@ which turns out to be accurate, although the simulation breaks down due to insufficient resolution: <a href="pheno-steep.jpg"> -<img src="pheno-steep-small.jpg"> +<img src="pheno-steep-small.jpg" style="width:100%"> </a> Unfortunately, self-steepening cannot be simulated perfectly: as the diff --git a/content/know/concept/shors-algorithm/index.pdc b/content/know/concept/shors-algorithm/index.pdc index 643337c..8fc528e 100644 --- a/content/know/concept/shors-algorithm/index.pdc +++ b/content/know/concept/shors-algorithm/index.pdc @@ -52,7 +52,7 @@ To do this, the following $2q$-qubit quantum circuit is used, with $q$ chosen so that $N^2 \le 2^q < 2 N^2$: <a href="shors-circuit.png"> -<img src="shors-circuit.png" style="width:70%;display:block;margin:auto;"> +<img src="shors-circuit.png" style="width:70%"> </a> Here, $\mathrm{QFT}_q$ refers to the $q$-qubit diff --git a/content/know/concept/simons-algorithm/index.pdc b/content/know/concept/simons-algorithm/index.pdc index f6b7d69..a8c5eb1 100644 --- a/content/know/concept/simons-algorithm/index.pdc +++ b/content/know/concept/simons-algorithm/index.pdc @@ -57,8 +57,8 @@ A quantum computer needs to query $f$ only $\mathcal{O}(n)$ times, although the exact number varies due to the algorithm's probabilistic nature. It uses the following circuit: -<a href="simons-circuit.png" style="width:52%;display:block;margin:auto;"> -<img src="simons-circuit.png"> +<a href="simons-circuit.png"> +<img src="simons-circuit.png" style="width:52%"> </a> The XOR oracle $U_f$ implements $f$, diff --git a/content/know/concept/step-index-fiber/index.pdc b/content/know/concept/step-index-fiber/index.pdc index 8847fff..4ca2ade 100644 --- a/content/know/concept/step-index-fiber/index.pdc +++ b/content/know/concept/step-index-fiber/index.pdc @@ -246,7 +246,7 @@ $$\begin{aligned} \end{aligned}$$ <a href="bessel.jpg"> -<img src="bessel.jpg" style="width:90%;display:block;margin:auto;"> +<img src="bessel.jpg" style="width:100%"> </a> Looking at these solutions with our constraints for $R_o$ in mind, @@ -400,7 +400,7 @@ is illustrated below for a fiber with $V = 5$, where red and blue respectively denote the left and right-hand side: <a href="modes.jpg"> -<img src="modes.jpg" style="width:90%;display:block;margin:auto;"> +<img src="modes.jpg" style="width:100%"> </a> This shows that each $\mathrm{LP}_{\ell m}$ has an associated cut-off $V_{\ell m}$, diff --git a/content/know/concept/toffoli-gate/index.pdc b/content/know/concept/toffoli-gate/index.pdc index f3ab0ba..f0b39ad 100644 --- a/content/know/concept/toffoli-gate/index.pdc +++ b/content/know/concept/toffoli-gate/index.pdc @@ -22,7 +22,7 @@ and flips $C$ if both $A$ and $B$ are true. In circuit diagrams, its representation is: <a href="toffoli.png"> -<img src="toffoli.png" style="width:19%;display:block;margin:auto;"> +<img src="toffoli.png" style="width:19%"> </a> This gate is reversible, because $A$ and $B$ are preserved, @@ -31,7 +31,7 @@ Moreover, this gate is universal, because we can make a NAND gate from it: <a href="nand.png"> -<img src="nand.png" style="width:38%;display:block;margin:auto;"> +<img src="nand.png" style="width:38%"> </a> A NAND is enough to implement every conceivable circuit. @@ -39,15 +39,15 @@ That said, we can efficiently implement NOT, AND, and XOR using a single Toffoli Note that NOT is a special case of NAND: <a href="not.png"> -<img src="not.png" style="width:32%;display:block;margin:auto;"> +<img src="not.png" style="width:32%"> </a> <a href="and.png"> -<img src="and.png" style="width:35%;display:block;margin:auto;"> +<img src="and.png" style="width:35%"> </a> <a href="xor.png"> -<img src="xor.png" style="width:35%;display:block;margin:auto;"> +<img src="xor.png" style="width:35%"> </a> Using these, we can, as an example, make an OR gate @@ -56,7 +56,7 @@ thanks to the fact that $A \lor B = \neg (\neg A \land \neg B)$, i.e. OR is NAND of NOT $A$ and NOT $B$: <a href="or.png"> -<img src="or.png" style="width:50%;display:block;margin:auto;"> +<img src="or.png" style="width:50%"> </a> Thanks to its reversibility and universality, diff --git a/layouts/home.html b/layouts/home.html index 58fce38..af50f09 100644 --- a/layouts/home.html +++ b/layouts/home.html @@ -6,7 +6,6 @@ </head> <body> {{ partial "navigation.html" . }} -<img src="/logo256x256.gif" style="float:left;margin-right:16px;border:2px solid #666"> {{ .Content }} {{ partial "footer.html" . }} </body> diff --git a/layouts/know/single.html b/layouts/know/single.html index 122b20e..3deff24 100644 --- a/layouts/know/single.html +++ b/layouts/know/single.html @@ -4,12 +4,6 @@ {{ partial "head.html" . }} {{ partial "mathjax.html" . }} <title>{{ .Title }} | {{ .Site.Title }}</title> -<style> -img {max-width:100%; height:auto;} -@media (prefers-color-scheme: dark) { -img {filter:invert(100%);} -} -</style> </head> <body> {{ partial "navigation.html" . }} diff --git a/static/logo256.png b/static/logo256.png Binary files differnew file mode 100644 index 0000000..d6b9961 --- /dev/null +++ b/static/logo256.png diff --git a/static/logo256x256.gif b/static/logo256x256.gif Binary files differdeleted file mode 100644 index a778340..0000000 --- a/static/logo256x256.gif +++ /dev/null diff --git a/static/main.css b/static/main.css index b9ac894..f275aa6 100644 --- a/static/main.css +++ b/static/main.css @@ -1,34 +1,99 @@ +/* Colour scheme */ +:root { + --b: #ededed; + --f: #121212; + --a: #0000ff; +} +.darkinv {} +@media only screen and (prefers-color-scheme: dark) { + :root { + --b: #121212; + --f: #ededed; + --a: #ffff00; + } + .darkinv {filter: invert(100%)} +} + +/* Basic elements */ body { - background:#e3e3e3; - color:#161616; - max-width:80ch; - margin:auto; - padding:1em 0; - font-family:sans-serif; -} -h1,h2,h3 {text-align:center} -h1 {font-size:200%;} -h2 {font-size:160%;} -h3 {font-size:120%;} -a {text-decoration:none;color:#0000ff;} -.noha a:link, .noha a:visited {color:#161616;} -.noha a:hover, .noha a:focus, .noha a:active {color:#0000ff;} -.nav {height:3rem;font-size:250%;} -.navl {float:left;text-align:left;} -.navr {float:right;text-align:right;} -.footl {float:left;text-align:left;} -.footr {float:right;text-align:right;} -pre {filter:invert(100%);} -@media (prefers-color-scheme: dark) { - body {background:#161616;filter:invert(100%);} + background: #ededed; + background: var(--b); + color: #121212; + color: var(--f); + + max-width: 80ch; + margin: auto; + padding: 1rem 0; + + font-family: sans-serif; + line-height: 1.5; +} +h1,h2,h3 {text-align: center;} |