- video record :
- peek : easy but dont show mouse click
- then run ~/Nextcloud/downloads/find-cursor/mouse_click_monitor.sh
- kooha : not succeed to install
- vokosceenNG : ugly cursor showclick
- peek : easy but dont show mouse click
original : • 8226 U+2022 : 57442 U+E062 : 57443 U+E063 -- : 57444 U+E064 : 57445 U+E065 actual : 57446 U+E066 : 57447 U+E067
- to include fonts into an svg file, you must fully integrate it in base64 :
- explanation : https://vecta.io/blog/how-to-use-fonts-in-svg
- converter : https://products.aspose.app/font/base64
- minimizer : https://vecta.io/nano
- but first i used fontforge to create a woff file with only the one glyphe that i used in my ascii art :
- open the file in fontforge, select all glyphs but this one, and delete with "clear"
base64 1dot : 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
base64 6dots : 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
base64 6dots and spaces : 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
start it with a server, like : alive-server
- https://www.npmjs.com/package/alive-server
- install :
npm install -g alive-server
difficulties :
- accessibility with ascii art titles
- I finally decided to go with a structure like this :
<h1 aria-label="hugo lamy"> <span aria-hidden="true" class="pre"> hugo (ascii) </span> <span aria-hidden="true" class="pre"> lamy (ascii) </span> </h1>
- I finally decided to go with a structure like this :
- links accessibility
- accessibility gone wild
- don't use title attribute
- I thought title text improved accessibility. I was wrong.
- Things I learned by pretending to be blind for a week
- create the full screen hero section with the navbar under the title
projects :
- [/] ljdp
- tchat transcendance
- setup docker without sudo on server
- remove authentification from project
- cube3d
- minishell
direction | width | child | child | child | | position | main axis | second axis ................................................................ horizontal | content | left |-pack |-fit vertical |-parent | right | grow | stretch | | top | space | | | bottom | spread | | |-center | |
.<direction>-<width>-<position-[position]>-<main-axis>-<second-axis>
position : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . left-top . . top . . right-top . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . left . .-center . . right . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . left-bottom . . bottom . . right-bottom. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
width : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . parent . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
main axis : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . space . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . spread. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .-pack . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . grow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
second axis : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .-fit . . . . . .stretch. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
v2 :
direction | width | child | child | child | | position | main axis | second axis ................................................................ horizontal | fit | left |-pack | begin vertical | large | right | grow | end | | top | space |-middle | | bottom | spread | equal | |-center | | stretch
.<direction>-<width>-<position-[position]>-<main-axis>-<second-axis>
position : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . left-top . . top . . right-top . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . left . .-center . . right . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . left-bottom . . bottom . . right-bottom. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
main axis : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . space . . . . . . justify-content . . . . . . . . . . . . . . . . . : space-around . . . . . . . . . . . . . . . . . . . . . spread. . . . . . justify-content . . . . . . . . . . . . . . . . . : space-between . . . . . . . . . . . . . . . . . . . . .-pack . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . grow . . . . . . child : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . grow: 1; . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
second axis : . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . begin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .-middle. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . equal . . . . . . . . . . . . . . . . . . . . . . . . . . . end . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .stretch. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .