From 269433c6f84ce631d38fd7ffaed04ed3f7c2bf4f Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Tue, 20 Apr 2021 21:45:36 +0200
Subject: Support project previews
---
assets/css/layouts/_card-grid.scss | 8 ++++++--
assets/css/layouts/_project-grid.scss | 17 +++++++++++++++++
assets/css/layouts/_section.scss | 7 -------
3 files changed, 23 insertions(+), 9 deletions(-)
create mode 100644 assets/css/layouts/_project-grid.scss
(limited to 'assets/css/layouts')
diff --git a/assets/css/layouts/_card-grid.scss b/assets/css/layouts/_card-grid.scss
index cbc4388..7c8ad8c 100644
--- a/assets/css/layouts/_card-grid.scss
+++ b/assets/css/layouts/_card-grid.scss
@@ -1,13 +1,17 @@
@include namespace('card-grid') {
@include store((
--dims: (
- --card-width: 17em
+ --col-width: 17em
)
));
@include layout(namespace()) {
display: grid;
- grid-template-columns: repeat(auto-fit, minmax(#{prop(--dims --card-width)}, 1fr));
+ grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
gap: .6rem;
+
+ @include media('<=sm') {
+ grid-template-columns: 1fr;
+ }
}
}
diff --git a/assets/css/layouts/_project-grid.scss b/assets/css/layouts/_project-grid.scss
new file mode 100644
index 0000000..df2952b
--- /dev/null
+++ b/assets/css/layouts/_project-grid.scss
@@ -0,0 +1,17 @@
+@include namespace('project-grid') {
+ @include store((
+ --dims: (
+ --col-width: 26em
+ )
+ ));
+
+ @include layout(namespace()) {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
+ gap: 1rem;
+
+ @include media('<=sm') {
+ grid-template-columns: 1fr;
+ }
+ }
+}
diff --git a/assets/css/layouts/_section.scss b/assets/css/layouts/_section.scss
index 70ace4c..51e3dc8 100644
--- a/assets/css/layouts/_section.scss
+++ b/assets/css/layouts/_section.scss
@@ -25,7 +25,6 @@
left: 0;
flex-direction: row;
justify-self: flex-start;
- padding-right: prop(--dims --outer, $global: true);
font-size: 1 / 16 * 15em;
&::after {
@@ -38,11 +37,5 @@
border-top: 1px solid prop(--colors --border);
}
}
-
- @include media('<=sm') {
- @include element('head') {
- padding-right: 0;
- }
- }
}
}
--
cgit v1.2.3-70-g09d2