219 lines
11 KiB
Markdown
219 lines
11 KiB
Markdown
|
|
difficulties :
|
|
|
|
- [accessibility with ascii art titles](https://stackoverflow.com/questions/77537096/make-text-in-ascii-art-more-accessible)
|
|
- 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>
|
|
```
|
|
- [create the full screen hero section with the navbar under the title](https://stackoverflow.com/questions/77596781/in-css-how-to-make-a-sticky-navbar-after-the-header-in-an-hero-section/)
|
|
|
|
---
|
|
|
|
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. . . . . .
|
|
. . . . . . . .
|
|
. . . . . . . .
|
|
. . . . . . . .
|
|
. . . . . . . . . . . . . . . . .
|
|
. .
|
|
. . . . . . . . . . . . . . . . . . .
|
|
|
|
|