TL;DR…
alias : billet long, certainement incomplet et partiellement chiant, à éviter…!

Pas évident d’évoquer ce type d’élément d’autant que l’application Drafts — sous macOS comme sous iOS — propose nombre de feuilles de style par défaut immédiatement utilisables.

Depuis la version 26, la possibilité de construire ses propres feuilles de Style est disponible… en passant par la souscription¹ à Drafts Pro… Aucune obligation, CQFD. Et comme dit juste avant, la collection de base est exploitable.

Alors, pourquoi perdre du temps ?!

À quoi cela sert-il…?

Pour se repérer aisément dans un texte, la coloration syntaxique peut s’avérer très confortable dès lors que le texte est codé, emploie des balises.

• Deux représentations d’un même texte : coloration syntaxique Monochrome Light au-dessus…
• …puis coloration syntaxique Solarized ci-dessous…

Si vous employez des balises MultiMarkdown ou Markdown, cela vous permettra de repérer plus confortablement la structure de votre texte.

En gros, la couleur du texte change en fonction des balises utilisées. On peut se contenter d’une coloration syntaxique légère, discrète…
Ou, inversement, avoir un dispositif qui permet de repérer les divers niveaux du plan, distinguer la citation du reste du corps du texte, etc.

Pour s’en convaincre, il suffit de faire défiler les diverses feuilles de style par défaut.

À l’usage (…c’est fou comme on s’habitue vite et focalisons sur les détails), on va regretter de ne pas trouver telle balise suffisamment accentuée, que les liens ne soient pas bien mis en valeur.
Ou inversement.

C’est ici que l’option Styles proposée depuis la version 26 devient intéressante…! Attention, c’est hyper addictif et chacun peut se bâtir une solution qui lui conviendra… en propre.

Un cadre de travail personnel

En effet, à chacun de choisir sa stratégie en fonction de ses besoins, envies mais aussi en fonction de son âge (…eh oui, d’aucuns mettront quelques décennies à comprendre mes propos…!), de sa vue (je pense notamment aux copains Daltoniens)…
Voire… des conditions d’utilisation. Ainsi, dans mon cas, c’est essentiellement sur l’iPhone que je saisie mes premiers jets.
Sans oublier de l’endroit où sera utilisé l’écran : jour ou nuit ? Dans un coin ensoleillé ou pas, en fonction de la luminosité souhaitée de l’écran…

Tout ceci va conduire à des solutions chromatiques qui feront hurler les tenants du bon goût et de l’harmonie !

Alors, unique conseil : pensez à vous et non à suivre les remarques de votre entourage… c’est vous qui aller employer cette feuille de style sur vos écrans, personne ne sera contraint de le faire hormis vous…!

• N’hésitez pas à pondre des déclinaisons que vous virerez à terme…

• Pour ne conserver que celles que vous retenez après avoir fait saigné vous yeux…!

La feuille de style semblera immonde, Ugly ? Et alors ?!

Cette histoire d’harmonie me fait penser à aux dogmes culinaires, aux aliments qui ne doivent pas se mélanger. Étant partisan du combo “pain grillé + beurre salé avec Camembert bien fait et carreau de chocolat noir - noisettes”, ce petit rappel explique mon… mauvais goût !

Or l’important est que cette feuille de Style corresponde² à ce que vous attendez, on est pas ici dans un concours de beauté mais bien dans l’élaboration d’un dispositif visuel pratique !

• Prenez le temps de visualiser toutes les options disponibles (…seule la version PRO de Drafts offre des thèmes supplémentaires et la possibilité de construire votre feuille de style…)
• Choisissez la feuille de style par défaut qui vous convient…
• C’est uniquement après vous êtes coltiné des heures avec (…et changé quelques fois de modèle pour tester d’autres propositions…) que vous aurez — peut-être — envie de retrousser vos manches pour modifier a minima celle que vous aurez retenue…

Cela nécessite de ne plus utiliser Drafts gratuitement… Avec l’abonnement (mensuel ou annuel), souvenez-vous que vous allez accéder à un catalogue de solutions gigantesque et couvrant nettement plus de domaines que la problématique de la feuille de style³…

Drafts vous offre un accès à une épatante documentation sur la structure des feuilles de style (en anglais) mais pas que !

Enfin, de nombreuses de feuilles prêtes à l’emploi sont disponibles dans l’application, contributions du développeur mais aussi de membres de la communauté et suffiront, qui sait, à votre bonheur !

Aussi je ne vais pas détailler comment récupérer un fichier du type mon style.draftsTheme depuis iCloud dans le sous dossier Drafts/Library/Themes, etc.

Texte et JSON

Contrairement à Ulysses pour ses propres feuilles de style, ici le langage employé par Drafts est du JSON.

Pas question de s’inventer de nouvelles entrées (idée farfelue que j’ai rapidement écartée !) et surtout, plus agaçant, impossible de commenter le code.

• Pas inutile de conserver une copie d’écran de vos réglages principaux en l’absence de commentaires…

L’absence de cette dernière option m’a permis de me rendre compte que mon peu de mémoire immédiate (…quelle idée aussi de faire plein de trucs⁴ en parallèle !) pouvait me conduire à commettre de jolies erreurs !

• D’autant qu’une astuce est parfois d’aller modifier bien avant la liste des couleurs de l’interface ou de l’éditeur…

Choix des couleurs, vaste débat…!

Drafts offre une version claire et une version sombre qui peuvent être activées manuellement ou associées à la fonction jour nuit Night Shift de votre écran activée via les options d’affichage.

J’ai démarré par quelques versions claires avant de m’attaquer à un version sombre, influencé par le thème Solarized Dark que j’emploie régulièrement. J’ai changé le style dark depuis un lien dans la page de documentation et hop…

Vivant sur une île et dans un environnement maritime, ce sont d’autres couleurs que j’avais envie de mettre en œuvre quitte à pondre un truc bizarre pour la version Dark.

Idem pour une version Light plus… chaude (sic !)…

Pour le choix des couleurs, je disposais de l’application PANTONE Studio qui fonctionne correctement même s’il est dédié à d’autres usages !

• Certes, c’est un nuancier Pantone mais il donne les valeurs HEX de chaque référence (parfois illisibles en blanc sur une teinte très lumineuse quand affichée plein pot).

• Il est possible de se construire une palette de 5 nuances, trouver les valeurs complémentaires, analogues, etc.

J’insiste à nouveau : l’idée n’est pas de gagner un concours de beauté, mais bien de rester cohérent vis-à-vis du but recherché, c’est à dire : aider à la lisibilité lors de la rédaction d’un texte.

J’ai certainement oublié des tas d’aspects de la feuille de style (certains n’ont même pas été traités dans les miennes)…!

Bref, le résultat est affaire de son propre goût !

La typo n’est pas innocente

Enfin, je ne vais pas rentrer dans les détails mais, contrairement à la grande majorité des utilisateurs, je n’emploie pas deux polices de caractères sur Drafts ou Ulysses !

J’ai opté pour l’usage exclusif de JetBrains Mono⁵.

Bref, une typo Code en permanence !

iCloud et patience

Dernière remarque : élaborer vos feuilles de styles demande de la patience. Au moment où vous enregistrez votre prototype sur iCloud dans le dossier ad hoc et le moment où vous pouvez le charger dans votre écran, il s’écoule… un certain temps !

Et vous pouvez avoir l’impression que votre dernière modification n’a pas été effectuée au bon endroit (!) alors que vous n’aviez toujours pas chargé la bonne version !!

Ce genre de gag m’est arrivé un grand nombre de fois…!

Bref, patience, vérifiez bien que la synchronisation vers le nuage s’est correctement déroulée ; accessoirement, chargez une feuille de style standard au hasard avant de réactiver la votre !

• Une option est de modifier la description (attention à ne pas être trop long…!) pour se repérer…

• Et donc réimporter votre feuille via Import

• Bien valider Replace Existing… Et…

• …s’assurer que la mention Theme updated apparaisse furtivement en haut…!

• Enfin, assurez-vous d’avoir correctement sélectionné le bon thème pour le jour…

• …et la nuit. Ou activé System pour un changement automatique calqué sur Night Shift (dans les réglages de votre iPhone, Luminosité et affichage) et hop…

Pour des informations complémentaires, se référer à la documentation de Drafts…! Et bravo à ceux qui sont arrivés à cette avant dernière ligne…!

À suivre…

Je vais entamer une série de notes personnelles — mais partagées pour les personnes intéressées…
Ce qui suit est un monologue… As usual

Ce matin — va savoir pourquoi — je me suis penché sur le problème du transfert d’un texte balisé dans Day One vers Drafts ou Ulysses.

Il est clair que la simplification de l’interface de Day One Journal (version 6.x) gomme peu à peu le balisage Markdown, ce qui présente un aspect agréable car cela offre un rendu ultra propre à l’écran… Mais peut-être trop, non…?!

Alors, comment récupérer des entrées dans cette application pour les transférer ailleurs avec toutes les balises…? That is the question…

Rien à voir, la fonction Highlight dans Day One

Apparue récemment dans Day One, le Highlight. On sélectionne le texte, on appuie sur le H stabiloté et hop…

J’attends cela dans d’autres traitements de texte dont Drafts…

Je reviens à mon propos (rappel : ce billet comme les 6394 précédents depuis 2003, sont des notes personnelles, cela expliquant pourquoi il n’y aucune pub ni périodicité, etc.)

Copier vers Drafts

Faut déjà savoir quoi coller…!
Je souhaite conserver les balises (que je ne vois pas mais que je devine), aussi…

• Aller dans Exporter pour un ouvrir un premier panneau (je ris mais c’est nerveux…)

• en bas (!) des options disponibles, se rendre sur Visualiser le texte brut…

• Oh, le texte de l’entrée source est affiché avec les balises Markdown !
• On remonte dans ce même écran vers l’icône située en haut (!) à gauche de partage…
• C’est un jeu de piste…

• on accède à un second panneau d’options et il est temps de choisir sa cible…!
• Drafts dans mon cas…

• Il ne reste plus qu’à (sic…!) valider via Save… (en haut à droite, ahaha !!) et le texte est enregistré tel…
• Note à ceux qui suivent : la feuille de style utilisée ici est de mon choix, c’est une option présente dans la prochaine version de Drafts (qui arrive), comprendre la possibilité de se fabriquer ses propres styles…

Copier vers Ulysses

Idem ce qui précède avec, à la fin, l’option Copier (le texte) pour

• Suivi de l’ouverture de Ulysses (…oui, on pourrait faire plus simple, je suis d’accord) et création d’une nouvelle feuille dans le dossier de votre choix…!
• Et là, on prend son temps !

• Pas Coller mais Action…

• puis Coller… (les trois petits points qui changent tout…!)

• Puis À partir du Markdown (et surtout pas au format texte, malheureux :-)

• Ouf…!

Ceci explique le choix de la catégorie groummphh dans mon blog…

Pour ma part, lire un ouvrage m’incite fréquemment à recopier un extrait qui m’amuse ou m’informe. Avec le papier, je me refusais à crayonner même si j’ai du le faire (si, si…!) sur de rares ouvrages techniques.

Mais depuis que je suis passé au PDF puis à l’ePub, je n’ai plus ce souci. Pour le PDF, un simple copier coller de la sélection de texte.

Pour le ePub, j’ai vite déchanté en découvrant la limite en nombre de signes dans Books, limite qui a un peu évoluée mais peu pratique (euphémisme) à mettre en œuvre.

Avec un lecteur de fichiers ePub débarrassés de leur DRM, ça change la donne pour se construire des fiches de lecture pratiques. Et, surtout, l’usage de Marvin 3.

Pour en savoir plus, relire ce long et fastidieux billet : urbanbike | Lire sur Marvin 3 sous iOS

Si ma fille utilise un simple sélection déplacement en mode SplitView de la citation entre Marvin et Drafts, j’étais plus adepte de l’envoi d’une sélection de l’ouvrage dans Drafts mais via un export avec empilement des citations au fil de ma lecture en mode Append.

Dispositif déjà évoqué ici : urbanbike | Usages | Append sur Drafts ou lister dans Copied ?

Et puis Greg nous a proposé ceci dans Drafts : HTML > Markdown | Drafts Action Directory, une action qui n’a rien à voir avec la choucroute… a priori.

Sauf que elle a changé ma façon de préparer mes fiches de lecture : je stabilote l’ouvrage, de A à Z puis, à la fin de la lecture, je m’envoie le tout en une seule opération !

Illustration avec des copies d’écran

Sans revenir sur les options Append ou drag and drop, il y a trois voies supplémentaires pour récupérer globalement nos annotations depuis Marvin 3 !

Ici, je pars de l’épatant ouvrage signé par Sylvie Claval et Claude Duneton, histoire d’illustrer mon propos. Quand vous êtes sur une page en cours de lecture, les trois voies sont au dessus du texte.

Empruntons les deux premières. Elles passent nécessairement par l’accès au sommaire… Mais, troublant, il faut immédiatement regarder en bas de page pour accéder à l’un des quatre onglets disponibles…

L’onglet annotations est en bas, le sélectionner puis toucher en haut…

Désormais vous avez accès à deux options clés : La première permet d’échanger les annotations prises avec une autre version de Marvin (pour ma part avec mon iPad !)

AirDrop est une fonction fabuleuse

La seconde permet un export dans quatre formats dont le HTML sur lequel je vais revenir par la suite.

On pourrait s’arrêter ici et montrer de suite le script annoncé au début de ce billet. Sauf que non. Marvin offre une troisième voie qui peut intéresser ceux qui utilisent le surligneur en jouant sur les couleurs disponibles.

Retour à un page courante et accès direct à l’icône située en haut à droite…

Via ce panneau, vous avez accès à plein d’options dont Text-to-speech si vous souhaiterez transformer votre ePub en audio livre. En bas, vous retrouver une option Show journal and annotations qui ressemble à ce que l’on a déjà vu. Sauf que non.

Je vous fais grâce des options dispo pour ne retenir que le filtre par couleur de vos sur lignages. Si vous ne faites rien, ce sont toutes les couleurs qui seront exportées.

Reste à descendre un peu pour trouver un bouton Export…

Avec une option supplémentaire. Validez HTML…

Toutes les annotations sont exportées. Dans cet exemple, je les expédie vers Drafts. Vous pouvez remarquer que Marvin a écrit proprement le code HTML…

Reste plus qu’à activer le script et à prévisualiser le rendu ! Drafts ne visualise que le début et vous demande de valider l’option pour finaliser le traitement :

Copier le texte en markdown, replacer le code HTML ou créer une nouvelle note ? Pour ma part, c’est la dernière option que je sélectionne. Drafts termine alors le travail et m’affiche ma fiche de lecture en mode antechronologique, avec l’horodateur et même la couleur de mon surlignage.

Voilà pourquoi j’aime tant Drafts que Marvin 3.

C’est tout !