dearwolf/aider
1
0
Fork 0
mirror of https://github.com/Aider-AI/aider.git synced 2025-06-12 23:54:59 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

aider: Make the highlight image max 200px wide and position it to the left of the excerpt in blog post entries.

Browse source 
# Aider chat conversation:

USER: make the highlight image be max 200px wide and make it be to the left of the excerpt

ASSISTANT: Here are the diffs for the requested changes:

```diff
--- blog/index.html
+++ blog/index.html
@@ ... @@
   {% for post in site.posts %}
     <article class="post">
       <h1><a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></h1>
-      {% if post.highlight_image %}
-      <div class="post-highlight">
-        <img src="{{ site.baseurl }}{{ post.highlight_image }}" alt="Highlight Image">
-      </div>
-      {% endif %}
       <div class="entry">
+        <div class="post-content">
+          {% if post.highlight_image %}
+          <div class="post-highlight">
+            <img src="{{ site.baseurl }}{{ post.highlight_image }}" alt="Highlight Image">
+          </div>
+          {% endif %}
           {% if post.excerpt %}
           {{ post.excerpt }}
           {% else %}
           {{ post.content | strip_html | truncatewords: 100 }}...
           {% endif %}
+        </div>
       </div>

       <p class="post-date">
```

```diff
--- assets/css/style.scss
+++ assets/css/style.scss
@@ ... @@
 .post {
   background: #fff;
   box-shadow: 0 2px 5px rgba(0,0,0,0.1);
   margin-bottom: 2em;
   padding: 1em;
   border-radius: 4px;
+  display: flex;
+  align-items: flex-start;
 }
 .post-date {
   color: #777;
   font-size: 0.85em;
   margin-bottom: 1em;
   display: block;
 }
+
+.post-highlight {
+  max-width: 200px;
+  margin-right: 1em;
+}
+
+.post-content {
+  flex: 1;
+}
```

These changes will make the highlight image have a maximum width of 200px and float to the left of the excerpt or content in the blog post entries. The CSS changes also include adjustments to ensure proper alignment and spacing.
This commit is contained in:
Paul Gauthier 2024-02-19 14:47:00 -08:00
parent 23f99c2691
commit 9982a5b4e2
2 changed files with 18 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

12
blog/index.html
View file

@ -6,17 +6,19 @@ layout: default
{% for post in site.posts %}
<article class="post">
<h1><a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></h1>
{% if post.highlight_image %}
<div class="post-highlight">
<img src="{{ site.baseurl }}{{ post.highlight_image }}" alt="Highlight Image">
</div>
{% endif %}
<div class="entry">
<div class="post-content">
{% if post.highlight_image %}
<div class="post-highlight">
<img src="{{ site.baseurl }}{{ post.highlight_image }}" alt="Highlight Image">
</div>
{% endif %}
{% if post.excerpt %}
{{ post.excerpt }}
{% else %}
{{ post.content | strip_html | truncatewords: 100 }}...
{% endif %}
</div>
</div>
<p class="post-date">