chore!: restructure repo

I separated public files from the config/dev files. It improves repo
readability.
I also moved dotenv helper to public/inc directory and extract the
Matomo tracker in the same directory.

3 files changed, 41 insertions, 0 deletions

diff --git a/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_mixins.scss b/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_mixins.scss
new file mode 100644
index 0000000..e1733dc
--- /dev/null
+++ b/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_mixins.scss
@@ -0,0 +1,24 @@
+@use "sass:math";
+
+/// Create a triangle with CSS.
+/// @link https://sass-lang.com/documentation/at-rules/control/if#else-if
+@mixin triangle($size, $color, $direction) {
+  height: 0;
+  width: 0;
+
+  border-color: transparent;
+  border-style: solid;
+  border-width: math.div($size, 2);
+
+  @if $direction == up {
+    border-bottom-color: $color;
+  } @else if $direction == right {
+    border-left-color: $color;
+  } @else if $direction == down {
+    border-top-color: $color;
+  } @else if $direction == left {
+    border-right-color: $color;
+  } @else {
+    @error "Unknown direction #{$direction}.";
+  }
+}
diff --git a/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_placeholders.scss b/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_placeholders.scss
new file mode 100644
index 0000000..565959c
--- /dev/null
+++ b/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_placeholders.scss
@@ -0,0 +1,5 @@
+%list-reset {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
diff --git a/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_variables.scss b/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_variables.scss
new file mode 100644
index 0000000..8f1717e
--- /dev/null
+++ b/public/projects/react-small-apps/apps/todos/src/sass/abstracts/_variables.scss
@@ -0,0 +1,12 @@
+$background-color: hsl(0, 0%, 100%);
+$foreground-color: hsl(0, 0%, 0%);
+$foreground-color-alt: hsl(0, 0%, 100%);
+$primary-color: hsl(209, 54%, 32%);
+$primary-color-light: hsl(209, 54%, 37%);
+$primary-color-dark: hsl(209, 54%, 27%);
+$secondary-color: hsl(32, 92%, 86%);
+$secondary-color-light: hsl(32, 92%, 91%);
+$secondary-color-dark: hsl(32, 92%, 81%);
+$shadow-color: rgba(26, 57, 86, 0.55);
+$done-color: hsl(32, 63%, 50%);
+$delete-color: hsl(0, 63%, 50%);