1	cat << HTML
 2	
 3	<style>
 4	pre br {display:none}
 5	pre p {margin:0;display:inline}
 6	</style>
 7	<header><h1>spppan</h1><p>un parseur pour passer les premiers «P» de «P(re)P(ost)P(rint)» en anti-oblique et oblique</p>
 8	<details open>
 9		<summary>spppan.sh</summary><pre>
10	HTML
11	cat -n << % | sed -E '
12		s	<	\<		g
13		s	>	\>		g
14		s	^(    ..\t)(#.*)	\1<span style="opacity:.5">\2</span>	g
15		s	^    (..)	<span style="opacity:.5">\1</span>		g
16		'
17	#!/usr/bin/env sh
18	
19	# décembre 2024
20	
21	# Une commande sed qui cherche dans un document html les occurences de
22	# prepostprint et de ppp avec ou sans majuscules (gI). Elle insère p(re) et
23	# p(ost) dans des span aux id «ppp-pre» (anti-oblique) et «ppp-post» (oblique).
24	
25	# PPPPPPPPPPPPpp             PPPPPPPPPPPPpp    PPPPPPPPPPPPPPp
26	# ppPPPPPPPPPPPPPPp          pPPPPPPPPPPPPPP    pPPPPPPPPPPPPPP
27	#    pPPp      ppPPPp        pPPP       pPPPp    PPP        pPPP
28	#     PPPp        PPPp       PPP         PPP     PPPp        PPP
29	#     pPPP        PPPP      PPPp      ppPPPp     PPP       pPPPP
30	#      pPPPPPPPPPPPPPp     pPPPPPPPPPPPPPp       PPPPPPPPPPPPPp
31	#       PPPPPPPPPPPpp     pPPPPPPPPPPPpp         PPPPPPPPPPpp
32	#        PPP              PPPp                   PPP
33	#        pPPP            PPPp                    PPP
34	#         pPPp          pPPP                     PPP
35	#         pPPPpp      ppPPPp                   pPPPPPp
36	#         PPPPPPP    PPPPPPP                   PPPPPPP
37	
38	sed -E '
39	s	(p|pre)(p|post)(p|print)\\
40		<span id="ppp-pre">\1</span><span id="ppp-post">\2</span>\3\\
41		gI
42	'
43	# <style>
44	# 	#ppp-pre,
45	# 	#ppp-post {display:inline-block;}
46	# 	#ppp-pre  {transform:skew(15deg);}  /* ╲P╲  */
47	# 	#ppp-post {transform:skew(-15deg);} /*  ╱P╱ */
48	# </style>
49	
50	# exemple : cat [FICHIER].html | ./pppspan.sh
51	
52	# <p>ppp</p> → <p>
53	#                <span id="ppp-pre">p</span>
54	#                <span id="ppp-post">p</span>
55	#                p
56	#              </p>
57	
58	# <h1>pRepOsTPriNt!!</h1> → <h1>
59	#                             <span id="ppp-pre">pRe</span>
60	#                             <span id="ppp-post">pOsT</span>
61	#                             PriNt!!
62	#                           </h1>
63	%
64	cat << HTML
65	</pre>
66	</details>
67	
68	HTML
69