From c19a8f4c561b3b573ae8c9930f489f03953fa1b9 Mon Sep 17 00:00:00 2001 From: marleyrae Date: Sun, 2 Jul 2023 11:18:18 -0700 Subject: [PATCH] Carousel layout done --- src/index.liquid | 66 +++++++++++++++++++++++++----------------- src/style/Carousel.css | 2 ++ src/style/base.css | 10 +++++++ src/style/style.css | 3 ++ 4 files changed, 54 insertions(+), 27 deletions(-) create mode 100644 src/style/base.css diff --git a/src/index.liquid b/src/index.liquid index 77b1212..78137e8 100644 --- a/src/index.liquid +++ b/src/index.liquid @@ -1,45 +1,57 @@ - - - - Marley Rae + + + + Marley Rae - - + + - - + + - - - - + + + +
-
-

Marley Rae

-
marleyrae@protonmail.com
-
+
+

Marley Rae

+
marleyrae@protonmail.com
+
-
-
- Screenshot of punkfairie.net +
+
+ Screenshot of punkfairie.net +
+ / + punkfairie.net / + +
-
-
+

A personal site; includes blinkie + collections and a diary (blog).

-
- © 2023 -
+

Made with Eleventy and SCSS.

+
+
+ +
diff --git a/src/style/Carousel.css b/src/style/Carousel.css index f4d6810..9d47cb8 100644 --- a/src/style/Carousel.css +++ b/src/style/Carousel.css @@ -2,10 +2,12 @@ .Carousel { display: flex; flex-direction: column; + gap: var(--space-xs); align-items: center; margin: auto; block-size: 100%; inline-size: 60%; + text-align: center; } .Carousel-img { diff --git a/src/style/base.css b/src/style/base.css new file mode 100644 index 0000000..454b082 --- /dev/null +++ b/src/style/base.css @@ -0,0 +1,10 @@ +@layer base { + a { + color: var(--c-pink); + } + + a:hover, a:focus { + color: var(--c-purple); + transition: color 300ms; + } +} diff --git a/src/style/style.css b/src/style/style.css index 901a169..0af3398 100644 --- a/src/style/style.css +++ b/src/style/style.css @@ -1,5 +1,8 @@ +@layer reset, base, layout, components; + @import url('@punkfairie/modern-css-reset'); @import url('theme.css'); +@import url('base.css'); @import url('layout/Body.css'); @import url('layout/Site.css'); @import url('layout/Header.css');