summaryrefslogtreecommitdiff
path: root/Kast
diff options
context:
space:
mode:
authorJasper Ras <jras@hostnet.nl>2025-01-13 13:16:06 +0100
committerJasper Ras <jras@hostnet.nl>2025-01-13 13:16:06 +0100
commit9232b8d817d4cd4122947375156fa2fa1e9fba14 (patch)
treee4feb77f2e508f008b78f722e91488bb9a3f3806 /Kast
parented0753ad224f0c65133bd7a63180257eecd9f5e3 (diff)
vault backup: 2025-01-13 13:16:06
Diffstat (limited to 'Kast')
-rw-r--r--Kast/1736628970 bash join arguments escaped whitespace.md3
-rw-r--r--Kast/1736635245 tailwindcss container.md3
-rw-r--r--Kast/1736635545 tailwindcss.md3
-rw-r--r--Kast/1736692773 prevent scrolling when an element overflows.md3
-rw-r--r--Kast/1736693295 inline vs block html elements.md69
-rw-r--r--Kast/1736693605 flex layout.md4
-rw-r--r--Kast/1736694326 align items.md4
-rw-r--r--Kast/1736696870 mobile first design and development.md2
-rw-r--r--Kast/1736758994 Network switch.md7
9 files changed, 98 insertions, 0 deletions
diff --git a/Kast/1736628970 bash join arguments escaped whitespace.md b/Kast/1736628970 bash join arguments escaped whitespace.md
new file mode 100644
index 0000000..cf97464
--- /dev/null
+++ b/Kast/1736628970 bash join arguments escaped whitespace.md
@@ -0,0 +1,3 @@
+In [[bash]] we can reference arguments as an array using `$@`.
+This isn't what we want when opening a new file for example, e.g `hx "$@"` opens a file for each argument.
+We can use `$*` to reference them as a single string, thus `hx "$*"` opens 1 file with the name of all arguments as a single string.
diff --git a/Kast/1736635245 tailwindcss container.md b/Kast/1736635245 tailwindcss container.md
new file mode 100644
index 0000000..86df090
--- /dev/null
+++ b/Kast/1736635245 tailwindcss container.md
@@ -0,0 +1,3 @@
+The container class in [[1736635545 tailwindcss]] basically adds a margin. If added mx-auto; it splits the margin
+over both sides.
+The margin depends on the current breakpoint. The container max-width is the breakpoints' min-width.
diff --git a/Kast/1736635545 tailwindcss.md b/Kast/1736635545 tailwindcss.md
new file mode 100644
index 0000000..55e6c29
--- /dev/null
+++ b/Kast/1736635545 tailwindcss.md
@@ -0,0 +1,3 @@
+Tailwindcss is a utility first CSS framework. It basically provides all things CSS as a seperate class;
+so similar to writing inline CSS but then using classes.
+It allows for a granular custom design.
diff --git a/Kast/1736692773 prevent scrolling when an element overflows.md b/Kast/1736692773 prevent scrolling when an element overflows.md
new file mode 100644
index 0000000..8a4abed
--- /dev/null
+++ b/Kast/1736692773 prevent scrolling when an element overflows.md
@@ -0,0 +1,3 @@
+When creating the wedding invitation I had an issue where the page would allow
+scroll horizontally because the flower on the top-right was too big.
+Adding the tailwindcss class `overflow-hidden` basically hides all parts that overflow from the container.
diff --git a/Kast/1736693295 inline vs block html elements.md b/Kast/1736693295 inline vs block html elements.md
new file mode 100644
index 0000000..bd72478
--- /dev/null
+++ b/Kast/1736693295 inline vs block html 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:
+- <address>
+- <article>
+- <aside>
+- <blockquote>
+- <canvas>
+- <dd>
+- <div>
+- <dl>
+- <dt>
+- <fieldset>
+- <figcaption>
+- <figure>
+- <footer>
+- <form>
+- <h1>-<h6>
+- <header>
+- <hr>
+- <li>
+- <main>
+- <nav>
+- <noscript>
+- <ol>
+- <p>
+- <pre>
+- <section>
+- <table>
+- <tfoot>
+- <ul>
+- <video>
+
+Inline elements:
+- <a>
+- <abbr>
+- <acronym>
+- <b>
+- <bdo>
+- <big>
+- <br>
+- <button>
+- <cite>
+- <code>
+- <dfn>
+- <em>
+- <i>
+- <img>
+- <input>
+- <kbd>
+- <label>
+- <map>
+- <object>
+- <output>
+- <q>
+- <samp>
+- <script>
+- <select>
+- <small>
+- <span>
+- <strong>
+- <sub>
+- <sup>
+- <textarea>
+- <time>
+- <tt>
+- <var>
diff --git a/Kast/1736693605 flex layout.md b/Kast/1736693605 flex layout.md
new file mode 100644
index 0000000..22008e5
--- /dev/null
+++ b/Kast/1736693605 flex layout.md
@@ -0,0 +1,4 @@
+The flexbox layout is a single axis layout that makes it easy to layout content on a given axis.
+
+`flex-direction: column;` sets Y as the main axis, and X as the cross axis.
+`flex-direction: row;` sets X as the main axis, and Y as the cross axis.
diff --git a/Kast/1736694326 align items.md b/Kast/1736694326 align items.md
new file mode 100644
index 0000000..7febeeb
--- /dev/null
+++ b/Kast/1736694326 align items.md
@@ -0,0 +1,4 @@
+https://developer.mozilla.org/en-US/docs/Web/CSS/align-items
+
+Use `align-items` to align items on the cross-axis in flexbox. If grid layout is used items are aligned
+on the block axis within their grid area.
diff --git a/Kast/1736696870 mobile first design and development.md b/Kast/1736696870 mobile first design and development.md
new file mode 100644
index 0000000..5cc0f57
--- /dev/null
+++ b/Kast/1736696870 mobile first design and development.md
@@ -0,0 +1,2 @@
+While working on the [[website]] [[wedding invitation]] I found that it is much easier to
+build it for mobile first.
diff --git a/Kast/1736758994 Network switch.md b/Kast/1736758994 Network switch.md
new file mode 100644
index 0000000..2fed693
--- /dev/null
+++ b/Kast/1736758994 Network switch.md
@@ -0,0 +1,7 @@
+#linux #networking
+
+A switch keeps a MAC-Address-Table mapping MAC addresses to connected ports. Connected devices that want to communicate learn each others' MAC address via an ARP request. They can then specify the destination MAC address and the switch will do the forwarding to the correct port.
+
+Broadcast domain: broadcast traffic will be forwarded to all ports except the port the request arrived on. Broadcast traffic will stay within the broadcast domain as routers that receive a broadcast do not forward it to another [[subnet]].
+
+> Large layer 2 broadcast domains can cause problems for example a [[broadcast storm]] which can take down the network