Téléversement initial
This commit is contained in:
5
archetypes/default.md
Executable file
5
archetypes/default.md
Executable file
@@ -0,0 +1,5 @@
|
|||||||
|
+++
|
||||||
|
title = '{{ replace .File.ContentBaseName "-" " " | title }}'
|
||||||
|
date = {{ .Date }}
|
||||||
|
draft = true
|
||||||
|
+++
|
||||||
9
assets/css/extended/sb.Sass
Executable file
9
assets/css/extended/sb.Sass
Executable file
@@ -0,0 +1,9 @@
|
|||||||
|
.profile img {
|
||||||
|
/* Éviter les découpes dans le logo de titre */
|
||||||
|
border-radius: 0%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark .profile img {
|
||||||
|
/* Inverser la couleur de l'image avec un passage en mode sombre */
|
||||||
|
filter: invert(0.7);
|
||||||
|
}
|
||||||
19
content/about/index.md
Executable file
19
content/about/index.md
Executable file
@@ -0,0 +1,19 @@
|
|||||||
|
---
|
||||||
|
menu: main
|
||||||
|
weight: 100
|
||||||
|
date: 2024-02-21
|
||||||
|
title: À propos
|
||||||
|
categories:
|
||||||
|
- Le site
|
||||||
|
---
|
||||||
|
|
||||||
|
Bienvenu sur **SlowBrain . net**
|
||||||
|
|
||||||
|
Petit site personnel d’un technicien passionné et touche à tout (notamment dans le domaine du numérique), curieux et engagé, avec cette envie de comprendre, d’expérimenter et de transmettre : Le but de ce site.
|
||||||
|
|
||||||
|
Variant les formes au cours de sa carrière, l’envie d’une refonte profonde se fait sentir dans les années 2020.
|
||||||
|
Mais ce n'est pas (que) cette période un peu floue de notre histoire que nous commencions à vivre, mais plus un besoin plus profond de remise en question personnelle. Ce qui explique qu'il aura fallu presque quatre ans (et beaucoup d'essais non publics) pour arriver à ce que vous voyez.
|
||||||
|
|
||||||
|
Un grand tri dont il ne reste que quelques contenus d'[archives](/archive) de l'ancien site, un site plus sobre, visuellement et techniquement, avec des contenus plus structurés et faits pour le temps long, bien plus que le blog qu'il n'était pendant longtemps.
|
||||||
|
|
||||||
|
Je vous laisse partir à la découverte de mes univers, et vous y souhaite une bonne lecture.
|
||||||
55
content/archive/1001011-1101111.md
Executable file
55
content/archive/1001011-1101111.md
Executable file
@@ -0,0 +1,55 @@
|
|||||||
|
---
|
||||||
|
menu: savoirs
|
||||||
|
title: 1001011-1101111
|
||||||
|
url: /1001011-1101111
|
||||||
|
date: 2016-08-10T06:00:00+00:00
|
||||||
|
weight: 12
|
||||||
|
description: Article original du 6 Aout 2016
|
||||||
|
---
|
||||||
|
Les ordinateurs sont des machines électroniques, et le principe fondamental de leurs fonctionnements est le courant électrique présent (1) ou absent (0) de leurs différents composants élémentaires.
|
||||||
|
|
||||||
|
Ce fonctionnement à deux états, ou binaire, d’un ordinateur lui donne une affinité particulière pour les puissances de 2, qui sont pour la machine des chiffres « rond ».
|
||||||
|
(2 4 8 16 32 64 128 256 512 1024 2048 4096 8192 …)
|
||||||
|
|
||||||
|
Il est cependant rare, car cela ne reviendrait à compter que jusqu'à 1, de faire un traitement avec un seul de ces éléments binaires (un Bit).
|
||||||
|
|
||||||
|
La convention étant de les regrouper par paquets de 8 pour constituer l’octet. 8 Bits = 1 Octet
|
||||||
|
|
||||||
|
Un octet pouvant contenir 2⁸ = 256 valeurs (de 0 jusqu'à 255) différentes. Suffisamment pour faire des traitements intéressants.
|
||||||
|
|
||||||
|
|
||||||
|
Et si les traitements sont plus complexes ?
|
||||||
|
|
||||||
|
On multiplie les octets (par une puissance de 2) pour faire des « mots » de plusieurs octets.
|
||||||
|
|
||||||
|
Pour faire le parallèle avec mon article précédent, les CPU modernes traitent des mots de 2³ = 8 Octets = 32 Bits ou 2⁴ = 8 Octets = 64 Bits.
|
||||||
|
|
||||||
|
## Une mémoire d’éléphant
|
||||||
|
|
||||||
|
Si quelques octets sont une valeur commode pour faire du traitement, cela devient vite étriqué quand il est nécessaire de faire du stockage, même de faible quantité.
|
||||||
|
Comme pour toutes unités modestes, on utilise des multiples.
|
||||||
|
|
||||||
|
Mais si 1 km = 1000 m, 1 kg = 1000 g, 1 kW = 1000 w… cela est un peu moins simple dans le domaine de l’informatique.
|
||||||
|
|
||||||
|
Si l’on suit la logique humaine, 1 Ko = 1000 Octets, mais si on l’adapte à la logique informatique, l’égalité 1 Ko = 1024 Octets s’éloigne peu de la logique humaine, tout en étant bien plus facile à gérer par les ordinateurs.
|
||||||
|
|
||||||
|
|
||||||
|
On en arrive donc dans les années 80 à utiliser une logique informatique pour la multiplication des Octets.
|
||||||
|
|
||||||
|
1 Ko = 1 024 Octet
|
||||||
|
|
||||||
|
1 Mo = 1 024 Ko = 1 048 576 Octets
|
||||||
|
|
||||||
|
1 Go = 1 024 Mo = 1 028 576 Ko = 1 073 741 824 Octet
|
||||||
|
|
||||||
|
## Le marché de l’octet
|
||||||
|
|
||||||
|
La logique informatique (Binaire) donne donc des « ko » plus gros que la logique Humaine (Décimale).
|
||||||
|
|
||||||
|
Mais il est commercialement plus rentable de vendre des « Ko » plus petits, car cela permet d’en vendre plus : 7 % de plus par Gigaoctet (Go) et 9 % par Téraoctet (To).
|
||||||
|
|
||||||
|
Les deux formats coexistant alors, avec des valeurs finalement différentes, avec des Kilos humains (1 Ko = 1000 Octets) et des Kilos informatiques (1 Ko = 1024 Octets).
|
||||||
|
|
||||||
|
Un nouveau système de notation a été défini, gardant les « Ko », « Mo », « Go », « To » pour la notation humaine, et créant les « Kio », « Mio », « Gio », « Tio » pour la notation informatique. Ceci permettant une vraie distinction entre les deux valeurs, et évitant de bouleverser la notation commerciale.
|
||||||
|
|
||||||
|
L'utilisation de cette nouvelle notation, pour les kilos informatiques, est parfois assez incertaine.
|
||||||
103
content/archive/32-ou-64-bits.md
Executable file
103
content/archive/32-ou-64-bits.md
Executable file
@@ -0,0 +1,103 @@
|
|||||||
|
---
|
||||||
|
#menu: savoirs
|
||||||
|
title: 32 ou 64 Bits ?
|
||||||
|
url: /32-ou-64-bits
|
||||||
|
date: 2016-07-28T07:00:00+00:00
|
||||||
|
weight: 13
|
||||||
|
description: Article original du 28 juillet 2016, révisé en 2023
|
||||||
|
---
|
||||||
|
Petit article technique sur une évidence finalement pas si claire.
|
||||||
|
|
||||||
|
## CPU
|
||||||
|
Parmi les multiples unités de calcul que contient un ordinateur, l’unité de calcul centrale, ou en anglais « Central Processor Unit », d’où l’abréviation CPU, est l’un des plus importants, et souvent celui pris en référence.
|
||||||
|
|
||||||
|
Ces unités font des opérations sur des « mots » de données : des suites de 1 et 0 d'une taille dépendante de la génération de l'unité de calcul.
|
||||||
|
|
||||||
|
Une unité de calcul pouvant gérer des mots d'une longueur de 32 unités (1 ou 0, des bits) est dite « 32 bits ».
|
||||||
|
|
||||||
|
C'est la différence fondamentale entre les « 16 Bits », les « 32 Bits » et les « 64 Bits » : La taille des mots que l'unité est capable de traiter.
|
||||||
|
|
||||||
|
Attention : Un CPU 64 Bits, même s'il gagne en performance, n'en devient pas deux fois plus puissant que son équivalent 32 Bits
|
||||||
|
|
||||||
|
## 32 Bits : La référence… historique
|
||||||
|
|
||||||
|
Dans la plupart des cas, la question ne se pose simplement pas pour l’utilisateur, même éclairé, sauf dans le cas des CPU de la famille des x86 qui équipent ce que l’on appelle communément les PC, ce qui inclut les machines Apple Mac depuis 2006, et bien d’autres choses.
|
||||||
|
|
||||||
|
Après un bref début sur des CPU (8086, 8088, 80286) en 16 Bits, les PC ont adopté (avec les 80386) une conception en 32 Bits dès 1986, et que l’on retrouve encore aujourd’hui.
|
||||||
|
|
||||||
|
Et si les premiers systèmes MS-DOS fonctionnaient en 16 Bits, les premières versions populaires de Windows (Windows 3) nécessitaient un processeur 32 Bits.
|
||||||
|
|
||||||
|
## Rétrocompatibilité
|
||||||
|
|
||||||
|
Depuis le début des années 2000, on commence à voir apparaître des x86 en 64 Bits : x86_64, qui en plus d’augmenter la capacité de traitement du processeur, en profitent pour revoir en profondeur les principes de conception et faire tomber certaines limitations historiques (Voyez [Wikipédia](https://fr.wikipedia.org/wiki/Processeur_64_bits) pour plus de détails).
|
||||||
|
|
||||||
|
Pour éviter de laisser de côté tout le travail historique, les architectures x86 sont « Rétrocompatibles » :
|
||||||
|
|
||||||
|
Un système 16 Bits peut fonctionner sur un CPU 16 Bits, 32 Bits ou 64 Bits
|
||||||
|
Un système 32 Bits peut fonctionner sur un CPU 32 Bits ou 64 Bits
|
||||||
|
Un système 64 Bits ne peut fonctionner que sur un CPU 64 Bits
|
||||||
|
|
||||||
|
Cela signifie qu'il y a encore peu (avant la généralisation de l'UEFI, mais cette partie nécessiterait un article complet) on pouvait faire fonctionner un vieux DOS des années 80 sur une machine de 2014. Avec toutes les limitations qu'apporterait un si vieux système sur un matériel aussi récent.
|
||||||
|
|
||||||
|
## Prudence, Prudence
|
||||||
|
|
||||||
|
Dans cette période de transition technologique, et dans l'incertitude du CPU auquel nous avions alors à faire, quelques constatations se furent rapidement :
|
||||||
|
|
||||||
|
- Un système 32 Bits fonctionnait sur la majorité des ordinateurs (le 16 bits n'étant qu'historique).
|
||||||
|
- Le gain du 64 Bits était peu visible, avec la réputation de n'être nécessaire que pour des « usages spécifiques ».
|
||||||
|
- L'acteur majeur qu'est Microsoft, avec son Windows, ne s'est mis que tardivement au 64 Bits
|
||||||
|
- La version 64 Bits de Windows XP n'avait une distribution que très restreinte.
|
||||||
|
- Les constructeurs ont mis longtemps avant de créer des pilotes pour les Windows 64 Bits, d’où une mauvaise gestion du matériel dans les années 2000.
|
||||||
|
- Les premières versions des Windows 64 Bits cassaient la compatibilité avec les applications 16 Bits encore utilisées par certaines entreprises.
|
||||||
|
|
||||||
|
La seule véritable limitation visible par l'utilisateur est que sans l'utilisation d'une extension PAE, testé un temps sur certaines versions de Windows XP, mais aujourd'hui complètement abandonnées par Microsoft : Le CPU ne sait pas gérer plus de 4 Go de mémoire RAM, valeur alors énorme à l'époque (et que certains osent encore vendre en 2023).
|
||||||
|
|
||||||
|
Un système Windows 32 Bits n'arrivera, Quelle que soit la quantité de mémoire installée et le CPU de la machine, qu'a géré un maximum de 3,25 Go de RAM.
|
||||||
|
|
||||||
|
Installer du 32 Bits était donc l’assurance de ne pas avoir de problème, le 64 Bit n'étant à envisager que sur des besoins spécifiques. Après 15 ans d’existence des CPU 64 Bits, cette règle s'applique toujours.
|
||||||
|
|
||||||
|
### Les autres systèmes
|
||||||
|
|
||||||
|
Même si le système de Microsoft est le plus présent sur le marché, il est loin d'être le seul à fonctionner sur des CPU x86
|
||||||
|
|
||||||
|
#### Apple MacOS
|
||||||
|
|
||||||
|
Plusieurs fois dans son histoire, Apple a changé le type des processeurs équipant ces machines, des Motorola originaux, aux PowerPC dans les années 2000. Le x86 n'est pour eux qu'une phase de leur histoire, dont la fin est initié en 2022 avec l'arrivée des premiers ordinateurs Apple avec CPU ARM.
|
||||||
|
|
||||||
|
Changer de longueur de mot sur un même type de processeur est pour eux presque trivial.
|
||||||
|
|
||||||
|
#### GNU/Linux
|
||||||
|
|
||||||
|
Le monde du logiciel libre est plutôt réactif sur ce type de nouveautés. On a trouvé très vite des systèmes complètement en 64 Bits et les systèmes 32 Bits ont très vite géré le PAE qui permet la gestion de plus de 4 Go de mémoire RAM.
|
||||||
|
|
||||||
|
Seuls les modules non libres, tels que les pilotes graphiques ou des modules tels que Flash, ont historiquement posé des difficultés.
|
||||||
|
|
||||||
|
## Aujourd’hui ?
|
||||||
|
|
||||||
|
En 2023, il devient difficile de trouver un système 32 bits.
|
||||||
|
|
||||||
|
Apple l'a depuis longtemps abandonné, et fait sa transition vers un autre type de CPU.
|
||||||
|
|
||||||
|
Windows 10 sera la dernière version du système de Microsoft as avoir une version 32 Bits.
|
||||||
|
|
||||||
|
La plupart des grandes distributions GNU/Linux abandonnent également leurs versions 32 Bits depuis plusieurs années.
|
||||||
|
|
||||||
|
Mis à part le cas particulier d'une machine historique qui aurait un CPU 32 Bits seulement, il n'y a plus aucune raison d'utiliser un système 32 Bits.
|
||||||
|
|
||||||
|
### l’UEFI
|
||||||
|
|
||||||
|
Le changement du système de démarrage des ordinateurs de type PC, abandonnant le BIOS des années 1980 pour le nouveau système UEFI, pourrait signer la fin de l’historique 32 Bits.
|
||||||
|
|
||||||
|
Effectivement, mis à part les premières machines Apple avec CPU x86, les ordinateurs avec un UEFI sont équipés d'un CPU 64 Bits, et les systèmes 32 Bits ne prennent simplement pas en charge le démarrage via un UEFI.
|
||||||
|
|
||||||
|
### Mode Legacy - Retour au BIOS
|
||||||
|
|
||||||
|
Pendant longtemps, les nouveaux UEFI possédaient un mode de fonctionnement imitant le fonctionnement du BIOS pour laisser le temps de la transition. Et passer dans ce mode de compatibilité permet de continuer à utiliser les systèmes 32 Bits qui apportent ce confort historique.
|
||||||
|
|
||||||
|
Mais si ce mode a existé durant plus de 10 ans, il a aujourd'hui disparu de toutes les nouvelles configurations pour laisser la place à l'unique nouvel UEFI … Rendant ces nouveaux systèmes incompatibles avec les systèmes 32 Bits.
|
||||||
|
|
||||||
|
## Conclusions
|
||||||
|
|
||||||
|
Les systèmes 32 Bits sur x86 appartiennent aujourd'hui au passé, et après plus de 35 ans d'existence, il disparaît de notre paysage informatique.
|
||||||
|
|
||||||
|
Il laisse le combat aux nouvelles architectures de microprocesseurs, avec à sa tête l'ARM. Un combat bien plus vaste qui rencontrera ici aussi ces réfractaires.
|
||||||
BIN
content/archive/CDDAlogo.png
Executable file
BIN
content/archive/CDDAlogo.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
5
content/archive/_index.md
Executable file
5
content/archive/_index.md
Executable file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
weight: 1000
|
||||||
|
title: Quelques articles historiques
|
||||||
|
---
|
||||||
|
Le site original existe depuis décembre 2010, et fonctionna sous WordPress pendant 10 ans. Cette section spécifique reprend certains articles historiques que je voulais conserver avec le changement de moteur.
|
||||||
35
content/archive/choisir-sa-premiere-distribution-linux.md
Executable file
35
content/archive/choisir-sa-premiere-distribution-linux.md
Executable file
@@ -0,0 +1,35 @@
|
|||||||
|
---
|
||||||
|
menu: savoirs
|
||||||
|
title: Choisir sa première distribution Linux
|
||||||
|
url: /choisir-sa-premiere-distribution-linux
|
||||||
|
date: 2016-01-15T07:00:00+00:00
|
||||||
|
weight: 15
|
||||||
|
description: Article original du 15 Janvier 2016, révisé en 2023
|
||||||
|
---
|
||||||
|
|
||||||
|
Comment choisir une distribution Linux ?
|
||||||
|
|
||||||
|
Pour les utilisateurs expérimentés, la question ne se pose généralement pas. Ils ont leurs habitudes et quand ils en changent, ils savent généralement pourquoi, et savent précisément quoi regarder pour choisir un candidat adapté à la situation.
|
||||||
|
|
||||||
|
Mais les quelque 270 distributions que référence [distrowatch](https://distrowatch.com) à largement de quoi perdre les nouveaux venus.
|
||||||
|
|
||||||
|
## Trop de choix tue le choix
|
||||||
|
|
||||||
|
Les environnements Windows et Mac OS offrent finalement peu de choix à l’utilisateur.
|
||||||
|
|
||||||
|
Microsoft propose aujourd’hui deux systèmes (Windows 10 et 11) qui proposent des expériences utilisateurs un peu différentes, le tout disponible en plusieurs variantes suivant le niveau d’option souhaité. Apple présentant une unique alternative à laquelle on adhère… ou non. Même si on gagne quelques options de configuration depuis la disparition du gourou monomaniaque de la pomme.
|
||||||
|
|
||||||
|
Alors quand on a plusieurs centaines de systèmes, possédant eux-mêmes plusieurs dizaines d’environnements de bureaux… ça fait beaucoup.
|
||||||
|
|
||||||
|
Deux cas typiques des débutants se démarquent alors :
|
||||||
|
|
||||||
|
- Essayer de tester de nombreuses distributions, mais sans jamais vraiment en explorer une et apprendre à correctement l’utiliser
|
||||||
|
- Essayer une petite distribution marante / prometteuse / spécialisé / révolutionnaire, qui aura une faible communauté et un support limité et parfois incertains
|
||||||
|
|
||||||
|
## Restez simple
|
||||||
|
|
||||||
|
Prenez une grande distribution connue ([Ubuntu](https://www.ubuntu-fr.org/), [Mint](https://www.linuxmint.com/), [Debian](https://www.debian.org/index.fr.html), [Open SUSE](https://fr.opensuse.org) ou [Fedora](https://www.fedora-fr.org/)), qui fonctionne correctement sur votre matériel, et restez-y le temps de découvrir
|
||||||
|
|
||||||
|
Toutes ces distributions ont énormément de point commun, et ce que vous apprendrez sur l’une d’elle sera applicable sur une autre si, à l’usage, votre premier choix ne vous convenait pas.
|
||||||
|
|
||||||
|
Si quelqu’un vous aide dans votre découverte de ce monde particulier de l’informatique, essayez d’utiliser la même version que lui, ou en priorité la version qu’il vous conseillera.
|
||||||
80
content/archive/drm-cdda.md
Executable file
80
content/archive/drm-cdda.md
Executable file
@@ -0,0 +1,80 @@
|
|||||||
|
---
|
||||||
|
menu: savoirs
|
||||||
|
title: DRM & CDDA
|
||||||
|
url: /drm-et-cdda/
|
||||||
|
date: 2016-07-16T07:00:00+00:00
|
||||||
|
weight: 14
|
||||||
|
description: Article original du 16 Juillet 2016, révisé en 2023
|
||||||
|
---
|
||||||
|
La musique est un média culturel d’une popularité et d’une richesse extraordinaire, du plus populaire au plus intimiste, on trouve pour tous les goûts, au point de toucher presque tout le monde (on arrivera toujours à me trouver quelques exceptions). Ceci constituant un juteux marché… il y a peu bousculé par la révolution numérique.
|
||||||
|
## Petit historique de la diffusion de la musique
|
||||||
|
|
||||||
|
Ce n’est qu’en [1860](https://fr.wikipedia.org/wiki/Phonographe) qu’apparait l’enregistrement du son sur cylindre, puis sur [disque (1890)](https://fr.wikipedia.org/wiki/Disque_78_tours#Histoire) puis vers [1950](https://fr.wikipedia.org/wiki/Disque_microsillon#Le_d.C3.A9veloppement_du_microsillon) le développement du disque « vinyle ».
|
||||||
|
|
||||||
|
|
||||||
|
Le [« Compact Disc »](https://fr.wikipedia.org/wiki/Disque_compact) tel qu’on le connaît aujourd’hui (Apparu en 1982) marque la numérisation de la musique. L’avancée de l’informatique, avec l’augmentation des capacités de stockage, la popularisation des lecteurs, puis des graveurs, de CD rendant la copie personnelle de cette musique numérique de plus en plus facile.
|
||||||
|
|
||||||
|
La popularisation des accès internet permanents, et la popularisation du [MP3](https://fr.wikipedia.org/wiki/MP3) (datant de 1995) dans le début des années 2000, marquant le début de leur dématérialisation… et de leur distribution libre, … trop libre pour ceux-là commercialisent.
|
||||||
|
|
||||||
|
## Digital Right Management
|
||||||
|
|
||||||
|
Il apparaît alors un ensemble de technologie de « Gestion des droits numériques » (connus sous l’acronyme anglais DRM) consistant, plus ou moins subtilement, à vouloir contrôler l’utilisation qui peut être faite de ces œuvres.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Pour la musique, la première mesure est de modifier, de diverses façons, les Compact Disc pour empêcher leur copie ou leur encodage (transformation en MP3 ou autre) par l’utilisateur, et donc couper la source de musique.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Philips, détenteur des droits sur l’appellation « Compact Disc Digital Audio » (CDDA) en refuse l’utilisation sur ces disques modifiés. Un Compact Disc Digital Audio n’est donc pas protégé contre la copie *(et donc respecte vos droits d’utilisateurs)*.
|
||||||
|
|
||||||
|
## Offre légale
|
||||||
|
|
||||||
|
Depuis, plusieurs lois ont été votée et la [HADOPI](https://hadopi.fr/) ont été créés avec pour objectif d’enrayer le partage illégal et de promouvoir une « offre légale » suite au marché réellement existant de cette musique dématérialisée.
|
||||||
|
|
||||||
|
L’usager en est finalement assez perdant.
|
||||||
|
|
||||||
|
### Restriction d’utilisation
|
||||||
|
|
||||||
|
Le but étant de limiter une diffusion trop massive, et hors rémunération, de cette musique, la souplesse d’utilisation en est assez largement restreinte par l’utilisation de ces DRM.
|
||||||
|
|
||||||
|
Un appareil compatible avec le système de DRM du vendeur est indispensable (Il existe plusieurs systèmes de DRM), ce qui exclut des appareils souvent fonctionnels, mais trop vieux, trop simple ou n’étant simplement pas du bon constructeur.
|
||||||
|
|
||||||
|
Le nombre d’appareils de lecture, voir même le nombre de lectures (ou fait alors de la location dématérialise de musique) peu être limité. L’éditeur gardant la capacité de révoquer une autorisation préalablement allouée.
|
||||||
|
|
||||||
|
On loue un droit limité de lecture de la musique.
|
||||||
|
|
||||||
|
Aujourd’hui, suite aux à l’excès de ces restrictions, certains distributeurs reviennent sur cette systématisation des DRM et distribuent maintenant plus volontiers des fichiers sans DRM.
|
||||||
|
|
||||||
|
### La qualité sonore
|
||||||
|
|
||||||
|
Le disque audio classique (CDDA 12 Cm) contient un maximum de 74 Minutes pour 650 Mo de son. Et même si un album prend rarement l’intégralité de la place disponible sur le disque, sa taille n’en reste pas moins de plusieurs centaines de Mo pour un album, qu’il faut multiplier par le nombre d’albums que contient une collection. Si cela représente une quantité très importante pour les années 2000, elle est longtemps restée loin d’être négligeable.
|
||||||
|
|
||||||
|
Il est nécessaire de réduire cette taille et donc diminuer la place nécessaire pour le stockage et réduire le temps nécessaire pour le transfert. La solution étant de faire de la « Compression » : appliquer un ensemble d’opération mathématique et (dans la plupart des cas) altérer la qualité sonore pour réduire fortement la taille.
|
||||||
|
|
||||||
|
|
||||||
|
Plus la qualité étant altéré, plus la taille du fichier étant contenue.
|
||||||
|
|
||||||
|
Cette musique est donc bien souvent de moins bonne qualité que la musique d’un CD-Audio.
|
||||||
|
|
||||||
|
Le manque de qualité sonore de nombreux appareils et le manque d’expérience et d’attention des usagers (voir, l’habitude à ce manque de qualité) fait que cette caractéristique passe généralement inaperçue.
|
||||||
|
## Ma solution
|
||||||
|
|
||||||
|
Philosophiquement allergique aux DRM, soucieux d’une certaine qualité et adepte de la souplesse de la dématérialisation, j’ai aujourd’hui ma propre méthode :
|
||||||
|
|
||||||
|
Acheter des CD à bas prix, entre 5 et 7 €, et ré-encoder (les systèmes anti-copie des CD audio étant globalement assez inefficaces) en [FLAC](https://fr.wikipedia.org/wiki/Free_Lossless_Audio_Codec), un format de compression qui préserve la qualité audio.
|
||||||
|
|
||||||
|
## Pourquoi cet article ?
|
||||||
|
|
||||||
|
Car le sujet est intéressant 😉
|
||||||
|
|
||||||
|
Au moment de l’encodage des quelques CD acquis il y a peu de temps, alors que seuls de vieux CD affichaient le logo « Compact Disc Digital Audio » attestant de l’absence de DRM, deux albums récents, de **Skip the use** et **Stromae**, affichaient cette indication.
|
||||||
|
|
||||||
|
Deux œuvres récentes qui décident de me respecter ? C’est assez rare pour faire un joli article.
|
||||||
|
|
||||||
|
---
|
||||||
|
## Et en 2023 ?
|
||||||
|
Depuis la rédaction originale de cet article, sept ans auparavant, le monde a évolué : Avec la popularisation des connexions rapides, fixes ou mobiles, il est assez simple de pouvoir transmettre les quelques dizaines de Mo nécessaire à une musique de qualité.
|
||||||
|
|
||||||
|
On trouve depuis quelques années des services de ventes ou d'abonnement de musique mettant l'accent sur la qualité proposant du FLAC, avec des qualités qui peuvent être supérieurs à celle proposée par le CDDA … sans vraiment enlever du DRM.
|
||||||
39
content/archive/geek.md
Executable file
39
content/archive/geek.md
Executable file
@@ -0,0 +1,39 @@
|
|||||||
|
---
|
||||||
|
menu: savoirs
|
||||||
|
title: Je ne suis plus geek
|
||||||
|
url: /je-ne-suis-plus-geek
|
||||||
|
date: 2014-06-09T07:00:00+00:00
|
||||||
|
weight: 20
|
||||||
|
description: Article original du 9 Juin 2014
|
||||||
|
---
|
||||||
|
En tant que passionné d’informatique, je me définissais souvent comme étant un « Geek ». Je me reconnaissais dans l’image que je voyais de ce qualificatif. Mais c’est de moins en moins le cas aujourd’hui.
|
||||||
|
|
||||||
|
Un documentaire d'ARTE « La revanche des geeks » indiquait en conclusion que les « Geeks » voyant le monde devenir de plus en plus « Geek » ne souhaitait plus en être.
|
||||||
|
|
||||||
|
Pour moi le monde des « Geeks originaux » n’est pas tout à fait celui qui s’impose aujourd’hui.
|
||||||
|
|
||||||
|
## La culture geek
|
||||||
|
|
||||||
|
Je vous invite à voir ce reportage qui présentait assez bien tout l’aspect passion de la science-fiction et du fantastique qui est encrée chez le geek. Et qui effectivement se popularise grandement dans notre société actuelle.
|
||||||
|
|
||||||
|
Je trouve cet aspect assez bénéfique, surtout qu’il me permet de ne pas passer pour un allumé complet si je parle de « StarWars » ou « Retour vers le futur » comme étant de grandes œuvres cinématographiques.
|
||||||
|
|
||||||
|
## Le geek technophile
|
||||||
|
|
||||||
|
Mais c’est surtout quand l’on parle de « Geek » et de « Technologie » que pour moi les choses s’enveniment.
|
||||||
|
|
||||||
|
Les deux sont pour moi intimement liés, et les « Geeks » ou « Nerds » sont avant tout des passionnés de technologie, qui à force d’étudier leur sujet en devenait des experts. Et bien que j’en sois un grand passionné, je ne me reconnais justement plus dans l’image qui en est faite maintenant.
|
||||||
|
|
||||||
|
## L’homo-geekus moderne
|
||||||
|
|
||||||
|
L’image de ringard des années 80 n’est plus d’actualité, et le geek des années 2010 est un type cool en phase avec la technologie du monde moderne. Être « Geek » deviendrait presque un compliment
|
||||||
|
|
||||||
|
Or cela devient tellement intéressant d’être « Geek » que tout le monde le devient. Et que la simple possession d’un téléphone pommé, ou le nombre d’heures passé sur les réseaux sociaux fait du quidam moyen un « Geek »
|
||||||
|
|
||||||
|
Où est l’expertise qui faisait du « Geek » un être à part ?
|
||||||
|
|
||||||
|
Ces technologies donneraient-elles une connaissance innée rien qu’en les utilisant ?
|
||||||
|
|
||||||
|
Cela n’est pas le cas pour moi. Et je serais même plutôt franchement opposé à cette idée. Ces réseaux sociaux, cloud et matériels connectés étant bien plus pour moi l’image de vastes contrôles et emprisonnement à but marketing, à l’opposé des valeurs qui définissent pour moi le « geek original ».
|
||||||
|
|
||||||
|
Étant donc opposé à certaines des images fortes aujourd’hui associées aux « geek » version 2010, et même si je suis absolument passionné par l’informatique, c’est une étiquette que je préfère simplement plus prendre… même si on me la met encore.
|
||||||
112
content/archive/la-vie-en-bleu.md
Executable file
112
content/archive/la-vie-en-bleu.md
Executable file
@@ -0,0 +1,112 @@
|
|||||||
|
---
|
||||||
|
menu: savoirs
|
||||||
|
title: La vie en bleu
|
||||||
|
url: /la-vie-en-bleu
|
||||||
|
date: 2015-08-18T07:00:00+00:00
|
||||||
|
weight: 18
|
||||||
|
description: Article original du 18 Aout 2015, révisé en 2023
|
||||||
|
---
|
||||||
|
|
||||||
|
Le surplus de lumière bleue dans notre industrie moderne est-elle dangereuse ?
|
||||||
|
|
||||||
|
À en croire certains, on est presque devant un problème de santé publique majeur, et l’on devrait tout s’équiper de lunettes spécifiques aux effets (placebo ?) presque magiques pour échapper aux désastres oculaires grondant dans nos nouvelles technologies
|
||||||
|
|
||||||
|
Pour d’autres, la première catégorie ne serait constituée que d’alarmistes, d’ignorants et de vendeurs charlatant
|
||||||
|
|
||||||
|
Il me fallait me forger mon propre avis sur la question, et explorer ce vaste monde qu’est le Web pour trouver mes réponses.
|
||||||
|
|
||||||
|
## DEL : Diode Électro-Luminescente
|
||||||
|
|
||||||
|
Les DEL (ou LED dans son abréviation anglophone) sont des composants électroniques parmi les plus simples et les plus courants de notre monde. Consommant très peu et étant aujourd’hui très bon marché (~0,06€ TTC pour un modèle simple au prix de détail), c’est l’une des reines de notre industrie numérique. Presque tous les petits indicateurs lumineux présents dans notre monde depuis les années 90 sont des DEL.
|
||||||
|
|
||||||
|
Depuis la directive européenne 2005/32/CE, qui, parmi d’autres choses, impose le passage à des systèmes d’éclairage « Basse Consommation » (et donc la mort de nos classiques ampoules à incandescence), l’industrie a dû trouver d’autres systèmes de production de lumière. Les DEL, dans une version Haute Puissance, ont vite trouvé leur place dans ce créneau. La démocratisation de cette version Haute Puissance (faisant baisser les prix), leur sobriété énergétique et la grande souplesse de cette solution la rendant de plus en plus populaire comme source lumineuse.
|
||||||
|
|
||||||
|
Ceci rend ces petites DEL très présentes comme source de lumières dans nos environnements. Dans tout ce qui est « l'éclairage LED », qu’il soit ponctuel ou central, sous des formes très diverses : Ruban lumineux, spot LED, ampoule basse consommation LED… Mais également dans un nombre toujours plus important d’écran informatique, comme source de rétro-éclairage (éclairage arrière) de ces écrans.
|
||||||
|
|
||||||
|
Cela permet de faire des écrans plus fins, durable et économe en énergie. On en trouve dans les écrans d’ordinateur et de télévision, dans les ordinateurs portables, les smartphones, tablettes… et finalement dans de plus en plus d’endroit
|
||||||
|
|
||||||
|
### Plus blanc que blanc
|
||||||
|
|
||||||
|
Le blanc est une chose assez problématique à créer avec le DEL. Leur principe de conception imposant que chaque élément est monochromatique : Ils ne sont que d’une seule couleur, Or le blanc n’est pas une couleur, mais une addition équilibrée de couleurs.
|
||||||
|
|
||||||
|
La solution aujourd’hui la plus simple et la plus courante (mais il en existe d’autres) pour créer de la lumière blanche avec une DEL est de coupler une DEL bleue à un phosphore jaune.
|
||||||
|
|
||||||
|
L’inquiétude vient de ce principe de conception qui crée une surcharge de bleus dans la lumière ici générée. Un « Blanc Froid » qui abuse de ce bleu.
|
||||||
|
|
||||||
|
Certains articles tels que celui de [retro-games.fr](https://www.retro-games.fr/test-lunettes-anti-lumiere-bleue-2601) nous l’explique bien mieux que moi : Le Blanc de nos écrans modernes est donc significativement surchargé en Bleu
|
||||||
|
|
||||||
|
Lumière émise par nos écrans modernes
|
||||||
|
|
||||||
|
Mais quels effets l’abus de « Bleu », couleur la plus présente dans le spectre visible par l’œil humain, peu il avoir sur notre santé ?
|
||||||
|
|
||||||
|
## Les effets sur la santé
|
||||||
|
|
||||||
|
Ce Bleu agit sur deux aspects assez distinct relevant de la santé :
|
||||||
|
|
||||||
|
### Puissance Bleu
|
||||||
|
|
||||||
|
Le violet et le bleu sont la suite directe des Ultra Violets dans le spectre de la couleur visible, sont désignés comme lumière HEV (Haute Énergie Visible / high-energy visible). Elles constituent la partie la plus énergiquement agressives du spectre lumineux et donc potentiellement la plus nocive.
|
||||||
|
|
||||||
|
En sur-sollicitant certains capteurs présents dans l’œil humain, ce surplus d’énergie serait responsable de problèmes à court et long terme.
|
||||||
|
|
||||||
|
#### Effets immédiats
|
||||||
|
|
||||||
|
Au vu des 6 à 10 Heures par jours que nous passons actuellement face à nos divers écrans informatiques (et sans même compter les éclairages principaux), ce surplus de lumière peu être responsable d’une fatigue excessive de l’œil, créant maux de tête, éblouissement, trouble de la vision… et divers autres problèmes. Le flou des arguments commerciaux face aux arguments scientifiques étant ici a nos portes.
|
||||||
|
|
||||||
|
#### Effets sur la durée
|
||||||
|
|
||||||
|
Les effets à long terme sont beaucoup plus sujets à supposition, et difficile à prouver scientifiquement sans études sur la durée (et sans parfois des méthodes véritablement adaptées)
|
||||||
|
|
||||||
|
Ce surplus de Bleu pourrait accélérer certaines dégénérescences de l’œil, notamment la « dégénérescence maculaire liée à l’âge » (DMLA)
|
||||||
|
|
||||||
|
#### Et la science dans tout cela ?
|
||||||
|
|
||||||
|
Il existe quelques études [françaises](https://www.anses.fr/fr/system/files/AP2008sa0408.pdf) ou [non](http://ehp.niehs.nih.gov/122-A81/) sur le sujet.
|
||||||
|
|
||||||
|
Elle semble attester de possibles problèmes sur l’exposition à haute dose, mais qui dépasserait les puissances de nos simples écrans. Des essais sur des rongeurs et des cultures en laboratoire indiquant une certaine nocivité de ces rayons bleu. Mais, l’ANSES reconnait elle-même que les méthodologies aujourd’hui référentes ne sont pas nécessairement adaptées à ce problème spécifique.
|
||||||
|
|
||||||
|
Les cas de fatigues visuels sont eux présentés comme plus probable.
|
||||||
|
|
||||||
|
### Au dodo
|
||||||
|
|
||||||
|
Aspect largement mieux connu, et considéré comme scientifiquement acquis : La composante bleue de la lumière perçue par notre œil sert à notre corps de référence pour réguler la production de « Mélatonine », hormone responsable de nos cycles d’éveil et de sommeil.
|
||||||
|
|
||||||
|
C’est normalement la lumière solaire, filtrée en partie par la couche d’ozone (qui filtre plus fortement la composante bleue que les autres), que le corps humain s’attend à recevoir. Le bleu excessif de nos écrans venant ici perturber notre rythme biologique et nos nuits.
|
||||||
|
|
||||||
|
Il vaut mieux donc éviter cette lumière en soirée et surtout la nuit.
|
||||||
|
|
||||||
|
La tablette comme livre électronique pour s’endormir ou le radio réveil avec une jolie teinte bleutée sont donc à proscrire pour la tranquillité de nos nuits.
|
||||||
|
|
||||||
|
## Protection rapprochée.
|
||||||
|
|
||||||
|
### Nostalgie
|
||||||
|
|
||||||
|
Certains se souviendront peut-être des années 90 et de la grande mode qui consistait à ajouter un filtre devant l’écran dans le but d’en limiter les effets nocifs, et notamment les radiations, émises par le matériel de l’époque.
|
||||||
|
|
||||||
|
Filtre d'écran des années 90
|
||||||
|
|
||||||
|
Les technologies de nos écrans n’ont aujourd’hui plus rien à voir. Et même si les problèmes de l’époque (Radiations et Balayage) n’ont rien à voir avec l’agression colorée d’aujourd’hui (et que le matériel de l’époque n’a aucun effet sur le problème actuel, n’espérez pas faire du recyclage), il n’en reste pas moins la même idée de peur technologique vis-à-vis de cet écran de nos ordinateurs.
|
||||||
|
|
||||||
|
### Et en ~~2015~~ 2023 ?
|
||||||
|
|
||||||
|
Depuis la première version de cet article (en 2015) les choses ont globalement évoluée. Si l'évaluation du potentiel risque n'a pas forcément changé, les solutions techniques à mettre en place sont assez simples, relativement performante, et surtout, on un bon potentiel commercial.
|
||||||
|
|
||||||
|
Le « Filtre lumière bleu » fait partie des options standards dans toute la lunetterie. Et des enseignes spécialisées telles que l'américain [Gunnars](https://gunnars.fr/) ou le fraçais [Blueberry](https://www.blueberryglasses.com/) sont toujours présents… au contraîre d'«Edie & Watson» qui avaient ma préférence de l'époque, mais ne semblent aujourd'hui plus présents.
|
||||||
|
|
||||||
|
Loin des seules lunettes, ce sont aussi les écrans qui se sont adaptés, les modèles récents ayant réagi face à ce problème de LED problématique. Ce problème de « Lumière Bleu » ne devenant presque qu'une problématique de génération sur les affichages des années 2010 (encore très présents).
|
||||||
|
|
||||||
|
Le logiciel a, lui aussi, pris en compte cette problématique : À la base des logiciels complémentaires, jusqu'à être aujourd'hui dans les options de bases de pratiquement tous les systèmes modernes. Ils modifient la colorimétrie de l'écran suivant l'heure (voir automatiquement en fonction du cycle nocturne) pour progressivement tendre vers une teinte orangée en soirée et la nuit.
|
||||||
|
|
||||||
|
#### Comment cela fonctionne-t-il ?
|
||||||
|
Le principe est finalement assez simple. Presque toutes les lunettes filtrait déjà presque tout ce qui est Ultraviolet, et il suffit finalement d’étendre ce filtrage pour couvrir le début du spectre visible et filtrer cette partie Bleue nocive.
|
||||||
|
|
||||||
|
Les Blancs Froids de nos écrans élagués de cette composante bleue deviennent des Blancs Chauds, ce qui crée une teinte légèrement orangée… le temps pour l’œil de s’habituer.
|
||||||
|
|
||||||
|
## Et finalement ?
|
||||||
|
|
||||||
|
Scientifiquement, il y a quelques faits, mais aussi beaucoup de flou. Les commerciaux de tous bords vendent avec plus ou moins de force ces filtres qui, il faut le reconnaitre, à bien plus de chance de faire du bien que de faire du mal.
|
||||||
|
|
||||||
|
Un gadget à la popularité grandissante qui surf sur le côté santé / bien être, et l’omniprésence grandissante des nouvelles technologies, deux domaines très en vogues actuellement. Une légère peur technologique, basé sur une réalité scientifique aux conséquences réelle mal connues, dont les lunettes filtrantes sont la solution tout à la fois Geek (donc attrayante pour les plus exposées au problème) et bien être.
|
||||||
|
|
||||||
|
|
||||||
|
À chacun de se faire son propre avis, le choix lui ne manque pas.
|
||||||
43
content/archive/la-vie-en-jaune.md
Executable file
43
content/archive/la-vie-en-jaune.md
Executable file
@@ -0,0 +1,43 @@
|
|||||||
|
---
|
||||||
|
menu: savoirs
|
||||||
|
title: La vie en jaune
|
||||||
|
url: /la-vie-en-jaune
|
||||||
|
date: 2016-01-09T07:00:00+00:00
|
||||||
|
weight: 17
|
||||||
|
description: Article original du 9 Janvier 2016
|
||||||
|
---
|
||||||
|
|
||||||
|
Les grandes recherches théoriques sur les lumières bleues, c'est bien, mais je ne tardais pas à vouloir expérimenter la pratique. Fin 2015, je m'équipais de lunette filtrant cette fameuse « Lumière Bleu ».
|
||||||
|
|
||||||
|
## L'équipement
|
||||||
|
|
||||||
|
Pour toutes les personnes qui ont des problèmes de vue, votre opticien vous aura déjà proposé cette option (et vous avez déjà de grande chance d'être équipé).
|
||||||
|
|
||||||
|
Pour ceux qui n'ont pas de problème de vue, l'offre est aujourd'hui largement établie.
|
||||||
|
J'avais essayé les produits « Edie & Watson », aujourd'hui fermé, qui m'avait fait bonne impression.
|
||||||
|
|
||||||
|
Pour un prix plus élevé, j'étais finalement passé par un opticien en ligne pour avoir des lunettes « de vue » sans correction, mais avec des filtres, tel que celui pour la lumière bleue. La discrétion des lunettes de vue, du matériel dont j'avais choisi les options et le style, mais un conseil qui se limitait à la lecture des arguments marketing de leur site.
|
||||||
|
|
||||||
|
## Voir la vie en Jaune
|
||||||
|
|
||||||
|
J’avais quelques doutes sur la modification des couleurs qu’allaient impliquer de tels verres. Un peu peur d’une trop forte dénaturation des couleurs qui pourrait être gênante dans les quelques travaux graphiques que je fais (mais je suis loin d'être un expert).
|
||||||
|
|
||||||
|
Et même si la modification dépend des verres en eux-mêmes, et de leur fabricant (j’ai vu une différence entre les Edie & Watson, les lunettes correctrices de ma compagne et les miennes), je me suis, au premier abord, étonné du faible changement colorimétrique.
|
||||||
|
|
||||||
|
La couleur tire finalement si peu sur le jaune que ce n’est visible que si vous y portez une véritable attention. Seul ceux qui ont des écrans chronométriquement calibrés (ce qui n’est pas mon cas) pourraient voir la différence sur leur création. Sinon, le changement provoqué par les lunettes sera de toute façon moins importante que les approximations des réglages des différents écrans.
|
||||||
|
|
||||||
|
### Les gains
|
||||||
|
|
||||||
|
Sans avoir plus d’études scientifiques que la dernière fois, il me semble qu’il y a un vrai gain.
|
||||||
|
|
||||||
|
C’est très instinctivement que je porte ces lunettes face à mes écrans, et cela, même après plusieurs mois d’utilisation. Je ressens moins de fatigue, et même de façon assez significative sur certains écrans (notamment la télévision LED qui me sert pour la console de jeux).
|
||||||
|
|
||||||
|
Elles n’ont rien d’indispensable et d’incontournable, et les oublier chez moi une journée ne me fera pas faire demi-tour. Mais sauf quand j’utilise peu mes ordinateurs, je les utilise quotidiennement. Même si ce n’est pas 100% de mon temps sur écran
|
||||||
|
|
||||||
|
Malgré toute une semaine, de vacances, loin de mes lunettes et bien plus éloigné de mes écrans (presque en désintoxication) de mes écrans, se ressent significativement. J’en suis même heureux de retrouver mes carreaux aujourd’hui.
|
||||||
|
|
||||||
|
## Et pour conclure ?
|
||||||
|
|
||||||
|
Le passage de la théorie à la pratique continue à me convaincre. Même si je ne peux pas vraiment juger des effets sur la durée, j’ai l’impression qu’il y a un réel effet sur la fatigue visuelle et le confort.
|
||||||
|
|
||||||
|
Je considère avoir fait un bon investissement dans l’achat de ces lunettes.
|
||||||
26
content/archive/utiliser-windows.md
Executable file
26
content/archive/utiliser-windows.md
Executable file
@@ -0,0 +1,26 @@
|
|||||||
|
---
|
||||||
|
menu: savoirs
|
||||||
|
title: Je ne sais plus utiliser Windows
|
||||||
|
url: /je-ne-sais-plus-utiliser-windows/
|
||||||
|
date: 2016-01-10T07:07:07+00:00
|
||||||
|
weight: 16
|
||||||
|
description: Article original du 10 Janvier 2016
|
||||||
|
---
|
||||||
|
Cela fait maintenant 10 ans que je suis utilisateur de « Linux ». Et en tant que dépanneur informatique officiel de la belle famille, j’ai eu il y a peu mon avis à donner sur les ordinateurs, Windows, de deux de mes cousins par alliance.
|
||||||
|
|
||||||
|
Les ordinateurs, dont les antivirus n’ont plus d’abonnements depuis plus d’un an maintenant, souffrent de divers dysfonctionnements et ralentissement. Le diagnostic est simple, la solution moins.
|
||||||
|
|
||||||
|
## Il y a 10 ans
|
||||||
|
|
||||||
|
Dans un sens, depuis 10 ans, les fondamentaux n’ont pas changé. Un certain nombre de logiciels malveillants circulent dans le but de faire le maximum de chiffre. Leurs cibles restent toujours la même :
|
||||||
|
|
||||||
|
- Les logiciels qui représentent une forte part de marché
|
||||||
|
- La configuration par défaut de ces systèmes
|
||||||
|
- La crédulité et la méconnaissance des utilisateurs
|
||||||
|
|
||||||
|
Mais alors que je savais, il y a 10 ans, faire un peu le ménage sur un système Windows. Je constate, après l’avoir essayé sur ces deux ordinateurs, que mes souvenirs sur les méthodes de ce temps sont aujourd’hui simplement dépassés.
|
||||||
|
C’est donc avec une pointe d’amertume que je constate mon inefficacité à pouvoir nettoyer des problèmes sur ce type de système.
|
||||||
|
|
||||||
|
## D’un monde à l’autre
|
||||||
|
|
||||||
|
Alors que l’on me dit souvent que « Windows, c'est plus facile », je considère aujourd’hui que je « ne sais plus utiliser Windows ». En tout cas pas avec le niveau de maîtrise qu’il me semble nécessaire, mais que beaucoup d’utilisateur de ce système sont TRÉS loin d’avoir.
|
||||||
BIN
content/g-logo.png
Executable file
BIN
content/g-logo.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
11
content/humeurs/_index.md
Executable file
11
content/humeurs/_index.md
Executable file
@@ -0,0 +1,11 @@
|
|||||||
|
---
|
||||||
|
menu: main
|
||||||
|
weight: 30
|
||||||
|
title: Humeurs
|
||||||
|
---
|
||||||
|
|
||||||
|
Que serait l’humain sans ses sentiments ?
|
||||||
|
|
||||||
|
Cela serait-il un site personnel si je ne réservais pas une place à ceux que je décide de rendre publics ?
|
||||||
|
|
||||||
|
Du coup de gueule, aux grandes questions sur notre monde, en passant par des choses bien moins romanesque. Un espace d’expression un peu plus libre que le reste du site.
|
||||||
88
content/humeurs/freepbx.md
Normal file
88
content/humeurs/freepbx.md
Normal file
@@ -0,0 +1,88 @@
|
|||||||
|
---
|
||||||
|
title: À la découverte de la VOIP OpenSource
|
||||||
|
date: 2024-03-22
|
||||||
|
draft: false
|
||||||
|
tags:
|
||||||
|
- Hacking
|
||||||
|
- VOIP
|
||||||
|
- Asterisk
|
||||||
|
---
|
||||||
|
Comme tout hacker qui se respecte, j’ai une certaine tendance à l’accumulation de matériel divers, sous l’excuse que *c’est toujours utile pour apprendre de nouveaux trucs*. Dans tout cela quelques *téléphones VOIP* auxquels il ne manquerait qu’un serveur pour reprendre vie.
|
||||||
|
|
||||||
|
Et justement, je connais assez peu le domaine de la téléphonie, et j’ai cherché un petit serveur VOIP tout simple, *juste pour apprendre*, à peine plus que faire communiquer quelques téléphones en local … j’ai beaucoup cherché … et pas beaucoup trouvé.
|
||||||
|
|
||||||
|
## Asterisk : La référence
|
||||||
|
**Asterisk** (qui n’a rien à voir avec le petit gaulois) est une référence quand on cherche à faire de la VOIP avec du *logiciel libre*. Il est, à l’origine, développé pour et par la société **Digium**.
|
||||||
|
|
||||||
|
**FreePBX** est un projet, lui aussi en *Open-Source*, qui vise à simplifier l’accès à Asterisk en lui fournissant une *interface Web*, et *un kit prêt à installer* : Une distribution Linux dérivé de CentOS (lui-même dérivé de RedHat), incluant l’interface Web, le serveur Asterisk et plusieurs composants complémentaires.
|
||||||
|
|
||||||
|
**Sangoma** *Technologies Corporation* a racheté *FreePBX* en 2015 et *Digium* en 2018, ce qui explique, entre autres, que la solution «tout-en-un» proposé sur le site d’Asterisk soit FreePBX, les deux appartenant à la même entreprise.
|
||||||
|
|
||||||
|
## Une installation … classique
|
||||||
|
Même si l’outil à tout faire qu’est la solution Asterisk / FreePBX dépasse de très loin ce que je pourrais attendre pour mes propres besoins, et en l’absence d’alternative qui me semble convainquante, *je décide de m’y lancer* avec un petit serveur, pas bien puissant, mais qui suffira largement pour mes quelques découvertes.
|
||||||
|
|
||||||
|
Devoir fournir une identité et des moyens de contacts avant de pouvoir charger l’image disque m’a toujours paru une pratique commerciale un peu douteuse et agressive, même si *Libre n’est pas gratuit* et que je comprends parfaitement qu’il y a une entreprise qui essaye au moins de survivre derrière ce projet.
|
||||||
|
|
||||||
|
La solution, basé ici sur une CentOS7, se déroule plutôt honorablement. Je connais assez bien *Anaconda* l’interface d’installation de chez RedHat & Fedora, et seul le fait d’avoir sauté la première partie de l’assistant (erreur de manipulation de ma part, ou automatisation spécifique) me pose un souci de clavier, qui est donc configuré comme clavier US.
|
||||||
|
|
||||||
|
L’installation elle-même est un peu longue, peut-être dû au manque de vélocité de mon serveur, et me laisse tout le temps de profiter de l’espace publicitaire pour le matériel de VOIP vendu par *Sangoma*. Rien d’insurmontable, j’ai surtout bien avancé sur le petit jeu que j’avais à côté.
|
||||||
|
|
||||||
|
Je n’ai que le mot de passe super-administrateur (root) à définir au moment de l’installation.
|
||||||
|
|
||||||
|
## Libre & Open-Source
|
||||||
|
Le système est installé et démarre comme une CentOS, qui n’en a pas le nom, tout ce qui est de plus classique. Presque trop … il faut soit se connecter (en root), soit aller voir dans la configuration du routeur pour récupérer l’adresse IP sur laquelle se connecter pour retrouver l’interface WEB «FreePBX» tant attendue.
|
||||||
|
|
||||||
|
Un premier assistant pour créer le compte administrateur, choisir la langue, le nom du serveur et configurer l’eMail, fait affaire de premier assistant post-installation. Je trouve cette question d’eMail confuse : Et il l’adresse au nom de laquelle il va communiquer avec les utilisateurs, ou celle à qui il va adresser les messages à l’administrateur ? Je n’ai toujours pas la réponse.
|
||||||
|
|
||||||
|
Il nous est ensuite chaudement recommandé de *s’enregistrer auprès de l’éditeur* pour profiter au mieux des services proposés. *Je veux juste bricoler*, pas installer une solution de production et encore moins pour une entreprise aussi petite soit elle : **Je refuse !**
|
||||||
|
|
||||||
|
*Vous êtes sûr ?* Certaines fonctions ne seront pas disponibles : **Oui !**
|
||||||
|
|
||||||
|
S'ensuit *plusieurs écrans* pour nous parler des multiples *modules optionnels, propriétaires et payants* … assez pour créer ce sentiment de *lassitude* à cliquer sur refuser / suivant.
|
||||||
|
|
||||||
|
Quatre icônes se présentent enfin face à moi : *Me voici face à l’accueil réel de l’interface web*.
|
||||||
|
|
||||||
|
Après un essai de connexion, infructueux, en utilisateur, je comprends que je n’ai qu’un mot de passe pour la partie administrateur (et que l’administrateur n’est donc pas un utilisateur).
|
||||||
|
|
||||||
|
## Simple ? … Pas vraiment
|
||||||
|
J’arrive sur le *tableau de bord*, m’indiquant quelques informations utiles sur le système et l’état du serveur installé. La barre supérieure est pleine de *plein de menus dans tous les sens* … **pente raide pour le découvreur que je suis**. Tout est dans un anglais technique que je ne maîtrise que très peu sur ce domaine : *La configuration initiale de la langue ne s’applique pas à l’interface d’administration*.
|
||||||
|
|
||||||
|
Mais même une fois configuré en français, *la traduction est au mieux partielle*, même pour ce qui semble les modules de base.
|
||||||
|
|
||||||
|
J’explore un peu et constate assez amèrement qu’*une bonne dizaine d’entrées de menus ne sont là que pour renvoyer vers l’achat des options payantes* … **Business is business**, mais la c’est un peu insistant quand même.
|
||||||
|
|
||||||
|
Retour au *tableau de bord*, qui est la partie qui me laisse *la meilleure impression pour le moment*, pour voir les alertes sur **les modules non mis à jour**.
|
||||||
|
|
||||||
|
## Faire les mises à jour … une option semi-payante.
|
||||||
|
J’arrive à comprendre un bout de la logique générale, et arrive sur les options de mises à jour.
|
||||||
|
|
||||||
|
*Voulez-vous vous enregistrer ?* … Si votre choix est non, **le système de mise à jour est limité**.
|
||||||
|
|
||||||
|
En clair, pour espérer *faire les mises à jour* à peu près correctement, *il faut payer*. Pas en monnaie, mais en donnée personnelle pour rentrer dans les fichiers clients : Oui, **c’est une façon de payer**.
|
||||||
|
|
||||||
|
### Mise à jour système
|
||||||
|
Les mises à jour du système sont finalement *les plus simples*. L’onglet web vous indique avec un long paragraphe que vous allez devoir *vous démerder tout seul*, ou vous enregistrer.
|
||||||
|
|
||||||
|
Je reprends le clavier et l’écran encore connecté pour faire l’installation, me connecte en administrateur et lance un *yum update* … ce n’est ici qu’une CentOS très classique.
|
||||||
|
|
||||||
|
Mais alors que la force d’un système Gnu/Linux moderne est d’avoir des mises à jour centralisées pour tous les composants du système … *Ça serait ici bien trop simple* (et standard) …
|
||||||
|
|
||||||
|
### Mise à jour des modules
|
||||||
|
Il faut donc passer par *l’assistant intégré* pour faire les mises à jour des modules. Donc lancer une recherche … qui prend du temps … sélectionner les modules à mettre à jour et utiliser le bouton « appliquer ».
|
||||||
|
|
||||||
|
*Les modules dépendent parfois les uns des autres*, ce qui est assez *classique* dans le domaine informatique. Tant que l’on sait faire les mises à jour dans un ordre correct, ça ne pose aucun problème … *Ce que **ne sais pas faire** ce système de gestion des modules* (ou alors c’est aussi dans les options)
|
||||||
|
|
||||||
|
Et il faut enchainer les cycles *recherche* / *sélection* / *demande de mise à jour* / **erreur** pour arriver à enfin tous les mettre à jour … dont tous ceux qui ne font que de la publicité.
|
||||||
|
|
||||||
|
## Et alors, au final, ça donne quoi ?
|
||||||
|
À attendre, dans les différents cycles d’installation, de mise à jour, et de pause publicitaire, *j’ai surtout beaucoup avancé sur le jeu vidéo que j’utilisais à côté …*
|
||||||
|
|
||||||
|
J’ai désactivé une bonne part des modules qui ne me servirait pas, et *j’étais juste fatigué* pour essayer d’aller sortir mes téléphones après avoir dû faire face à ce qui serait presque une forme de mauvaise foi.
|
||||||
|
|
||||||
|
Oui, les modules sont *OpenSource*, sans doute possible. Mais la philosophie du *Logiciel libre*, celle de libérer les utilisateurs, *ne me semble simplement plus y être*. Je n’y vois simplement pas mieux que ce qui pourrait être une version « éducation » d’un logiciel propriétaire quelconque … et encore, ils auraient pris soin de faire *quelque chose de* **moins brouillon**.
|
||||||
|
|
||||||
|
Ça ne me donne même *pas l’envie de conseiller cette solution* à une structure qui chercherait à payer un système professionnel.
|
||||||
|
|
||||||
|
L’alternative libre aurait pu être **FreeSWITCH** qui est un produit de la société **SignalWire**. Mais vu que la documentation officielle demande un enregistrement pour télécharger les fichiers d’installation, *l’esprit me semble le même*. Ici aussi, on respecte parfaitement l’OpenSource : Le code source est lui parfaitement disponible pour qui voudrait, et pourrait y mettre les pattes.
|
||||||
|
|
||||||
|
**Fatiguant**
|
||||||
29
content/humeurs/g-a32.md
Normal file
29
content/humeurs/g-a32.md
Normal file
@@ -0,0 +1,29 @@
|
|||||||
|
---
|
||||||
|
title : « Mais … Il est neuf ! »
|
||||||
|
date: 2024-12-09
|
||||||
|
draft: false
|
||||||
|
tags:
|
||||||
|
- Écologie
|
||||||
|
---
|
||||||
|
Ce sont ces mots que j’ai eus face à l’assistance informatique professionnelle, quand ils m’ont annoncé devoir remplacer mon téléphone portable d’entreprise. L’appareil est un Samsung Galaxy A32 dont la conception date de février 2021, que j’ai peut-être eu un peu plus tard ([la pénurie des composants du début des années 2020](https://fr.wikipedia.org/wiki/Pénurie_de_composants_électroniques_de_2020-2023) jouant son effet).
|
||||||
|
|
||||||
|
Mais alors que nous ne sommes pas encore arrivés en 2025, cela fait *moins de 4 ans* dans le plus idéal des cas… et certainement bien moins. Selon mes critères, c'est un appareil « *Neuf* », qui répondait à mes besoins plus que confortablement : quelques applications, un peu de données (e-mail, agenda, contacts…) et… téléphoner.
|
||||||
|
|
||||||
|
**Précision :** Le changement doit être fait pour des problèmes d’incompatibilité avec des solutions de cybersécurité, et non pour une obsolescence et un remplacement systématique. Mon cas est probablement un cas particulier, je suis un porte-poisse à ce niveau.
|
||||||
|
|
||||||
|
## 80% d’impact
|
||||||
|
On parle d’impact écologique du numérique, et c’est un sujet auquel je suis sensible (voir mes écrits sur l’[Écologie](/tags/écologie/)). C’est un sujet sur lequel on fait d’importantes avancées actuellement… et le travail est encore long. Le grand mythe de l’**eMail** grand destructeur, s'il n’est pas sans impact, l’est bien moins que ce qui nous est inculqué depuis des dizaines d’années.
|
||||||
|
|
||||||
|
Le **Terminal utilisateur**, l’ordinateur et ses périphériques, le téléphone portable… et tout ce qui est dans les mains des utilisateurs finaux représente entre **70 et 80%** de l’*impact écologique du numérique*.
|
||||||
|
Les écrans sont les pire élèves, avec un impact d’autant plus grand que leur surface d’affichage est grande.
|
||||||
|
|
||||||
|
Pendant des années, la durée de vie du matériel informatique en entreprise était d’environ *trois ans*, notamment due à la [loi de Moore](https://fr.wikipedia.org/wiki/Loi_de_Moore) qui expliquait une montée en puissance rapide de l’informatique de 1970 à 2010. Car depuis *~10 ans la puissance des systèmes informatiques stagne*. Et il est aujourd’hui, par rapport aux années 2000, beaucoup moins impactant de conserver un matériel qui a *5 ans* d’âge (ou plus).
|
||||||
|
|
||||||
|
Un ordinateur (même portable) peut actuellement vivre au moins *8 ans* et souvent bien plus avec un peu de savoir-faire. C’est un peu plus compliqué pour un téléphone portable qui est bien plus dépendant des mises à jour que voudra bien fournir le constructeur.
|
||||||
|
|
||||||
|
## Un défi écologique
|
||||||
|
Et cette *possibilité* de faire durer plus longtemps son matériel est non seulement bonne *éco***nomiquement**, mais aussi *éco***logiquement**.
|
||||||
|
|
||||||
|
La meilleure façon d’agir pour réduire l’impact écologique du numérique est de faire durer le matériel que l’on a dans les mains ou sous les yeux comme simple utilisateur.
|
||||||
|
|
||||||
|
… et je compte bien m’assurer que ce téléphone puisse avoir une seconde vie.
|
||||||
33
content/humeurs/imprimante-samsung.md
Normal file
33
content/humeurs/imprimante-samsung.md
Normal file
@@ -0,0 +1,33 @@
|
|||||||
|
---
|
||||||
|
title: Petite histoire d’imprimante
|
||||||
|
date: 2024-02-28T10:20:00+00:00
|
||||||
|
draft: false
|
||||||
|
tags:
|
||||||
|
- Écologie
|
||||||
|
---
|
||||||
|
|
||||||
|
Étant peut-être l’un des seuls à suivre strictement cette règle de ne pas imprimer de documents personnels sur les imprimantes du bureau, j’ai acheté dans les années 2010 une imprimante. J’imprime peu, au point que pratiquement 15 ans plus tard, je suis toujours avec la cartouche d’origine fournie avec l’imprimante.
|
||||||
|
|
||||||
|
L’encre sèche, et c’est ce qui tue la majorité des imprimantes à jet d’encre qui sont peu utilisées. J’ai donc pris une imprimante laser, qui elle utilise une poudre qui va se fixer sur le papier. Poudre qui ne sèche pas.
|
||||||
|
|
||||||
|
Vu mon faible besoin d’impression, mes critères étaient simplicité et minimalisme : Une petite laser noir et blanc avec le moins d’options possibles. Ça revient presque à dire « *Laser et pas cher* » et ce n’est pas loin de la vérité.
|
||||||
|
|
||||||
|
Mon choix se porte sur une *Samsung ML-1660* qui fonctionne sans trop sourciller avec mon MacBook de l’époque.
|
||||||
|
|
||||||
|
## De la pomme au pingouin
|
||||||
|
Après plusieurs années de bons et loyaux services, la machine accusant son âge, je quittais le monde Apple pour repasser avec un ordinateur principal sous Linux.
|
||||||
|
|
||||||
|
Et c’est ici que je me dis qu’un article sur la question du matériel sous Linux ne serait pas une mauvaise idée. Mais en quelques mots, souvent ça fonctionne juste bien, parfois beaucoup moins … Je ne crois pas utile de vous préciser que l’on était ici sur la seconde option.
|
||||||
|
|
||||||
|
Je garde cette machine sous Mac OS pour tous ces matériels un peu tatillons. Il reste toujours ceux qui ne prennent en compte que l’existence du dernier Windows, mais c’est bien mieux que rien dans beaucoup de cas.
|
||||||
|
|
||||||
|
L’idée est donc de **garder une ancienne machine pour faire fonctionner un matériel**, rare pour une simple imprimante bas de gamme, mais une situation qu’il n’est pas si rare d’utiliser dans l’industrie, surtout quand le remplacement du matériel piloté est couteux, soit directement, soit pour leur implication.
|
||||||
|
|
||||||
|
En 2024, Siemens aurait même cherché à recruter des personnes ayant des connaissances [en DOS et Windows 3.11](https://www.clubic.com/actualite-517336-vous-maitrisez-ms-dos-windows-3-11-et-vous-n-etes-pas-encore-a-la-retraite-cette-entreprise-ferroviaire-a-un-job-pour-vous.html) pour assurer la maintenance de matériel ancien.
|
||||||
|
|
||||||
|
## Samsung ne fait plus d’imprimante ?
|
||||||
|
Ça devait être le titre original de cet article. Avec, en fond, moi pestant de ne même plus retrouver de pilotes (même anciens) pour ce matériel encore largement fonctionnel.
|
||||||
|
|
||||||
|
Je n’avais qu’un petit problème de logique : Il faut chercher les pilotes d’imprimantes *Samsung* sur le site de *HP*.
|
||||||
|
|
||||||
|
On trouve donc bien chez HP les pilotes pour Windows, Mac OS et même différentes versions de Linux. HP essayant d’être un peu plus propre que d’autres constructeurs pour le support des imprimantes sous Linux, c’est peut-être l’occasion de réessayer.
|
||||||
16
content/humeurs/tbw.md
Executable file
16
content/humeurs/tbw.md
Executable file
@@ -0,0 +1,16 @@
|
|||||||
|
---
|
||||||
|
title : Technologic Bullshit Words
|
||||||
|
date: 2024-06-02
|
||||||
|
draft: false
|
||||||
|
---
|
||||||
|
J’aurais pu nommer cet article « **Jargon Technologique d’Enfumage** », mais il faut être logique avec soi-même : *In english*, ça fait tout de suite plus sérieux.
|
||||||
|
|
||||||
|
Vous avez des modes, une période où une technologie devient populaire, on en parle dans les médias et dans les comités de directions. Et on bascule alors à un moment où *le nom même* de cette technologie devient *le mot clef de la réussite* pour les dirigeants, du président au chefaillon de base, et ceci *sans aucun rapport avec l’aspect technique* de la technologie… auquel on ne comprend pas grand-chose, mais cet aspect importe peu.
|
||||||
|
|
||||||
|
**Cloud**, **Blockchain**, **ChatBot**, **No** et **Low Code**, **Intelligence Artificielle …** tout peut y passer. Un des exemples facile à comprendre est celui de l’USB : une vraie avancée technologique avec de vrais gains, et un vrai pas technique… mais combien as on vu de merdouilles, exploitant juste l’alimentation présente sur le connecteur, pour proposer lampe, ventilateur, chauffe tasse ou autres conneries, en affichant fièrement « USB » pour mettre un pied dans l’ère moderne ?
|
||||||
|
|
||||||
|
Au lieu d’avancer sur les vraies problématiques, qu’elle soit celle de nos utilisateurs ou de nos clients, *il faut mettre en œuvre la technologie du moment*, sans même véritablement comprendre comment elle s’applique, si elle est adaptée ou quelles sont ces limites… Tant que le bon mot est dans l'en-tête du descriptif, ou simplement dans le nom de la solution.
|
||||||
|
|
||||||
|
Les informaticiens, les vrais, ceux capables de comprendre même vaguement ce qu’essayent de cacher ces concepts, ce qui exclut pas mal de leurs chefs et collègues, ont un dilemme : ils savent que le bidule est tout à fait inadapté à la problématique posée, mais s'ils l'expriment ils passent pour des empêcheurs d’avancer et de vieux aigris qui veulent rester sur leurs acquis.
|
||||||
|
|
||||||
|
Voici ce qu’est un **TBW** : *Technologic Bullshit Word*.
|
||||||
8
content/projets/_index.md
Executable file
8
content/projets/_index.md
Executable file
@@ -0,0 +1,8 @@
|
|||||||
|
---
|
||||||
|
menu: main
|
||||||
|
weight: 10
|
||||||
|
title: Projets
|
||||||
|
---
|
||||||
|
Si je n’ai pas mile et un projets en tête, plus farfelus les uns que les autres, envoyez moi voir un psy dans les plus brefs délais.
|
||||||
|
|
||||||
|
Je vous épargne le chaos qui habite parfois mon esprit, et ne présente que quelques bouts de choses que j’ai voulu un peu plus ordonné que ce qui n’a parfois pas plus d’un titre prometteur.
|
||||||
7
content/projets/psion/_index.md
Executable file
7
content/projets/psion/_index.md
Executable file
@@ -0,0 +1,7 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Psion Series 5
|
||||||
|
date: 05 Mar 2024
|
||||||
|
draft: false
|
||||||
|
---
|
||||||
|
À la découverte d'une machine de 25 ans d'âge.
|
||||||
55
content/projets/psion/psion-5.md
Executable file
55
content/projets/psion/psion-5.md
Executable file
@@ -0,0 +1,55 @@
|
|||||||
|
---
|
||||||
|
title: Psion Series 5
|
||||||
|
date: 22 Oct 2023
|
||||||
|
tags:
|
||||||
|
- CyberDeck
|
||||||
|
- Rétro-Computing
|
||||||
|
Categories :
|
||||||
|
- PSION
|
||||||
|
---
|
||||||
|
Le Series 5 est un assistant numérique personnel commercialisé en 1997 par l’entreprise britannique PSION (depuis disparue).
|
||||||
|
Une jolie machine pour son époque, avec un large écran noir et blanc, un vrai clavier, et un ensemble de logiciels bureautiques intégrés.
|
||||||
|
L’écran se replis sur le clavier comme un ordinateur portable, mais dans une taille qui rentre dans une poche.
|
||||||
|
|
||||||
|
On y retrouve ce que l’on nommerait aujourd’hui un esprit *cyberdeck*, mais dans du matériel qui a aujourd’hui effectivement 25 ans.
|
||||||
|
|
||||||
|
## Une machine modeste, mais suffisante
|
||||||
|
Les programmes principaux et le système d’exploitation nommé «EPOC» sont contenus dans une mémoire morte (ROM) de 6 Mo. On y ajoute une mémoire RAM de 8 Mo qui va servir en même temps de mémoire de travail et d’espace de stockage pour les documents utilisateurs.
|
||||||
|
|
||||||
|
L’appareil est alimenté par deux piles AA, très courantes, et une pile bouton CR2032, qui maintient l’alimentation de la mémoire RAM quand l’alimentation principale est vide (Sinon elle s’effacerait). Une alimentation externe en 6 volts est également possible.
|
||||||
|
|
||||||
|
On remet des piles neuves et la machine revient à la vie. Pas de batteries qui auraient très mal vieilli depuis 25 ans.
|
||||||
|
|
||||||
|
Une carte mémoire au format Compact Flash (le standard de l’époque) peut être installé dans la machine. Tant qu’on utilise dessus un format de fichier FAT12, on peux avoir des capacités assez élevées par rapport à ce qui se ferait à l’époque (J’y ai mis une carte de 512 Mo).
|
||||||
|
|
||||||
|
Le microprocesseur est un ARM 7100 à 18,432 MHz. L’écran a une résolution de 640x240, avec une surface tactile de 695x280 : Sur la gauche, et en bas de l’écran se trouvent des images fixes, mais qui réagissent au niveau tactile.
|
||||||
|
|
||||||
|
Le défaut de cette génération est le câble interne de connexion à l’écran qui est fragile. C’est un défaut encore plus présent sur son évolution le PSION Series 5 MX.
|
||||||
|
|
||||||
|
## EPOC 32 - Le système d’exploitation
|
||||||
|
|
||||||
|
La mémoire ROM, qui est sur une petite carte séparée pour pouvoir la changer suivant la langue de vente de la machine, contiens :
|
||||||
|
|
||||||
|
- Le système d’exploitation EPOC, et son explorateur de fichier qui sert d’interface d’accueil, disponible sous le nom *Système*.
|
||||||
|
- Un traitement de texte avec gestion des styles et des objets intégrés, disponible sous le nom *Texte*
|
||||||
|
- Un tableur simple, mais suffisant, disponible sous le nom *Tableur*
|
||||||
|
- Un gestionnaire de base de donnée, à l’origine configuré pour gérer les contacts, mais adaptable aux données que l’on souhaite. Disponible sous le nom *Fiches*
|
||||||
|
- Un gestionnaire d’agenda (ou peut avoir plusieurs agendas), avec notamment une présentation de la semaine sur deux colonnes. Disponible sous le nom *Agenda*
|
||||||
|
- Sous le nom *Heure* se présente quelques outils de gestion horaires, avec calcul d’heure de levé et de coucher du soleil, et de décollage horaire avec une longue liste de villes mondiale (liste modifiable si besoin)
|
||||||
|
- Sous le nom *Calcul* se trouve une calculatrice scientifique.
|
||||||
|
- Reste le bouton tactile *Extra* sous lequel se cachent les autres programmes installés sur la machine, cinq autres intégrés, et ceux éventuellement installés par l’utilisateur.
|
||||||
|
- Un système de vérification d’orthographie sous le nom de *Dico*.
|
||||||
|
- Un environnement de développement dans un langage spécifique disponible sous le nom *Program*.
|
||||||
|
- Un outil pour utiliser l’appareil comme terminal infrarouge ou série, disponible sous le nom *Comms*.
|
||||||
|
- Un enregistreur de messages vocaux sous le nom *Magnéto*
|
||||||
|
- Un jeu *Bombes*, que je n’ai jamais ouvert … mais dont je doute assez peu du fonctionnement.
|
||||||
|
|
||||||
|
Le tout propose donc un panel assez complet d’outil intégré, dont la possibilité de développer ses propres programmes.
|
||||||
|
|
||||||
|
## Une découverte avec 25 ans de retard
|
||||||
|
|
||||||
|
C’est une machine qui m’a toujours fasciné, par son design, un format compact, mais incluant un clavier complet et sa réputation. Et si j’ai attendu 25 années pour franchir le pas, je ne suis pas déçu, même suivant les critères actuels.
|
||||||
|
|
||||||
|
Elle a quelque chose de rafraîchissant en étant simplement fonctionnelle et déconnectée … qui me laisse à rêver d’une version à peine modernisée.
|
||||||
|
|
||||||
|
Mais c’est une autre, et peut-être longue, histoire … ;)
|
||||||
48
content/projets/wp-hugo.md
Executable file
48
content/projets/wp-hugo.md
Executable file
@@ -0,0 +1,48 @@
|
|||||||
|
---
|
||||||
|
title : De WordPress à HUGO
|
||||||
|
date: 2024-03-07T00:00:00+00:00
|
||||||
|
draft : false
|
||||||
|
tags:
|
||||||
|
- Low tech
|
||||||
|
- Sites statiques
|
||||||
|
categories:
|
||||||
|
- Le site
|
||||||
|
---
|
||||||
|
Ce site existe depuis 2011. Il a connu plusieurs vies et vient de passer pratiquement 10 ans sous WordPress. Mais depuis plusieurs années, l’envie de changement se fait sentir, et j’ai même mis en œuvre plusieurs restructurations un peu profonde sur ce bon vieux WordPress. La version que je vous présente ici va plus loin, elle change d’outil, mais aussi de philosophie dans les profondeurs de son fonctionnement.
|
||||||
|
|
||||||
|
WordPress et HUGO ont deux façons complètement différentes d’aborder la construction d’un site web. Et ce que fait ce dernier est plus en accord avec une certaine vision que j’ai aujourd’hui de l’avenir numérique … peu être moins que ce que j’avais il y a 10 ans.
|
||||||
|
|
||||||
|
## WordPress
|
||||||
|
Je ne remets pas en cause les qualités de WordPress, qui pour moi reste bien plus fiable, simple et fonctionnel que d’autres outils de sa catégorie que j’ai eu l’occasion d’essayer. Et il reste un symbole du *Web 2.0* comme on en fabriquait si bien dans la fin des années 2000, et que l’on continue à savoir très bien faire pour *avoir son petit bout d’internet qui nous appartient*, et pas juste un bout de réseau social qui peut changer de règle comme bon lui semble.
|
||||||
|
|
||||||
|
Le fonctionnement interne de WordPress est très classique et caractéristique des *sites dynamiques*.
|
||||||
|
|
||||||
|
Quand vous demandez une page au *serveur web*, celui-ci va demander à l’*interpréteur* de vous créer une page sur mesure à vous envoyer. Ce dernier va utiliser des informations de différentes sources, mais peut faire appel à une *base de donnée* dans laquelle il peut lire et écrire de grandes quantités d’informations.
|
||||||
|
|
||||||
|
Chaque page est *construite pour vous sur mesure*, et le site est capable d’évoluer de lui-même sans même l’intervention d’un technicien.
|
||||||
|
|
||||||
|
## Créateur de site statiques
|
||||||
|
J’ai construit mes premiers sites web dans les années 90, seulement à l’aide du bloc note Windows, en tapant mon code tout à la main. Je fabriquais du *Web 1.0* ou *sites statiques*.
|
||||||
|
|
||||||
|
Quand vous demandez une page au *serveur web*, il vous donne celle qu’il a en mémoire.
|
||||||
|
|
||||||
|
C’est beaucoup plus simple, plus rapide, plus sécurisé. *Le site est figé* tant que l’on n’y a pas mis en ligne une nouvelle version. Un problème ? Pas forcément, beaucoup de sites ne sont que cela : *Mettre en ligne des informations qui ne sont modifiées que par leurs concepteurs*.
|
||||||
|
|
||||||
|
Le principal problème est que, plus le site est compliqué, plus on risque de faire des erreurs, et de rendre une part du site dysfonctionnel.
|
||||||
|
|
||||||
|
Les *générateurs de sites statiques*, dont HUGO, apportent une solution intermédiaire, une forme de *Web 1.5* : On peut utiliser la force d’un langage de programmation pour *créer des automatismes* dans la construction des pages, mais on ne fait qu’une fois le calcul, et on met *une version figée en ligne*.
|
||||||
|
|
||||||
|
En clair, la modification d’un élément communs, à plusieurs, ou toutes les pages, tel qu’un menu de navigation, n’oblige pas à aller modifier toutes les pages que cela impacte, avec tous les risques de copier-coller que cela implique.
|
||||||
|
|
||||||
|
On gagne la *fiabilité* en plus de la *simplicité*, de la *rapidité* et de la *sécurité*.
|
||||||
|
|
||||||
|
Un *site statique* va aussi être bien moins exigeant au niveau serveur et permet d’utiliser des solutions *moins consommatrices de ressources*.
|
||||||
|
|
||||||
|
À titre d’exemple, une *installation fraiche de WordPress*, sans encore aucun contenu, utilise *70 Mo* d’espace disque. Les premières versions que j’ai créées *avec HUGO* faisaient environ *10 Mo*. Après ~~un ou deux correctifs~~ m’être un peu emporté dans les optimisations, il fait environ *1,2 Mo* … et tiendrait donc sur une disquette.
|
||||||
|
|
||||||
|
## Pourquoi HUGO ?
|
||||||
|
Pourquoi pas ?
|
||||||
|
|
||||||
|
Il y a plein d’autres générateurs de site statiques, et c’est avec HUGO que j’ai vraiment commencé à tremper dans ce monde. Ce n’est pas forcément le meilleur, mais juste celui avec lequel j’ai réussi à faire un bout de truc qui me convenait.
|
||||||
|
|
||||||
|
Et je vous avoue être en plein apprentissage de ce nouvel outil, de ces capacités. Ce site risque encore de pas mal évoluer, de façon visible ou non, à mesure de mon avancée dans ce domaine.
|
||||||
26
content/res/index.md
Normal file
26
content/res/index.md
Normal file
@@ -0,0 +1,26 @@
|
|||||||
|
---
|
||||||
|
menu: main
|
||||||
|
weight: 40
|
||||||
|
title: Ressources
|
||||||
|
categories:
|
||||||
|
- Le site
|
||||||
|
---
|
||||||
|
Je vis le numérique comme plein de petites choses qui s’assemblent, des plus évidentes aux plus curieuses et confidentielles. C’est probablement une bonne idée de vous partager tous ces bouts de trucs parfois bien utiles.
|
||||||
|
|
||||||
|
Voyez cette page comme une liste de «Liens utiles» (ou de curiosités dignes d’intérêt)
|
||||||
|
|
||||||
|
## Créer un site internet
|
||||||
|
- [WordPress](https://fr.wordpress.org) - Probablement l’un des plus populaires moteurs de site internet, et de blog. L’un de mes amis dits souvent que 20% du web fonctionne avec WordPress. Si personnellement, je n’en sais rien, je l’ai utilisé pendant assez longtemps pour dire qu’il mérite sa réputation.
|
||||||
|
- [DokuWiki](https://www.dokuwiki.org/fr:dokuwiki) - Un petit moteur de Wiki que je trouve parfait pour des documentations personnelles ou d’équipe modeste (soit tout de même pas mal d’usages). Simple, modulaire et ne demandant pas de base de donnée, mais quand même un serveur PHP.
|
||||||
|
- [HUGO](https://gohugo.io) - Mon nouveau meilleur ami, c’est le système qui permet à ce site d’exister depuis 2024.
|
||||||
|
|
||||||
|
## Trouver des icônes
|
||||||
|
- [Icons par Bootstrap](https://icons.getbootstrap.com) Une bonne collection d’icônes de tout types.
|
||||||
|
- [Lucide](https://lucide.dev) Un projet pour plein d’icônes sous licence [ICS](https://fr.wikipedia.org/wiki/Licence_ISC)
|
||||||
|
- [Simple Icons](https://simpleicons.org/) Plein de logos de plein de marques
|
||||||
|
|
||||||
|
## C’est peu être utile
|
||||||
|
- [GreenLight](https://github.com/unknownskl/greenlight) Un client universel et opensource pour se connecter aux Xbox series, et un Cloud gameing Microsoft.
|
||||||
|
- [OpenCore Legacy Patcher](https://dortania.github.io/OpenCore-Legacy-Patcher/) Faire revivre des anciens Mac (enfin, ceux qui ont un peu plus de 10 ans)
|
||||||
|
- [Slides](https://github.com/maaslalani/slides) Faire des présentation … en ligne de commande avec du Markdown et simplement (adieu les images)
|
||||||
|
- [Navidrome](https://www.navidrome.org) Et si on se créais un *spotify* maison avec nos morceaux de musique à nous ? Peu être de quoi mettre sur un serveur tout les RIP de CD audio que j’ai …
|
||||||
10
content/savoirs/_index.md
Executable file
10
content/savoirs/_index.md
Executable file
@@ -0,0 +1,10 @@
|
|||||||
|
---
|
||||||
|
menu: main
|
||||||
|
weight: 20
|
||||||
|
title: Savoirs
|
||||||
|
---
|
||||||
|
Je me définis souvent comme «Touche à tout, mais spécialiste en rien», et je mets ici des bouts de choses que je connais et que j’ai l’envie de transmettre.
|
||||||
|
|
||||||
|
Ce n’est pas toujours parfaitement neutre, parfaitement sourcé, parfaitement parfait … en quelques mots : Ce n’est pas un bout d’encyclopédie.
|
||||||
|
|
||||||
|
Quelques savoirs qui se lisent comme des histoires, avec leurs simplifications et une pointe d’humour, voici ce que vous trouverez ici.
|
||||||
10
content/savoirs/gafam/_index.md
Normal file
10
content/savoirs/gafam/_index.md
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: GAFAM
|
||||||
|
date: 2024-02-25T00:00:00+00:00
|
||||||
|
draft: false
|
||||||
|
sortformat: date-asc
|
||||||
|
---
|
||||||
|
Les GAFAM, pour Google, Amazon, Facebook, Apple et Microsoft, représentent le fait quel seul cinq grandes entreprises domminent largement le monde de l’informatique, et qu’il est pratiquement aujourd’hui impossible de ne pas faire recourt à un ou plusieurs services de l’une ou plusieurs de ces entreprises, de façon directe ou indirecte, et même quand l’on as pratiquement pas de vie numérique.
|
||||||
|
|
||||||
|
Voyons un peu qui ils sont :
|
||||||
6
content/savoirs/gafam/amazon.md
Normal file
6
content/savoirs/gafam/amazon.md
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Amazon
|
||||||
|
date: 1994-07-05T07:00:00+00:00
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
7
content/savoirs/gafam/apple.md
Normal file
7
content/savoirs/gafam/apple.md
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Apple
|
||||||
|
date: 1976-04-01T07:00:00+00:00
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
|
Apple est, avec Microsoft, l’un des deux anciens dans le monde des GAMAF.
|
||||||
6
content/savoirs/gafam/facebook.md
Normal file
6
content/savoirs/gafam/facebook.md
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Facebook
|
||||||
|
date: 2004-02-04T00:00:00+00:00
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
6
content/savoirs/gafam/google.md
Normal file
6
content/savoirs/gafam/google.md
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Google
|
||||||
|
date: 1998-09-04T00:00:00+00:00
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
37
content/savoirs/gafam/ibm.md
Normal file
37
content/savoirs/gafam/ibm.md
Normal file
@@ -0,0 +1,37 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: IBM
|
||||||
|
date: 1911-06-16T00:00:00+00:00
|
||||||
|
draft: false
|
||||||
|
tags:
|
||||||
|
- IBM
|
||||||
|
---
|
||||||
|
Non, IBM n’est pas l’un des GAFAM.
|
||||||
|
|
||||||
|
Il est le roi indétrônable de l’informatique dans les années 40, 50, 60 et 70. Avant, cela n’existait simplement pas : IBM est une fusion d’entreprise qui se spécialisait dans les machines de calcul, qui fonctionnaient mécaniquement.
|
||||||
|
|
||||||
|
La société est omniprésente dans les différents domaines que compte alors l’informatique, étant, entre autres choses, l’inventeur du disque dur (en 1956) et du Personal Computer (ou PC) sortis en 1981.
|
||||||
|
|
||||||
|
Et c’est à ce moment que les choses ont un peu dérapé …
|
||||||
|
|
||||||
|
## Le PC : la machine qui échappait à son créateur
|
||||||
|
Le *P*ersonal *C*omputer modèle 5150 est un petit ordinateur tenant sur un bureau. Il n’as rien d’exceptionnel par rapport aux machines de son époque, et il se dit même qu’une partie de la direction du géant IBM ne croit pas en son succès.
|
||||||
|
|
||||||
|
Pour limiter les risque en recherche et développement, la machine utilise le plus possible de composants qui sont des standards du monde informatique de la toute fin des années 70 … et cela donne des idées à d’autres fabricants : Si ces pièces ne sont pas spécifiques à IBM, on peut les acheter aux mêmes fournisseurs, et construire un *«Compatible PC»*.
|
||||||
|
|
||||||
|
Deux points posent malgré tout problèmes :
|
||||||
|
- Le système d’exploitation «PC-DOS» est fait spécifiquement pour IBM … mais par Microsoft. Qui va vite résoudre le problème en proposant une copie conforme, renommée *«MS-DOS»* à tous ceux qui voudraient l’acheter.
|
||||||
|
- La puce qui fait la communication entre les différents composants de l’ordinateur, et s’assure de son démarrage : Le BIOS. C’est un composant essentiel, mais qui lui est véritablement conçu en interne par IBM.
|
||||||
|
|
||||||
|
C’est la société *Compaq* qui arriva le premier à créer un BIOS 100% compatible avec l’IBM PC. Et c’est a cet instant même que le *PC* devient plus qu’un ordinateur spécifique construit et vendu par IBM, il devient une façon de construire des ordinateurs capables d’interchanger leurs matériels et leurs logiciels.
|
||||||
|
|
||||||
|
Le monde venait de changer. Les fabricants de composants se multiplient, tout comme les assembleurs de tous bords. IBM n’arrivera jamais à récupérer la main sur sa création. Seuls Microsoft, pour le système d’exploitation, et Intel, pour la puce de calcul principale semblent incontournables, une alliance de multiples entreprises se créant pour définir, et faire évoluer ce qu’est alors le PC pour le mener jusque’à ce que nous utilisons de nos jours.
|
||||||
|
|
||||||
|
La formule «IBM PC ou 100% Compatible» était assez courante dans le courant des années 80 et 90.
|
||||||
|
|
||||||
|
## Le roi est mort, vive le roi.
|
||||||
|
Non IBM n’est pas mort, et reste même en 2024 une entreprise puissante … mais elle a perdu sa place d’incontournable qu’elle avait tenue pendant plusieurs décennies.
|
||||||
|
|
||||||
|
Pourquoi parler de ce non-GAFAM ?
|
||||||
|
|
||||||
|
Car le monde change, et que les incontournables d’hier ne sont pas ceux d’aujourd’hui, et sont tout aussi différents que ceux de demain. Et nos GAFAM qui ont régné sur le monde numérique pendant au moins 20 ans sont, eux-même, loin d’être invincibles.
|
||||||
113
content/savoirs/gafam/microsoft.md
Normal file
113
content/savoirs/gafam/microsoft.md
Normal file
@@ -0,0 +1,113 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Microsoft
|
||||||
|
date: 1975-04-09T00:00:00+00:00
|
||||||
|
draft: true
|
||||||
|
toc: true
|
||||||
|
tags:
|
||||||
|
- Microsoft
|
||||||
|
- Windows
|
||||||
|
categories:
|
||||||
|
- GAFAM
|
||||||
|
---
|
||||||
|
Microsoft est avec Apple dans une catégorie un peu à part : Ce sont des anciens, ceux qui ont connu l’informatique des années 70, et des survivants de cette flambée qu’est l’arrivée de la micro-informatique.
|
||||||
|
|
||||||
|
Micro-Soft, Micro-Computer’s Software … bah oui, faut pas chercher bien loin … s’est fait connaître en développant des variantes du langage de programmation BASIC qu’il était très commun de trouver intégré directement sur les ordinateurs de l’époque.
|
||||||
|
|
||||||
|
Il était alors normal, à l’époque, d’acheter un ordinateur sans l’accempagner de programmes commerciaux. Tout était fournis avec l’ordinateur pour créer ses propres programmes, et le BASIC était un langage parfait pour les débutants. Microsoft l’adaptais aux besoins des fabriquants.
|
||||||
|
|
||||||
|
Au moment de concevoir le Personal Computer modèle 5150, IBM demanda assez logiquement à son partenaire Microsoft une version du BASIC qui démarrais si aucune disquette n’était présente au démarrage de l’ordinateur (il n’avais pas de disque dur) ce qui est alors un comportement assez classique.
|
||||||
|
|
||||||
|
## Et un système d’exploitation, vous savez faire ?
|
||||||
|
|
||||||
|
Un 5150 peux démarrer de deux façon différentes :
|
||||||
|
- Sans disquette : On démarre sur le BASIC intégré au matériel de l’ordinateur
|
||||||
|
- Avec disquette : On démarre un «Système d’exploitation», plus lourd et lent à démarrer, mais avec beaucoup plus de capacité offertes.
|
||||||
|
|
||||||
|
Mais les avis divergents à la direction d’IBM sur le succés du 5150, et même si ils en ont le savoir faire, il est décidé d’utiliser un système d’exploitation fournis par une autre entreprise. Si l’entreprise Digital Research (aujourd’hui disparue) semble à priori la plus à même de répondre aux besoin, les négociations tournent mal.
|
||||||
|
|
||||||
|
Microsoft se montre lui beaucoup plus souple dans les négociation … et c’est un coup de bluf, car Microsoft n’as jamais fait de système d’exploitation, et [rachete celui d’une petite entreprise pour le revendre à IBM](https://fr.wikipedia.org/wiki/QDOS) dans des conditions qui conviennent à ce dernier. Et notamment l’absence d’une exclusivité pour le géant.
|
||||||
|
|
||||||
|
Ce détail d’importance permet de devenir un acteur central dans le boulversement qu’est le PC devenant standard de conception des ordinateurs. Le *Disk Operating System* de Microsoft est PC-DOS pour IBM et *MS-DOS* pour tout autre acheteur qui voudrais le même système pour son compatible PC.
|
||||||
|
|
||||||
|
## Système d’exploitation nouvelle génération.
|
||||||
|
Arrivé dans les années 80, IBM fait du PC, devant accepter l’inévitable : il as crée par erreur un nouveau marché. Microsoft de son coté prend une nouvelle ampleur et diversifie ses activités.
|
||||||
|
|
||||||
|
En 1982 un tableur nommé Multiplan, suivis en 1983 du traitement de texte Microsoft Word. Puis en 1985, Excel (alors uniquement sur Mac) et une obscure idée : Windows … qui est très loin d’être un succés.
|
||||||
|
|
||||||
|
Arrivée vers la fin des années 80, MS-Dos, bien qu’ayant évolué, souffre malgré tout de ses lacune de conception originales dans un monde ou l’informatique va à vive allure. Et c’est un nouveau partenaria entre IBM et Microsoft qui aboutis à OS/2, la nouvelle génération des systèmes d’exploitations pour PC (et compatible)
|
||||||
|
|
||||||
|
En 1987, alors que Windows version 2 débute sa même carrière catastrophique que la version 1, IBM sort un nouvel ordinateur le PS/2, accompagné d’OS/2 le nouveau système. IBM s’occupe des versions fournie avec ses machines, et Microsoft de celles vendue pour les Compatible PC.
|
||||||
|
|
||||||
|
## Le maître et l’éléve
|
||||||
|
Les annés 90 marquent un tournant dans la relation entre les deux grands noms de l’informatique.
|
||||||
|
|
||||||
|
Microsoft se disocie d’IBM pour le projet OS/2, mais emporta avec lui le savoir faire aquis, et s’en servis largement pour batir Windows NT : La nouvelle base système des futurs Windows.
|
||||||
|
|
||||||
|
En 1990 Windows 3, qui s’installe au dessus du DOS, les deux étant vendu séparément, est un succés, tandit que le nouvel OS/2 est vu comme couteux et complexe.
|
||||||
|
|
||||||
|
La version 2.0 d’OS/2 est vendue par IBM comme un meilleur Windows que Windows, ayant la capacité de parfaitement faire fonctionner les applications Windows 3. Un coup bas anticipé par Microsoft qui présente les premières version test du nouveau Windows 4, avec lequel OS/2 n’est pas compatible.
|
||||||
|
|
||||||
|
En 1995 sort Windows 4 sous le nom commercial de *Windows 95*, toujours sur une base DOS, mais ici invisible de l’utilisateur, et Windows NT 4, sa déclinaison profesionnelle. Ces versions sont vendue comme ayant besoin d’un clavier avec trois touches suplémentaires : Deux touches Windows et une touche Menu.
|
||||||
|
|
||||||
|
Elle n’ont en réalité jamais rien eu d’indispensable, mais marquent définitivement les PC comme des machines à faire fonctionner Windows.
|
||||||
|
|
||||||
|
IBM n’as jamais intégré ces touches aux claviers de ses ordinateurs (La division ordinateur personnel d’IBM est racheté par le constructeur Lenovo en 2005)
|
||||||
|
|
||||||
|
## Un monde de fenêtre connectés
|
||||||
|
Le monde de l’informatique personnelle est devenu PC, et le monde du PC est devenu celui de Windows. Et en face … il reste assez peu de choses.
|
||||||
|
|
||||||
|
Apple essaye d’expérimenter le suicide, IBM est partis s’occuper de serveurs, il ne resterais que le marché des ordinateurs de poches, ou quelques entreprises tel que PSION ou PALM ont un succés, et qui resterais à conquérir. Ha, oui, il y as aussi quelques barbus allumé au CERN ou au MIT qui révent d’un monde connecté «[vague mais prometteur](https://fr.wikipedia.org/wiki/Tim_Berners-Lee)».
|
||||||
|
|
||||||
|
Passons rapidement sur la question de Microsoft et les machines de poches : Si ils s’y sont presque toujours montré présents, cela va du quelquonque au catastrophique. Ils n’y ont tenu une place que par leur puissance financiére et marketing, et les seules fois ou ils ont marqué les esprits ce n’est que pour être la risée de la communauté informatique. Mais quand on est Microsoft on peux se permettre des échecs, et même des gros.
|
||||||
|
|
||||||
|
Et justement, être l’homme le plus riche du monde, c’est être un peu visionnaire. Et faire communiquer des ordinateurs les uns avec les autres d’un bout à l’autre du monde, c’est une affaire de professionnel, de spécialistes de l’industrie, pas d’universitaires : Bill Gates ne crois pas en cette luibie de scientifique que l’on nomme «Internet». Il faut quelque chose de bien plus sérieux «MicroSoft Network», ou MSN pour les intimes.
|
||||||
|
|
||||||
|
Non MSN n’est pas un service de messagerie en direct. «MSN Messager» est la seule brique qui est resté d’un vaste projet visant à faire un Internet dans la vision de Microsoft … et quand on parle de plantage, celui-ci est assez joli.
|
||||||
|
|
||||||
|
Joli oui, mais ingénieux dans son rattrappage.
|
||||||
|
|
||||||
|
Windows 98 n’est pas bien différents dans ces bases que Windows 95. Mais il est l’incarnation de l’une de ces idées marketing de génie qui fait trembler les informaticiens (les vrais, pas les chef de services informatiques) : Windows 98 est «fournis avec Internet», c’est l’icone «e» bleu sur le bureau noté «internet».
|
||||||
|
|
||||||
|
Derrière cette icône mytique se cache *Microsoft Internet Explorer* le navigateur internet par Microsoft. Il viens fusionner avec tout certains des composant vitaux du système d’exploitation et ne peux pas être déinstallé ou même vaguement déactivé. Pour l’utilisateur c’est déjà fournis avec son ordinateur et il n’y as pas besoin de chercher plus loin, en plus c’est bien nommé «Internet» comme le truc dont ils parlent à la télévision.
|
||||||
|
|
||||||
|
Un coup de génie marketing qui mis fin à la première guerre des navigateurs web.
|
||||||
|
|
||||||
|
## Attention au Bug
|
||||||
|
Je dit souvent que Microsoft as sortis ce qui doit être son meilleur et son prie système d’exploitation la même année.
|
||||||
|
- Le pire est *Windows ME* (Milenium Edition), une évolution de Windows 98, toujours sur une base d’un DOS largement au dela de ses limites.
|
||||||
|
- Le meilleur est *Windows 2000*, non commercial pour Windows NT 5.0, stable et sobre.
|
||||||
|
|
||||||
|
Imédiatement après, en 2001, ils sortent *Windows XP*. Un NT 5.1, qui n’est donc qu’un Windows 2000 redécorré et dans le quel on as récupéré les quelques nouveautés de Windows ME (enfin surtout le peu de chose qui y fonctionnais correctement). Mais si le passage à une base NT est un vrai coup de jeune pour les versions familiales, et que la base de Windows 2000 est bien adapté, on sent certaines négligeances sur certains point important.
|
||||||
|
|
||||||
|
Microsoft Internet Explorer, le navigateur internet maison, qui depuis son placement dans Windows 98 as une domination écrasante sur le marché, as une évolution tout à fait paresseuse, et reste un souvenir cauchemardesque pour pratiquement tout les informaticiens qui fabriquais du Web à cette époque. Ces nouveaux windows sont l’occasion pour passer de la version 5 à la version 6, mais cet *IE6* est l’exemple même que, quand on est ultra dominant, on se repose sur l’existant au détriment de tous. À croire que les équipes de développement derrière ce composant essentiel avais juste disparu, pas forcément étonnant quand on se souviens que microsoft ne croyais pas dans Internet.
|
||||||
|
|
||||||
|
Et le monde continu d’avancer, et les années 2000 sont celles de l’explosion d’Interne.
|
||||||
|
|
||||||
|
Ho, on peux jouer de sa position pour écraser un petit *BeOS* qui voulais s’installer a coté du géant Windows, mais d’autres se font un nom dans des marché bien moins accessibles : *Google* permet de s’y retrouver dans ce qui deviens un vaste réseau, *Amazon* permet d’y faire des achats, *Blackberry* fait rentrer le monde connecté dans les poches … même ce vieux *Apple* sort la machine à aller sur internet : l’*iMac* l’ordinateur aux couleurs transparentes et acidulées.
|
||||||
|
|
||||||
|
Le navigateur internet Netscape, mort avec le tour de passe passe de Windows 98, renais sous le nom de FireFox : Il n’est pas fourni avec la machine, mais prend, lui, soin de ses utilisateurs avec plein de nouveauté et d’astuces.
|
||||||
|
|
||||||
|
Microsoft est sur d’autres sujets :
|
||||||
|
- Attaquer IBM dans l’une de ses place fortes, l’informatique d’entreprise et sa suite «Lotus»
|
||||||
|
- et Préparrer le futur de Windows avec le projet Vienna … qui, pour faire simple, s’embourbe.
|
||||||
|
|
||||||
|
## L’êre Ballmer
|
||||||
|
De janvier 2000 à février 2014, l’entreprise est sous la direction de [Steve Ballmer](https://fr.wikipedia.org/wiki/Steve_Ballmer), remplaçant l’iconique Bill Gates qui y était depuis la création de l’entreprise. Le personnage est haut en couleur, entier, virulant et démonstratif, largement opposé au monde de l’*opensource* qui as donné naissance à cet étrange *internet*, le qualifiant de «Cancer qui contamine la propriété intellectuelle». La tâche qui lui incombe est loin d’être simple, et ces années de direction son assez marquantes.
|
||||||
|
|
||||||
|
…
|
||||||
|
|
||||||
|
Mais en 2007, Microsoft est toujours aussi visionnaire dans le domaine du mobile : Steve Ballmer déclarant qu’«ll n'y a aucune chance que l'iPhone gagne une part de marché significative. Aucune chance».
|
||||||
|
|
||||||
|
La même année, Microsoft est toujours sur l’échec de son idée d’Ultra Mobile PC (UMPC), un toute petite machine, puissante et coûteuse, et ne crois pas du tout en l’idée d’ASUS le *NetBook*, une toute petit machine, très peu puissante et très peu coûteuse. La puissance est bien trop faible pour y faire tourner le nouveau Windows, et Microsoft refuse de leur vendre des licences de l’ancétre Windows XP. ASUS sort la machine avec une version adapté de Linux, et c’est un succés planétaire, un nouveau marché qui se crée, et oblige, dans l’urgence, Microsoft à étendre la durée de vie de ce bon vieux XP.
|
||||||
|
|
||||||
|
## L’ére Ballmer
|
||||||
|
En janvier 2000, Bill Gates passe la direction de l’entreprise à [Steve Ballmer](https://fr.wikipedia.org/wiki/Steve_Ballmer), un personnage haut en couleur, entier, virulant et démonstratif.
|
||||||
|
|
||||||
|
*Windows 2000*, nom commercial de Windows *NT 5.0* viens de sortir, et *Windows Millennium Edition* (ME), qui est lui une nouvelle évolution de Windows 4, aprés les versions 95 et 98, est sur le point d’arriver. J’ai l’habitude de dire que Microsoft as sortis le meilleur (avec Win 2000) et le pire (avec Win ME) de ses systèmes d’exploitation en moins d’un an.
|
||||||
|
|
||||||
|
L’ultime bricolage d’un DOS largement au dessus de ses capacités, qui sert donc de base à *Windows Millennium*, est assez catastrophique et précipite l’arrivée de son successeur, sortis à peine plus d’un an plus tard, le 25 octobre 2001 : *Windows XP*.
|
||||||
|
|
||||||
|
Windows XP est un NT 5.1, et donc une simple évolution du très bon Windows 2000. On y gagne le style graphique «luna» si spécifique à cette version, le passage pour tous, professionnel comme particulier, à une base NT identique, tout en récupérant les quelques nouveautés arrivée avec Windows Millennium. On y trouve aussi le navigateur internet maison, qui passe en version 6, une mise à jours paresseuse qui se montre assez tristement célébre.
|
||||||
|
|
||||||
|
Microsoft ne crois toujours pas vraiment en internet, mais son navigateur *Internet Explorer* y est le roi incontestable, IE6 restant le petit «e» bleu nommé «internet» sur le bureau des Windows depuis plusieurs années maintenant.
|
||||||
11
content/savoirs/jv/_index.md
Executable file
11
content/savoirs/jv/_index.md
Executable file
@@ -0,0 +1,11 @@
|
|||||||
|
---
|
||||||
|
weight: 20
|
||||||
|
title: Jeux-Vidéo
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
|
|
||||||
|
Je suis un joueur de jeux-vidéo, et même si j'ai déjà eu l'occasion d'en toucher toute les plateformes, du téléphone portable à l'ordinateur, mes habitudes sont plutôt du coté des *consolles de jeux* … et plutôt chez *Sony*.
|
||||||
|
|
||||||
|
J'ai eu de trés nombreux système entre les mains, de l'Atari 512 STe au PC (Windows, Mac et Linux), passant par Nintendo en portable (GameBoy Pocket / Color / Advance, DS & New 3DS XL) ou non (Wii, Wii U et Switch), jusque à Sega, avec la Dreamcast, ou du Microsoft (Xbox, Xbox 360, Xbox Series S).
|
||||||
|
|
||||||
|
Mais c'est avec du Sony (PSP, PS1/2/3/4) que j'ai, et de façon trés large, le plus d'heure de jeux.
|
||||||
4
content/savoirs/jv/autres/_index.md
Executable file
4
content/savoirs/jv/autres/_index.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 90
|
||||||
|
title: Jouer aussi autrement
|
||||||
|
---
|
||||||
4
content/savoirs/jv/autres/lin.md
Executable file
4
content/savoirs/jv/autres/lin.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 40
|
||||||
|
title: Gnu/Linux
|
||||||
|
---
|
||||||
4
content/savoirs/jv/autres/mac.md
Executable file
4
content/savoirs/jv/autres/mac.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 30
|
||||||
|
title: Apple Machintosh
|
||||||
|
---
|
||||||
4
content/savoirs/jv/autres/st.md
Executable file
4
content/savoirs/jv/autres/st.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Atari 512 STe
|
||||||
|
---
|
||||||
4
content/savoirs/jv/autres/win.md
Executable file
4
content/savoirs/jv/autres/win.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 20
|
||||||
|
title: Windows
|
||||||
|
---
|
||||||
4
content/savoirs/jv/ms/360.md
Executable file
4
content/savoirs/jv/ms/360.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 20
|
||||||
|
title: Xbox 360
|
||||||
|
---
|
||||||
4
content/savoirs/jv/ms/_index.md
Executable file
4
content/savoirs/jv/ms/_index.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 30
|
||||||
|
title: Microsoft Xbox
|
||||||
|
---
|
||||||
4
content/savoirs/jv/ms/series-s.md
Executable file
4
content/savoirs/jv/ms/series-s.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 30
|
||||||
|
title: Xbox Series S - Carbon Black Edition
|
||||||
|
---
|
||||||
4
content/savoirs/jv/ms/xbox.md
Executable file
4
content/savoirs/jv/ms/xbox.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Xbox
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/3ds.md
Executable file
4
content/savoirs/jv/nintendo/3ds.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 60
|
||||||
|
title: New 3DS XL
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/_index.md
Executable file
4
content/savoirs/jv/nintendo/_index.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 20
|
||||||
|
title: Nintendo
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/ds.md
Executable file
4
content/savoirs/jv/nintendo/ds.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 30
|
||||||
|
title: DS
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/gb.md
Executable file
4
content/savoirs/jv/nintendo/gb.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: GameBoy Pocket
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/gba.md
Executable file
4
content/savoirs/jv/nintendo/gba.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 30
|
||||||
|
title: GameBoy Advance
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/gbc.md
Executable file
4
content/savoirs/jv/nintendo/gbc.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 20
|
||||||
|
title: GameBoy Color
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/switch.md
Executable file
4
content/savoirs/jv/nintendo/switch.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 70
|
||||||
|
title: Switch
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/wii.md
Executable file
4
content/savoirs/jv/nintendo/wii.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 40
|
||||||
|
title: Wii
|
||||||
|
---
|
||||||
4
content/savoirs/jv/nintendo/wiiu.md
Executable file
4
content/savoirs/jv/nintendo/wiiu.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 50
|
||||||
|
title: Wii U
|
||||||
|
---
|
||||||
4
content/savoirs/jv/sony/_index.md
Executable file
4
content/savoirs/jv/sony/_index.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Sony PlayStation
|
||||||
|
---
|
||||||
5
content/savoirs/jv/sony/ps1.md
Executable file
5
content/savoirs/jv/sony/ps1.md
Executable file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
weight: 10
|
||||||
|
title: Sony PlayStation (1)
|
||||||
|
date: 1995-09-29T00:00:00+00:00
|
||||||
|
---
|
||||||
5
content/savoirs/jv/sony/ps2.md
Executable file
5
content/savoirs/jv/sony/ps2.md
Executable file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
weight: 20
|
||||||
|
title: Sony PlayStation 2
|
||||||
|
date: 2000-11-24T00:00:00+00:00
|
||||||
|
---
|
||||||
5
content/savoirs/jv/sony/ps3.md
Executable file
5
content/savoirs/jv/sony/ps3.md
Executable file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
weight: 30
|
||||||
|
title: Sony PlayStation 3
|
||||||
|
date: 2007-03-23T00:00:00+00:00
|
||||||
|
---
|
||||||
5
content/savoirs/jv/sony/ps4.md
Executable file
5
content/savoirs/jv/sony/ps4.md
Executable file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
weight: 50
|
||||||
|
title: Sony PlayStation 4
|
||||||
|
date: 2015-06-23T00:00:00+00:00
|
||||||
|
---
|
||||||
4
content/savoirs/jv/sony/psp.md
Executable file
4
content/savoirs/jv/sony/psp.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
---
|
||||||
|
weight: 40
|
||||||
|
title: Sony PlayStation Portable
|
||||||
|
---
|
||||||
70
hugo.toml
Executable file
70
hugo.toml
Executable file
@@ -0,0 +1,70 @@
|
|||||||
|
baseURL = 'https://slowbrain.net/'
|
||||||
|
languageCode = 'fr'
|
||||||
|
language = 'fr'
|
||||||
|
title = 'SlowBrain . net'
|
||||||
|
theme = 'slowbrain'
|
||||||
|
|
||||||
|
readOtherPosts = "Lire plus …"
|
||||||
|
|
||||||
|
copyright = '<a href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank" rel="noopener">CC BY-NC 4.0</a>'
|
||||||
|
|
||||||
|
defaultContentLanguage = "fr"
|
||||||
|
|
||||||
|
[params]
|
||||||
|
dateform = "2 Jan 2006"
|
||||||
|
dateformShort = "2/01"
|
||||||
|
|
||||||
|
homeSubtitle = "Quelques idées …"
|
||||||
|
enableThemeToggle = true
|
||||||
|
|
||||||
|
|
||||||
|
[[params.buttons]]
|
||||||
|
name = "Projets"
|
||||||
|
url = "/projets"
|
||||||
|
|
||||||
|
[[params.buttons]]
|
||||||
|
name = "Savoirs"
|
||||||
|
url = "/savoirs"
|
||||||
|
|
||||||
|
[[params.buttons]]
|
||||||
|
name = "Humeurs"
|
||||||
|
url = "/humeurs"
|
||||||
|
|
||||||
|
[params.logo]
|
||||||
|
logoText = "SlowBrain . net"
|
||||||
|
|
||||||
|
[params.MainLogo]
|
||||||
|
path = "/g-logo.png"
|
||||||
|
alt = "SlowBrain . net"
|
||||||
|
maxwidth = 285
|
||||||
|
|
||||||
|
[params.author]
|
||||||
|
name = "SlowBrain"
|
||||||
|
|
||||||
|
[params.footer]
|
||||||
|
trademark = true
|
||||||
|
copyright = true
|
||||||
|
|
||||||
|
[[params.LastPost]]
|
||||||
|
title="Technologic Bullshit Words"
|
||||||
|
url="/humeurs/tbw/"
|
||||||
|
|
||||||
|
[[params.LastPost]]
|
||||||
|
title="À la découverte de la VOIP OpenSource"
|
||||||
|
url="/humeurs/freepbx/"
|
||||||
|
|
||||||
|
[[params.LastPost]]
|
||||||
|
title="De WordPress à Hugo"
|
||||||
|
url="/projets/wp-hugo/"
|
||||||
|
|
||||||
|
[[params.LastPost]]
|
||||||
|
title = "Petite histroire d’imprimante"
|
||||||
|
url = "/humeurs/imprimante-samsung/"
|
||||||
|
|
||||||
|
#[[params.LastPost]]
|
||||||
|
# title = "GAFAM > IBM"
|
||||||
|
# url = "/savoirs/gafam/ibm/"
|
||||||
|
|
||||||
|
#[[params.LastPost]]
|
||||||
|
# title = "PSION series 5"
|
||||||
|
# url = "/projets/psion/psion-5/"
|
||||||
41
i18n/ex.toml
Executable file
41
i18n/ex.toml
Executable file
@@ -0,0 +1,41 @@
|
|||||||
|
# Translations for French
|
||||||
|
# https://gohugo.io/content-management/multilingual/#translation-of-strings
|
||||||
|
|
||||||
|
Feb = "Fev"
|
||||||
|
|
||||||
|
# Generic
|
||||||
|
#
|
||||||
|
[translations]
|
||||||
|
other = "Traductions"
|
||||||
|
|
||||||
|
[postAvailable]
|
||||||
|
other = "Aussi disponible en"
|
||||||
|
|
||||||
|
|
||||||
|
# 404.html
|
||||||
|
#
|
||||||
|
[archives]
|
||||||
|
other = "Les archives"
|
||||||
|
|
||||||
|
[home]
|
||||||
|
other = "Accueil"
|
||||||
|
|
||||||
|
[notFound]
|
||||||
|
other = "Oups, page non trouvée …"
|
||||||
|
|
||||||
|
|
||||||
|
# posts/single.html
|
||||||
|
#
|
||||||
|
[readingTime]
|
||||||
|
one = "Une minute"
|
||||||
|
other = "{{ .Count }} minutes"
|
||||||
|
|
||||||
|
[tableOfContents]
|
||||||
|
other = "Table des matières"
|
||||||
|
|
||||||
|
[wordCount]
|
||||||
|
one = "Un Mot"
|
||||||
|
other = "{{ .Count }} Mots"
|
||||||
|
|
||||||
|
[lastModified]
|
||||||
|
other = "Mise à jour"
|
||||||
12
i18n/fr.toml
Normal file
12
i18n/fr.toml
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
|
||||||
|
[long_month_1]
|
||||||
|
other = "janvier"
|
||||||
|
|
||||||
|
[short_month_1]
|
||||||
|
other = "jan"
|
||||||
|
|
||||||
|
[long_month_2]
|
||||||
|
other = "février"
|
||||||
|
|
||||||
|
[short_month_2]
|
||||||
|
other = "Fev"
|
||||||
14
themes/slowbrain/CHANGELOG.md
Executable file
14
themes/slowbrain/CHANGELOG.md
Executable file
@@ -0,0 +1,14 @@
|
|||||||
|
# Changelog
|
||||||
|
|
||||||
|
All notable changes to this project will be documented in this file.
|
||||||
|
|
||||||
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||||
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||||
|
|
||||||
|
## 2020-05-13
|
||||||
|
|
||||||
|
### Added
|
||||||
|
- Changelog
|
||||||
|
|
||||||
|
### Changed
|
||||||
|
- In order to make the image handling more consistent, the `cover` tag does not force the image to live in `/img/` anymore. [!131](https://github.com/rhazdon/hugo-theme-hello-friend-ng/pull/131).
|
||||||
4
themes/slowbrain/CONTRIBUTING.md
Executable file
4
themes/slowbrain/CONTRIBUTING.md
Executable file
@@ -0,0 +1,4 @@
|
|||||||
|
|
||||||
|
# How to contribute
|
||||||
|
|
||||||
|
If you spot any bugs, please use [Issue Tracker](https://github.com/rhazdon/hugo-theme-hello-friend-ng/issues) or if you want to add a new feature directly please create a new [Pull Request](https://github.com/rhazdon/hugo-theme-hello-friend-ng/pulls).
|
||||||
11
themes/slowbrain/LICENSE.md
Executable file
11
themes/slowbrain/LICENSE.md
Executable file
@@ -0,0 +1,11 @@
|
|||||||
|
The MIT License (MIT)
|
||||||
|
|
||||||
|
Original work Copyright (c) 2018 Track3<br />
|
||||||
|
Original work Copyright (c) 2019 panr<br />
|
||||||
|
Modified work Copyright (c) 2019 Djordje Atlialp<br />
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
210
themes/slowbrain/README.md
Executable file
210
themes/slowbrain/README.md
Executable file
@@ -0,0 +1,210 @@
|
|||||||
|
# Hello Friend NG
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
## General informations
|
||||||
|
|
||||||
|
This theme was highly inspired by the [hello-friend](https://github.com/panr/hugo-theme-hello-friend) and [hermit](https://github.com/Track3/hermit). A lot of kudos for their great work.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Table of Contents
|
||||||
|
|
||||||
|
- [Features](#features)
|
||||||
|
- [How to start](#how-to-start)
|
||||||
|
- [How to configure](#how-to-configure)
|
||||||
|
- [More](#more-things)
|
||||||
|
- [Built in shortcodes](#built-in-shortcodes)
|
||||||
|
- [image](#image)
|
||||||
|
- [Code highlighting](#code-highlighting)
|
||||||
|
- [Favicon](#favicon)
|
||||||
|
- [Audio Support](#audio-support)
|
||||||
|
- [Social Icons](#social-icons)
|
||||||
|
- [Known issues](#known-issues)
|
||||||
|
- [How to edit the theme](#how-to-edit-the-theme)
|
||||||
|
- [Changelog](CHANGELOG.md)
|
||||||
|
- [Sponsoring](#sponsoring)
|
||||||
|
- [Licence](#licence)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Features
|
||||||
|
|
||||||
|
- Theming: **dark/light mode**, depending on your system preferences or the users choice
|
||||||
|
- Great reading experience thanks to [**Inter font**](https://rsms.me/inter/), made by [Rasmus Andersson](https://rsms.me/about/)
|
||||||
|
- Nice code highlighting thanks to [**PrismJS**](https://prismjs.com)
|
||||||
|
- An easy way to modify the theme with Hugo tooling
|
||||||
|
- Fully responsive
|
||||||
|
- Support for audio in posts (thanks to [@talbotp](https://github.com/talbotp))
|
||||||
|
- Builtin (enableable/disableable) multilanguage menu
|
||||||
|
- Support for social icons
|
||||||
|
- Support for sharing buttons
|
||||||
|
- Support for [Commento](https://commento.io)
|
||||||
|
- Support for [Plausible](https://plausible.io) (thanks to [@Joffcom](https://github.com/Joffcom))
|
||||||
|
|
||||||
|
## How to start
|
||||||
|
|
||||||
|
You can download the theme manually by going to [https://github.com/rhazdon/hugo-theme-hello-friend-ng.git](https://github.com/rhazdon/hugo-theme-hello-friend-ng.git) and pasting it to `themes/hello-friend-ng` in your root directory.
|
||||||
|
|
||||||
|
You can also clone it directly to your Hugo folder:
|
||||||
|
|
||||||
|
``` bash
|
||||||
|
$ git clone https://github.com/rhazdon/hugo-theme-hello-friend-ng.git themes/hello-friend-ng
|
||||||
|
```
|
||||||
|
|
||||||
|
If you don't want to make any radical changes, it's the best option, because you can get new updates when they are available. To do so, include it as a git submodule:
|
||||||
|
|
||||||
|
``` bash
|
||||||
|
$ git submodule add https://github.com/rhazdon/hugo-theme-hello-friend-ng.git themes/hello-friend-ng
|
||||||
|
```
|
||||||
|
|
||||||
|
## How to configure
|
||||||
|
|
||||||
|
The theme doesn't require any advanced configuration. Just copy the following config file.
|
||||||
|
To see all possible configurations, [check the docs](docs/config.md).
|
||||||
|
Note: There are more options to configure. Take a look into the `config.toml` in `exampleSite`.
|
||||||
|
|
||||||
|
``` toml
|
||||||
|
baseurl = "localhost"
|
||||||
|
title = "My Blog"
|
||||||
|
languageCode = "en-us"
|
||||||
|
theme = "hello-friend-ng"
|
||||||
|
paginate = 10
|
||||||
|
|
||||||
|
[params]
|
||||||
|
dateform = "Jan 2, 2006"
|
||||||
|
dateformShort = "Jan 2"
|
||||||
|
dateformNum = "2006-01-02"
|
||||||
|
dateformNumTime = "2006-01-02 15:04"
|
||||||
|
|
||||||
|
# Subtitle for home
|
||||||
|
homeSubtitle = "A simple and beautiful blog"
|
||||||
|
|
||||||
|
# Set disableReadOtherPosts to true in order to hide the links to other posts.
|
||||||
|
disableReadOtherPosts = false
|
||||||
|
|
||||||
|
# Enable sharing buttons, if you like
|
||||||
|
enableSharingButtons = true
|
||||||
|
|
||||||
|
# Show a global language switcher in the navigation bar
|
||||||
|
enableGlobalLanguageMenu = true
|
||||||
|
|
||||||
|
# Metadata mostly used in document's head
|
||||||
|
description = "My new homepage or blog"
|
||||||
|
keywords = "homepage, blog"
|
||||||
|
images = [""]
|
||||||
|
|
||||||
|
[taxonomies]
|
||||||
|
category = "blog"
|
||||||
|
tag = "tags"
|
||||||
|
series = "series"
|
||||||
|
|
||||||
|
[languages]
|
||||||
|
[languages.en]
|
||||||
|
title = "Hello Friend NG"
|
||||||
|
subtitle = "A simple theme for Hugo"
|
||||||
|
keywords = ""
|
||||||
|
copyright = '<a href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank" rel="noopener">CC BY-NC 4.0</a>'
|
||||||
|
readOtherPosts = "Read other posts"
|
||||||
|
|
||||||
|
[languages.en.params.logo]
|
||||||
|
logoText = "hello friend ng"
|
||||||
|
logoHomeLink = "/"
|
||||||
|
# or
|
||||||
|
#
|
||||||
|
# path = "/img/your-example-logo.svg"
|
||||||
|
# alt = "Your example logo alt text"
|
||||||
|
|
||||||
|
# And you can even create generic menu
|
||||||
|
[[menu.main]]
|
||||||
|
identifier = "blog"
|
||||||
|
name = "Blog"
|
||||||
|
url = "/posts"
|
||||||
|
```
|
||||||
|
|
||||||
|
## More things
|
||||||
|
|
||||||
|
### Built-in shortcodes
|
||||||
|
|
||||||
|
Of course you are able to use all default shortcodes from hugo (https://gohugo.io/content-management/shortcodes/).
|
||||||
|
|
||||||
|
#### image
|
||||||
|
|
||||||
|
Properties:
|
||||||
|
|
||||||
|
- `src` (required)
|
||||||
|
- `alt` (optional)
|
||||||
|
- `position` (optional, default: `left`, options: [`left`, `center`, `right`])
|
||||||
|
- `style`
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
``` golang
|
||||||
|
{{< image src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" >}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Code highlighting
|
||||||
|
|
||||||
|
By default the theme is using PrismJS to color your code syntax. All you need to do is to wrap you code like this:
|
||||||
|
|
||||||
|
<pre>
|
||||||
|
``` html
|
||||||
|
// your code here
|
||||||
|
```
|
||||||
|
</pre>
|
||||||
|
|
||||||
|
### Favicon
|
||||||
|
|
||||||
|
Check the [docs](docs/favicons.md).
|
||||||
|
|
||||||
|
### Audio Support
|
||||||
|
|
||||||
|
You wrote an article and recorded it? Or do you have a special music that you would like to put on a certain article? Then you can do this now without further ado.
|
||||||
|
|
||||||
|
In your article add to your front matters part:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
audio: path/to/file.mp3
|
||||||
|
```
|
||||||
|
|
||||||
|
## Social Icons:
|
||||||
|
|
||||||
|
A large variety of social icons are available and can be configured like this:
|
||||||
|
|
||||||
|
```toml
|
||||||
|
[[params.social]]
|
||||||
|
name = "<site>"
|
||||||
|
url = "<profile_URL>"
|
||||||
|
```
|
||||||
|
|
||||||
|
Take a look into this [list](docs/svgs.md) of available icon options.
|
||||||
|
|
||||||
|
If you need another one, just open an issue or create a pull request with your wished icon. :)
|
||||||
|
|
||||||
|
## Known issues
|
||||||
|
|
||||||
|
There is a bug in Hugo that sometimes causes the main page not to render correctly. The reason is an empty taxonomy part.
|
||||||
|
Related issue tickets: [!14](https://github.com/rhazdon/hugo-theme-hello-friend-ng/issues/14) [!59](https://github.com/rhazdon/hugo-theme-hello-friend-ng/issues/59).
|
||||||
|
|
||||||
|
Either you comment it out completely or you write the following in
|
||||||
|
|
||||||
|
``` toml
|
||||||
|
[taxonomies]
|
||||||
|
tag = "tags"
|
||||||
|
category = "categories"
|
||||||
|
```
|
||||||
|
|
||||||
|
## How to edit the theme
|
||||||
|
|
||||||
|
Just edit it. You don't need any node stuff. ;)
|
||||||
|
|
||||||
|
## Sponsoring
|
||||||
|
|
||||||
|
If you like my work and if you think this project is worth to support it, just <br />
|
||||||
|
<a href="https://www.buymeacoffee.com/djordjeatlialp" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-green.png" alt="Buy Me A Coffee" style="height: 51px !important;width: 217px !important;" ></a>
|
||||||
|
|
||||||
|
## Licence
|
||||||
|
|
||||||
|
Copyright © 2019-2021 Djordje Atlialp
|
||||||
|
|
||||||
|
The theme is released under the MIT License. Check the [original theme license](https://github.com/rhazdon/hugo-theme-hello-friend-ng/blob/master/LICENSE.md) for additional licensing information.
|
||||||
8
themes/slowbrain/archetypes/default.md
Executable file
8
themes/slowbrain/archetypes/default.md
Executable file
@@ -0,0 +1,8 @@
|
|||||||
|
---
|
||||||
|
title: "{{ replace .Name "-" " " | title }}"
|
||||||
|
date: {{ .Date }}
|
||||||
|
draft: true
|
||||||
|
comments: false
|
||||||
|
images:
|
||||||
|
---
|
||||||
|
|
||||||
10
themes/slowbrain/archetypes/posts.md
Executable file
10
themes/slowbrain/archetypes/posts.md
Executable file
@@ -0,0 +1,10 @@
|
|||||||
|
---
|
||||||
|
title: "{{ replace .Name "-" " " | title }}"
|
||||||
|
date: {{ .Date }}
|
||||||
|
draft: true
|
||||||
|
toc: false
|
||||||
|
images:
|
||||||
|
tags:
|
||||||
|
- untagged
|
||||||
|
---
|
||||||
|
|
||||||
57
themes/slowbrain/assets/js/main.js
Executable file
57
themes/slowbrain/assets/js/main.js
Executable file
@@ -0,0 +1,57 @@
|
|||||||
|
/**
|
||||||
|
* Theming.
|
||||||
|
*
|
||||||
|
* Supports the preferred color scheme of the operation system as well as
|
||||||
|
* the theme choice of the user.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
const themeToggle = document.querySelector(".theme-toggle");
|
||||||
|
const chosenTheme = window.localStorage && window.localStorage.getItem("theme");
|
||||||
|
const chosenThemeIsDark = chosenTheme == "dark";
|
||||||
|
const chosenThemeIsLight = chosenTheme == "light";
|
||||||
|
|
||||||
|
// Detect the color scheme the operating system prefers.
|
||||||
|
function detectOSColorTheme() {
|
||||||
|
if (chosenThemeIsDark) {
|
||||||
|
document.documentElement.setAttribute("data-theme", "dark");
|
||||||
|
} else if (chosenThemeIsLight) {
|
||||||
|
document.documentElement.setAttribute("data-theme", "light");
|
||||||
|
} else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
|
||||||
|
document.documentElement.setAttribute("data-theme", "dark");
|
||||||
|
} else {
|
||||||
|
document.documentElement.setAttribute("data-theme", "light");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Switch the theme.
|
||||||
|
function switchTheme(e) {
|
||||||
|
if (chosenThemeIsDark) {
|
||||||
|
localStorage.setItem("theme", "light");
|
||||||
|
} else if (chosenThemeIsLight) {
|
||||||
|
localStorage.setItem("theme", "dark");
|
||||||
|
} else {
|
||||||
|
if (document.documentElement.getAttribute("data-theme") == "dark") {
|
||||||
|
localStorage.setItem("theme", "light");
|
||||||
|
} else {
|
||||||
|
localStorage.setItem("theme", "dark");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
detectOSColorTheme();
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Event listener
|
||||||
|
if (themeToggle) {
|
||||||
|
themeToggle.addEventListener("click", switchTheme, false);
|
||||||
|
window
|
||||||
|
.matchMedia("(prefers-color-scheme: dark)")
|
||||||
|
.addEventListener("change", (e) => e.matches && detectOSColorTheme());
|
||||||
|
window
|
||||||
|
.matchMedia("(prefers-color-scheme: light)")
|
||||||
|
.addEventListener("change", (e) => e.matches && detectOSColorTheme());
|
||||||
|
|
||||||
|
detectOSColorTheme();
|
||||||
|
} else {
|
||||||
|
localStorage.removeItem("theme");
|
||||||
|
}
|
||||||
32
themes/slowbrain/assets/js/menu.js
Executable file
32
themes/slowbrain/assets/js/menu.js
Executable file
@@ -0,0 +1,32 @@
|
|||||||
|
// Mobile menu
|
||||||
|
|
||||||
|
const menuTrigger = document.querySelector(".menu-trigger");
|
||||||
|
const menu = document.querySelector(".menu");
|
||||||
|
const mobileQuery = getComputedStyle(document.body).getPropertyValue(
|
||||||
|
"--phoneWidth"
|
||||||
|
);
|
||||||
|
const isMobile = () => window.matchMedia(mobileQuery).matches;
|
||||||
|
const isMobileMenu = () => {
|
||||||
|
menuTrigger && menuTrigger.classList.toggle("hidden", !isMobile());
|
||||||
|
menu && menu.classList.toggle("hidden", isMobile());
|
||||||
|
};
|
||||||
|
|
||||||
|
isMobileMenu();
|
||||||
|
|
||||||
|
menuTrigger &&
|
||||||
|
menuTrigger.addEventListener(
|
||||||
|
"click",
|
||||||
|
() => menu && menu.classList.toggle("hidden")
|
||||||
|
);
|
||||||
|
|
||||||
|
window.addEventListener("resize", isMobileMenu);
|
||||||
|
|
||||||
|
const language = document.getElementsByTagName('html')[0].lang;
|
||||||
|
const logo = document.querySelector(".logo__pathname");
|
||||||
|
if(logo){
|
||||||
|
window.onload = () => {
|
||||||
|
let path = window.location.pathname.substring(1);
|
||||||
|
path = path.replace(language+'/','')
|
||||||
|
logo.textContent += path.substring(0,path.indexOf('/'));
|
||||||
|
};
|
||||||
|
}
|
||||||
90
themes/slowbrain/assets/js/prism.js
Executable file
90
themes/slowbrain/assets/js/prism.js
Executable file
File diff suppressed because one or more lines are too long
9
themes/slowbrain/assets/scss/_404.scss
Executable file
9
themes/slowbrain/assets/scss/_404.scss
Executable file
@@ -0,0 +1,9 @@
|
|||||||
|
.btn-404 svg {
|
||||||
|
vertical-align: middle;
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-404 a {
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
171
themes/slowbrain/assets/scss/_buttons.scss
Executable file
171
themes/slowbrain/assets/scss/_buttons.scss
Executable file
@@ -0,0 +1,171 @@
|
|||||||
|
.button-container {
|
||||||
|
display: table;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-container {
|
||||||
|
margin-top: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
padding: 10px;
|
||||||
|
border: 1.5px solid #888;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin: 5px;
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-header;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-header;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
button,
|
||||||
|
.button,
|
||||||
|
a.button {
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 8px 18px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 600;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
appearance: none;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: none;
|
||||||
|
// Default
|
||||||
|
background: $light-background-header;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-header;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-header;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.outline {
|
||||||
|
background: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
padding: 8px 18px;
|
||||||
|
// Default
|
||||||
|
border-color: $light-background-secondary;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
border-color: $dark-background-secondary;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
border-color: $light-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
border-color: $dark-background-secondary;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
border-color: $light-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
:hover {
|
||||||
|
transform: none;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.primary {
|
||||||
|
box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
box-shadow: 0 2px 6px rgba(50, 50, 93, .21), 0 1px 3px rgba(0, 0, 0, .08);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.link {
|
||||||
|
background: none;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.small {
|
||||||
|
font-size: .8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.wide {
|
||||||
|
min-width: 200px;
|
||||||
|
padding: 14px 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.code-toolbar {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
.toolbar-item a {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 3px 8px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
appearance: none;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: none;
|
||||||
|
// Default
|
||||||
|
background: $light-background-secondary;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-secondary;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-secondary;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
2159
themes/slowbrain/assets/scss/_flag-icons.scss
Executable file
2159
themes/slowbrain/assets/scss/_flag-icons.scss
Executable file
File diff suppressed because it is too large
Load Diff
44
themes/slowbrain/assets/scss/_fonts.scss
Executable file
44
themes/slowbrain/assets/scss/_fonts.scss
Executable file
@@ -0,0 +1,44 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: 'Inter';
|
||||||
|
font-style: normal;
|
||||||
|
font-display: auto;
|
||||||
|
font-weight: 400;
|
||||||
|
src: url("../fonts/Inter-Regular.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Inter';
|
||||||
|
font-style: italic;
|
||||||
|
font-display: auto;
|
||||||
|
font-weight: 400;
|
||||||
|
src: url("../fonts/Inter-Italic.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Inter';
|
||||||
|
font-style: normal;
|
||||||
|
font-display: auto;
|
||||||
|
font-weight: 600;
|
||||||
|
src: url("../fonts/Inter-Medium.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Inter';
|
||||||
|
font-style: italic;
|
||||||
|
font-display: auto;
|
||||||
|
font-weight: 600;
|
||||||
|
src: url("../fonts/Inter-MediumItalic.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Inter';
|
||||||
|
font-style: normal;
|
||||||
|
font-display: auto;
|
||||||
|
font-weight: 800;
|
||||||
|
src: url("../fonts/Inter-Bold.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Inter';
|
||||||
|
font-style: italic;
|
||||||
|
font-display: auto;
|
||||||
|
font-weight: 800;
|
||||||
|
src: url("../fonts/Inter-BoldItalic.woff2") format("woff2");
|
||||||
|
}
|
||||||
49
themes/slowbrain/assets/scss/_footer.scss
Executable file
49
themes/slowbrain/assets/scss/_footer.scss
Executable file
@@ -0,0 +1,49 @@
|
|||||||
|
.footer {
|
||||||
|
padding: 40px 20px;
|
||||||
|
flex-grow: 0;
|
||||||
|
color: $light-color-secondary;
|
||||||
|
|
||||||
|
&__inner {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 760px;
|
||||||
|
max-width: 100%;
|
||||||
|
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&__content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 1rem;
|
||||||
|
color: $light-color-secondary;
|
||||||
|
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
flex-direction: column;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > *:not(:last-child)::after {
|
||||||
|
content: "•";
|
||||||
|
padding: 0 5px;
|
||||||
|
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
content: "";
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
& > *:last-child {
|
||||||
|
padding: 0 0px;
|
||||||
|
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
63
themes/slowbrain/assets/scss/_header.scss
Executable file
63
themes/slowbrain/assets/scss/_header.scss
Executable file
@@ -0,0 +1,63 @@
|
|||||||
|
.header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
position: relative;
|
||||||
|
padding: 20px;
|
||||||
|
// Default
|
||||||
|
background: $light-background-header;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__right {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
flex-direction: row-reverse;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&__inner {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 760px;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-toggle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
line-height: 1;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-toggler {
|
||||||
|
fill: currentColor;
|
||||||
|
}
|
||||||
|
|
||||||
|
.not-selectable {
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
}
|
||||||
8
themes/slowbrain/assets/scss/_last-link.scss
Normal file
8
themes/slowbrain/assets/scss/_last-link.scss
Normal file
@@ -0,0 +1,8 @@
|
|||||||
|
.last-link-container {
|
||||||
|
margin-top: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.last-link , .last-link a{
|
||||||
|
margin: 2px;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
85
themes/slowbrain/assets/scss/_list.scss
Executable file
85
themes/slowbrain/assets/scss/_list.scss
Executable file
@@ -0,0 +1,85 @@
|
|||||||
|
.posts {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 800px;
|
||||||
|
text-align: left;
|
||||||
|
padding: 20px;
|
||||||
|
margin: 20px auto;
|
||||||
|
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
max-width: 660px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(:last-of-type) {
|
||||||
|
// Default
|
||||||
|
border-bottom: 1px solid $light-border-color;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
border-bottom: 1px solid $dark-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
border-bottom: 1px solid $light-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
border-bottom: 1px solid $dark-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
border-bottom: 1px solid $light-border-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-group {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 1.9em;
|
||||||
|
line-height: normal;
|
||||||
|
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-list {
|
||||||
|
flex-grow: 1;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post {
|
||||||
|
&-title {
|
||||||
|
font-size: 1rem;
|
||||||
|
margin: 5px 0 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-year {
|
||||||
|
padding-top: 6px;
|
||||||
|
margin-right: 1.8em;
|
||||||
|
font-size: 1.6em;
|
||||||
|
@include dimmed;
|
||||||
|
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
margin: -6px 0 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-item {
|
||||||
|
border-bottom: 1px grey dashed;
|
||||||
|
|
||||||
|
&-inner {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: baseline;
|
||||||
|
padding: 12px 0;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-day {
|
||||||
|
flex-shrink: 0;
|
||||||
|
margin-left: 1em;
|
||||||
|
@include dimmed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
44
themes/slowbrain/assets/scss/_logo.scss
Executable file
44
themes/slowbrain/assets/scss/_logo.scss
Executable file
@@ -0,0 +1,44 @@
|
|||||||
|
.logo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
|
font-display: auto;
|
||||||
|
font-family: monospace, monospace;
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 44px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__mark {
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__text {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__cursor {
|
||||||
|
display: inline-block;
|
||||||
|
width: 10px;
|
||||||
|
height: 1rem;
|
||||||
|
background: #fe5186;
|
||||||
|
margin-left: 5px;
|
||||||
|
border-radius: 1px;
|
||||||
|
animation: cursor 1s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-reduced-motion: reduce) {
|
||||||
|
&__cursor {
|
||||||
|
animation: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes cursor {
|
||||||
|
0% { opacity: 0; }
|
||||||
|
50% { opacity: 1; }
|
||||||
|
100% { opacity: 0; }
|
||||||
|
}
|
||||||
435
themes/slowbrain/assets/scss/_main.scss
Executable file
435
themes/slowbrain/assets/scss/_main.scss
Executable file
@@ -0,0 +1,435 @@
|
|||||||
|
html {
|
||||||
|
box-sizing: border-box;
|
||||||
|
line-height: 1.6;
|
||||||
|
letter-spacing: 0.06em;
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
*,
|
||||||
|
*:before,
|
||||||
|
*:after {
|
||||||
|
box-sizing: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-family: Inter, -apple-system, BlinkMacSystemFont, "Roboto",
|
||||||
|
"Segoe UI", Helvetica, Arial, sans-serif;
|
||||||
|
font-display: auto;
|
||||||
|
font-size: 1rem;
|
||||||
|
line-height: 1.54;
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
font-feature-settings: "liga", "tnum", "case", "calt", "zero", "ss01", "locl";
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
-webkit-text-size-adjust: 100%;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
min-height: 100vh;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
// Default
|
||||||
|
background-color: $light-background;
|
||||||
|
color: $light-color;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background-color: $dark-background;
|
||||||
|
color: $dark-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background-color: $light-background;
|
||||||
|
color: $light-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background-color: $dark-background;
|
||||||
|
color: $dark-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background-color: $light-background;
|
||||||
|
color: $light-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2.625rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.625rem;
|
||||||
|
margin-top: 2.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.375rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
h1 {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.15rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
max-width: 100%;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.center {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.right {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
&.circle {
|
||||||
|
border-radius: 50%;
|
||||||
|
max-width: 25%;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
figure {
|
||||||
|
display: table;
|
||||||
|
max-width: 100%;
|
||||||
|
margin: 25px 0;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.left-floated {
|
||||||
|
margin-right: auto;
|
||||||
|
float: left;
|
||||||
|
img {
|
||||||
|
margin: 20px 20px 20px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.center {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.right {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.right-floated {
|
||||||
|
margin-left: auto;
|
||||||
|
float: right;
|
||||||
|
img {
|
||||||
|
margin: 20px 0 20px 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.rounded {
|
||||||
|
img {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
figcaption {
|
||||||
|
font-size: 14px;
|
||||||
|
margin-top: 5px;
|
||||||
|
opacity: 0.8;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.center {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.right {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
em, i, strong {
|
||||||
|
// Default
|
||||||
|
color: $light-color-variant;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
color: $dark-color-variant;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
color: $light-color-variant;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
|
||||||
|
font-display: auto;
|
||||||
|
font-feature-settings: normal;
|
||||||
|
padding: 1px 6px;
|
||||||
|
margin: 0 2px;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
// Default
|
||||||
|
background: $light-background-secondary;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
pre {
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background-color: $dark-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background-color: $light-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
padding: 10px 10px 10px 20px;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
overflow: auto;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
white-space: pre-wrap;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
background: none !important;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: inherit;
|
||||||
|
// Default
|
||||||
|
color: #ccc;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
color: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
color: #ccc;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
border-left: 3px solid #3eb0ef;
|
||||||
|
margin: 40px;
|
||||||
|
padding: 10px 20px;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
margin: 10px;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: "”";
|
||||||
|
font-family: Georgia, serif;
|
||||||
|
font-display: auto;
|
||||||
|
font-size: 3.875rem;
|
||||||
|
position: absolute;
|
||||||
|
left: -40px;
|
||||||
|
top: -20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p:first-of-type {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
p:last-of-type {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ul,
|
||||||
|
ol {
|
||||||
|
margin-left: 40px;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ol ol {
|
||||||
|
list-style-type: lower-alpha;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
flex: 1 auto;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
flex: 1 auto;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
width: 100%;
|
||||||
|
border: none;
|
||||||
|
height: 1px;
|
||||||
|
// Default
|
||||||
|
background: $light-border-color;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-border-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-border-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hide-on-phone {
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hide-on-tablet {
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Accessibility
|
||||||
|
.screen-reader-text {
|
||||||
|
border: 0;
|
||||||
|
clip: rect(1px, 1px, 1px, 1px);
|
||||||
|
clip-path: inset(50%);
|
||||||
|
height: 1px;
|
||||||
|
margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0;
|
||||||
|
position: absolute !important;
|
||||||
|
width: 1px;
|
||||||
|
word-wrap: normal !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.screen-reader-text:focus {
|
||||||
|
background-color: #f1f1f1;
|
||||||
|
border-radius: 3px;
|
||||||
|
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
|
||||||
|
clip: auto !important;
|
||||||
|
clip-path: none;
|
||||||
|
color: #21759b;
|
||||||
|
display: block;
|
||||||
|
font-size: 14px;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
font-weight: bold;
|
||||||
|
height: auto;
|
||||||
|
width: auto;
|
||||||
|
top: 5px;
|
||||||
|
left: 5px;
|
||||||
|
line-height: normal;
|
||||||
|
padding: 15px 23px 14px;
|
||||||
|
text-decoration: none;
|
||||||
|
z-index: 100000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.background-image {
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-size: cover;
|
||||||
|
background-position: center center;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prism JS Additionals
|
||||||
|
.highlight {
|
||||||
|
margin: 30px auto;
|
||||||
|
}
|
||||||
165
themes/slowbrain/assets/scss/_menu.scss
Executable file
165
themes/slowbrain/assets/scss/_menu.scss
Executable file
@@ -0,0 +1,165 @@
|
|||||||
|
.menu {
|
||||||
|
z-index: 9999;
|
||||||
|
// Default
|
||||||
|
background: $light-background-header;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
position: absolute;
|
||||||
|
top: 50px;
|
||||||
|
right: 0;
|
||||||
|
border: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__inner {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
max-width: 100%;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 15px;
|
||||||
|
font-size: 1rem;
|
||||||
|
list-style: none;
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin: 0 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin: 0;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-trigger {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
fill: currentColor;
|
||||||
|
margin-left: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
display: none;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 15px;
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-of-type {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.submenu {
|
||||||
|
background: $light-background-header;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style-type: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
li a, .dropbtn {
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li.dropdown {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-content {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
background: $dark-background-header;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-content a {
|
||||||
|
padding: 12px 20px;
|
||||||
|
text-decoration: none;
|
||||||
|
display: block;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-content a:hover {
|
||||||
|
background: $dark-background-header;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-header;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-header;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown:hover .dropdown-content {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
3
themes/slowbrain/assets/scss/_mixins.scss
Executable file
3
themes/slowbrain/assets/scss/_mixins.scss
Executable file
@@ -0,0 +1,3 @@
|
|||||||
|
@mixin dimmed {
|
||||||
|
opacity: .6;
|
||||||
|
}
|
||||||
367
themes/slowbrain/assets/scss/_normalize.scss
Executable file
367
themes/slowbrain/assets/scss/_normalize.scss
Executable file
@@ -0,0 +1,367 @@
|
|||||||
|
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
||||||
|
|
||||||
|
/* Document
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the line height in all browsers.
|
||||||
|
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Webkit Scrollbar Customize */
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
background: #212020;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: #888;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #dcdcdc;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
-webkit-text-size-adjust: 100%; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sections
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the margin in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Render the `main` element consistently in IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
main {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the font size and margin on `h1` elements within `section` and
|
||||||
|
* `article` contexts in Chrome, Firefox, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2em;
|
||||||
|
margin: 0.67em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grouping content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in Firefox.
|
||||||
|
* 2. Show the overflow in Edge and IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
hr {
|
||||||
|
box-sizing: content-box; /* 1 */
|
||||||
|
height: 0; /* 1 */
|
||||||
|
overflow: visible; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
pre {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-display: auto;
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text-level semantics
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the gray background on active links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Remove the bottom border in Chrome 57-
|
||||||
|
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
abbr[title] {
|
||||||
|
border-bottom: none; /* 1 */
|
||||||
|
text-decoration: underline; /* 2 */
|
||||||
|
text-decoration: underline dotted; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
samp {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-display: auto;
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font size in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||||
|
* all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
sub,
|
||||||
|
sup {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
position: relative;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Embedded content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the border on images inside links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Forms
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Change the font styles in all browsers.
|
||||||
|
* 2. Remove the margin in Firefox and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
font-family: inherit; /* 1 */
|
||||||
|
font-display: auto;
|
||||||
|
font-size: 100%; /* 1 */
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
margin: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Show the overflow in IE.
|
||||||
|
* 1. Show the overflow in Edge.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input { /* 1 */
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||||
|
* 1. Remove the inheritance of text transform in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
select { /* 1 */
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
[type="button"],
|
||||||
|
[type="reset"],
|
||||||
|
[type="submit"] {
|
||||||
|
-webkit-appearance: button;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner border and padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button::-moz-focus-inner,
|
||||||
|
[type="button"]::-moz-focus-inner,
|
||||||
|
[type="reset"]::-moz-focus-inner,
|
||||||
|
[type="submit"]::-moz-focus-inner {
|
||||||
|
border-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Restore the focus styles unset by the previous rule.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button:-moz-focusring,
|
||||||
|
[type="button"]:-moz-focusring,
|
||||||
|
[type="reset"]:-moz-focusring,
|
||||||
|
[type="submit"]:-moz-focusring {
|
||||||
|
outline: 1px dotted ButtonText;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
padding: 0.35em 0.75em 0.625em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the text wrapping in Edge and IE.
|
||||||
|
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||||
|
* 3. Remove the padding so developers are not caught out when they zero out
|
||||||
|
* `fieldset` elements in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
legend {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
color: inherit; /* 2 */
|
||||||
|
display: table; /* 1 */
|
||||||
|
max-width: 100%; /* 1 */
|
||||||
|
padding: 0; /* 3 */
|
||||||
|
white-space: normal; /* 1 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||||
|
*/
|
||||||
|
|
||||||
|
progress {
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the default vertical scrollbar in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in IE 10.
|
||||||
|
* 2. Remove the padding in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="checkbox"],
|
||||||
|
[type="radio"] {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="number"]::-webkit-inner-spin-button,
|
||||||
|
[type="number"]::-webkit-outer-spin-button {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the odd appearance in Chrome and Safari.
|
||||||
|
* 2. Correct the outline style in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"] {
|
||||||
|
-webkit-appearance: textfield; /* 1 */
|
||||||
|
outline-offset: -2px; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner padding in Chrome and Safari on macOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"]::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
* 2. Change font properties to `inherit` in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
::-webkit-file-upload-button {
|
||||||
|
-webkit-appearance: button; /* 1 */
|
||||||
|
font: inherit; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Interactive
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
details {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
summary {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Misc
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
template {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[hidden] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
378
themes/slowbrain/assets/scss/_prism.scss
Executable file
378
themes/slowbrain/assets/scss/_prism.scss
Executable file
@@ -0,0 +1,378 @@
|
|||||||
|
/* PrismJS 1.23.0
|
||||||
|
https://prismjs.com/download.html#themes=prism-twilight&languages=markup+css+clike+javascript+ada+apacheconf+bash+batch+c+csharp+cpp+coffeescript+css-extras+dart+django+dns-zone-file+docker+elixir+etlua+erlang+git+go+graphql+groovy+haml+handlebars+haskell+http+hpkp+hsts+ini+java+javadoc+javadoclike+jsdoc+js-extras+json+json5+jsonp+julia+kotlin+latex+less+lisp+lua+markup-templating+matlab+nginx+objectivec+perl+php+phpdoc+php-extras+powershell+promql+protobuf+puppet+purescript+python+r+jsx+tsx+regex+rest+ruby+rust+sass+scss+shell-session+sql+stylus+swift+toml+twig+typescript+typoscript+verilog+vhdl+vim+visual-basic+wasm+xml-doc+yaml&plugins=line-highlight+line-numbers+show-language+toolbar */
|
||||||
|
/**
|
||||||
|
* prism.js Twilight theme
|
||||||
|
* Based (more or less) on the Twilight theme originally of Textmate fame.
|
||||||
|
* @author Remy Bach
|
||||||
|
*/
|
||||||
|
code[class*="language-"],
|
||||||
|
pre[class*="language-"] {
|
||||||
|
color: white;
|
||||||
|
background: none;
|
||||||
|
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||||
|
font-size: 1em;
|
||||||
|
text-align: left;
|
||||||
|
text-shadow: 0 -.1em .2em black;
|
||||||
|
white-space: pre;
|
||||||
|
word-spacing: normal;
|
||||||
|
word-break: normal;
|
||||||
|
word-wrap: normal;
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
-moz-tab-size: 4;
|
||||||
|
-o-tab-size: 4;
|
||||||
|
tab-size: 4;
|
||||||
|
|
||||||
|
-webkit-hyphens: none;
|
||||||
|
-moz-hyphens: none;
|
||||||
|
-ms-hyphens: none;
|
||||||
|
hyphens: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"],
|
||||||
|
:not(pre) > code[class*="language-"] {
|
||||||
|
background: hsl(0, 0%, 8%); /* #141414 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Code blocks */
|
||||||
|
pre[class*="language-"] {
|
||||||
|
border-radius: .5em;
|
||||||
|
border: .3em solid hsl(0, 0%, 33%); /* #282A2B */
|
||||||
|
box-shadow: 1px 1px .5em black inset;
|
||||||
|
margin: .5em 0;
|
||||||
|
overflow: auto;
|
||||||
|
padding: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"]::-moz-selection {
|
||||||
|
/* Firefox */
|
||||||
|
background: hsl(200, 4%, 16%); /* #282A2B */
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"]::selection {
|
||||||
|
/* Safari */
|
||||||
|
background: hsl(200, 4%, 16%); /* #282A2B */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text Selection colour */
|
||||||
|
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
|
||||||
|
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
|
||||||
|
text-shadow: none;
|
||||||
|
background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
|
||||||
|
code[class*="language-"]::selection, code[class*="language-"] ::selection {
|
||||||
|
text-shadow: none;
|
||||||
|
background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Inline code */
|
||||||
|
:not(pre) > code[class*="language-"] {
|
||||||
|
border-radius: .3em;
|
||||||
|
border: .13em solid hsl(0, 0%, 33%); /* #545454 */
|
||||||
|
box-shadow: 1px 1px .3em -.1em black inset;
|
||||||
|
padding: .15em .2em .05em;
|
||||||
|
white-space: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.comment,
|
||||||
|
.token.prolog,
|
||||||
|
.token.doctype,
|
||||||
|
.token.cdata {
|
||||||
|
color: hsl(0, 0%, 47%); /* #777777 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.punctuation {
|
||||||
|
opacity: .7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.namespace {
|
||||||
|
opacity: .7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.tag,
|
||||||
|
.token.boolean,
|
||||||
|
.token.number,
|
||||||
|
.token.deleted {
|
||||||
|
color: hsl(14, 58%, 55%); /* #CF6A4C */
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.keyword,
|
||||||
|
.token.property,
|
||||||
|
.token.selector,
|
||||||
|
.token.constant,
|
||||||
|
.token.symbol,
|
||||||
|
.token.builtin {
|
||||||
|
color: hsl(53, 89%, 79%); /* #F9EE98 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.attr-name,
|
||||||
|
.token.attr-value,
|
||||||
|
.token.string,
|
||||||
|
.token.char,
|
||||||
|
.token.operator,
|
||||||
|
.token.entity,
|
||||||
|
.token.url,
|
||||||
|
.language-css .token.string,
|
||||||
|
.style .token.string,
|
||||||
|
.token.variable,
|
||||||
|
.token.inserted {
|
||||||
|
color: hsl(76, 21%, 52%); /* #8F9D6A */
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.atrule {
|
||||||
|
color: hsl(218, 22%, 55%); /* #7587A6 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.regex,
|
||||||
|
.token.important {
|
||||||
|
color: hsl(42, 75%, 65%); /* #E9C062 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.important,
|
||||||
|
.token.bold {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.token.italic {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.entity {
|
||||||
|
cursor: help;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[data-line] {
|
||||||
|
padding: 1em 0 1em 3em;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Markup */
|
||||||
|
.language-markup .token.tag,
|
||||||
|
.language-markup .token.attr-name,
|
||||||
|
.language-markup .token.punctuation {
|
||||||
|
color: hsl(33, 33%, 52%); /* #AC885B */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Make the tokens sit above the line highlight so the colours don't look faded. */
|
||||||
|
.token {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-highlight {
|
||||||
|
background: hsla(0, 0%, 33%, 0.25); /* #545454 */
|
||||||
|
background: linear-gradient(to right, hsla(0, 0%, 33%, .1) 70%, hsla(0, 0%, 33%, 0)); /* #545454 */
|
||||||
|
border-bottom: 1px dashed hsl(0, 0%, 33%); /* #545454 */
|
||||||
|
border-top: 1px dashed hsl(0, 0%, 33%); /* #545454 */
|
||||||
|
left: 0;
|
||||||
|
line-height: inherit;
|
||||||
|
margin-top: 0.75em; /* Same as .prism’s padding-top */
|
||||||
|
padding: inherit 0;
|
||||||
|
pointer-events: none;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
white-space: pre;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-highlight:before,
|
||||||
|
.line-highlight[data-end]:after {
|
||||||
|
background-color: hsl(215, 15%, 59%); /* #8794A6 */
|
||||||
|
border-radius: 999px;
|
||||||
|
box-shadow: 0 1px white;
|
||||||
|
color: hsl(24, 20%, 95%); /* #F5F2F0 */
|
||||||
|
content: attr(data-start);
|
||||||
|
font: bold 65%/1.5 sans-serif;
|
||||||
|
left: .6em;
|
||||||
|
min-width: 1em;
|
||||||
|
padding: 0 .5em;
|
||||||
|
position: absolute;
|
||||||
|
text-align: center;
|
||||||
|
text-shadow: none;
|
||||||
|
top: .4em;
|
||||||
|
vertical-align: .3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-highlight[data-end]:after {
|
||||||
|
bottom: .4em;
|
||||||
|
content: attr(data-end);
|
||||||
|
top: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[data-line] {
|
||||||
|
position: relative;
|
||||||
|
padding: 1em 0 1em 3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-highlight {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
padding: inherit 0;
|
||||||
|
margin-top: 1em; /* Same as .prism’s padding-top */
|
||||||
|
|
||||||
|
background: hsla(24, 20%, 50%,.08);
|
||||||
|
background: linear-gradient(to right, hsla(24, 20%, 50%,.1) 70%, hsla(24, 20%, 50%,0));
|
||||||
|
|
||||||
|
pointer-events: none;
|
||||||
|
|
||||||
|
line-height: inherit;
|
||||||
|
white-space: pre;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
.line-highlight {
|
||||||
|
/*
|
||||||
|
* This will prevent browsers from replacing the background color with white.
|
||||||
|
* It's necessary because the element is layered on top of the displayed code.
|
||||||
|
*/
|
||||||
|
-webkit-print-color-adjust: exact;
|
||||||
|
color-adjust: exact;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-highlight:before,
|
||||||
|
.line-highlight[data-end]:after {
|
||||||
|
content: attr(data-start);
|
||||||
|
position: absolute;
|
||||||
|
top: .4em;
|
||||||
|
left: .6em;
|
||||||
|
min-width: 1em;
|
||||||
|
padding: 0 .5em;
|
||||||
|
background-color: hsla(24, 20%, 50%,.4);
|
||||||
|
color: hsl(24, 20%, 95%);
|
||||||
|
font: bold 65%/1.5 sans-serif;
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: .3em;
|
||||||
|
border-radius: 999px;
|
||||||
|
text-shadow: none;
|
||||||
|
box-shadow: 0 1px white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-highlight[data-end]:after {
|
||||||
|
content: attr(data-end);
|
||||||
|
top: auto;
|
||||||
|
bottom: .4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-numbers .line-highlight:before,
|
||||||
|
.line-numbers .line-highlight:after {
|
||||||
|
content: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[id].linkable-line-numbers span.line-numbers-rows {
|
||||||
|
pointer-events: all;
|
||||||
|
}
|
||||||
|
pre[id].linkable-line-numbers span.line-numbers-rows > span:before {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
pre[id].linkable-line-numbers span.line-numbers-rows > span:hover:before {
|
||||||
|
background-color: rgba(128, 128, 128, .2);
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"].line-numbers {
|
||||||
|
position: relative;
|
||||||
|
padding-left: 3.8em;
|
||||||
|
counter-reset: linenumber;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"].line-numbers > code {
|
||||||
|
position: relative;
|
||||||
|
white-space: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-numbers .line-numbers-rows {
|
||||||
|
position: absolute;
|
||||||
|
pointer-events: none;
|
||||||
|
top: 0;
|
||||||
|
font-size: 100%;
|
||||||
|
left: -3.8em;
|
||||||
|
width: 3em; /* works for line-numbers below 1000 lines */
|
||||||
|
letter-spacing: -1px;
|
||||||
|
border-right: 1px solid #999;
|
||||||
|
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-numbers-rows > span {
|
||||||
|
display: block;
|
||||||
|
counter-increment: linenumber;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-numbers-rows > span:before {
|
||||||
|
content: counter(linenumber);
|
||||||
|
color: #999;
|
||||||
|
display: block;
|
||||||
|
padding-right: 0.8em;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar > .toolbar {
|
||||||
|
position: absolute;
|
||||||
|
top: .3em;
|
||||||
|
right: .2em;
|
||||||
|
transition: opacity 0.3s ease-in-out;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar:hover > .toolbar {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Separate line b/c rules are thrown out if selector is invalid.
|
||||||
|
IE11 and old Edge versions don't support :focus-within. */
|
||||||
|
div.code-toolbar:focus-within > .toolbar {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar > .toolbar .toolbar-item {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar > .toolbar a {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar > .toolbar button {
|
||||||
|
background: none;
|
||||||
|
border: 0;
|
||||||
|
color: inherit;
|
||||||
|
font: inherit;
|
||||||
|
line-height: normal;
|
||||||
|
overflow: visible;
|
||||||
|
padding: 0;
|
||||||
|
-webkit-user-select: none; /* for button */
|
||||||
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar > .toolbar a,
|
||||||
|
div.code-toolbar > .toolbar button,
|
||||||
|
div.code-toolbar > .toolbar span {
|
||||||
|
color: #bbb;
|
||||||
|
font-size: .8em;
|
||||||
|
padding: 0 .5em;
|
||||||
|
background: #f5f2f0;
|
||||||
|
background: rgba(224, 224, 224, 0.2);
|
||||||
|
box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
|
||||||
|
border-radius: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.code-toolbar > .toolbar a:hover,
|
||||||
|
div.code-toolbar > .toolbar a:focus,
|
||||||
|
div.code-toolbar > .toolbar button:hover,
|
||||||
|
div.code-toolbar > .toolbar button:focus,
|
||||||
|
div.code-toolbar > .toolbar span:hover,
|
||||||
|
div.code-toolbar > .toolbar span:focus {
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
34
themes/slowbrain/assets/scss/_sharing-buttons.scss
Executable file
34
themes/slowbrain/assets/scss/_sharing-buttons.scss
Executable file
@@ -0,0 +1,34 @@
|
|||||||
|
.sharing-buttons {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.resp-sharing-button__icon,
|
||||||
|
.resp-sharing-button__link {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.resp-sharing-button__link {
|
||||||
|
text-decoration: none;
|
||||||
|
margin: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.resp-sharing-button {
|
||||||
|
border-radius: 5px;
|
||||||
|
transition: 25ms ease-out;
|
||||||
|
padding: 0.5em 0.75em;
|
||||||
|
font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.resp-sharing-button__icon svg {
|
||||||
|
width: 1em;
|
||||||
|
height: 1em;
|
||||||
|
margin-right: 0.4em;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
.resp-sharing-button--small svg {
|
||||||
|
margin: 0;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
234
themes/slowbrain/assets/scss/_single.scss
Executable file
234
themes/slowbrain/assets/scss/_single.scss
Executable file
@@ -0,0 +1,234 @@
|
|||||||
|
.post {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 800px;
|
||||||
|
text-align: left;
|
||||||
|
padding: 20px;
|
||||||
|
margin: 20px auto;
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
max-width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-date {
|
||||||
|
&:after {
|
||||||
|
content: '—';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-title {
|
||||||
|
font-size: 2.625rem;
|
||||||
|
margin: 0 0 20px;
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-tags {
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
font-size: 1rem;
|
||||||
|
opacity: 0.5;
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-content {
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-cover {
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 40px -50px;
|
||||||
|
width: $max-width;
|
||||||
|
max-width: $max-width;
|
||||||
|
overflow: hidden;
|
||||||
|
@media #{$media-size-tablet} {
|
||||||
|
margin: 20px 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-excerpt {
|
||||||
|
color: grey;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-info {
|
||||||
|
margin-top: 30px;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
line-height: normal;
|
||||||
|
@include dimmed;
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0.8em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
border-bottom: 1px solid white;
|
||||||
|
}
|
||||||
|
|
||||||
|
svg {
|
||||||
|
margin-right: 0.8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
margin-right: 0.5em;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: "#";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.feather {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: -.125em;
|
||||||
|
width: 1em;
|
||||||
|
height: 1em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&-audio {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding-top: 20px;
|
||||||
|
|
||||||
|
audio {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flag {
|
||||||
|
border-radius: 50%;
|
||||||
|
margin: 0 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination {
|
||||||
|
margin-top: 20px;
|
||||||
|
|
||||||
|
&__title {
|
||||||
|
display: flex;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
margin: 20px 0;
|
||||||
|
|
||||||
|
&-h {
|
||||||
|
text-align: center;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 5px 10px;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
text-decoration: none;
|
||||||
|
letter-spacing: 0.1em;
|
||||||
|
z-index: 1;
|
||||||
|
// Default
|
||||||
|
background: $light-background;
|
||||||
|
color: $light-color-secondary;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background;
|
||||||
|
color: $dark-color-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background;
|
||||||
|
color: $light-color-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background;
|
||||||
|
color: $dark-color-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background;
|
||||||
|
color: $light-color-secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 15px;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&__buttons {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 1rem;
|
||||||
|
font-weight: 600;
|
||||||
|
border-radius: 8px;
|
||||||
|
max-width: 40%;
|
||||||
|
padding: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
appearance: none;
|
||||||
|
// Default
|
||||||
|
background: $light-background-secondary;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background: $dark-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background: $light-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background: $dark-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background: $light-background-secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
+ .button {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: flex;
|
||||||
|
padding: 8px 16px;
|
||||||
|
text-decoration: none;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__text {
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.next .button__icon {
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.previous .button__icon {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
84
themes/slowbrain/assets/scss/_tables.scss
Executable file
84
themes/slowbrain/assets/scss/_tables.scss
Executable file
@@ -0,0 +1,84 @@
|
|||||||
|
.post-content {
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
margin: 25px auto;
|
||||||
|
font-size: 0.9em;
|
||||||
|
min-width: 400px;
|
||||||
|
max-width: 100%;
|
||||||
|
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
padding: 12px 15px;
|
||||||
|
// Default
|
||||||
|
border: 1px solid $light-table-color;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
border: 1px solid $dark-table-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
border: 1px solid $light-table-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
border: 1px solid $dark-table-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
border: 1px solid $light-table-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
thead {
|
||||||
|
tr {
|
||||||
|
text-align: left;
|
||||||
|
// Default
|
||||||
|
background-color: $light-table-color;
|
||||||
|
color: $light-color;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
background-color: $dark-table-color;
|
||||||
|
color: $dark-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
background-color: $light-table-color;
|
||||||
|
color: $light-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
background-color: $dark-table-color;
|
||||||
|
color: $dark-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
background-color: $light-table-color;
|
||||||
|
color: $light-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
tbody {
|
||||||
|
tr {
|
||||||
|
// Default
|
||||||
|
border: 1px solid $light-table-color;
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
border: 1px solid $dark-table-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
border: 1px solid $light-table-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=dark] & {
|
||||||
|
border: 1px solid $dark-table-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme=light] & {
|
||||||
|
border: 1px solid $light-table-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
33
themes/slowbrain/assets/scss/_variables.scss
Executable file
33
themes/slowbrain/assets/scss/_variables.scss
Executable file
@@ -0,0 +1,33 @@
|
|||||||
|
@charset "UTF-8";
|
||||||
|
|
||||||
|
/* Light theme color */
|
||||||
|
$light-background: #fff;
|
||||||
|
$light-background-secondary: #eaeaea;
|
||||||
|
$light-background-header: #fafafa;
|
||||||
|
$light-color: #222;
|
||||||
|
$light-color-variant: black;
|
||||||
|
$light-color-secondary: #999;
|
||||||
|
$light-border-color: #dcdcdc;
|
||||||
|
$light-table-color: #dcdcdc;
|
||||||
|
|
||||||
|
/* Dark theme colors */
|
||||||
|
$dark-background: #232425;
|
||||||
|
$dark-background-secondary: #3b3d42;
|
||||||
|
$dark-background-header: #1b1c1d;
|
||||||
|
$dark-color: #a9a9b3;
|
||||||
|
$dark-color-variant: white;
|
||||||
|
$dark-color-secondary: #b3b3bd;
|
||||||
|
$dark-border-color: #4e4e57;
|
||||||
|
$dark-table-color: #4e4e57;
|
||||||
|
|
||||||
|
$media-size-phone: "(max-width: 684px)";
|
||||||
|
$media-size-tablet: "(max-width: 900px)";
|
||||||
|
|
||||||
|
/* Variables for js, must be the same as these in @custom-media queries */
|
||||||
|
:root {
|
||||||
|
--phoneWidth: (max-width: 684px);
|
||||||
|
--tabletWidth: (max-width: 900px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Content */
|
||||||
|
$max-width: 860px;
|
||||||
22
themes/slowbrain/assets/scss/main.scss
Executable file
22
themes/slowbrain/assets/scss/main.scss
Executable file
@@ -0,0 +1,22 @@
|
|||||||
|
/* Must be loaded before everything else */
|
||||||
|
@import "normalize";
|
||||||
|
/*@import "prism";*/
|
||||||
|
/*@import "flag-icons";*/
|
||||||
|
|
||||||
|
/* Main stuff */
|
||||||
|
@import "variables";
|
||||||
|
@import "mixins";
|
||||||
|
@import "fonts";
|
||||||
|
@import "buttons";
|
||||||
|
@import "last-link";
|
||||||
|
/* Modules */
|
||||||
|
@import "header";
|
||||||
|
@import "logo";
|
||||||
|
@import "menu";
|
||||||
|
@import "main";
|
||||||
|
@import "list";
|
||||||
|
@import "single";
|
||||||
|
@import "footer";
|
||||||
|
@import "sharing-buttons";
|
||||||
|
@import "tables";
|
||||||
|
@import "404";
|
||||||
19
themes/slowbrain/data/langFlags.yaml
Executable file
19
themes/slowbrain/data/langFlags.yaml
Executable file
@@ -0,0 +1,19 @@
|
|||||||
|
de: de
|
||||||
|
en: gb
|
||||||
|
es: es
|
||||||
|
fr: fr
|
||||||
|
gl: es-ga
|
||||||
|
hi: in
|
||||||
|
id: id
|
||||||
|
it: it
|
||||||
|
ja: jp
|
||||||
|
ml: in
|
||||||
|
nl: nl
|
||||||
|
pt-br: br
|
||||||
|
ru: ru
|
||||||
|
tr: tr
|
||||||
|
uk: uk
|
||||||
|
zh-cn: cn
|
||||||
|
zh-hk: hk
|
||||||
|
zh-tw: tw
|
||||||
|
ro: ro
|
||||||
39
themes/slowbrain/i18n/en.toml
Executable file
39
themes/slowbrain/i18n/en.toml
Executable file
@@ -0,0 +1,39 @@
|
|||||||
|
# Translations for English
|
||||||
|
# https://gohugo.io/content-management/multilingual/#translation-of-strings
|
||||||
|
|
||||||
|
# Generic
|
||||||
|
#
|
||||||
|
[translations]
|
||||||
|
other = "Translations"
|
||||||
|
|
||||||
|
[postAvailable]
|
||||||
|
other = "Also available in"
|
||||||
|
|
||||||
|
|
||||||
|
# 404.html
|
||||||
|
#
|
||||||
|
[archives]
|
||||||
|
other = "Archives"
|
||||||
|
|
||||||
|
[home]
|
||||||
|
other = "Home"
|
||||||
|
|
||||||
|
[notFound]
|
||||||
|
other = "Oops, page not found…"
|
||||||
|
|
||||||
|
|
||||||
|
# posts/single.html
|
||||||
|
#
|
||||||
|
[readingTime]
|
||||||
|
one = "One minute"
|
||||||
|
other = "{{ .Count }} minutes"
|
||||||
|
|
||||||
|
[tableOfContents]
|
||||||
|
other = "Table of Contents"
|
||||||
|
|
||||||
|
[wordCount]
|
||||||
|
one = "One Word"
|
||||||
|
other = "{{ .Count }} Words"
|
||||||
|
|
||||||
|
[lastModified]
|
||||||
|
other = "Last updated"
|
||||||
39
themes/slowbrain/i18n/fr.toml
Executable file
39
themes/slowbrain/i18n/fr.toml
Executable file
@@ -0,0 +1,39 @@
|
|||||||
|
# Translations for French
|
||||||
|
# https://gohugo.io/content-management/multilingual/#translation-of-strings
|
||||||
|
|
||||||
|
# Generic
|
||||||
|
#
|
||||||
|
[translations]
|
||||||
|
other = "Traductions"
|
||||||
|
|
||||||
|
[postAvailable]
|
||||||
|
other = "Aussi disponible en"
|
||||||
|
|
||||||
|
|
||||||
|
# 404.html
|
||||||
|
#
|
||||||
|
[archives]
|
||||||
|
other = "Les archives"
|
||||||
|
|
||||||
|
[home]
|
||||||
|
other = "Accueil"
|
||||||
|
|
||||||
|
[notFound]
|
||||||
|
other = "Oups, page non trouvée …"
|
||||||
|
|
||||||
|
|
||||||
|
# posts/single.html
|
||||||
|
#
|
||||||
|
[readingTime]
|
||||||
|
one = "Une minute"
|
||||||
|
other = "{{ .Count }} minutes"
|
||||||
|
|
||||||
|
[tableOfContents]
|
||||||
|
other = "Table des matières"
|
||||||
|
|
||||||
|
[wordCount]
|
||||||
|
one = "Un Mot"
|
||||||
|
other = "{{ .Count }} Mots"
|
||||||
|
|
||||||
|
[lastModified]
|
||||||
|
other = "Mise à jour"
|
||||||
21
themes/slowbrain/layouts/404.html
Executable file
21
themes/slowbrain/layouts/404.html
Executable file
@@ -0,0 +1,21 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<div id="spotlight" class="error-404 animated fadeIn">
|
||||||
|
<p class="img-404">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-cloud-drizzle"><line x1="8" y1="19" x2="8" y2="21"></line><line x1="8" y1="13" x2="8" y2="15"></line><line x1="16" y1="19" x2="16" y2="21"></line><line x1="16" y1="13" x2="16" y2="15"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="12" y1="15" x2="12" y2="17"></line><path d="M20 16.58A5 5 0 0 0 18 7h-1.26A8 8 0 1 0 4 15.25"></path></svg>
|
||||||
|
</p>
|
||||||
|
<div class="banner-404">
|
||||||
|
<h1>404</h1>
|
||||||
|
<p>{{ i18n "notFound" }}</p>
|
||||||
|
<p class="btn-404">
|
||||||
|
<a href="{{.Site.BaseURL}}">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>
|
||||||
|
{{- i18n "home" -}}
|
||||||
|
</a>
|
||||||
|
<a href="{{ "posts" | absLangURL }}">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-archive"><polyline points="21 8 21 21 3 21 3 8"></polyline><rect x="1" y="3" width="22" height="5"></rect><line x1="10" y1="12" x2="14" y2="12"></line></svg>
|
||||||
|
{{- i18n "archives" -}}
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
25
themes/slowbrain/layouts/_default/baseof.html
Executable file
25
themes/slowbrain/layouts/_default/baseof.html
Executable file
@@ -0,0 +1,25 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="{{ .Site.Language }}">
|
||||||
|
<head>
|
||||||
|
{{ partial "head.html" . }}
|
||||||
|
</head>
|
||||||
|
|
||||||
|
{{ block "body" . }}
|
||||||
|
<body>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
{{ partial "header.html" . }}
|
||||||
|
|
||||||
|
<div class="content">
|
||||||
|
{{ block "main" . }}{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{{ block "footer" . }}
|
||||||
|
{{ partial "footer.html" . }}
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{{ partial "javascript.html" . }}
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
60
themes/slowbrain/layouts/_default/list.html
Executable file
60
themes/slowbrain/layouts/_default/list.html
Executable file
@@ -0,0 +1,60 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
{{ $paginator := .Paginate .Data.Pages }}
|
||||||
|
|
||||||
|
<main class="posts">
|
||||||
|
<h1>{{ .Title }}</h1>
|
||||||
|
|
||||||
|
{{ if .Content }}
|
||||||
|
<div class="post-content">{{ .Content }}</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ if eq .Params.SortFormat "date-asc" }}
|
||||||
|
{{ range $paginator.Pages.GroupByDate "2006" "asc" }}
|
||||||
|
<div class="posts-group">
|
||||||
|
<div class="post-year">{{ .Key }}</div>
|
||||||
|
|
||||||
|
<ul class="posts-list">
|
||||||
|
{{ range .Pages }}
|
||||||
|
<li class="post-item">
|
||||||
|
<a href="{{.Permalink}}" class="post-item-inner">
|
||||||
|
<span class="post-title">{{.Title}}</span>
|
||||||
|
<span class="post-day">
|
||||||
|
{{ if .Site.Params.dateformShort }}
|
||||||
|
{{ .Date.Format .Site.Params.dateformShort }}
|
||||||
|
{{ else }}
|
||||||
|
{{ .Date.Format "Jan 2"}}
|
||||||
|
{{ end }}
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
{{ else }}
|
||||||
|
{{ range $paginator.Pages.GroupByDate "2006" }}
|
||||||
|
<div class="posts-group">
|
||||||
|
<div class="post-year">{{ .Key }}</div>
|
||||||
|
|
||||||
|
<ul class="posts-list">
|
||||||
|
{{ range .Pages }}
|
||||||
|
<li class="post-item">
|
||||||
|
<a href="{{.Permalink}}" class="post-item-inner">
|
||||||
|
<span class="post-title">{{.Title}}</span>
|
||||||
|
<span class="post-day">
|
||||||
|
{{ if .Site.Params.dateformShort }}
|
||||||
|
{{ .Date.Format .Site.Params.dateformShort }}
|
||||||
|
{{ else }}
|
||||||
|
{{ .Date.Format "Jan 2"}}
|
||||||
|
{{ end }}
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
{{ partial "pagination-list.html" . }}
|
||||||
|
</main>
|
||||||
|
{{ end }}
|
||||||
52
themes/slowbrain/layouts/_default/single.html
Executable file
52
themes/slowbrain/layouts/_default/single.html
Executable file
@@ -0,0 +1,52 @@
|
|||||||
|
{{ define "main" }}
|
||||||
|
<main class="post">
|
||||||
|
|
||||||
|
<!-- <div class="post-info">
|
||||||
|
{{ if .IsTranslated }}
|
||||||
|
{{ i18n "postAvailable" }}
|
||||||
|
{{ range .Translations }}
|
||||||
|
<a href="{{ .Permalink }}"><span class="flag fi fi-{{ index $.Site.Data.langFlags (.Lang) }}"></span></a>
|
||||||
|
{{ end}}
|
||||||
|
{{ end }}
|
||||||
|
</p>
|
||||||
|
</div> -->
|
||||||
|
|
||||||
|
<article>
|
||||||
|
<h2 class="post-title"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
|
||||||
|
|
||||||
|
{{ if .Params.Cover }}
|
||||||
|
<figure class="post-cover">
|
||||||
|
<img src="{{ .Params.Cover | absURL }}" alt="{{ .Title }}" />
|
||||||
|
|
||||||
|
{{ if .Params.CoverCaption }}
|
||||||
|
<figcaption class="center">{{ .Params.CoverCaption | markdownify }}</figcaption>
|
||||||
|
{{ end }}
|
||||||
|
</figure>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ if .Params.toc }}
|
||||||
|
<hr />
|
||||||
|
<aside id="toc">
|
||||||
|
<div class="toc-title">{{ i18n "tableOfContents" }}</div>
|
||||||
|
{{ .TableOfContents }}
|
||||||
|
</aside>
|
||||||
|
<hr />
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<div class="post-content">
|
||||||
|
{{ .Content }}
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<div class="post-info">
|
||||||
|
{{ partial "tags.html" .Params.tags }}
|
||||||
|
{{ partial "categories.html" . }}
|
||||||
|
|
||||||
|
{{- if .GitInfo }}
|
||||||
|
<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-git-commit"><circle cx="12" cy="12" r="4"></circle><line x1="1.05" y1="12" x2="7" y2="12"></line><line x1="17.01" y1="12" x2="22.96" y2="12"></line></svg><a href="{{ .Site.Params.gitUrl -}}{{ .GitInfo.Hash }}" target="_blank" rel="noopener">{{ .GitInfo.AbbreviatedHash }}</a> @ {{ if .Site.Params.dateformNum }}{{ dateFormat .Site.Params.dateformNum .GitInfo.AuthorDate.Local }}{{ else }}{{ dateFormat "2006-01-02" .GitInfo.AuthorDate.Local }}{{ end }}</p>
|
||||||
|
{{- end }}
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
{{ end }}
|
||||||
45
themes/slowbrain/layouts/index.html
Executable file
45
themes/slowbrain/layouts/index.html
Executable file
@@ -0,0 +1,45 @@
|
|||||||
|
{{ define "body" }}
|
||||||
|
<body class="{{ if .Site.Params.backgroundImage }} background-image" style="background-image: url('{{ .Site.Params.backgroundImage }}');" {{ else }}"{{ end }}>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ define "main" }}
|
||||||
|
<main aria-role="main">
|
||||||
|
<div>
|
||||||
|
{{ if .Site.Params.Portrait.Path }}
|
||||||
|
<img src="{{ .Site.Params.Portrait.Path }}" class="circle" alt="{{ .Site.Params.Portrait.Alt }}" style="max-width:{{ .Site.Params.Portrait.MaxWidth }}" />
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ if .Site.Params.MainLogo.Path }}
|
||||||
|
<img src="{{ .Site.Params.MainLogo.Path }}" alt="{{ .Site.Params.MainLogo.Alt }}" style="max-width:{{ .Site.Params.MainLogo.MaxWidth }}" />
|
||||||
|
{{ else }}
|
||||||
|
<h1>{{ .Site.Title }}</h1>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ partial "subtitle.html" . }}
|
||||||
|
|
||||||
|
{{ with .Site.Params.buttons }}
|
||||||
|
<div class="btn-container">
|
||||||
|
{{ range . }}
|
||||||
|
<a class="btn" href="{{ .url }}"> {{ .name }}</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ with .Site.Params.LastPost }}
|
||||||
|
<div class="last-link-container">
|
||||||
|
<p class="last-link" style="font-size: 1.3em; font-weight: bold;">· Les derniers articles ·</p>
|
||||||
|
{{ range site.RegularPages.ByDate.Reverse.Limit 5 }}
|
||||||
|
<p class="last-link"><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></p>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
|
||||||
|
{{- with .Site.Params.social }}
|
||||||
|
<div>
|
||||||
|
{{ partial "social-icons.html" . }}
|
||||||
|
</div>
|
||||||
|
{{- end }}
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
{{ end }}
|
||||||
9
themes/slowbrain/layouts/partials/categories.html
Executable file
9
themes/slowbrain/layouts/partials/categories.html
Executable file
@@ -0,0 +1,9 @@
|
|||||||
|
{{ with .Params.categories }}
|
||||||
|
<p>
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-folder meta-icon"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path></svg>
|
||||||
|
|
||||||
|
{{ range . -}}
|
||||||
|
<span class="tag"><a href="{{ "categories/" | absLangURL }}{{ . | urlize }}/">{{.}}</a></span>
|
||||||
|
{{ end }}
|
||||||
|
</p>
|
||||||
|
{{ end }}
|
||||||
7
themes/slowbrain/layouts/partials/favicons.html
Executable file
7
themes/slowbrain/layouts/partials/favicons.html
Executable file
@@ -0,0 +1,7 @@
|
|||||||
|
<link rel="apple-touch-icon" sizes="180x180" href="{{"apple-touch-icon.png" | relURL}}">
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="{{"favicon-32x32.png" | relURL}}">
|
||||||
|
<link rel="icon" type="image/png" sizes="16x16" href="{{"favicon-16x16.png" | relURL}}">
|
||||||
|
<link rel="manifest" href="{{"site.webmanifest" | relURL}}">
|
||||||
|
<link rel="mask-icon" href="{{"safari-pinned-tab.svg" | relURL}}" color="{{.Site.Params.favicon.mask}}">
|
||||||
|
<link rel="shortcut icon" href="{{"favicon.ico" | relURL}}">
|
||||||
|
<meta name="msapplication-TileColor" content="{{.Site.Params.favicon.msapplication}}">
|
||||||
20
themes/slowbrain/layouts/partials/footer.html
Executable file
20
themes/slowbrain/layouts/partials/footer.html
Executable file
@@ -0,0 +1,20 @@
|
|||||||
|
<footer class="footer">
|
||||||
|
{{if or (.Site.Params.footer.trademark) (.Site.Params.footer.author) (.Site.Params.footer.copyright) (.Site.Params.footer.rss) (.Site.Params.footer.topText) }}
|
||||||
|
<div class="footer__inner">
|
||||||
|
<div class="footer__content">
|
||||||
|
{{ if .Site.Params.footer.trademark }}<span>© 2011-{{ now.Format "2006" }}</span>{{ end }}
|
||||||
|
{{ if .Site.Params.footer.author }}<span><a href="{{ .Site.BaseURL }}">{{ .Site.Author.name }}</a></span>{{ end }}
|
||||||
|
{{ if .Site.Params.footer.copyright }}<span>{{ .Site.Copyright| safeHTML }}</span>{{ end }}
|
||||||
|
{{ if .Site.Params.footer.rss }}<span><a href="{{ "posts/index.xml" | absLangURL }}" target="_blank" title="rss"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-rss"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg></a></span>{{ end }}
|
||||||
|
{{ range .Site.Params.footer.topText }}<span>{{ . | safeHTML}}</span>{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
{{with .Site.Params.footer.bottomText}}
|
||||||
|
<div class="footer__inner">
|
||||||
|
<div class="footer__content">
|
||||||
|
{{ range . }}<span>{{ . | safeHTML}}</span>{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
</footer>
|
||||||
79
themes/slowbrain/layouts/partials/head.html
Normal file
79
themes/slowbrain/layouts/partials/head.html
Normal file
@@ -0,0 +1,79 @@
|
|||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
{{ if .Params.noindex }}
|
||||||
|
<meta name="robots" content="noindex" />
|
||||||
|
{{ end }}
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
<meta name="author" content="{{ if .Params.author }}{{ .Params.author }}{{ else }}{{ range .Site.Author }}{{ . }} {{ end }}{{ end }}">
|
||||||
|
<meta name="description" content="{{ if .IsHome }}{{ .Site.Params.homeSubtitle }}{{ else }}{{ if .Params.Description }}{{ .Params.Description }}{{ else }}{{ .Summary | plainify }}{{ end }}{{ end }}" />
|
||||||
|
<meta name="keywords" content="{{ .Site.Params.keywords }}{{ if .Params.tags }}{{ range .Params.tags }}, {{ . }}{{ end }}{{ end }}" />
|
||||||
|
<meta name="robots" content="noodp" />
|
||||||
|
<meta name="theme-color" content="{{ .Site.Params.themeColor }}" />
|
||||||
|
<link rel="canonical" href="{{ .Permalink }}" />
|
||||||
|
|
||||||
|
{{ block "title" . }}
|
||||||
|
<title>
|
||||||
|
{{ if .IsHome }}
|
||||||
|
{{ $.Site.Title }} {{ with $.Site.Params.Subtitle }} — {{ . }} {{ end }}
|
||||||
|
{{ else }}
|
||||||
|
{{ .Title }} :: {{ $.Site.Title }} {{ with $.Site.Params.Subtitle }} — {{ . }}{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</title>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<!-- CSS -->
|
||||||
|
{{ $opts := dict "transpiler" "libsass" "targetPath" "main.css" "outputStyle" "compressed" "enableSourceMap" true }}
|
||||||
|
{{ with resources.Get "scss/main.scss" | toCSS $opts | minify | fingerprint }}
|
||||||
|
<link rel="stylesheet" href="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
|
||||||
|
{{ range $val := $.Site.Params.customCSS }}
|
||||||
|
{{ if gt (len $val) 0 }}
|
||||||
|
<link rel="stylesheet" type="text/css" href="{{ $val }}">
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<!-- Icons -->
|
||||||
|
{{- partial "favicons.html" . }}
|
||||||
|
|
||||||
|
{{ template "_internal/schema.html" . }}
|
||||||
|
{{ template "_internal/twitter_cards.html" . }}
|
||||||
|
|
||||||
|
{{ if isset .Site.Taxonomies "series" }}
|
||||||
|
{{ template "_internal/opengraph.html" . }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ range .Params.categories }}
|
||||||
|
<meta property="article:section" content="{{ . }}" />
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ if isset .Params "date" }}
|
||||||
|
<meta property="article:published_time" content="{{ time .Date }}" />
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<!-- RSS -->
|
||||||
|
{{ with .OutputFormats.Get "rss" -}}
|
||||||
|
{{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
|
||||||
|
{{ end -}}
|
||||||
|
|
||||||
|
<!-- JSON Feed -->
|
||||||
|
{{ if .OutputFormats.Get "json" }}
|
||||||
|
<link href="{{ if .OutputFormats.Get "json" }}{{ .Site.BaseURL }}feed.json{{ end }}" rel="alternate"
|
||||||
|
type="application/json" title="{{ .Site.Title }}" />
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<!-- Custom head tags -->
|
||||||
|
{{- if templates.Exists "partials/extra-head.html" -}}
|
||||||
|
{{ partial "extra-head.html" . }}
|
||||||
|
{{- end }}
|
||||||
|
|
||||||
|
<!-- Google Analytics internal template -->
|
||||||
|
{{- if .Site.Config.Services.GoogleAnalytics.ID }}
|
||||||
|
{{ template "_internal/google_analytics.html" . }}
|
||||||
|
{{- end }}
|
||||||
|
|
||||||
|
<!-- Plausible.io -->
|
||||||
|
{{- if $.Site.Params.plausibleDataDomain }}
|
||||||
|
<script defer data-domain="{{ .Site.Params.plausibleDataDomain }}" src="{{ .Site.Params.plausibleScriptSource }}"></script>
|
||||||
|
{{- end}}
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user