aboutsummaryrefslogtreecommitdiffstats
path: root/public/projects/angular-small-apps/apps/recipes/src/styles/layout
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2022-02-20 16:11:50 +0100
committerArmand Philippot <git@armandphilippot.com>2022-02-20 16:15:08 +0100
commit73a5c7fae9ffbe9ada721148c8c454a643aceebe (patch)
treec8fad013ed9b5dd589add87f8d45cf02bbfc6e91 /public/projects/angular-small-apps/apps/recipes/src/styles/layout
parentb01239fbdcc5bbc5921f73ec0e8fee7bedd5c8e8 (diff)
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.
Diffstat (limited to 'public/projects/angular-small-apps/apps/recipes/src/styles/layout')
-rw-r--r--public/projects/angular-small-apps/apps/recipes/src/styles/layout/_footer.scss8
-rw-r--r--public/projects/angular-small-apps/apps/recipes/src/styles/layout/_grid.scss16
-rw-r--r--public/projects/angular-small-apps/apps/recipes/src/styles/layout/_main.scss20
3 files changed, 44 insertions, 0 deletions
diff --git a/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_footer.scss b/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_footer.scss
new file mode 100644
index 0000000..03227e5
--- /dev/null
+++ b/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_footer.scss
@@ -0,0 +1,8 @@
+.footer {
+ margin-top: 3rem;
+ text-align: center;
+}
+
+.copyright {
+ font-size: 0.9rem;
+}
diff --git a/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_grid.scss b/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_grid.scss
new file mode 100644
index 0000000..4327ea4
--- /dev/null
+++ b/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_grid.scss
@@ -0,0 +1,16 @@
+app-root {
+ display: flex;
+ flex-flow: column nowrap;
+ min-height: 100vh;
+}
+
+.header,
+.main,
+.footer {
+ width: min(calc(100vw - 2rem), 80ch);
+ margin: 1rem auto;
+}
+
+.main {
+ flex: 1;
+}
diff --git a/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_main.scss b/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_main.scss
new file mode 100644
index 0000000..16ff2a9
--- /dev/null
+++ b/public/projects/angular-small-apps/apps/recipes/src/styles/layout/_main.scss
@@ -0,0 +1,20 @@
+.recipes-list {
+ list-style-type: none;
+ padding: 0;
+ margin: 0 0 2rem;
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(0, 345px));
+ gap: 1rem;
+}
+
+.not-found {
+ background: #fff;
+ border: 1px solid #d7d7d7;
+ border-radius: 5px;
+ box-shadow: 0 0 5px -3px #000000a5;
+ padding: clamp(2rem, 3vw, 3rem) clamp(1rem, 3vw, 2rem) clamp(2rem, 3vw, 4rem);
+
+ &__result {
+ margin-bottom: 2rem;
+ }
+}