Skip to content

Commit d17f79a

Browse files
committed
enh: final css cleanup
1 parent c0e2512 commit d17f79a

File tree

4 files changed

+55
-12
lines changed

4 files changed

+55
-12
lines changed

_includes/package-grid.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
{% assign use_isotope = include.isotope | default: false %}
2+
{% assign is_feature = include.feature %}
23

34
{% if use_isotope %}
45
<div class="element-item package-card {% for aCategory in apackage.categories %}
@@ -41,6 +42,7 @@ <h3 class="package-card__title" itemprop="name">
4142
{{ apackage.package_description | markdownify }}
4243
</div>
4344

45+
{% unless is_feature %} HI there
4446
<ul class="package-card__links">
4547
<li><a href="{{ apackage.repository_link }}" rel="permalink"><i class="fab fa-github" aria-hidden="true"></i> View Code</a></li>
4648
{% if apackage.gh_meta.documentation %}
@@ -57,5 +59,6 @@ <h3 class="package-card__title" itemprop="name">
5759
<li class="package-card__archived"><i class="fa-solid fa-box-archive" aria-hidden="true"></i> Archived</li>
5860
{% endif %}
5961
</ul>
62+
{% endunless %}
6063
</div>
6164
</div>

_pages/about-peer-review.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -157,8 +157,8 @@ We are deeply grateful for those served on our editorial board previously!
157157
{% assign packages_sorted = site.data.packages | sort_natural: 'date_accepted' | reverse %}
158158

159159
<div class="grid">
160-
{% for apackage in packages_sorted limit:4 %}
161-
{% include package-grid.html %}
160+
{% for apackage in packages_sorted limit:3 %}
161+
{% include package-grid.html feature=true %}
162162
{% endfor %}
163163
</div>
164164

_pages/home.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -136,7 +136,7 @@ peer-review:
136136

137137
<div class="packages-grid">
138138
{% for apackage in packages_sorted limit:3 %}
139-
{% include package-grid.html %}
139+
{% include package-grid.html feature=true %}
140140
{% endfor %}
141141
</div>
142142

_sass/minimal-mistakes/_pyos-grid.scss

Lines changed: 49 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -176,7 +176,7 @@ $colors: (
176176
}
177177
}
178178

179-
// Home page packages section - fixed breakpoints
179+
// Home page packages section - fixed breakpoints (max 3 columns for better spacing)
180180
.packages-grid {
181181
display: grid;
182182
grid-gap: 10px;
@@ -187,11 +187,45 @@ $colors: (
187187
}
188188

189189
@media (min-width: $medium) {
190-
grid-template-columns: repeat(3, 1fr); // Medium: 3 columns
190+
grid-template-columns: repeat(3, 1fr); // Medium and above: 3 columns (max)
191191
}
192192

193-
@media (min-width: $large) {
194-
grid-template-columns: repeat(4, 1fr); // Large: 4 columns
193+
// Feature package cards - compact display
194+
.package-card {
195+
.package-card__content {
196+
padding: 1.25em;
197+
}
198+
199+
.package-card__title {
200+
font-size: 1.5em;
201+
}
202+
203+
.package-card__meta {
204+
font-size: 0.75em;
205+
}
206+
207+
.package-card__description p {
208+
font-size: 1.1em;
209+
line-height: 1.5em;
210+
}
211+
}
212+
}
213+
214+
.grid .package-card {
215+
.package-card__content {
216+
padding: 1.25em;
217+
}
218+
219+
.package-card__title {
220+
font-size: 1.0375em;
221+
}
222+
223+
.package-card__meta {
224+
font-size: 0.75em;
225+
}
226+
227+
.package-card__description {
228+
font-size: 0.8125em;
195229
}
196230
}
197231

@@ -286,16 +320,20 @@ $colors: (
286320
.grid-item {
287321
display: flex;
288322
flex-direction: column;
289-
background: $pyos-mediumpurple;
290-
border: 1px solid #ddd;
323+
background: transparent;
324+
border: none;
291325
border-radius: 8px;
292-
overflow: hidden;
326+
overflow: visible;
293327
padding: 0;
294328
}
295329

330+
.cards.highlight {
331+
margin: 0 !important;
332+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08) !important;
333+
}
296334

297-
div>div {
298-
padding:0;
335+
div > div {
336+
padding: 0;
299337
}
300338
}
301339

@@ -304,6 +342,7 @@ $colors: (
304342
display: flex;
305343
flex-direction: column;
306344
height: 100%;
345+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
307346

308347
.cards__image {
309348
max-height: 200px;
@@ -322,6 +361,7 @@ $colors: (
322361

323362
&:hover {
324363
cursor: default;
364+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08); // Maintain shadow on hover (override base .cards hover shadow)
325365
}
326366

327367
.card-body {

0 commit comments

Comments
 (0)