From 969b96c2531fb986f6c7f21fd544391b439defd7 Mon Sep 17 00:00:00 2001 From: Jasper Ras Date: Mon, 13 Jan 2025 18:04:20 +0100 Subject: vault backup: 2025-01-13 18:04:20 --- 3 resources/Bash.md | 1 + 3 resources/Bash/Reference arguments.md | 6 + 3 resources/CSS.md | 28 ++ 3 resources/HTML/Inline VS Block elements.md | 69 +++ 3 resources/MySQL.md | 1 + 3 resources/RabbitMQ.md | 1 + 3 resources/Ripgrep.md | 1 + 3 resources/TailwindCSS/Container.md | 2 + 3 resources/TailwindCSS/Prevent overflow.md | 3 + 3 resources/Taskwarrior.md | 4 + 3 resources/Technical definitions.md | 3 +- 3 resources/css/Display.md | 6 - 3 resources/css/Flexbox.md | 14 - 3 resources/css/Grid.md | 681 --------------------------- 3 resources/mysql-foreign-keys.md | 1 - 3 resources/rabbitmq.md | 1 - 3 resources/ripgrep-symlinks.md | 1 - 3 resources/taskwarrior.md | 4 - 18 files changed, 117 insertions(+), 710 deletions(-) create mode 100644 3 resources/Bash.md create mode 100644 3 resources/Bash/Reference arguments.md create mode 100644 3 resources/CSS.md create mode 100644 3 resources/HTML/Inline VS Block elements.md create mode 100644 3 resources/MySQL.md create mode 100644 3 resources/RabbitMQ.md create mode 100644 3 resources/Ripgrep.md create mode 100644 3 resources/TailwindCSS/Container.md create mode 100644 3 resources/TailwindCSS/Prevent overflow.md create mode 100644 3 resources/Taskwarrior.md delete mode 100644 3 resources/css/Display.md delete mode 100644 3 resources/css/Flexbox.md delete mode 100644 3 resources/css/Grid.md delete mode 100644 3 resources/mysql-foreign-keys.md delete mode 100644 3 resources/rabbitmq.md delete mode 100644 3 resources/ripgrep-symlinks.md delete mode 100644 3 resources/taskwarrior.md (limited to '3 resources') diff --git a/3 resources/Bash.md b/3 resources/Bash.md new file mode 100644 index 0000000..841443f --- /dev/null +++ b/3 resources/Bash.md @@ -0,0 +1 @@ +How to [[Reference arguments]]. \ No newline at end of file diff --git a/3 resources/Bash/Reference arguments.md b/3 resources/Bash/Reference arguments.md new file mode 100644 index 0000000..f39eeb1 --- /dev/null +++ b/3 resources/Bash/Reference arguments.md @@ -0,0 +1,6 @@ +Reference as array: `$@`. +Reference as string: `$*`. + +Let's say we want to open a file in our favorite editor through a script, prefixing the filename with something such as a date. +If we were to use `hx "$(date) $@"`, where we reference the arguments as an array, it'd open more than one file - one for the date and one for each argument. +We must use `$*` so that our invocation becomes `hx "$(date) $*"`. This would open a single file with the name being the combination of our arguments prefixed by date. \ No newline at end of file diff --git a/3 resources/CSS.md b/3 resources/CSS.md new file mode 100644 index 0000000..32a3113 --- /dev/null +++ b/3 resources/CSS.md @@ -0,0 +1,28 @@ +**Display** +display none vs visibility hidden: display: none is really like the element does not exist. Visibility hidden just hides it but it still takes space. + +A display: none element can still have size and be coloured with a background image. It still doesn't take space. This can be used for a timeline bar for example! + +**Flexbox** +Flexbox deals with layout always in only one dimension; it's possible to specify which dimension: either vertical or horizontal. + +Two axes: main and cross + +Control main axis: `flex-direction: row|row-reverse|column|column-reverse`. The first two make it a horizontal layout and the latter make it a vertical layout. + +Cross axis is always the opposite of `flex-direction`, so if `flex-direction: row-reverse` the cross axis is `column-reverse`. + +The writing mode determines where the start and end are, based on for example languages. Japanese is written from right-to-left rather than western left-to-right. +So while in Europe the start of a flexbox is at the left and the end at the right in Japan this would be reversed. + +**Relationships** +An important aspect of creating layouts with CSS is the relationships of elements with each other. For example parent/child relationships. + +If we change the width of a parent element; the height of all children increase. This happens because the total area of the parent remains the same. + +When the edge of a child aligns with its parent and we add a margin to the child; it pushes to the parent as well. This phenomenon is called ==collapsing margins==. It can be prevented by unaligning the edge(s) for example by adding padding or setting `display: flow-root;`. + +In `flexbox` siblings push against each other; if we add padding to one, it pushes against the other making it smaller. This does not happen in grid, where each cell gets a fixed size and the padding pushes against its own side. + +**Centering stuff** +Use `margin-inline: auto;` -> this adds margins on both sides of the element. This can be used to center stuff on the page for example. \ No newline at end of file diff --git a/3 resources/HTML/Inline VS Block elements.md b/3 resources/HTML/Inline VS Block elements.md new file mode 100644 index 0000000..bd72478 --- /dev/null +++ b/3 resources/HTML/Inline VS Block elements.md @@ -0,0 +1,69 @@ +A block element always starts on a new line and automatically have their margin set to a non-zero value. +An inline element, as the name suggests, does not start on a new line and has no automatic margins. It +takes only the space that is required for the content it contains. + +Block elements: +-
+-
+-