Merge pull request #129 from sookim-1/feat_content_style

Feat ContentPreview CustomStyle

README.md

@@ -270,6 +270,7 @@ That will launch a local web server you should use to preview your site, and als
 |------------------------|-------------------------------------------|
 | [jcalderita Portfolio](https://jcalderita.com) | [GitHub](https://github.com/jcalderita/portfolio-web-ignite) |
 | [Fotogroep de Gender](http://www.vdhamer.com/fgDeGender) | [GitHub](https://github.com/vdhamer/Photo-Club-Hub-HTML) |
+| [sookim-1's T.W.L](https://sookim-1.github.io) | [GitHub](https://github.com/sookim-1/blog-website) |
 
 
 ## Contributing

Sources/Ignite/Elements/ContentPreview.swift

@@ -7,6 +7,11 @@
 
 import Foundation
 
+/// A protocol for customizing the layout of ContentPreview.
+public protocol ContentPreviewStyle {
+    func body(content: Content, context: PublishingContext) -> BlockElement
+}
+
 /// A wrapper around Card, specifically aimed at presenting details about
 /// some content on your site. This automatically links to your content page
 /// and adds in tags.
@@ -19,11 +24,42 @@ public struct ContentPreview: BlockElement {
     /// How many columns this should occupy when placed in a section.
     public var columnWidth = ColumnWidth.automatic
 
+    /// Custom style for the content preview.
+    private var style: ContentPreviewStyle?
+
+    /// Initializes the content preview
+    /// - Parameters:
+    ///   - content: The content to display.
     public init(for content: Content) {
         self.content = content
     }
 
+    public func contentPreviewStyle<S: ContentPreviewStyle>(_ style: S) -> ContentPreview {
+        var copy = self
+        copy.style = style
+        return copy
+    }
+
+    /// Renders the content preview with either a custom layout or the default card.
+    /// - Parameter context: The publishing context for rendering.
+    /// - Returns: A rendered string of HTML.
     public func render(context: PublishingContext) -> String {
+        // If custom style is provided, use it; otherwise, fallback to default layout.
+        if let style = style {
+            return style.body(content: content, context: context)
+                .attributes(attributes)
+                .render(context: context)
+        } else {
+            return defaultCardLayout(context: context)
+                .attributes(attributes)
+                .render(context: context)
+        }
+    }
+
+    /// Default card layout for rendering the content preview.
+    /// - Parameter context: The publishing context for rendering tag links.
+    /// - Returns: A BlockElement representing the card layout.
+    private func defaultCardLayout(context: PublishingContext) -> BlockElement {
         Card(imageName: content.image) {
             Text(content.description)
                 .margin(.bottom, .none)
@@ -42,7 +78,6 @@ public struct ContentPreview: BlockElement {
                 .style("margin-top: -5px")
             }
         }
-        .attributes(attributes)
-        .render(context: context)
     }
+
 }