diff --git a/content/movies/inception.md b/content/movies/inception.md
index 903cab2..77adc91 100644
--- a/content/movies/inception.md
+++ b/content/movies/inception.md
@@ -3,6 +3,8 @@ title: "Inception"
category: "Movies"
image: "/img/inception.jpg"
rating: 4.8
+consumed: true
+recommended_by: "Christopher"
description: "A mind-bending thriller about dream invasion."
link:
url: "#"
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index fefc694..5df5d16 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -37,6 +37,18 @@
{{ end }}
+ {{ if eq .Params.consumed false }}
+
+ Not {{ if eq .Params.category "Books" }}Read{{ else if eq .Params.category "Movies" }}Watched{{ else if eq .Params.category "TV Series" }}Watched{{ else if eq .Params.category "Restaurants" }}Visited{{ else if eq .Params.category "Recipes" }}Made{{ else if eq .Params.category "Concerts" }}Attended{{ else }}Experienced{{ end }} Yet
+
+ {{ end }}
+
+ {{ with .Params.recommended_by }}
+
+ Recommended by: {{ . }}
+
+ {{ end }}
+
{{ with .Params.description }}
{{ . }}
{{ end }}
@@ -234,6 +246,28 @@
border-radius: 16px;
font-size: 0.9rem;
}
+.not-consumed-badge-detail {
+ display: inline-block;
+ background-color: #2196f3;
+ color: white;
+ padding: 6px 12px;
+ border-radius: 4px;
+ font-size: 0.9rem;
+ font-weight: 500;
+ margin: 8px 0 16px 0;
+}
+.detail-recommended {
+ margin-bottom: 16px;
+ font-size: 1.05rem;
+ color: #555;
+}
+.recommended-label {
+ font-weight: 500;
+ color: #333;
+}
+.detail-consumed-status {
+ margin-bottom: 8px;
+}
.detail-body {
padding: 24px;
font-size: 1.1rem;
diff --git a/layouts/partials/card.html b/layouts/partials/card.html
index 45e0169..aef41ba 100644
--- a/layouts/partials/card.html
+++ b/layouts/partials/card.html
@@ -5,9 +5,13 @@
{{ else }}
{{ end }}
+ {{ if eq .Params.consumed false }}
+ Not {{ if eq .Params.category "Books" }}Read{{ else if eq .Params.category "Movies" }}Watched{{ else if eq .Params.category "TV Series" }}Watched{{ else if eq .Params.category "Restaurants" }}Visited{{ else if eq .Params.category "Recipes" }}Made{{ else if eq .Params.category "Concerts" }}Attended{{ else }}Experienced{{ end }} Yet
+ {{ end }}
{{ .Title }}
{{ with .Params.rating }}{{ partial "stars.html" (dict "rating" .) }} {{ . }}
{{ end }}
{{ with .Params.likes }}👍 {{ . }}
{{ end }}
+ {{ with .Params.recommended_by }}Recommended by: {{ . }}
{{ end }}
{{ .Params.description }}
@@ -75,6 +79,24 @@
display: flex;
align-items: flex-end;
}
+.not-consumed-badge {
+ position: absolute;
+ top: 8px;
+ right: 8px;
+ background-color: rgba(33, 150, 243, 0.9);
+ color: white;
+ padding: 4px 8px;
+ border-radius: 4px;
+ font-size: 0.8rem;
+ font-weight: 500;
+ z-index: 1;
+}
+.card-recommended {
+ margin: 4px 16px 0 16px;
+ font-size: 0.9rem;
+ color: #666;
+ font-style: italic;
+}
@media (max-width: 600px) {
.card-link-outer .card {
width: 98vw;